arno/lychee
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Front-end rewrite #275

Browse Source
This commit is contained in:
Tobias Reich 2014-11-20 22:28:30 +01:00
parent 8624b38171
commit b4d356f7e4
6 changed files with 483 additions and 460 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
dist/main.js vendored
View File

Binary file not shown.

8
src/scripts/album.js
View File

@ -63,8 +63,14 @@ album = {
album.json = data;
// Calculate delay
durationTime = (new Date().getTime() - startTime);
if (durationTime>300) waitTime = 0; else if (refresh) waitTime = 0; else waitTime = 300 - durationTime;
if (durationTime>300) waitTime = 0;
else waitTime = 300 - durationTime;
// Skip delay when refresh is true
// Skip delay when opening a blank Lychee
if (refresh===true) waitTime = 0;
if (!visible.albums()&&!visible.photo()&&!visible.album()) waitTime = 0;
setTimeout(function() {

84
src/scripts/albums.js
View File

@ -3,61 +3,61 @@
* @copyright 2014 by Tobias Reich
*/
albums = {
albums = {}
json: null,
albums.json = null;
load: function() {
albums.load = function() {
var startTime,
durationTime,
waitTime;
lychee.animate(".album:nth-child(-n+50), .photo:nth-child(-n+50)", "contentZoomOut");
lychee.animate(".divider", "fadeOut");
lychee.animate('.album:nth-child(-n+50), .photo:nth-child(-n+50)', 'contentZoomOut');
lychee.animate('.divider', 'fadeOut');
startTime = new Date().getTime();
if(albums.json===null) {
if (albums.json===null) {
lychee.api("getAlbums", function(data) {
lychee.api('getAlbums', function(data) {
/* Smart Albums */
data.unsortedAlbum = {
id: 0,
title: "Unsorted",
sysdate: data.unsortedNum + " photos",
unsorted: "1",
title: 'Unsorted',
sysdate: data.unsortedNum + ' photos',
unsorted: '1',
thumb0: data.unsortedThumb0,
thumb1: data.unsortedThumb1,
thumb2: data.unsortedThumb2
};
data.starredAlbum = {
id: "f",
title: "Starred",
sysdate: data.starredNum + " photos",
star: "1",
id: 'f',
title: 'Starred',
sysdate: data.starredNum + ' photos',
star: '1',
thumb0: data.starredThumb0,
thumb1: data.starredThumb1,
thumb2: data.starredThumb2
};
data.publicAlbum = {
id: "s",
title: "Public",
sysdate: data.publicNum + " photos",
public: "1",
id: 's',
title: 'Public',
sysdate: data.publicNum + ' photos',
public: '1',
thumb0: data.publicThumb0,
thumb1: data.publicThumb1,
thumb2: data.publicThumb2
};
data.recentAlbum = {
id: "r",
title: "Recent",
sysdate: data.recentNum + " photos",
recent: "1",
id: 'r',
title: 'Recent',
sysdate: data.recentNum + ' photos',
recent: '1',
thumb0: data.recentThumb0,
thumb1: data.recentThumb1,
thumb2: data.recentThumb2
@ -65,47 +65,49 @@ albums = {
albums.json = data;
// Calculate delay
durationTime = (new Date().getTime() - startTime);
if (durationTime>300) waitTime = 0; else waitTime = 300 - durationTime;
if (durationTime>300) waitTime = 0;
else waitTime = 300 - durationTime;
// Skip delay when opening a blank Lychee
if (!visible.albums()&&!visible.photo()&&!visible.album()) waitTime = 0;
if (visible.album()&&lychee.content.html()==="") waitTime = 0;
if (visible.album()&&lychee.content.html()==='') waitTime = 0;
setTimeout(function() {
view.header.mode("albums");
view.header.mode('albums');
view.albums.init();
lychee.animate(".album:nth-child(-n+50), .photo:nth-child(-n+50)", "contentZoomIn");
lychee.animate('.album:nth-child(-n+50), .photo:nth-child(-n+50)', 'contentZoomIn');
}, waitTime);
});
} else {
setTimeout(function() {
view.header.mode("albums");
view.header.mode('albums');
view.albums.init();
lychee.animate(".album:nth-child(-n+50), .photo:nth-child(-n+50)", "contentZoomIn");
lychee.animate('.album:nth-child(-n+50), .photo:nth-child(-n+50)', 'contentZoomIn');
}, 300);
}
},
}
parse: function(album) {
albums.parse = function(album) {
if (album.password&&lychee.publicMode) {
album.thumb0 = "src/images/password.svg";
album.thumb1 = "src/images/password.svg";
album.thumb2 = "src/images/password.svg";
album.thumb0 = 'src/images/password.svg';
album.thumb1 = 'src/images/password.svg';
album.thumb2 = 'src/images/password.svg';
} else {
if (!album.thumb0) album.thumb0 = "src/images/no_images.svg";
if (!album.thumb1) album.thumb1 = "src/images/no_images.svg";
if (!album.thumb2) album.thumb2 = "src/images/no_images.svg";
if (!album.thumb0) album.thumb0 = 'src/images/no_images.svg';
if (!album.thumb1) album.thumb1 = 'src/images/no_images.svg';
if (!album.thumb2) album.thumb2 = 'src/images/no_images.svg';
}
},
}
refresh: function() {
albums.refresh = function() {
albums.json = null;
}
};
}

244
src/scripts/lychee.js
View File

@ -3,44 +3,46 @@
* @copyright 2014 by Tobias Reich
*/
var lychee = {
lychee = {
title: "",
version: "2.7.0",
version_code: "020700",
title: '',
version: '2.7.0',
version_code: '020700',
api_path: "php/api.php",
update_path: "http://lychee.electerious.com/version/index.php",
updateURL: "https://github.com/electerious/Lychee",
website: "http://lychee.electerious.com",
api_path: 'php/api.php',
update_path: 'http://lychee.electerious.com/version/index.php',
updateURL: 'https://github.com/electerious/Lychee',
website: 'http://lychee.electerious.com',
publicMode: false,
viewMode: false,
debugMode: false,
username: "",
checkForUpdates: false,
sorting: "",
location: "",
checkForUpdates:false,
username: '',
sorting: '',
location: '',
dropbox: false,
dropboxKey: '',
loadingBar: $("#loading"),
header: $("header"),
content: $("#content"),
imageview: $("#imageview"),
infobox: $("#infobox"),
loadingBar: $('#loading'),
header: $('header'),
content: $('#content'),
imageview: $('#imageview'),
infobox: $('#infobox')
init: function() {
}
lychee.init = function() {
var params;
params = "init&version=" + lychee.version_code;
params = 'init&version=' + lychee.version_code;
lychee.api(params, function(data) {
if (data.loggedIn!==true) {
lychee.setMode("public");
lychee.setMode('public');
} else {
lychee.username = data.config.username || '';
lychee.sorting = data.config.sorting || '';
@ -49,10 +51,10 @@ var lychee = {
}
// No configuration
if (data==="Warning: No configuration!") {
if (data==='Warning: No configuration!') {
lychee.header.hide();
lychee.content.hide();
$("body").append(build.no_content("cog"));
$('body').append(build.no_content('cog'));
settings.createConfig();
return true;
}
@ -63,37 +65,44 @@ var lychee = {
}
lychee.checkForUpdates = data.config.checkForUpdates;
$(window).bind("popstate", lychee.load);
$(window).bind('popstate', lychee.load);
lychee.load();
});
},
}
api: function(params, callback, loading) {
lychee.api = function(params, callback) {
if (loading===undefined) loadingBar.show();
loadingBar.show();
$.ajax({
type: "POST",
type: 'POST',
url: lychee.api_path,
data: "function=" + params,
dataType: "text",
data: 'function=' + params,
dataType: 'text',
success: function(data) {
setTimeout(function() { loadingBar.hide() }, 100);
if (typeof data==="string"&&data.substring(0, 7)==="Error: ") {
// Catch errors
if (typeof data==='string'&&
data.substring(0, 7)==='Error: ') {
lychee.error(data.substring(7, data.length), params, data);
upload.close(true);
return false;
}
if (data==="1") data = true;
else if (data==="") data = false;
// Convert 1 to true and an empty string to false
if (data==='1') data = true;
else if (data==='') data = false;
if (typeof data==="string"&&data.substring(0, 1)==="{"&&data.substring(data.length-1, data.length)==="}") data = $.parseJSON(data);
// Convert to JSON if string start with '{' and ends with '}'
if (typeof data==='string'&&
data.substring(0, 1)==='{'&&
data.substring(data.length-1, data.length)==='}') data = $.parseJSON(data);
// Output response when debug mode is enabled
if (lychee.debugMode) console.log(data);
callback(data);
@ -101,27 +110,27 @@ var lychee = {
},
error: function(jqXHR, textStatus, errorThrown) {
lychee.error("Server error or API not found.", params, errorThrown);
lychee.error('Server error or API not found.', params, errorThrown);
upload.close(true);
}
});
},
}
login: function() {
lychee.login = function() {
var user = $("input#username").val(),
password = md5($("input#password").val()),
var user = $('input#username').val(),
password = md5($('input#password').val()),
params;
params = "login&user=" + user + "&password=" + password;
params = 'login&user=' + user + '&password=' + password;
lychee.api(params, function(data) {
if (data===true) {
// Use 'try' to catch a thrown error when Safari is in private mode
try { localStorage.setItem("lychee_username", user); }
try { localStorage.setItem('lychee_username', user); }
catch (err) {}
window.location.reload();
@ -129,57 +138,59 @@ var lychee = {
} else {
// Show error and reactive button
$("#password").val("").addClass("error").focus();
$(".message .button.active").removeClass("pressed");
$('#password').val('').addClass('error').focus();
$('.message .button.active').removeClass('pressed');
}
});
},
}
loginDialog: function() {
lychee.loginDialog = function() {
var local_username;
$("body").append(build.signInModal());
$("#username").focus();
$('body').append(build.signInModal());
$('#username').focus();
if (localStorage) {
local_username = localStorage.getItem("lychee_username");
local_username = localStorage.getItem('lychee_username');
if (local_username!==null) {
if (local_username.length>0) $("#username").val(local_username);
$("#password").focus();
if (local_username.length>0) $('#username').val(local_username);
$('#password').focus();
}
}
if (lychee.checkForUpdates==="1") lychee.getUpdate();
},
if (lychee.checkForUpdates==='1') lychee.getUpdate();
logout: function() {
}
lychee.api("logout", function() {
lychee.logout = function() {
lychee.api('logout', function() {
window.location.reload();
});
},
}
goto: function(url) {
lychee.goto = function(url) {
if (url===undefined) url = "#";
else url = "#" + url;
if (url===undefined) url = '#';
else url = '#' + url;
history.pushState(null, null, url);
lychee.load();
},
}
load: function() {
lychee.load = function() {
var albumID = "",
photoID = "",
hash = document.location.hash.replace("#", "").split("/");
var albumID = '',
photoID = '',
hash = document.location.hash.replace('#', '').split('/');
$(".no_content").remove();
$('.no_content').remove();
contextMenu.close();
multiselect.close();
@ -192,7 +203,8 @@ var lychee = {
photo.json = null;
// Show Photo
if (lychee.content.html()===""||($("#search").length&&$("#search").val().length!==0)) {
if (lychee.content.html()===''||
($('#search').length&&$('#search').val().length!==0)) {
lychee.content.hide();
album.load(albumID, true);
}
@ -213,7 +225,7 @@ var lychee = {
// Trash data
album.json = null;
photo.json = null;
search.code = "";
search.code = '';
// Show Albums
if (visible.album()) view.album.hide();
@ -222,43 +234,43 @@ var lychee = {
}
},
}
getUpdate: function() {
lychee.getUpdate = function() {
$.ajax({
url: lychee.update_path,
success: function(data) { if (parseInt(data)>parseInt(lychee.version_code)) $("#version span").show(); }
success: function(data) { if (parseInt(data)>parseInt(lychee.version_code)) $('#version span').show(); }
});
},
}
setTitle: function(title, editable) {
lychee.setTitle = function(title, editable) {
if (lychee.title==="") lychee.title = document.title;
if (lychee.title==='') lychee.title = document.title;
if (title==="Albums") document.title = lychee.title;
else document.title = lychee.title + " - " + title;
if (title==='Albums') document.title = lychee.title;
else document.title = lychee.title + ' - ' + title;
if (editable) $("#title").addClass("editable");
else $("#title").removeClass("editable");
if (editable) $('#title').addClass('editable');
else $('#title').removeClass('editable');
$("#title").html(title);
$('#title').html(title);
},
}
setMode: function(mode) {
lychee.setMode = function(mode) {
$("#button_settings, #button_settings, #button_search, #search, #button_trash_album, #button_share_album, .button_add, .button_divider").remove();
$("#button_trash, #button_move, #button_share, #button_star").remove();
$('#button_settings, #button_settings, #button_search, #search, #button_trash_album, #button_share_album, .button_add, .button_divider').remove();
$('#button_trash, #button_move, #button_share, #button_star').remove();
$(document)
.on("mouseenter", "#title.editable", function() { $(this).removeClass("editable") })
.off("click", "#title.editable")
.off("touchend", "#title.editable")
.off("contextmenu", ".photo")
.off("contextmenu", ".album")
.off("drop");
.on('mouseenter', '#title.editable', function() { $(this).removeClass('editable') })
.off('click', '#title.editable')
.off('touchend', '#title.editable')
.off('contextmenu', '.photo')
.off('contextmenu', '.album')
.off('drop');
Mousetrap
.unbind(['u', 'ctrl+u'])
@ -268,29 +280,29 @@ var lychee = {
.unbind(['t', 'ctrl+t'])
.unbind(['command+backspace', 'ctrl+backspace']);
if (mode==="public") {
if (mode==='public') {
$("header #button_signin, header #hostedwith").show();
$('header #button_signin, header #hostedwith').show();
lychee.publicMode = true;
} else if (mode==="view") {
} else if (mode==='view') {
Mousetrap.unbind('esc');
$("#button_back, a#next, a#previous").remove();
$(".no_content").remove();
$('#button_back, a#next, a#previous').remove();
$('.no_content').remove();
lychee.publicMode = true;
lychee.viewMode = true;
}
},
}
animate: function(obj, animation) {
lychee.animate = function(obj, animation) {
var animations = [
["fadeIn", "fadeOut"],
["contentZoomIn", "contentZoomOut"]
['fadeIn', 'fadeOut'],
['contentZoomIn', 'contentZoomOut']
];
if (!obj.jQuery) obj = $(obj);
@ -298,7 +310,7 @@ var lychee = {
for (var i = 0; i < animations.length; i++) {
for (var x = 0; x < animations[i].length; x++) {
if (animations[i][x]==animation) {
obj.removeClass(animations[i][0] + " " + animations[i][1]).addClass(animation);
obj.removeClass(animations[i][0] + ' ' + animations[i][1]).addClass(animation);
return true;
}
}
@ -306,34 +318,34 @@ var lychee = {
return false;
},
}
escapeHTML: function(s) {
lychee.escapeHTML = function(s) {
return s.replace(/&/g, '&amp;')
.replace(/"/g, '&quot;')
.replace(/</g, '&lt;')
.replace(/>/g, '&gt;');
},
}
loadDropbox: function(callback) {
lychee.loadDropbox = function(callback) {
if (!lychee.dropbox&&lychee.dropboxKey) {
loadingBar.show();
var g = document.createElement("script"),
s = document.getElementsByTagName("script")[0];
var g = document.createElement('script'),
s = document.getElementsByTagName('script')[0];
g.src = "https://www.dropbox.com/static/api/1/dropins.js";
g.id = "dropboxjs";
g.type = "text/javascript";
g.async = "true";
g.setAttribute("data-app-key", lychee.dropboxKey);
g.src = 'https://www.dropbox.com/static/api/1/dropins.js';
g.id = 'dropboxjs';
g.type = 'text/javascript';
g.async = 'true';
g.setAttribute('data-app-key', lychee.dropboxKey);
g.onload = g.onreadystatechange = function() {
var rs = this.readyState;
if (rs&&rs!=="complete"&&rs!=="loaded") return;
if (rs&&rs!=='complete'&&rs!=='loaded') return;
lychee.dropbox = true;
loadingBar.hide();
callback();
@ -350,17 +362,17 @@ var lychee = {
}
},
}
removeHTML: function(html) {
lychee.removeHTML = function(html) {
var tmp = document.createElement("DIV");
var tmp = document.createElement('DIV');
tmp.innerHTML = html;
return tmp.textContent || tmp.innerText;
},
}
error: function(errorThrown, params, data) {
lychee.error = function(errorThrown, params, data) {
console.error({
description: errorThrown,
@ -368,8 +380,6 @@ var lychee = {
response: data
});
loadingBar.show("error", errorThrown);
loadingBar.show('error', errorThrown);
}
};
}

2
src/scripts/photo.js
View File

@ -158,7 +158,7 @@ photo.duplicate = function(photoIDs) {
lychee.api(params, function(data) {
if (data!==true) lychee.error(null, params, data);
else album.load(album.getID(), false);
else album.load(album.getID());
});

63
src/scripts/search.js
View File

@ -3,25 +3,26 @@
* @copyright 2014 by Tobias Reich
*/
search = {
search = {}
code: null,
search.code = null;
find: function(term) {
search.find = function(term) {
var params,
albumsData = "",
photosData = "",
albumsData = '',
photosData = '',
code;
clearTimeout($(window).data("timeout"));
$(window).data("timeout", setTimeout(function() {
clearTimeout($(window).data('timeout'));
$(window).data('timeout', setTimeout(function() {
if ($("#search").val().length!==0) {
if ($('#search').val().length!==0) {
params = "search&term=" + term;
params = 'search&term=' + term;
lychee.api(params, function(data) {
// Build albums
if (data&&data.albums) {
albums.json = { content: data.albums };
$.each(albums.json.content, function() {
@ -30,6 +31,7 @@ search = {
});
}
// Build photos
if (data&&data.photos) {
album.json = { content: data.photos };
$.each(album.json.content, function() {
@ -37,27 +39,32 @@ search = {
});
}
if (albumsData===""&&photosData==="") code = "error";
else if (albumsData==="") code = build.divider("Photos")+photosData;
else if (photosData==="") code = build.divider("Albums")+albumsData;
else code = build.divider("Photos")+photosData+build.divider("Albums")+albumsData;
// 1. No albums and photos found
// 2. Only photos found
// 3. Only albums found
// 4. Albums and photos found
if (albumsData===''&&photosData==='') code = 'error';
else if (albumsData==='') code = build.divider('Photos') + photosData;
else if (photosData==='') code = build.divider('Albums') + albumsData;
else code = build.divider('Photos') + photosData + build.divider('Albums') + albumsData;
// Only refresh view when search results are different
if (search.code!==md5(code)) {
$(".no_content").remove();
$('.no_content').remove();
lychee.animate(".album:nth-child(-n+50), .photo:nth-child(-n+50)", "contentZoomOut");
lychee.animate(".divider", "fadeOut");
lychee.animate('.album:nth-child(-n+50), .photo:nth-child(-n+50)', 'contentZoomOut');
lychee.animate('.divider', 'fadeOut');
search.code = md5(code);
setTimeout(function() {
if (code==="error") $("body").append(build.no_content("search"));
if (code==='error') $('body').append(build.no_content('search'));
else {
lychee.content.html(code);
lychee.animate(".album:nth-child(-n+50), .photo:nth-child(-n+50)", "contentZoomIn");
$("img[data-type!='svg']").retina();
lychee.animate('.album:nth-child(-n+50), .photo:nth-child(-n+50)', 'contentZoomIn');
$('img[data-type!="svg"]').retina();
}
}, 300);
@ -70,26 +77,24 @@ search = {
}, 250));
},
}
reset: function() {
search.reset = function() {
$("#search").val("");
$(".no_content").remove();
$('#search').val('');
$('.no_content').remove();
if (search.code!=="") {
if (search.code!=='') {
// Trash data
albums.json = null;
album.json = null;
photo.json = null;
search.code = "";
search.code = '';
lychee.animate(".divider", "fadeOut");
lychee.animate('.divider', 'fadeOut');
albums.load();
}
}
};
}