From 01eb9085e89a1db7e94358483b8ed17b3e66853d Mon Sep 17 00:00:00 2001 From: clark-cui Date: Wed, 22 Sep 2021 20:11:48 +0800 Subject: [PATCH] jscode enhance jscode enhance --- src/main/frontend/exif.js | 32 +++--- src/main/frontend/selection.js | 22 ++--- src/main/frontend/utils.js | 174 ++++++++++++++++++--------------- 3 files changed, 122 insertions(+), 106 deletions(-) diff --git a/src/main/frontend/exif.js b/src/main/frontend/exif.js index 57a133824c6..851d8c96406 100644 --- a/src/main/frontend/exif.js +++ b/src/main/frontend/exif.js @@ -1,41 +1,41 @@ // copied from https://stackoverflow.com/questions/7584794/accessing-jpeg-exif-rotation-data-in-javascript-on-the-client-side -function objectURLToBlob(url, callback) { - var http = new XMLHttpRequest(); +const objectURLToBlob=(url, callback)=> { + const http = new XMLHttpRequest(); http.open("GET", url, true); http.responseType = "blob"; - http.onload = function(e) { - if (this.status == 200 || this.status === 0) { - callback(this.response); + http.onload = (e)=> { + if (http.status == 200 || http.status === 0) { + callback(http.response); } }; http.send(); } -export var getEXIFOrientation = function (img, callback) { - var reader = new FileReader(); +export const getEXIFOrientation = (img, callback)=> { + const reader = new FileReader(); reader.onload = e => { - var view = new DataView(e.target.result) + const view = new DataView(e.target.result) if (view.getUint16(0, false) !== 0xFFD8) { return callback(-2) } - var length = view.byteLength - var offset = 2 + const length = view.byteLength + let offset = 2 while (offset < length) { - var marker = view.getUint16(offset, false) + const marker = view.getUint16(offset, false) offset += 2 if (marker === 0xFFE1) { if (view.getUint32(offset += 2, false) !== 0x45786966) { return callback(-1) } - var little = view.getUint16(offset += 6, false) === 0x4949 + const little = view.getUint16(offset += 6, false) === 0x4949 offset += view.getUint32(offset + 4, little) - var tags = view.getUint16(offset, little) + const tags = view.getUint16(offset, little) offset += 2 - for (var i = 0; i < tags; i++) { + for (let i = 0; i < tags; i++) { if (view.getUint16(offset + (i * 12), little) === 0x0112) { - var o = view.getUint16(offset + (i * 12) + 8, little); + const o = view.getUint16(offset + (i * 12) + 8, little); return callback(o) } } @@ -48,7 +48,7 @@ export var getEXIFOrientation = function (img, callback) { return callback(-1) }; - objectURLToBlob(img.src, function (blob) { + objectURLToBlob(img.src, (blob)=> { reader.readAsArrayBuffer(blob.slice(0, 65536)); }); } diff --git a/src/main/frontend/selection.js b/src/main/frontend/selection.js index cb2be460e31..6dae8d8af13 100644 --- a/src/main/frontend/selection.js +++ b/src/main/frontend/selection.js @@ -1,7 +1,7 @@ // Copied from https://stackoverflow.com/a/20336116 -function isDescendant(parent, child) { +const isDescendant=(parent, child)=> { // from http://stackoverflow.com/questions/2234979/how-to-check-in-javascript-if-one-element-is-a-child-of-another - var node = child; + let node = child; while (node != null) { if (node == parent) { return true; @@ -11,10 +11,10 @@ function isDescendant(parent, child) { return false; } -function getNodesBetween(rootNode, node1, node2) { - var resultNodes = []; - var isBetweenNodes = false; - for (var i = 0; i < rootNode.childNodes.length; i+= 1) { +const getNodesBetween=(rootNode, node1, node2)=> { + const resultNodes = []; + let isBetweenNodes = false; + for (let i = 0; i < rootNode.childNodes.length; i+= 1) { if (isDescendant(rootNode.childNodes[i], node1) || isDescendant(rootNode.childNodes[i], node2)) { if (resultNodes.length == 0) { isBetweenNodes = true; @@ -39,9 +39,9 @@ function getNodesBetween(rootNode, node1, node2) { } } -export var getSelectedNodes = function (selectionAncestor, startNode) { +export const getSelectedNodes = (selectionAncestor, startNode)=> { // from https://developer.mozilla.org/en-US/docs/Web/API/Selection - var selection = null; + let selection = null; if(window.getSelection){ selection = window.getSelection(); } else if(document.selection){ @@ -52,13 +52,13 @@ export var getSelectedNodes = function (selectionAncestor, startNode) { if (selection.isCollapsed) { return []; }; - var node2 = selection.focusNode; + const node2 = selection.focusNode; return getNodesBetween(selectionAncestor, startNode, node2); } }; -export var clearSelection = function () { - var selection = null; +export const clearSelection = ()=> { + let selection = null; if(window.getSelection){ selection = window.getSelection(); } else if(document.selection){ diff --git a/src/main/frontend/utils.js b/src/main/frontend/utils.js index 3fb40e4a6d7..c51fa34edb1 100644 --- a/src/main/frontend/utils.js +++ b/src/main/frontend/utils.js @@ -3,7 +3,7 @@ if (typeof window === 'undefined') { } // Copy from https://github.com/primetwig/react-nestable/blob/dacea9dc191399a3520f5dc7623f5edebc83e7b7/dist/utils.js -export var closest = function closest (target, selector) { +export const closest = (target, selector) => { // closest(e.target, '.field') while (target) { if (target.matches && target.matches(selector)) return target @@ -12,41 +12,42 @@ export var closest = function closest (target, selector) { return null } -export var getOffsetRect = function getOffsetRect (elem) { +export const getOffsetRect = (elem) => { // (1) - var box = elem.getBoundingClientRect() + const box = elem.getBoundingClientRect(), + body = document.body, + docElem = document.documentElement, + // (2) + scrollTop = window.pageYOffset || docElem.scrollTop || body.scrollTop, + scrollLeft = window.pageXOffset || docElem.scrollLeft || body.scrollLeft, - var body = document.body - var docElem = document.documentElement + // (3) + clientTop = docElem.clientTop || body.clientTop || 0, + clientLeft = docElem.clientLeft || body.clientLeft || 0, - // (2) - var scrollTop = window.pageYOffset || docElem.scrollTop || body.scrollTop - var scrollLeft = window.pageXOffset || docElem.scrollLeft || body.scrollLeft + // (4) + top = box.top + scrollTop - clientTop, + left = box.left + scrollLeft - clientLeft; - // (3) - var clientTop = docElem.clientTop || body.clientTop || 0 - var clientLeft = docElem.clientLeft || body.clientLeft || 0 - - // (4) - var top = box.top + scrollTop - clientTop - var left = box.left + scrollLeft - clientLeft - - return { top: Math.round(top), left: Math.round(left) } + return { + top: Math.round(top), + left: Math.round(left) + } } // jquery focus -export var focus = function (elem) { +export const focus = (elem) => { return elem === document.activeElement && document.hasFocus() && !!(elem.type || elem.href || ~elem.tabIndex) } // copied from https://stackoverflow.com/a/32180863 -export var timeConversion = function (millisec) { - var seconds = (millisec / 1000).toFixed(0) - var minutes = (millisec / (1000 * 60)).toFixed(0) - var hours = (millisec / (1000 * 60 * 60)).toFixed(1) - var days = (millisec / (1000 * 60 * 60 * 24)).toFixed(1) +export const timeConversion = (millisec) => { + let seconds = (millisec / 1000).toFixed(0), + minutes = (millisec / (1000 * 60)).toFixed(0), + hours = (millisec / (1000 * 60 * 60)).toFixed(1), + days = (millisec / (1000 * 60 * 60 * 24)).toFixed(1); if (seconds < 60) { return seconds + 's' @@ -59,7 +60,7 @@ export var timeConversion = function (millisec) { } } -export var getSelectionText = function () { +export const getSelectionText = () => { const selection = (window.getSelection() || '').toString().trim() if (selection) { return selection @@ -79,7 +80,7 @@ export var getSelectionText = function () { // Modified from https://github.com/GoogleChromeLabs/browser-nativefs // because shadow-cljs doesn't handle this babel transform -export var getFiles = async function (dirHandle, recursive, cb, path = dirHandle.name) { +export const getFiles = async (dirHandle, recursive, cb, path = dirHandle.name) => { const dirs = [] const files = [] for await (const entry of dirHandle.values()) { @@ -88,30 +89,28 @@ export var getFiles = async function (dirHandle, recursive, cb, path = dirHandle cb(nestedPath, entry) files.push( entry.getFile().then((file) => { - Object.defineProperty(file, 'webkitRelativePath', { - configurable: true, - enumerable: true, - get: () => nestedPath, - }) - Object.defineProperty(file, 'handle', { - configurable: true, - enumerable: true, - get: () => entry, - }) - return file - } - ) + Object.defineProperty(file, 'webkitRelativePath', { + configurable: true, + enumerable: true, + get: () => nestedPath, + }) + Object.defineProperty(file, 'handle', { + configurable: true, + enumerable: true, + get: () => entry, + }) + return file + }) ) } else if (entry.kind === 'directory' && recursive) { cb(nestedPath, entry) dirs.push(getFiles(entry, recursive, cb, nestedPath)) } } - return [(await Promise.all(dirs)), (await Promise.all(files))] } -export var verifyPermission = async function (handle, readWrite) { +export const verifyPermission = async (handle, readWrite) => { const options = {} if (readWrite) { options.mode = 'readwrite' @@ -130,14 +129,16 @@ export var verifyPermission = async function (handle, readWrite) { // NOTE: Need externs to prevent `options.recursive` been munged // When building with release. -export var openDirectory = async function (options = {}, cb) { +export const openDirectory = async (options = {}, cb) => { options.recursive = options.recursive || false; - const handle = await window.showDirectoryPicker({ mode: 'readwrite' }); + const handle = await window.showDirectoryPicker({ + mode: 'readwrite' + }); const _ask = await verifyPermission(handle, true); return [handle, getFiles(handle, options.recursive, cb)]; }; -export var writeFile = async function (fileHandle, contents) { +export const writeFile = async (fileHandle, contents) => { // Create a FileSystemWritableFileStream to write to. const writable = await fileHandle.createWritable() @@ -151,7 +152,7 @@ export var writeFile = async function (fileHandle, contents) { } } -export var nfsSupported = function () { +export const nfsSupported = () => { if ('chooseFileSystemEntries' in self) { return 'chooseFileSystemEntries' } else if ('showOpenFilePicker' in self) { @@ -172,7 +173,9 @@ export const triggerInputChange = (node, value = '', name = 'change') => { if (inputTypes.indexOf(node.__proto__.constructor) > -1) { const setValue = Object.getOwnPropertyDescriptor(node.__proto__, 'value').set - const event = new Event('change', { bubbles: true }) + const event = new Event('change', { + bubbles: true + }) setValue.call(node, value) node.dispatchEvent(event) @@ -182,7 +185,7 @@ export const triggerInputChange = (node, value = '', name = 'change') => { // Copied from https://github.com/google/diff-match-patch/issues/29#issuecomment-647627182 export const reversePatch = patch => { return patch.map(patchObj => ({ - diffs: patchObj.diffs.map(([ op, val ]) => [ + diffs: patchObj.diffs.map(([op, val]) => [ op * -1, // The money maker val ]), @@ -196,30 +199,33 @@ export const reversePatch = patch => { // Copied from https://github.com/sindresorhus/path-is-absolute/blob/main/index.js export const win32 = path => { // https://github.com/nodejs/node/blob/b3fcc245fb25539909ef1d5eaa01dbf92e168633/lib/path.js#L56 - var splitDeviceRe = /^([a-zA-Z]:|[\\/]{2}[^\\/]+[\\/]+[^\\/]+)?([\\/])?([\s\S]*?)$/; - var result = splitDeviceRe.exec(path); - var device = result[1] || ''; - var isUnc = Boolean(device && device.charAt(1) !== ':'); + const splitDeviceRe = /^([a-zA-Z]:|[\\/]{2}[^\\/]+[\\/]+[^\\/]+)?([\\/])?([\s\S]*?)$/, + result = splitDeviceRe.exec(path), + device = result[1] || '', + isUnc = Boolean(device && device.charAt(1) !== ':'); // UNC paths are always absolute return Boolean(result[2] || isUnc); }; -export const ios = function () { +export const ios = () => { return [ - 'iPad Simulator', - 'iPhone Simulator', - 'iPod Simulator', - 'iPad', - 'iPhone', - 'iPod' - ].includes(navigator.platform) - // iPad on iOS 13 detection - || (navigator.userAgent.includes("Mac") && "ontouchend" in document) + 'iPad Simulator', + 'iPhone Simulator', + 'iPod Simulator', + 'iPad', + 'iPhone', + 'iPod' + ].includes(navigator.platform) + // iPad on iOS 13 detection + || + (navigator.userAgent.includes("Mac") && "ontouchend" in document) } -export const getClipText = function (cb, errorHandler) { - navigator.permissions.query({ name: "clipboard-read" }).then((result) => { +export const getClipText = (cb, errorHandler) => { + navigator.permissions.query({ + name: "clipboard-read" + }).then((result) => { if (result.state == "granted" || result.state == "prompt") { navigator.clipboard.readText() .then(text => { @@ -232,21 +238,31 @@ export const getClipText = function (cb, errorHandler) { }) } -export const writeClipboard = function(text, isHtml) { - if (isHtml) { - var blob = new Blob([text], {type:["text/plain", "text/html"]}) - var data = [new ClipboardItem({["text/plain"]: blob, ["text/html"]:blob})]; - } else{ - var blob = new Blob([text], {type:["text/plain"]}) - var data = [new ClipboardItem({["text/plain"]: blob})]; - } - navigator.permissions.query({ name: "clipboard-write" }).then((result) => { - if (result.state == "granted" || result.state == "prompt") { - navigator.clipboard.write(data).then(function() { - /* success */ - }, function(e) { - console.log(e, "fail") - }) - } +export const writeClipboard = (text, isHtml) => { + let blob = new Blob([text], { + type: ["text/plain"] + }); + let data = [new ClipboardItem({ + ["text/plain"]: blob + })]; + if (isHtml) { + blob = new Blob([text], { + type: ["text/plain", "text/html"] }) -} + data = [new ClipboardItem({ + ["text/plain"]: blob, + ["text/html"]: blob + })]; + } + navigator.permissions.query({ + name: "clipboard-write" + }).then((result) => { + if (result.state == "granted" || result.state == "prompt") { + navigator.clipboard.write(data).then(() => { + /* success */ + }).catch(e => { + console.log(e, "fail") + }) + } + }) +} \ No newline at end of file