472 lines
17 KiB
Plaintext
472 lines
17 KiB
Plaintext
<%# encoding: utf-8 %>
|
|
var galleryAPI = function(){
|
|
g = this;
|
|
this.urlVars = rcom.getUrlVars();
|
|
this.albumArea = $("#orbit_gallery");
|
|
this.loadArea = "";
|
|
// this.authenticated = false;
|
|
this.initialize = function(){
|
|
$(document).ready(function(){
|
|
bindHandlers();
|
|
if(typeof g.urlVars['cat']!= "undefined"){
|
|
g.loadAlbums(g.urlVars['cat']);
|
|
g.loadArea = "albums";
|
|
}else if(typeof g.urlVars['album']!= "undefined"){
|
|
g.loadImages(g.urlVars['album']);
|
|
g.loadArea = "images";
|
|
}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 if(typeof g.urlVars['tag']!= "undefined"){
|
|
g.loadAlbums(g.urlVars['tag']);
|
|
g.loadArea = "albums";
|
|
}else{
|
|
g.loadAlbums("all");
|
|
g.loadArea = "albums";
|
|
}
|
|
})
|
|
var bindHandlers = function(){
|
|
$("#filter .filter_btns a").click(function(){
|
|
if(!$(this).hasClass("active")){
|
|
$(this).addClass("active");
|
|
if(g.urlVars.length == 0)
|
|
window.location = "orbit_gallery?" + $(this).attr("href");
|
|
else
|
|
window.location = window.location.href +"&"+ $(this).attr("href");
|
|
}else{
|
|
$(this).removeClass("active");
|
|
var loc = window.location.href;
|
|
var url = loc.replace($(this).attr("href")+"&","");
|
|
if(url == loc)
|
|
url = loc.replace($(this).attr("href"),"");
|
|
|
|
if(url.charAt(url.length-1)=="&" || url.charAt(url.length-1)=="?")
|
|
url = url.substr(0,url.length-1);
|
|
window.location = url;
|
|
}
|
|
})
|
|
}
|
|
$("#filter .filter-clear a").click(function(){
|
|
var loc = window.location.href;
|
|
var url = null;
|
|
var forwhat = $(this).attr("for");
|
|
$("#filter ."+forwhat+" a.active").each(function(){
|
|
$(this).removeClass("active");
|
|
url = loc.replace($(this).attr("href")+"&","");
|
|
if(url == loc)
|
|
url = loc.replace($(this).attr("href"),"");
|
|
|
|
if(url.charAt(url.length-1)=="&" || url.charAt(url.length-1)=="?")
|
|
url = url.substr(0,url.length-1);
|
|
loc = url;
|
|
})
|
|
window.location = url;
|
|
})
|
|
}
|
|
this.makeNewAlbum = function(){
|
|
$.get("add_album",function(html){
|
|
rcom.modalWindow({loadHtml:html,width:400,"closeBtn":false},function(dom){
|
|
dom.find("#album_name_save_btn").click(function(){
|
|
var options ={
|
|
cid : dom.find("select#category_list").val(),
|
|
albumname : {
|
|
"en" : dom.find("#name_en").val(),
|
|
"zh_tw" : dom.find("#name_zh_tw").val()
|
|
},
|
|
albumdesc : {
|
|
"en" : dom.find("#desc_en").val(),
|
|
"zh_tw" : dom.find("#desc_zh_tw").val()
|
|
}
|
|
}
|
|
if(options.cid){
|
|
$.post("create_album",options,function(response){
|
|
if(g.loadArea == "albums")
|
|
g.loadAlbums("all");
|
|
rcom.modalWindowClose();
|
|
})
|
|
}
|
|
})
|
|
dom.find("#album_name_close_btn").click(function(){
|
|
rcom.modalWindowClose();
|
|
})
|
|
})
|
|
|
|
})
|
|
}
|
|
this.deleteAlbum = function(id){
|
|
if(confirm("<%= I18n.t('gallery.del_album?') %>")){
|
|
$.post("delete_album",{aid:id},function(){
|
|
window.location = "orbit_gallery";
|
|
})
|
|
}
|
|
}
|
|
|
|
this.loadAlbums = function(id){
|
|
var headbtn = $('<a class="btn btn-primary pull-right" title="<%= I18n.t("gallery.add_album") %>" href="albums" onclick="return false;"><i class="icon-plus icon-white"></i><%= I18n.t("gallery.add_album") %></a>');
|
|
headbtn.click(function(){g.makeNewAlbum();})
|
|
g.albumArea.find(".rghead .rgfn").html(headbtn);
|
|
g.albumArea.find("#imgholder").empty();
|
|
var $addsign = $('<div class="rgalbum"><a id="global_add" class="rgui bt-addnew" href="add" onclick="return false;">Add Album</a></div>');
|
|
$addsign.find("a").click(function(){g.makeNewAlbum();})
|
|
|
|
if(id!="all"){
|
|
var cids = [];
|
|
var tids = [];
|
|
var href = null;
|
|
var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
|
|
for(var i = 0; i < hashes.length; i++){
|
|
hash = hashes[i].split('=');
|
|
if(hash[0]=="cat"){
|
|
cids.push(hash[1]);
|
|
href = "cat="+hash[1];
|
|
}else if(hash[0]=="tag"){
|
|
tids.push(hash[1]);
|
|
href = "tag="+hash[1];
|
|
}
|
|
$("#filter .filter_btns a[href='"+href+"']").addClass("active");
|
|
}
|
|
if(cids.length == 0)
|
|
cids = "all";
|
|
}else{
|
|
var cids = "all";
|
|
}
|
|
$.getJSON("get_albums",{cid:cids,tid:tids},function(categories){
|
|
$.each(categories,function(x,category){
|
|
$.each(category,function(i,album){
|
|
if(album.cover == "default")
|
|
var $img = $("<div class='rgalbum'><a title='"+album.description+"' href='?album="+album._id+"'><img src='../../../assets/gallery/default.jpg' width='120px' height='90px'/></a><span class='albumname'>"+album.name+"</span></div>");
|
|
else
|
|
var $img = $("<div class='rgalbum'><a title='"+album.description+"' href='?album="+album._id+"'><img src='"+album.cover_path+"' width='120px' height='90px'/></a><span class='albumname'>"+album.name+"</span></div>");
|
|
g.albumArea.find("#imgholder").append($img);
|
|
})
|
|
})
|
|
g.albumArea.find("#imgholder").append($addsign);
|
|
})
|
|
}
|
|
this.loadImages = function(id){
|
|
|
|
var headarea = '<a class="bt-back btn pull-left" title="<%= I18n.t("gallery.back_to_albums") %>" href="orbit_gallery"><i class="icon-arrow-left icon-black"></i><%= I18n.t("gallery.back_to_albums") %></a> ';
|
|
headarea+='<a class="bt-add btn btn-primary pull-right" title="<%= I18n.t("gallery.add_images") %>" href="images" onclick="return false;"><i class="icon-plus icon-white"></i><%= I18n.t("gallery.add_images") %></a> ';
|
|
headarea+='<a class="bt-del btn btn-primary pull-right" title="<%= I18n.t("gallery.del_album") %>" href="delete" onclick="return false;"><i class="icon-trash icon-white"></i><%= I18n.t("gallery.del_album") %></a> ';
|
|
headarea+='<a class="bt-edit btn btn-primary pull-right" title="<%= I18n.t("gallery.edit") %>" href="orbit_gallery?edit='+id+'" ><i class="icon-pencil icon-white"></i><%= I18n.t("gallery.edit") %></a>';
|
|
headarea+='<a class="bt-tag btn btn-primary pull-right" title="<%= I18n.t("gallery.album_tag") %>" href="" ><i class="icon-tag icon-white"></i><%= I18n.t("gallery.album_tag") %></a>';
|
|
headarea = $(headarea);
|
|
var uploadpanel = $('<div id="upload_panel_holder"><div class="rgfn"><a class="bt-cls btn btn-primary pull-right" title="Close" href="" onclick="return false;"><i class="icon-remove icon-white"></i>Close Panel</a></div></div>');
|
|
var frame = $('<iframe id="upload_panel" width="100%" scrolling="no" height="200" frameborder="0" src="upload_panel"></iframe>');
|
|
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();
|
|
g.loadImages(id);
|
|
panelopen = false;
|
|
})
|
|
var panelopen = false;
|
|
var showUploadPanel = function(){
|
|
if(!panelopen){
|
|
uploadpanel.prepend(frame);
|
|
uploadpanel.show("slide");
|
|
panelopen = true;
|
|
}
|
|
}
|
|
|
|
g.albumArea.find(".rghead .rgfn").append(uploadpanel);
|
|
g.albumArea.find("#imgholder").empty();
|
|
$("#filter").remove();
|
|
g.albumArea.css("margin-top","");
|
|
var $addsign = $('<div class="rgalbum"><a id="global_add" class="rgui bt-addnew" href="add" onclick="return false;">Add Album</a></div>');
|
|
$addsign.find("a").click(function(){showUploadPanel();})
|
|
$.getJSON("get_images",{aid:id},function(images){
|
|
$.each(images,function(i,image){
|
|
var thumb = image.file.thumb.url;
|
|
var $img = $("<div class='rgalbum'><a title='"+image.description+"' href='?theater="+image._id+"'><img src='"+thumb+"'/></a></div>");
|
|
g.albumArea.find("#imgholder").append($img);
|
|
})
|
|
g.albumArea.find("#imgholder").append($addsign);
|
|
})
|
|
g.albumArea.find("#imgholder").append($addsign);
|
|
|
|
|
|
// tag
|
|
$('.bt-tag').click(function(){
|
|
var $tag_panel = $('#tag_panel'),
|
|
tag_panel_position = 0;
|
|
|
|
if( $tag_panel.css('right') == '0px' ){
|
|
tag_panel_position = -200;
|
|
}
|
|
$tag_panel.animate({'right':tag_panel_position}, 300);
|
|
|
|
g.albumArea
|
|
.delay(200)
|
|
.animate({'margin-right':tag_panel_position+200},300);
|
|
return false;
|
|
});
|
|
|
|
|
|
}
|
|
this.loadTheater = function(id){
|
|
var imageArray;
|
|
var imagecount = 0;
|
|
var picHeight = 0;
|
|
var bindHandlers = function(){
|
|
var $slidelist = $('.slidelist'),
|
|
$rslide = $('.rslide'),
|
|
$rslidenav = $('.rslidenav'),
|
|
$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 ){
|
|
$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();
|
|
})
|
|
$(".slidectrl a.browserfullscreen").click(function(){
|
|
browserFullScreen();
|
|
})
|
|
$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;
|
|
}
|
|
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;
|
|
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");
|
|
$(".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.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);
|
|
if(imageArray.length > 1)
|
|
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});
|
|
};
|
|
if(imageArray.length > 1)
|
|
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 = $('<a href="" class="bt-back btn pull-left" title="<%= I18n.t("gallery.back_to_photos") %>"><i class="icon-arrow-left icon-black"></i><%= I18n.t("gallery.back_to_photos") %></a></div>');
|
|
var head1 = $('<a class="bt-edit btn btn-primary pull-right" title="<%= I18n.t("gallery.edit") %>" href="" ><i class="icon-pencil icon-white"></i><%= I18n.t("gallery.edit") %></a>');
|
|
var head2 = $('<a class="bt-tag btn btn-primary pull-right" title="<%= I18n.t("gallery.photo_tag") %>" href="" ><i class="icon-tag icon-white"></i><%= I18n.t("gallery.photo_tag") %></a>');
|
|
g.albumArea.find("#imgholder").load("theater?pic="+id,function(theater,response,xhr){
|
|
if(xhr.status == 404){
|
|
$(this).text("<%= I18n.t('gallery.pic_not_found') %>.");
|
|
return false;
|
|
}
|
|
$("#filter").remove();
|
|
g.albumArea.css("margin-top","");
|
|
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,head2);
|
|
picHeight = $(window).height() - ($("#orbit-bar").outerHeight() + $("#orbit_gallery .rghead").outerHeight());
|
|
preparestage(albumid);
|
|
|
|
|
|
// tag
|
|
$('.bt-tag').click(function(){
|
|
var $tag_panel = $('#tag_panel'),
|
|
tag_panel_position = 0;
|
|
|
|
if( $tag_panel.css('right') == '0px' ){
|
|
tag_panel_position = -200;
|
|
}
|
|
$tag_panel.animate({'right':tag_panel_position}, 300);
|
|
|
|
g.albumArea
|
|
.delay(200)
|
|
.animate({'margin-right':tag_panel_position+200},300);
|
|
return false;
|
|
});
|
|
});
|
|
}
|
|
|
|
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()});
|
|
})
|
|
albumnm = $(".albumname_edit #album_name_text").val();
|
|
$.post("update_album",{data:dataArray,"aid":id,"name":albumnm},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();})
|
|
}
|
|
}
|
|
g.albumArea.find(".rghead .rgfn .bt-delete").hide();
|
|
})
|
|
}
|
|
})
|
|
}
|
|
$("#filter").remove();
|
|
g.albumArea.css("margin-top","");
|
|
var head ='<a href="orbit_gallery?album='+id+'" class="bt-back btn pull-left" title="<%= I18n.t("gallery.back_to_photos") %>"><i class="icon-arrow-left icon-black"></i><%= I18n.t("gallery.back_to_photos") %></a></div>';
|
|
head+='<a class="bt-del bt-delete btn btn-primary pull-right" onclick="return false;" style="display:none;" title="<%= I18n.t("gallery.delete_selected") %>" href=""><i class="icon-trash icon-white"></i><%= I18n.t("gallery.delete_selected") %></a>';
|
|
head+='<a class="bt-save btn btn-primary pull-right" onclick="return false;" style="display:none;" title="Save" href=""><i class="icon-ok icon-white"></i>Save</a>';
|
|
g.albumArea.find(".rghead .rgfn").html(head);
|
|
g.albumArea.find("#imgholder").load("edit_album?aid="+id,function(data,response,xhr){
|
|
if(xhr.status == 404){
|
|
$(this).text("<%= I18n.t('gallery.album_not_found') %>");
|
|
return false;
|
|
}
|
|
bindHandlers();
|
|
})
|
|
}
|
|
}
|
|
|