mirror/0bin
1
0
Fork 0
mirror of https://github.com/Tygs/0bin.git synced 2023-08-10 21:13:00 +03:00
Code Issues Projects Releases Wiki Activity

#17 - Add html5 file drag&drop on textarea

Browse Source
This commit is contained in:
Rémy HUBSCHER 2013-01-19 11:31:03 +01:00
parent 303905aff5
commit b2a9812688
6 changed files with 51 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
zerobin.py
View File

@ -4,4 +4,4 @@
from zerobin.routes import main
main()
main()

2
zerobin/__init__.py
View File

@ -4,4 +4,4 @@
from default_settings import VERSION
__version__ = VERSION
__version__ = VERSION

4
zerobin/static/css/style.css
View File

@ -383,4 +383,8 @@ canvas {
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
}
#content.hover {
background-color: #eee;
}

2
zerobin/static/css/style.min.css vendored
View File

@ -4,4 +4,4 @@ article,aside,details,figcaption,figure,footer,header,hgroup,nav,section{display
/* Prettify */
.pln{color:#000}@media screen{.str{color:#080}.kwd{color:#008}.com{color:#800}.typ{color:#606}.lit{color:#066}.pun,.opn,.clo{color:#660}.tag{color:#008}.atn{color:#606}.atv{color:#080}.dec,.var{color:#606}.fun{color:red}}@media print,projection{.str{color:#060}.kwd{color:#006;font-weight:bold}.com{color:#600;font-style:italic}.typ{color:#404;font-weight:bold}.lit{color:#044}.pun,.opn,.clo{color:#440}.tag{color:#006;font-weight:bold}.atn{color:#404}.atv{color:#060}}pre.prettyprint{padding:2px;border:1px solid #888}ol.linenums{margin-top:0;margin-bottom:0}li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8{list-style-type:none}li.L1,li.L3,li.L5,li.L7,li.L9{background:#eee}
/* Custom */
.brand{font-size:38px!important;padding:0 55px 3px!important;text-shadow:0 1px 0 rgba(255,255,255,.1),0 0 30px rgba(255,255,255,.125);-webkit-transition:all .2s linear;-moz-transition:all .2s linear;-o-transition:all .2s linear;-ms-transition:all .2s linear;transition:all .2s linear}.brand span{font-size:48px;line-height:0}.brand em{display:inline;color:#d40202;font-size:27px}.about{line-height:13px;font-style:italic;text-align:right;padding-top:9px;margin-bottom:0!important}.center{text-align:center}.about span{font-size:10px}body{padding-top:60px;padding-bottom:40px}.sidebar-nav{padding:9px 0}select{width:135px}label{display:inline;margin-left:18px;font-style:italic;font-size:11px;color:#888}ul,ol{padding:0;margin:0}li{margin-left:-9px}p{margin:0 0 20px}.grey{color:#999}.nav-list{padding-right:0!important;font-size:12px}blockquote{width:630px;float:left}h4 p{float:left;font-size:80px;text-shadow:1px 3px 1px #DDD,0 0 4px #333;-webkit-transition:all .2s linear;-o-transition:all .2s linear;-ms-transition:all .2s linear;-moz-transition:all .2s linear;transition:all .2s linear;margin-right:7px;margin-top:3px}h4#pixels-total{position:relative;width:166px;float:right;margin:8px 0 0 0;padding:0 0 0 54px;font-size:1.1em;line-height:1.4;font-weight:normal;color:#777;-webkit-border-top-right-radius:6px;-webkit-border-top-left-radius:20px;-moz-border-top-right-radius:6px;-moz-border-top-left-radius:20px;border-top-right-radius:6px;border-top-left-radius:20px}.greetings{clear:both;margin:0 auto;text-align:center;margin-top:40px}.alert .title{display:block}.btn-group{float:left}html.file-upload p.file-upload{float:left;margin:22px 0 0 21px;display:none}html.file-upload p.file-upload{display:inherit}html.no-file-upload p.file-upload{display:none}input.btn-upload{position:relative;left:-6px;width:100px;z-index:1;margin-top:-13px}input.hide-upload{position:relative;left:-110px;-moz-opacity:0;filter:alpha(opacity=0);opacity:0;z-index:2;width:100px;margin-top:-20px;cursor:pointer;cursor:hand;height:49px}#paste-content{background-color:white;padding:1em}#paste-content.linenums{padding-left:0}.submit-form{display:none}.paste-option{float:right}a#clip-button.hover{cursor:pointer;text-decoration:underline}li.L0,li.L1,li.L2,li.L3,li.L4,li.L5,li.L6,li.L7,li.L8,li.L9{list-style-type:decimal;background:inherit}.prettyprint.linenums{-webkit-box-shadow:inset 40px 0 0 #fbfbfc,inset 41px 0 0 #ececf0;-moz-box-shadow:inset 40px 0 0 #fbfbfc,inset 41px 0 0 #ececf0;box-shadow:inset 40px 0 0 #fbfbfc,inset 41px 0 0 #ececf0}ol.linenums{margin:0 0 0 55px}ol.linenums li{color:#bebec5;line-height:18px;text-shadow:0 1px 0 #fff}.prettyprint{padding:8px;background-color:#f7f7f9;border:1px solid #e1e1e8}pre{font-family:Consolas,Menlo,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,monospace,serif;line-height:21px;font-size:12px}.kwd{color:#66F}.pun,.opn,.clo{color:#0A0}.lit{color:#933}.com{color:#C0C}form{padding-bottom:3em!important;padding-right:17px}form textarea{overflow-y:auto;min-height:250px}button.btn,input[type="submit"].btn{margin-left:5px}.well{padding-bottom:40px;padding-right:17px}.legal{margin:0 auto;width:300px;text-align:center;margin-top:30px}.btn{margin-left:5px}.btn-primary,.btn-danger{position:relative;top:-4px}#alert-template{display:none}.progress{display:none}.progress .bar{width:25%;text-indent:10px;text-align:left}.lnk-option canvas{vertical-align:middle;margin-right:10px}.previous-pastes .item{margin-top:5px;vertical-align:middle;line-height:24px;padding-left:1em}li.item{margin-left:-13px;margin-right:-5px}.previous-pastes canvas{display:block;float:left;margin-right:5px}html.local-storage .no-local-storage{display:none}html.no-local-storage .local-storage{display:none}canvas{border:1px solid white}#wrap-content{display:none}.noscript{text-align:center;color:red;font-weight:bold}#faq dt{margin:2em 0 1em 0}#faq p{margin:1em}#force-coloration{text-decoration:underline}#expiration-tag{float:right;margin:1em;background:grey;color:white;font-size:.8em;padding:0 1ex;opacity:.5;filter:alpha(opacity=50);font-weight:bold;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}
.brand{font-size:38px!important;padding:0 55px 3px!important;text-shadow:0 1px 0 rgba(255,255,255,.1),0 0 30px rgba(255,255,255,.125);-webkit-transition:all .2s linear;-moz-transition:all .2s linear;-o-transition:all .2s linear;-ms-transition:all .2s linear;transition:all .2s linear}.brand span{font-size:48px;line-height:0}.brand em{display:inline;color:#d40202;font-size:27px}.about{line-height:13px;font-style:italic;text-align:right;padding-top:9px;margin-bottom:0!important}.center{text-align:center}.about span{font-size:10px}body{padding-top:60px;padding-bottom:40px}.sidebar-nav{padding:9px 0}select{width:135px}label{display:inline;margin-left:18px;font-style:italic;font-size:11px;color:#888}ul,ol{padding:0;margin:0}li{margin-left:-9px}p{margin:0 0 20px}.grey{color:#999}.nav-list{padding-right:0!important;font-size:12px}blockquote{width:630px;float:left}h4 p{float:left;font-size:80px;text-shadow:1px 3px 1px #DDD,0 0 4px #333;-webkit-transition:all .2s linear;-o-transition:all .2s linear;-ms-transition:all .2s linear;-moz-transition:all .2s linear;transition:all .2s linear;margin-right:7px;margin-top:3px}h4#pixels-total{position:relative;width:166px;float:right;margin:8px 0 0 0;padding:0 0 0 54px;font-size:1.1em;line-height:1.4;font-weight:normal;color:#777;-webkit-border-top-right-radius:6px;-webkit-border-top-left-radius:20px;-moz-border-top-right-radius:6px;-moz-border-top-left-radius:20px;border-top-right-radius:6px;border-top-left-radius:20px}.greetings{clear:both;margin:0 auto;text-align:center;margin-top:40px}.alert .title{display:block}.btn-group{float:left}html.file-upload p.file-upload{float:left;margin:22px 0 0 21px;display:none}html.file-upload p.file-upload{display:inherit}html.no-file-upload p.file-upload{display:none}input.btn-upload{position:relative;left:-6px;width:100px;z-index:1;margin-top:-13px}input.hide-upload{position:relative;left:-110px;-moz-opacity:0;filter:alpha(opacity=0);opacity:0;z-index:2;width:100px;margin-top:-20px;cursor:pointer;cursor:hand;height:49px}#paste-content{background-color:white;padding:1em}#paste-content.linenums{padding-left:0}.submit-form{display:none}.paste-option{float:right}a#clip-button.hover{cursor:pointer;text-decoration:underline}li.L0,li.L1,li.L2,li.L3,li.L4,li.L5,li.L6,li.L7,li.L8,li.L9{list-style-type:decimal;background:inherit}.prettyprint.linenums{-webkit-box-shadow:inset 40px 0 0 #fbfbfc,inset 41px 0 0 #ececf0;-moz-box-shadow:inset 40px 0 0 #fbfbfc,inset 41px 0 0 #ececf0;box-shadow:inset 40px 0 0 #fbfbfc,inset 41px 0 0 #ececf0}ol.linenums{margin:0 0 0 55px}ol.linenums li{color:#bebec5;line-height:18px;text-shadow:0 1px 0 #fff}.prettyprint{padding:8px;background-color:#f7f7f9;border:1px solid #e1e1e8}pre{font-family:Consolas,Menlo,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,monospace,serif;line-height:21px;font-size:12px}.kwd{color:#66F}.pun,.opn,.clo{color:#0A0}.lit{color:#933}.com{color:#C0C}form{padding-bottom:3em!important;padding-right:17px}form textarea{overflow-y:auto;min-height:250px}button.btn,input[type="submit"].btn{margin-left:5px}.well{padding-bottom:40px;padding-right:17px}.legal{margin:0 auto;width:300px;text-align:center;margin-top:30px}.btn{margin-left:5px}.btn-primary,.btn-danger{position:relative;top:-4px}#alert-template{display:none}.progress{display:none}.progress .bar{width:25%;text-indent:10px;text-align:left}.lnk-option canvas{vertical-align:middle;margin-right:10px}.previous-pastes .item{margin-top:5px;vertical-align:middle;line-height:24px;padding-left:1em}li.item{margin-left:-13px;margin-right:-5px}.previous-pastes canvas{display:block;float:left;margin-right:5px}html.local-storage .no-local-storage{display:none}html.no-local-storage .local-storage{display:none}canvas{border:1px solid white}#wrap-content{display:none}.noscript{text-align:center;color:red;font-weight:bold}#faq dt{margin:2em 0 1em 0}#faq p{margin:1em}#force-coloration{text-decoration:underline}#expiration-tag{float:right;margin:1em;background:grey;color:white;font-size:.8em;padding:0 1ex;opacity:.5;filter:alpha(opacity=50);font-weight:bold;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}#content.hover{background-color:#eee}

52
zerobin/static/js/behavior.js
View File

@ -351,6 +351,39 @@ window.zerobin = {
}
return total * 1000 / size;
},
// prevent defaults
ignoreDrag: function(e) {
e.originalEvent.stopPropagation();
e.originalEvent.preventDefault();
},
// Handle Drop
handleDrop: function(e) {
zerobin.ignoreDrag(e);
zerobin.upload(e.originalEvent.dataTransfer.files);
$("#content").removeClass('hover');
},
handleDragOver: function(e) {
zerobin.ignoreDrag(e);
$(this).addClass('hover');
console.log('dragover');
},
handleDragLeave: function(e) {
zerobin.ignoreDrag(e);
$(this).removeClass('hover');
console.log('dragout');
},
upload: function(files) {
var reader = new FileReader();
reader.onload = function(event) {
$('#content').val(event.target.result).trigger('change');
};
reader.readAsText(files[0]);
}
};
@ -668,24 +701,17 @@ $('.clone .btn-danger').click(function(e){
});
/* Upload file using HTML5 File API */
if (zerobin.support.fileUpload) {
var upload = function(files) {
var reader = new FileReader();
reader.onload = function(event) {
$('#content').val(event.target.result).trigger('change');
};
reader.readAsText(files[0]);
};
var $buttonOverlay = $('#file-upload');
var $button = $('.btn-upload');
try {
$button.val('Uploading...');
$button.prop('disabled', true);
$buttonOverlay.change(function(){upload(this.files);});
$buttonOverlay.change(function(){zerobin.upload(this.files);});
}
catch (e) {
zerobin.message('error', 'Could no upload the file', 'Error');
@ -696,6 +722,14 @@ if (zerobin.support.fileUpload) {
$button.prop('disabled', false);
$button.val('Upload File');
$buttonOverlay.mouseover(mkcb($(this).css, 'cursor', 'pointer'));
// Implements drag & drop upload
$('#content').bind('dragenter', zerobin.ignoreDrag);
$('#content').bind('drop', zerobin.handleDrop);
$('#content').bind('dragover', zerobin.handleDragOver);
$('#content').bind('dragleave', zerobin.handleDragLeave);
}
/* Alerts */

2
zerobin/static/js/main.min.js vendored
View File

File diff suppressed because one or more lines are too long