From 929cd3b0ccea9ad84689f0c941320949f751fb8e Mon Sep 17 00:00:00 2001 From: Harry Bomrah Date: Sun, 29 Jul 2012 18:52:30 +0800 Subject: [PATCH 1/2] Gallery update.. --- app/uploaders/gallery_uploader.rb | 2 +- .../app/assets/javascripts/galleryAPI.js | 238 +++++++++++++++++- .../app/assets/stylesheets/gallery.css | 8 +- .../back_end/orbit_galleries_controller.rb | 49 +++- .../gallery/app/models/gallery_album.rb | 3 +- .../orbit_galleries/edit_album.html.erb | 24 ++ .../back_end/orbit_galleries/theater.html.erb | 35 +-- .../built_in_modules/gallery/config/routes.rb | 5 + 8 files changed, 324 insertions(+), 40 deletions(-) create mode 100644 vendor/built_in_modules/gallery/app/views/panel/gallery/back_end/orbit_galleries/edit_album.html.erb diff --git a/app/uploaders/gallery_uploader.rb b/app/uploaders/gallery_uploader.rb index 773d86d89..8f04cc2fa 100644 --- a/app/uploaders/gallery_uploader.rb +++ b/app/uploaders/gallery_uploader.rb @@ -35,7 +35,7 @@ class GalleryUploader < CarrierWave::Uploader::Base # end version :thumb do - process :resize_to_fit => [120, 90] + process :resize_to_fill => [120, 90] end # Add a white list of extensions which are allowed to be uploaded. diff --git a/vendor/built_in_modules/gallery/app/assets/javascripts/galleryAPI.js b/vendor/built_in_modules/gallery/app/assets/javascripts/galleryAPI.js index 0eb8e6d77..37db6b924 100644 --- a/vendor/built_in_modules/gallery/app/assets/javascripts/galleryAPI.js +++ b/vendor/built_in_modules/gallery/app/assets/javascripts/galleryAPI.js @@ -15,6 +15,9 @@ var galleryAPI = function(){ }else if(typeof g.urlVars['theater']!= "undefined"){ g.loadTheater(g.urlVars['theater']); g.loadArea = "theater"; + }else if(typeof g.urlVars['edit']!= "undefined"){ + g.editAlbum(g.urlVars['edit']); + g.loadArea = "edit"; }else{ g.loadAlbums("all"); g.loadArea = "albums"; @@ -97,6 +100,14 @@ var galleryAPI = function(){ }) } + this.deleteAlbum = function(id){ + if(confirm("Delete this Album?")){ + $.post("delete_album",{aid:id},function(){ + window.location = "orbit_gallery"; + }) + } + } + this.loadAlbums = function(id){ var headbtn = $('Add Album'); headbtn.click(function(){g.makeNewAlbum();}) @@ -106,7 +117,10 @@ var galleryAPI = function(){ $addsign.find("a").click(function(){g.makeNewAlbum();}) $.getJSON("get_albums",{cid:id},function(albums){ $.each(albums,function(i,album){ - var $img = $("
"+album.name+"
"); + if(album.cover == "default") + var $img = $("
"+album.name+"
"); + else + var $img = $("
"+album.name+"
"); g.albumArea.find("#imgholder").append($img); }) g.albumArea.find("#imgholder").append($addsign); @@ -115,13 +129,20 @@ var galleryAPI = function(){ this.loadImages = function(id){ //'); - headarea.find("a.bt-add").click(function(){ + g.albumArea.find(".rghead .rgfn").html(headarea); + g.albumArea.find(".rghead .rgfn a.bt-add").click(function(){ showUploadPanel(); }) + g.albumArea.find(".rghead .rgfn a.bt-del").click(function(){ + g.deleteAlbum(id); + }) uploadpanel.find("a.bt-cls").click(function(){ uploadpanel.hide("slide"); frame.remove(); @@ -136,7 +157,7 @@ var galleryAPI = function(){ panelopen = true; } } - g.albumArea.find(".rghead .rgfn").html(headarea); + g.albumArea.find(".rghead .rgfn").append(uploadpanel); g.albumArea.find("#imgholder").empty(); var $addsign = $('
Add Album
'); @@ -153,13 +174,216 @@ var galleryAPI = function(){ } this.loadTheater = function(id){ - var head = $('Back to photos
Gallery
'); - g.albumArea.find("#imgholder").load("theater?pic="+id,function(theater){ + var imageArray; + var imagecount = 0; + var picHeight = 0; + var bindHandlers = function(){ + var $slidelist = $('.slidelist'), + $rslide = $('.rslide'), + $rslidenav = $('.rslidenav'), + $img = $("#main_pic img"); + $(".slidectrl a.togglelist").click(function(){ + var rslide_h = $rslide.outerHeight(); + if ( $slidelist.height() < 1 ){ + $slidelist.stop().animate({'height':rslide_h - 30}, 300); + $slidelist.find("ul").show(); + } else { + $slidelist.stop().animate({'height':'0px'}, 300); + $slidelist.find("ul").hide(); + } + }) + $(".slidectrl a.togglescreen").click(function(){ + toggleFullscreen(); + }) + $slidelist.find("a.list_element").click(function(){ + imagecount = parseInt($(this).parent().attr("for")); + changeImage($(this)); + }) + $rslidenav.find("a.navN").click(function(){ + nextpic($(this)); + }) + $rslidenav.find("a.navP").click(function(){ + prevpic($(this)); + }) + $("a#nextpic").click(function(){ + nextpic($(this)); + }) + + $(document).keydown(function(e){ + if (e.keyCode == 37){ + prevpic($rslidenav.find("a.navP")); + return false; + } + if(e.keyCode == 39){ + nextpic($rslidenav.find("a.navN")); + return false; + } + if(e.keyCode == 27){ + + toggleFullscreen(); + return false; + } + }); + + var nextpic = function(dom){ + if(imagecount == imageArray.length - 1) + imagecount = 0; + else + imagecount++; + changeImage(dom); + } + + var prevpic = function(dom){ + if(imagecount == 0) + imagecount = imageArray.length - 1 + else + imagecount--; + changeImage(dom); + } + + var toggleFullscreen = function(){ + if($rslide.hasClass("fullscreen")){ + $rslide.css("position","relative"); + $rslide.removeClass("fullscreen"); + $img.css({"padding":""}) + }else{ + $rslide.css("position",""); + $rslide.addClass("fullscreen"); + $img.css({"padding":($rslide.height()-$img.height())/2}) + } + } + var changeImage = function(dom){ + var pageurl = dom.attr('href'); + $img.attr({"src":dom.attr("data-content"),"height":picHeight+"px"}); + if($rslide.hasClass("fullscreen")){ + $img.css({"padding":($rslide.height()-$img.height())/2}) + } + $slidelist.stop().animate({'height':'0px'}, 300); + $slidelist.find("ul").hide(); + if(pageurl!=window.location){ + window.history.pushState({path:pageurl},'',pageurl); + } + // $(".slideinfo b.info").text(imageArray[imagecount].title); + $(".slideinfo span.info").text(imageArray[imagecount].description); + updateNavigation(); + } + var updateNavigation = function(){ + var next, prev; + if(imagecount == 0){ + next = 1; + prev = imageArray.length - 1; + }else if(imagecount == imageArray.length - 1){ + next = 0 + prev = imageArray.length - 2; + }else{ + next = imagecount + 1; + prev = imagecount - 1; + } + $("a.navN").attr({"href":"orbit_gallery?theater="+imageArray[next]._id,"data-content":imageArray[next].file.url}); + $("a.navP").attr({"href":"orbit_gallery?theater="+imageArray[prev]._id,"data-content":imageArray[prev].file.url}); + }; + updateNavigation(); + } + + var preparestage = function(albumid){ + $.getJSON("get_images",{aid:albumid},function(images){ + imageArray = eval(images); + $.each(images,function(i,image){ + if(image._id == id) + imagecount = i; + }) + bindHandlers(); + }) + } + + var head = $('Back to photos'); + var head1 = $('Edit'); + g.albumArea.find("#imgholder").load("theater?pic="+id,function(theater,response,xhr){ + if(xhr.status == 404){ + $(this).text("Pic not found."); + return false; + } var albumid = $(theater).find("#main_pic").attr("data-content"); head.attr("href","orbit_gallery?album="+albumid); + head1.attr("href","orbit_gallery?edit="+albumid); g.albumArea.find(".rghead .rgfn").html(head); + g.albumArea.find(".rghead .rgfn").append(head1); + picHeight = $(window).height() - ($("#orbit-bar").outerHeight() + $("#gallery_panel").outerHeight() + $("#orbit_gallery .rghead").outerHeight()); + preparestage(albumid); }) } + + this.editAlbum = function(id){ + var bindHandlers = function(){ + $("#description_loader .edit_fn .bt-cover").click(function(){ + $(".bt-cover").removeClass("setcover"); + $(this).addClass("setcover"); + $.post("set_cover",{"imageid":$(this).attr("href"),"aid":id},function(){}) + }) + $("#description_loader .edit_fn .bt-dels").click(function(){ + $(this).toggleClass("setdelete"); + if($("#description_loader .edit_fn .setdelete").length > 0){ + g.albumArea.find(".rghead .rgfn .bt-delete").show(); + }else{ + g.albumArea.find(".rghead .rgfn .bt-delete").hide(); + } + }) + g.albumArea.find(".rghead .rgfn .bt-save").click(function(){ + var dataArray = Array(); + $("#description_loader .txtchange").each(function(){ + dataArray.push({"id":$(this).attr("for"),"text": $(this).val()}); + }) + + $.post("update_album",{data:dataArray},function(){ + + }) + }) + var tempval; + $(".txtchange").focus(function(){ + tempval = $(this).val(); + }).keyup(function(){ + if($(this).val() != tempval) + g.albumArea.find(".rghead .rgfn .bt-save").show(); + }) + g.albumArea.find(".rghead .rgfn .bt-delete").click(function(){ + var images_to_delete = new Array(); + var delete_cover = false; + var doms_to_delete = new Array(); + var thiscover = $("#description_loader .edit_fn .setcover").attr("href"); + $("#description_loader .edit_fn .bt-dels").each(function(){ + if($(this).hasClass("setdelete")){ + images_to_delete.push($(this).attr("href")); + doms_to_delete.push($(this).parent().parent()); + if(thiscover == $(this).attr("href")) + delete_cover = true; + } + }) + if(confirm("Deleting "+images_to_delete.length+" image(s)?")){ + $.post("delete_images",{"images":images_to_delete,"delete_cover":delete_cover,"aid":id},function(response){ + if(response.success){ + for(dom in doms_to_delete){ + doms_to_delete[dom].hide("slide",function(){$(this).remove();}) + } + } + }) + } + }) + } + + var head = 'Back to photos'; + head+=''; + head+='
+
+ + + +
+
+ Delete + <% if image.id.to_s == @cover %> + Set Cover + <% else %> + Set Cover + <% end %> +
+
+ <% end %> +
\ No newline at end of file diff --git a/vendor/built_in_modules/gallery/app/views/panel/gallery/back_end/orbit_galleries/theater.html.erb b/vendor/built_in_modules/gallery/app/views/panel/gallery/back_end/orbit_galleries/theater.html.erb index 5564554a5..e0a834596 100755 --- a/vendor/built_in_modules/gallery/app/views/panel/gallery/back_end/orbit_galleries/theater.html.erb +++ b/vendor/built_in_modules/gallery/app/views/panel/gallery/back_end/orbit_galleries/theater.html.erb @@ -7,38 +7,27 @@ -->
-
+
- Prev - Next + Prev + Next
- Screen - List - Share + Screen + List
- PORSCHE - + + <%= @image.description %>
\ No newline at end of file diff --git a/vendor/built_in_modules/gallery/config/routes.rb b/vendor/built_in_modules/gallery/config/routes.rb index 4c4f71ac5..d295f9138 100644 --- a/vendor/built_in_modules/gallery/config/routes.rb +++ b/vendor/built_in_modules/gallery/config/routes.rb @@ -13,6 +13,11 @@ Rails.application.routes.draw do match "upload_panel" => "orbit_galleries#upload_panel" match "get_images" => "orbit_galleries#get_images" match "theater" => "orbit_galleries#theater" + match "delete_album" => "orbit_galleries#delete_album" + match "edit_album" => "orbit_galleries#edit_album" + match "set_cover" => "orbit_galleries#set_cover" + match "delete_images" => "orbit_galleries#delete_images" + match "update_album" => "orbit_galleries#update_album" end end end From 17dffb15e1761d4f7e7d40bd95569bf4def086e0 Mon Sep 17 00:00:00 2001 From: Harry Bomrah Date: Tue, 31 Jul 2012 01:15:48 +0800 Subject: [PATCH 2/2] Major updates for gallery --- .../app/assets/javascripts/galleryAPI.js | 62 +++++++++++++------ .../app/assets/stylesheets/gallery.css | 1 + .../back_end/orbit_galleries_controller.rb | 10 +++ .../back_end/orbit_galleries/index.html.erb | 4 ++ .../back_end/orbit_galleries/theater.html.erb | 3 +- 5 files changed, 59 insertions(+), 21 deletions(-) diff --git a/vendor/built_in_modules/gallery/app/assets/javascripts/galleryAPI.js b/vendor/built_in_modules/gallery/app/assets/javascripts/galleryAPI.js index 37db6b924..c052ca178 100644 --- a/vendor/built_in_modules/gallery/app/assets/javascripts/galleryAPI.js +++ b/vendor/built_in_modules/gallery/app/assets/javascripts/galleryAPI.js @@ -181,7 +181,12 @@ var galleryAPI = function(){ var $slidelist = $('.slidelist'), $rslide = $('.rslide'), $rslidenav = $('.rslidenav'), - $img = $("#main_pic img"); + $img = $("#main_pic img"), + wHeight = $(window).height(); + + $("#main_pic").height(picHeight); + $img.height("100%"); + $(".slidectrl a.togglelist").click(function(){ var rslide_h = $rslide.outerHeight(); if ( $slidelist.height() < 1 ){ @@ -195,6 +200,9 @@ var galleryAPI = function(){ $(".slidectrl a.togglescreen").click(function(){ toggleFullscreen(); }) + $(".slidectrl a.browserfullscreen").click(function(){ + browserFullScreen(); + }) $slidelist.find("a.list_element").click(function(){ imagecount = parseInt($(this).parent().attr("for")); changeImage($(this)); @@ -219,12 +227,19 @@ var galleryAPI = function(){ return false; } if(e.keyCode == 27){ - toggleFullscreen(); return false; } + if(e.keyCode == 70 || e.keyCode == 102){ + if($rslide.hasClass("fullscreen")) + browserFullScreen(); + } }); - + var browserFullScreen = function(){ + var el = document.documentElement, + rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen; + rfs.call(el); + } var nextpic = function(dom){ if(imagecount == imageArray.length - 1) imagecount = 0; @@ -232,7 +247,6 @@ var galleryAPI = function(){ imagecount++; changeImage(dom); } - var prevpic = function(dom){ if(imagecount == 0) imagecount = imageArray.length - 1 @@ -240,32 +254,39 @@ var galleryAPI = function(){ imagecount--; changeImage(dom); } - var toggleFullscreen = function(){ if($rslide.hasClass("fullscreen")){ $rslide.css("position","relative"); $rslide.removeClass("fullscreen"); + $(".slidectrl a.browserfullscreen").hide(); $img.css({"padding":""}) + $("#main_pic").height(picHeight); }else{ + $("#main_pic").height(wHeight); + // $img.height("100%"); $rslide.css("position",""); $rslide.addClass("fullscreen"); $img.css({"padding":($rslide.height()-$img.height())/2}) + $(".slidectrl a.browserfullscreen").show(); } } var changeImage = function(dom){ var pageurl = dom.attr('href'); - $img.attr({"src":dom.attr("data-content"),"height":picHeight+"px"}); - if($rslide.hasClass("fullscreen")){ - $img.css({"padding":($rslide.height()-$img.height())/2}) - } - $slidelist.stop().animate({'height':'0px'}, 300); - $slidelist.find("ul").hide(); - if(pageurl!=window.location){ - window.history.pushState({path:pageurl},'',pageurl); - } - // $(".slideinfo b.info").text(imageArray[imagecount].title); - $(".slideinfo span.info").text(imageArray[imagecount].description); - updateNavigation(); + $img.fadeOut(200,function(){ + $img.attr({"src":dom.attr("data-content"),"height":picHeight+"px"}); + $img.fadeIn(200); + if($rslide.hasClass("fullscreen")){ + $img.css({"padding":($rslide.height()-$img.height())/2}) + } + $slidelist.stop().animate({'height':'0px'}, 300); + $slidelist.find("ul").hide(); + if(pageurl!=window.location){ + window.history.pushState({path:pageurl},'',pageurl); + } + // $(".slideinfo b.info").text(imageArray[imagecount].title); + $(".slideinfo span.info").text(imageArray[imagecount].description); + updateNavigation(); + }) } var updateNavigation = function(){ var next, prev; @@ -333,8 +354,8 @@ var galleryAPI = function(){ $("#description_loader .txtchange").each(function(){ dataArray.push({"id":$(this).attr("for"),"text": $(this).val()}); }) - - $.post("update_album",{data:dataArray},function(){ + albumnm = $(".albumname_edit #album_name_text").val(); + $.post("update_album",{data:dataArray,"aid":id,"name":albumnm},function(){ }) }) @@ -365,15 +386,16 @@ var galleryAPI = function(){ doms_to_delete[dom].hide("slide",function(){$(this).remove();}) } } + g.albumArea.find(".rghead .rgfn .bt-delete").hide(); }) } }) } - var head = 'Back to photos'; head+=''; head+=' @@ -25,6 +25,7 @@
Screen List + F
<%= @image.description %>