orbit-basic/vendor/built_in_modules/gallery/app/assets/javascripts/galleryAPI_frontend.js.erb

612 lines
21 KiB
Plaintext
Raw Normal View History

2012-08-22 17:36:39 +00:00
<%# encoding: utf-8 %>
$.extend($.expr[':'], {
'containsi': function (elem, i, match, array) {
return (elem.textContent || elem.innerText || '').toLowerCase().indexOf((match[3] || "").toLowerCase()) >= 0;
}
});
var galleryAPI = function(){
g = this;
this.urlVars = rcom.getUrlVars();
this.albumArea = $("#orbit_gallery");
this.loadArea = null;
this.tagList = $("ul#gallery_tag_list");
// this.authenticated = false;
this.initialize = function(callbackFn){
$(document).ready(function(){
bindHandlers();
var passid = null;
if(typeof g.urlVars['cat']!= "undefined"){
g.loadArea = "albums";
passid = g.urlVars['cat'];
g.loadAlbums(g.urlVars['cat']);
}else if(typeof g.urlVars['album']!= "undefined"){
g.loadArea = "images";
passid = g.urlVars['album'];
g.loadImages(g.urlVars['album']);
}else if(typeof g.urlVars['theater']!= "undefined"){
g.loadArea = "theater";
passid = g.urlVars['theater'];
g.loadTheater(g.urlVars['theater']);
}else if(typeof g.urlVars['edit']!= "undefined"){
g.loadArea = "edit";
passid = g.urlVars['edit'];
g.editAlbum(g.urlVars['edit']);
}else if(typeof g.urlVars['tag']!= "undefined"){
g.loadArea = "albums";
passid = g.urlVars['tag'];
g.loadAlbums(g.urlVars['tag']);
}else if(g.urlVars["locale"]){
g.loadArea = "albums";
g.loadAlbums("all");
}else if(g.urlVars.length == 0) {
g.loadArea = "albums";
g.loadAlbums("all");
}
if(typeof callbackFn == "function"){
callbackFn.call(this,g.loadArea,passid);
}
})
var bindHandlers = function(){
$("#filter .filter_btns a").click(function(){
if(!$(this).hasClass("active")){
$(this).addClass("active");
if(g.urlVars.length == 0)
2012-08-23 09:13:33 +00:00
window.location = "gallery?" + $(this).attr("href");
2012-08-22 17:36:39 +00:00
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,height:320,"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();
})
})
})
}
2012-08-23 09:13:33 +00:00
2012-08-22 17:36:39 +00:00
this.loadAlbums = function(id){
g.loadFooterPanel(g.loadArea,id,function(headbtn){
headbtn = $(headbtn);
headbtn.click(function(){g.makeNewAlbum();})
2012-08-29 09:12:20 +00:00
//g.albumArea.find(".rghead .rgfn").html(headbtn);
g.albumArea.find(".rghead").hide();
2012-08-22 17:36:39 +00:00
})
g.albumArea.addClass('o_gallery');
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("panel/gallery/front_end/get_albums",{cid:cids,tid:tids,"inner":true},function(categories){
$.each(categories,function(x,category){
$.each(category,function(i,album){
if(album.cover == "default")
2012-08-29 09:12:20 +00:00
var $img = $("<div class='rgalbum'><a title='"+album.description+"' href='?album="+album._id+"'><img src='../../../assets/gallery/default.jpg'/></a><span class='albumname'><a title='"+album.description+"' href='?album="+album._id+"'>"+album.name+"</a></span><span class='categoryname'><i class='icon-folder-close'></i> "+album.category_name+"</span><span class='tagnames'></span></div>");
2012-08-22 17:36:39 +00:00
else
2012-08-29 09:12:20 +00:00
var $img = $("<div class='rgalbum'><a title='"+album.description+"' href='?album="+album._id+"'><img src='"+album.cover_path+"'/></a><span class='albumname'><a title='"+album.description+"' href='?album="+album._id+"'>"+album.name+"</a></span><span class='categoryname'><i class='icon-folder-close'></i> "+album.category_name+"</span><span class='tagnames'></span></div>");
2012-08-22 17:36:39 +00:00
var tag_string = "";
for(tag in album.tag_names){
2012-08-29 09:12:20 +00:00
tag_string+= '<span class="tags">' + album.tag_names[tag] + ', </span>';
2012-08-22 17:36:39 +00:00
}
$img.find(".tagnames").html(tag_string);
g.albumArea.find("#imgholder").append($img);
})
})
// g.albumArea.find("#imgholder").append($addsign);
})
}
this.loadImages = function(id){
var panelopen = false;
g.loadFooterPanel(g.loadArea,id,function(headerPanel){
headarea = $(headerPanel);
g.albumArea.find(".rghead .rgfn").html(headarea);
2012-08-29 09:12:20 +00:00
// $('.bt-tag').click(function(){
// $(this).toggleClass("active");
// var $tag_panel = $('#tag_panel'),
// tag_panel_position = 0;
2012-08-22 17:36:39 +00:00
2012-08-29 09:12:20 +00:00
// if( $tag_panel.css('right') == '0px' ){
// tag_panel_position = -200;
// }
// $tag_panel.animate({'right':tag_panel_position}, 300);
2012-08-22 17:36:39 +00:00
2012-08-29 09:12:20 +00:00
// g.albumArea
// .delay(200)
// .animate({'margin-right':tag_panel_position+200},300);
// return false;
// });
// g.albumArea.find("#tag_search_box").keyup(function(e){
// sval = $(this).val();
// if(sval == "<%= I18n.t('gallery.search_tags') %>")
// sval = "";
// sval = sval.replace(/(^\s*)|(\s*$)/g,'');
// if(sval){
// var re1 = new RegExp("^[\u4E00-\uFA29]*$"); //Chinese character range
// var re2 = new RegExp("^[\uE7C7-\uE7F3]*$");
// if ((re1.test(sval) && (re2.test(sval)))){
// $("#gallery_tag_list li span:not(:contains("+sval+"))").parent().slideUp();
// }else{
// $("#gallery_tag_list li span:not(:containsi("+sval+"))").parent().slideUp();
// }
// }else{
// $("#gallery_tag_list li").slideDown();
// }
// })
// g.albumArea.find("#tag_panel .bt-save").click(function(){
// g.saveTags(id,g.loadArea);
// })
// g.albumArea.find(".rghead .rgfn .bt-add").click(function(){
// showUploadPanel();
// })
// g.albumArea.find(".rghead .rgfn .bt-del").click(function(){
// g.deleteAlbum(id);
// })
2012-08-22 17:36:39 +00:00
})
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="294" frameborder="0" src="upload_panel"></iframe>');
uploadpanel.find(".bt-cls").click(function(){
uploadpanel.hide("slide");
frame.remove();
g.loadImages(id);
panelopen = false;
})
var showUploadPanel = function(){
if(!panelopen){
uploadpanel.prepend(frame);
uploadpanel.show("slide");
panelopen = true;
}
}
g.albumArea.addClass('o_album');
2012-08-29 09:12:20 +00:00
// g.albumArea.find(".rghead .rgfn").append(uploadpanel);
2012-08-22 17:36:39 +00:00
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();})
2012-08-23 09:13:33 +00:00
$.getJSON("panel/gallery/front_end/get_images",{aid:id,"inner":true},function(album){
2012-08-22 17:36:39 +00:00
$.each(album.images,function(i,image){
var thumb = image.file.thumb.url;
var $img = $("<div class='rgphoto'><a title='"+image.description+"' href='?theater="+image._id+"'><img src='"+thumb+"'/></a></div>");
g.albumArea.find("#imgholder").append($img);
})
2012-08-29 09:12:20 +00:00
// g.tagList.find("input").attr("checked",false);
2012-08-22 17:36:39 +00:00
$.each(album.tags,function(i,tag){
2012-08-29 09:12:20 +00:00
// g.tagList.find("li[data-content="+tag+"] input").attr("checked",true);
2012-08-22 17:36:39 +00:00
})
// g.albumArea.find("#imgholder").append($addsign);
})
// g.albumArea.find("#imgholder").append($addsign);
// tag
}
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%");
$('.bt-tag').click(function(){
if(!$(this).hasClass("active"))
updatePhotoTag();
$(this).toggleClass("active");
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;
});
var updatePhotoTag = function(){
var tags = imageArray[imagecount].tag_ids;
g.tagList.find("input").attr("checked",false);
for(tag in tags){
g.tagList.find("li[data-content="+tags[tag]+"] input").attr("checked",true);
}
}
g.albumArea.find("#tag_search_box").keyup(function(e){
sval = $(this).val();
if(sval == "<%= I18n.t('gallery.search_tags') %>")
sval = "";
sval = sval.replace(/(^\s*)|(\s*$)/g,'');
if(sval){
var re1 = new RegExp("^[\u4E00-\uFA29]*$"); //Chinese character range
var re2 = new RegExp("^[\uE7C7-\uE7F3]*$");
if ((re1.test(sval) && (re2.test(sval)))){
$("#gallery_tag_list li span:not(:contains("+sval+"))").parent().slideUp();
}else{
$("#gallery_tag_list li span:not(:containsi("+sval+"))").parent().slideUp();
}
}else{
$("#gallery_tag_list li").slideDown();
}
})
g.albumArea.find("#tag_panel .bt-save").click(function(){
g.saveTags(imageArray[imagecount]._id,g.loadArea);
})
$(".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 .togglescreen").click(function(){
toggleFullscreen();
})
$(".slidectrl .browserfullscreen").click(function(){
browserFullScreen();
})
$slidelist.find(".list_element").click(function(){
imagecount = parseInt($(this).parent().attr("for"));
changeImage($(this));
})
$rslidenav.find(".navN").click(function(){
nextpic($(this));
})
$rslidenav.find("a.navP").click(function(){
prevpic($(this));
})
$("#nextpic").click(function(){
nextpic($(this));
})
$(document).keydown(function(e){
if (e.keyCode == 37){
prevpic($rslidenav.find(".navP"));
return false;
}
if(e.keyCode == 39){
nextpic($rslidenav.find(".navN"));
return false;
}
if(e.keyCode == 27){
toggleFullscreen();
$rslide.removeClass('browserFullScreen');
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);
$rslide.addClass('browserFullScreen');
}
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 .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 .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);
if($('.bt-tag').hasClass("active"))
updatePhotoTag();
$(".slideinfo .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;
}
$(".navN").attr({"href":"orbit_gallery?theater="+imageArray[next]._id,"data-content":imageArray[next].file.url});
$(".navP").attr({"href":"orbit_gallery?theater="+imageArray[prev]._id,"data-content":imageArray[prev].file.url});
};
if(imageArray.length > 1)
updateNavigation();
}
var preparestage = function(albumid){
2012-08-23 09:13:33 +00:00
$.getJSON("panel/gallery/front_end/get_images",{aid:albumid,"inner":true},function(album){
2012-08-22 17:36:39 +00:00
imageArray = eval(album.images);
$.each(album.images,function(i,image){
if(image._id == id)
imagecount = i;
})
bindHandlers();
})
}
2012-08-23 09:13:33 +00:00
g.albumArea.find("#imgholder").load("panel/gallery/front_end/theater?pic="+id+"&inner=true",function(theater,response,xhr){
2012-08-22 17:36:39 +00:00
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");
g.loadFooterPanel(g.loadArea,id,function(head){
head = $(head);
g.albumArea.find(".rghead .rgfn").html(head);
2012-08-23 13:30:37 +00:00
g.albumArea.find(".bt-back").attr("href","gallery?album="+albumid);
2012-08-22 17:36:39 +00:00
})
g.albumArea.css("margin-bottom","0");
picHeight = $(window).height() - ($("#orbit-bar").outerHeight() + $("#orbit_gallery .form-actions").outerHeight());
preparestage(albumid);
});
}
this.editAlbum = function(id){
var bindHandlers = function(){
$(".nav .nav-tabs a").click(function(){
$(".tab_content .tab-pane").hide();
})
$(".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 btn-danger active")
.find('span').toggleClass('icon-white');
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 .en .txtchange").each(function(){
// var thisid = $(this).attr("for");
// dataArray.push({"id":thisid,"text":{"en":$(this).val(),"zh_tw":$(".description_loader .zh_tw .txtchange[for="+thisid+"]").val()}});
// })
// var albumnm = Array();
// $(".albumname_edit .txtchange").each(function(){
// albumnm.push($(this).val())
// })
// var dataArray = $("form#edit_album").serialize();
// $.post("update_album",{"data":dataArray},function(){
// })
})
$('.bt-tag').click(function(){
$(this).toggleClass("active");
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;
});
g.albumArea.find("#tag_search_box").keyup(function(e){
sval = $(this).val();
if(sval == "<%= I18n.t('gallery.search_tags') %>")
sval = "";
sval = sval.replace(/(^\s*)|(\s*$)/g,'');
if(sval){
var re1 = new RegExp("^[\u4E00-\uFA29]*$"); //Chinese character range
var re2 = new RegExp("^[\uE7C7-\uE7F3]*$");
if ((re1.test(sval) && (re2.test(sval)))){
$("#gallery_tag_list li span:not(:contains("+sval+"))").parent().slideUp();
}else{
$("#gallery_tag_list li span:not(:containsi("+sval+"))").parent().slideUp();
}
}else{
$("#gallery_tag_list li").slideDown();
}
})
g.albumArea.find("#tag_panel .bt-save").click(function(){
g.saveTags(imageArray[imagecount]._id,g.loadArea);
})
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.addClass('o_album_edit');
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();
})
}
this.saveTags = function(id,tagsfor){
var tagids = new Array();
g.tagList.find("li input:checked").each(function(){
tagids.push($(this).parent().attr("data-content"));
})
var tag = null;
if(g.loadArea == "images")
tag = "album";
else if(g.loadArea == "theater")
tag = "pic";
$.post("save_tags",{"id":id,"tag":tag,"tids":tagids},function(){
})
}
}
galleryAPI.prototype.locale = "en";