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

var galleryAPI = function(){
	g = this;
	this.urlVars = rcom.getUrlVars();
	this.albumArea = $("#orbit_gallery");
	this.loadArea = "";
	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{
				g.loadAlbums("all");
				g.loadArea = "albums";
			}
		})
		var bindHandlers = function(){
			$("#gallery_panel a.btn").click(function(){
				switch ($(this).attr("href")){
					case "categories":
					g.initializeCategories();
					break;
				}
			});
			$("select#category_filter").change(function(){
				var val = $(this).val();
				window.location = "orbit_gallery?cat="+val;
			})
		}
	}

	this.initializeCategories = function(){
		var deleteCategory = function(a){
			var cid = a.attr("href");
			$.post("gallery_category_delete",{id:cid},function(response){
				if(response.success)
					a.parent().hide("slide",function(){a.parent().remove();})
			})
		}

		$.get("categorylist",function(html){
			rcom.modalWindow({loadHtml:html,width:"400","closeBtn":false},function(dom){
				dom.find("ul#category_list a.delete").click(function(){
					var a = $(this);
					deleteCategory(a);
				})
				dom.find("#category_save_btn").click(function(){
					var lang = {
					 	"en" : dom.find("#category_name_en").val(),
						"zh_tw" : dom.find("#category_name_zh_tw").val()
					};
					$.post("gallery_category_save",{"category":lang},function(response){
						if(response.success){
							var $li = $("<li class='hide'>"+lang.en+" <a href='"+response.id+"' class='btn delete' onclick='return false;'>Delete</a></li>");
							dom.find("ul#category_list").append($li);
							$li.show('slide');
							$li.find("a.delete").click(function(){
								deleteCategory($(this));
							})
							dom.find("input[type=text]").val("");
						}
					})
				})
				dom.find("#category_close_btn").click(function(){
					rcom.modalWindowClose();
				})
			});
		})
	}
	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 : dom.find("#name_en").val(),
						albumdesc : dom.find("#desc_en").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("Delete this Album?")){
			$.post("delete_album",{aid:id},function(){
				window.location = "orbit_gallery";
			})
		}
	}

	this.loadAlbums = function(id){
		var headbtn = $('<a class="rgui bt-add rgbt" title="Add Album" href="albums" onclick="return false;"><span>Add Album</span></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();})
		$.getJSON("get_albums",{cid:id},function(albums){
			$.each(albums,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){
		//<iframe id="upload_panel" width="100%" scrolling="no" height="300" frameborder="0" src="upload_panel.html?id=16">

		var headarea = '<a class="rgui bt-back rgbt" title="Back to Albums" href="orbit_gallery"><span>Back to Album</span></a> ';
		headarea+='<a class="rgui bt-add rgbt" title="Add Images" href="images" onclick="return false;"><span>Add Images</span></a> ';
		headarea+='<a class="rgui bt-del rgbt" title="Delete Album" href="delete" onclick="return false;"><span>Delete this album</span></a> ';
		headarea+='<a class="rgui bt-edit rgbt" title="Edit Album" href="orbit_gallery?edit='+id+'" ><span>Edit</span></a>';
		headarea = $(headarea);
		var uploadpanel = $('<div id="upload_panel_holder" style="display:none; margin: 16px 0 50px 0;"><div class="rgfn"><a class="rgui bt-cls rgbt" title="Close" href="" onclick="return false;"><span id="album_name_span">Close Panel</span></a></div></div>');
		var frame = $('<iframe id="upload_panel" width="100%" scrolling="no" height="300" 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();
		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);

	}
	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);
				    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 = $('<a href="" class="rgui bt-back rgbt" title="Back"><span id="album_name_span">Back to photos</span></a></div>');
		var head1 = $('<a class="rgui bt-edit rgbt" title="Edit Album" href="" ><span>Edit</span></a>');
		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()});
				})
				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();
					})
				}
			})
		}
		var head = '<a href="orbit_gallery?album='+id+'" class="rgui bt-back rgbt" title="Back"><span id="album_name_span">Back to photos</span></a></div>';
			head+='<a class="rgui bt-del bt-delete rgbt" onclick="return false;" style="display:none;" title="Delete Selected" href=""><span>Delete Selected</span></a>';
			head+='<a class="rgui bt-save rgbt" onclick="return false;" style="display:none;" title="Save" href=""><span>Save</span>';
		g.albumArea.find(".rghead .rgfn").html(head);
		rcom.bindDomToHead($(".rghead"));
		g.albumArea.find("#imgholder").load("edit_album?aid="+id,function(data,response,xhr){
			if(xhr.status == 404){
				$(this).text("Album not found.");
				return false;
			}
			bindHandlers();
		})
	}


}