feature: client: edit: migrate to ESM

Author: coderaiser

.webpack/js.mjs

@@ -119,7 +119,7 @@ export default {
         'user-menu': `${dirCss}/user-menu.css`,
         'sw': `${dir}/sw/sw.mjs`,
         'cloudcmd': `${dir}/cloudcmd.mjs`,
-        [`${modules}/edit`]: `${dirModules}/edit.js`,
+        [`${modules}/edit`]: `${dirModules}/edit.mjs`,
         [`${modules}/edit-file`]: `${dirModules}/edit-file.js`,
         [`${modules}/edit-file-vim`]: `${dirModules}/edit-file-vim.js`,
         [`${modules}/edit-names`]: `${dirModules}/edit-names.js`,

client/modules/edit.js client/modules/edit.mjsclient/modules/edit.js renamed to client/modules/edit.mjs

@@ -1,23 +1,28 @@
 /* global CloudCmd */
+import montag from 'montag';
+import {promisify} from 'es6-promisify';
+import {tryToCatch} from 'try-to-catch';
+import createElement from '@cloudcmd/create-element';
+import load from 'load.js';
+import {MAX_FILE_SIZE as maxSize} from '#common/cloudfunc';
+import {time, timeEnd} from '#common/util';
+
+export function getEditor() {
+    return editor;
+}
 
-'use strict';
-
-const montag = require('montag');
-
-const {promisify} = require('es6-promisify');
-const {tryToCatch} = require('try-to-catch');
-const createElement = require('@cloudcmd/create-element');
-const load = require('load.js');
-const {MAX_FILE_SIZE: maxSize} = require('#common/cloudfunc');
-
-const {time, timeEnd} = require('#common/util');
-const getEditor = () => editor;
 const isFn = (a) => typeof a === 'function';
 const loadJS = load.js;
 
 const Name = 'Edit';
 
-CloudCmd[Name] = exports;
+CloudCmd[Name] = {
+    init,
+    show,
+    hide,
+    getEditor,
+    getElement,
+};
 
 const EditorName = CloudCmd.config('editor');
 
@@ -33,12 +38,12 @@ const ConfigView = {
     },
 };
 
-module.exports.init = async () => {
+export async function init() {
     const element = create();
 
     await CloudCmd.View();
     await loadFiles(element);
-};
+}
 
 function create() {
     const element = createElement('div', {
@@ -79,7 +84,7 @@ function initConfig(options = {}) {
     return config;
 }
 
-module.exports.show = (options) => {
+export function show(options) {
     if (Loading)
         return;
 
@@ -88,15 +93,15 @@ module.exports.show = (options) => {
     getEditor().setOptions({
         fontSize: 16,
     });
-};
-
-module.exports.getEditor = getEditor;
+}
 
-module.exports.getElement = () => Element;
+export function getElement() {
+    return Element;
+}
 
-module.exports.hide = () => {
+export function hide() {
     CloudCmd.View.hide();
-};
+}
 
 const loadFiles = async (element) => {
     const prefix = `${CloudCmd.prefix}/${EditorName}`;

client/modules/operation/index.mjs

@@ -51,19 +51,19 @@ export const init = promisify((callback) => {
     exec.series([
         DOM.loadSocket,
         async (callback) => {
-        if (config('dropbox'))
-            return callback();
-        
-        const {prefix, prefixSocket} = CloudCmd;
-        
-        await loadAll();
-        await initOperations(prefix, prefixSocket, callback);
-    },
+            if (config('dropbox'))
+                return callback();
+            
+            const {prefix, prefixSocket} = CloudCmd;
+            
+            await loadAll();
+            await initOperations(prefix, prefixSocket, callback);
+        },
         (callback) => {
-        Loaded = true;
-        Images.hide();
-        callback();
-    },
+            Loaded = true;
+            Images.hide();
+            callback();
+        },
     ], callback);
 });
 

client/modules/view/index.mjs

@@ -11,12 +11,12 @@ import * as Files from '#dom/files';
 import * as Events from '#dom/events';
 import {FS} from '#common/cloudfunc';
 import * as Images from '#dom/images';
+import {encode} from '#common/entity';
 import {
     isImage,
     isAudio,
     getType,
 } from './types.mjs';
-import {encode} from '#common/entity';
 
 const CloudCmd = globalThis.CloudCmd || {};
 const DOM = globalThis.DOM || {};

common/cloudfunc.mjs

@@ -168,6 +168,7 @@ export const buildFromJSON = (params) => {
     Path(path);
 
     fileTable += `${header}<ul data-name="js-files" class="files">`;
+    
     /* Если мы не в корне */
     if (path !== '/') {
         const dotDot = getDotDot(path);
@@ -198,43 +199,43 @@ export const buildFromJSON = (params) => {
 
     fileTable += files
         .filter(filterOutDotFiles({
-        showDotFiles,
-    }))
+            showDotFiles,
+        }))
         .map(updateField)
         .map((file) => {
-        const name = encode(file.name);
-        const link = prefix + FS + path + name;
-        
-        const {
-            type,
-            mode,
-            date,
-            owner,
-            size,
-        } = file;
-        
-        const linkResult = rendy(templateLink, {
-            link,
-            title: name,
-            name,
-            attribute: getAttribute(file.type),
-        });
-        
-        const dataName = _getDataName(file.name);
-        const attribute = `draggable="true" ${dataName}`;
-        
-        return rendy(templateFile, {
-            tag: 'li',
-            attribute,
-            className: '',
-            type,
-            name: linkResult,
-            size,
-            date,
-            owner,
-            mode,
-        });
-    })
+            const name = encode(file.name);
+            const link = prefix + FS + path + name;
+            
+            const {
+                type,
+                mode,
+                date,
+                owner,
+                size,
+            } = file;
+            
+            const linkResult = rendy(templateLink, {
+                link,
+                title: name,
+                name,
+                attribute: getAttribute(file.type),
+            });
+            
+            const dataName = _getDataName(file.name);
+            const attribute = `draggable="true" ${dataName}`;
+            
+            return rendy(templateFile, {
+                tag: 'li',
+                attribute,
+                className: '',
+                type,
+                name: linkResult,
+                size,
+                date,
+                owner,
+                mode,
+            });
+        })
         .join('');
 
     fileTable += '</ul>';