main.js: only choose from image files

This commit is contained in:
Andy Piper 2022-05-04 21:59:16 +01:00
parent 1b4402c6d2
commit 3afe5b5896
No known key found for this signature in database
GPG Key ID: 8FBF7373AC449A7F

View File

@ -2,8 +2,8 @@
'use strict'; 'use strict';
/** /**
* In order to debug on a phone, we load vConsole * In order to debug on a phone, we load vConsole
* https://www.npmjs.com/package/vconsole * https://www.npmjs.com/package/vconsole
* Double-tap notice bar to activate * Double-tap notice bar to activate
*/ */
function debug() { function debug() {
@ -186,10 +186,10 @@ async function callApi(path, body, errorPreHandler) {
}); });
} }
/** /**
* call addEventListener on all selected elements by `seletor`, * call addEventListener on all selected elements by `seletor`,
* with each element itself as `this` unless specifyed `thisArg`, * with each element itself as `this` unless specifyed `thisArg`,
* with type `type` and a function `callback`. * with type `type` and a function `callback`.
* If an element have attribute `data-default` or `checked`, dispatch event immediately on it. * If an element have attribute `data-default` or `checked`, dispatch event immediately on it.
* You can of course assign resulting object to a variable for futher use. * You can of course assign resulting object to a variable for futher use.
*/ */
class EventPutter { class EventPutter {
@ -244,7 +244,7 @@ function putEvent(selector, type, callback, thisArg) {
})(); })();
/** /**
* Class to control Printing Canvas (manipulate, preview etc.) * Class to control Printing Canvas (manipulate, preview etc.)
* "Brightness" is historically "Threshold", while the later is kept in code * "Brightness" is historically "Threshold", while the later is kept in code
*/ */
class CanvasController { class CanvasController {
@ -289,7 +289,7 @@ class CanvasController {
putEvent('#canvas-expand' , 'click', this.expand , this); putEvent('#canvas-expand' , 'click', this.expand , this);
putEvent('#canvas-crop' , 'click', this.crop , this); putEvent('#canvas-crop' , 'click', this.crop , this);
putEvent('#insert-picture' , 'click', this.insertPicture , this); putEvent('#insert-picture' , 'click', this.insertPicture , this);
putEvent('#threshold', 'change', (event) => { putEvent('#threshold', 'change', (event) => {
this.threshold = parseInt(event.currentTarget.value); this.threshold = parseInt(event.currentTarget.value);
this.activatePreview(); this.activatePreview();
@ -391,6 +391,7 @@ class CanvasController {
} }
let input = document.createElement('input'); let input = document.createElement('input');
input.type = 'file'; input.type = 'file';
input.accept = 'image/*';
input.addEventListener('change', () => { input.addEventListener('change', () => {
let url = URL.createObjectURL(input.files[0]); let url = URL.createObjectURL(input.files[0]);
put_image(url); put_image(url);
@ -517,7 +518,7 @@ class Main {
this.canvasController = new CanvasController(); this.canvasController = new CanvasController();
putEvent('#button-exit', 'click', () => this.exit(false), this); putEvent('#button-exit', 'click', () => this.exit(false), this);
putEvent('#button-exit', 'contextmenu', putEvent('#button-exit', 'contextmenu',
(event) => (event.preventDefault(), this.exit(true)), this); (event) => (event.preventDefault(), this.exit(true)), this);
putEvent('#button-print', 'click', this.print, this); putEvent('#button-print', 'click', this.print, this);
putEvent('#device-refresh', 'click', this.searchDevices, this); putEvent('#device-refresh', 'click', this.searchDevices, this);
@ -589,9 +590,9 @@ class Main {
this.settings = await callApi('/query'); this.settings = await callApi('/query');
} }
/** /**
* Activate all setters with corresponding values in settings. * Activate all setters with corresponding values in settings.
* Before calling, please first loadConfig & do `attachSetter` on all desired elements/inputs. * Before calling, please first loadConfig & do `attachSetter` on all desired elements/inputs.
* After the load, will save config to server again in order to sync default values. * After the load, will save config to server again in order to sync default values.
* Then, if permitted, every single change will sync to server instantly * Then, if permitted, every single change will sync to server instantly
*/ */
async activateConfig() { async activateConfig() {