diff --git a/client/html/file_dropper.tpl b/client/html/file_dropper.tpl index 9e7715d..2ce0ff5 100644 --- a/client/html/file_dropper.tpl +++ b/client/html/file_dropper.tpl @@ -15,6 +15,10 @@ <% if (ctx.allowUrls) { %> - + <% if (ctx.lock) { %> + + <% } else { %> + + <% } %> <% } %> diff --git a/client/js/controls/file_dropper_control.js b/client/js/controls/file_dropper_control.js index 7b3c120..407fa9d 100644 --- a/client/js/controls/file_dropper_control.js +++ b/client/js/controls/file_dropper_control.js @@ -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]/));