mirrors/h5ai
1
0
Fork 0
mirror of https://github.com/lrsjng/h5ai.git synced 2025-06-04 08:59:39 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Updates dropbox design. Now the content space is the dropzone.

Browse source
This commit is contained in:
Lars Jung 2012-08-11 21:41:25 +02:00
parent 4c3267c1f8
commit ff40e2129f
2 changed files with 25 additions and 34 deletions
Download patch file Download diff file Expand all files Collapse all files

32
src/_h5ai/css/inc/dropbox.less
View file

@ -1,30 +1,16 @@
#dropbox { #content {
margin: 48px 24px; border: 1px dashed #fff;
padding: 24px 12px; border-radius: 8px;
overflow: hidden;
background-color: #f8f8f8; &.hint {
border: 1px dashed #ccc; border-color: #ccc;
border-radius: 10px;
.transition(all 0.2s ease-in-out);
.label {
text-align: center;
color: #ddd;
font-size: 5em;
font-weight: bold;
} }
&.match { &.match {
border-color: #555; border-style: solid;
}
}
.label {
color: #999;
}
}
}
#uploads { #uploads {
width: 450px; width: 450px;
@ -100,6 +86,4 @@
color: #c55; color: #c55;
} }
} }
} }

29
src/_h5ai/js/inc/ext/dropbox.js
View file

@ -9,7 +9,7 @@ modulejs.define('ext/dropbox', ['_', '$', 'core/settings', 'core/entry', 'core/r
settings = _.extend({}, defaults, allsettings.dropbox), settings = _.extend({}, defaults, allsettings.dropbox),
template = '<div id="dropbox"><div class="label">dropbox</div><ul id="uploads" /></div>', template = '<ul id="uploads" />',
uploadTemplate = '<li class="upload clearfix">' + uploadTemplate = '<li class="upload clearfix">' +
'<span class="name"></span>' + '<span class="name"></span>' +
@ -23,12 +23,10 @@ modulejs.define('ext/dropbox', ['_', '$', 'core/settings', 'core/entry', 'core/r
return; return;
} }
var $dropbox = $(template).appendTo('#content'); var $content = $('#content').append(template);
var uploads = {}, var uploads = {},
afterUpload = function (err, file, timeout) { afterUpload = function (err, file) {
timeout = timeout || 5000;
if (file) { if (file) {
uploads[file.name] uploads[file.name]
@ -41,12 +39,11 @@ modulejs.define('ext/dropbox', ['_', '$', 'core/settings', 'core/entry', 'core/r
uploads[file.name].remove(); uploads[file.name].remove();
delete uploads[file.name]; delete uploads[file.name];
}); });
}, timeout); }, 5000);
} }
}; };
// $dropbox.filedrop({ $content.filedrop({
$('html').filedrop({
paramname: 'userfile', paramname: 'userfile',
@ -58,19 +55,29 @@ modulejs.define('ext/dropbox', ['_', '$', 'core/settings', 'core/entry', 'core/r
href: entry.absHref href: entry.absHref
}, },
docEnter: function () {
$content.addClass('hint');
},
docLeave: function () {
$content.removeClass('hint');
},
dragOver: function () { dragOver: function () {
$dropbox.addClass('match'); $content.addClass('match');
}, },
dragLeave: function () { dragLeave: function () {
$dropbox.removeClass('match'); $content.removeClass('match');
}, },
drop: function () { drop: function () {
$dropbox.removeClass('match'); $content.removeClass('hint match');
}, },