Front-end rewrite #275

This commit is contained in:
Tobias Reich 2014-11-20 23:27:41 +01:00
parent 752d094775
commit c849cf33a9
10 changed files with 259 additions and 246 deletions

BIN
dist/main.js vendored

Binary file not shown.

View File

@ -3,9 +3,11 @@
* @copyright 2014 by Tobias Reich * @copyright 2014 by Tobias Reich
*/ */
album = {} album = {
album.json = null; json: null
}
album.getID = function() { album.getID = function() {

View File

@ -3,9 +3,11 @@
* @copyright 2014 by Tobias Reich * @copyright 2014 by Tobias Reich
*/ */
albums = {} albums = {
albums.json = null; json: null
}
albums.load = function() { albums.load = function() {

View File

@ -3,9 +3,11 @@
* @copyright 2014 by Tobias Reich * @copyright 2014 by Tobias Reich
*/ */
loadingBar = {} loadingBar = {
loadingBar.status = null; status: null
}
loadingBar.show = function(status, errorText) { loadingBar.show = function(status, errorText) {

View File

@ -3,9 +3,11 @@
* @copyright 2014 by Tobias Reich * @copyright 2014 by Tobias Reich
*/ */
modal = {} modal = {
modal.fns = null; fns: null
}
modal.show = function(title, text, buttons, marginTop, closeButton) { modal.show = function(title, text, buttons, marginTop, closeButton) {

View File

@ -3,9 +3,11 @@
* @copyright 2014 by Tobias Reich * @copyright 2014 by Tobias Reich
*/ */
password = {} password = {
password.value = ''; value: ''
}
password.get = function(albumID, callback) { password.get = function(albumID, callback) {

View File

@ -3,10 +3,12 @@
* @copyright 2014 by Tobias Reich * @copyright 2014 by Tobias Reich
*/ */
photo = {} photo = {
photo.json = null; json: null,
photo.cache = null; cache: null
}
photo.getID = function() { photo.getID = function() {

View File

@ -3,9 +3,11 @@
* @copyright 2014 by Tobias Reich * @copyright 2014 by Tobias Reich
*/ */
search = {} search = {
search.code = null; code: null
}
search.find = function(term) { search.find = function(term) {

View File

@ -3,288 +3,287 @@
* @copyright 2014 by Tobias Reich * @copyright 2014 by Tobias Reich
*/ */
var settings = { settings = {}
createConfig: function() { settings.createConfig = function() {
var dbName, var dbName,
dbUser, dbUser,
dbPassword, dbPassword,
dbHost, dbHost,
dbTablePrefix, dbTablePrefix,
buttons, buttons,
params; params;
buttons = [ buttons = [
["Connect", function() { ['Connect', function() {
dbHost = $(".message input.text#dbHost").val(); dbHost = $('.message input.text#dbHost').val();
dbUser = $(".message input.text#dbUser").val(); dbUser = $('.message input.text#dbUser').val();
dbPassword = $(".message input.text#dbPassword").val(); dbPassword = $('.message input.text#dbPassword').val();
dbName = $(".message input.text#dbName").val(); dbName = $('.message input.text#dbName').val();
dbTablePrefix = $(".message input.text#dbTablePrefix").val(); dbTablePrefix = $('.message input.text#dbTablePrefix').val();
if (dbHost.length<1) dbHost = "localhost"; if (dbHost.length<1) dbHost = 'localhost';
if (dbName.length<1) dbName = "lychee"; if (dbName.length<1) dbName = 'lychee';
params = "dbCreateConfig&dbName=" + escape(dbName) + "&dbUser=" + escape(dbUser) + "&dbPassword=" + escape(dbPassword) + "&dbHost=" + escape(dbHost) + "&dbTablePrefix=" + escape(dbTablePrefix); params = 'dbCreateConfig&dbName=' + escape(dbName) + '&dbUser=' + escape(dbUser) + '&dbPassword=' + escape(dbPassword) + '&dbHost=' + escape(dbHost) + '&dbTablePrefix=' + escape(dbTablePrefix);
lychee.api(params, function(data) { lychee.api(params, function(data) {
if (data!==true) { if (data!==true) {
// Configuration failed
setTimeout(function() {
// Connection failed
if (data.indexOf("Warning: Connection failed!")!==-1) {
buttons = [
["Retry", function() { setTimeout(settings.createConfig, 400) }],
["", function() {}]
];
modal.show("Connection Failed", "Unable to connect to host database because access was denied. Double-check your host, username and password and ensure that access from your current location is permitted.", buttons, null, false);
return false;
}
// Creation failed
if (data.indexOf("Warning: Creation failed!")!==-1) {
buttons = [
["Retry", function() { setTimeout(settings.createConfig, 400) }],
["", function() {}]
];
modal.show("Creation Failed", "Unable to create the database. Double-check your host, username and password and ensure that the specified user has the rights to modify and add content to the database.", buttons, null, false);
return false;
}
// Could not create file
if (data.indexOf("Warning: Could not create file!")!==-1) {
buttons = [
["Retry", function() { setTimeout(settings.createConfig, 400) }],
["", function() {}]
];
modal.show("Saving Failed", "Unable to save this configuration. Permission denied in <b>'data/'</b>. Please set the read, write and execute rights for others in <b>'data/'</b> and <b>'uploads/'</b>. Take a look the readme for more information.", buttons, null, false);
return false;
}
// Something went wrong
buttons = [
["Retry", function() { setTimeout(settings.createConfig, 400) }],
["", function() {}]
];
modal.show("Configuration Failed", "Something unexpected happened. Please try again and check your installation and server. Take a look the readme for more information.", buttons, null, false);
return false;
}, 400);
} else {
// Configuration successful
window.location.reload();
}
});
}],
["", function() {}]
];
modal.show("Configuration", "Enter your database connection details below: <input id='dbHost' class='text less' type='text' placeholder='Database Host (optional)' value=''><input id='dbUser' class='text less' type='text' placeholder='Database Username' value=''><input id='dbPassword' class='text more' type='password' placeholder='Database Password' value=''><br>Lychee will create its own database. If required, you can enter the name of an existing database instead:<input id='dbName' class='text less' type='text' placeholder='Database Name (optional)' value=''><input id='dbTablePrefix' class='text more' type='text' placeholder='Table prefix (optional)' value=''>", buttons, -235, false);
},
createLogin: function() {
var username,
password,
params,
buttons;
buttons = [
["Create Login", function() {
username = $(".message input.text#username").val();
password = $(".message input.text#password").val();
if (username.length<1||password.length<1) {
// Configuration failed
setTimeout(function() { setTimeout(function() {
// Connection failed
if (data.indexOf('Warning: Connection failed!')!==-1) {
buttons = [
['Retry', function() { setTimeout(settings.createConfig, 400) }],
['', function() {}]
];
modal.show('Connection Failed', 'Unable to connect to host database because access was denied. Double-check your host, username and password and ensure that access from your current location is permitted.', buttons, null, false);
return false;
}
// Creation failed
if (data.indexOf('Warning: Creation failed!')!==-1) {
buttons = [
['Retry', function() { setTimeout(settings.createConfig, 400) }],
['', function() {}]
];
modal.show('Creation Failed', 'Unable to create the database. Double-check your host, username and password and ensure that the specified user has the rights to modify and add content to the database.', buttons, null, false);
return false;
}
// Could not create file
if (data.indexOf('Warning: Could not create file!')!==-1) {
buttons = [
['Retry', function() { setTimeout(settings.createConfig, 400) }],
['', function() {}]
];
modal.show('Saving Failed', "Unable to save this configuration. Permission denied in <b>'data/'</b>. Please set the read, write and execute rights for others in <b>'data/'</b> and <b>'uploads/'</b>. Take a look the readme for more information.", buttons, null, false);
return false;
}
// Something went wrong
buttons = [ buttons = [
["Retry", function() { setTimeout(settings.createLogin, 400) }], ['Retry', function() { setTimeout(settings.createConfig, 400) }],
["", function() {}] ['', function() {}]
]; ];
modal.show("Wrong Input", "The username or password you entered is not long enough. Please try again with another username and password!", buttons, null, false); modal.show('Configuration Failed', 'Something unexpected happened. Please try again and check your installation and server. Take a look the readme for more information.', buttons, null, false);
return false; return false;
}, 400); }, 400);
} else { } else {
params = "setLogin&username=" + escape(username) + "&password=" + md5(password); // Configuration successful
lychee.api(params, function(data) { window.location.reload();
if (data!==true) {
setTimeout(function() {
buttons = [
["Retry", function() { setTimeout(settings.createLogin, 400) }],
["", function() {}]
];
modal.show("Creation Failed", "Unable to save login. Please try again with another username and password!", buttons, null, false);
return false;
}, 400);
}
});
} }
}], });
["", function() {}]
];
modal.show("Create Login", "Enter a username and password for your installation: <input id='username' class='text less' type='text' placeholder='New Username' value=''><input id='password' class='text' type='password' placeholder='New Password' value=''>", buttons, -122, false); }],
['', function() {}]
];
}, modal.show('Configuration', "Enter your database connection details below: <input id='dbHost' class='text less' type='text' placeholder='Database Host (optional)' value=''><input id='dbUser' class='text less' type='text' placeholder='Database Username' value=''><input id='dbPassword' class='text more' type='password' placeholder='Database Password' value=''><br>Lychee will create its own database. If required, you can enter the name of an existing database instead:<input id='dbName' class='text less' type='text' placeholder='Database Name (optional)' value=''><input id='dbTablePrefix' class='text more' type='text' placeholder='Table prefix (optional)' value=''>", buttons, -235, false);
setLogin: function() { }
var old_password, settings.createLogin = function() {
username,
password,
params,
buttons;
buttons = [ var username,
["Change Login", function() { password,
params,
buttons;
old_password = $(".message input.text#old_password").val(); buttons = [
username = $(".message input.text#username").val(); ['Create Login', function() {
password = $(".message input.text#password").val();
if (old_password.length<1) { username = $('.message input.text#username').val();
loadingBar.show("error", "Your old password was entered incorrectly. Please try again!"); password = $('.message input.text#password').val();
if (username.length<1||password.length<1) {
setTimeout(function() {
buttons = [
['Retry', function() { setTimeout(settings.createLogin, 400) }],
['', function() {}]
];
modal.show('Wrong Input', 'The username or password you entered is not long enough. Please try again with another username and password!', buttons, null, false);
return false; return false;
}
if (username.length<1) { }, 400);
loadingBar.show("error", "Your new username was entered incorrectly. Please try again!");
return false;
}
if (password.length<1) { } else {
loadingBar.show("error", "Your new password was entered incorrectly. Please try again!");
return false;
}
params = "setLogin&oldPassword=" + md5(old_password) + "&username=" + escape(username) + "&password=" + md5(password); params = 'setLogin&username=' + escape(username) + '&password=' + md5(password);
lychee.api(params, function(data) { lychee.api(params, function(data) {
if (data!==true) lychee.error(null, params, data); if (data!==true) {
setTimeout(function() {
buttons = [
['Retry', function() { setTimeout(settings.createLogin, 400) }],
['', function() {}]
];
modal.show('Creation Failed', 'Unable to save login. Please try again with another username and password!', buttons, null, false);
return false;
}, 400);
}
}); });
}], }
["Cancel", function() {}]
];
modal.show("Change Login", "Enter your current password: <input id='old_password' class='text more' type='password' placeholder='Current Password' value=''><br>Your username and password will be changed to the following: <input id='username' class='text less' type='text' placeholder='New Username' value=''><input id='password' class='text' type='password' placeholder='New Password' value=''>", buttons, -171); }],
['', function() {}]
];
}, modal.show('Create Login', "Enter a username and password for your installation: <input id='username' class='text less' type='text' placeholder='New Username' value=''><input id='password' class='text' type='password' placeholder='New Password' value=''>", buttons, -122, false);
setSorting: function() { }
var buttons, settings.setLogin = function() {
sorting,
params;
buttons = [ var old_password,
["Change Sorting", function() { username,
password,
params,
buttons;
sorting[0] = $("select#settings_type").val(); buttons = [
sorting[1] = $("select#settings_order").val(); ['Change Login', function() {
albums.refresh(); old_password = $('.message input.text#old_password').val();
username = $('.message input.text#username').val();
password = $('.message input.text#password').val();
params = "setSorting&type=" + sorting[0] + "&order=" + sorting[1]; if (old_password.length<1) {
lychee.api(params, function(data) { loadingBar.show('error', 'Your old password was entered incorrectly. Please try again!');
return false;
}
if (data===true) { if (username.length<1) {
lychee.sorting = "ORDER BY " + sorting[0] + " " + sorting[1]; loadingBar.show('error', 'Your new username was entered incorrectly. Please try again!');
lychee.load(); return false;
} else lychee.error(null, params, data); }
}); if (password.length<1) {
loadingBar.show('error', 'Your new password was entered incorrectly. Please try again!');
return false;
}
}], params = 'setLogin&oldPassword=' + md5(old_password) + '&username=' + escape(username) + '&password=' + md5(password);
["Cancel", function() {}] lychee.api(params, function(data) {
];
modal.show("Change Sorting",
"Sort photos by \
<select id='settings_type'> \
<option value='id'>Upload Time</option> \
<option value='takestamp'>Take Date</option> \
<option value='title'>Title</option> \
<option value='description'>Description</option> \
<option value='public'>Public</option> \
<option value='star'>Star</option> \
<option value='type'>Photo Format</option> \
</select> \
in an \
<select id='settings_order'> \
<option value='ASC'>Ascending</option> \
<option value='DESC'>Descending</option> \
</select> \
order.\
", buttons);
if (lychee.sorting!=="") { if (data!==true) lychee.error(null, params, data);
sorting = lychee.sorting.replace("ORDER BY ", "").split(" "); });
$("select#settings_type").val(sorting[0]); }],
$("select#settings_order").val(sorting[1]); ['Cancel', function() {}]
];
} modal.show('Change Login', "Enter your current password: <input id='old_password' class='text more' type='password' placeholder='Current Password' value=''><br>Your username and password will be changed to the following: <input id='username' class='text less' type='text' placeholder='New Username' value=''><input id='password' class='text' type='password' placeholder='New Password' value=''>", buttons, -171);
}, }
setDropboxKey: function(callback) { settings.setSorting = function() {
var buttons, var buttons,
params, sorting,
key; params;
buttons = [ buttons = [
["Set Key", function() { ['Change Sorting', function() {
key = $(".message input.text#key").val(); sorting[0] = $('select#settings_type').val();
sorting[1] = $('select#settings_order').val();
params = "setDropboxKey&key=" + key; albums.refresh();
lychee.api(params, function(data) {
if (data===true) { params = 'setSorting&type=' + sorting[0] + '&order=' + sorting[1];
lychee.dropboxKey = key; lychee.api(params, function(data) {
if (callback) lychee.loadDropbox(callback);
} else lychee.error(null, params, data);
}); if (data===true) {
lychee.sorting = 'ORDER BY ' + sorting[0] + ' ' + sorting[1];
lychee.load();
} else lychee.error(null, params, data);
}], });
["Cancel", function() {}]
];
modal.show("Set Dropbox Key", "In order to import photos from your Dropbox, you need a valid drop-ins app key from <a href='https://www.dropbox.com/developers/apps/create'>their website</a>. Generate yourself a personal key and enter it below: <input id='key' class='text' type='text' placeholder='Dropbox API Key' value='" + lychee.dropboxKey + "'>", buttons); }],
['Cancel', function() {}]
];
modal.show('Change Sorting',
"Sort photos by \
<select id='settings_type'> \
<option value='id'>Upload Time</option> \
<option value='takestamp'>Take Date</option> \
<option value='title'>Title</option> \
<option value='description'>Description</option> \
<option value='public'>Public</option> \
<option value='star'>Star</option> \
<option value='type'>Photo Format</option> \
</select> \
in an \
<select id='settings_order'> \
<option value='ASC'>Ascending</option> \
<option value='DESC'>Descending</option> \
</select> \
order.\
", buttons);
if (lychee.sorting!=='') {
sorting = lychee.sorting.replace('ORDER BY ', '').split(' ');
$('select#settings_type').val(sorting[0]);
$('select#settings_order').val(sorting[1]);
} }
}; }
settings.setDropboxKey = function(callback) {
var buttons,
params,
key;
buttons = [
['Set Key', function() {
key = $('.message input.text#key').val();
params = 'setDropboxKey&key=' + key;
lychee.api(params, function(data) {
if (data===true) {
lychee.dropboxKey = key;
if (callback) lychee.loadDropbox(callback);
} else lychee.error(null, params, data);
});
}],
['Cancel', function() {}]
];
modal.show('Set Dropbox Key', "In order to import photos from your Dropbox, you need a valid drop-ins app key from <a href='https://www.dropbox.com/developers/apps/create'>their website</a>. Generate yourself a personal key and enter it below: <input id='key' class='text' type='text' placeholder='Dropbox API Key' value='" + lychee.dropboxKey + "'>", buttons);
}

View File

@ -9,57 +9,57 @@ visible = {}
visible.albums = function() { visible.albums = function() {
if ($('#tools_albums').css('display')==='block') return true; if ($('#tools_albums').css('display')==='block') return true;
else return false; return false;
} }
visible.album = function() { visible.album = function() {
if ($('#tools_album').css('display')==='block') return true; if ($('#tools_album').css('display')==='block') return true;
else return false; return false;
} }
visible.photo = function() { visible.photo = function() {
if ($('#imageview.fadeIn').length>0) return true; if ($('#imageview.fadeIn').length>0) return true;
else return false; return false;
} }
visible.search = function() { visible.search = function() {
if (search.code!==null&&search.code!=='') return true; if (search.code!==null&&search.code!=='') return true;
else return false; return false;
} }
visible.infobox = function() { visible.infobox = function() {
if ($('#infobox.active').length>0) return true; if ($('#infobox.active').length>0) return true;
else return false; return false;
} }
visible.infoboxbutton = function() { visible.infoboxbutton = function() {
if (visible.albums()) return false; if (visible.albums()) return false;
if (visible.photo()) return true; if (visible.photo()) return true;
if (visible.album()&&$('#button_info_album:visible').length>0) return true; if (visible.album()&&$('#button_info_album:visible').length>0) return true;
else return false; return false;
} }
visible.controls = function() { visible.controls = function() {
if (lychee.loadingBar.css('opacity')<1) return false; if (lychee.loadingBar.css('opacity')<1) return false;
else return true; return true;
} }
visible.message = function() { visible.message = function() {
if ($('.message').length>0) return true; if ($('.message').length>0) return true;
else return false; return false;
} }
visible.signin = function() { visible.signin = function() {
if ($('.message .sign_in').length>0) return true; if ($('.message .sign_in').length>0) return true;
else return false; return false;
} }
visible.contextMenu = function() { visible.contextMenu = function() {
if ($('.contextContainer').length>0) return true; if ($('.contextContainer').length>0) return true;
else return false; return false;
} }
visible.multiselect = function() { visible.multiselect = function() {
if ($('#multiselect').length>0) return true; if ($('#multiselect').length>0) return true;
else return false; return false;
} }