Updated modals to work with the new basicModal (data-name => name)

src/scripts/album.js

@@ -138,7 +138,7 @@ album.add = function() {
 	}
 
 	basicModal.show({
-		body: "<p>Enter a title for the new album: <input class='text' data-name='title' type='text' maxlength='50' placeholder='Title' value='Untitled'></p>",
+		body: "<p>Enter a title for the new album: <input class='text' name='title' type='text' maxlength='50' placeholder='Title' value='Untitled'></p>",
 		buttons: {
 			action: {
 				title: 'Create Album',
@@ -306,7 +306,7 @@ album.setTitle = function(albumIDs) {
 
 	}
 
-	input = "<input class='text' data-name='title' type='text' maxlength='50' placeholder='Title' value='" + oldTitle + "'>";
+	input = "<input class='text' name='title' type='text' maxlength='50' placeholder='Title' value='" + oldTitle + "'>";
 
 	if (albumIDs.length===1)	msg = "<p>Enter a new title for this album: " + input + "</p>";
 	else						msg = "<p>Enter a title for all " + albumIDs.length + " selected albums: " + input +"</p>";
@@ -361,7 +361,7 @@ album.setDescription = function(albumID) {
 	}
 
 	basicModal.show({
-		body: "<p>Please enter a description for this album: <input class='text' data-name='description' type='text' maxlength='800' placeholder='Description' value='" + oldDescription + "'></p>",
+		body: "<p>Please enter a description for this album: <input class='text' name='description' type='text' maxlength='800' placeholder='Description' value='" + oldDescription + "'></p>",
 		buttons: {
 			action: {
 				title: 'Set Description',
@@ -431,7 +431,7 @@ album.setPublic = function(albumID, modal, e) {
 							<span class='label'>Password protected</span>
 						</label>
 						<p>Only accessible with a valid password.</p>
-						<input class='text' data-name='password' type='password' placeholder='password' value=''>
+						<input class='text' name='passwordtext' type='password' placeholder='password' value=''>
 					</div>
 				</form>
 				`
@@ -457,8 +457,8 @@ album.setPublic = function(albumID, modal, e) {
 
 		$('.basicModal .choice input[name="password"]').on('change', function() {
 
-			if ($(this).prop('checked')===true)	$('.basicModal .choice input[data-name="password"]').show().focus();
-			else								$('.basicModal .choice input[data-name="password"]').hide();
+			if ($(this).prop('checked')===true)	$('.basicModal .choice input[name="passwordtext"]').show().focus();
+			else								$('.basicModal .choice input[name="passwordtext"]').hide();
 
 		});
 
@@ -482,7 +482,7 @@ album.setPublic = function(albumID, modal, e) {
 
 		// Set password
 		if ($('.basicModal .choice input[name="password"]:checked').length===1) {
-			password			= $('.basicModal .choice input[data-name="password"]').val();
+			password			= $('.basicModal .choice input[name="passwordtext"]').val();
 			album.json.password	= '1';
 		} else {
 			password			= '';

src/scripts/lychee.js

@@ -127,8 +127,8 @@ lychee.loginDialog = function() {
 
 	msg =	`
 			<p class='signIn'>
-				<input class='text' name='username' autocomplete='username' data-name='username' type='text' value='' placeholder='username' autocapitalize='off' autocorrect='off'>
-				<input class='text' name='password' autocomplete='current-password' data-name='password' type='password' value='' placeholder='password'>
+				<input class='text' name='username' autocomplete='username' type='text' value='' placeholder='username' autocapitalize='off' autocorrect='off'>
+				<input class='text' name='password' autocomplete='current-password' type='password' value='' placeholder='password'>
 			</p>
 			<p class='version'>Lychee ${ lychee.version }<span> &#8211; <a target='_blank' href='${ lychee.updateURL }'>Update available!</a><span></p>
 			`
@@ -150,8 +150,8 @@ lychee.loginDialog = function() {
 	if (localStorage) {
 		localUsername = localStorage.getItem('lychee_username');
 		if (localUsername!==null) {
-			if (localUsername.length>0) $('.basicModal input[data-name="username"]').val(localUsername);
-			$('.basicModal input[data-name="password"]').focus();
+			if (localUsername.length>0) $('.basicModal input[name="username"]').val(localUsername);
+			$('.basicModal input[name="password"]').focus();
 		}
 	}
 

src/scripts/password.js

@@ -9,10 +9,9 @@ password = {
 
 }
 
-password.get = function(albumID, callback) {
+password.get = function(albumID, callback, passwd) {
 
-	var passwd = $('.basicModal input.text').val(),
-		params;
+	var params;
 
 	if (lychee.publicMode===false)									callback();
 	else if (album.json&&album.json.password==='0')					callback();
@@ -23,7 +22,7 @@ password.get = function(albumID, callback) {
 		album.json = {password: true};
 		callback('');
 
-	} else if (passwd==undefined) {
+	} else if (passwd==null) {
 
 		// Request password
 		password.getDialog(albumID, callback);
@@ -59,7 +58,7 @@ password.getDialog = function(albumID, callback) {
 		cancel,
 		msg = '';
 
-	action = function() { password.get(albumID, callback) }
+	action = function(data) { password.get(albumID, callback, data.password) }
 
 	cancel = function() {
 		basicModal.close();
@@ -69,7 +68,7 @@ password.getDialog = function(albumID, callback) {
 	msg =	`
 			<p>
 				This album is protected by a password. Enter the password below to view the photos of this album:
-				<input data-name='password' class='text' type='password' placeholder='password' value=''>
+				<input name='password' class='text' type='password' placeholder='password' value=''>
 			</p>
 			`
 

src/scripts/photo.js

@@ -330,7 +330,7 @@ photo.setTitle = function(photoIDs) {
 
 	}
 
-	input = "<input class='text' data-name='title' type='text' maxlength='50' placeholder='Title' value='" + oldTitle + "'>";
+	input = "<input class='text' name='title' type='text' maxlength='50' placeholder='Title' value='" + oldTitle + "'>";
 
 	if (photoIDs.length===1)	msg = "<p>Enter a new title for this photo: " + input + "</p>";
 	else						msg = "<p>Enter a title for all " + photoIDs.length + " selected photos: " + input + "</p>";
@@ -509,7 +509,7 @@ photo.setDescription = function(photoID) {
 	}
 
 	basicModal.show({
-		body: "<p>Enter a description for this photo: <input class='text' data-name='description' type='text' maxlength='800' placeholder='Description' value='" + oldDescription + "'></p>",
+		body: "<p>Enter a description for this photo: <input class='text' name='description' type='text' maxlength='800' placeholder='Description' value='" + oldDescription + "'></p>",
 		buttons: {
 			action: {
 				title: 'Set Description',
@@ -556,7 +556,7 @@ photo.editTags = function(photoIDs) {
 
 	}
 
-	input = "<input class='text' data-name='tags' type='text' maxlength='800' placeholder='Tags' value='" + oldTags + "'>";
+	input = "<input class='text' name='tags' type='text' maxlength='800' placeholder='Tags' value='" + oldTags + "'>";
 
 	if (photoIDs.length===1)	msg = "<p>Enter your tags for this photo. You can add multiple tags by separating them with a comma: " + input + "</p>";
 	else						msg = "<p>Enter your tags for all " + photoIDs.length + " selected photos. Existing tags will be overwritten. You can add multiple tags by separating them with a comma: " + input + "</p>";

src/scripts/settings.js

@@ -117,14 +117,14 @@ settings.createConfig = function() {
 	msg =	`
 			<p>
 				Enter your database connection details below:
-				<input data-name='dbHost' class='text' type='text' placeholder='Database Host (optional)' value=''>
-				<input data-name='dbUser' class='text' type='text' placeholder='Database Username' value=''>
-				<input data-name='dbPassword' class='text' type='password' placeholder='Database Password' value=''>
+				<input name='dbHost' class='text' type='text' placeholder='Database Host (optional)' value=''>
+				<input name='dbUser' class='text' type='text' placeholder='Database Username' value=''>
+				<input name='dbPassword' class='text' type='password' placeholder='Database Password' value=''>
 			</p>
 			<p>
 				Lychee will create its own database. If required, you can enter the name of an existing database instead:
-				<input data-name='dbName' class='text' type='text' placeholder='Database Name (optional)' value=''>
-				<input data-name='dbTablePrefix' class='text' type='text' placeholder='Table prefix (optional)' value=''>
+				<input name='dbName' class='text' type='text' placeholder='Database Name (optional)' value=''>
+				<input name='dbTablePrefix' class='text' type='text' placeholder='Table prefix (optional)' value=''>
 			</p>
 			`
 
@@ -191,8 +191,8 @@ settings.createLogin = function() {
 	msg =	`
 			<p>
 				Enter a username and password for your installation:
-				<input data-name='username' class='text' type='text' placeholder='New Username' value=''>
-				<input data-name='password' class='text' type='password' placeholder='New Password' value=''>
+				<input name='username' class='text' type='text' placeholder='New Username' value=''>
+				<input name='password' class='text' type='password' placeholder='New Password' value=''>
 			</p>
 			`
 
@@ -254,12 +254,12 @@ settings.setLogin = function() {
 	msg =	`
 			<p>
 				Enter your current password:
-				<input data-name='oldPassword' class='text' type='password' placeholder='Current Password' value=''>
+				<input name='oldPassword' class='text' type='password' placeholder='Current Password' value=''>
 			</p>
 			<p>
 				Your username and password will be changed to the following:
-				<input data-name='username' class='text' type='text' placeholder='New Username' value=''>
-				<input data-name='password' class='text' type='password' placeholder='New Password' value=''>
+				<input name='username' class='text' type='text' placeholder='New Username' value=''>
+				<input name='password' class='text' type='password' placeholder='New Password' value=''>
 			</p>
 			`
 
@@ -426,7 +426,7 @@ settings.setDropboxKey = function(callback) {
 	msg =	`
 			<p>
 				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 class='text' data-name='key' type='text' placeholder='Dropbox API Key' value='${ lychee.dropboxKey }'>
+				<input class='text' name='key' type='text' placeholder='Dropbox API Key' value='${ lychee.dropboxKey }'>
 			</p>
 			`
 

src/scripts/upload.js

@@ -322,7 +322,7 @@ upload.start = {
 		}
 
 		basicModal.show({
-			body: "<p>Please enter the direct link to a photo to import it: <input class='text' data-name='link' type='text' placeholder='http://' value='" + url + "'></p>",
+			body: "<p>Please enter the direct link to a photo to import it: <input class='text' name='link' type='text' placeholder='http://' value='" + url + "'></p>",
 			buttons: {
 				action: {
 					title: 'Import',
@@ -389,7 +389,7 @@ upload.start = {
 		}
 
 		basicModal.show({
-			body: "<p>This action will import all photos, folders and sub-folders which are located in the following directory. The <b>original files will be deleted</b> after the import when possible. <input class='text' data-name='path' type='text' maxlength='100' placeholder='Absolute path to directory' value='" + lychee.location + "uploads/import/'></p>",
+			body: "<p>This action will import all photos, folders and sub-folders which are located in the following directory. The <b>original files will be deleted</b> after the import when possible. <input class='text' name='path' type='text' maxlength='100' placeholder='Absolute path to directory' value='" + lychee.location + "uploads/import/'></p>",
 			buttons: {
 				action: {
 					title: 'Import',