Skip to content

PUBLIC / surfer-okd

Go to a project
Commit b094fada by Johannes Zellner
Options

Support drag'n'drop upload

1 parent 16ad753a
Inline Side-by-side
Showing with 26 additions and 9 deletions
frontend/index.html
...@@ -9,7 +9,7 @@ ...@@ -9,7 +9,7 @@
<link href="/_admin/img/logo.png" rel="icon" type="image/png"> <link href="/_admin/img/logo.png" rel="icon" type="image/png">
</head> </head>
<body id="app"> <body id="app" @drop="drop" @dragover="dragOver">
<nav class="navbar navbar-default" v-cloak> <nav class="navbar navbar-default" v-cloak>
<div class="container-fluid"> <div class="container-fluid">
......
frontend/js/app.js
...@@ -122,15 +122,12 @@ function up() { ...@@ -122,15 +122,12 @@ function up() {
window.location.hash = sanitize(app.path.split('/').slice(0, -1).filter(function (p) { return !!p; }).join('/')); window.location.hash = sanitize(app.path.split('/').slice(0, -1).filter(function (p) { return !!p; }).join('/'));
} }
function upload() { function uploadFiles(files) {
$(app.$els.upload).on('change', function () { if (!files || !files.length) return;
// detach event handler
$(app.$els.upload).off('change');
app.uploadStatus = { app.uploadStatus = {
busy: true, busy: true,
count: app.$els.upload.files.length, count: files.length,
done: 0, done: 0,
percentDone: 0 percentDone: 0
}; };
...@@ -163,8 +160,17 @@ function upload() { ...@@ -163,8 +160,17 @@ function upload() {
} }
for(var i = 0; i < app.uploadStatus.count; ++i) { for(var i = 0; i < app.uploadStatus.count; ++i) {
uploadFile(app.$els.upload.files[i]); uploadFile(files[i]);
} }
}
function upload() {
$(app.$els.upload).on('change', function () {
// detach event handler
$(app.$els.upload).off('change');
uploadFiles(app.$els.upload.files || []);
}); });
// reset the form first to make the change handler retrigger even on the same file selected // reset the form first to make the change handler retrigger even on the same file selected
...@@ -257,6 +263,15 @@ function createDirectory(name) { ...@@ -257,6 +263,15 @@ function createDirectory(name) {
}); });
} }
function dragOver(event) {
event.preventDefault();
}
function drop(event) {
event.preventDefault();
uploadFiles(event.dataTransfer.files || []);
}
Vue.filter('prettyDate', function (value) { Vue.filter('prettyDate', function (value) {
var d = new Date(value); var d = new Date(value);
return d.toDateString(); return d.toDateString();
...@@ -304,7 +319,9 @@ var app = new Vue({ ...@@ -304,7 +319,9 @@ var app = new Vue({
renameAsk: renameAsk, renameAsk: renameAsk,
rename: rename, rename: rename,
createDirectoryAsk: createDirectoryAsk, createDirectoryAsk: createDirectoryAsk,
createDirectory: createDirectory createDirectory: createDirectory,
drop: drop,
dragOver: dragOver
} }
}); });
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!