added reordering of images

This commit is contained in:
Harry Bomrah 2015-04-16 20:07:54 +08:00
parent 2b0deb2244
commit 7e432bd1ed
10 changed files with 83 additions and 17 deletions

View File

@ -34,6 +34,10 @@ $(function () {
$(function() {
var $container = $('.gallery'),
$containerData = $container.data();
$container.data("order-edit","0");
$container.sortable({
disabled: true
});
$container.imagesLoaded(function(){
var $albumname = $('.albumname'),
$img = $('.rgalbum img');
@ -146,11 +150,11 @@ $(function() {
}
if($("#imgholder").length){
$('.open').pageslide({
loadComplete: function(instance,elem) {
bindEvent(instance,elem);
}
})
$('.open').pageslide({
loadComplete: function(instance,elem) {
bindEvent(instance,elem);
}
})
}
@ -215,6 +219,32 @@ $(function() {
$('.rgalbum').removeClass('active');
$('.deletephoto, .deselect, .addtags').removeClass('hide')
});
var images_order = [];
$("#edit-order-btn").on("click",function(){
var el = $(this);
if($container.data("order-edit") == "0"){
$container.sortable("enable");
$(".order-edit-notification").slideDown();
images_order = $container.sortable( "toArray", { attribute: "data-image-id" });
$container.data("order-edit","1");
el.text("Save Order");
}else{
var temp = $container.sortable( "toArray", { attribute: "data-image-id" });
if(images_order.toString() != temp.toString()){
$.ajax({
url : "/admin/galleries/order",
data : {"imageids" : temp },
type : "post",
dataType : "json"
})
}
$(".order-edit-notification").slideUp();
$container.sortable("disable");
$container.data("order-edit","0");
el.text("Edit Order");
}
return false;
})
//
$('.add-imgs').on({
@ -223,11 +253,13 @@ $(function() {
if(!$(this).is(':hidden')) {
$('.add-imgs').html('<i class="icons-cross-2"></i> Close panel');
$('.rgbody').stop(true, false).animate({'padding-bottom': 280}, 300);
$("#edit-order-btn").hide();
} else {
$('.add-imgs').html('<i class="icons-plus"></i> Add Image');
$('.files').empty()
$('#file-list').checkListLength();
$('.rgbody').stop(true, false).animate({'padding-bottom': 0}, 300);
$("#edit-order-btn").show();
fetchNewImages();
};
});

View File

@ -17,7 +17,7 @@ var galleryAPI = function(){
this.loadTheater = function(id){
g.loadstart();
var imageArray;
var imageArray = [];
var imagecount = 0;
var picHeight = 0;
var bindHandlers = function(){
@ -255,8 +255,9 @@ var galleryAPI = function(){
var preparestage = function(albumid){
$.getJSON("../galleries/"+albumid+"/imgs",function(album){
imageArray = eval(album.images);
// imageArray = eval(album.images);
$.each(album.images,function(i,image){
imageArray.push(image)
if(image._id == id)
imagecount = i;
})

View File

@ -518,4 +518,17 @@
}
#fileupload #file-list .action-bnt {
text-align: right;
}
.order-edit-notification{
background-color: #ffffd5;
display: none;
height: 25px;
margin-left: 40%;
position: fixed;
text-align: center;
margin-top: 5px;
top: 85px;
width: 250px;
font-size: 13px;
}

View File

@ -10,7 +10,7 @@ class Admin::GalleriesController < OrbitAdminController
def show
@album = Album.find(params[:id])
@images = @album.album_images
@images = @album.album_images.asc(:order)
image_content = []
@images.each do |image|
image_content << {"id" => image.id.to_s, "description" => image.description_translations,"tags" => image.tags.collect{|t| t.id.to_s}}
@ -127,7 +127,7 @@ class Admin::GalleriesController < OrbitAdminController
def imgs
@album = Album.find(params[:gallery_id])
@tag_names = Array.new
@images = @album.album_images.all
@images = @album.album_images.asc(:order)
@output = Array.new
@images.each do |values|
@output << { _id: values.id.to_s,
@ -136,6 +136,7 @@ class Admin::GalleriesController < OrbitAdminController
title: values.title,
file: values.file.as_json[:file],
gallery_album_id: values.album_id,
order: values.order,
tags: values.tags}
end
render :json=>{"images" => @output, "tags" => @album.tags}.to_json

View File

@ -4,9 +4,21 @@ class Admin::ImagesController < OrbitAdminController
@image = AlbumImage.find(params[:id])
@albumid = @image.album_id
@album = Album.find(@albumid)
@images = @album.album_images.all
@images = @album.album_images.asc(:order)
end
def changeorder
images = params[:imageids]
images.each_with_index do |image, i|
img = AlbumImage.find(image) rescue nil
if !img.nil?
img.order = i
img.save
end
end
render :json => {"success" => true}.to_json
end
def delete_photos
images = params['images']
images.each do |image|

View File

@ -20,7 +20,7 @@ class GalleriesController < ApplicationController
def show
params = OrbitHelper.params
album = Album.find_by_param(params[:uid])
images = album.album_images.collect do |a|
images = album.album_images.asc(:order).collect do |a|
{
"image-description" => a.description,
"link_to_show" => "/" + I18n.locale.to_s + params[:url] + "/-" + a.id.to_s + "?method=theater",
@ -69,7 +69,7 @@ class GalleriesController < ApplicationController
def imgs(album_id)
album = Album.find(album_id)
tag_names = Array.new
images = album.album_images.all
images = album.album_images.asc(:order)
output = Array.new
images.each do |values|
output << { _id: values.id.to_s,
@ -87,7 +87,7 @@ class GalleriesController < ApplicationController
image = AlbumImage.find(params[:uid])
albumid = image.album_id
album = Album.find(albumid)
images = album.album_images.all
images = album.album_images.asc(:order)
{
"album" => album,
"images" => images,

View File

@ -8,6 +8,7 @@ class AlbumImage
field :title
field :description, localize: true
field :rss2_id, type: String
field :order, type: Integer, default: 0
# has_and_belongs_to_many :tags, :class_name => "GalleryTag"

View File

@ -9,6 +9,7 @@
<% end %>
<% content_for :page_specific_javascript do %>
<%= javascript_include_tag "lib/jquery-ui-1.10.0.custom.min" %>
<%= javascript_include_tag "jquery.masonry.min.js" %>
<%= javascript_include_tag "jquery.lite.image.resize.js" %>
<%= javascript_include_tag "gallery" %>

View File

@ -1,6 +1,7 @@
<%= stylesheet_link_tag "gallery" %>
<%= stylesheet_link_tag "lib/tags-groups" %>
<% content_for :page_specific_css do %>
<%= stylesheet_link_tag "gallery" %>
<%= stylesheet_link_tag "lib/tags-groups" %>
<% end %>
<!-- <div class="topnav clearfix">
<ul class="breadcrumb text-info pull-left">
<li><a href="/orbit_4.0.1/admin/dashboards/dashboards.shtml">Dashboard</a> <span class="divider">/</span></li>
@ -9,6 +10,7 @@
</ul>
</div> -->
<!-- Bottom Nav -->
<div class="order-edit-notification">Images re-ordering enabled.</div>
<div class="bottomnav clearfix">
<div class="action pull-left">
<a href="<%= admin_galleries_path %>" class="btn btn-small"><i class="icons-back"></i> Back</a>
@ -19,6 +21,7 @@
<a href="#dialog" data-toggle="modal" class="btn btn-warning btn-small deletephoto hide"><i class="icons-cross-3"></i> Delete Photo</a>
<a href="#view-photo-tags" class="btn btn-primary btn-small addtags open hide" for="batch"><i class="icons-tag"></i> Add Tags</a>
<a href="<%= edit_admin_gallery_path(@album.id) %>" class="btn btn-small btn-success"><i class="icon-edit"></i> Edit</a>
<a href="#" class="btn btn-small btn-info" id="edit-order-btn">Edit Order</a>
<b class="divider"></b>
<a href="#" class="add-imgs btn btn-small btn-primary"><i class="icons-plus"></i> Add Image</a>
@ -169,6 +172,7 @@
</script>
<% content_for :page_specific_javascript do %>
<%= javascript_include_tag "lib/jquery-ui-1.10.0.custom.min" %>
<%= javascript_include_tag "jquery.masonry.min.js" %>
<%= javascript_include_tag "jquery.lite.image.resize.js" %>
<%= javascript_include_tag "lib/checkbox.card" %>

View File

@ -17,8 +17,9 @@ Rails.application.routes.draw do
post "galleries/delete_photos" => "images#delete_photos"
post "galleries/update_image" => "images#update_image"
post "galleries/image_tagging" => "images#image_tagging"
post "galleries/order" => "images#changeorder"
# match "image_tagging" => "album_images#image_tagging"
end
end
end