snuffster/szurubooru
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

client/file-dropper: add ability to lock URLs

Browse source
This commit is contained in:
rr- 2017-02-21 18:29:32 +01:00
parent 5dfdfd49e9
commit 34366b72fb
2 changed files with 28 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
client/html/file_dropper.tpl
View file

@ -15,6 +15,10 @@
</label>
<% if (ctx.allowUrls) { %>
<input type='text' name='url' placeholder='Alternatively, paste an URL here.'/>
<% if (ctx.lock) { %>
<button>Confirm</button>
<% } else { %>
<button>Add URL</button>
<% } %>
<% } %>
</div>

25
client/js/controls/file_dropper_control.js
View file

@ -5,6 +5,8 @@ const views = require('../util/views.js');
const template = views.getTemplate('file-dropper');
const KEY_RETURN = 13;
class FileDropperControl extends events.EventTarget {
constructor(target, options) {
super();
@ -14,6 +16,7 @@ class FileDropperControl extends events.EventTarget {
extraText: options.extraText,
allowMultiple: options.allowMultiple,
allowUrls: options.allowUrls,
lock: options.lock,
id: 'file-' + Math.random().toString(36).substring(7),
});
@ -37,8 +40,12 @@ class FileDropperControl extends events.EventTarget {
'change', e => this._evtFileChange(e));
if (this._urlInputNode) {
this._urlInputNode.addEventListener(
'keydown', e => this._evtUrlInputKeyDown(e));
}
if (this._urlConfirmButtonNode) {
this._urlConfirmButtonNode.addEventListener(
'click', e => this._evtUrlConfirm(e));
'click', e => this._evtUrlConfirmButtonClick(e));
}
this._originalHtml = this._dropperNode.innerHTML;
@ -62,6 +69,10 @@ class FileDropperControl extends events.EventTarget {
_emitUrls(urls) {
urls = Array.from(urls).map(url => url.trim());
if (this._options.lock) {
this._dropperNode.innerText =
urls.map(url => url.split(/\//).reverse()[0]).join(', ');
}
for (let url of urls) {
if (!url) {
return;
@ -106,7 +117,17 @@ class FileDropperControl extends events.EventTarget {
this._emitFiles(e.dataTransfer.files);
}
_evtUrlConfirm(e) {
_evtUrlInputKeyDown(e) {
if (e.which !== KEY_RETURN) {
return;
}
e.preventDefault();
this._dropperNode.classList.remove('active');
this._emitUrls(this._urlInputNode.value.split(/[\r\n]/));
this._urlInputNode.value = '';
}
_evtUrlConfirmButtonClick(e) {
e.preventDefault();
this._dropperNode.classList.remove('active');
this._emitUrls(this._urlInputNode.value.split(/[\r\n]/));