New dialog for upload, removed unused code
This commit is contained in:
Tobias Reich
parent
2d7aa7e247
commit
f8bf8df5cc
BIN
dist/main.css
vendored
BIN
dist/main.css
vendored
Binary file not shown.
BIN
dist/main.js
vendored
BIN
dist/main.js
vendored
Binary file not shown.
BIN
dist/view.js
vendored
BIN
dist/view.js
vendored
Binary file not shown.
@ -152,11 +152,8 @@ build.no_content = (typ) ->
|
||||
build.uploadModal = (title, files) ->
|
||||
|
||||
html = """
|
||||
<div class='upload_overlay fadeIn'>
|
||||
<div class='upload_message center'>
|
||||
<h1>#{ title }</h1>
|
||||
<a class='close icon-remove-sign'></a>
|
||||
<div class='rows'>
|
||||
<h1>#{ title }</h1>
|
||||
<div class='rows'>
|
||||
"""
|
||||
|
||||
i = 0
|
||||
@ -185,8 +182,6 @@ build.uploadModal = (title, files) ->
|
||||
i++
|
||||
|
||||
html += """
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
"""
|
||||
|
||||
|
||||
@ -163,7 +163,6 @@ $(document).ready(function() {
|
||||
|
||||
/* Upload */
|
||||
.on('change', '#upload_files', function() { basicModal.close(); upload.start.local(this.files) })
|
||||
.on(eventName, '.upload_message a.close', upload.close)
|
||||
.on('dragover', function(e) { e.preventDefault(); }, false)
|
||||
.on('drop', function(e) {
|
||||
|
||||
|
||||
@ -88,7 +88,6 @@ lychee.api = function(params, callback) {
|
||||
if (typeof data==='string'&&
|
||||
data.substring(0, 7)==='Error: ') {
|
||||
lychee.error(data.substring(7, data.length), params, data);
|
||||
upload.close(true);
|
||||
return false;
|
||||
}
|
||||
|
||||
@ -110,7 +109,6 @@ lychee.api = function(params, callback) {
|
||||
error: function(jqXHR, textStatus, errorThrown) {
|
||||
|
||||
lychee.error('Server error or API not found.', params, errorThrown);
|
||||
upload.close(true);
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
@ -7,11 +7,17 @@ upload = {}
|
||||
|
||||
upload.show = function(title, files, callback) {
|
||||
|
||||
upload.close(true);
|
||||
|
||||
$('body').append(build.uploadModal(title, files));
|
||||
|
||||
if (callback!==null&&callback!==undefined) callback();
|
||||
basicModal.show({
|
||||
body: build.uploadModal(title, files),
|
||||
buttons: {
|
||||
action: {
|
||||
title: 'Close',
|
||||
class: 'hidden',
|
||||
fn: basicModal.close
|
||||
}
|
||||
},
|
||||
callback
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
@ -53,13 +59,13 @@ upload.start = {
|
||||
if (error===false) {
|
||||
|
||||
// Success
|
||||
upload.close();
|
||||
basicModal.close();
|
||||
upload.notify('Upload complete');
|
||||
|
||||
} else {
|
||||
|
||||
// Error
|
||||
$('.upload_message a.close').show();
|
||||
$('.basicModal #basicModal__action.hidden').show();
|
||||
upload.notify('Upload complete', 'Failed to upload one or more photos.');
|
||||
|
||||
}
|
||||
@ -118,21 +124,21 @@ upload.start = {
|
||||
if (xhr.status===200&&xhr.responseText==='1') {
|
||||
|
||||
// Success
|
||||
$('.upload_message .rows .row:nth-child(' + (file.num+1) + ') .status')
|
||||
$('.basicModal .rows .row:nth-child(' + (file.num+1) + ') .status')
|
||||
.html('Finished')
|
||||
.addClass('success');
|
||||
|
||||
} else {
|
||||
|
||||
// Error
|
||||
$('.upload_message .rows .row:nth-child(' + (file.num+1) + ') .status')
|
||||
$('.basicModal .rows .row:nth-child(' + (file.num+1) + ') .status')
|
||||
.html('Error')
|
||||
.addClass('error');
|
||||
|
||||
if (xhr.responseText.substr(0, 6)==='Error:') errorText = xhr.responseText.substr(6) + ' Please take a look at the console of your browser for further details.';
|
||||
else errorText = 'Server returned an unknown response. Please take a look at the console of your browser for further details.';
|
||||
|
||||
$('.upload_message .rows .row:nth-child(' + (file.num+1) + ') p.notice')
|
||||
$('.basicModal .rows .row:nth-child(' + (file.num+1) + ') p.notice')
|
||||
.html(errorText)
|
||||
.show();
|
||||
|
||||
@ -168,7 +174,7 @@ upload.start = {
|
||||
|
||||
// Set progress when progress has changed
|
||||
if (progress>pre_progress) {
|
||||
$('.upload_message .rows .row:nth-child(' + (file.num+1) + ') .status').html(progress + '%');
|
||||
$('.basicModal .rows .row:nth-child(' + (file.num+1) + ') .status').html(progress + '%');
|
||||
pre_progress = progress;
|
||||
}
|
||||
|
||||
@ -177,10 +183,10 @@ upload.start = {
|
||||
// Scroll to the uploading file
|
||||
var scrollPos = 0;
|
||||
if ((file.num+1)>4) scrollPos = (file.num + 1 - 4) * 40
|
||||
$('.upload_message .rows').scrollTop(scrollPos);
|
||||
$('.basicModal .rows').scrollTop(scrollPos);
|
||||
|
||||
// Set status to processing
|
||||
$('.upload_message .rows .row:nth-child(' + (file.num+1) + ') .status').html('Processing');
|
||||
$('.basicModal .rows .row:nth-child(' + (file.num+1) + ') .status').html('Processing');
|
||||
|
||||
// Upload next file
|
||||
if (file.next!==null) process(files, file.next);
|
||||
@ -219,10 +225,12 @@ upload.start = {
|
||||
|
||||
window.onbeforeunload = function() { return 'Lychee is currently uploading!'; };
|
||||
|
||||
upload.show('Uploading', files);
|
||||
upload.show('Uploading', files, function() {
|
||||
|
||||
// Upload first file
|
||||
process(files, files[0]);
|
||||
// Upload first file
|
||||
process(files, files[0]);
|
||||
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
@ -235,14 +243,13 @@ upload.start = {
|
||||
|
||||
action = function(data) {
|
||||
|
||||
var params,
|
||||
extension,
|
||||
var extension,
|
||||
files = [];
|
||||
|
||||
basicModal.close();
|
||||
|
||||
if (data.link&&data.link.length>3) {
|
||||
|
||||
basicModal.close();
|
||||
|
||||
extension = data.link.split('.').pop();
|
||||
if (extension!=='jpeg'&&extension!=='jpg'&&extension!=='png'&&extension!=='gif'&&extension!=='webp') {
|
||||
loadingBar.show('error', 'The file format of this link is not supported.');
|
||||
@ -255,30 +262,34 @@ upload.start = {
|
||||
}
|
||||
|
||||
upload.show('Importing URL', files, function() {
|
||||
$('.upload_message .rows .row .status').html('Importing');
|
||||
});
|
||||
|
||||
params = 'importUrl&url=' + escape(encodeURI(data.link)) + '&albumID=' + albumID;
|
||||
lychee.api(params, function(data) {
|
||||
var params;
|
||||
|
||||
upload.close();
|
||||
upload.notify('Import complete');
|
||||
$('.basicModal .rows .row .status').html('Importing');
|
||||
|
||||
albums.refresh();
|
||||
params = 'importUrl&url=' + escape(encodeURI(data.link)) + '&albumID=' + albumID;
|
||||
lychee.api(params, function(data) {
|
||||
|
||||
if (album.getID()===false) lychee.goto('0');
|
||||
else album.load(albumID);
|
||||
basicModal.close();
|
||||
upload.notify('Import complete');
|
||||
|
||||
if (data!==true) lychee.error(null, params, data);
|
||||
albums.refresh();
|
||||
|
||||
if (album.getID()===false) lychee.goto('0');
|
||||
else album.load(albumID);
|
||||
|
||||
if (data!==true) lychee.error(null, params, data);
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
} else loadingBar.show('error', 'Link to short or too long. Please try another one!');
|
||||
} else basicModal.error('link');
|
||||
|
||||
}
|
||||
|
||||
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='http://'></p>",
|
||||
body: "<p>Please enter the direct link to a photo to import it: <input class='text' data-name='link' type='text' placeholder='http://' value=''></p>",
|
||||
buttons: {
|
||||
action: {
|
||||
title: 'Import',
|
||||
@ -302,10 +313,7 @@ upload.start = {
|
||||
|
||||
action = function(data) {
|
||||
|
||||
var params,
|
||||
files = [];
|
||||
|
||||
basicModal.close();
|
||||
var files = [];
|
||||
|
||||
files[0] = {
|
||||
name: data.path,
|
||||
@ -313,27 +321,31 @@ upload.start = {
|
||||
};
|
||||
|
||||
upload.show('Importing from server', files, function() {
|
||||
$('.upload_message .rows .row .status').html('Importing');
|
||||
});
|
||||
|
||||
params = 'importServer&albumID=' + albumID + '&path=' + escape(encodeURI(data.path));
|
||||
lychee.api(params, function(data) {
|
||||
var params;
|
||||
|
||||
upload.close();
|
||||
upload.notify('Import complete');
|
||||
$('.basicModal .rows .row .status').html('Importing');
|
||||
|
||||
albums.refresh();
|
||||
params = 'importServer&albumID=' + albumID + '&path=' + escape(encodeURI(data.path));
|
||||
lychee.api(params, function(data) {
|
||||
|
||||
if (data==='Notice: Import only contains albums!') {
|
||||
if (visible.albums()) lychee.load();
|
||||
else lychee.goto('');
|
||||
}
|
||||
else if (album.getID()===false) lychee.goto('0');
|
||||
else album.load(albumID);
|
||||
basicModal.close();
|
||||
upload.notify('Import complete');
|
||||
|
||||
if (data==='Notice: Import only contains albums!') return true;
|
||||
else if (data==='Warning: Folder empty!') lychee.error('Folder empty. No photos imported!', params, data);
|
||||
else if (data!==true) lychee.error(null, params, data);
|
||||
albums.refresh();
|
||||
|
||||
if (data==='Notice: Import only contains albums!') {
|
||||
if (visible.albums()) lychee.load();
|
||||
else lychee.goto('');
|
||||
}
|
||||
else if (album.getID()===false) lychee.goto('0');
|
||||
else album.load(albumID);
|
||||
|
||||
if (data==='Notice: Import only contains albums!') return true;
|
||||
else if (data==='Warning: Folder empty!') lychee.error('Folder empty. No photos imported!', params, data);
|
||||
else if (data!==true) lychee.error(null, params, data);
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
@ -358,65 +370,60 @@ upload.start = {
|
||||
dropbox: function() {
|
||||
|
||||
var albumID = album.getID(),
|
||||
params,
|
||||
links = '';
|
||||
links = '',
|
||||
success;
|
||||
|
||||
if (albumID===false) albumID = 0;
|
||||
|
||||
success = function(files) {
|
||||
|
||||
for (var i = 0; i < files.length; i++) {
|
||||
|
||||
links += files[i].link + ',';
|
||||
|
||||
files[i] = {
|
||||
name: files[i].link,
|
||||
supported: true
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
// Remove last comma
|
||||
links = links.substr(0, links.length-1);
|
||||
|
||||
upload.show('Importing from Dropbox', files, function() {
|
||||
|
||||
var params;
|
||||
|
||||
$('.basicModal .rows .row .status').html('Importing');
|
||||
|
||||
params = 'importUrl&url=' + escape(links) + '&albumID=' + albumID;
|
||||
lychee.api(params, function(data) {
|
||||
|
||||
basicModal.close();
|
||||
upload.notify('Import complete');
|
||||
|
||||
albums.refresh();
|
||||
|
||||
if (album.getID()===false) lychee.goto('0');
|
||||
else album.load(albumID);
|
||||
|
||||
if (data!==true) lychee.error(null, params, data);
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
lychee.loadDropbox(function() {
|
||||
Dropbox.choose({
|
||||
linkType: 'direct',
|
||||
multiselect: true,
|
||||
success: function(files) {
|
||||
|
||||
for (var i = 0; i < files.length; i++) {
|
||||
|
||||
links += files[i].link + ',';
|
||||
|
||||
files[i] = {
|
||||
name: files[i].link,
|
||||
supported: true
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
// Remove last comma
|
||||
links = links.substr(0, links.length-1);
|
||||
|
||||
upload.show('Importing from Dropbox', files, function() {
|
||||
$('.upload_message .rows .row .status').html('Importing');
|
||||
});
|
||||
|
||||
params = 'importUrl&url=' + escape(links) + '&albumID=' + albumID;
|
||||
lychee.api(params, function(data) {
|
||||
|
||||
upload.close();
|
||||
upload.notify('Import complete');
|
||||
|
||||
albums.refresh();
|
||||
|
||||
if (album.getID()===false) lychee.goto('0');
|
||||
else album.load(albumID);
|
||||
|
||||
if (data!==true) lychee.error(null, params, data);
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
success
|
||||
});
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
upload.close = function(force) {
|
||||
|
||||
if (force===true) {
|
||||
$('.upload_overlay').remove();
|
||||
} else {
|
||||
$('.upload_overlay').removeClass('fadeIn').css('opacity', 0);
|
||||
setTimeout(function() { $('.upload_overlay').remove() }, 300);
|
||||
}
|
||||
|
||||
}
|
||||
@ -8,13 +8,11 @@
|
||||
margin: 0 20% !important;
|
||||
width: 40% !important;
|
||||
}
|
||||
|
||||
#title.view {
|
||||
margin: 0 20% !important;
|
||||
width: 60% !important;
|
||||
}
|
||||
#title span {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
}
|
||||
@media only screen and (max-width: 640px) {
|
||||
@ -22,19 +20,12 @@
|
||||
#title {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#title.view {
|
||||
display: block !important;
|
||||
width: 70% !important;
|
||||
margin: 0 20% 0 10% !important;
|
||||
}
|
||||
#button_move {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.center {
|
||||
top: 0 !important;
|
||||
left: 0 !important;
|
||||
}
|
||||
|
||||
.album, .photo {
|
||||
margin: 40px 0 0 50px !important;
|
||||
@ -44,21 +35,4 @@
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.message {
|
||||
position: fixed !important;
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
margin: 1px 0 0 0 !important;
|
||||
border-radius: 0 !important;
|
||||
|
||||
/* Animation */
|
||||
animation: moveUp .3s !important;
|
||||
}
|
||||
|
||||
.upload_message {
|
||||
margin-top: 0 !important;
|
||||
margin-left: 0 !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
}
|
||||
@ -9,7 +9,6 @@
|
||||
.basicModal {
|
||||
|
||||
background: linear-gradient(to bottom, #444, #333);
|
||||
|
||||
border: 1px solid black(.7);
|
||||
border-bottom: 1px solid black(.8);
|
||||
box-shadow: 0 1px 4px black(.2), inset 0 1px 0 white(.05);
|
||||
@ -66,6 +65,8 @@
|
||||
|
||||
&#basicModal__action.red { color: $colorRed; }
|
||||
|
||||
&.hidden { display: none; }
|
||||
|
||||
}
|
||||
|
||||
/* Inputs ------------------------------------------------*/
|
||||
@ -179,4 +180,80 @@
|
||||
span a { color: #888; }
|
||||
}
|
||||
|
||||
/* Title ------------------------------------------------*/
|
||||
h1 {
|
||||
float: left;
|
||||
width: 100%;
|
||||
padding: 12px 0;
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
text-shadow: $shadow;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* Rows ------------------------------------------------*/
|
||||
.rows {
|
||||
margin: 0 8px 8px;
|
||||
width: calc(100% - 16px);
|
||||
height: 300px;
|
||||
background-color: black(.4);
|
||||
overflow: hidden;
|
||||
overflow-y: scroll;
|
||||
border-radius: 3px;
|
||||
box-shadow: inset 0 0 3px black(.4);
|
||||
}
|
||||
|
||||
/* Row ------------------------------------------------*/
|
||||
.rows .row {
|
||||
float: left;
|
||||
padding: 8px 0;
|
||||
width: 100%;
|
||||
background-color: white(.02);
|
||||
|
||||
&:nth-child(2n) { background-color: white(0); }
|
||||
|
||||
a.name {
|
||||
float: left;
|
||||
padding: 5px 10px;
|
||||
width: calc(70% - 20px);
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
a.status {
|
||||
float: left;
|
||||
padding: 5px 10px;
|
||||
width: calc(30% - 20px);
|
||||
color: white(.5);
|
||||
font-size: 14px;
|
||||
text-align: right;
|
||||
|
||||
animation-name: pulse;
|
||||
animation-duration: 2s;
|
||||
animation-timing-function: ease-in-out;
|
||||
animation-iteration-count: infinite;
|
||||
|
||||
&.error,
|
||||
&.success { animation: none; }
|
||||
|
||||
&.error { color: rgb(213, 24, 24); }
|
||||
|
||||
&.success { color: rgb(42, 213, 0); }
|
||||
}
|
||||
|
||||
p.notice {
|
||||
display: none;
|
||||
float: left;
|
||||
padding: 2px 10px 5px;
|
||||
width: calc(100% - 20px);
|
||||
color: white(.5);
|
||||
font-size: 12px;
|
||||
overflow: hidden;
|
||||
line-height: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@ -1,125 +0,0 @@
|
||||
/**
|
||||
* @copyright 2014 by Tobias Reich
|
||||
*/
|
||||
|
||||
#upload {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.upload_overlay {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background-color: black(.85);
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.upload_message {
|
||||
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
width: 450px;
|
||||
margin-left: -225px;
|
||||
margin-top: -170px;
|
||||
background-image: linear-gradient(to bottom, rgb(75, 75, 75), rgb(45, 45, 45));
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 0 5px #000, inset 0 1px 0 white(.08);
|
||||
animation-name: moveUp;
|
||||
animation-duration: .3s;
|
||||
animation-timing-function: $timingBounce;
|
||||
|
||||
/* Header ------------------------------------------------*/
|
||||
h1 {
|
||||
float: left;
|
||||
width: 100%;
|
||||
padding: 12px 0;
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
text-shadow: 0px -1px 0px black(.3);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.close {
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
padding: 11px 14px 6px 7px;
|
||||
color: #aaa;
|
||||
font-size: 20px;
|
||||
text-shadow: 0px -1px 0px black(.3);
|
||||
cursor: pointer;
|
||||
|
||||
&:hover { color: #fff; }
|
||||
}
|
||||
|
||||
/* Rows ------------------------------------------------*/
|
||||
.rows {
|
||||
float: left;
|
||||
margin: 3px 8px 8px 8px;
|
||||
width: calc(100% - 16px);
|
||||
height: 300px;
|
||||
background-color: black(.5);
|
||||
overflow: hidden;
|
||||
overflow-y: scroll;
|
||||
border-radius: 3px;
|
||||
box-shadow: inset 0 0 3px black(.8);
|
||||
}
|
||||
|
||||
/* Row ------------------------------------------------*/
|
||||
.rows .row {
|
||||
float: left;
|
||||
display: inline-block;
|
||||
padding: 8px 0;
|
||||
width: 100%;
|
||||
background-color: white(.02);
|
||||
|
||||
&:nth-child(2n) { background-color: white(0); }
|
||||
|
||||
a.name {
|
||||
float: left;
|
||||
padding: 5px 10px;
|
||||
width: calc(70% - 20px);
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
a.status {
|
||||
float: left;
|
||||
padding: 5px 10px;
|
||||
width: calc(30% - 20px);
|
||||
color: white(.5);
|
||||
font-size: 14px;
|
||||
text-align: right;
|
||||
|
||||
animation-name: pulse;
|
||||
animation-duration: 2s;
|
||||
animation-timing-function: ease-in-out;
|
||||
animation-iteration-count: infinite;
|
||||
|
||||
&.error,
|
||||
&.success { animation: none; }
|
||||
|
||||
&.error { color: rgb(213, 24, 24); }
|
||||
|
||||
&.success { color: rgb(42, 213, 0); }
|
||||
}
|
||||
|
||||
p.notice {
|
||||
display: none;
|
||||
float: left;
|
||||
padding: 2px 10px 5px;
|
||||
width: calc(100% - 20px);
|
||||
color: white(.5);
|
||||
font-size: 12px;
|
||||
overflow: hidden;
|
||||
line-height: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@ -31,12 +31,6 @@ body {
|
||||
}
|
||||
}
|
||||
|
||||
.center {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
}
|
||||
|
||||
input {
|
||||
-webkit-user-select: text !important;
|
||||
-moz-user-select: text !important;
|
||||
@ -58,5 +52,4 @@ input {
|
||||
@import 'loading';
|
||||
@import 'message';
|
||||
@import 'multiselect';
|
||||
@import 'upload';
|
||||
@import 'mediaquery';
|
||||
Loading…
Reference in New Issue
Block a user