Front-end rewrite #275

src/scripts/view.js

@@ -3,493 +3,491 @@
  * @copyright	2014 by Tobias Reich
  */
 
-view = {
+view = {}
 
-	header: {
+view.header = {
 
-		show: function() {
+	show: function() {
 
-			var newMargin = -1*($("#imageview #image").height()/2)+20;
+		var newMargin = -1*($("#imageview #image").height()/2)+20;
 
-			clearTimeout($(window).data("timeout"));
-
-			lychee.imageview.removeClass("full");
-			lychee.header.removeClass("hidden");
-			lychee.loadingBar.css("opacity", 1);
+		clearTimeout($(window).data("timeout"));
 
-			if ($("#imageview #image.small").length>0) $("#imageview #image").css('margin-top', newMargin);
-			else $("#imageview #image").removeClass('full');
+		lychee.imageview.removeClass("full");
+		lychee.header.removeClass("hidden");
+		lychee.loadingBar.css("opacity", 1);
 
-		},
+		if ($("#imageview #image.small").length>0) $("#imageview #image").css('margin-top', newMargin);
+		else $("#imageview #image").removeClass('full');
 
-		hide: function(e, delay) {
+	},
 
-			var newMargin = -1*($("#imageview #image").height()/2);
+	hide: function(e, delay) {
 
-			if (delay===undefined) delay = 500;
+		var newMargin = -1*($("#imageview #image").height()/2);
 
-			if (visible.photo()&&!visible.infobox()&&!visible.contextMenu()&&!visible.message()) {
+		if (delay===undefined) delay = 500;
 
-				clearTimeout($(window).data("timeout"));
+		if (visible.photo()&&!visible.infobox()&&!visible.contextMenu()&&!visible.message()) {
 
-				$(window).data("timeout", setTimeout(function() {
+			clearTimeout($(window).data("timeout"));
 
-					lychee.imageview.addClass("full");
-					lychee.header.addClass("hidden");
-					lychee.loadingBar.css("opacity", 0);
+			$(window).data("timeout", setTimeout(function() {
 
-					if ($("#imageview #image.small").length>0) $("#imageview #image").css('margin-top', newMargin);
-					else $("#imageview #image").addClass('full');
+				lychee.imageview.addClass("full");
+				lychee.header.addClass("hidden");
+				lychee.loadingBar.css("opacity", 0);
 
-				}, delay));
+				if ($("#imageview #image.small").length>0) $("#imageview #image").css('margin-top', newMargin);
+				else $("#imageview #image").addClass('full');
 
-			}
+			}, delay));
 
-		},
+		}
 
-		mode: function(mode) {
+	},
 
-			var albumID = album.getID();
+	mode: function(mode) {
 
-			switch (mode) {
+		var albumID = album.getID();
 
-				case "albums":
+		switch (mode) {
 
-					lychee.header.removeClass("view");
-					$("#tools_album, #tools_photo").hide();
-					$("#tools_albums").show();
+			case "albums":
 
-					break;
+				lychee.header.removeClass("view");
+				$("#tools_album, #tools_photo").hide();
+				$("#tools_albums").show();
 
-				case "album":
+				break;
 
-					lychee.header.removeClass("view");
-					$("#tools_albums, #tools_photo").hide();
-					$("#tools_album").show();
+			case "album":
 
-					album.json.content === false ? $("#button_archive").hide() : $("#button_archive").show();
-					if (lychee.publicMode&&album.json.downloadable==="0") $("#button_archive").hide();
-					if (albumID==="s"||albumID==="f"||albumID==="r") {
-						$("#button_info_album, #button_trash_album, #button_share_album").hide();
-					} else if (albumID==="0") {
-						$("#button_info_album, #button_share_album").hide();
-						$("#button_trash_album").show();
-					} else {
-						$("#button_info_album, #button_trash_album, #button_share_album").show();
-					}
+				lychee.header.removeClass("view");
+				$("#tools_albums, #tools_photo").hide();
+				$("#tools_album").show();
 
-					break;
+				album.json.content === false ? $("#button_archive").hide() : $("#button_archive").show();
+				if (lychee.publicMode&&album.json.downloadable==="0") $("#button_archive").hide();
+				if (albumID==="s"||albumID==="f"||albumID==="r") {
+					$("#button_info_album, #button_trash_album, #button_share_album").hide();
+				} else if (albumID==="0") {
+					$("#button_info_album, #button_share_album").hide();
+					$("#button_trash_album").show();
+				} else {
+					$("#button_info_album, #button_trash_album, #button_share_album").show();
+				}
 
-				case "photo":
+				break;
 
-					lychee.header.addClass("view");
-					$("#tools_albums, #tools_album").hide();
-					$("#tools_photo").show();
+			case "photo":
 
-					break;
+				lychee.header.addClass("view");
+				$("#tools_albums, #tools_album").hide();
+				$("#tools_photo").show();
 
-			}
+				break;
 
 		}
 
-	},
-
-	infobox: {
-
-		show: function() {
-
-			if (!visible.infobox()) $("body").append("<div id='infobox_overlay' class='fadeIn'></div>");
-			lychee.infobox.addClass("active");
+	}
 
-		},
+}
 
-		hide: function() {
+view.infobox = {
 
-			lychee.animate("#infobox_overlay", "fadeOut");
-			setTimeout(function() { $("#infobox_overlay").remove() }, 300);
-			lychee.infobox.removeClass("active");
+	show: function() {
 
-		}
+		if (!visible.infobox()) $("body").append("<div id='infobox_overlay' class='fadeIn'></div>");
+		lychee.infobox.addClass("active");
 
 	},
 
-	albums: {
+	hide: function() {
 
-		init: function() {
+		lychee.animate("#infobox_overlay", "fadeOut");
+		setTimeout(function() { $("#infobox_overlay").remove() }, 300);
+		lychee.infobox.removeClass("active");
 
-			view.albums.title();
-			view.albums.content.init();
+	}
 
-		},
+}
 
-		title: function() {
+view.albums = {
 
-			lychee.setTitle("Albums", false);
+	init: function() {
 
-		},
+		view.albums.title();
+		view.albums.content.init();
 
-		content: {
-
-			scrollPosition: 0,
+	},
 
-			init: function() {
+	title: function() {
 
-				var smartData = "",
-					albumsData = "";
+		lychee.setTitle("Albums", false);
 
-				/* Smart Albums */
-				albums.parse(albums.json.unsortedAlbum);
-				albums.parse(albums.json.publicAlbum);
-				albums.parse(albums.json.starredAlbum);
-				albums.parse(albums.json.recentAlbum);
-				if (!lychee.publicMode) smartData = build.divider("Smart Albums") + build.album(albums.json.unsortedAlbum) + build.album(albums.json.starredAlbum) + build.album(albums.json.publicAlbum) + build.album(albums.json.recentAlbum);
+	},
 
-				/* Albums */
-				if (albums.json.content) {
+	content: {
 
-					$.each(albums.json.content, function() {
-						albums.parse(this);
+		scrollPosition: 0,
 
-						//display albums in reverse order
-						albumsData = build.album(this) + albumsData;
-					});
+		init: function() {
 
-					if (!lychee.publicMode) albumsData = build.divider("Albums") + albumsData;
+			var smartData = "",
+				albumsData = "";
 
-				}
+			/* Smart Albums */
+			albums.parse(albums.json.unsortedAlbum);
+			albums.parse(albums.json.publicAlbum);
+			albums.parse(albums.json.starredAlbum);
+			albums.parse(albums.json.recentAlbum);
+			if (!lychee.publicMode) smartData = build.divider("Smart Albums") + build.album(albums.json.unsortedAlbum) + build.album(albums.json.starredAlbum) + build.album(albums.json.publicAlbum) + build.album(albums.json.recentAlbum);
 
-				if (smartData===""&&albumsData==="") {
-					lychee.content.html('');
-					$("body").append(build.no_content("share"));
-				} else {
-					lychee.content.html(smartData + albumsData);
-				}
+			/* Albums */
+			if (albums.json.content) {
 
-				$("img[data-type!='nonretina']").retina();
+				$.each(albums.json.content, function() {
+					albums.parse(this);
 
-				/* Restore scroll position */
-				if (view.albums.content.scrollPosition!==null) {
-					$("html, body").scrollTop(view.albums.content.scrollPosition);
-				}
+					//display albums in reverse order
+					albumsData = build.album(this) + albumsData;
+				});
 
-			},
+				if (!lychee.publicMode) albumsData = build.divider("Albums") + albumsData;
 
-			title: function(albumID) {
+			}
 
-				var prefix = "",
-					longTitle = "",
-					title = albums.json.content[albumID].title;
+			if (smartData===""&&albumsData==="") {
+				lychee.content.html('');
+				$("body").append(build.no_content("share"));
+			} else {
+				lychee.content.html(smartData + albumsData);
+			}
 
-				if (albums.json.content[albumID].password) prefix = "<span class='icon-lock'></span> ";
-				if (title!==null&&title.length>18) {
-					longTitle = title;
-					title = title.substr(0, 18) + "...";
-				}
+			$("img[data-type!='nonretina']").retina();
 
-				$(".album[data-id='" + albumID + "'] .overlay h1")
-					.html(prefix + title)
-					.attr("title", longTitle);
+			/* Restore scroll position */
+			if (view.albums.content.scrollPosition!==null) {
+				$("html, body").scrollTop(view.albums.content.scrollPosition);
+			}
 
-			},
+		},
 
-			delete: function(albumID) {
+		title: function(albumID) {
 
-				$(".album[data-id='" + albumID + "']").css("opacity", 0).animate({
-					width: 0,
-					marginLeft: 0
-				}, 300, function() {
-					$(this).remove();
-					if (albums.json.num<=0) lychee.animate(".divider:last-of-type", "fadeOut");
-				});
+			var prefix = "",
+				longTitle = "",
+				title = albums.json.content[albumID].title;
 
+			if (albums.json.content[albumID].password) prefix = "<span class='icon-lock'></span> ";
+			if (title!==null&&title.length>18) {
+				longTitle = title;
+				title = title.substr(0, 18) + "...";
 			}
 
-		}
+			$(".album[data-id='" + albumID + "'] .overlay h1")
+				.html(prefix + title)
+				.attr("title", longTitle);
 
-	},
+		},
 
-	album: {
+		delete: function(albumID) {
 
-		init: function() {
+			$(".album[data-id='" + albumID + "']").css("opacity", 0).animate({
+				width: 0,
+				marginLeft: 0
+			}, 300, function() {
+				$(this).remove();
+				if (albums.json.num<=0) lychee.animate(".divider:last-of-type", "fadeOut");
+			});
 
-			album.parse();
+		}
 
-			view.album.infobox();
-			view.album.title();
-			view.album.public();
-			view.album.content.init();
+	}
 
-			album.json.init = 1;
+}
 
-		},
+view.album = {
 
-		hide: function() {
+	init: function() {
 
-			view.infobox.hide();
+		album.parse();
 
-		},
+		view.album.infobox();
+		view.album.title();
+		view.album.public();
+		view.album.content.init();
 
-		title: function() {
-
-			if ((visible.album()||!album.json.init)&&!visible.photo()) {
-
-				switch (album.getID()) {
-					case "f":
-						lychee.setTitle("Starred", false);
-						break;
-					case "s":
-						lychee.setTitle("Public", false);
-						break;
-					case "r":
-						lychee.setTitle("Recent", false);
-						break;
-					case "0":
-						lychee.setTitle("Unsorted", false);
-						break;
-					default:
-						if (album.json.init) $("#infobox .attr_title").html(album.json.title + " " + build.editIcon("edit_title_album"));
-						lychee.setTitle(album.json.title, true);
-						break;
-				}
+		album.json.init = 1;
 
-			}
+	},
 
-		},
+	hide: function() {
 
-		content: {
+		view.infobox.hide();
 
-			init: function() {
+	},
 
-				var photosData = "";
+	title: function() {
 
-				$.each(album.json.content, function() {
-					photosData += build.photo(this);
-				});
-				lychee.content.html(photosData);
+		if ((visible.album()||!album.json.init)&&!visible.photo()) {
 
-				$("img[data-type!='svg']").retina();
+			switch (album.getID()) {
+				case "f":
+					lychee.setTitle("Starred", false);
+					break;
+				case "s":
+					lychee.setTitle("Public", false);
+					break;
+				case "r":
+					lychee.setTitle("Recent", false);
+					break;
+				case "0":
+					lychee.setTitle("Unsorted", false);
+					break;
+				default:
+					if (album.json.init) $("#infobox .attr_title").html(album.json.title + " " + build.editIcon("edit_title_album"));
+					lychee.setTitle(album.json.title, true);
+					break;
+			}
 
-				/* Save and reset scroll position */
-				view.albums.content.scrollPosition = $(document).scrollTop();
-				$("html, body").scrollTop(0);
+		}
 
-			},
+	},
 
-			title: function(photoID) {
+	content: {
 
-				var longTitle = "",
-					title = album.json.content[photoID].title;
+		init: function() {
 
-				if (title!==null&&title.length>18) {
-					longTitle = title;
-					title = title.substr(0, 18) + "...";
-				}
+			var photosData = "";
 
-				$(".photo[data-id='" + photoID + "'] .overlay h1")
-					.html(title)
-					.attr("title", longTitle);
+			$.each(album.json.content, function() {
+				photosData += build.photo(this);
+			});
+			lychee.content.html(photosData);
 
-			},
+			$("img[data-type!='svg']").retina();
 
-			star: function(photoID) {
+			/* Save and reset scroll position */
+			view.albums.content.scrollPosition = $(document).scrollTop();
+			$("html, body").scrollTop(0);
 
-				$(".photo[data-id='" + photoID + "'] .icon-star").remove();
-				if (album.json.content[photoID].star==1) $(".photo[data-id='" + photoID + "']").append("<a class='badge red icon-star'></a>");
+		},
 
-			},
+		title: function(photoID) {
 
-			public: function(photoID) {
+			var longTitle = "",
+				title = album.json.content[photoID].title;
 
-				$(".photo[data-id='" + photoID + "'] .icon-share").remove();
-				if (album.json.content[photoID].public==1) $(".photo[data-id='" + photoID + "']").append("<a class='badge red icon-share'></a>");
+			if (title!==null&&title.length>18) {
+				longTitle = title;
+				title = title.substr(0, 18) + "...";
+			}
 
-			},
+			$(".photo[data-id='" + photoID + "'] .overlay h1")
+				.html(title)
+				.attr("title", longTitle);
 
-			delete: function(photoID) {
+		},
 
-				$(".photo[data-id='" + photoID + "']").css("opacity", 0).animate({
-					width: 0,
-					marginLeft: 0
-				}, 300, function() {
-					$(this).remove();
-					// Only when search is not active
-					if (!visible.albums()) {
-						album.json.num--;
-						view.album.num();
-						view.album.title();
-					}
-				});
+		star: function(photoID) {
 
-			}
+			$(".photo[data-id='" + photoID + "'] .icon-star").remove();
+			if (album.json.content[photoID].star==1) $(".photo[data-id='" + photoID + "']").append("<a class='badge red icon-star'></a>");
 
 		},
 
-		description: function() {
+		public: function(photoID) {
 
-			$("#infobox .attr_description").html(album.json.description + " " + build.editIcon("edit_description_album"));
+			$(".photo[data-id='" + photoID + "'] .icon-share").remove();
+			if (album.json.content[photoID].public==1) $(".photo[data-id='" + photoID + "']").append("<a class='badge red icon-share'></a>");
 
 		},
 
-		num: function() {
+		delete: function(photoID) {
+
+			$(".photo[data-id='" + photoID + "']").css("opacity", 0).animate({
+				width: 0,
+				marginLeft: 0
+			}, 300, function() {
+				$(this).remove();
+				// Only when search is not active
+				if (!visible.albums()) {
+					album.json.num--;
+					view.album.num();
+					view.album.title();
+				}
+			});
 
-			$("#infobox .attr_images").html(album.json.num);
+		}
 
-		},
+	},
 
-		public: function() {
+	description: function() {
 
-			if (album.json.public==1) {
-				$("#button_share_album a").addClass("active");
-				$("#button_share_album").attr("title", "Share Album");
-				$(".photo .icon-share").remove();
-				if (album.json.init) $("#infobox .attr_visibility").html("Public");
-			} else {
-				$("#button_share_album a").removeClass("active");
-				$("#button_share_album").attr("title", "Make Public");
-				if (album.json.init) $("#infobox .attr_visibility").html("Private");
-			}
+		$("#infobox .attr_description").html(album.json.description + " " + build.editIcon("edit_description_album"));
 
-		},
+	},
 
-		password: function() {
+	num: function() {
 
-			if (album.json.password==1) $("#infobox .attr_password").html("Yes");
-			else $("#infobox .attr_password").html("No");
+		$("#infobox .attr_images").html(album.json.num);
 
-		},
+	},
 
-		infobox: function() {
+	public: function() {
+
+		if (album.json.public==1) {
+			$("#button_share_album a").addClass("active");
+			$("#button_share_album").attr("title", "Share Album");
+			$(".photo .icon-share").remove();
+			if (album.json.init) $("#infobox .attr_visibility").html("Public");
+		} else {
+			$("#button_share_album a").removeClass("active");
+			$("#button_share_album").attr("title", "Make Public");
+			if (album.json.init) $("#infobox .attr_visibility").html("Private");
+		}
 
-			if ((visible.album()||!album.json.init)&&!visible.photo()) lychee.infobox.html(build.infoboxAlbum(album.json)).show();
+	},
 
-		}
+	password: function() {
+
+		if (album.json.password==1) $("#infobox .attr_password").html("Yes");
+		else $("#infobox .attr_password").html("No");
 
 	},
 
-	photo: {
+	infobox: function() {
 
-		init: function() {
+		if ((visible.album()||!album.json.init)&&!visible.photo()) lychee.infobox.html(build.infoboxAlbum(album.json)).show();
 
-			photo.parse();
+	}
 
-			view.photo.infobox();
-			view.photo.title();
-			view.photo.star();
-			view.photo.public();
-			view.photo.photo();
+}
 
-			photo.json.init = 1;
+view.photo = {
 
-		},
+	init: function() {
 
-		show: function() {
+		photo.parse();
 
-			// Change header
-			lychee.content.addClass("view");
-			view.header.mode("photo");
+		view.photo.infobox();
+		view.photo.title();
+		view.photo.star();
+		view.photo.public();
+		view.photo.photo();
 
-			// Make body not scrollable
-			$("body").css("overflow", "hidden");
+		photo.json.init = 1;
 
-			// Fullscreen
-			$(document)
-				.bind("mouseenter", view.header.show)
-				.bind("mouseleave", view.header.hide);
+	},
 
-			lychee.animate(lychee.imageview, "fadeIn");
+	show: function() {
 
-		},
+		// Change header
+		lychee.content.addClass("view");
+		view.header.mode("photo");
 
-		hide: function() {
+		// Make body not scrollable
+		$("body").css("overflow", "hidden");
 
-			view.header.show();
-			if (visible.infobox) view.infobox.hide();
+		// Fullscreen
+		$(document)
+			.bind("mouseenter", view.header.show)
+			.bind("mouseleave", view.header.hide);
 
-			lychee.content.removeClass("view");
-			view.header.mode("album");
+		lychee.animate(lychee.imageview, "fadeIn");
 
-			// Make body scrollable
-			$("body").css("overflow", "auto");
+	},
 
-			// Disable Fullscreen
-			$(document)
-				.unbind("mouseenter")
-				.unbind("mouseleave");
+	hide: function() {
 
-			// Hide Photo
-			lychee.animate(lychee.imageview, "fadeOut");
-			setTimeout(function() {
-				lychee.imageview.hide();
-				view.album.infobox();
-			}, 300);
+		view.header.show();
+		if (visible.infobox) view.infobox.hide();
 
-		},
+		lychee.content.removeClass("view");
+		view.header.mode("album");
 
-		title: function() {
+		// Make body scrollable
+		$("body").css("overflow", "auto");
 
-			if (photo.json.init) $("#infobox .attr_title").html(photo.json.title + " " + build.editIcon("edit_title"));
-			lychee.setTitle(photo.json.title, true);
+		// Disable Fullscreen
+		$(document)
+			.unbind("mouseenter")
+			.unbind("mouseleave");
 
-		},
+		// Hide Photo
+		lychee.animate(lychee.imageview, "fadeOut");
+		setTimeout(function() {
+			lychee.imageview.hide();
+			view.album.infobox();
+		}, 300);
 
-		description: function() {
+	},
 
-			if (photo.json.init) $("#infobox .attr_description").html(photo.json.description + " " + build.editIcon("edit_description"));
+	title: function() {
 
-		},
+		if (photo.json.init) $("#infobox .attr_title").html(photo.json.title + " " + build.editIcon("edit_title"));
+		lychee.setTitle(photo.json.title, true);
 
-		star: function() {
+	},
 
-			$("#button_star a").removeClass("icon-star-empty icon-star");
-			if (photo.json.star==1) {
-				// Starred
-				$("#button_star a").addClass("icon-star");
-				$("#button_star").attr("title", "Unstar Photo");
-			} else {
-				// Unstarred
-				$("#button_star a").addClass("icon-star-empty");
-				$("#button_star").attr("title", "Star Photo");
-			}
+	description: function() {
 
-		},
+		if (photo.json.init) $("#infobox .attr_description").html(photo.json.description + " " + build.editIcon("edit_description"));
 
-		public: function() {
+	},
 
-			if (photo.json.public==1||photo.json.public==2) {
-				// Photo public
-				$("#button_share a").addClass("active");
-				$("#button_share").attr("title", "Share Photo");
-				if (photo.json.init) $("#infobox .attr_visibility").html("Public");
-			} else {
-				// Photo private
-				$("#button_share a").removeClass("active");
-				$("#button_share").attr("title", "Make Public");
-				if (photo.json.init) $("#infobox .attr_visibility").html("Private");
-			}
+	star: function() {
+
+		$("#button_star a").removeClass("icon-star-empty icon-star");
+		if (photo.json.star==1) {
+			// Starred
+			$("#button_star a").addClass("icon-star");
+			$("#button_star").attr("title", "Unstar Photo");
+		} else {
+			// Unstarred
+			$("#button_star a").addClass("icon-star-empty");
+			$("#button_star").attr("title", "Star Photo");
+		}
 
-		},
+	},
+
+	public: function() {
+
+		if (photo.json.public==1||photo.json.public==2) {
+			// Photo public
+			$("#button_share a").addClass("active");
+			$("#button_share").attr("title", "Share Photo");
+			if (photo.json.init) $("#infobox .attr_visibility").html("Public");
+		} else {
+			// Photo private
+			$("#button_share a").removeClass("active");
+			$("#button_share").attr("title", "Make Public");
+			if (photo.json.init) $("#infobox .attr_visibility").html("Private");
+		}
 
-		tags: function() {
+	},
 
-			$("#infobox #tags").html(build.tags(photo.json.tags));
+	tags: function() {
 
-		},
+		$("#infobox #tags").html(build.tags(photo.json.tags));
 
-		photo: function() {
+	},
 
-			lychee.imageview.html(build.imageview(photo.json, photo.getSize(), visible.controls()));
+	photo: function() {
 
-			if ((album.json&&album.json.content&&album.json.content[photo.getID()]&&album.json.content[photo.getID()].nextPhoto==="")||lychee.viewMode) $("a#next").hide();
-			if ((album.json&&album.json.content&&album.json.content[photo.getID()]&&album.json.content[photo.getID()].previousPhoto==="")||lychee.viewMode) $("a#previous").hide();
+		lychee.imageview.html(build.imageview(photo.json, photo.getSize(), visible.controls()));
 
-		},
+		if ((album.json&&album.json.content&&album.json.content[photo.getID()]&&album.json.content[photo.getID()].nextPhoto==="")||lychee.viewMode) $("a#next").hide();
+		if ((album.json&&album.json.content&&album.json.content[photo.getID()]&&album.json.content[photo.getID()].previousPhoto==="")||lychee.viewMode) $("a#previous").hide();
 
-		infobox: function() {
+	},
 
-			lychee.infobox.html(build.infoboxPhoto(photo.json)).show();
+	infobox: function() {
 
-		}
+		lychee.infobox.html(build.infoboxPhoto(photo.json)).show();
 
 	}
 
-};
+}