X-Git-Url: https://git.mxchange.org/?a=blobdiff_plain;f=view%2Ftheme%2Ffrio%2Fjs%2Ffilebrowser.js;h=270172072d5ac72073a58f6f80e353a877199114;hb=d49df631fbcc29110af3d06d3c5889226fe937ee;hp=d216c40f33ba94558cde5d3e4ed14ce408d0a2a3;hpb=1ce5cc1b49650faa7b0981fa4d179feade042faa;p=friendica.git

diff --git a/view/theme/frio/js/filebrowser.js b/view/theme/frio/js/filebrowser.js
index d216c40f33..270172072d 100644
--- a/view/theme/frio/js/filebrowser.js
+++ b/view/theme/frio/js/filebrowser.js
@@ -68,6 +68,7 @@ var FileBrowser = {
 	nickname : "",
 	type : "",
 	event: "",
+	folder: "",
 	id : null,
 
 	init: function(nickname, type, hash) {
@@ -80,16 +81,15 @@ var FileBrowser = {
 			var destination = h.split("-")[0];
 			FileBrowser.id = h.split("-")[1];
 			FileBrowser.event = FileBrowser.event + "." + destination;
-			if (destination == "comment") {
-				// get the comment textimput field
+			if (destination === "comment") {
+				// Get the comment textimput field
 				var commentElm = document.getElementById("comment-edit-text-" + FileBrowser.id);
 			}
 		};
 
-		console.log("FileBrowser:", nickname, type,FileBrowser.event, FileBrowser.id );
+		console.log("FileBrowser: " + nickname,  type, FileBrowser.event, FileBrowser.id);
 
-		// We need to add the AjaxUpload to the button
-		FileBrowser.uploadButtons();
+		FileBrowser.postLoad();
 
 		$(".error .close").on("click", function(e) {
 			e.preventDefault();
@@ -97,34 +97,25 @@ var FileBrowser = {
 		});
 
 		// Click on album link
-		$(".fbrowser").on("click", ".folders a, .path a, .folders button, .path button", function(e) {
+		$(".fbrowser").on("click", ".folders a, .path a", function(e) {
 			e.preventDefault();
 			var url = baseurl + "/fbrowser/" + FileBrowser.type + "/" + this.dataset.folder + "?mode=none";
-			$(".fbrowser-content").hide();
-			$(".fbrowser .profile-rotator-wrapper").show();
-
-			// load new content to fbrowser window
-			$(".fbrowser").load(url, function(responseText, textStatus){
-				$(".profile-rotator-wrapper").hide();
-				if (textStatus === 'success') {
-					$(".fbrowser_content").show();
-					// We need to add the AjaxUpload to the button
-					FileBrowser.uploadButtons();
-				}
-			});
+			FileBrowser.folder = this.dataset.folder;
+
+			FileBrowser.loadContent(url);
 		});
 
-		//embed on click
+		//Embed on click
 		$(".fbrowser").on('click', ".photo-album-photo-link", function(e) {
 			e.preventDefault();
 
 			var embed = "";
-			if (FileBrowser.type == "image") {
-				embed = "[url="+this.dataset.link+"][img]"+this.dataset.img+"[/img][/url]";
+			if (FileBrowser.type === "image") {
+				embed = "[url=" + this.dataset.link + "][img]" + this.dataset.img + "[/img][/url]";
 			}
-			if (FileBrowser.type=="file") {
+			if (FileBrowser.type === "file") {
 				// attachment links are "baseurl/attach/id"; we need id
-				embed = "[attachment]"+this.dataset.link.split("/").pop()+"[/attachment]";
+				embed = "[attachment]" + this.dataset.link.split("/").pop() + "[/attachment]";
 			}
 
 			// Delete prefilled Text of the comment input
@@ -132,7 +123,7 @@ var FileBrowser = {
 			// work as expected (we need a way to wait until commentOpenUI would be finished).
 			// As for now we insert pieces of this function here
 			if ((commentElm !== null) && (typeof commentElm !== "undefined")) {
-				if (commentElm.value == "") {
+				if (commentElm.value === "") {
 					$("#comment-edit-text-" + FileBrowser.id).addClass("comment-edit-text-full").removeClass("comment-edit-text-empty");
 					$("#comment-edit-submit-wrapper-" + FileBrowser.id).show();
 					$("#comment-edit-text-" + FileBrowser.id).attr('tabindex','9');
@@ -140,61 +131,75 @@ var FileBrowser = {
 				}
 
 			}
+
 			console.log(FileBrowser.event, this.dataset.filename, embed, FileBrowser.id);
+
 			parent.$("body").trigger(FileBrowser.event, [
 				this.dataset.filename,
 				embed,
 				FileBrowser.id,
-				this.dataset.img,
+				this.dataset.img
 			]);
 
-			// close model
+			// Close model
 			$('#modal').modal('hide');
-			// update autosize for this textarea
+			// Update autosize for this textarea
 			autosize.update($(".text-autosize"));
 		});
+
+		// EventListener for switching between image and file mode
+		$(".fbrowser").on('click', ".fbswitcher .btn", function(e) {
+			e.preventDefault();
+			FileBrowser.type = this.getAttribute("data-mode");
+			$(".fbrowser").removeClass().addClass("fbrowser " + FileBrowser.type);
+			url = baseurl + "/fbrowser/" + FileBrowser.type + "?mode=none";
+
+			FileBrowser.loadContent(url);
+		});
 	},
 
+	// Initialize the AjaxUpload for the upload buttons
 	uploadButtons: function() {
 		if ($("#upload-image").length) {
+			// To get the albumname we need to convert it from hex
+			var albumname = hex2bin(FileBrowser.folder);
+			//AjaxUpload for images
 			var image_uploader = new window.AjaxUpload(
 				'upload-image',
-				{	action: 'wall_upload/'+FileBrowser.nickname+'?response=json',
+				{	action: 'wall_upload/' + FileBrowser.nickname + '?response=json&album=' + albumname,
 					name: 'userfile',
 					responseType: 'json',
-					onSubmit: function(file,ext) {
+					onSubmit: function(file, ext) {
 						$(".fbrowser-content").hide();
 						$(".fbrowser .profile-rotator-wrapper").show();
 						$(".error").addClass('hidden');
 					},
 					onComplete: function(file,response) {
-						if (response['error']!= undefined) {
+						if (response['error'] != undefined) {
 							$(".error span").html(response['error']);
 							$(".error").removeClass('hidden');
 							$(".fbrowser .profile-rotator-wrapper").hide();
 							return;
 						}
 
-						$(".profile-rotator-wrapper").hide();
-						$(".fbrowser_content").show();
-
 //						location = baseurl + "/fbrowser/image/?mode=none"+location['hash'];
 //						location.reload(true);
 
-						var url = baseurl + "/fbrowser/" + FileBrowser.type + "?mode=none"
+						var url = baseurl + "/fbrowser/" + FileBrowser.type + "/" + FileBrowser.folder + "?mode=none";
 						// load new content to fbrowser window
-						$(".fbrowser").load(url);
+						FileBrowser.loadContent(url);
 					}
 				}
 			);
 		}
 
 		if ($("#upload-file").length) {
+			//AjaxUpload for files
 			var file_uploader = new window.AjaxUpload(
 				'upload-file',
-				{	action: 'wall_attach/'+FileBrowser.nickname+'?response=json',
+				{	action: 'wall_attach/' + FileBrowser.nickname + '?response=json',
 					name: 'userfile',
-					onSubmit: function(file,ext) {
+					onSubmit: function(file, ext) {
 						$(".fbrowser-content").hide();
 						$(".fbrowser .profile-rotator-wrapper").show();
 						$(".error").addClass('hidden');
@@ -207,18 +212,48 @@ var FileBrowser = {
 							return;
 						}
 
-						$(".profile-rotator-wrapper").hide();
-						$(".fbrowser_content").show();
-
 //						location = baseurl + "/fbrowser/file/?mode=none"+location['hash'];
 //						location.reload(true);
 
-						var url = baseurl + "/fbrowser/" + FileBrowser.type + "?mode=none"
-						// load new content to fbrowser window
-						$(".fbrowser").load(url);
+						var url = baseurl + "/fbrowser/" + FileBrowser.type + "?mode=none";
+						// Load new content to fbrowser window
+						FileBrowser.loadContent(url);
 					}
 				}
 			);
 		}
+	},
+
+	// Stuff which should be executed if ne content was loaded
+	postLoad: function() {
+		FileBrowser.initGallery();
+		$(".fbrowser .fbswitcher .btn").removeClass("active");
+		$(".fbrowser .fbswitcher [data-mode=" + FileBrowser.type + "]").addClass("active");
+		// We need to add the AjaxUpload to the button
+		FileBrowser.uploadButtons();
+	},
+
+	// Load new content (e.g. change photo album)
+	loadContent: function(url) {
+		$(".fbrowser-content").hide();
+		$(".fbrowser .profile-rotator-wrapper").show();
+
+		// load new content to fbrowser window
+		$(".fbrowser").load(url, function(responseText, textStatus) {
+			$(".profile-rotator-wrapper").hide();
+			if (textStatus === 'success') {
+				$(".fbrowser_content").show();
+				FileBrowser.postLoad();
+			}
+		});
+	},
+
+	// Initialize justified Gallery
+	initGallery: function() {
+		$(".fbrowser.image .fbrowser-content-container").justifiedGallery({
+			'rowHeight': 80,
+			'margins': 4,
+			'border': 0
+		});
 	}
 };