feature: client: images: migrate to EMS

This commit is contained in:
coderiaser 2026-01-21 19:59:27 +02:00
parent 7192a56e94
commit f437a52ff0
22 changed files with 49 additions and 47 deletions

View file

@ -9,7 +9,7 @@ import {tryToCatch} from 'try-to-catch';
import {addSlashToEnd} from 'format-io'; import {addSlashToEnd} from 'format-io';
import pascalCase from 'just-pascal-case'; import pascalCase from 'just-pascal-case';
import currify from 'currify'; import currify from 'currify';
import Images from './dom/images.js'; import * as Images from './dom/images.mjs';
import {unregisterSW} from './sw/register.js'; import {unregisterSW} from './sw/register.js';
import {getJsonFromFileTable} from './get-json-from-file-table.mjs'; import {getJsonFromFileTable} from './get-json-from-file-table.mjs';
import {Key} from './key/index.mjs'; import {Key} from './key/index.mjs';

View file

@ -305,4 +305,3 @@ function getDOM(overrides = {}) {
}, },
}; };
} }

View file

@ -3,7 +3,7 @@
/* global CloudCmd */ /* global CloudCmd */
const philip = require('philip'); const philip = require('philip');
const Images = require('./images'); const Images = require('./images.mjs');
const {FS} = require('../../common/cloudfunc.mjs'); const {FS} = require('../../common/cloudfunc.mjs');
const DOM = require('.'); const DOM = require('.');
const Dialog = require('./dialog'); const Dialog = require('./dialog');

View file

@ -1,10 +1,5 @@
/* global DOM */ /* global DOM */
import createElement from '@cloudcmd/create-element';
'use strict';
const createElement = require('@cloudcmd/create-element');
const Images = module.exports;
const LOADING = 'loading'; const LOADING = 'loading';
const HIDDEN = 'hidden'; const HIDDEN = 'hidden';
@ -12,7 +7,8 @@ const ERROR = 'error';
const getLoadingType = () => isSVG() ? '-svg' : '-gif'; const getLoadingType = () => isSVG() ? '-svg' : '-gif';
module.exports.get = getElement; export const get = getElement;
/** /**
* check SVG SMIL animation support * check SVG SMIL animation support
*/ */
@ -40,7 +36,7 @@ function getElement() {
} }
/* Функция создаёт картинку загрузки */ /* Функция создаёт картинку загрузки */
module.exports.loading = () => { export const loading = () => {
const element = getElement(); const element = getElement();
const {classList} = element; const {classList} = element;
const loadingImage = LOADING + getLoadingType(); const loadingImage = LOADING + getLoadingType();
@ -52,7 +48,7 @@ module.exports.loading = () => {
}; };
/* Функция создаёт картинку ошибки загрузки */ /* Функция создаёт картинку ошибки загрузки */
module.exports.error = () => { export const error = () => {
const element = getElement(); const element = getElement();
const {classList} = element; const {classList} = element;
const loadingImage = LOADING + getLoadingType(); const loadingImage = LOADING + getLoadingType();
@ -63,14 +59,21 @@ module.exports.error = () => {
return element; return element;
}; };
module.exports.show = show; show.load = show;
module.exports.show.load = show; show.error = (text) => {
module.exports.show.error = error; const image = Images.error();
DOM.show(image);
image.title = text;
return image;
};
/** /**
* Function shows loading spinner * Function shows loading spinner
* position = {top: true}; * position = {top: true};
*/ */
function show(position, panel) { export function show(position, panel) {
const image = Images.loading(); const image = Images.loading();
const parent = image.parentElement; const parent = image.parentElement;
const refreshButton = DOM.getRefreshButton(panel); const refreshButton = DOM.getRefreshButton(panel);
@ -96,19 +99,10 @@ function show(position, panel) {
return image; return image;
} }
function error(text) {
const image = Images.error();
DOM.show(image);
image.title = text;
return image;
}
/** /**
* hide load image * hide load image
*/ */
module.exports.hide = () => { export const hide = () => {
const element = Images.get(); const element = Images.get();
DOM.hide(element); DOM.hide(element);
@ -116,7 +110,7 @@ module.exports.hide = () => {
return Images; return Images;
}; };
module.exports.setProgress = (value, title) => { export const setProgress = (value, title) => {
const DATA = 'data-progress'; const DATA = 'data-progress';
const element = Images.get(); const element = Images.get();
@ -131,7 +125,7 @@ module.exports.setProgress = (value, title) => {
return Images; return Images;
}; };
module.exports.clearProgress = () => { export const clearProgress = () => {
const DATA = 'data-progress'; const DATA = 'data-progress';
const element = Images.get(); const element = Images.get();
@ -143,3 +137,13 @@ module.exports.clearProgress = () => {
return Images; return Images;
}; };
const Images = {
clearProgress,
setProgress,
show,
hide,
get,
error,
loading,
};

View file

@ -3,7 +3,7 @@
/* global CloudCmd */ /* global CloudCmd */
const Util = require('../../common/util'); const Util = require('../../common/util');
const Images = require('./images'); const Images = require('./images.mjs');
const RESTful = require('./rest'); const RESTful = require('./rest');
const Storage = require('./storage'); const Storage = require('./storage');
const renameCurrent = require('./operations/rename-current'); const renameCurrent = require('./operations/rename-current');

View file

@ -3,7 +3,7 @@
/* global CloudCmd */ /* global CloudCmd */
const {promisify} = require('es6-promisify'); const {promisify} = require('es6-promisify');
const Images = require('../images'); const Images = require('../images.mjs');
const load = require('../load'); const load = require('../load');
module.exports = promisify((params, callback) => { module.exports = promisify((params, callback) => {

View file

@ -4,7 +4,7 @@ const itype = require('itype');
const jonny = require('jonny'); const jonny = require('jonny');
const Emitify = require('emitify'); const Emitify = require('emitify');
const exec = require('execon'); const exec = require('execon');
const Images = require('./images'); const Images = require('./images.mjs');
module.exports.getIdBySrc = getIdBySrc; module.exports.getIdBySrc = getIdBySrc;
/** /**

View file

@ -4,7 +4,7 @@ const {tryToCatch} = require('try-to-catch');
const {encode} = require('../../common/entity'); const {encode} = require('../../common/entity');
const Images = require('./images'); const Images = require('./images.mjs');
const IO = require('./io'); const IO = require('./io');
const Dialog = require('./dialog'); const Dialog = require('./dialog');

View file

@ -5,7 +5,7 @@ const {eachSeries} = require('execon');
const wraptile = require('wraptile'); const wraptile = require('wraptile');
const load = require('./load'); const load = require('./load');
const Images = require('./images'); const Images = require('./images.mjs');
const {alert} = require('./dialog'); const {alert} = require('./dialog');
const {FS} = require('../../common/cloudfunc.mjs'); const {FS} = require('../../common/cloudfunc.mjs');

View file

@ -9,7 +9,7 @@ const load = require('load.js');
const {ajax} = require('../dom/load'); const {ajax} = require('../dom/load');
const Files = require('../dom/files'); const Files = require('../dom/files');
const Images = require('../dom/images'); const Images = require('../dom/images.mjs');
const {log} = CloudCmd; const {log} = CloudCmd;
const upload = currify(_upload); const upload = currify(_upload);

View file

@ -13,7 +13,7 @@ const load = require('load.js');
const createElement = require('@cloudcmd/create-element'); const createElement = require('@cloudcmd/create-element');
const input = require('./input'); const input = require('./input');
const Images = require('../../dom/images'); const Images = require('../../dom/images.mjs');
const Events = require('#dom/events'); const Events = require('#dom/events');
const Files = require('../../dom/files'); const Files = require('../../dom/files');

View file

@ -6,7 +6,7 @@
CloudCmd.Contact = exports; CloudCmd.Contact = exports;
const olark = require('@cloudcmd/olark'); const olark = require('@cloudcmd/olark');
const Images = require('../dom/images'); const Images = require('../dom/images.mjs');
const {Events} = DOM; const {Events} = DOM;
const {Key} = CloudCmd; const {Key} = CloudCmd;

View file

@ -3,7 +3,7 @@
/* global CloudCmd */ /* global CloudCmd */
CloudCmd.Help = exports; CloudCmd.Help = exports;
const Images = require('../dom/images'); const Images = require('../dom/images.mjs');
module.exports.init = () => { module.exports.init = () => {
Images.show.load('top'); Images.show.load('top');

View file

@ -12,7 +12,7 @@ const {tryToCatch} = require('try-to-catch');
const loadJS = require('load.js').js; const loadJS = require('load.js').js;
const createElement = require('@cloudcmd/create-element'); const createElement = require('@cloudcmd/create-element');
const Images = require('../dom/images'); const Images = require('../dom/images.mjs');
const {Dialog, CurrentInfo: Info} = DOM; const {Dialog, CurrentInfo: Info} = DOM;
const rmLastSlash = (a) => a.replace(/\/$/, '') || '/'; const rmLastSlash = (a) => a.replace(/\/$/, '') || '/';

View file

@ -5,7 +5,7 @@ CloudCmd.Markdown = exports;
const createElement = require('@cloudcmd/create-element'); const createElement = require('@cloudcmd/create-element');
const Images = require('../dom/images'); const Images = require('../dom/images.mjs');
const {Markdown} = require('../dom/rest'); const {Markdown} = require('../dom/rest');
const {alert} = require('../dom/dialog'); const {alert} = require('../dom/dialog');

View file

@ -41,6 +41,7 @@ export const setListeners = (options) => (emitter) => {
})); }));
let noProgress = true; let noProgress = true;
const listeners = { const listeners = {
progress: (value) => { progress: (value) => {
done = value === 100; done = value === 100;

View file

@ -10,7 +10,7 @@ require('../../css/terminal.css');
const exec = require('execon'); const exec = require('execon');
const load = require('load.js'); const load = require('load.js');
const DOM = require('../dom'); const DOM = require('../dom');
const Images = require('../dom/images'); const Images = require('../dom/images.mjs');
const {Dialog} = DOM; const {Dialog} = DOM;
const {Key, config} = CloudCmd; const {Key, config} = CloudCmd;

View file

@ -9,7 +9,7 @@ require('../../css/terminal.css');
const exec = require('execon'); const exec = require('execon');
const load = require('load.js'); const load = require('load.js');
const DOM = require('../dom'); const DOM = require('../dom');
const Images = require('../dom/images'); const Images = require('../dom/images.mjs');
const loadParallel = load.parallel; const loadParallel = load.parallel;

View file

@ -6,7 +6,7 @@ CloudCmd.Upload = exports;
const createElement = require('@cloudcmd/create-element'); const createElement = require('@cloudcmd/create-element');
const Files = require('../dom/files'); const Files = require('../dom/files');
const Images = require('../dom/images'); const Images = require('../dom/images.mjs');
const uploadFiles = require('../dom/upload-files'); const uploadFiles = require('../dom/upload-files');
module.exports.init = async () => { module.exports.init = async () => {

View file

@ -12,7 +12,7 @@ const {tryCatch} = require('try-catch');
const {tryToCatch} = require('try-to-catch'); const {tryToCatch} = require('try-to-catch');
const {codeFrameColumns} = require('@babel/code-frame'); const {codeFrameColumns} = require('@babel/code-frame');
const Images = require('../../dom/images'); const Images = require('../../dom/images.mjs');
const Dialog = require('../../dom/dialog'); const Dialog = require('../../dom/dialog');
const getUserMenu = require('./get-user-menu'); const getUserMenu = require('./get-user-menu');
const navigate = require('./navigate'); const navigate = require('./navigate');

View file

@ -27,7 +27,7 @@ const {
const Files = require('../../dom/files'); const Files = require('../../dom/files');
const Events = require('#dom/events'); const Events = require('#dom/events');
const Images = require('../../dom/images'); const Images = require('../../dom/images.mjs');
const {encode} = require('../../../common/entity'); const {encode} = require('../../../common/entity');
const isString = (a) => typeof a === 'string'; const isString = (a) => typeof a === 'string';

View file

@ -33,9 +33,7 @@ export default defineConfig([
}, { }, {
files: ['{client,common,static}/**/*.js'], files: ['{client,common,static}/**/*.js'],
languageOptions: { languageOptions: {
globals: { globals: globals.browser,
...globals.browser,
},
}, },
}, },
...matchToFlat(match), ...matchToFlat(match),