chore: cloudcmd: actions: lint ☘️

This reverts commit b0687b54c7.

.appveyor.yml

@@ -1,17 +0,0 @@
-platform: x64
-
-install:
-  - ps: Install-Product node $env:nodejs_version $env:platform
-
-build: off
-
-build_script:
-    - node --version
-    - npm --version
-    
-    - npm i now nupdate -g
-    - nupdate -a gritty
-    - now rm cloudcmd -y -t %NOW_TOKEN%
-    - now --public -t %NOW_TOKEN%
-    - now alias -t %NOW_TOKEN%
-

.babelrc

@@ -1,10 +0,0 @@
-{
-    "presets": [
-      "env"
-    ],
-    "plugins": [
-      "transform-object-assign",
-      "transform-object-rest-spread"
-    ]
-}
-

.babelrc.json

@@ -0,0 +1,9 @@
+{
+    "presets": [
+        "@babel/preset-env"
+    ],
+    "plugins": [
+        "module:babel-plugin-macros",
+        "@babel/plugin-transform-optional-chaining"
+    ]
+}

.bowerrc

@@ -1,3 +0,0 @@
-{
-  "directory" : "modules"
-}

.browserslistrc

@@ -0,0 +1,4 @@
+last 2 Chrome versions
+last 2 Safari versions
+Firefox ESR
+not dead

.cloudcmd.menu.js

@@ -0,0 +1,31 @@
+export default {
+    'F2 - Rename File': renameCurrent,
+    'L - Lint': run('npm run lint'),
+    'F - Fix Lint': run('npm run fix:lint'),
+    'T - Test': run('npm run test'),
+    'C - Coverage': run('npm run coverage'),
+    'D - Build Dev': run('npm run build:client:dev'),
+    'P - Build Prod': run('npm run build:client'),
+};
+
+async function renameCurrent(DOM) {
+    await DOM.renameCurrent();
+}
+
+function run(command) {
+    return async ({CloudCmd, DOM}) => {
+        const {TerminalRun, config} = CloudCmd;
+        
+        const {CurrentInfo} = DOM;
+        const {dirPath} = CurrentInfo;
+        
+        const cwd = config('root') + dirPath;
+        
+        return await TerminalRun.show({
+            cwd,
+            command,
+            closeMessage: 'Press any key to close Terminal',
+            autoClose: false,
+        });
+    };
+}

.dockerignore

@@ -11,27 +11,13 @@ yarn-error.log
 yarn.lock
 now.json
 
-Dockerfile
-Dockerfile.alpine
+docker
 
 webpack.config.js
+cssnano.config.js
 
 bin/release.js
 
-modules/jquery/dist
-modules/jquery/external
-modules/jquery/src
-
-!modules/jquery/dist/jquery.min.js
-
-modules/fancybox/lib/
-modules/fancybox/demo
-modules/fancybox/sprite.psd
-
-modules/execon
-modules/emitify
-
 client
-legacy
 server_
 

.editorconfig

@@ -9,7 +9,7 @@ root = true
 charset = utf-8
 end_of_line = lf
 insert_final_newline = true
-trim_trailing_whitespace = true
+trim_trailing_whitespace = false
 indent_style = space
 indent_size = 4
 

.eslintrc

@@ -1,22 +0,0 @@
-{
-    "env": {
-        "es6": true,
-        "node": true,
-    },
-    "parserOptions": {
-        "ecmaVersion": 2017,
-        "sourceType": "module",
-        "ecmaFeatures": {
-            "experimentalObjectRestSpread": true
-        }
-    },
-    "rules": {
-        "indent": ["error", 4],
-        "semi": "error",
-        "no-console": 0,
-        "no-use-before-define": ["error", "nofunc"]
-    },
-    "extends": [
-        "eslint:recommended"
-    ]
-}

.eslintrc.server

@@ -1,15 +0,0 @@
-{
-    "env": {
-        "node": true
-    },
-    "rules": {
-        "no-process-exit": 0
-    },
-    "extends": [
-        ".eslintrc",
-        "plugin:node/recommended"
-    ],
-    "plugins": [
-        "node"
-    ]
-}

.github/FUNDING.yml

@@ -0,0 +1,3 @@
+github: coderaiser
+open_collective: cloudcmd
+ko_fi: coderaiser

.github/ISSUE_TEMPLATE.md

@@ -1,12 +0,0 @@
-<!--
-Thank you for reporting an issue. Please fill in the template below. If unsure
-about something, just do as best as you're able.
--->
-
-* **Version** (`cloudcmd -v`): 
-* **Node Version** `node -v`: 
-* **OS** (`uname -a` on Linux): 
-* **Browser name/version**: 
-* **Used Command Line Parameters**: 
-* **Changed Config**: 
-

.github/ISSUE_TEMPLATE/bug_report.md

@@ -0,0 +1,45 @@
+---
+
+name: Bug report
+about: Create a report to help us improve
+title: ''
+labels: needs clarification
+assignees: coderaiser
+
+---
+
+**Describe the bug**
+A clear and concise description of what the bug is.
+
+**To Reproduce**
+Steps to reproduce the behavior:
+
+1. Go to '...'
+2. Click on '....'
+3. Scroll down to '....'
+4. See error
+
+**Expected behavior**
+A clear and concise description of what you expected to happen.
+
+**Screenshots**
+If applicable, add screenshots to help explain your problem.
+
+**Desktop (please complete the following information):**
+
+- **Version** (`cloudcmd -v`):
+- **Node Version** `node -v`:
+- **OS** (`uname -a` on Linux):
+- **Browser name/version**:
+- **Used Command Line Parameters**:
+- **Changed Config**:
+  
+```json
+{}
+```
+- [ ] 🎁 **I'm ready to donate on https://opencollective.com/cloudcmd**
+- [ ] 🎁 **I'm ready to donate on https://ko-fi.com/coderaiser**
+- [ ] 💪 **I'm willing to work on this issue**
+
+**Additional context**
+Add any other context about the problem here.

.github/ISSUE_TEMPLATE/config.yml

@@ -0,0 +1,5 @@
+blank_issues_enabled: false
+contact_links:
+  - name: Stack Overflow
+    url: https://stackoverflow.com/search?q=cloudcmd
+    about: Please ask and answer questions here.

.github/ISSUE_TEMPLATE/feature_request.md

@@ -0,0 +1,21 @@
+---
+
+name: Feature request
+about: Suggest an idea for this project
+title: ''
+labels: ''
+assignees: ''
+
+---
+
+**Is your feature request related to a problem? Please describe.**
+A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
+
+**Describe the solution you'd like**
+A clear and concise description of what you want to happen.
+
+**Describe alternatives you've considered**
+A clear and concise description of any alternative solutions or features you've considered.
+
+**Additional context**
+Add any other context or screenshots about the feature request here.

.github/ISSUE_TEMPLATE/issue_template.md

@@ -0,0 +1,24 @@
+***
+
+name: Tracking issue
+about: Create an issue with bug report or feature request.
+title: ""
+labels: needs triage
+assignees: coderaiser
+
+***
+
+- **Version** (`cloudcmd -v`):
+- **Node Version** `node -v`:
+- **OS** (`uname -a` on Linux):
+- **Browser name/version**:
+- **Used Command Line Parameters**:
+- **Changed Config**:
+
+```json
+{}
+```
+
+- [ ] 🎁 **I'm ready to donate on https://opencollective.com/cloudcmd**
+- [ ] 🎁 **I'm ready to donate on https://ko-fi.com/coderaiser**
+- [ ] 💪 **I'm willing to work on this issue**

.github/PULL_REQUEST_TEMPLATE.md

@@ -4,6 +4,5 @@ about something, just do as best as you're able.
 -->
 
 - [ ] commit message named according to [Contributing Guide](https://github.com/coderaiser/cloudcmd/blob/master/CONTRIBUTING.md "Contributting Guide")
-- [ ] `npm run codestyle` is OK
+- [ ] `npm run fix:lint` is OK
 - [ ] `npm test` is OK
-

.github/workflows/docker-io.yml

@@ -0,0 +1,60 @@
+name: Docker IO
+permissions:
+  contents: write
+on:
+  - push
+jobs:
+  buildx:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      packages: write
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v5
+      - uses: oven-sh/setup-bun@v2
+        with:
+          bun-version: latest
+      - name: Use Node.js 24.x
+        uses: actions/setup-node@v6
+        with:
+          node-version: 24.x
+      - name: Install Redrun
+        run: bun i redrun -g --no-save
+      - name: NPM Install
+        run: bun i --no-save
+      - name: Lint
+        run: redrun lint
+      - name: Build
+        id: build
+        run: |
+          redrun build
+          VERSION=$(grep '"version":' package.json -m1 | cut -d\" -f4)
+          echo "version=$VERSION" >> $GITHUB_OUTPUT
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v4
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v4
+      - name: Login to DockerHub
+        uses: docker/login-action@v4
+        with:
+          username: ${{ secrets.DOCKER_USERNAME }}
+          password: ${{ secrets.DOCKER_TOKEN }}
+      - name: Login to GitHub Container Registry
+        uses: docker/login-action@v4
+        with:
+          registry: ghcr.io
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+      - name: Build and push io-image
+        uses: docker/build-push-action@v7
+        with:
+          context: .
+          file: docker/Dockerfile.io
+          platforms: linux/amd64,linux/arm64
+          push: true
+          tags: |
+            coderaiser/cloudcmd:io
+            coderaiser/cloudcmd:${{ steps.build.outputs.version }}-io
+            ghcr.io/${{ github.repository }}-io
+            ghcr.io/${{ github.repository }}:${{ steps.build.outputs.version }}-io

.github/workflows/docker.yml

@@ -0,0 +1,88 @@
+name: Docker CI
+permissions:
+  contents: write
+on:
+  push:
+    tags:
+      - "*"
+jobs:
+  buildx:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      packages: write
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v5
+      - uses: oven-sh/setup-bun@v2
+        with:
+          bun-version: latest
+      - name: Use Node.js 22.x
+        uses: actions/setup-node@v6
+        with:
+          node-version: 22.x
+      - name: Install Redrun
+        run: bun i redrun -g --no-save
+      - name: NPM Install
+        run: bun i --no-save
+      - name: Lint
+        run: redrun lint
+      - name: Build
+        id: build
+        run: |
+          redrun build
+          VERSION=$(grep '"version":' package.json -m1 | cut -d\" -f4)
+          echo "version=$VERSION" >> $GITHUB_OUTPUT
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v4
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v4
+      - name: Login to DockerHub
+        uses: docker/login-action@v4
+        with:
+          username: ${{ secrets.DOCKER_USERNAME }}
+          password: ${{ secrets.DOCKER_TOKEN }}
+      - name: Login to GitHub Container Registry
+        uses: docker/login-action@v4
+        with:
+          registry: ghcr.io
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+      - name: Build and push base-image
+        uses: docker/build-push-action@v7
+        with:
+          context: .
+          file: docker/Dockerfile
+          platforms: linux/amd64,linux/arm64
+          push: true
+          tags: |
+            coderaiser/cloudcmd:latest
+            coderaiser/cloudcmd:${{ steps.build.outputs.version }}
+            ghcr.io/${{ github.repository }}:latest
+            ghcr.io/${{ github.repository }}:${{ steps.build.outputs.version }}
+      - name: Build and push alpine-image
+        uses: docker/build-push-action@v7
+        with:
+          context: .
+          file: docker/Dockerfile.alpine
+          platforms: linux/amd64,linux/arm64
+          push: true
+          tags: |
+            coderaiser/cloudcmd:alpine
+            coderaiser/cloudcmd:latest-alpine
+            coderaiser/cloudcmd:${{ steps.build.outputs.version }}-alpine
+            ghcr.io/${{ github.repository }}:latest-alpine
+            ghcr.io/${{ github.repository }}:${{ steps.build.outputs.version }}-alpine
+      - name: Build and push slim-image
+        uses: docker/build-push-action@v7
+        with:
+          context: .
+          file: docker/Dockerfile.slim
+          platforms: linux/amd64,linux/arm64
+          push: true
+          tags: |
+            coderaiser/cloudcmd:slim
+            coderaiser/cloudcmd:latest-slim
+            coderaiser/cloudcmd:${{ steps.build.outputs.version }}-slim
+            ghcr.io/${{ github.repository }}-slim
+            ghcr.io/${{ github.repository }}:${{ steps.build.outputs.version }}-slim

.github/workflows/nodejs.yml

@@ -0,0 +1,53 @@
+name: Node CI
+on:
+  - push
+permissions:
+  contents: write
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    env:
+      NAME: cloudcmd
+    strategy:
+      matrix:
+        node-version:
+          - 22.x
+          - 24.x
+          - 26.x
+    steps:
+      - uses: actions/checkout@v5
+      - uses: oven-sh/setup-bun@v2
+        with:
+          bun-version: latest
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v6
+        with:
+          node-version: ${{ matrix.node-version }}
+      - name: Install Redrun
+        run: bun i redrun madrun -g --no-save
+      - name: Install
+        run: bun i --no-save
+      - name: Init Madrun
+        run: madrun --init
+      - name: Lint
+        run: redrun fix:lint
+      - name: Typos
+        uses: coderaiser/typos.ai@v1.1.8
+        with:
+          key: ${{ secrets.TYPOS_AI_KEY }}
+      - name: Commit fixes
+        uses: EndBug/add-and-commit@v10
+        continue-on-error: true
+        with:
+          message: "chore: ${{ env.NAME }}: actions: lint ☘️"
+      - name: Build
+        run: redrun build
+      - name: Test
+        run: redrun test
+      - name: Coverage
+        run: redrun coverage coverage:report
+      - name: Coveralls
+        uses: coverallsapp/github-action@v2
+        continue-on-error: true
+        with:
+          github-token: ${{ secrets.GITHUB_TOKEN }}

.gitignore

@@ -1,30 +1,17 @@
-package-lock.json
-yarn.lock
-yarn-error.log
-node_modules
-npm-debug.log*
-coverage
-
-modules/jquery/dist
-modules/jquery/external
-modules/jquery/src
-
-!modules/jquery/dist/jquery.min.js
-
-modules/fancybox/lib/
-modules/fancybox/demo
-modules/fancybox/sprite.psd
-modules/fancybox/*.json
-modules/fancybox/gulpfile.js
-modules/jquery-mousewheel
-
-modules/execon
-modules/emitify
+*.swp
+*.log
+*.lock
 
 .nyc_output
+.DS_Store
+.idea
 
-*.swp
+package-lock.json
+npm-debug.log*
 
+node_modules
+coverage
+modules/execon
+modules/emitify
 dist
 dist-dev
-

.madrun.js

@@ -0,0 +1,62 @@
+import {run, cutEnv} from 'madrun';
+import {defineEnv} from 'supertape/env';
+
+const testEnv = defineEnv({
+    timeout: 7000,
+    css: true,
+});
+
+const buildEnv = {
+    NODE_ENV: 'production',
+};
+
+export default {
+    'start': () => 'node bin/cloudcmd.js',
+    'start:dev': async () => await run('start', null, {
+        NODE_ENV: 'development',
+    }),
+    'build:start': () => run(['build:client', 'start']),
+    'build:start:dev': () => run([
+        'build:client:dev',
+        'start:dev',
+    ]),
+    'lint:all': () => run('lint:progress'),
+    'lint': () => 'redlint fix; putout .',
+    'lint:progress': () => run('lint', '-f progress'),
+    'watch:lint': () => 'nodemon -w client -w server -w test -w common -w .webpack -x "putout -s"',
+    'fresh:lint': () => run('lint', '--fresh'),
+    'lint:fresh': () => run('lint', '--fresh'),
+    'fix:lint': async () => `putout --fix . && redlint fix`,
+    'lint:stream': () => run('lint', '-f stream'),
+    'test': () => [testEnv, `tape '{test}/**/*.js' '{bin,client,static,common,server}/**/*.spec.js' -f fail`],
+    'test:e2e': () => `tape 'test-e2e/**/*.js'`,
+    'test:client': () => `tape 'test/client/**/*.js'`,
+    'test:server': () => `tape 'test/**/*.js' 'server/**/*.spec.js' 'common/**/*.spec.js'`,
+    'wisdom': async () => await run(['lint:all', 'build', 'test'], null, {
+        CI: 1,
+    }),
+    'wisdom:type': () => 'bin/release.js',
+    'coverage': async () => [testEnv, `c8 ${await cutEnv('test')}`],
+    'coverage:report': () => 'c8 report --reporter=lcov',
+    'report': () => 'c8 report --reporter=lcov',
+    '6to5': () => [buildEnv, 'rspack build --config rspack.config.js'],
+    '6to5:client': () => run('6to5', '--mode production'),
+    '6to5:client:dev': async () => await run('6to5', '--mode development', {
+        NODE_ENV: 'development',
+    }),
+    'pre6to5:client': () => 'rimraf dist',
+    'pre6to5:client:dev': () => 'rimraf dist-dev',
+    'watch:client': () => run('6to5:client', '--watch'),
+    'watch:client:dev': () => run('6to5:client:dev', '--watch'),
+    'watch:server': () => 'nodemon bin/cloudcmd.js',
+    'watch:test': async () => [testEnv, `nodemon -w client -w server -w test -w common -x ${await cutEnv('test')}`],
+    'watch:test:client': async () => `nodemon -w client -w test/client -x ${await run('test:client')}`,
+    'watch:test:server': async () => `nodemon -w client -w test/client -x ${await run('test:server')}`,
+    'watch:coverage': async () => [testEnv, `nodemon -w server -w test -w common -x ${await cutEnv('coverage')}`],
+    'watch:fix:lint': async () => `nodemon -w client -w server -w test -w common -x '${await run('fix:lint')}'`,
+    'build': async () => run('6to5:*'),
+    'build:dev': async () => run('build:client:dev'),
+    'build:client': () => run('6to5:client'),
+    'build:client:dev': () => run('6to5:client:dev'),
+    'heroku-postbuild': () => run('6to5:client'),
+};

.npmignore

@@ -1,33 +1,29 @@
+*.spec.*
+*.config.*
+*.fixture.js*
+*.ai
+*.cdr
+*.eps
+*.log
+*.lock
+
 .*
-*.spec.js
+
 manifest.yml
-Dockerfile*
 docker-compose.yml
-test
+now.json
+app.json
+bower.json
+deno.json
+bin/release.*
+img/logo/cloudcmd-hq.png
+webpack.config.js
+
+docker
+test*
+fixture
+fixture-*
 coverage
 css
 html
-yarn-error.log
-yarn.lock
-now.json
-
-modules/jquery/dist
-modules/jquery/external
-modules/jquery/src
-
-!modules/jquery/dist/jquery.min.js
-
-modules/fancybox/lib/
-modules/fancybox/demo
-modules/fancybox/sprite.psd
-
-app.json
-bower.json
-manifest.yml
-
-bin/release.js
-
 client
-
-webpack.config.js
-

.nycrc.json

@@ -0,0 +1,15 @@
+{
+    "checkCoverage": false,
+    "all": false,
+    "exclude": [
+        "**/*.spec.js",
+        "**/*.*.js",
+        "**/*.config.*",
+        "**/fixture",
+        "**/test/**"
+    ],
+    "branches": 100,
+    "lines": 100,
+    "functions": 100,
+    "statements": 100
+}

.putout.json

@@ -0,0 +1,60 @@
+{
+    "plugins": ["cloudcmd"],
+    "ignore": [
+        "*.md",
+        "app.json",
+        "fontello.json",
+        "html",
+        "fixture*"
+    ],
+    "rules": {
+        "package-json/add-type": "off"
+    },
+    "match": {
+        ".filesystem.json": {
+            "nodejs/rename-file-cjs-to-js": "off"
+        },
+        "base64": {
+            "types/convert-typeof-to-is-type": "off"
+        },
+        "*.md": {
+            "nodejs/convert-commonjs-to-esm": "on"
+        },
+        ".webpack": {
+            "webpack": "on"
+        },
+        "server": {
+            "nodejs/remove-process-exit": "on"
+        },
+        "server/{server,exit}.js": {
+            "nodejs/remove-process-exit": "off"
+        },
+        "server/{server,exit,terminal,distribute/log}.{js,mjs}": {
+            "remove-console": "off"
+        },
+        "client/{client,cloudcmd,load-module}.{js,mjs}": {
+            "remove-console": "off"
+        },
+        "client": {
+            "nodejs": "off"
+        },
+        "client/sw": {
+            "remove-console": "off"
+        },
+        "test/common/cloudfunc.js": {
+            "remove-console": "off"
+        },
+        "storage.js": {
+            "promises/remove-useless-async": "off"
+        },
+        "docker.yml": {
+            "github/set-node-versions": "off"
+        },
+        "vim.js": {
+            "merge-duplicate-functions": "off"
+        },
+        "common": {
+            "nodejs/declare": "off"
+        }
+    }
+}

.rspack/css.js

@@ -0,0 +1,38 @@
+import {env} from 'node:process';
+import {rspack} from '@rspack/core';
+
+const {CssExtractRspackPlugin} = rspack;
+const isDev = env.NODE_ENV === 'development';
+
+const plugins = [
+    new CssExtractRspackPlugin({
+        filename: '[name].css',
+    }),
+];
+
+const rules = [{
+    test: /\.css$/i,
+    use: [CssExtractRspackPlugin.loader, {
+        loader: 'css-loader',
+        options: {
+            url: true,
+        },
+    }],
+}, {
+    test: /\.(png|gif|svg|woff|woff2|eot|ttf)$/,
+    type: 'asset/inline',
+}];
+
+export default {
+    mode: isDev ? 'development' : 'production',
+    plugins,
+    module: {
+        rules,
+    },
+    optimization: {
+        minimize: !isDev,
+        minimizer: [
+            new rspack.LightningCssMinimizerRspackPlugin(),
+        ],
+    },
+};

.rspack/html.js

@@ -0,0 +1,36 @@
+import {env} from 'node:process';
+import HtmlWebpackPlugin from 'html-webpack-plugin';
+
+const isDev = env.NODE_ENV === 'development';
+
+export const plugins = [
+    new HtmlWebpackPlugin({
+        inject: false,
+        template: 'html/index.html',
+        minify: !isDev && getMinifyHtmlOptions(),
+    }),
+];
+
+function getMinifyHtmlOptions() {
+    return {
+        removeComments: true,
+        removeCommentsFromCDATA: true,
+        removeCDATASectionsFromCDATA: true,
+        collapseWhitespace: true,
+        collapseBooleanAttributes: true,
+        removeAttributeQuotes: true,
+        removeRedundantAttributes: true,
+        useShortDoctype: true,
+        removeEmptyAttributes: true,
+        /* оставляем, поскольку у нас
+         * в элемент fm генерируеться
+         * таблица файлов
+         */
+        removeEmptyElements: false,
+        removeOptionalTags: true,
+        removeScriptTypeAttributes: true,
+        removeStyleLinkTypeAttributes: true,
+        
+        minifyJS: true,
+    };
+}

.rspack/js.js

@@ -0,0 +1,173 @@
+import {resolve, sep} from 'node:path';
+import {fileURLToPath} from 'node:url';
+import {env} from 'node:process';
+import {rspack} from '@rspack/core';
+
+const resolveModule = (a) => fileURLToPath(import.meta.resolve(a));
+
+const {
+    EnvironmentPlugin,
+    NormalModuleReplacementPlugin,
+    ProvidePlugin,
+} = rspack;
+
+const modules = './modules';
+const dirModules = './client/modules';
+const dirCss = './css';
+const dirThemes = `${dirCss}/themes`;
+const dirColumns = `${dirCss}/columns`;
+const dir = './client';
+const {NODE_ENV} = env;
+const isDev = NODE_ENV === 'development';
+
+const rootDir = new URL('..', import.meta.url).pathname;
+const dist = resolve(rootDir, 'dist');
+const distDev = resolve(rootDir, 'dist-dev');
+const devtool = isDev ? 'eval' : 'source-map';
+
+const noParse = (a) => a.endsWith('.spec.js');
+
+// codegen.macro is a babel-macro (build-time codegen), not supported by
+// Rspack's native SWC transform, so client/sw/sw.js (the only file that
+// uses it) keeps going through babel-loader. Everything else uses
+// Rspack's built-in SWC loader, which is the main source of the speedup.
+const rules = [{
+    test: /sw\/sw\.js$/,
+    exclude: /node_modules/,
+    loader: 'babel-loader',
+}, {
+    test: /\.[mc]?js$/,
+    exclude: [/node_modules/, /sw\/sw\.js$/],
+    loader: 'builtin:swc-loader',
+    options: {
+        jsc: {
+            parser: {
+                syntax: 'ecmascript',
+            },
+        },
+        env: {
+            targets: 'defaults',
+        },
+    },
+}];
+
+const plugins = [
+    new NormalModuleReplacementPlugin(/^node:/, (resource) => {
+        resource.request = resource.request.replace(/^node:/, '');
+    }),
+    new NormalModuleReplacementPlugin(/^putout$/, '@putout/bundle'),
+    new EnvironmentPlugin({
+        NODE_ENV,
+    }),
+    new ProvidePlugin({
+        process: 'process/browser',
+    }),
+];
+
+const splitChunks = {
+    chunks: 'all',
+    cacheGroups: {
+        abcCommon: {
+            name: 'cloudcmd.common',
+            chunks: (chunk) => {
+                const lazyChunks = [
+                    'sw',
+                    'nojs',
+                    'view',
+                    'edit',
+                    'terminal',
+                    'config',
+                    'user-menu',
+                    'help',
+                    'themes/dark',
+                    'themes/light',
+                    'columns/name-size',
+                    'columns/name-size-date',
+                    'columns/name-size-time',
+                    'columns/name-size-date-time',
+                ];
+                
+                return !lazyChunks.includes(chunk.name);
+            },
+            minChunks: 1,
+            enforce: true,
+            priority: -1,
+            reuseExistingChunk: true,
+        },
+    },
+};
+
+export default {
+    resolve: {
+        symlinks: false,
+        alias: {
+            'node:process': 'process',
+            'node:path': 'path',
+        },
+        fallback: {
+            path: resolveModule('path-browserify'),
+            process: resolveModule('process/browser'),
+            util: resolveModule('util'),
+        },
+    },
+    devtool,
+    optimization: {
+        splitChunks,
+    },
+    entry: {
+        'themes/dark': `${dirThemes}/dark.css`,
+        'themes/light': `${dirThemes}/light.css`,
+        'columns/name-size': `${dirColumns}/name-size.css`,
+        'columns/name-size-date': `${dirColumns}/name-size-date.css`,
+        'columns/name-size-date-time': `${dirColumns}/name-size-date-time.css`,
+        'nojs': `${dirCss}/nojs.css`,
+        'help': `${dirCss}/help.css`,
+        'view': `${dirCss}/view.css`,
+        'config': `${dirCss}/config.css`,
+        'terminal': `${dirCss}/terminal.css`,
+        'user-menu': `${dirCss}/user-menu.css`,
+        'sw': `${dir}/sw/sw.js`,
+        'cloudcmd': `${dir}/cloudcmd.js`,
+        [`${modules}/edit`]: `${dirModules}/edit.js`,
+        [`${modules}/edit-file`]: `${dirModules}/edit-file.js`,
+        [`${modules}/edit-file-vim`]: `${dirModules}/edit-file-vim.js`,
+        [`${modules}/edit-names`]: `${dirModules}/edit-names.js`,
+        [`${modules}/edit-names-vim`]: `${dirModules}/edit-names-vim.js`,
+        [`${modules}/menu`]: `${dirModules}/menu/index.js`,
+        [`${modules}/view`]: `${dirModules}/view/index.js`,
+        [`${modules}/help`]: `${dirModules}/help.js`,
+        [`${modules}/markdown`]: `${dirModules}/markdown.js`,
+        [`${modules}/config`]: `${dirModules}/config/index.js`,
+        [`${modules}/contact`]: `${dirModules}/contact.js`,
+        [`${modules}/upload`]: `${dirModules}/upload.js`,
+        [`${modules}/operation`]: `${dirModules}/operation/index.js`,
+        [`${modules}/konsole`]: `${dirModules}/konsole.js`,
+        [`${modules}/terminal`]: `${dirModules}/terminal.js`,
+        [`${modules}/terminal-run`]: `${dirModules}/terminal-run.js`,
+        [`${modules}/cloud`]: `${dirModules}/cloud.js`,
+        [`${modules}/user-menu`]: `${dirModules}/user-menu/index.js`,
+        [`${modules}/polyfill`]: `${dirModules}/polyfill.js`,
+        [`${modules}/command-line`]: `${dirModules}/command-line.js`,
+    },
+    output: {
+        filename: '[name].js',
+        path: isDev ? distDev : dist,
+        pathinfo: isDev,
+        devtoolModuleFilenameTemplate,
+        publicPath: '/dist/',
+    },
+    module: {
+        rules,
+        noParse,
+    },
+    plugins,
+    performance: {
+        maxEntrypointSize: 800_000,
+        maxAssetSize: 600_000,
+    },
+};
+
+function devtoolModuleFilenameTemplate(info) {
+    const resource = info.absoluteResourcePath.replace(rootDir + sep, '');
+    return `file://cloudcmd/${resource}`;
+}

.stylelintrc.yml

@@ -1,16 +0,0 @@
-extends: stylelint-config-standard
-rules:
-    indentation: 4
-    declaration-block-trailing-semicolon: always
-    declaration-colon-space-before: null
-    selector-list-comma-newline-after: null
-    comment-empty-line-before: null
-    number-leading-zero: null
-    number-no-trailing-zeros: null
-    string-quotes: single
-    function-url-quotes: never
-    no-eol-whitespace: null
-    font-family-name-quotes: always-unless-keyword
-    font-family-no-missing-generic-family-keyword: null
-    rule-empty-line-before: null
-

.travis.yml

@@ -1,27 +0,0 @@
-language: node_js
-node_js:
-    - 10
-    - 8
-
-script:
-  - npm run lint && npm run build && npm run coverage && npm run report
-
-notifications:
-    email:
-        on_success: never
-        on_failure: change
-
-sudo: required
-
-services:
-  - docker
-
-deploy:
-    provider: script
-    script: npm run docker-ci
-    skip_cleanup: true
-    on:
-        node: '8'
-        tags: true
-        all_branches: false
-

.typos.toml

@@ -0,0 +1,2 @@
+[files]
+extend-exclude = ["ChangeLog"]

.webpack/css.js

@@ -1,72 +0,0 @@
-'use strict';
-
-const fs = require('fs');
-const {
-    basename,
-    extname,
-    join,
-} = require('path');
-
-const {env} = process;
-const isDev = env.NODE_ENV === 'development';
-
-const ExtractTextPlugin = require('extract-text-webpack-plugin');
-
-const extractCSS = (a) => new ExtractTextPlugin(`${a}.css`);
-const extractMain = extractCSS('[name]');
-
-const cssNames = [
-    'nojs',
-    'view',
-    'config',
-    ...getCSSList('columns'),
-];
-
-const cssPlugins = cssNames.map(extractCSS);
-
-const plugins = [
-    ...cssPlugins,
-    extractMain,
-];
-
-const rules = [{
-    test: /\.css$/,
-    exclude: /css\/(nojs|view|config|columns.*)\.css/,
-    use: extractMain.extract([
-        'css-loader?minimize',
-    ]),
-},
-...cssPlugins.map(extract), {
-    test: /\.(png|gif|svg|woff|woff2|eot|ttf)$/,
-    loader: 'url-loader?limit=50000',
-}];
-
-module.exports = {
-    plugins,
-    module: {
-        rules,
-    },
-};
-
-function getCSSList(dir) {
-    const base = (a) => basename(a, extname(a));
-    const addDir = (name) => `${dir}/${name}`;
-    const rootDir = join(__dirname, '..');
-    
-    return fs.readdirSync(`${rootDir}/css/${dir}`)
-        .map(base)
-        .map(addDir);
-}
-
-function extract(extractPlugin) {
-    const {filename} = extractPlugin;
-    const loader = isDev ? 'css-loader' : 'css-loader?minimize';
-    
-    return {
-        test: RegExp(`css/${filename}`),
-        use: extractPlugin.extract([
-            loader
-        ])
-    };
-}
-

.webpack/html.js

@@ -1,43 +0,0 @@
-'use strict';
-
-const {env} = process;
-const isDev = env.NODE_ENV === 'development';
-
-const HtmlWebpackPlugin = require('html-webpack-plugin');
-
-const plugins = [
-    new HtmlWebpackPlugin({
-        inject: false,
-        template: 'html/index.html',
-        minify: !isDev && getMinifyHtmlOptions(),
-    }),
-];
-
-module.exports = {
-    plugins,
-};
-
-function getMinifyHtmlOptions() {
-    return {
-        removeComments:                 true,
-        removeCommentsFromCDATA:        true,
-        removeCDATASectionsFromCDATA:   true,
-        collapseWhitespace:             true,
-        collapseBooleanAttributes:      true,
-        removeAttributeQuotes:          true,
-        removeRedundantAttributes:      true,
-        useShortDoctype:                true,
-        removeEmptyAttributes:          true,
-        /* оставляем, поскольку у нас
-         * в элемент fm генерируеться
-         * таблица файлов
-         */
-        removeEmptyElements:            false,
-        removeOptionalTags:             true,
-        removeScriptTypeAttributes:     true,
-        removeStyleLinkTypeAttributes:  true,
-        
-        minifyJS:                       true,
-    };
-}
-

.webpack/js.js

@@ -1,93 +0,0 @@
-'use strict';
-
-const {
-    resolve,
-    sep,
-    join,
-} = require('path');
-
-const dir = './client';
-const dirModules = './client/modules';
-const modules = './modules';
-
-const {env} = process;
-const isDev = env.NODE_ENV === 'development';
-
-const rootDir = join(__dirname, '..');
-const dist = resolve(rootDir, 'dist');
-const distDev = resolve(rootDir, 'dist-dev');
-const devtool = isDev ? 'eval' : 'source-map';
-
-const notEmpty = (a) => a;
-const clean = (array) => array.filter(notEmpty);
-
-const rules = clean([
-    !isDev && {
-        test: /\.js$/,
-        exclude: /node_modules/,
-        loader: 'babel-loader',
-    }]);
-
-const splitChunks = {
-    chunks: 'all',
-    name: 'cloudcmd.common',
-};
-
-module.exports = {
-    devtool,
-    optimization: {
-        splitChunks,
-    },
-    entry: {
-        cloudcmd: `${dir}/cloudcmd.js`,
-        [modules + '/edit']: `${dirModules}/edit.js`,
-        [modules + '/edit-file']: `${dirModules}/edit-file.js`,
-        [modules + '/edit-file-vim']: `${dirModules}/edit-file-vim.js`,
-        [modules + '/edit-names']: `${dirModules}/edit-names.js`,
-        [modules + '/menu']: `${dirModules}/menu.js`,
-        [modules + '/view']: `${dirModules}/view.js`,
-        [modules + '/help']: `${dirModules}/help.js`,
-        [modules + '/markdown']: `${dirModules}/markdown.js`,
-        [modules + '/config']: `${dirModules}/config.js`,
-        [modules + '/contact']: `${dirModules}/contact.js`,
-        [modules + '/upload']: `${dirModules}/upload.js`,
-        [modules + '/operation']: `${dirModules}/operation/index.js`,
-        [modules + '/konsole']: `${dirModules}/konsole.js`,
-        [modules + '/terminal']: `${dirModules}/terminal.js`,
-        [modules + '/cloud']: `${dirModules}/cloud.js`,
-        [modules + '/polyfill']: `${dirModules}/polyfill.js`,
-    },
-    output: {
-        filename: '[name].js',
-        path: isDev ? distDev : dist,
-        pathinfo: isDev,
-        devtoolModuleFilenameTemplate,
-        publicPath: '/dist/',
-    },
-    externals: [
-        externals
-    ],
-    module: {
-        rules,
-    },
-};
-
-function externals(context, request, fn) {
-    if (!isDev)
-        return fn();
-    
-    const list = [
-        'es6-promise',
-    ];
-    
-    if (list.includes(request))
-        return fn(null, request);
-    
-    fn();
-}
-
-function devtoolModuleFilenameTemplate(info) {
-    const resource = info.absoluteResourcePath.replace(rootDir + sep, '');
-    return `file://cloudcmd/${resource}`;
-}
-

.yaspellerrc

@@ -10,6 +10,7 @@
         ".md"
     ],
     "dictionary":[
+        "CloudCmd",
         "Dev",
         "Dropbox",
         "Deepword",
@@ -21,17 +22,23 @@
         "Iptables",
         "JitSu",
         "Node",
+        "IO",
         "Olena",
         "TarZak",
         "Termux",
         "Zalitok",
         "WebSocket",
+        "auth",
+        "autostart",
+        "binded",
         "cd",
         "cloudcmd",
         "coderaiser",
         "com",
-        "dev",
         "deepword",
+        "dev",
+        "destructuring",
+        "dropbox",
         "dword",
         "edward",
         "favicon",
@@ -39,12 +46,18 @@
         "gz",
         "io",
         "js",
+        "linux",
         "maintainers",
+        "markdown",
+        "microservice",
         "minification",
         "mouseup",
         "named",
         "nginx",
+        "npm",
         "or io",
+        "patreon",
+        "rc",
         "refactor",
         "sexualized",
         "sslPort",
@@ -53,6 +66,7 @@
         "v0",
         "v1",
         "v2",
-        "yml"
+        "yml",
+        "systemd"
     ]
 }

CODE_OF_CONDUCT.md

@@ -8,19 +8,19 @@ In the interest of fostering an open and welcoming environment, we as contributo
 
 Examples of behavior that contributes to creating a positive environment include:
 
-* Using welcoming and inclusive language
-* Being respectful of differing viewpoints and experiences
-* Gracefully accepting constructive criticism
-* Focusing on what is best for the community
-* Showing empathy towards other community members
+- Using welcoming and inclusive language
+- Being respectful of differing viewpoints and experiences
+- Gracefully accepting constructive criticism
+- Focusing on what is best for the community
+- Showing empathy towards other community members
 
 Examples of unacceptable behavior by participants include:
 
-* The use of sexualized language or imagery and unwelcome sexual attention or advances
-* Trolling, insulting/derogatory comments, and personal or political attacks
-* Public or private harassment
-* Publishing others' private information, such as a physical or electronic address, without explicit permission
-* Other conduct which could reasonably be considered inappropriate in a professional setting
+- The use of sexualized language or imagery and unwelcome sexual attention or advances
+- Trolling, insulting/derogatory comments, and personal or political attacks
+- Public or private harassment
+- Publishing others' private information, such as a physical or electronic address, without explicit permission
+- Other conduct which could reasonably be considered inappropriate in a professional setting
 
 ## Our Responsibilities
 

CONTRIBUTING.md

@@ -1,27 +1,30 @@
-Commit
----------------
+## Commit
+
 Format of the commit message: **type(scope) subject**
 
 **Type**:
-- feature(scope) subject
-- fix(scope) subject
-- docs(scope) subject
-- refactor(scope) subject
-- test(scope) subject
-- chore(scope) subject
+
+- feature: scope: subject
+- fix: scope: subject
+- docs: scope: subject
+- refactor: scope: subject
+- test: scope: subject
+- chore: scope: subject
 
 **Scope**:
 Scope could be anything specifying place of the commit change.
 For example util, console, view, edit, style etc...
 
 **Subject text**:
+
 - use imperative, present tense: “change” not “changed” nor “changes”
 - don't capitalize first letter
 - no dot (.) at the end
-**Message body**:
+  **Message body**:
 - just as in <subject> use imperative, present tense: “change” not “changed” nor “changes”
 - includes motivation for the change and contrasts with previous behavior
 
 **Examples**:
-- [fix(style) .name{width}: 37% -> 35%](https://github.com/coderaiser/cloudcmd/commit/94b0642e3990c17b3a0ee3efeb75f343e1e7c050)
-- [fix(console) dispatch: focus -> mouseup](https://github.com/coderaiser/cloudcmd/commit/f41ec5058d1411e86a881f8e8077e0572e0409ec)
+
+- [fix: style: .name{width}: 37% -> 35%](https://github.com/coderaiser/cloudcmd/commit/94b0642e3990c17b3a0ee3efeb75f343e1e7c050)
+- [fix: console: dispatch: focus -> mouseup](https://github.com/coderaiser/cloudcmd/commit/f41ec5058d1411e86a881f8e8077e0572e0409ec)

Dockerfile

@@ -1,24 +0,0 @@
-FROM node:10.1
-MAINTAINER Coderaiser
-
-RUN mkdir -p /usr/src/app
-WORKDIR /usr/src/app
-
-COPY package.json /usr/src/app/
-
-RUN npm config set package-lock false && \
-    npm install --production && \
-    npm i gritty && \
-    npm cache clean --force
-
-COPY . /usr/src/app
-
-WORKDIR /root
-
-ENV cloudcmd_terminal true
-ENV cloudcmd_terminal_path gritty
-
-EXPOSE 8000
-
-ENTRYPOINT ["/usr/src/app/bin/cloudcmd.js"]
-

Dockerfile.alpine

@@ -1,28 +0,0 @@
-FROM mhart/alpine-node:10.1
-MAINTAINER Coderaiser
-
-RUN mkdir -p /usr/src/app
-WORKDIR /usr/src/app
-
-COPY package.json /usr/src/app/
-
-RUN npm config set package-lock false && \
-    npm install --production && \
-    apk update && \
-    apk add --no-cache bash make g++ python && \
-    npm i gritty && \
-    npm cache clean --force && \
-    apk del make g++ python && \
-    rm -rf /usr/include /tmp/* /var/cache/apk/*
-
-COPY . /usr/src/app
-
-WORKDIR /root
-
-ENV cloudcmd_terminal true
-ENV cloudcmd_terminal_path gritty
-
-EXPOSE 8000
-
-ENTRYPOINT ["/usr/src/app/bin/cloudcmd.js"]
-

LICENSE

@@ -1,6 +1,6 @@
 (The MIT License)
 
-Copyright (c) 2012-2018 Coderaiser <mnemonic.enemy@gmail.com>
+Copyright (c) 2012-2025 Coderaiser <mnemonic.enemy@gmail.com>
 
 Permission is hereby granted, free of charge, to any person obtaining
 a copy of this software and associated documentation files (the

README.md

@@ -1,45 +1,33 @@
-# Cloud Commander v9.6.0 [![License][LicenseIMGURL]][LicenseURL] [![NPM version][NPMIMGURL]][NPMURL] [![Dependency Status][DependencyStatusIMGURL]][DependencyStatusURL] [![Build Status][BuildStatusIMGURL]][BuildStatusURL] [![Now status][BuildAppveyorIMGURL]][BuildAppveyorURL] [![Package Quality][PackageQualityIMGURL]][PackageQualityURL] [![Codacy][CodacyIMG]][CodacyURL] [![Gitter][GitterIMGURL]][GitterURL] [![OpenCollective](https://opencollective.com/cloudcmd/backers/badge.svg)](#backers) [![OpenCollective](https://opencollective.com/cloudcmd/sponsors/badge.svg)](#sponsors)
+# Cloud Commander v19.19.1 [![Build Status][BuildStatusIMGURL]][BuildStatusURL] [![Codacy][CodacyIMG]][CodacyURL] [![Gitter][GitterIMGURL]][GitterURL] [![Deploy on InstaPods][DeployInstaPodsIMG]][DeployInstaPodsURL]
 
-### [Main][MainURL] [Blog][BlogURL] Live([Heroku][HerokuURL], [Now][NowURL])
+### [Main][MainURL] [Blog][BlogURL] [Support][SupportURL] [Demo][DemoURL]
 
-[NPM_INFO_IMG]:             https://nodei.co/npm/cloudcmd.png
-[MainURL]:                  http://cloudcmd.io "Main"
-[BlogURL]:                  http://blog.cloudcmd.io "Blog"
-[HerokuURL]:                http://cloudcmd.herokuapp.com/ "Heroku"
-[NowURL]:                   https://cloudcmd.now.sh/ "Now"
-[NPMURL]:                   https://npmjs.org/package/cloudcmd "npm"
-[NPMIMGURL]:                https://img.shields.io/npm/v/cloudcmd.svg?style=flat
-[LicenseURL]:               https://tldrlegal.com/license/mit-license "MIT License"
-[LicenseIMGURL]:            https://img.shields.io/badge/license-MIT-317BF9.svg?style=flat
-[DependencyStatusURL]:      https://david-dm.org/coderaiser/cloudcmd
-[DependencyStatusIMGURL]:   https://img.shields.io/david/coderaiser/cloudcmd.svg?style=flat
-[BuildStatusURL]:           https://travis-ci.org/coderaiser/cloudcmd  "Build Status"
-[BuildStatusIMGURL]:        https://img.shields.io/travis/coderaiser/cloudcmd.svg?style=flat
+[MainURL]: https://cloudcmd.io "Main"
+[BlogURL]: https://blog.cloudcmd.io "Blog"
+[SupportURL]: https://patreon.com/coderaiser "Patreon"
+[DemoURL]: https://cloudcmd-zdp6.onrender.com
+[NPM_INFO_IMG]: https://nodei.co/npm/cloudcmd.png
+[BuildStatusURL]: https://github.com/coderaiser/cloudcmd/actions/workflows/nodejs.yml "Build Status"
+[BuildStatusIMGURL]: https://github.com/coderaiser/cloudcmd/actions/workflows/nodejs.yml/badge.svg
+[CodacyURL]: https://www.codacy.com/app/coderaiser/cloudcmd
+[CodacyIMG]: https://api.codacy.com/project/badge/Grade/ddda78be780549ce8754f8d47a8c0e36
+[GitterURL]: https://gitter.im/cloudcmd/hello
+[GitterIMGURL]: https://img.shields.io/gitter/room/coderaiser/cloudcmd.js.svg
+[DeployURL]: https://heroku.com/deploy?template=https://github.com/coderaiser/cloudcmd "Deploy"
+[DeployIMG]: https://www.herokucdn.com/deploy/button.png
+[DeployInstaPodsIMG]: https://img.shields.io/badge/deploy%20on-InstaPods-blue
+[DeployInstaPodsURL]: https://app.instapods.com/dashboard/pods/create?app=cloudcmd&ref=cloudcmd
 
-[BuildAppveyorURL]:         https://ci.appveyor.com/project/coderaiser/cloudcmd
-[BuildAppveyorIMGURL]:      https://ci.appveyor.com/api/projects/status/tse6sc8dxrqxqehi?svg=true
+**Cloud Commander** a file manager for the web with console and editor.
 
-[PackageQualityURL]:        http://packagequality.com/#?package=cloudcmd "Package Quality"
-[PackageQualityIMGURL]:     http://packagequality.com/shield/cloudcmd.svg
-
-[CodacyURL]:                https://www.codacy.com/app/coderaiser/cloudcmd
-[CodacyIMG]:                https://api.codacy.com/project/badge/Grade/ddda78be780549ce8754f8d47a8c0e36
-
-[GitterURL]:                https://gitter.im/cloudcmd/hello
-[GitterIMGURL]:             https://img.shields.io/gitter/room/coderaiser/cloudcmd.js.svg
-
-[DeployURL]:                https://heroku.com/deploy?template=https://github.com/coderaiser/cloudcmd "Deploy"
-[DeployIMG]:                https://www.herokucdn.com/deploy/button.png
-
-**Cloud Commander** is an orthodox web file manager with console and editor.
-
-![Cloud Commander](http://cloudcmd.io/img/logo/cloudcmd.png "Cloud Commander")
+![Cloud Commander](https://cloudcmd.io/img/logo/cloudcmd.png "Cloud Commander")
 
 ## Install
 
 ```
 npm i cloudcmd -g
 ```
+
 ## Start
 
 For starting just type in console:
@@ -52,7 +40,13 @@ cloudcmd
 
 Open url `http://localhost:8000` in browser.
 
+### View
+
+You will see something similar to this.
+![View](https://cloudcmd.io/img/screen/view.png "View")
+
 ## Deploy
+
 `Cloud Commander` could be easily deployed to [Heroku][DeployURL].
 
 [![Deploy][DeployIMG]][DeployURL]
@@ -76,33 +70,31 @@ npm i cloudcmd express socket.io -S
 And create `index.js`:
 
 ```js
-const http = require('http');
-const cloudcmd = require('cloudcmd');
-const io = require('socket.io');
-const app = require('express')();
+import http from 'node:http';
+import {cloudcmd} from 'cloudcmd';
+import {Server} from 'socket.io';
+import express from 'express';
+
+const app = express();
 
 const port = 1337;
-const prefix = '/cloudcmd';
+const prefix = '/';
 
 const server = http.createServer(app);
-const socket = io.listen(server, {
-    path: `${prefix}/socket.io`
+const socket = new Server(server, {
+    path: `${prefix}socket.io`,
 });
 
 const config = {
-    prefix // base URL or function which returns base URL (optional)
+    name: 'cloudcmd :)',
 };
 
-const plugins = [
-    __dirname + '/plugin.js'
-];
-
 const filePicker = {
     data: {
         FilePicker: {
             key: 'key',
-        }
-    }
+        },
+    },
 };
 
 // override option from json/modules.json
@@ -110,22 +102,40 @@ const modules = {
     filePicker,
 };
 
-app.use(cloudcmd({
-    socket,  // used by Config, Edit (optional) and Console (required)
-    config,  // config data (optional)
-    plugins, // optional
+const {
+    createConfigManager,
+    configPath,
+} = cloudcmd;
+
+const configManager = createConfigManager({
+    configPath,
+});
+
+app.use(prefix, cloudcmd({
+    socket, // used by Config, Edit (optional) and Console (required)
+    config, // config data (optional)
     modules, // optional
+    configManager, // optional
 }));
 
 server.listen(port);
 ```
 
-Docker
----------------
+## Docker
+
+The docker images are provided for multiple architectures and types. The following list shows all existing images:
+
+| Architecture   | Type         |
+|----------------|--------------|
+| amd64          | linux        |
+| arm64 (arm/v8) | linux        |
+| amd64          | linux-alpine |
+| arm64 (arm/v8) | linux-alpine |
+
 `Cloud Commander` could be used as a [docker container](https://hub.docker.com/r/coderaiser/cloudcmd/ "Docker container") this way:
 
 ```sh
-docker run -t --rm -v ~:/root -v /:/mnt/fs -p 8000:8000 coderaiser/cloudcmd
+docker run -it --rm -v ~:/root -v /:/mnt/fs -w=/root -p 8000:8000 coderaiser/cloudcmd
 ```
 
 Config would be read from home directory, hosts root file system would be mount to `/mnt/fs`,
@@ -151,84 +161,19 @@ When you create this file run:
 docker-compose up
 ```
 
-Get involved
----------------
+## Documentation
+
+More documentation you can find on https://cloudcmd.io/.
+
+## Get involved
 
 There is a lot ways to be involved in `Cloud Commander` development:
 
+- support project on patreon: https://patreon.com/coderaiser;
 - if you find a bug or got idea to share [create an issue](https://github.com/coderaiser/cloudcmd/issues/new "Create issue");
 - if you fixed a bug, typo or implemented new feature [create pull request](https://github.com/coderaiser/cloudcmd/compare "Create pull request");
 - if you know languages you can help with [site translations](https://github.com/coderaiser/cloudcmd/wiki "Cloud Commander community wiki");
 
-## Backers
-Support us with a monthly donation and help us continue our activities. [[Become a backer](https://opencollective.com/cloudcmd#backer)]
-
-[![](https://opencollective.com/cloudcmd/backer/0/avatar.svg)](https://opencollective.com/cloudcmd/backer/0/website)
-[![](https://opencollective.com/cloudcmd/backer/1/avatar.svg)](https://opencollective.com/cloudcmd/backer/1/website)
-[![](https://opencollective.com/cloudcmd/backer/2/avatar.svg)](https://opencollective.com/cloudcmd/backer/2/website)
-[![](https://opencollective.com/cloudcmd/backer/3/avatar.svg)](https://opencollective.com/cloudcmd/backer/3/website)
-[![](https://opencollective.com/cloudcmd/backer/4/avatar.svg)](https://opencollective.com/cloudcmd/backer/4/website)
-[![](https://opencollective.com/cloudcmd/backer/5/avatar.svg)](https://opencollective.com/cloudcmd/backer/5/website)
-[![](https://opencollective.com/cloudcmd/backer/6/avatar.svg)](https://opencollective.com/cloudcmd/backer/6/website)
-[![](https://opencollective.com/cloudcmd/backer/7/avatar.svg)](https://opencollective.com/cloudcmd/backer/7/website)
-[![](https://opencollective.com/cloudcmd/backer/8/avatar.svg)](https://opencollective.com/cloudcmd/backer/8/website)
-[![](https://opencollective.com/cloudcmd/backer/9/avatar.svg)](https://opencollective.com/cloudcmd/backer/9/website)
-[![](https://opencollective.com/cloudcmd/backer/10/avatar.svg)](https://opencollective.com/cloudcmd/backer/10/website)
-[![](https://opencollective.com/cloudcmd/backer/11/avatar.svg)](https://opencollective.com/cloudcmd/backer/11/website)
-[![](https://opencollective.com/cloudcmd/backer/12/avatar.svg)](https://opencollective.com/cloudcmd/backer/12/website)
-[![](https://opencollective.com/cloudcmd/backer/13/avatar.svg)](https://opencollective.com/cloudcmd/backer/13/website)
-[![](https://opencollective.com/cloudcmd/backer/14/avatar.svg)](https://opencollective.com/cloudcmd/backer/14/website)
-[![](https://opencollective.com/cloudcmd/backer/15/avatar.svg)](https://opencollective.com/cloudcmd/backer/15/website)
-[![](https://opencollective.com/cloudcmd/backer/16/avatar.svg)](https://opencollective.com/cloudcmd/backer/16/website)
-[![](https://opencollective.com/cloudcmd/backer/17/avatar.svg)](https://opencollective.com/cloudcmd/backer/17/website)
-[![](https://opencollective.com/cloudcmd/backer/18/avatar.svg)](https://opencollective.com/cloudcmd/backer/18/website)
-[![](https://opencollective.com/cloudcmd/backer/19/avatar.svg)](https://opencollective.com/cloudcmd/backer/19/website)
-[![](https://opencollective.com/cloudcmd/backer/20/avatar.svg)](https://opencollective.com/cloudcmd/backer/20/website)
-[![](https://opencollective.com/cloudcmd/backer/21/avatar.svg)](https://opencollective.com/cloudcmd/backer/21/website)
-[![](https://opencollective.com/cloudcmd/backer/22/avatar.svg)](https://opencollective.com/cloudcmd/backer/22/website)
-[![](https://opencollective.com/cloudcmd/backer/23/avatar.svg)](https://opencollective.com/cloudcmd/backer/23/website)
-[![](https://opencollective.com/cloudcmd/backer/24/avatar.svg)](https://opencollective.com/cloudcmd/backer/24/website)
-[![](https://opencollective.com/cloudcmd/backer/25/avatar.svg)](https://opencollective.com/cloudcmd/backer/25/website)
-[![](https://opencollective.com/cloudcmd/backer/26/avatar.svg)](https://opencollective.com/cloudcmd/backer/26/website)
-[![](https://opencollective.com/cloudcmd/backer/27/avatar.svg)](https://opencollective.com/cloudcmd/backer/27/website)
-[![](https://opencollective.com/cloudcmd/backer/28/avatar.svg)](https://opencollective.com/cloudcmd/backer/28/website)
-[![](https://opencollective.com/cloudcmd/backer/29/avatar.svg)](https://opencollective.com/cloudcmd/backer/29/website)
-
-## Sponsors
-Become a sponsor and get your logo on our README on Github with a link to your site. [[Become a sponsor](https://opencollective.com/cloudcmd#sponsor)]
-
-[![](https://opencollective.com/cloudcmd/sponsor/0/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/0/website)
-[![](https://opencollective.com/cloudcmd/sponsor/1/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/1/website)
-[![](https://opencollective.com/cloudcmd/sponsor/2/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/2/website)
-[![](https://opencollective.com/cloudcmd/sponsor/3/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/3/website)
-[![](https://opencollective.com/cloudcmd/sponsor/4/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/4/website)
-[![](https://opencollective.com/cloudcmd/sponsor/5/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/5/website)
-[![](https://opencollective.com/cloudcmd/sponsor/6/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/6/website)
-[![](https://opencollective.com/cloudcmd/sponsor/7/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/7/website)
-[![](https://opencollective.com/cloudcmd/sponsor/8/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/8/website)
-[![](https://opencollective.com/cloudcmd/sponsor/9/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/9/website)
-[![](https://opencollective.com/cloudcmd/sponsor/10/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/10/website)
-[![](https://opencollective.com/cloudcmd/sponsor/11/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/11/website)
-[![](https://opencollective.com/cloudcmd/sponsor/12/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/12/website)
-[![](https://opencollective.com/cloudcmd/sponsor/13/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/13/website)
-[![](https://opencollective.com/cloudcmd/sponsor/14/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/14/website)
-[![](https://opencollective.com/cloudcmd/sponsor/15/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/15/website)
-[![](https://opencollective.com/cloudcmd/sponsor/16/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/16/website)
-[![](https://opencollective.com/cloudcmd/sponsor/17/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/17/website)
-[![](https://opencollective.com/cloudcmd/sponsor/18/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/18/website)
-[![](https://opencollective.com/cloudcmd/sponsor/19/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/19/website)
-[![](https://opencollective.com/cloudcmd/sponsor/20/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/20/website)
-[![](https://opencollective.com/cloudcmd/sponsor/21/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/21/website)
-[![](https://opencollective.com/cloudcmd/sponsor/22/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/22/website)
-[![](https://opencollective.com/cloudcmd/sponsor/23/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/23/website)
-[![](https://opencollective.com/cloudcmd/sponsor/24/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/24/website)
-[![](https://opencollective.com/cloudcmd/sponsor/25/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/25/website)
-[![](https://opencollective.com/cloudcmd/sponsor/26/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/26/website)
-[![](https://opencollective.com/cloudcmd/sponsor/27/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/27/website)
-[![](https://opencollective.com/cloudcmd/sponsor/28/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/28/website)
-[![](https://opencollective.com/cloudcmd/sponsor/29/avatar.svg)](https://opencollective.com/cloudcmd/sponsor/29/website)
-
 ## License
 
 MIT
-

app.json

@@ -11,6 +11,7 @@
     "folder",
     "orthodox"
   ],
+  "stack": "heroku-18",
   "env": {
       "NPM_CONFIG_PRODUCTION": {
           "description": "Keep false to install devDependencies and build frontend",
@@ -32,6 +33,11 @@
           "value": "false",
           "required": false
       },
+      "CLOUDCMD_CONFIG_AUTH": {
+          "description": "disable auth change in config dialog",
+          "value": "false",
+          "required": false
+      },
       "CLOUDCMD_CONSOLE": {
           "description": "enable console",
           "value": "true",
@@ -52,9 +58,9 @@
           "value": "gritty",
           "required": false
       },
-      "CLOUDCMD_CONFIG_DIALOG": {
-          "description": "show config dialog",
-          "value": "false",
+      "CLOUDCMD_TERMINAL_COMMAND": {
+          "description": "set command to run in terminal (shell by default)",
+          "value": "",
           "required": false
       },
       "CLOUDCMD_ONE_FILE_PANEL": {
@@ -92,16 +98,6 @@
           "value": "",
           "required": false
       },
-      "CLOUDCMD_ONE_PANEL_MODE": {
-          "description": "set one panel mode (deprecated use CLOUDCMD_ONE_FILE_PANEL)",
-          "value": "false",
-          "required": false
-      },
-      "CLOUDCMD_ONE_FILE_PANEL": {
-          "description": "set one panel mode",
-          "value": "false",
-          "required": false
-      },
       "CLOUDCMD_VIM": {
           "description": "enable vim hot keys",
           "value": "false",
@@ -112,6 +108,11 @@
           "value": "name-size-date-owner-mode",
           "required": false
       },
+      "CLOUDCMD_OPEN": {
+          "description": "open web browser when server started",
+          "value": "false",
+          "required": false
+      },
       "CLOUDCMD_CONFIRM_COPY": {
           "description": "confirm copy",
           "value": "true",
@@ -122,9 +123,39 @@
           "value": "true",
           "required": false
       },
-      "CLOUDCMD_CACHE": {
-          "description": "enable cache",
-          "value": "true",
+      "CLOUDCMD_SHOW_FILE_NAME": {
+          "description": "show file name in view and edit",
+          "value": "false",
+          "required": false
+      },
+      "CLOUDCMD_EXPORT": {
+          "description": "enable export of config through a server",
+          "value": "false",
+          "required": false
+      },
+      "CLOUDCMD_EXPORT_TOKEN": {
+          "description": "authorization token used by export server",
+          "value": "root",
+          "required": false
+      },
+      "CLOUDCMD_IMPORT": {
+          "description": "enable import of config",
+          "value": "false",
+          "required": false
+      },
+      "CLOUDCMD_IMPORT_TOKEN": {
+          "description": "authorization  token used to connect to export server",
+          "value": "root",
+          "required": false
+      },
+      "CLOUDCMD_IMPORT_URL": {
+          "description": "url of an import server",
+          "value": "http://localhost:8000",
+          "required": false
+      },
+      "CLOUDCMD_IMPORT_LISTEN": {
+          "description": "enable listen on config updates from import server",
+          "value": "false",
           "required": false
       }
   }

bin/cloudcmd.js

@@ -1,26 +1,48 @@
 #!/usr/bin/env node
 
-'use strict';
+import process from 'node:process';
+import {promisify} from 'node:util';
+import {tryToCatch} from 'try-to-catch';
+import parse from 'yargs-parser';
+import exit from '../server/exit.js';
+import {createConfig, configPath} from '../server/config.js';
+import * as env from '../server/env.js';
+import prefixer from '../server/prefixer.js';
+import * as validate from '../server/validate.js';
+import Info from '../package.json' with {
+    type: 'json',
+};
 
-const util = require('util');
-const noop = () => {};
+process.on('unhandledRejection', exit);
 
-const Info = require('../package');
-const DIR_SERVER = '../server/';
-
-const exit = require(DIR_SERVER + 'exit');
-const config = require(DIR_SERVER + 'config');
-const env = require(DIR_SERVER + 'env');
+const isUndefined = (a) => typeof a === 'undefined';
 
 const choose = (a, b) => {
-    if (!a)
+    if (isUndefined(a))
         return b;
     
     return a;
 };
 
-const argv = process.argv;
-const args = require('minimist')(argv.slice(2), {
+const config = createConfig({
+    configPath,
+});
+
+const maybeRoot = (a) => {
+    if (a === '.')
+        return process.cwd();
+    
+    return a;
+};
+
+const yargsOptions = {
+    configuration: {
+        'strip-aliased': true,
+        'strip-dashed': true,
+    },
+    coerce: {
+        root: maybeRoot,
+    },
     string: [
         'name',
         'port',
@@ -31,77 +53,109 @@ const args = require('minimist')(argv.slice(2), {
         'packer',
         'root',
         'prefix',
+        'prefix-socket',
         'terminal-path',
+        'terminal-command',
         'columns',
+        'menu',
+        'theme',
+        'import-url',
+        'import-token',
+        'export-token',
+        'dropbox-token',
     ],
     boolean: [
         'auth',
-        'cache',
         'repl',
         'save',
         'server',
         'online',
         'open',
-        'progress',
         'config-dialog',
+        'config-auth',
+        'config-port',
         'console',
         'sync-console-path',
         'contact',
         'terminal',
+        'terminal-auto-restart',
         'one-file-panel',
-        'one-panel-mode',
         'confirm-copy',
         'confirm-move',
-        'html-dialogs',
         'show-config',
+        'show-dot-files',
+        'show-file-name',
         'vim',
         'keys-panel',
+        'color',
+        'export',
+        'import',
+        'import-listen',
+        'log',
+        'zip',
+        'dropbox',
     ],
     default: {
-        server      : true,
-        name        : choose(env('name'), config('name')),
-        auth        : choose(env('auth'), config('auth')),
-        cache       : choose(env.bool('cache'), config('cache')),
-        port        : config('port'),
-        online      : config('online'),
-        open        : config('open'),
-        editor      : env('editor') || config('editor'),
-        packer      : config('packer') || 'tar',
-        zip         : config('zip'),
-        username    : env('username') || config('username'),
-        root        : choose(env('root'), config('root')),
-        prefix      : config('prefix'),
-        progress    : config('progress'),
-        console     : choose(env.bool('console'), config('console')),
-        contact     : choose(env.bool('contact'), config('contact')),
-        terminal    : choose(env.bool('terminal'), config('terminal')),
+        'server': true,
+        'name': choose(env.parse('name'), config('name')),
+        'auth': choose(env.bool('auth'), config('auth')),
+        'port': config('port'),
+        'online': config('online'),
+        'open': choose(env.bool('open'), config('open')),
+        'editor': env.parse('editor') || config('editor'),
+        'menu': env.parse('menu') || config('menu'),
+        'packer': config('packer') || 'tar',
+        'zip': config('zip'),
+        'username': env.parse('username') || config('username'),
+        'root': choose(env.parse('root'), config('root')),
+        'prefix': choose(env.parse('prefix'), config('prefix')),
+        'console': choose(env.bool('console'), config('console')),
+        'contact': choose(env.bool('contact'), config('contact')),
+        'terminal': choose(env.bool('terminal'), config('terminal')),
+        'columns': env.parse('columns') || config('columns') || '',
+        'theme': env.parse('theme') || config('theme') || '',
+        'vim': choose(env.bool('vim'), config('vim')),
+        'log': choose(env.bool('log'), config('log')),
         
+        'import-url': env.parse('import_url') || config('importUrl'),
+        'import-listen': choose(env.bool('import_listen'), config('importListen')),
+        'import': choose(env.bool('import'), config('import')),
+        'export': choose(env.bool('export'), config('export')),
+        
+        'prefix-socket': config('prefixSocket'),
+        'show-dot-files': choose(env.bool('show_dot_files'), config('showDotFiles')),
+        'show-file-name': choose(env.bool('show_file_name'), config('showFileName')),
         'sync-console-path': choose(env.bool('sync_console_path'), config('syncConsolePath')),
         'config-dialog': choose(env.bool('config_dialog'), config('configDialog')),
-        'terminal-path': env('terminal_path') || config('terminalPath'),
-        'one-file-panel': choose(env.bool('one_file_panel'), config('onePanelMode')),
-        'one-panel-mode': '',
+        'config-auth': choose(env.bool('config_auth'), config('configAuth')),
+        'config-port': choose(env.bool('config_port'), config('configPort')),
+        'terminal-path': env.parse('terminal_path') || config('terminalPath'),
+        'terminal-command': env.parse('terminal_command') || config('terminalCommand'),
+        'terminal-auto-restart': choose(env.bool('terminal_auto_restart'), config('terminalAutoRestart')),
+        'one-file-panel': choose(env.bool('one_file_panel'), config('oneFilePanel')),
         'confirm-copy': choose(env.bool('confirm_copy'), config('confirmCopy')),
         'confirm-move': choose(env.bool('confirm_move'), config('confirmMove')),
-        'html-dialogs': config('htmlDialogs'),
-        'vim': choose(env.bool('vim'), config('vim')),
-        'columns': env('columns') || config('columns') || '',
         'keys-panel': env.bool('keys_panel') || config('keysPanel'),
+        'import-token': env.parse('import_token') || config('importToken'),
+        'export-token': env.parse('export_token') || config('exportToken'),
+        
+        'dropbox': config('dropbox'),
+        'dropbox-token': config('dropboxToken') || '',
     },
     alias: {
-        v: 'version',
-        h: 'help',
-        p: 'password',
-        o: 'online',
-        u: 'username',
-        s: 'save',
-        a: 'auth',
-        c: 'config'
+        version: 'v',
+        help: 'h',
+        password: 'p',
+        online: 'o',
+        username: 'u',
+        save: 's',
+        auth: 'a',
+        config: 'c',
     },
-    unknown: (cmd) => {
-        exit('\'%s\' is not a cloudcmd option. See \'cloudcmd --help\'.', cmd);
-    }
-});
+};
+
+const {argv} = process;
+const args = parse(argv.slice(2), yargsOptions);
 
 if (args.version)
     version();
@@ -110,91 +164,112 @@ else if (args.help)
 else
     main();
 
-function main() {
-    if (args.repl)
-        repl();
+async function main() {
+    const {validateArgs} = await import('@putout/cli-validate-args');
     
-    checkUpdate();
+    const error = await validateArgs(args, [
+        ...yargsOptions.boolean,
+        ...yargsOptions.string,
+    ]);
+    
+    if (error)
+        return exit(error);
+    
+    if (args.repl)
+        await repl();
+    
+    validate.columns(args.columns);
+    validate.theme(args.theme);
     
     port(args.port);
     
     config('name', args.name);
     config('auth', args.auth);
-    config('cache', args.cache);
     config('online', args.online);
     config('open', args.open);
     config('username', args.username);
-    config('progress', args.progress);
     config('console', args.console);
-    config('syncConsolePath', args['sync-console-path']);
+    config('syncConsolePath', args.syncConsolePath);
+    config('showDotFiles', args.showDotFiles);
+    config('showFileName', args.showFileName);
     config('contact', args.contact);
     config('terminal', args.terminal);
-    config('terminalPath', args['terminal-path']);
+    config('terminalPath', args.terminalPath);
+    config('terminalCommand', args.terminalCommand);
+    config('terminalAutoRestart', args.terminalAutoRestart);
     config('editor', args.editor);
-    config('prefix', args.prefix);
-    config('root', args.root);
+    config('menu', args.menu);
+    config('prefix', prefixer(args.prefix));
+    config('prefixSocket', prefixer(args.prefixSocket));
+    config('root', args.root || '/');
     config('vim', args.vim);
+    config('theme', args.theme);
     config('columns', args.columns);
-    config('htmlDialogs', args['html-dialogs']);
-    config('confirmCopy', args['confirm-copy']);
-    config('confirmMove', args['confirm-move']);
-    config('onePanelMode', args['one-file-panel']);
-    config('oneFilePanel', args['one-file-panel']);
-    config('configDialog', args['config-dialog']);
-    config('keysPanel', args['keys-panel']);
+    config('log', args.log);
+    config('confirmCopy', args.confirmCopy);
+    config('confirmMove', args.confirmMove);
+    config('oneFilePanel', args.oneFilePanel);
+    config('configDialog', args.configDialog);
+    config('configAuth', args.configAuth);
+    config('configPort', args.configPort);
+    config('keysPanel', args.keysPanel);
+    config('export', args.export);
+    config('exportToken', args.exportToken);
+    config('import', args.import);
+    config('importToken', args.importToken);
+    config('importListen', args.importListen);
+    config('importUrl', args.importUrl);
     
-    if (args['one-panel-mode']) {
-        util.deprecate(noop, `cloudcmd --one-panel-mode: deprecated, use --one-file-panel instead`, 'DP0001')();
-        config('oneFilePanel', true);
-        config('onePanelMode', true);
-    } else if (typeof args['one-panel-mode'] === 'boolean') {
-        util.deprecate(noop, `cloudcmd --no-one-panel-mode: deprecated, use --no-one-file-panel instead`, 'DP0001')();
-        config('oneFilePanel', false);
-        config('onePanelMode', false);
-    }
+    config('dropbox', args.dropbox);
+    config('dropboxToken', args.dropboxToken);
     
-    if (env('one_panel_mode')) {
-        util.deprecate(noop, `CLOUDCMD_ONE_PANEL_MODE deprecated, use CLOUDCMD_ONE_FILE_PANEL instead`, 'DP0001')();
-        config('oneFilePanel', env.bool('one_panel_mode'));
-        config('onePanelMode', env.bool('one_panel_mode'));
-    }
-    
-    readConfig(args.config);
+    await readConfig(args.config);
     
     const options = {
-        root: args.root || '/', /* --no-root */
-        editor: args.editor,
-        packer: args.packer,
-        prefix: args.prefix || '', /* --no-prefix */
-        columns: args.columns,
+        root: config('root'),
+        editor: config('editor'),
+        packer: config('packer'),
+        prefix: config('prefix'),
+        prefixSocket: config('prefixSocket'),
+        columns: config('columns'),
+        theme: config('theme'),
+        menu: config('menu'),
     };
     
-    const password = env('password') || args.password;
+    const password = env.parse('password') || args.password;
     
     if (password)
-        config('password', getPassword(password));
+        config('password', await getPassword(password));
     
-    validateRoot(options.root);
+    validateRoot(options.root, config);
     
-    if (args['show-config'])
-        showConfig();
+    if (args.showConfig)
+        await showConfig();
     
-    if (!args.save)
-        return start(options);
+    const {distributeImport} = await import('../server/distribute/import.js');
+    const importConfig = promisify(distributeImport);
     
-    config.save(() => {
-        start(options);
-    });
+    await start(options, config);
+    
+    if (args.save)
+        config.write();
+    
+    await tryToCatch(checkUpdate);
+    await importConfig(config);
 }
 
-function validateRoot(root) {
-    const validate = require(DIR_SERVER + 'validate');
-    validate.root(root, console.log);
+function validateRoot(root, config) {
+    validate.root(root, config);
+    
+    if (root === '/')
+        return;
+    
+    if (config('log'))
+        console.log(`root: ${root}`);
 }
 
-function getPassword(password) {
-    const criton = require('criton');
-    
+async function getPassword(password) {
+    const {default: criton} = await import('criton');
     return criton(password, config('algo'));
 }
 
@@ -202,11 +277,12 @@ function version() {
     console.log('v' + Info.version);
 }
 
-function start(config) {
-    const SERVER = DIR_SERVER + 'server';
+async function start(options, config) {
+    if (!args.server)
+        return;
     
-    if (args.server)
-        require(SERVER)(config);
+    const {default: server} = await import('../server/server.js');
+    server(options, config);
 }
 
 function port(arg) {
@@ -218,40 +294,38 @@ function port(arg) {
     exit('cloudcmd --port: should be a number');
 }
 
-function showConfig() {
-    const show = require('../server/show-config');
-    const data = show(config('*'));
+async function showConfig() {
+    const {showConfig} = await import('../server/show-config.js');
+    const data = showConfig(config('*'));
     
     console.log(data);
 }
 
-function readConfig(name) {
+async function readConfig(name) {
     if (!name)
         return;
     
-    const fs = require('fs');
-    const tryCatch = require('try-catch');
-    const jju = require('jju');
-    const forEachKey = require('for-each-key');
+    const {default: forEachKey} = await import('for-each-key');
     
-    const readjsonSync = (name) => jju.parse(fs.readFileSync(name, 'utf8'), {
-        mode: 'json'
+    const data = await import(name, {
+        with: {
+            type: 'json',
+        },
     });
     
-    const result = tryCatch(readjsonSync, name);
-    const error = result[0];
-    const data = result[1];
-    
-    if (error)
-        return exit(error.message);
-    
     forEachKey(config, data);
 }
 
-function help() {
-    const bin = require('../json/help');
-    const forEachKey = require('for-each-key');
-    const currify = require('currify/legacy');
+async function help() {
+    const {default: bin} = await import('../json/help.json', {
+        with: {
+            type: 'json',
+        },
+    });
+    
+    const {default: forEachKey} = await import('for-each-key');
+    const {default: currify} = await import('currify');
+    
     const usage = 'Usage: cloudcmd [options]';
     const url = Info.homepage;
     const log = currify((a, b, c) => console.log(a, b, c));
@@ -262,36 +336,27 @@ function help() {
     console.log('\nGeneral help using Cloud Commander: <%s>', url);
 }
 
-function repl() {
+async function repl() {
     console.log('REPL mode enabled (telnet localhost 1337)');
-    require(DIR_SERVER + 'repl');
+    await import('../server/repl.js');
 }
 
-function checkUpdate() {
-    const load = require('package-json');
-    const noop = () => {};
+async function checkUpdate() {
+    const {default: load} = await import('package-json');
+    const {version} = await load(Info.name, 'latest');
     
-    load(Info.name, 'latest')
-        .then(showUpdateInfo)
-        .catch(noop);
+    await showUpdateInfo(version);
 }
 
-function showUpdateInfo(data) {
-    const version = data.version;
+async function showUpdateInfo(version) {
+    if (version === Info.version)
+        return;
     
-    if (version !== Info.version) {
-        const chalk = require('chalk');
-        const rendy = require('rendy');
-        
-        const latest = rendy('update available: {{ latest }}', {
-            latest: chalk.green.bold('v' + version),
-        });
-        
-        const current = chalk.dim(rendy('(current: v{{ current }})', {
-            current: Info.version
-        }));
-        
-        console.log('%s %s', latest, current);
-    }
+    const {default: chalk} = await import('chalk');
+    
+    const latestVersion = chalk.green.bold(`v${version}`);
+    const latest = `update available: ${latestVersion}`;
+    const current = chalk.dim(`(current: v${Info.version})`);
+    
+    console.log('%s %s', latest, current);
 }
-

bin/cloudcmd.spec.js

@@ -0,0 +1,26 @@
+import {spawnSync} from 'node:child_process';
+import {test} from 'supertape';
+import info from '../package.json' with {
+    type: 'json',
+};
+
+const cliPath = new URL('cloudcmd.js', import.meta.url).pathname;
+
+test('cloudcmd: bin: cli: -h', (t) => {
+    const {stdout} = spawnSync(cliPath, ['-h'], {
+        encoding: 'utf8',
+    });
+    
+    t.match(stdout, `Options`);
+    t.end();
+});
+
+test('cloudcmd: bin: cli: -v', (t) => {
+    const {version} = info;
+    const {stdout} = spawnSync(cliPath, ['-v'], {
+        encoding: 'utf8',
+    });
+    
+    t.match(stdout, `v${version}`);
+    t.end();
+});

bin/release.js

@@ -1,67 +1,72 @@
 #!/usr/bin/env node
 
-'use strict';
+import {promisify} from 'node:util';
+import process from 'node:process';
+import {tryToCatch} from 'try-to-catch';
+import minor from 'minor';
+import _place from 'place';
+import {rendy} from 'rendy';
+import shortdate from 'shortdate';
+import Info from '../package.json' with {
+    type: 'json',
+};
 
-const DIR = '../';
-const Info = require(DIR + 'package');
+const place = promisify(_place);
 
-const minor = require('minor');
-const place = require('place');
-const rendy = require('rendy');
-const shortdate = require('shortdate');
+await main();
 
-const ERROR = Error('ERROR: version is missing. release --patch|--minor|--major');
-
-main((error) => {
+async function main() {
+    const history = '## Version history\n\n';
+    const link = '//github.com/coderaiser/cloudcmd/releases/tag/';
+    
+    const template = '- ' +
+        '*{{ date }}*, ' +
+        '**[v{{ version }}]' +
+        '(' +
+        link +
+        'v{{ version }})**\n';
+    
+    const {version} = Info;
+    
+    const [error, versionNew] = await tryToCatch(cl);
+    
     if (error)
-        console.error(error.message);
-});
-
-function main(callback) {
-    const history     = 'Version history\n---------------\n';
-    const link        = '//github.com/coderaiser/cloudcmd/releases/tag/';
-    const template    = '- *{{ date }}*, '  +
-                      '**[v{{ version }}]'  +
-                      '(' + link + 'v{{ version }})**\n';
+        return console.error(error);
     
-    const version     = Info.version;
+    await replaceVersion('README.md', version, versionNew);
+    await replaceVersion('HELP.md', version, versionNew);
     
-    cl((error, versionNew) => {
-        if (error)
-            return callback(error);
-        
-        replaceVersion('README.md', version, versionNew, callback);
-        replaceVersion('HELP.md', version, versionNew, function() {
-            const historyNew = history + rendy(template, {
-                date    : shortdate(),
-                version : versionNew
-            });
-            
-            replaceVersion('HELP.md', history, historyNew, callback);
+    const historyNew = history +
+        rendy(template, {
+            date: shortdate(),
+            version: versionNew,
         });
-    });
+    
+    await replaceVersion('HELP.md', history, historyNew);
 }
 
-function replaceVersion(name, version, versionNew, callback) {
-    place(name, version, versionNew, (error) => {
-        if (error)
-            return callback(error);
-        
-        callback(null,  'done: ' + name);
-    });
+async function replaceVersion(name, version, versionNew) {
+    const [error] = await tryToCatch(place, name, version, versionNew);
+    
+    if (error)
+        return console.error(error);
+    
+    console.log(`done: ${name}`);
 }
 
-function cl(callback) {
-    const argv = process.argv;
+async function cl() {
+    const {argv} = process;
     const length = argv.length - 1;
     const last = process.argv[length];
     const regExp = /^--(major|minor|patch)$/;
     const [, match] = last.match(regExp) || [];
     
-    if (!regExp.test(last))
-        return callback(ERROR);
+    console.log(last);
     
-    callback(null, getVersionNew(last, match));
+    if (!regExp.test(last))
+        throw Error('ERROR: version is missing. release --patch|--minor|--major');
+    
+    return getVersionNew(last, match);
 }
 
 function getVersionNew(last, match) {
@@ -70,4 +75,3 @@ function getVersionNew(last, match) {
     
     return last.substr(3);
 }
-

bower.json

@@ -1,36 +0,0 @@
-{
-  "name": "cloudcmd",
-  "homepage": "https://github.com/coderaiser/cloudcmd",
-  "authors": [
-    "coderaiser <mnemonic.enemy@gmail.com>"
-  ],
-  "description": "orthodox web file manager with console and editor",
-  "main": "bin/cloudcmd.js",
-  "keywords": [
-    "console",
-    "editor",
-    "file",
-    "file manager",
-    "folder",
-    "orthodox",
-    "view",
-    "copy",
-    "rename",
-    "move",
-    "delete",
-    "file operation"
-  ],
-  "license": "MIT",
-  "private": true,
-  "ignore": [
-    "node_modules",
-    "modules",
-    "test"
-  ],
-  "dependencies": {
-    "domtokenlist-shim": "~1.1.0",
-    "olark": "^1.0.0",
-    "jquery": "3.3.1",
-    "fancybox": "^2.1.6"
-  }
-}

client/client.js

@@ -1,64 +1,59 @@
-'use strict';
-
-/* global Util, DOM */
-
-const itype = require('itype/legacy');
-const Emitify = require('emitify/legacy');
-const inherits = require('inherits');
-const rendy = require('rendy/legacy');
-const exec = require('execon');
-const Images = require('./dom/images');
-const join = require('join-io/www/join');
-const jonny = require('jonny/legacy');
-const currify = require('currify/legacy');
-
-const bind = (f, ...a) => () => f(...a);
-const noop = () => {};
-
-const {
+import process from 'node:process';
+import Emitify from 'emitify';
+import inherits from 'inherits';
+import {rendy} from 'rendy';
+import load from 'load.js';
+import {tryToCatch} from 'try-to-catch';
+import {addSlashToEnd} from 'format-io';
+import pascalCase from 'just-pascal-case';
+import currify from 'currify';
+import {
     apiURL,
     formatMsg,
     buildFromJSON,
-} = require('../common/cloudfunc');
+} from '#common/cloudfunc';
+import * as Images from '#dom/images';
+import {unregisterSW} from './sw/register.js';
+import {getJsonFromFileTable} from './get-json-from-file-table.js';
+import {Key} from './key/index.js';
+import {loadModule} from './load-module.js';
 
-/* global Util, DOM */
+const noJS = (a) => a.replace(/.js$/, '');
+
+const isDev = process.env.NODE_ENV === 'development';
 
 inherits(CloudCmdProto, Emitify);
 
-module.exports = new CloudCmdProto(Util, DOM);
+export const createCloudCmd = ({DOM, Listeners}) => {
+    return new CloudCmdProto({
+        DOM,
+        Listeners,
+    });
+};
 
-function CloudCmdProto(Util, DOM) {
-    let Key;
-    let Debug;
-    let Listeners;
-    
-    const log = (str) => {
-        if (!Debug)
-            return;
-        
-        console.log(str);
-    };
-    
+load.addErrorListener((e, src) => {
+    const msg = `file ${src} could not be loaded`;
+    Images.show.error(msg);
+});
+
+function CloudCmdProto({DOM, Listeners}) {
     Emitify.call(this);
     
     const CloudCmd = this;
     const Info = DOM.CurrentInfo;
-    const Storage = DOM.Storage;
-    const Files = DOM.Files;
     
-    this.log = log;
-    this.PREFIX = '';
-    this.PREFIX_URL = '';
-    this.DIRCLIENT = '/dist/';
-    this.DIRCLIENT_MODULES = this.DIRCLIENT + 'modules/';
+    const {Storage, Files} = DOM;
     
-    this.MIN_ONE_PANEL_WIDTH    = 1155;
-    this.HOST                   = location.origin ||
-                                  location.protocol + '//' + location.host;
-    
-    const TITLE = 'Cloud Commander';
-    this.TITLE = TITLE;
+    this.log = () => {
+        if (!isDev)
+            return;
+    };
+    this.prefix = '';
+    this.prefixSocket = '';
+    this.prefixURL = '';
     
+    this.MIN_ONE_PANEL_WIDTH = DOM.getCSSVar('min-one-panel-width');
+    this.HOST = location.origin || location.protocol + '//' + location.host;
     this.sort = {
         left: 'name',
         right: 'name',
@@ -69,143 +64,51 @@ function CloudCmdProto(Util, DOM) {
         right: 'asc',
     };
     
-    log.enable = () => {
-        Debug = true;
-    };
-    
-    log.disable = () => {
-        Debug = false;
-    };
-    
-    const kebabToCamelCase = Util.kebabToCamelCase;
-    
-    /**
-     * Функция привязываеться ко всем ссылкам и
-     *  загружает содержимое каталогов
-     *
-     * @param params - {
-     *          paramLink - ссылка
-     *          needRefresh - необходимость обязательной загрузки данных с сервера
-     *          panel
-     *      }
-     * @param callback
-     */
-    this.loadDir = (params, callback) => {
-        const p = params;
-        
-        const refresh = p.isRefresh;
-        const panel = p.panel;
-        const history = p.history;
-        const noCurrent = p.noCurrent;
-        const currentName = p.currentName;
+    this.changeDir = async (path, overrides = {}) => {
+        const {
+            isRefresh,
+            panel,
+            history = true,
+            noCurrent,
+            currentName,
+        } = overrides;
         
+        const refresh = isRefresh;
         let panelChanged;
-        if (!noCurrent)
-            if (panel && panel !== Info.panel) {
-                DOM.changePanel();
-                panelChanged = true;
-            }
+        
+        if (!noCurrent && panel && panel !== Info.panel) {
+            DOM.changePanel();
+            panelChanged = true;
+        }
         
         let imgPosition;
+        
         if (panelChanged || refresh || !history)
             imgPosition = 'top';
         
         Images.show.load(imgPosition, panel);
         
         /* загружаем содержимое каталога */
-        ajaxLoad(p.path, {
+        await ajaxLoad(addSlashToEnd(path), {
             refresh,
             history,
             noCurrent,
             currentName,
-        }, panel, callback);
+            showDotFiles: CloudCmd.config('showDotFiles'),
+        }, panel);
     };
     
-    /**
-     * function load modules
-     * @params = {name, path, func, dobefore, arg}
-     */
-    function loadModule(params) {
-        if (!params)
-            return;
-        
-        let path = params.path;
-        const name = params.name || path && kebabToCamelCase(path);
-        const func = params.func;
-        const funcName = params.funcName;
-        const doBefore = params.dobefore;
-        
-        const isContain = /\.js/.test(path);
-        
-        if (!isContain)
-            path += '.js';
-        
-        if (CloudCmd[name])
-            return;
-        
-        CloudCmd[name] = (...args) => {
-            const prefix = CloudCmd.PREFIX;
-            const pathFull = prefix + CloudCmd.DIRCLIENT_MODULES + path;
-            
-            exec(doBefore);
-            
-            const done = (error) => {
-                const Proto = CloudCmd[name];
-                
-                if (error || !itype.function(Proto))
-                    return;
-                
-                CloudCmd[name] = applyConstructor(Proto, args);
-            };
-            
-            return DOM.load.js(pathFull, func || done);
-        };
-        
-        CloudCmd[name][funcName] = CloudCmd[name];
-    }
-    
-    /*
-     * apply arguemnts to constructor
-     *
-     * @param constructor
-     * @param args
-     */
-    function applyConstructor(constructor, args) {
-        const F = function () {
-            return constructor.apply(this, args);
-        };
-        
-        F.prototype = constructor.prototype;
-        return new F();
-    }
-    
     /**
      * Конструктор CloudClient, который
      * выполняет весь функционал по
      * инициализации
      */
-    this.init = (prefix, config) => {
-        const func = bind(exec.parallel, [
-            initModules,
-            baseInit,
-            loadPlugins,
-            loadStyle,
-            exec.with(CloudCmd.route, location.hash),
-        ], noop);
-        
-        const funcBefore  = (callback) => {
-            const src = prefix + '/join:' + [
-                CloudCmd.DIRCLIENT_MODULES + 'polyfill.js',
-                '/modules/domtokenlist-shim/dist/domtokenlist.min.js',
-            ].join(':');
-            
-            DOM.loadJquery(() => {
-                DOM.load.js(src, callback);
-            });
-        };
-        
-        CloudCmd.PREFIX = prefix;
-        CloudCmd.PREFIX_URL = prefix + apiURL;
+    this.init = async (prefix, config) => {
+        CloudCmd.prefix = prefix;
+        CloudCmd.prefixURL = `${prefix}${apiURL}`;
+        CloudCmd.prefixSocket = config.prefixSocket;
+        CloudCmd.DIR_DIST = `${prefix}/dist`;
+        CloudCmd.DIR_MODULES = `${this.DIR_DIST}/modules`;
         
         CloudCmd.config = (key) => config[key];
         CloudCmd.config.if = currify((key, fn, a) => config[key] && fn(a));
@@ -214,46 +117,22 @@ function CloudCmdProto(Util, DOM) {
              * should be called from config.js only
              * after successful update on server
              */
-             
             if (key === 'password')
                 return;
             
             config[key] = value;
         };
         
-        DOM.Storage.setAllowed(CloudCmd.config('localStorage'));
-        
-        if (config.onePanelMode)
+        if (config.oneFilePanel)
             CloudCmd.MIN_ONE_PANEL_WIDTH = Infinity;
         
-        exec.if(document.body.scrollIntoViewIfNeeded, func, funcBefore);
-    };
-    
-    function loadStyle(callback) {
-        const prefix = CloudCmd.PREFIX;
-        const plugins = prefix + '/dist/cloudcmd.common.css';
+        if (!document.body.scrollIntoViewIfNeeded)
+            await load.js(`${CloudCmd.DIR_MODULES}/polyfill.js`);
         
-        DOM.load.css(plugins, callback);
-    }
-    
-    function loadPlugins(callback) {
-        const prefix = CloudCmd.PREFIX;
-        const plugins = prefix + '/plugins.js';
+        await initModules();
+        await baseInit();
         
-        DOM.load.js(plugins, callback);
-    }
-    
-    this.join = (urls) => {
-        const prefix  = CloudCmd.PREFIX;
-        
-        if (!Array.isArray(urls))
-            throw Error('urls should be array!');
-        
-        const noPrefixUrls = urls.map((url) => {
-            return url.replace(prefix, '');
-        });
-        
-        return prefix + join(noPrefixUrls);
+        CloudCmd.route(location.hash);
     };
     
     this.route = (path) => {
@@ -263,91 +142,87 @@ function CloudCmdProto(Util, DOM) {
             return;
         
         const [kebabModule] = query;
-        const module = kebabToCamelCase(kebabModule.slice(1));
+        const module = noJS(pascalCase(kebabModule.slice(1)));
         
-        const file = query[1];
+        const [, file] = query;
         const current = DOM.getCurrentByName(file);
         
         if (file && !current) {
             const msg = formatMsg('set current file', file, 'error');
             CloudCmd.log(msg);
+            
             return;
         }
         
         DOM.setCurrentFile(current);
-        
         CloudCmd.execFromModule(module, 'show');
     };
     
-    this.logOut = () => {
-        const url = CloudCmd.PREFIX + '/logout';
+    this.logOut = async () => {
+        const url = CloudCmd.prefix + '/logout';
         const error = () => document.location.reload();
+        const {prefix} = CloudCmd;
         
-        DOM.load.ajax({url, error});
+        await DOM.Storage.clear();
+        unregisterSW(prefix);
+        DOM.load.ajax({
+            url,
+            error,
+        });
     };
     
-    function initModules(callback) {
-        exec.if(CloudCmd.Key, () => {
-            Key = new CloudCmd.Key();
-            CloudCmd.Key = Key;
-            Key.bind();
-        }, (func) => {
-            /* привязываем клавиши к функциям */
-            const path = 'key.js';
-            
-            loadModule({
-                path,
-                func
-            });
-        });
+    const initModules = async () => {
+        CloudCmd.Key = Key;
+        CloudCmd.Key.bind();
         
-        Files.get('modules', (error, modules) => {
-            const showLoad = Images.show.load;
-            
-            const doBefore = {
-                'edit': showLoad,
-                'menu': showLoad,
-            };
-            
-            const load = (name, path, dobefore) => {
-                const isTmpl = path === 'template';
-                const funcName = isTmpl ? 'get' : 'show';
-                
-                loadModule({
-                    name,
-                    path,
-                    dobefore,
-                    funcName,
-                });
-            };
-            
-            if (!modules)
-                modules = [];
-            
-            modules.local.forEach((module) => {
-                load(null, module, doBefore[module]);
+        const [, modules] = await tryToCatch(Files.get, 'modules');
+        const showLoad = Images.show.load;
+        
+        const doBefore = {
+            edit: showLoad,
+            menu: showLoad,
+        };
+        
+        const load = (name, path, dobefore) => {
+            loadModule({
+                name,
+                path,
+                dobefore,
             });
-            
-            callback();
-        });
+        };
+        
+        if (!modules)
+            return;
+        
+        for (const module of modules.local) {
+            load(null, module, doBefore[module]);
+        }
+    };
+    
+    async function saveCurrentName(currentName) {
+        await Storage.set('current-name', currentName);
     }
     
-    function baseInit(callback) {
+    async function baseInit() {
         const files = DOM.getFiles();
         
         CloudCmd.on('current-file', DOM.updateCurrentInfo);
+        CloudCmd.on('current-name', saveCurrentName);
+        
+        const name = await Storage.get('current-name');
+        const currentFile = name && DOM.getCurrentByName(name) || files[0];
         
         /* выделяем строку с первым файлом */
         if (files)
-            DOM.setCurrentFile(files[0], {
+            DOM.setCurrentFile(currentFile, {
                 // when hash is present
                 // it should be handled with this.route
                 // overwre otherwise
-                history: !location.hash
+                history: !location.hash,
             });
         
         const dirPath = DOM.getCurrentDirPath();
-        Listeners = CloudCmd.Listeners;
+        
         Listeners.init();
         
         const panels = getPanels();
@@ -356,21 +231,18 @@ function CloudCmdProto(Util, DOM) {
         Listeners.initKeysPanel();
         
         if (!CloudCmd.config('dirStorage'))
-            return callback();
+            return;
         
-        Storage.get(dirPath, (error, data) => {
-            if (!data) {
-                data = getJSONfromFileTable();
-                Storage.set(dirPath, data);
-            }
-            callback();
-        });
+        const data = await Storage.get(dirPath);
+        
+        if (!data)
+            await Storage.setJson(dirPath, getJsonFromFileTable());
     }
     
     function getPanels() {
         const panels = ['left'];
         
-        if (CloudCmd.config('onePanelMode'))
+        if (CloudCmd.config('oneFilePanel'))
             return panels;
         
         return [
@@ -379,40 +251,29 @@ function CloudCmdProto(Util, DOM) {
         ];
     }
     
-    this.execFromModule = (moduleName, funcName, ...args) => {
-        const obj = CloudCmd[moduleName];
-        const isObj = itype.object(obj);
+    this.execFromModule = async (moduleName, funcName, ...args) => {
+        await CloudCmd[moduleName]();
         
-        exec.if(isObj, () => {
-            const obj = CloudCmd[moduleName];
-            const func = obj[funcName];
-            
-            func(...args);
-        }, obj);
+        const func = CloudCmd[moduleName][funcName];
+        func(...args);
     };
     
-    this.refresh = (options = {}, callback) => {
-        if (!callback && typeof options === 'function') {
-            callback = options;
-            options = {};
-        }
-       
-        const panel = options.panel || Info.panel;
+    this.refresh = async (options = {}) => {
+        const {panel = Info.panel, currentName} = options;
+        
         const path = DOM.getCurrentDirPath(panel);
         
         const isRefresh = true;
         const history = false;
-        const noCurrent = options ? options.noCurrent : false;
-        const currentName = options.currentName;
+        const noCurrent = options?.noCurrent;
         
-        CloudCmd.loadDir({
-            path,
+        await CloudCmd.changeDir(path, {
             isRefresh,
             history,
             panel,
             noCurrent,
             currentName,
-        }, callback);
+        });
     };
     
     /**
@@ -422,176 +283,132 @@ function CloudCmdProto(Util, DOM) {
      * @param options
      * { refresh, history } - необходимость обновить данные о каталоге
      * @param panel
-     * @param callback
      *
      */
-    function ajaxLoad(path, options, panel, callback) {
-        const create = (error, json) => {
-            const RESTful = DOM.RESTful;
-            const name = options.currentName || Info.name;
-            const obj = jonny.parse(json);
-            const isRefresh = options.refresh;
-            const noCurrent = options.noCurrent;
-            
-            if (!isRefresh && json)
-                return createFileTable(obj, panel, options, callback);
-            
-            const position = DOM.getPanelPosition(panel);
-            const sort = CloudCmd.sort[position];
-            const order = CloudCmd.order[position];
-            
-            const query = rendy('?sort={{ sort }}&order={{ order }}', {
-                sort,
-                order,
-            });
-            
-            RESTful.read(path + query, 'json', (error, obj) => {
-                if (error)
-                    return;
-                
-                options.sort = sort;
-                options.order = order;
-                
-                createFileTable(obj, panel, options, () => {
-                    if (isRefresh && !noCurrent)
-                        DOM.setCurrentByName(name);
-                    
-                    exec(callback);
-                });
-                
-                if (!CloudCmd.config('dirStorage'))
-                    return;
-                
-                Storage.set(path, obj);
-            });
-        };
+    async function ajaxLoad(path, options = {}, panel) {
+        const {RESTful} = DOM;
         
-        if (!options)
-            options    = {};
+        CloudCmd.log(`reading dir: "${path}";`);
         
-        CloudCmd.log('reading dir: "' + path + '";');
+        const dirStorage = CloudCmd.config('dirStorage');
+        const json = dirStorage && await Storage.getJson(path);
+        
+        const name = options.currentName || Info.name;
+        const {noCurrent, refresh} = options;
+        
+        if (!refresh && json)
+            return await createFileTable(json, panel, options);
+        
+        const position = DOM.getPanelPosition(panel);
+        const sort = CloudCmd.sort[position];
+        const order = CloudCmd.order[position];
+        
+        const query = rendy('?sort={{ sort }}&order={{ order }}', {
+            sort,
+            order,
+        });
+        
+        const [, newObj] = await RESTful.read(path + query, 'json');
+        
+        if (!newObj)
+            // that's OK, error handled by RESTful
+            return;
+        
+        options.sort = sort;
+        options.order = order;
+        
+        await createFileTable(newObj, panel, options);
+        
+        if (refresh && !noCurrent)
+            DOM.setCurrentByName(name);
         
         if (!CloudCmd.config('dirStorage'))
-            return create();
+            return;
         
-        Storage.get(path, create);
+        Storage.setJson(path, newObj);
     }
     
     /**
      * Функция строит файловую таблицу
-     * @param json  - данные о файлах
+     * @param data - данные о файлах
      * @param panelParam
-     * @param history
-     * @param callback
+     * @param options - history, noCurrent, showDotFiles
      */
-    function createFileTable(json, panelParam, options, callback) {
+    async function createFileTable(data, panelParam, options) {
         const {
             history,
             noCurrent,
+            showDotFiles,
         } = options;
         
-        const names = ['file', 'path', 'link', 'pathLink'];
+        const names = [
+            'file',
+            'path',
+            'link',
+            'pathLink',
+        ];
         
-        Files.get(names, (error, templFile, templPath, templLink, templPathLink) => {
-            const Dialog = DOM.Dialog;
-            const panel = panelParam || DOM.getPanel();
+        const [error, [
+            file,
+            path,
+            link,
+            pathLink,
+        ]] = await tryToCatch(Files.get, names);
+        
+        if (error)
+            return DOM.Dialog.alert(error.responseText);
+        
+        const panel = panelParam || DOM.getPanel();
+        const {prefix} = CloudCmd;
+        
+        const {dir, name} = Info;
+        
+        const {childNodes} = panel;
+        let i = childNodes.length;
+        
+        while (i--)
+            panel.removeChild(panel.lastChild);
+        
+        panel.innerHTML = buildFromJSON({
+            sort: options.sort,
+            order: options.order,
+            data,
+            id: panel.id,
+            prefix,
+            showDotFiles,
+            template: {
+                file,
+                path,
+                pathLink,
+                link,
+            },
+        });
+        
+        Listeners.setOnPanel(panel);
+        
+        if (!noCurrent) {
+            let current;
             
-            const {
-                dir,
-                name,
-            } = Info;
+            if (name === '..' && dir !== '/')
+                current = DOM.getCurrentByName(dir);
             
-            if (error)
-                return Dialog.alert(TITLE, error.responseText);
+            if (!current)
+                [current] = DOM.getFiles(panel);
             
-            const childNodes = panel.childNodes;
-            let i = childNodes.length;
-            
-            while (i--)
-                panel.removeChild(panel.lastChild);
-            
-            panel.innerHTML = buildFromJSON({
-                sort        : options.sort,
-                order       : options.order,
-                data        : json,
-                id          : panel.id,
-                prefix      : CloudCmd.PREFIX,
-                template    : {
-                    file        : templFile,
-                    path        : templPath,
-                    pathLink    : templPathLink,
-                    link        : templLink
-                }
+            DOM.setCurrentFile(current, {
+                history,
             });
             
-            Listeners.setOnPanel(panel);
-            
-            if (!noCurrent) {
-                let current;
-                
-                if (name === '..' && dir !== '/')
-                    current = DOM.getCurrentByName(dir);
-                
-                if (!current)
-                    current = DOM.getFiles(panel)[0];
-                
-                DOM.setCurrentFile(current, {
-                    history: history
-                });
-                
-                CloudCmd.emit('active-dir', Info.dirPath);
-            }
-            
-            exec(callback);
-        });
+            CloudCmd.emit('active-dir', Info.dirPath);
+        }
     }
     
-    /**
-     * Функция генерирует JSON из html-таблицы файлов и
-     * используеться при первом заходе в корень
-     */
-    function getJSONfromFileTable() {
-        const path = DOM.getCurrentDirPath();
-        const infoFiles = Info.files || [];
-        
-        const notParent = (current) => {
-            const name = DOM.getCurrentName(current);
-            return name !== '..';
-        };
-        
-        const parse = (current) => {
-            const name = DOM.getCurrentName(current);
-            const size = DOM.getCurrentSize(current);
-            const owner = DOM.getCurrentOwner(current);
-            const mode = DOM.getCurrentMode(current);
-            const date = DOM.getCurrentDate(current);
-            
-            return {
-                name,
-                size,
-                mode,
-                owner,
-                date,
-            };
-        };
-        
-        const files = infoFiles
-            .filter(notParent)
-            .map(parse);
-        
-        const fileTable = {
-            path,
-            files,
-        };
-        
-        return fileTable;
-    }
-    
-    this.goToParentDir = () => {
-        const dir = Info.dir;
+    this.goToParentDir = async () => {
         const {
+            dir,
             dirPath,
             parentDirPath,
+            panel,
         } = Info;
         
         if (dirPath === parentDirPath)
@@ -599,15 +416,13 @@ function CloudCmdProto(Util, DOM) {
         
         const path = parentDirPath;
         
-        CloudCmd.loadDir({path}, () => {
-            const {panel} = Info;
-            const current = DOM.getCurrentByName(dir);
-            const first = DOM.getFiles(panel)[0];
-            
-            DOM.setCurrentFile(current || first, {
-                history
-            });
+        await CloudCmd.changeDir(path);
+        
+        const current = DOM.getCurrentByName(dir);
+        const [first] = DOM.getFiles(panel);
+        
+        DOM.setCurrentFile(current || first, {
+            history,
         });
     };
 }
-

client/cloudcmd.js

@@ -1,46 +1,74 @@
-'use strict';
+import '../css/main.css';
+import process from 'node:process';
+import wraptile from 'wraptile';
+import load from 'load.js';
+import * as Util from '#common/util';
+import * as CloudFunc from '#common/cloudfunc';
+import DOM from '#dom';
+import {registerSW, listenSW} from './sw/register.js';
+import {initSortPanel, sortPanel} from './sort.js';
+import {createCloudCmd} from './client.js';
+import * as Listeners from './listeners/index.js';
 
-require('../css/main.css');
-require('../css/nojs.css');
-require('../css/columns/name-size-date.css');
-require('../css/columns/name-size.css');
+const isDev = process.env.NODE_ENV === 'development';
 
-// prevent additional loading of emitify
-window.Emitify = require('emitify/legacy');
+export default init;
 
-module.exports = window.CloudCmd = (config) => {
-    window.Promise = window.Promise || require('es6-promise');
-    window.Util = require('../common/util');
-    window.CloudFunc = require('../common/cloudfunc');
-    
-    const DOM = require('./dom');
-    
-    window.DOM = DOM;
-    window.CloudCmd = require('./client');
-    
-    const Dialog = require('./dom/dialog');
-    
-    const prefix = getPrefix(config.prefix);
-    const {htmlDialogs} = config;
-    
-    DOM.Dialog = Dialog(prefix, {
-        htmlDialogs
+globalThis.CloudCmd = init;
+
+async function init(config) {
+    globalThis.CloudCmd = createCloudCmd({
+        DOM,
+        Listeners,
     });
+    globalThis.DOM = DOM;
+    globalThis.Util = Util;
+    globalThis.CloudFunc = CloudFunc;
     
-    require('./listeners');
-    require('./key');
-    require('./sort');
+    await register(config);
     
-    window.CloudCmd.init(prefix, config);
-};
+    initSortPanel();
+    globalThis.CloudCmd.sortPanel = sortPanel;
+    const prefix = getPrefix(config.prefix);
+    
+    globalThis.CloudCmd.init(prefix, config);
+    
+    if (globalThis.CloudCmd.config('menu') === 'aleman')
+        setTimeout(() => {
+            import('https://esm.sh/@putout/processor-html');
+            import('https://esm.sh/@putout/bundle@5.5');
+        }, 100);
+}
 
 function getPrefix(prefix) {
     if (!prefix)
         return '';
-   
+    
     if (!prefix.indexOf('/'))
         return prefix;
     
-    return '/' + prefix;
+    return `/${prefix}`;
 }
 
+const onUpdateFound = wraptile(async (config) => {
+    if (isDev)
+        return;
+    
+    const {DOM} = globalThis;
+    const prefix = getPrefix(config.prefix);
+    
+    await load.js(`${prefix}/dist/cloudcmd.common.js`);
+    await load.js(`${prefix}/dist/cloudcmd.js`);
+    
+    console.log('cloudcmd: sw: updated');
+    
+    DOM.Events.removeAll();
+    globalThis.CloudCmd(config);
+});
+
+async function register(config) {
+    const {prefix} = config;
+    const sw = await registerSW(prefix);
+    
+    listenSW(sw, 'updatefound', onUpdateFound(config));
+}

client/dom/buffer.js

@@ -1,133 +1,124 @@
-'use strict';
+/* global CloudCmd*/
+import * as Storage from '#dom/storage';
+import tryToPromiseAll from '../../common/try-to-promise-all.js';
 
-/* global CloudCmd */
+const CLASS = 'cut-file';
+const COPY = 'copy';
+const CUT = 'cut';
 
-const jonny = require('jonny/legacy');
-const exec = require('execon');
-
-const Storage = require('./storage');
-const DOM = require('./');
-
-module.exports = new BufferProto();
-
-function BufferProto() {
-    const Info = DOM.CurrentInfo;
-    const CLASS = 'cut-file';
-    const COPY = 'copy';
-    const CUT = 'cut';
-    const TITLE = 'Buffer';
-    
-    const Buffer  = {
-        cut     : callIfEnabled.bind(null, cut),
-        copy    : callIfEnabled.bind(null, copy),
-        clear   : callIfEnabled.bind(null, clear),
-        paste   : callIfEnabled.bind(null, paste)
-    };
-    
-    function showMessage(msg) {
-        DOM.Dialog.alert(TITLE, msg);
-    }
-    
-    function getNames() {
-        const files = DOM.getActiveFiles();
-        const names = DOM.getFilenames(files);
-        
-        return names;
-    }
-    
-    function addCutClass() {
-        const files = DOM.getActiveFiles();
-        
-        files.forEach((element) => {
-            element.classList.add(CLASS);
-        });
-    }
-    
-    function rmCutClass() {
-        const files = DOM.getByClassAll(CLASS);
-        
-        [...files].forEach((element) => {
-            element.classList.remove(CLASS);
-        });
-    }
-    
-    function callIfEnabled(callback) {
-        const is = CloudCmd.config('buffer');
-        
-        if (is)
-            return callback();
-        
-        showMessage('Buffer disabled in config!');
-    }
-    
-    function copy() {
-        const names = getNames();
-        const from = Info.dirPath;
-        
-        clear();
-        
-        if (!names.length)
-            return;
-        
-        Storage.remove(CUT)
-            .set(COPY, {
-                from,
-                names,
-            });
-    }
-    
-    function cut() {
-        const names = getNames();
-        const from = Info.dirPath;
-        
-        clear();
-        
-        if (!names.length)
-            return;
-        
-        addCutClass();
-        
-        Storage
-            .set(CUT, {
-                from,
-                names,
-            });
-    }
-    
-    function clear() {
-        Storage.remove(COPY)
-            .remove(CUT);
-        
-        rmCutClass();
-    }
-    
-    function paste() {
-        const copy = Storage.get.bind(Storage, COPY);
-        const cut = Storage.get.bind(Storage, CUT);
-        
-        exec.parallel([copy, cut], (error, cp, ct) => {
-            const opStr = cp ? 'copy' : 'move';
-            const opData = cp || ct;
-            const Operation = CloudCmd.Operation;
-            const msg = 'Path is same!';
-            const path = Info.dirPath;
-            
-            if (!error && !cp && !ct)
-                error = 'Buffer is empty!';
-           
-            if (error)
-                return showMessage(error);
-                
-            const data = jonny.parse(opData);
-            data.to = path;
-            
-            if (data.from === path)
-                return showMessage(msg);
-            
-            Operation.show(opStr, data);
-            clear();
-        });
-    }
-    
-    return Buffer;
+function showMessage(msg) {
+    globalThis.DOM.Dialog.alert(msg);
 }
+
+function getNames() {
+    const {DOM} = globalThis;
+    const files = DOM.getActiveFiles();
+    
+    return DOM.getFilenames(files);
+}
+
+function addCutClass() {
+    const {DOM} = globalThis;
+    const files = DOM.getActiveFiles();
+    
+    for (const element of files) {
+        element.classList.add(CLASS);
+    }
+}
+
+function rmCutClass() {
+    const {DOM} = globalThis;
+    const files = DOM.getByClassAll(CLASS);
+    
+    for (const element of files) {
+        element.classList.remove(CLASS);
+    }
+}
+
+const checkEnabled = (fn) => () => {
+    const is = CloudCmd.config('buffer');
+    
+    if (is)
+        return fn();
+    
+    showMessage('Buffer disabled in config!');
+};
+
+async function readBuffer() {
+    const [e, cp, ct] = await tryToPromiseAll([
+        Storage.getJson(COPY),
+        Storage.getJson(CUT),
+    ]);
+    
+    return [
+        e,
+        cp,
+        ct,
+    ];
+}
+
+export const copy = checkEnabled(async () => {
+    const Info = globalThis.DOM.CurrentInfo;
+    const names = getNames();
+    const from = Info.dirPath;
+    
+    await clear();
+    
+    if (!names.length)
+        return;
+    
+    await Storage.remove(CUT);
+    await Storage.setJson(COPY, {
+        from,
+        names,
+    });
+});
+
+export const cut = checkEnabled(async () => {
+    const Info = globalThis.DOM.CurrentInfo;
+    const names = getNames();
+    const from = Info.dirPath;
+    
+    await clear();
+    
+    if (!names.length)
+        return;
+    
+    addCutClass();
+    
+    await Storage.setJson(CUT, {
+        from,
+        names,
+    });
+});
+
+export const clear = checkEnabled(async () => {
+    await Storage.remove(COPY);
+    await Storage.remove(CUT);
+    
+    rmCutClass();
+});
+
+export const paste = checkEnabled(async () => {
+    const Info = globalThis.DOM.CurrentInfo;
+    const [error, cp, ct] = await readBuffer();
+    
+    if (error || !cp && !ct)
+        return showMessage(error || 'Buffer is empty!');
+    
+    const opStr = cp ? 'copy' : 'move';
+    const data = cp || ct;
+    const {Operation} = CloudCmd;
+    const msg = 'Path is same!';
+    const to = Info.dirPath;
+    
+    if (data.from === to)
+        return showMessage(msg);
+    
+    Operation.show(opStr, {
+        ...data,
+        to,
+    });
+    
+    await clear();
+});

client/dom/cmd.js

@@ -0,0 +1,83 @@
+/* global DOM */
+const SELECTED_FILE = 'selected-file';
+const Cmd = {
+    getSelectedFiles,
+    isSelected,
+    unselectFile,
+    selectFile,
+    selectAllFiles,
+    toggleSelectedFile,
+    toggleAllSelectedFiles,
+};
+
+/**
+ * selected file check
+ *
+ * @param currentFile
+ */
+export function isSelected(currentFile) {
+    if (!currentFile)
+        return false;
+    
+    return DOM.isContainClass(currentFile, SELECTED_FILE);
+}
+
+/**
+ * select current file
+ * @param currentFile
+ */
+export function selectFile(currentFile) {
+    const current = currentFile || DOM.getCurrentFile();
+    
+    current.classList.add(SELECTED_FILE);
+    
+    return Cmd;
+}
+
+export function unselectFile(currentFile) {
+    const current = currentFile || DOM.getCurrentFile();
+    
+    current.classList.remove(SELECTED_FILE);
+    
+    return Cmd;
+}
+
+export function toggleSelectedFile(currentFile) {
+    const current = currentFile || DOM.getCurrentFile();
+    const name = DOM.getCurrentName(current);
+    
+    if (name === '..')
+        return Cmd;
+    
+    current.classList.toggle(SELECTED_FILE);
+    
+    return Cmd;
+}
+
+export function toggleAllSelectedFiles() {
+    DOM
+        .getAllFiles()
+        .map(DOM.toggleSelectedFile);
+    
+    return Cmd;
+}
+
+export function selectAllFiles() {
+    DOM
+        .getAllFiles()
+        .map(DOM.selectFile);
+    
+    return Cmd;
+}
+
+/**
+ * unified way to get selected files
+ *
+ * @currentFile
+ */
+export function getSelectedFiles() {
+    const panel = DOM.getPanel();
+    const selected = DOM.getByClassAll(SELECTED_FILE, panel);
+    
+    return Array.from(selected);
+}

client/dom/current-file.js

@@ -1,25 +1,16 @@
-'use strict';
-
 /* global DOM */
 /* global CloudCmd */
-
-const btoa = require('../../common/btoa');
-
-const {
-    encode,
-    decode,
-} = require('../../common/entity');
-
-const {
-    getTitle,
-    FS,
-} = require('../../common/cloudfunc');
+import createElement from '@cloudcmd/create-element';
+import {getTitle, FS} from '#common/cloudfunc';
+import {encode, decode} from '#common/entity';
 
 let Title;
 
 const CURRENT_FILE = 'current-file';
-const NBSP_REG = RegExp(String.fromCharCode(160), 'g');
-const SPACE = ' ';
+const encodeNBSP = (a) => a?.replace('\xa0', ' ');
+const decodeNBSP = (a) => a?.replace(' ', '\xa0');
+
+export const _CURRENT_FILE = CURRENT_FILE;
 
 /**
  * set name from current (or param) file
@@ -27,18 +18,18 @@ const SPACE = ' ';
  * @param name
  * @param current
  */
-module.exports.setCurrentName = (name, current) => {
+export const setCurrentName = (name, current) => {
     const Info = DOM.CurrentInfo;
     const {link} = Info;
-    const {PREFIX} = CloudCmd;
-    const dir = PREFIX + FS + Info.dirPath;
+    const {prefix} = CloudCmd;
+    const dir = prefix + FS + Info.dirPath;
     const encoded = encode(name);
     
     link.title = encoded;
     link.href = dir + encoded;
     link.innerHTML = encoded;
     
-    current.setAttribute('data-name', 'js-file-' + btoa(encodeURI(name)));
+    current.setAttribute('data-name', createNameAttribute(name));
     CloudCmd.emit('current-file', current);
     
     return link;
@@ -49,28 +40,48 @@ module.exports.setCurrentName = (name, current) => {
  *
  * @param currentFile
  */
-module.exports.getCurrentName = (currentFile) => {
+export const getCurrentName = (currentFile) => {
     const current = currentFile || DOM.getCurrentFile();
     
     if (!current)
         return '';
-       
-    const link = DOM.getCurrentLink(current);
     
-    if (!link)
-        return '';
-    
-    return decode(link.title)
-        .replace(NBSP_REG, SPACE);
+    return parseNameAttribute(current.getAttribute('data-name'));
 };
 
 /**
- * get current direcotory path
+ * Generate a `data-name` attribute for the given filename
+ * @param name The string name to encode
  */
-module.exports.getCurrentDirPath = (panel = DOM.getPanel()) => {
+const createNameAttribute = (name) => {
+    const encoded = btoa(encodeURI(name));
+    return `js-file-${encoded}`;
+};
+
+/**
+ * Parse a `data-name` attribute string back into the original filename
+ * @param attribute The string we wish to decode
+ */
+const parseNameAttribute = (attribute) => {
+    attribute = attribute.replace('js-file-', '');
+    return decodeNBSP(decodeURI(atob(attribute)));
+};
+
+export const _parseNameAttribute = parseNameAttribute;
+
+const parseHrefAttribute = (prefix, attribute) => {
+    attribute = attribute.replace(RegExp('^' + prefix + FS), '');
+    return decode(decodeNBSP(attribute));
+};
+
+export const _parseHrefAttribute = parseHrefAttribute;
+
+/**
+ * get current directory path
+ */
+export const getCurrentDirPath = (panel = DOM.getPanel()) => {
     const path = DOM.getByDataName('js-path', panel);
-    return path.textContent
-        .replace(NBSP_REG, SPACE);
+    return path.textContent;
 };
 
 /**
@@ -78,36 +89,31 @@ module.exports.getCurrentDirPath = (panel = DOM.getPanel()) => {
  *
  * @param currentFile - current file by default
  */
-module.exports.getCurrentPath = (currentFile) => {
+export const getCurrentPath = (currentFile) => {
     const current = currentFile || DOM.getCurrentFile();
-    const element = DOM.getByTag('a', current)[0];
-    const prefix = CloudCmd.PREFIX;
+    const [element] = DOM.getByTag('a', current);
+    const {prefix} = CloudCmd;
     
-    const path = element
-        .getAttribute('href')
-        .replace(RegExp('^' + prefix + FS), '')
-        .replace(NBSP_REG, SPACE);
-    
-    return decode(path);
+    return parseHrefAttribute(prefix, element.getAttribute('href'));
 };
 
 /**
- * get current direcotory name
+ * get current directory name
  */
-module.exports.getCurrentDirName = () => {
-    const href = DOM.getCurrentDirPath()
+export const getCurrentDirName = () => {
+    const href = DOM
+        .getCurrentDirPath()
         .replace(/\/$/, '');
     
-    const substr  = href.substr(href, href.lastIndexOf('/'));
-    const ret = href.replace(substr + '/', '') || '/';
+    const substr = href.substr(href, href.lastIndexOf('/'));
     
-    return ret;
+    return href.replace(`${substr}/`, '') || '/';
 };
 
 /**
- * get current direcotory path
+ * get current directory path
  */
-module.exports.getParentDirPath = (panel) => {
+export const getParentDirPath = (panel) => {
     const path = DOM.getCurrentDirPath(panel);
     const dirName = DOM.getCurrentDirName() + '/';
     const index = path.lastIndexOf(dirName);
@@ -119,11 +125,11 @@ module.exports.getParentDirPath = (panel) => {
 };
 
 /**
- * get not current direcotory path
+ * get not current directory path
  */
-module.exports.getNotCurrentDirPath = () => {
+export const getNotCurrentDirPath = () => {
     const panel = DOM.getPanel({
-        active: false
+        active: false,
     });
     
     return DOM.getCurrentDirPath(panel);
@@ -134,20 +140,20 @@ module.exports.getNotCurrentDirPath = () => {
  *
  * @currentFile
  */
-module.exports.getCurrentFile = () => {
+export const getCurrentFile = () => {
     return DOM.getByClass(CURRENT_FILE);
 };
 
 /**
  * get current file by name
  */
-module.exports.getCurrentByName = (name, panel = DOM.CurrentInfo.panel) => {
-    const dataName = 'js-file-' + btoa(encodeURI(name));
+export const getCurrentByName = (name, panel = DOM.CurrentInfo.panel) => {
+    const dataName = 'js-file-' + btoa(encodeURI(encodeNBSP(name)));
     return DOM.getByDataName(dataName, panel);
 };
 
 /**
- * private function thet unset currentfile
+ * private function that unset currentFile
  *
  * @currentFile
  */
@@ -163,9 +169,8 @@ function unsetCurrentFile(currentFile) {
 /**
  * unified way to set current file
  */
-module.exports.setCurrentFile = (currentFile, options) => {
+export const setCurrentFile = (currentFile, options) => {
     const o = options;
-    const CENTER = true;
     const currentFileWas = DOM.getCurrentFile();
     
     if (!currentFile)
@@ -193,13 +198,15 @@ module.exports.setCurrentFile = (currentFile, options) => {
          * but it should be false
          * to prevent default behavior
          */
-        if (!o || o.history !== false) {
+        if (!o || o.history) {
             const historyPath = path === '/' ? path : FS + path;
             DOM.setHistory(historyPath, null, historyPath);
         }
     }
     
     /* scrolling to current file */
+    const CENTER = true;
+    
     DOM.scrollIntoViewIfNeeded(currentFile, CENTER);
     
     CloudCmd.emit('current-file', currentFile);
@@ -209,13 +216,18 @@ module.exports.setCurrentFile = (currentFile, options) => {
     return DOM;
 };
 
+export const setCurrentByName = (name) => {
+    const current = DOM.getCurrentByName(name);
+    return DOM.setCurrentFile(current);
+};
+
 /*
   * set current file by position
   *
   * @param layer    - element
   * @param          - position {x, y}
   */
-module.exports.getCurrentByPosition = ({x, y}) => {
+export const getCurrentByPosition = ({x, y}) => {
     const element = document.elementFromPoint(x, y);
     
     const getEl = (el) => {
@@ -247,7 +259,7 @@ module.exports.getCurrentByPosition = ({x, y}) => {
  *
  * @param currentFile
  */
-module.exports.isCurrentFile = (currentFile) => {
+export const isCurrentFile = (currentFile) => {
     if (!currentFile)
         return false;
     
@@ -259,18 +271,41 @@ module.exports.isCurrentFile = (currentFile) => {
  *
  * @param name
  */
-
-module.exports.setTitle = (name) => {
+export const setTitle = (name) => {
     if (!Title)
-        Title = DOM.getByTag('title')[0] ||
-                DOM.load({
-                    name            : 'title',
-                    innerHTML       : name,
-                    parentElement   : document.head
-                });
+        Title = DOM.getByTag('title')[0] || createElement('title', {
+            innerHTML: name,
+            parent: document.head,
+        });
     
     Title.textContent = name;
     
     return DOM;
 };
 
+/**
+ * check is current file is a directory
+ *
+ * @param currentFile
+ */
+export const isCurrentIsDir = (currentFile) => {
+    const current = currentFile || DOM.getCurrentFile();
+    const path = DOM.getCurrentPath(current);
+    const fileType = DOM.getCurrentType(current);
+    
+    const isZip = path.endsWith('.zip');
+    const isDir = /^directory(-link)?/.test(fileType);
+    
+    return isDir || isZip;
+};
+
+export const getCurrentType = (currentFile) => {
+    const current = currentFile || DOM.getCurrentFile();
+    const el = DOM.getByDataName('js-type', current);
+    
+    const type = el.className
+        .split(' ')
+        .pop();
+    
+    return type;
+};

client/dom/current-file.spec.js

@@ -1,128 +1,114 @@
-'use strict';
+import {test, stub} from 'supertape';
+import {create} from 'auto-globals';
+import wraptile from 'wraptile';
+import * as currentFile from './current-file.js';
 
-const test = require('tape');
-const diff = require('sinon-called-with-diff');
-const sinon = diff(require('sinon'));
 const id = (a) => a;
-const wraptile = require('wraptile');
-const returns = wraptile(id);
 
-const currentFile = require('./current-file');
+const returns = wraptile(id);
+const {_CURRENT_FILE} = currentFile;
 
 test('current-file: setCurrentName: setAttribute', (t) => {
-    const {
-        DOM,
-        CloudCmd,
-    } = global;
+    const {DOM, CloudCmd} = globalThis;
     
-    global.DOM = getDOM();
-    global.CloudCmd = getCloudCmd();
+    globalThis.DOM = getDOM();
+    globalThis.CloudCmd = getCloudCmd();
     
-    const setAttribute = sinon.stub();
-    const current = {
-        setAttribute
-    };
+    const current = create();
+    const {setAttribute} = current;
     
     currentFile.setCurrentName('hello', current);
     
-    t.ok(setAttribute.calledWith('data-name', 'js-file-aGVsbG8='), 'should call setAttribute');
-    
-    global.DOM = DOM;
-    global.CloudCmd = CloudCmd;
+    globalThis.DOM = DOM;
+    globalThis.CloudCmd = CloudCmd;
     
+    t.calledWith(setAttribute, [
+        'data-name',
+        'js-file-aGVsbG8=',
+    ], 'should call setAttribute');
     t.end();
 });
 
 test('current-file: setCurrentName: setAttribute: cyrillic', (t) => {
-    const {
-        DOM,
-        CloudCmd,
-    } = global;
+    const {DOM, CloudCmd} = globalThis;
     
-    global.DOM = getDOM();
-    global.CloudCmd = getCloudCmd();
+    globalThis.DOM = getDOM();
+    globalThis.CloudCmd = getCloudCmd();
     
-    const setAttribute = sinon.stub();
-    const current = {
-        setAttribute
-    };
+    const current = create();
+    const {setAttribute} = current;
     
     currentFile.setCurrentName('ай', current);
     
-    t.ok(setAttribute.calledWith('data-name', 'js-file-JUQwJUIwJUQwJUI5'), 'should call setAttribute');
+    globalThis.DOM = DOM;
+    globalThis.CloudCmd = CloudCmd;
     
-    global.DOM = DOM;
-    global.CloudCmd = CloudCmd;
+    t.calledWith(setAttribute, [
+        'data-name',
+        'js-file-JUQwJUIwJUQwJUI5',
+    ], 'should call setAttribute');
+    t.end();
+});
+
+test('current-file: getCurrentName', (t) => {
+    const current = create();
+    current.getAttribute.returns('js-file-Ymlu');
     
+    const result = currentFile.getCurrentName(current);
+    
+    t.equal(result, 'bin');
     t.end();
 });
 
 test('current-file: emit', (t) => {
-    const {
-        DOM,
-        CloudCmd,
-    } = global;
+    const {DOM, CloudCmd} = globalThis;
     
-    const emit = sinon.stub();
-    const setAttribute = sinon.stub();
+    const emit = stub();
     
-    global.DOM = getDOM();
-    global.CloudCmd = getCloudCmd({
+    globalThis.DOM = getDOM();
+    globalThis.CloudCmd = getCloudCmd({
         emit,
     });
     
-    const current = {
-        setAttribute,
-    };
+    const current = create();
     
     currentFile.setCurrentName('hello', current);
     
-    t.ok(emit.calledWith('current-file', current), 'should call emit');
-    
-    global.DOM = DOM;
-    global.CloudCmd = CloudCmd;
+    globalThis.DOM = DOM;
+    globalThis.CloudCmd = CloudCmd;
     
+    t.calledWith(emit, ['current-file', current], 'should call emit');
     t.end();
 });
 
 test('current-file: setCurrentName: return', (t) => {
-    const {
-        DOM,
-        CloudCmd,
-    } = global;
+    const {DOM, CloudCmd} = globalThis;
     
-    const setAttribute = sinon.stub();
     const link = {};
     
-    global.DOM = getDOM({
-        link
+    globalThis.DOM = getDOM({
+        link,
     });
     
-    global.CloudCmd = getCloudCmd();
-    
-    const current = {
-        setAttribute,
-    };
+    globalThis.CloudCmd = getCloudCmd();
     
+    const current = create();
     const result = currentFile.setCurrentName('hello', current);
     
+    globalThis.DOM = DOM;
+    globalThis.CloudCmd = CloudCmd;
+    
     t.equal(result, link, 'should return link');
-    
-    global.DOM = DOM;
-    global.CloudCmd = CloudCmd;
-    
     t.end();
 });
 
 test('current-file: getParentDirPath: result', (t) => {
-    const {
-        DOM,
-    } = global;
+    const {DOM} = globalThis;
     
     const getCurrentDirPath = returns('/D/Films/+++favorite films/');
     const getCurrentDirName = returns('+++favorite films');
     
-    global.DOM = getDOM({
+    globalThis.DOM = getDOM({
         getCurrentDirPath,
         getCurrentDirName,
     });
@@ -130,33 +116,193 @@ test('current-file: getParentDirPath: result', (t) => {
     const result = currentFile.getParentDirPath();
     const expected = '/D/Films/';
     
-    global.DOM = DOM;
+    globalThis.DOM = DOM;
     
     t.equal(result, expected, 'should return parent dir path');
     t.end();
 });
 
-function getCloudCmd({emit} = {}) {
-    return {
-        PREFIX: '',
-        emit: emit || sinon.stub(),
-    };
-}
+test('current-file: isCurrentFile: no', (t) => {
+    const {DOM, CloudCmd} = globalThis;
+    
+    globalThis.DOM = getDOM();
+    globalThis.CloudCmd = getCloudCmd();
+    
+    const result = currentFile.isCurrentFile();
+    
+    globalThis.DOM = DOM;
+    globalThis.CloudCmd = CloudCmd;
+    
+    t.notOk(result);
+    t.end();
+});
 
-function getDOM({
-    link = {},
-    getCurrentDirPath = sinon.stub(),
-    getCurrentDirName = sinon.stub(),
-    getByDataName = sinon.stub(),
-} = {}) {
+test('current-file: isCurrentFile', (t) => {
+    const {DOM, CloudCmd} = globalThis;
+    
+    const isContainClass = stub();
+    
+    globalThis.DOM = getDOM({
+        isContainClass,
+    });
+    
+    globalThis.CloudCmd = getCloudCmd();
+    
+    const current = {};
+    currentFile.isCurrentFile(current);
+    
+    globalThis.DOM = DOM;
+    globalThis.CloudCmd = CloudCmd;
+    
+    t.calledWith(isContainClass, [current, _CURRENT_FILE], 'should call isContainClass');
+    t.end();
+});
+
+test('current-file: getCurrentType', (t) => {
+    const {DOM, CloudCmd} = globalThis;
+    
+    globalThis.DOM = getDOM();
+    globalThis.CloudCmd = getCloudCmd();
+    
+    const {getByDataName} = globalThis.DOM;
+    
+    getByDataName.returns({
+        className: 'mini-icon directory',
+    });
+    
+    const current = create();
+    
+    currentFile.getCurrentType(current);
+    
+    globalThis.DOM = DOM;
+    globalThis.CloudCmd = CloudCmd;
+    
+    t.calledWith(getByDataName, ['js-type', current]);
+    t.end();
+});
+
+test('current-file: isCurrentIsDir: getCurrentType', (t) => {
+    const {DOM, CloudCmd} = globalThis;
+    
+    globalThis.DOM = getDOM();
+    globalThis.CloudCmd = getCloudCmd();
+    
+    const {getCurrentType} = globalThis.DOM;
+    
+    const current = create();
+    
+    currentFile.isCurrentIsDir(current);
+    
+    globalThis.DOM = DOM;
+    globalThis.CloudCmd = CloudCmd;
+    
+    t.calledWith(getCurrentType, [current]);
+    t.end();
+});
+
+test('current-file: isCurrentIsDir: directory', (t) => {
+    const {DOM, CloudCmd} = globalThis;
+    
+    globalThis.DOM = getDOM({
+        getCurrentType: stub().returns('directory'),
+    });
+    
+    globalThis.CloudCmd = getCloudCmd();
+    
+    const current = create();
+    
+    const result = currentFile.isCurrentIsDir(current);
+    
+    globalThis.DOM = DOM;
+    globalThis.CloudCmd = CloudCmd;
+    
+    t.ok(result);
+    t.end();
+});
+
+test('current-file: isCurrentIsDir: directory-link', (t) => {
+    const {DOM, CloudCmd} = globalThis;
+    
+    globalThis.DOM = getDOM({
+        getCurrentType: stub().returns('directory-link'),
+    });
+    
+    globalThis.CloudCmd = getCloudCmd();
+    
+    const current = create();
+    
+    const result = currentFile.isCurrentIsDir(current);
+    
+    globalThis.DOM = DOM;
+    globalThis.CloudCmd = CloudCmd;
+    
+    t.ok(result);
+    t.end();
+});
+
+test('current-file: isCurrentIsDir: file', (t) => {
+    const {DOM, CloudCmd} = globalThis;
+    
+    globalThis.DOM = getDOM({
+        getCurrentType: stub().returns('file'),
+    });
+    
+    globalThis.CloudCmd = getCloudCmd();
+    
+    const current = create();
+    
+    const result = currentFile.isCurrentIsDir(current);
+    
+    globalThis.DOM = DOM;
+    globalThis.CloudCmd = CloudCmd;
+    
+    t.notOk(result);
+    t.end();
+});
+
+const getCloudCmd = ({emit} = {}) => ({
+    prefix: '',
+    emit: emit || stub(),
+});
+
+test('current-file: parseNameAttribute', (t) => {
+    const result = currentFile._parseNameAttribute('js-file-aGVsbG8mbmJzcDt3b3JsZA==');
+    const expected = 'hello\xa0world';
+    
+    t.equal(result, expected);
+    t.end();
+});
+
+test('current-file: parseHrefAttribute', (t) => {
+    const prefix = '/api/v1';
+    const result = currentFile._parseHrefAttribute(prefix, '/api/v1/fs/hello world');
+    const expected = '/hello\xa0world';
+    
+    t.equal(result, expected);
+    t.end();
+});
+
+function getDOM(overrides = {}) {
+    const {
+        link = {},
+        getCurrentDirPath = stub(),
+        getCurrentDirName = stub(),
+        getByDataName = stub(),
+        isContainClass = stub(),
+        getCurrentType = stub(),
+        getCurrentPath = stub().returns(''),
+    } = overrides;
+    
     return {
         getCurrentDirPath,
         getCurrentDirName,
+        getCurrentPath,
         getByDataName,
+        isContainClass,
+        getCurrentType,
         CurrentInfo: {
             link,
             dirPath: '/',
-        }
+        },
     };
 }
-

client/dom/dialog.js

@@ -1,33 +1,18 @@
-'use strict';
+import {tryToCatch} from 'try-to-catch';
+import * as smalltalk from 'smalltalk';
 
-module.exports = Dialog;
+const title = 'Cloud Commander';
 
-const sm = require('smalltalk');
-const smNative = require('smalltalk/native');
+export const alert = (...a) => smalltalk.alert(title, ...a, {
+    cancel: false,
+});
 
-function Dialog(prefix, config) {
-    if (!(this instanceof Dialog))
-        return new Dialog(prefix, config);
-    
-    const {htmlDialogs} = config;
-    const smalltalk = htmlDialogs ? sm : smNative;
-    
-    const alert = (title, message) => {
-        return smalltalk.alert(title, message);
-    };
-    
-    this.alert = alert;
-    
-    this.prompt = (title, message, value, options) => {
-        return smalltalk.prompt(title, message, value, options);
-    };
-    
-    this.confirm = (title, message, options) => {
-        return smalltalk.confirm(title, message, options);
-    };
-    
-    this.alert.noFiles = (title) => {
-        return alert(title, 'No files selected!');
-    };
-}
+export const prompt = (...a) => tryToCatch(smalltalk.prompt, title, ...a);
+export const confirm = (...a) => tryToCatch(smalltalk.confirm, title, ...a);
+export const progress = (...a) => smalltalk.progress(title, ...a);
 
+alert.noFiles = () => {
+    return smalltalk.alert(title, 'No files selected!', {
+        cancel: false,
+    });
+};

client/dom/directory.js

@@ -1,33 +1,29 @@
-/* global CloudCmd */
+/* global DOM, CloudCmd */
+import philip from 'philip';
+import * as Dialog from '#dom/dialog';
+import {FS} from '#common/cloudfunc';
+import * as Images from '#dom/images';
 
-'use strict';
-
-const philip = require('philip');
-
-const Images = require('./images');
-const {FS} = require('../../common/cloudfunc');
-const DOM = require('.');
-
-const {
-    getCurrentDirPath: getPathWhenRootEmpty,
-} = DOM;
-
-module.exports = (items) => {
-    const Dialog = DOM.Dialog;
-    
+export const uploadDirectory = (items) => {
     if (items.length)
         Images.show('top');
     
-    const entries = [...items].map((item) => {
-        return item.webkitGetAsEntry();
+    const entries = Array
+        .from(items)
+        .map((item) => item.webkitGetAsEntry());
+    
+    const dirPath = DOM.getCurrentDirPath();
+    const path = dirPath.replace(/\/$/, '');
+    
+    const progress = Dialog.progress('Uploading...');
+    
+    progress.catch(() => {
+        Dialog.alert('Upload aborted');
+        uploader.abort();
     });
     
-    const dirPath = getPathWhenRootEmpty();
-    const path = dirPath
-        .replace(/\/$/, '');
-    
     const uploader = philip(entries, (type, name, data, i, n, callback) => {
-        const prefixURL = CloudCmd.PREFIX_URL;
+        const {prefixURL} = CloudCmd;
         const full = prefixURL + FS + path + name;
         
         let upload;
@@ -49,7 +45,7 @@ module.exports = (items) => {
             const max = next - current;
             const value = current + percent(count, 100, max);
             
-            setProgress(value);
+            progress.setProgress(value);
         });
     });
     
@@ -58,25 +54,11 @@ module.exports = (items) => {
         uploader.abort();
     });
     
-    uploader.on('progress', setProgress);
     uploader.on('end', CloudCmd.refresh);
 };
 
-function percent(i, n, per = 100) {
-    return Math.round(i * per / n);
-}
+const percent = (i, n, per = 100) => Math.round(i * per / n);
 
-function setProgress(count) {
-    DOM.Images
-        .setProgress(count)
-        .show('top');
-}
-
-function uploadFile(url, data) {
-    return DOM.load.put(url, data);
-}
-
-function uploadDir(url) {
-    return DOM.load.put(url + '?dir');
-}
+const uploadFile = (url, data) => DOM.load.put(url, data);
 
+const uploadDir = (url) => DOM.load.put(`${url}?dir`);

client/dom/dom-tree.js

@@ -1,6 +1,15 @@
-'use strict';
+import currify from 'currify';
 
-const DOM = module.exports;
+const DOM = {
+    show,
+    hide,
+    getByClass,
+    getByClassAll,
+    getByDataName,
+    getById,
+    getByTag,
+    isContainClass,
+};
 
 /**
  * check class of element
@@ -8,71 +17,76 @@ const DOM = module.exports;
  * @param element
  * @param className
  */
-module.exports.isContainClass = (element, className) => {
+export function isContainClass(element, className) {
     if (!element)
         throw Error('element could not be empty!');
     
     if (!className)
         throw Error('className could not be empty!');
     
-    const classList = element.classList;
-    const ret = classList.contains(className);
+    if (Array.isArray(className))
+        return className.some(currify(
+            isContainClass,
+            element,
+        ));
     
-    return ret;
-};
+    const {classList} = element;
+    
+    return classList.contains(className);
+}
 
 /**
  * Function search element by tag
  * @param tag - className
  * @param element - element
  */
-module.exports.getByTag = (tag, element = document) => {
+export function getByTag(tag, element = document) {
     return element.getElementsByTagName(tag);
-};
+}
 
 /**
  * Function search element by id
- * @param Id - id
+ * @param id
+ * @param element
  */
-module.exports.getById = (id, element = document) => {
-    return element.querySelector('#' + id);
-};
+export function getById(id, element = document) {
+    return element.querySelector(`#${id}`);
+}
 
 /**
  * Function search first element by class name
  * @param className - className
  * @param element - element
  */
-module.exports.getByClass = (className, element = document) => {
+export function getByClass(className, element = document) {
     return DOM.getByClassAll(className, element)[0];
-};
+}
 
-module.exports.getByDataName = (attribute, element = document) => {
-    const selector    = '[' + 'data-name="' + attribute + '"]';
+export function getByDataName(attribute, element = document) {
+    const selector = '[' + 'data-name="' + attribute + '"]';
     return element.querySelector(selector);
-};
+}
 
 /**
  * Function search element by class name
- * @param pClass - className
- * @param element - element
+ * @param className
+ * @param element
  */
-module.exports.getByClassAll = (className, element) => {
+export function getByClassAll(className, element) {
     return (element || document).getElementsByClassName(className);
-};
+}
 
 /**
  * add class=hidden to element
  *
  * @param element
  */
-module.exports.hide = (element) => {
+export function hide(element) {
     element.classList.add('hidden');
     return DOM;
-};
+}
 
-module.exports.show = (element) => {
+export function show(element) {
     element.classList.remove('hidden');
     return DOM;
-};
-
+}

client/dom/dom-tree.spec.js

@@ -0,0 +1,152 @@
+import {test, stub} from 'supertape';
+import {create} from 'auto-globals';
+import {tryCatch} from 'try-catch';
+import {
+    isContainClass,
+    getByTag,
+    getById,
+    getByClass,
+    getByDataName,
+    getByClassAll,
+    hide,
+    show,
+} from './dom-tree.js';
+
+test('dom: isContainClass: no element', (t) => {
+    const [e] = tryCatch(isContainClass);
+    
+    t.equal(e.message, 'element could not be empty!', 'should throw when no element');
+    t.end();
+});
+
+test('dom: isContainClass: no className', (t) => {
+    const [e] = tryCatch(isContainClass, {});
+    
+    t.equal(e.message, 'className could not be empty!', 'should throw when no element');
+    t.end();
+});
+
+test('dom: isContainClass: contains', (t) => {
+    const el = create();
+    const {contains} = el.classList;
+    
+    const className = 'hello';
+    isContainClass(el, className);
+    
+    t.calledWith(contains, [className], 'should call contains');
+    t.end();
+});
+
+test('dom: isContainClass: contains: array', (t) => {
+    const el = create();
+    const {contains} = el.classList;
+    
+    const className = 'hello';
+    isContainClass(el, ['world', className, 'hello']);
+    
+    t.calledWith(contains, [className], 'should call contains');
+    t.end();
+});
+
+test('dom: getByTag', (t) => {
+    const getElementsByTagName = stub();
+    const element = {
+        getElementsByTagName,
+    };
+    
+    getByTag('div', element);
+    
+    t.calledWith(getElementsByTagName, ['div'], 'should call getElementsByTagName');
+    t.end();
+});
+
+test('dom: getById', (t) => {
+    const querySelector = stub();
+    const element = {
+        querySelector,
+    };
+    
+    getById('my-id', element);
+    
+    t.calledWith(querySelector, ['#my-id'], 'should call querySelector with id selector');
+    t.end();
+});
+
+test('dom: getByClassAll', (t) => {
+    const getElementsByClassName = stub();
+    const element = {
+        getElementsByClassName,
+    };
+    
+    getByClassAll('my-class', element);
+    
+    t.calledWith(getElementsByClassName, ['my-class'], 'should call getElementsByClassName');
+    t.end();
+});
+
+test('dom: getByClass: calls getByClassAll', (t) => {
+    const element = {
+        getElementsByClassName: stub().returns(['first']),
+    };
+    
+    const result = getByClass('my-class', element);
+    
+    t.equal(result, 'first', 'should return first element from class list');
+    t.end();
+});
+
+test('dom: getByDataName', (t) => {
+    const querySelector = stub();
+    const element = {
+        querySelector,
+    };
+    
+    getByDataName('hello', element);
+    
+    t.calledWith(querySelector, ['[data-name="hello"]'], 'should call querySelector with data-name selector');
+    t.end();
+});
+
+test('dom: hide', (t) => {
+    const add = stub();
+    const element = {
+        classList: {
+            add,
+        },
+    };
+    
+    hide(element);
+    
+    t.calledWith(add, ['hidden'], 'should add hidden class');
+    t.end();
+});
+
+test('dom: show', (t) => {
+    const remove = stub();
+    const element = {
+        classList: {
+            remove,
+        },
+    };
+    
+    show(element);
+    
+    t.calledWith(remove, ['hidden'], 'should remove hidden class');
+    t.end();
+});
+
+test('dom: getByClassAll: without element uses document', (t) => {
+    const getElementsByClassName = stub();
+    const prevDocument = globalThis.document;
+    
+    globalThis.document = {
+        getElementsByClassName,
+    };
+    
+    getByClassAll('my-class');
+    
+    globalThis.document = prevDocument;
+    
+    t.calledWith(getElementsByClassName, ['my-class'], 'should fallback to document when no element');
+    t.end();
+});

client/dom/events.js

@@ -1,222 +0,0 @@
-'use strict';
-
-const itype = require('itype/legacy');
-
-module.exports = new EventsProto();
-
-function EventsProto() {
-    const Events = this;
-    
-    function parseArgs(eventName, element, listener, callback) {
-        let isFunc;
-        const args = [
-            eventName,
-            element,
-            listener,
-            callback,
-        ];
-        
-        const EVENT_NAME = 1;
-        const ELEMENT = 0;
-        const type = itype(eventName);
-        
-        switch(type) {
-        default:
-            if (!/element$/.test(type))
-                throw Error('unknown eventName: ' + type);
-            
-            parseArgs(
-                args[EVENT_NAME],
-                args[ELEMENT],
-                listener,
-                callback
-            );
-            break;
-        
-        case 'string':
-            isFunc = itype.function(element);
-            
-            if (isFunc) {
-                listener   = element;
-                element    = null;
-            }
-            
-            if (!element)
-                element = window;
-            
-            callback(element, [
-                eventName,
-                listener,
-                false
-            ]);
-            break;
-        
-        case 'array':
-            eventName.forEach((eventName) => {
-                parseArgs(
-                    eventName,
-                    element,
-                    listener,
-                    callback
-                );
-            });
-            break;
-        
-        case 'object':
-            Object.keys(eventName).forEach((name) => {
-                const eventListener = eventName[name];
-                
-                parseArgs(
-                    name,
-                    element,
-                    eventListener,
-                    callback
-                );
-            });
-           
-            break;
-        }
-    }
-    
-    /**
-     * safe add event listener
-     *
-     * @param type
-     * @param element {document by default}
-     * @param listener
-     */
-    this.add = (type, element, listener) => {
-        checkType(type);
-        
-        parseArgs(type, element, listener, (element, args) => {
-            element.addEventListener.apply(element, args);
-        });
-        
-        return Events;
-    };
-    
-    /**
-     * safe add event listener
-     *
-     * @param type
-     * @param listener
-     * @param element {document by default}
-     */
-    this.addOnce = (type, element, listener) => {
-        const once = (event) => {
-            Events.remove(type, element, once);
-            listener(event);
-        };
-        
-        if (!listener) {
-            listener    = element;
-            element     = null;
-        }
-        
-        this.add(type, element, once);
-        
-        return Events;
-    };
-    
-    /**
-     * safe remove event listener
-     *
-     * @param type
-     * @param listener
-     * @param element {document by default}
-     */
-    this.remove = (type, element, listener) => {
-        checkType(type);
-        
-        parseArgs(type, element, listener, (element, args) => {
-            element.removeEventListener.apply(element, args);
-        });
-        
-        return Events;
-    };
-    
-    /**
-     * safe add event keydown listener
-     *
-     * @param listener
-     */
-    this.addKey = function(...argsArr) {
-        const name = 'keydown';
-        const args = [name, ...argsArr];
-        
-        return Events.add(...args);
-    };
-    
-    /**
-     * safe remove event click listener
-     *
-     * @param listener
-     */
-    this.rmKey = function(...argsArr) {
-        const name = 'keydown';
-        const args = [name, ...argsArr];
-        
-        return Events.remove(...args);
-    };
-    
-    /**
-     * safe add event click listener
-     *
-     * @param listener
-     */
-    this.addClick = function(...argsArr) {
-        const name = 'click';
-        const args = [name, ...argsArr];
-        
-        return Events.add(...args);
-    };
-    
-    /**
-     * safe remove event click listener
-     *
-     * @param listener
-     */
-    this.rmClick = function(...argsArr) {
-        const name = 'click';
-        const args = [name, ...argsArr];
-        
-        return Events.remove(...args);
-    };
-    
-    this.addContextMenu = function(...argsArr) {
-        const name = 'contextmenu';
-        const args = [name, ...argsArr];
-        
-        return Events.add(...args);
-    };
-    
-    /**
-     * safe add event click listener
-     *
-     * @param listener
-     */
-    this.addError = function(...argsArr) {
-        const name = 'error';
-        const args = [name, ...argsArr];
-        
-        return Events.add(...args);
-    };
-    
-    /**
-     * safe add load click listener
-     *
-     * @param listener
-     */
-    this.addLoad = function(...argsArr) {
-        const name = 'load';
-        const args = [name, ...argsArr];
-        
-        return Events.add(...args);
-    };
-    
-    function checkType(type) {
-        if (!type)
-            throw Error('type could not be empty!');
-    }
-}
-

client/dom/events/event-store.js

@@ -0,0 +1,15 @@
+let list = [];
+
+export const add = (el, name, fn) => {
+    list.push([
+        el,
+        name,
+        fn,
+    ]);
+};
+
+export const clear = () => {
+    list = [];
+};
+
+export const get = () => list;

client/dom/events/event-store.spec.js

@@ -0,0 +1,37 @@
+import {test} from 'supertape';
+import * as eventStore from './event-store.js';
+
+test('event-store: get', (t) => {
+    const el = {};
+    const name = 'click';
+    const fn = () => {};
+    
+    eventStore.add(el, name, fn);
+    const result = eventStore.get();
+    
+    const expected = [
+        [
+            el,
+            name,
+            fn,
+        ],
+    ];
+    
+    t.deepEqual(result, expected);
+    t.end();
+});
+
+test('event-store: clear', (t) => {
+    const el = {};
+    const name = 'click';
+    const fn = () => {};
+    
+    eventStore.add(el, name, fn);
+    eventStore.clear();
+    
+    const result = eventStore.get();
+    const expected = [];
+    
+    t.deepEqual(result, expected);
+    t.end();
+});

client/dom/events/index.js

@@ -0,0 +1,203 @@
+import itype from 'itype';
+import * as EventStore from './event-store.js';
+
+/**
+ * safe add event listener
+ *
+ * @param type
+ * @param element - document by default
+ * @param listener
+ */
+export const add = (type, element, listener) => {
+    checkType(type);
+    
+    parseArgs(type, element, listener, (element, args) => {
+        const [name, fn, options] = args;
+        
+        element.addEventListener(name, fn, options);
+        EventStore.add(element, name, fn);
+    });
+    
+    return Events;
+};
+
+/**
+ * safe add event listener
+ *
+ * @param type
+ * @param listener
+ * @param element - document by default
+ */
+export const addOnce = (type, element, listener) => {
+    const once = (event) => {
+        Events.remove(type, element, once);
+        listener(event);
+    };
+    
+    if (!listener) {
+        listener = element;
+        element = null;
+    }
+    
+    add(type, element, once);
+    
+    return Events;
+};
+
+/**
+ * safe remove event listener
+ *
+ * @param type
+ * @param listener
+ * @param element - document by default
+ */
+export const remove = (type, element, listener) => {
+    checkType(type);
+    
+    parseArgs(type, element, listener, (element, args) => {
+        element.removeEventListener(...args);
+    });
+    
+    return Events;
+};
+
+/**
+ * remove all added event listeners
+ */
+export const removeAll = () => {
+    const events = EventStore.get();
+    
+    for (const [el, name, fn] of events)
+        el.removeEventListener(name, fn);
+    
+    EventStore.clear();
+};
+
+/**
+ * safe add event keydown listener
+ *
+ * @param args
+ */
+export const addKey = function(...args) {
+    return add('keydown', ...args);
+};
+
+/**
+ * safe remove event click listener
+ *
+ * @param args
+ */
+export const rmKey = function(...args) {
+    return Events.remove('keydown', ...args);
+};
+
+/**
+ * safe add event click listener
+ */
+export const addClick = function(...args) {
+    return Events.add('click', ...args);
+};
+
+/**
+ * safe remove event click listener
+ */
+export const rmClick = function(...args) {
+    return remove('click', ...args);
+};
+
+export const addContextMenu = function(...args) {
+    return add('contextmenu', ...args);
+};
+
+/**
+ * safe add load listener
+ */
+export const addLoad = function(...args) {
+    return add('load', ...args);
+};
+
+function checkType(type) {
+    if (!type)
+        throw Error('type could not be empty!');
+}
+
+const getEventOptions = (eventName) => {
+    if (eventName !== 'touchstart')
+        return false;
+    
+    return {
+        passive: true,
+    };
+};
+
+function parseArgs(eventName, element, listener, callback) {
+    let isFunc;
+    const args = [
+        eventName,
+        element,
+        listener,
+        callback,
+    ];
+    
+    const EVENT_NAME = 1;
+    const ELEMENT = 0;
+    const type = itype(eventName);
+    
+    switch(type) {
+    default:
+        if (!type.endsWith('element'))
+            throw Error(`unknown eventName: ${type}`);
+        
+        parseArgs(args[EVENT_NAME], args[ELEMENT], listener, callback);
+        break;
+    
+    case 'string':
+        isFunc = itype.function(element);
+        
+        if (isFunc) {
+            listener = element;
+            element = null;
+        }
+        
+        if (!element)
+            element = window;
+        
+        callback(element, [
+            eventName,
+            listener,
+            getEventOptions(eventName),
+        ]);
+        break;
+    
+    case 'array':
+        
+        for (const name of eventName) {
+            parseArgs(name, element, listener, callback);
+        }
+        
+        break;
+    
+    case 'object':
+        
+        for (const name of Object.keys(eventName)) {
+            const eventListener = eventName[name];
+            
+            parseArgs(name, element, eventListener, callback);
+        }
+        
+        break;
+    }
+}
+
+const Events = {
+    add,
+    addClick,
+    addContextMenu,
+    addKey,
+    addLoad,
+    addOnce,
+    remove,
+    removeAll,
+    rmClick,
+    rmKey,
+};

client/dom/files.js

@@ -1,105 +1,82 @@
 /* global CloudCmd */
-
-'use strict';
-
-const itype = require('itype/legacy');
-const currify = require('currify/legacy');
-const exec = require('execon');
-
-const Storage = require('./storage');
-const load = require('./load');
-const RESTful = require('./rest');
+import itype from 'itype';
+import {promisify} from 'es6-promisify';
+import * as load from '#dom/load';
+import * as RESTful from '#dom/rest';
 
 const Promises = {};
 const FILES_JSON = 'config|modules';
 const FILES_HTML = 'file|path|link|pathLink|media';
 const FILES_HTML_ROOT = 'view/media-tmpl|config-tmpl|upload';
 const DIR_HTML = '/tmpl/';
-const DIR_HTML_FS = DIR_HTML + 'fs/';
+const DIR_HTML_FS = `${DIR_HTML}fs/`;
 const DIR_JSON = '/json/';
 const timeout = getTimeoutOnce(2000);
 
-const get = currify(getFile);
-const unaryMap = (array, fn) => array.map((a) => fn(a));
+export const get = getFile;
 
-module.exports.get = get;
-
-function getFile(name, callback) {
+function getFile(name) {
     const type = itype(name);
-    let array;
+    check(name);
     
-    check(name, callback);
+    if (type === 'string')
+        return getModule(name);
     
-    switch(type) {
-    case 'string':
-        getModule(name, callback);
-        break;
-    
-    case 'array':
-        array = unaryMap(name, get);
-        
-        exec.parallel(array, callback);
-        break;
-    }
+    if (type === 'array')
+        return Promise.all(name.map(getFile));
 }
 
-function check(name, callback) {
+function check(name) {
     if (!name)
         throw Error('name could not be empty!');
-    
-    if (typeof callback !== 'function')
-        throw Error('callback should be a function');
 }
 
-function getModule(name, callback) {
-    let path;
-    
-    const regExpHTML = new RegExp(FILES_HTML + '|' + FILES_HTML_ROOT);
-    const regExpJSON = new RegExp(FILES_JSON);
+function getModule(name) {
+    const regExpHTML = RegExp(FILES_HTML + '|' + FILES_HTML_ROOT);
+    const regExpJSON = RegExp(FILES_JSON);
     
     const isHTML = regExpHTML.test(name);
     const isJSON = regExpJSON.test(name);
     
-    if (!isHTML && !isJSON) {
-        showError(name);
-    } else if (name === 'config') {
-        getConfig(callback);
-    } else {
-        path = getPath(name, isHTML, isJSON);
-        
-        getSystemFile(path, callback);
-    }
+    if (!isHTML && !isJSON)
+        return showError(name);
     
+    if (name === 'config')
+        return getConfig();
+    
+    const path = getPath(name, isHTML, isJSON);
+    
+    return getSystemFile(path);
 }
 
 function getPath(name, isHTML, isJSON) {
     let path;
-    const regExp = new RegExp(FILES_HTML_ROOT);
+    const regExp = RegExp(FILES_HTML_ROOT);
     const isRoot = regExp.test(name);
     
     if (isHTML) {
         if (isRoot)
             path = DIR_HTML + name.replace('-tmpl', '');
         else
-            path = DIR_HTML_FS  + name;
+            path = DIR_HTML_FS + name;
         
         path += '.hbs';
     } else if (isJSON) {
-        path = DIR_JSON  + name + '.json';
+        path = DIR_JSON + name + '.json';
     }
     
     return path;
 }
 
 function showError(name) {
-    const str = 'Wrong file name: ' + name;
-    const error = new Error(str);
+    const str = `Wrong file name: ${name}`;
+    const error = Error(str);
     
-    throw(error);
+    throw error;
 }
 
-function getSystemFile(file, callback) {
-    const prefix = CloudCmd.PREFIX;
+const getSystemFile = promisify((file, callback) => {
+    const {prefix} = CloudCmd;
     
     if (!Promises[file])
         Promises[file] = new Promise((success, error) => {
@@ -108,7 +85,7 @@ function getSystemFile(file, callback) {
             load.ajax({
                 url,
                 success,
-                error
+                error,
             });
         });
     
@@ -118,37 +95,29 @@ function getSystemFile(file, callback) {
         Promises[file] = null;
         callback(error);
     });
-}
+});
 
-function getConfig(callback) {
+const getConfig = async () => {
     let is;
     
     if (!Promises.config)
-        Promises.config = new Promise((resolve, reject) => {
+        Promises.config = () => {
             is = true;
-            RESTful.Config.read((error, data) => {
-                if (error)
-                    return reject(error);
-                
-                resolve(data);
-            });
-        });
+            return RESTful.Config.read();
+        };
     
-    Promises.config.then((data) => {
+    const [, data] = await Promises.config();
+    
+    if (data)
         is = false;
-        Storage.setAllowed(data.localStorage);
-        
-        callback(null, data);
-        
-        timeout(() => {
-            if (!is)
-                Promises.config = null;
-        });
-    }, () => {
+    
+    timeout(() => {
         if (!is)
             Promises.config = null;
     });
-}
+    
+    return data;
+};
 
 function getTimeoutOnce(time) {
     let is;
@@ -165,4 +134,3 @@ function getTimeoutOnce(time) {
         }, time);
     };
 }
-

client/dom/images.js

@@ -1,21 +1,13 @@
-/* global CloudCmd */
 /* global DOM */
-
-'use strict';
-
-const Images = module.exports;
+import createElement from '@cloudcmd/create-element';
 
 const LOADING = 'loading';
 const HIDDEN = 'hidden';
 const ERROR = 'error';
 
-const LoadingImage = LOADING + getLoadingType();
+const getLoadingType = () => isSVG() ? '-svg' : '-gif';
 
-function getLoadingType() {
-    return isSVG() ? '-svg' : '-gif';
-}
-
-module.exports.get = getElement;
+export const get = getElement;
 
 /**
  * check SVG SMIL animation support
@@ -34,54 +26,60 @@ function isSVG() {
     return /SVGAnimate/.test(name);
 }
 
-
 function getElement() {
-    return DOM.load({
-        name        : 'span',
-        id          : 'js-status-image',
-        className   : 'icon',
-        attribute   : 'data-progress',
-        notAppend   : true
+    return createElement('span', {
+        id: 'js-status-image',
+        className: 'icon',
+        dataName: 'progress',
+        notAppend: true,
     });
 }
 
 /* Функция создаёт картинку загрузки */
-module.exports.loading = () => {
+export const loading = () => {
     const element = getElement();
-    const classList = element.classList;
+    const {classList} = element;
+    const loadingImage = LOADING + getLoadingType();
     
-    classList.add(LOADING, LoadingImage);
+    classList.add(LOADING, loadingImage);
     classList.remove(ERROR, HIDDEN);
     
     return element;
 };
 
 /* Функция создаёт картинку ошибки загрузки */
-module.exports.error = () => {
+export const error = () => {
     const element = getElement();
-    const classList = element.classList;
+    const {classList} = element;
+    const loadingImage = LOADING + getLoadingType();
     
     classList.add(ERROR);
-    classList.remove(HIDDEN, LOADING, LoadingImage);
+    classList.remove(HIDDEN, LOADING, loadingImage);
     
     return element;
 };
 
-module.exports.show = show;
-module.exports.show.load  = show;
-module.exports.show.error = error;
+show.load = show;
+show.error = (text) => {
+    const image = Images.error();
+    
+    DOM.show(image);
+    image.title = text;
+    
+    return image;
+};
 
 /**
 * Function shows loading spinner
 * position = {top: true};
 */
-function show(position, panel) {
+export function show(position, panel) {
     const image = Images.loading();
     const parent = image.parentElement;
     const refreshButton = DOM.getRefreshButton(panel);
     
     let current;
-
+    
     if (position === 'top') {
         current = refreshButton.parentElement;
     } else {
@@ -93,7 +91,7 @@ function show(position, panel) {
             current = refreshButton.parentElement;
     }
     
-    if (!parent || (parent && parent !== current))
+    if (!parent || parent && parent !== current)
         current.appendChild(image);
     
     DOM.show(image);
@@ -101,36 +99,25 @@ function show(position, panel) {
     return image;
 }
 
-function error(text) {
-    const image = Images.error();
-    
-    DOM.show(image);
-    image.title = text;
-    
-    CloudCmd.log(text);
-    
-    return image;
-}
-
 /**
 * hide load image
 */
-module.exports.hide = () => {
+export function hide() {
     const element = Images.get();
     
     DOM.hide(element);
     
     return Images;
-};
+}
 
-module.exports.setProgress = (value, title) => {
+export const setProgress = (value, title) => {
     const DATA = 'data-progress';
     const element = Images.get();
-     
+    
     if (!element)
         return Images;
     
-    element.setAttribute(DATA, value + '%');
+    element.setAttribute(DATA, `${value}%`);
     
     if (title)
         element.title = title;
@@ -138,7 +125,7 @@ module.exports.setProgress = (value, title) => {
     return Images;
 };
 
-module.exports.clearProgress  = () => {
+export const clearProgress = () => {
     const DATA = 'data-progress';
     const element = Images.get();
     
@@ -151,3 +138,12 @@ module.exports.clearProgress  = () => {
     return Images;
 };
 
+const Images = {
+    clearProgress,
+    setProgress,
+    show,
+    hide,
+    get,
+    error,
+    loading,
+};

client/dom/index.spec.js

@@ -0,0 +1,52 @@
+import {test, stub} from 'supertape';
+import {getCSSVar, goToDirectory} from '#dom';
+
+globalThis.CloudCmd = {};
+
+test('cloudcmd: client: dom: goToDirectory', async (t) => {
+    const path = '';
+    const changeDir = stub();
+    const prompt = stub().returns([null, path]);
+    
+    await goToDirectory({
+        prompt,
+        changeDir,
+    });
+    
+    t.calledWith(changeDir, [path]);
+    t.end();
+});
+
+test('cloudcmd: client: dom: getCSSVar', (t) => {
+    const body = {};
+    const getPropertyValue = stub().returns(0);
+    
+    globalThis.getComputedStyle = stub().returns({
+        getPropertyValue,
+    });
+    const result = getCSSVar('hello', {
+        body,
+    });
+    
+    delete globalThis.getComputedStyle;
+    
+    t.notOk(result);
+    t.end();
+});
+
+test('cloudcmd: client: dom: getCSSVar: 1', (t) => {
+    const body = {};
+    const getPropertyValue = stub().returns(1);
+    
+    globalThis.getComputedStyle = stub().returns({
+        getPropertyValue,
+    });
+    const result = getCSSVar('hello', {
+        body,
+    });
+    
+    delete globalThis.getComputedStyle;
+    
+    t.ok(result);
+    t.end();
+});

client/dom/io/index.js

@@ -0,0 +1,166 @@
+import {FS} from '#common/cloudfunc';
+import {sendRequest as _sendRequest} from './send-request.js';
+
+const {assign} = Object;
+
+const imgPosition = {
+    top: true,
+};
+
+export const remove = async (url, data, overrides = {}) => {
+    const {
+        sendRequest = _sendRequest,
+    } = overrides;
+    
+    const request = {
+        method: 'DELETE',
+        url: FS + url,
+        imgPosition: {
+            top: Boolean(data),
+        },
+    };
+    
+    if (data)
+        assign(request, {
+            data,
+            url: `${request.url}?files`,
+        });
+    
+    return await sendRequest(request);
+};
+
+export const patch = async (url, data) => {
+    return await _sendRequest({
+        method: 'PATCH',
+        url: FS + url,
+        data,
+        imgPosition,
+    });
+};
+
+export const write = async (url, data) => {
+    return await _sendRequest({
+        method: 'PUT',
+        url: FS + url,
+        data,
+        imgPosition,
+    });
+};
+
+export const createDirectory = async (url, overrides = {}) => {
+    const {
+        sendRequest = _sendRequest,
+    } = overrides;
+    
+    return await sendRequest({
+        method: 'PUT',
+        url: `${FS}${url}?dir`,
+        imgPosition,
+    });
+};
+
+export const read = async (url, dataType = 'text') => {
+    const notLog = !url.includes('?');
+    
+    return await _sendRequest({
+        method: 'GET',
+        url: FS + url,
+        notLog,
+        dataType,
+    });
+};
+
+export const copy = async (from, to, names) => {
+    return await _sendRequest({
+        method: 'PUT',
+        url: '/copy',
+        data: {
+            from,
+            to,
+            names,
+        },
+        imgPosition,
+    });
+};
+
+export const pack = async (data) => {
+    return await _sendRequest({
+        method: 'PUT',
+        url: '/pack',
+        data,
+    });
+};
+
+export const extract = async (data) => {
+    return await _sendRequest({
+        method: 'PUT',
+        url: '/extract',
+        data,
+    });
+};
+
+export const move = async (from, to, names) => {
+    return await _sendRequest({
+        method: 'PUT',
+        url: '/move',
+        data: {
+            from,
+            to,
+            names,
+        },
+        imgPosition,
+    });
+};
+
+export const rename = async (from, to) => {
+    return await _sendRequest({
+        method: 'PUT',
+        url: '/rename',
+        data: {
+            from,
+            to,
+        },
+        imgPosition,
+    });
+};
+
+export const Config = {
+    read: async () => {
+        return await _sendRequest({
+            method: 'GET',
+            url: '/config',
+            imgPosition,
+            notLog: true,
+        });
+    },
+    
+    write: async (data) => {
+        return await _sendRequest({
+            method: 'PATCH',
+            url: '/config',
+            data,
+            imgPosition,
+        });
+    },
+};
+
+export const Markdown = {
+    read: async (url) => {
+        return await _sendRequest({
+            method: 'GET',
+            url: `/markdown${url}`,
+            imgPosition,
+            notLog: true,
+        });
+    },
+    
+    render: async (data) => {
+        return await _sendRequest({
+            method: 'PUT',
+            url: '/markdown',
+            data,
+            imgPosition,
+            notLog: true,
+        });
+    },
+};

client/dom/io/index.spec.js

@@ -0,0 +1,61 @@
+import {test, stub} from 'supertape';
+import * as io from './index.js';
+
+test('client: dom: io', (t) => {
+    const sendRequest = stub();
+    
+    io.createDirectory('/hello', {
+        sendRequest,
+    });
+    
+    const expected = {
+        imgPosition: {
+            top: true,
+        },
+        method: 'PUT',
+        url: '/fs/hello?dir',
+    };
+    
+    t.calledWith(sendRequest, [expected]);
+    t.end();
+});
+
+test('client: dom: io: remove: no files', async (t) => {
+    const sendRequest = stub();
+    
+    await io.remove('/hello', null, {
+        sendRequest,
+    });
+    
+    const expected = {
+        imgPosition: {
+            top: false,
+        },
+        method: 'DELETE',
+        url: '/fs/hello',
+    };
+    
+    t.calledWith(sendRequest, [expected]);
+    t.end();
+});
+
+test('client: dom: io: remove: files', async (t) => {
+    const sendRequest = stub();
+    const files = ['world'];
+    
+    await io.remove('/hello', files, {
+        sendRequest,
+    });
+    
+    const expected = {
+        imgPosition: {
+            top: true,
+        },
+        data: ['world'],
+        method: 'DELETE',
+        url: '/fs/hello?files',
+    };
+    
+    t.calledWith(sendRequest, [expected]);
+    t.end();
+});

client/dom/io/send-request.js

@@ -0,0 +1,48 @@
+/* global CloudCmd */
+import {promisify} from 'es6-promisify';
+import * as Images from '#dom/images';
+import * as load from '#dom/load';
+
+export const sendRequest = promisify((params, callback) => {
+    const p = params;
+    const {prefixURL} = CloudCmd;
+    
+    p.url = prefixURL + p.url;
+    p.url = encodeURI(p.url);
+    
+    p.url = replaceHash(p.url);
+    
+    load.ajax({
+        method: p.method,
+        url: p.url,
+        data: p.data,
+        dataType: p.dataType,
+        error: (jqXHR) => {
+            const response = jqXHR.responseText;
+            
+            const {statusText, status} = jqXHR;
+            
+            const text = status === 404 ? response : statusText;
+            
+            callback(Error(text));
+        },
+        success: (data) => {
+            Images.hide();
+            
+            if (!p.notLog)
+                CloudCmd.log(data);
+            
+            callback(null, data);
+        },
+    });
+});
+
+export const _replaceHash = replaceHash;
+
+function replaceHash(url) {
+    /*
+     * if we send ajax request -
+     * no need in hash so we escape #
+     */
+    return url.replace(/#/g, '%23');
+}

client/dom/io/send-request.spec.js

@@ -0,0 +1,11 @@
+import {test} from 'supertape';
+import {_replaceHash} from './send-request.js';
+
+test('cloudcmd: client: io: replaceHash', (t) => {
+    const url = '/hello/####world';
+    const result = _replaceHash(url);
+    const expected = '/hello/%23%23%23%23world';
+    
+    t.equal(result, expected);
+    t.end();
+});

client/dom/load-remote.js

@@ -1,69 +1,58 @@
-'use strict';
-
 /* global CloudCmd */
+import {callbackify} from 'node:util';
+import {rendy} from 'rendy';
+import itype from 'itype';
+import * as load from 'load.js';
+import {tryToCatch} from 'try-to-catch';
+import {findObjByNameInArr} from '#common/util';
+import * as Files from '#dom/files';
 
-const exec = require('execon');
-const rendy = require('rendy/legacy');
-const itype = require('itype/legacy');
-const {findObjByNameInArr} = require('../../common/util');
-
-const load = require('./load');
-const Files = require('./files');
-
-module.exports = (name, options, callback = options) => {
-    const {PREFIX, config} = CloudCmd;
+export const loadRemote = callbackify(async (name, options) => {
+    const {prefix, config} = CloudCmd;
     const o = options;
     
     if (o.name && window[o.name])
-        return callback();
+        return;
     
-    Files.get('modules', (error, modules) => {
-        const online = config('online') && navigator.onLine;
-        const module = findObjByNameInArr(modules.remote, name);
+    const modules = await Files.get('modules');
+    
+    const online = config('online') && navigator.onLine;
+    const module = findObjByNameInArr(modules.remote, name);
+    
+    const isArray = itype.array(module.local);
+    const {version} = module;
+    
+    let remoteTmpls;
+    let local;
+    
+    if (isArray) {
+        remoteTmpls = module.remote;
+        ({local} = module);
+    } else {
+        remoteTmpls = [module.remote];
+        local = [module.local];
+    }
+    
+    const localURL = [];
+    
+    for (const url of local) {
+        localURL.push(prefix + url);
+    }
+    
+    const remoteURL = [];
+    
+    for (const tmpl of remoteTmpls) {
+        remoteURL.push(rendy(tmpl, {
+            version,
+        }));
+    }
+    
+    if (online) {
+        const [e] = await tryToCatch(load.parallel, remoteURL);
         
-        const isArray = itype.array(module.local);
-        const version = module.version;
-        
-        let remoteTmpls, local;
-        if (isArray) {
-            remoteTmpls = module.remote;
-            local       = module.local;
-        } else {
-            remoteTmpls  = [module.remote];
-            local        = [module.local];
-        }
-        
-        const localURL = local.map((url) => {
-            return PREFIX + url;
-        });
-        
-        const remoteURL = remoteTmpls.map((tmpl) => {
-            return rendy(tmpl, {
-                version: version
-            });
-        });
-        
-        const on = funcON(localURL, remoteURL, callback);
-        const off = funcOFF(localURL, callback);
-        
-        exec.if(online, on, off);
-    });
-};
-
-function funcOFF(local, callback) {
-    return () => {
-        load.parallel(local, callback);
-    };
-}
-
-function funcON (local, remote,callback) {
-    return () => {
-        load.parallel(remote, (error) => {
-            if (error)
-                return funcOFF();
-            
-            callback();
-        });
-    };
-}
-
+        if (!e)
+            return;
+    }
+    
+    await load.parallel(localURL);
+});

client/dom/load.js

@@ -1,130 +1,8 @@
-'use strict';
-
-const itype = require('itype/legacy');
-const jonny = require('jonny/legacy');
-const Emitify = require('emitify/legacy');
-const exec = require('execon');
-const Images = require('./images');
-const Events = require('./events');
-
-const {getExt} = require('../../common/util');
-
-module.exports = load;
-module.exports.getIdBySrc = getIdBySrc;
-module.exports.ext = ext;
-
-/**
- * Функция создаёт элемент и загружает файл с src.
- *
- * @param params = {
- * name, - название тэга
- * src', - путь к файлу
- * func, - обьект, содержаий одну из функций
- *          или сразу две onload и onerror
- *          {onload: function() {}, onerror: function();}
- * style,
- * id,
- * element,
- * async, - true by default
- * inner: 'id{color:red, },
- * class,
- * notAppend - false by default
- *
- */
-function load(params) {
-    const {
-        src,
-        id = getIdBySrc(params.src),
-        func,
-        name,
-        async,
-        inner,
-        style,
-        parent = document.body,
-        className,
-        attribute,
-        notAppend,
-    } = params;
-    
-    let element = document.getElementById(id);
-    
-    if (element) {
-        exec(func);
-        return element;
-    }
-    
-    element = document.createElement(name);
-    
-    const funcError = () => {
-        const msg = `file ${src} could not be loaded`;
-        const error = new Error(msg);
-        
-        parent.removeChild(element);
-        
-        Images.show.error(msg);
-        
-        const callback = func && func.onerror || func.onload || func;
-        
-        exec(callback, error);
-    };
-    
-    const funcLoad = () => {
-        const callback = func && func.onload || func;
-        
-        Events.remove('error', element, funcError);
-        
-        exec(callback);
-    };
-    
-    if (/^(script|link)$/.test(name))
-        Events.addOnce('load', element, funcLoad)
-            .addError(element, funcError);
-    
-    if (id)
-        element.id = id;
-    
-    if (className)
-        element.className = className;
-    
-    if (src) {
-        if (name !== 'link') {
-            element.src = src;
-        } else {
-            element.href = src;
-            element.rel = 'stylesheet';
-        }
-    }
-    
-    if (attribute) {
-        const type = itype(attribute);
-        
-        switch(type) {
-        case 'string':
-            element.setAttribute(attribute, '');
-            break;
-        
-        case 'object':
-            Object.keys(attribute).forEach((name) => {
-                element.setAttribute(name, attribute[name]);
-            });
-            break;
-        }
-    }
-    
-    if (style)
-        element.style.cssText = style;
-    
-    if (async && name === 'script' || async === undefined)
-        element.async = true;
-    
-    if (!notAppend)
-        parent.appendChild(element);
-    
-    if (inner)
-        element.innerHTML = inner;
-    
-    return element;
-}
+import itype from 'itype';
+import jonny from 'jonny';
+import Emitify from 'emitify';
+import exec from 'execon';
+import * as Images from '#dom/images';
 
 /**
  * Function gets id by src
@@ -132,17 +10,18 @@ function load(params) {
  *
  * Example: http://domain.com/1.js -> 1_js
  */
-function getIdBySrc(src) {
+export function getIdBySrc(src) {
     const isStr = itype.string(src);
     
     if (!isStr)
         return;
     
-    if (~src.indexOf(':'))
+    if (src.includes(':'))
         src += '-join';
     
     const num = src.lastIndexOf('/') + 1;
     const sub = src.substr(src, num);
+    
     const id = src
         .replace(sub, '')
         .replace(/\./g, '-');
@@ -155,34 +34,37 @@ function getIdBySrc(src) {
  *
  * @param params
  */
-module.exports.ajax = (params) => {
+export const ajax = (params) => {
     const p = params;
     const isObject = itype.object(p.data);
     const isArray = itype.array(p.data);
     const isArrayBuf = itype(p.data) === 'arraybuffer';
     const type = p.type || p.method || 'GET';
-    const headers = p.headers || {};
+    
+    const {headers = {}} = p;
+    
     const xhr = new XMLHttpRequest();
     
     xhr.open(type, p.url, true);
     
-    Object.keys(headers).forEach((name) => {
+    for (const name of Object.keys(headers)) {
         const value = headers[name];
         xhr.setRequestHeader(name, value);
-    });
+    }
     
     if (p.responseType)
         xhr.responseType = p.responseType;
     
     let data;
+    
     if (!isArrayBuf && isObject || isArray)
         data = jonny.stringify(p.data);
     else
-        data = p.data;
+        ({data} = p);
     
     xhr.onreadystatechange = (event) => {
         const xhr = event.target;
-        const OK  = 200;
+        const OK = 200;
         
         if (xhr.readyState !== xhr.DONE)
             return;
@@ -190,30 +72,30 @@ module.exports.ajax = (params) => {
         Images.clearProgress();
         
         const TYPE_JSON = 'application/json';
-        const type        = xhr.getResponseHeader('content-type');
+        const type = xhr.getResponseHeader('content-type');
         
         if (xhr.status !== OK)
             return exec(p.error, xhr);
         
         const notText = p.dataType !== 'text';
-        const isContain = ~type.indexOf(TYPE_JSON);
+        const isContain = type.includes(TYPE_JSON);
         
         let data = xhr.response;
+        
         if (type && isContain && notText)
             data = jonny.parse(xhr.response) || xhr.response;
-            
+        
         exec(p.success, data, xhr.statusText, xhr);
     };
     
     xhr.send(data);
 };
 
-module.exports.put = (url, body) => {
+export const put = (url, body) => {
     const emitter = Emitify();
     const xhr = new XMLHttpRequest();
     
-    url = encodeURI(url)
-        .replace('#', '%23');
+    url = encodeURI(url).replace(/#/g, '#');
     
     xhr.open('put', url, true);
     
@@ -221,8 +103,8 @@ module.exports.put = (url, body) => {
         if (!event.lengthComputable)
             return;
         
-        const percent = (event.loaded / event.total) * 100;
-        const count   = Math.round(percent);
+        const percent = event.loaded / event.total * 100;
+        const count = Math.round(percent);
         
         emitter.emit('progress', count);
     };
@@ -234,8 +116,10 @@ module.exports.put = (url, body) => {
         if (!over)
             return;
         
-        if (xhr.status === OK)
+        if (xhr.status === OK) {
+            emitter.emit('progress', 100);
             return emitter.emit('end');
+        }
         
         const error = Error(xhr.responseText);
         emitter.emit('error', error);
@@ -245,117 +129,3 @@ module.exports.put = (url, body) => {
     
     return emitter;
 };
-
-function ext(src, func) {
-    switch (getExt(src)) {
-    case '.js':
-        return load.js(src, func);
-    
-    case '.css':
-        return load.css(src, func);
-    
-    default:
-        return load({
-            src,
-            func,
-        });
-    }
-}
-
-/**
- * create elements and load them to DOM-tree
- * one-by-one
- *
- * @param params
- * @param callback
- */
-load.series = (params, callback) => {
-    if (!params)
-        return load;
-    
-    const funcs = params
-        .map((url) => ext.bind(null, url))
-        .concat(callback);
-    
-    exec.series(funcs);
-    
-    return load;
-};
-
-/**
- * improve callback of funcs so
- * we pop number of function and
- * if it's last we call pCallBack
- *
- * @param params
- * @param callback - onload function
- */
-load.parallel = (params, callback) => {
-    if (!params)
-        return load;
-    
-    const funcs = params.map((url) => {
-        return ext.bind(null, url);
-    });
-    
-    exec.parallel(funcs, callback);
-    
-    return load;
-};
-
-/**
- * Функция загружает js-файл
- *
- * @param src
- * @param func
- */
-load.js = (src, func) => {
-    const name = 'script';
-    
-    return load({
-        name,
-        src,
-        func,
-    });
-},
-
-load.css = (src, func) => {
-    const name = 'link';
-    const {head:parent} = document;
-    
-    return load({
-        name,
-        src,
-        parent,
-        func
-    });
-};
-
-/**
- * Функция создаёт елемент style и записывает туда стили
- * @param params - структура параметров, заполняеться таким
- * образом: {src: ' ',func: '', id: '', element: '', inner: ''}
- * все параметры опциональны
- */
-load.style = (params) => {
-    const {
-        id,
-        src,
-        name = 'style',
-        func,
-        inner,
-        parent = document.head,
-        element,
-    } = params;
-    
-    return load({
-        id,
-        src,
-        func,
-        name,
-        inner,
-        parent,
-        element,
-    });
-};
-

client/dom/operations/rename-current.js

@@ -0,0 +1,66 @@
+/* global CloudCmd */
+import capitalize from 'just-capitalize';
+import * as _Dialog from '#dom/dialog';
+import * as Storage from '#dom/storage';
+import * as RESTful from '#dom/rest';
+import * as _currentFile from '../current-file.js';
+
+export default async (current, overrides = {}) => {
+    const {
+        refresh = CloudCmd.refresh,
+        Dialog = _Dialog,
+        currentFile = _currentFile,
+    } = overrides;
+    
+    const {
+        isCurrentFile,
+        getCurrentName,
+        getCurrentFile,
+        getCurrentByName,
+        getCurrentType,
+        getCurrentDirPath,
+        setCurrentName,
+    } = currentFile;
+    
+    if (!isCurrentFile(current))
+        current = getCurrentFile();
+    
+    const from = getCurrentName(current);
+    
+    if (from === '..')
+        return Dialog.alert.noFiles();
+    
+    const [cancel, to] = await Dialog.prompt('Rename', from);
+    
+    if (cancel)
+        return;
+    
+    const nextFile = getCurrentByName(to);
+    
+    if (nextFile) {
+        const type = getCurrentType(nextFile);
+        const msg = `${capitalize(type)} "${to}" already exists. Proceed?`;
+        const [cancel] = await Dialog.confirm(msg);
+        
+        if (cancel)
+            return;
+    }
+    
+    if (from === to)
+        return;
+    
+    const dirPath = getCurrentDirPath();
+    
+    const fromFull = `${dirPath}${from}`;
+    const toFull = `${dirPath}${to}`;
+    
+    const [e] = await RESTful.rename(fromFull, toFull);
+    
+    if (e)
+        return;
+    
+    setCurrentName(to, current);
+    
+    Storage.remove(dirPath);
+    refresh();
+};

client/dom/operations/rename-current.spec.js

@@ -0,0 +1,86 @@
+import {test, stub} from 'supertape';
+import renameCurrent from './rename-current.js';
+
+test('cloudcmd: client: dom: renameCurrent: isCurrentFile', async (t) => {
+    const current = {};
+    const isCurrentFile = stub();
+    
+    const currentFile = stubCurrentFile({
+        isCurrentFile,
+    });
+    
+    await renameCurrent(current, {
+        Dialog: stubDialog(),
+        currentFile,
+    });
+    
+    t.calledWith(isCurrentFile, [current], 'should call isCurrentFile');
+    t.end();
+});
+
+test('cloudcmd: client: dom: renameCurrent: file exist', async (t) => {
+    const current = {};
+    const name = 'hello';
+    
+    const prompt = stub().returns([null, name]);
+    const confirm = stub().returns([true]);
+    
+    const getCurrentByName = stub().returns(current);
+    const getCurrentType = stub().returns('directory');
+    
+    const Dialog = stubDialog({
+        confirm,
+        prompt,
+    });
+    
+    const currentFile = stubCurrentFile({
+        getCurrentByName,
+        getCurrentType,
+    });
+    
+    await renameCurrent(null, {
+        Dialog,
+        currentFile,
+    });
+    
+    const expected = 'Directory "hello" already exists. Proceed?';
+    
+    t.calledWith(confirm, [expected], 'should call confirm');
+    t.end();
+});
+
+const stubDialog = (fns = {}) => {
+    const {
+        alert = stub().returns([]),
+        confirm = stub().returns([]),
+        prompt = stub().returns([]),
+    } = fns;
+    
+    return {
+        alert,
+        confirm,
+        prompt,
+    };
+};
+
+const stubCurrentFile = (fns = {}) => {
+    const {
+        isCurrentFile = stub(),
+        getCurrentName = stub(),
+        getCurrentFile = stub(),
+        getCurrentByName = stub(),
+        getCurrentType = stub(),
+        getCurrentDirPath = stub(),
+        setCurrentName = stub(),
+    } = fns;
+    
+    return {
+        isCurrentFile,
+        getCurrentName,
+        getCurrentFile,
+        getCurrentByName,
+        getCurrentType,
+        getCurrentDirPath,
+        setCurrentName,
+    };
+};

client/dom/rest.js

@@ -1,220 +1,40 @@
-'use strict';
+import {tryToCatch} from 'try-to-catch';
+import * as Dialog from '#dom/dialog';
+import * as Images from '#dom/images';
+import {encode} from '#common/entity';
+import * as IO from './io/index.js';
 
-/* global CloudCmd, DOM */
+const handleError = (promise) => async (...args) => {
+    const [e, data] = await tryToCatch(promise, ...args);
+    
+    if (!e)
+        return [e, data];
+    
+    const encoded = encode(e.message);
+    
+    Images.show.error(encoded);
+    Dialog.alert(encoded);
+    
+    return [e, data];
+};
 
-const itype = require('itype/legacy');
+export const remove = handleError(IO.remove);
+export const patch = handleError(IO.patch);
+export const write = handleError(IO.write);
+export const createDirectory = handleError(IO.createDirectory);
+export const read = handleError(IO.read);
+export const copy = handleError(IO.copy);
+export const pack = handleError(IO.pack);
+export const extract = handleError(IO.extract);
+export const move = handleError(IO.move);
+export const rename = handleError(IO.rename);
 
-const {FS} = require('../../common/cloudfunc');
-const {
-    encode,
-} = require('../../common/entity');
+export const Config = {
+    read: handleError(IO.Config.read),
+    write: handleError(IO.Config.write),
+};
 
-module.exports = new RESTful();
-
-const Images = require('./images');
-const load = require('./load');
-
-function RESTful() {
-    this.delete = (url, data, callback) => {
-        const isFunc = itype.function(data);
-        
-        if (!callback && isFunc) {
-            callback = data;
-            data = null;
-        }
-        
-        sendRequest({
-            method      : 'DELETE',
-            url         : FS + url,
-            data,
-            callback,
-            imgPosition : { top: !!data }
-        });
-    };
-    
-    this.patch = (url, data, callback) => {
-        const isFunc = itype.function(data);
-        
-        if (!callback && isFunc) {
-            callback = data;
-            data = null;
-        }
-        
-        const imgPosition = {
-            top: true
-        };
-        
-        sendRequest({
-            method: 'PATCH',
-            url: FS + url,
-            data,
-            callback,
-            imgPosition,
-        });
-    };
-    
-    this.write = (url, data, callback) => {
-        const isFunc = itype.function(data);
-        
-        if (!callback && isFunc) {
-            callback    = data;
-            data        = null;
-        }
-        
-        sendRequest({
-            method: 'PUT',
-            url: FS + url,
-            data,
-            callback,
-            imgPosition : { top: true }
-        });
-    };
-    
-    this.read = (url, dataType, callback) => {
-        const isQuery = /\?/.test(url);
-        const isBeautify = /\?beautify$/.test(url);
-        const isMinify = /\?minify$/.test(url);
-        const notLog = !isQuery || isBeautify || isMinify;
-        const isFunc = itype.function(dataType);
-        
-        if (!callback && isFunc) {
-            callback = dataType;
-            dataType = 'text';
-        }
-        
-        sendRequest({
-            method: 'GET',
-            url: FS + url,
-            callback,
-            notLog,
-            dataType,
-        });
-    };
-    
-    this.cp = (data, callback) => {
-        sendRequest({
-            method: 'PUT',
-            url: '/cp',
-            data,
-            callback,
-            imgPosition : { top: true }
-        });
-    };
-    
-    this.pack = (data, callback) => {
-        sendRequest({
-            method      : 'PUT',
-            url         : '/pack',
-            data,
-            callback,
-        });
-    };
-    
-    this.extract = function(data, callback) {
-        sendRequest({
-            method      : 'PUT',
-            url         : '/extract',
-            data        : data,
-            callback    : callback
-        });
-    };
-    
-    this.mv = function(data, callback) {
-        sendRequest({
-            method      : 'PUT',
-            url         : '/mv',
-            data        : data,
-            callback    : callback,
-            imgPosition : { top: true }
-        });
-    };
-    
-    this.Config = {
-        read:   function(callback) {
-            sendRequest({
-                method      : 'GET',
-                url         : '/config',
-                callback    : callback,
-                imgPosition : { top: true },
-                notLog      : true
-            });
-        },
-        
-        write:  function(data, callback) {
-            sendRequest({
-                method      : 'PATCH',
-                url         : '/config',
-                data        : data,
-                callback    : callback,
-                imgPosition : { top: true }
-            });
-        }
-    };
-    
-    this.Markdown   = {
-        read    : function(url, callback) {
-            sendRequest({
-                method      : 'GET',
-                url         : '/markdown' + url,
-                callback    : callback,
-                imgPosition : { top: true },
-                notLog      : true
-            });
-        },
-        
-        render  : function(data, callback) {
-            sendRequest({
-                method      : 'PUT',
-                url         : '/markdown',
-                data        : data,
-                callback    : callback,
-                imgPosition : { top: true },
-                notLog      : true
-            });
-        }
-    };
-    
-    function sendRequest(params) {
-        const p = params;
-        const prefixUrl = CloudCmd.PREFIX_URL;
-        
-        p.url = prefixUrl + p.url;
-        p.url = encodeURI(p.url);
-        
-        /*
-         * if we send ajax request -
-         * no need in hash so we escape #
-         */
-        p.url = p.url.replace('#', '%23');
-        
-        load.ajax({
-            method      : p.method,
-            url         : p.url,
-            data        : p.data,
-            dataType    : p.dataType,
-            error       : (jqXHR) => {
-                const response = jqXHR.responseText;
-                const statusText = jqXHR.statusText;
-                const status = jqXHR.status;
-                const text = status === 404 ? response : statusText;
-                const encoded = encode(text);
-                
-                Images.show.error(encoded);
-                
-                setTimeout(() => {
-                    DOM.Dialog.alert(CloudCmd.TITLE, encoded);
-                }, 100);
-                
-                p.callback(Error(text));
-            },
-            success: (data) => {
-                Images.hide();
-                
-                if (!p.notLog)
-                    CloudCmd.log(data);
-                
-                p.callback(null, data);
-            }
-        });
-    }
-}
+export const Markdown = {
+    read: handleError(IO.Markdown.read),
+    render: handleError(IO.Markdown.render),
+};

client/dom/select-by-pattern.js

@@ -1,52 +1,46 @@
-'use strict';
-
-/* global DOM */
+import {alert, prompt} from '#dom/dialog';
+import {getRegExp} from '#common/util';
+import {getCurrentName} from './current-file.js';
+import {
+    isSelected,
+    toggleSelectedFile,
+} from './cmd.js';
 
 let SelectType = '*.*';
-const TITLE = 'Cloud Commander';
 
-const {getRegExp} = require('../../common/util');
-
-module.exports = (msg, files) => {
-    const allMsg = `Specify file type for ${msg} selection`;
-    const cancel = false;
-    const {Dialog} = DOM;
+export const selectByPattern = async (msg, files) => {
+    if (!files)
+        return;
     
-    Dialog.prompt(TITLE, allMsg, SelectType, {cancel}).then((type) => {
-        SelectType = type;
+    const allMsg = `Specify file type for ${msg} selection`;
+    const [cancel, type] = await prompt(allMsg, SelectType);
+    
+    if (cancel)
+        return;
+    
+    SelectType = type;
+    
+    const regExp = getRegExp(type);
+    let matches = 0;
+    
+    for (const current of files) {
+        const name = getCurrentName(current);
         
-        const regExp = getRegExp(type);
+        if (name === '..' || !regExp.test(name))
+            continue;
         
-        if (!files)
-            return;
+        ++matches;
         
-        let matches = 0;
+        let selected = isSelected(current);
+        const shouldSel = msg === 'expand';
         
-        files.forEach((current) => {
-            const name = DOM.getCurrentName(current);
-             
-            if (name === '..')
-                return;
-            
-            const isMatch = regExp.test(name);
-            
-            if (!isMatch)
-                return;
-            
-            ++matches;
-            
-            let isSelected = DOM.isSelected(current);
-            const shouldSel = msg === 'expand';
-             
-            if (shouldSel)
-                isSelected = !isSelected;
-            
-            if (isSelected)
-                DOM.toggleSelectedFile(current);
-        });
+        if (shouldSel)
+            selected = !selected;
         
-        if (!matches)
-            Dialog.alert('Select Files', 'No matches found!');
-    });
+        if (selected)
+            toggleSelectedFile(current);
+    }
+    
+    if (!matches)
+        alert('No matches found!');
 };
-

client/dom/storage.js

@@ -1,84 +1,26 @@
-'use strict';
+const {parse, stringify} = JSON;
 
-const itype = require('itype/legacy');
-const jonny = require('jonny/legacy');
-const exec = require('execon');
-const tryCatch = require('try-catch');
-const setItem = localStorage.setItem.bind(localStorage);
-
-/* приватный переключатель возможности работы с кэшем */
-let Allowed;
-
-/**
- * allow Storage usage
- */
-module.exports.setAllowed = (isAllowed) => {
-    Allowed = isAllowed;
+export const set = (name, data) => {
+    localStorage.setItem(name, data);
 };
 
-/** remove element */
-module.exports.remove = (item, callback) => {
-    if (Allowed)
-        localStorage.removeItem(item);
-    
-    exec(callback, null, Allowed);
-    
-    return module.exports;
+export const setJson = (name, data) => {
+    localStorage.setItem(name, stringify(data));
 };
 
-module.exports.removeMatch = (string, callback) => {
-    const reg = RegExp('^' + string + '.*$');
-    const test = (a) => reg.test(a);
-    const remove = (a) => localStorage.removeItem(a);
-    
-    Object.keys(localStorage)
-        .filter(test)
-        .forEach(remove);
-    
-    exec(callback);
-    
-    return module.exports;
+export const get = (name) => {
+    return localStorage.getItem(name);
 };
 
-/** если доступен localStorage и
- * в нём есть нужная нам директория -
- * записываем данные в него
- */
-module.exports.set = (name, data, callback) => {
-    let str, error;
-    
-    if (itype.object(data))
-        str = jonny.stringify(data);
-    
-    if (Allowed && name)
-        [error] = tryCatch(setItem, name, str || data);
-    
-    exec(callback, error);
-    
-    return module.exports;
-},
-
-/** Если доступен Storage принимаем из него данные*/
-module.exports.get = (name, callback) => {
-    let ret;
-    
-    if (Allowed)
-        ret = localStorage.getItem(name);
-    
-    exec(callback, null, ret);
-    
-    return module.exports;
-},
-
-/** функция чистит весь кэш для всех каталогов*/
-module.exports.clear = (callback) => {
-    const ret = Allowed;
-    
-    if (ret)
-        localStorage.clear();
-    
-    exec(callback, null, ret);
-    
-    return module.exports;
+export const getJson = (name) => {
+    const data = localStorage.getItem(name);
+    return parse(data);
 };
 
+export const clear = () => {
+    localStorage.clear();
+};
+
+export const remove = (item) => {
+    localStorage.removeItem(item);
+};

client/dom/storage.spec.js

@@ -0,0 +1,105 @@
+import {test, stub} from 'supertape';
+import * as storage from '#dom/storage';
+
+const {stringify} = JSON;
+
+test('cloudcmd: client: storage: set', async (t) => {
+    const {localStorage} = globalThis;
+    const setItem = stub();
+    
+    globalThis.localStorage = {
+        setItem,
+    };
+    
+    await storage.set('hello', 'world');
+    globalThis.localStorage = localStorage;
+    
+    t.calledWith(setItem, ['hello', 'world'], 'should call setItem');
+    t.end();
+});
+
+test('cloudcmd: client: storage: get', async (t) => {
+    const {localStorage} = globalThis;
+    const getItem = stub().returns('world');
+    
+    globalThis.localStorage = {
+        getItem,
+    };
+    
+    const result = await storage.get('hello');
+    
+    globalThis.localStorage = localStorage;
+    
+    t.equal(result, 'world');
+    t.end();
+});
+
+test('cloudcmd: client: storage: getJson', async (t) => {
+    const {localStorage} = globalThis;
+    const expected = {
+        hello: 'world',
+    };
+    
+    const getItem = stub().returns(stringify(expected));
+    
+    globalThis.localStorage = {
+        getItem,
+    };
+    
+    const result = await storage.getJson('hello');
+    
+    globalThis.localStorage = localStorage;
+    
+    t.deepEqual(result, expected);
+    t.end();
+});
+
+test('cloudcmd: client: storage: setJson', async (t) => {
+    const {localStorage} = globalThis;
+    const data = {
+        hello: 'world',
+    };
+    
+    const expected = stringify(data);
+    const setItem = stub();
+    
+    globalThis.localStorage = {
+        setItem,
+    };
+    
+    await storage.setJson('hello', data);
+    globalThis.localStorage = localStorage;
+    
+    t.calledWith(setItem, ['hello', expected]);
+    t.end();
+});
+
+test('cloudcmd: client: storage: remove', async (t) => {
+    const {localStorage} = globalThis;
+    const removeItem = stub();
+    
+    globalThis.localStorage = {
+        removeItem,
+    };
+    
+    await storage.remove('hello');
+    globalThis.localStorage = localStorage;
+    
+    t.calledWith(removeItem, ['hello'], 'should call removeItem');
+    t.end();
+});
+
+test('cloudcmd: client: storage: clear', async (t) => {
+    const {localStorage} = globalThis;
+    const clear = stub();
+    
+    globalThis.localStorage = {
+        clear,
+    };
+    
+    await storage.clear();
+    globalThis.localStorage = localStorage;
+    
+    t.calledWithNoArgs(clear, 'should call clear');
+    t.end();
+});

client/dom/upload-files.js

@@ -1,27 +1,19 @@
-'use strict';
-
 /* global CloudCmd */
+import {eachSeries} from 'execon';
+import wraptile from 'wraptile';
+import * as load from '#dom/load';
+import {alert} from '#dom/dialog';
+import {FS} from '#common/cloudfunc';
+import * as Images from '#dom/images';
+import {getCurrentDirPath} from './current-file.js';
 
-const {eachSeries} = require('execon');
-const wraptile = require('wraptile/legacy');
-
-const DOM = require('.');
-const load = require('./load');
-const Images = require('./images');
-
-const {FS} = require('../../common/cloudfunc');
-
-const onEnd = wraptile(_onEnd);
 const loadFile = wraptile(_loadFile);
+const onEnd = wraptile(_onEnd);
 
-const {
-    getCurrentDirPath: getPathWhenRootEmpty
-} = DOM;
-
-module.exports = (dir, files) => {
+export const uploadFiles = (dir, files) => {
     if (!files) {
         files = dir;
-        dir = getPathWhenRootEmpty();
+        dir = getCurrentDirPath();
     }
     
     const n = files.length;
@@ -29,7 +21,7 @@ module.exports = (dir, files) => {
     if (!n)
         return;
     
-    const array = [...files];
+    const array = Array.from(files);
     const {name} = files[0];
     
     eachSeries(array, loadFile(dir, n), onEnd(name));
@@ -37,17 +29,17 @@ module.exports = (dir, files) => {
 
 function _onEnd(currentName) {
     CloudCmd.refresh({
-        currentName
+        currentName,
     });
 }
 
 function _loadFile(dir, n, file, callback) {
     let i = 0;
     
-    const name = file.name;
+    const {name} = file;
     const path = dir + name;
-    const {PREFIX_URL} = CloudCmd;
-    const api = PREFIX_URL + FS;
+    const {prefixURL} = CloudCmd;
+    const api = prefixURL + FS;
     
     const percent = (i, n, per = 100) => {
         return Math.round(i * per / n);
@@ -57,7 +49,9 @@ function _loadFile(dir, n, file, callback) {
     
     ++i;
     
-    load.put(api + path, file)
+    load
+        .put(api + path, file)
+        .on('error', showError)
         .on('end', callback)
         .on('progress', (count) => {
             const max = step(n);
@@ -68,3 +62,6 @@ function _loadFile(dir, n, file, callback) {
         });
 }
 
+function showError({message}) {
+    alert(message);
+}

client/get-json-from-file-table.js

@@ -0,0 +1,44 @@
+/* global DOM */
+/**
+ * Функция генерирует JSON из html-таблицы файлов и
+ * используеться при первом заходе в корень
+ */
+export const getJsonFromFileTable = () => {
+    const Info = DOM.CurrentInfo;
+    const path = DOM.getCurrentDirPath();
+    const infoFiles = Info.files || [];
+    
+    const files = infoFiles
+        .filter(notParent)
+        .map(parse);
+    
+    const fileTable = {
+        path,
+        files,
+    };
+    
+    return fileTable;
+};
+
+const notParent = (current) => {
+    const name = DOM.getCurrentName(current);
+    return name !== '..';
+};
+
+const parse = (current) => {
+    const name = DOM.getCurrentName(current);
+    const size = DOM.getCurrentSize(current);
+    const owner = DOM.getCurrentOwner(current);
+    const mode = DOM.getCurrentMode(current);
+    const date = DOM.getCurrentDate(current);
+    const type = DOM.getCurrentType(current);
+    
+    return {
+        name,
+        size,
+        mode,
+        owner,
+        date,
+        type,
+    };
+};

client/input.js

@@ -1,80 +0,0 @@
-'use strict';
-
-const currify = require('currify/legacy');
-
-const isType = currify((type, object, name) => {
-    return typeof object[name] === type;
-});
-
-const isBool = isType('boolean');
-
-module.exports.getElementByName = getElementByName;
-
-function getElementByName(selector, element) {
-    const str = `[data-name="js-${selector}"]`;
-    
-    return element
-        .querySelector(str);
-}
-
-module.exports.getName = (element) => {
-    const name = element
-        .getAttribute('data-name')
-        .replace(/^js-/, '');
-    
-    return name;
-};
-
-module.exports.convert = (config) => {
-    const result = Object.assign({}, config);
-    const array = Object.keys(result);
-    
-    array
-        .filter(isBool(result))
-        .forEach((name) => {
-            const item = result[name];
-            
-            result[name] = setState(item);
-        });
-    
-    return result;
-};
-
-function setState(state) {
-    if (state)
-        return ' checked';
-    
-    return '';
-}
-
-module.exports.getValue = (name, element) => {
-    const el = getElementByName(name, element);
-    const type = el.type;
-    
-    switch(type) {
-    case 'checkbox':
-        return el.checked;
-    
-    case 'number':
-        return Number(el.value);
-    
-    default:
-        return el.value;
-    }
-};
-
-module.exports.setValue = (name, value, element) => {
-    const el = getElementByName(name, element);
-    const type = el.type;
-    
-    switch(type) {
-    case 'checkbox':
-        el.checked = value;
-        break;
-    
-    default:
-        el.value = value;
-        break;
-    }
-};
-

client/key/binder.js

@@ -0,0 +1,15 @@
+export const createBinder = () => {
+    let binded = false;
+    
+    return {
+        isBind() {
+            return binded;
+        },
+        setBind() {
+            binded = true;
+        },
+        unsetBind() {
+            binded = false;
+        },
+    };
+};

client/key/binder.spec.js

@@ -0,0 +1,28 @@
+import {test} from 'supertape';
+import {createBinder} from './binder.js';
+
+test('client: key: binder: isBind: default', (t) => {
+    const binder = createBinder();
+    
+    t.notOk(binder.isBind(), 'should not be bind by default');
+    t.end();
+});
+
+test('client: key: binder: setBind', (t) => {
+    const binder = createBinder();
+    
+    binder.setBind();
+    
+    t.ok(binder.isBind(), 'should be bind');
+    t.end();
+});
+
+test('client: key: binder: unsetBind', (t) => {
+    const binder = createBinder();
+    
+    binder.setBind();
+    binder.unsetBind();
+    
+    t.notOk(binder.isBind(), 'should not be bind');
+    t.end();
+});

client/key/index.spec.js

@@ -0,0 +1,56 @@
+import autoGlobals from 'auto-globals';
+import supertape from 'supertape';
+import {ESC} from './key.js';
+import {Key, _listener} from './index.js';
+import {getDOM, getCloudCmd} from './vim/globals.fixture.js';
+
+const test = autoGlobals(supertape);
+const {stub} = supertape;
+
+globalThis.DOM = getDOM();
+globalThis.CloudCmd = getCloudCmd();
+
+test('cloudcmd: client: key: enable vim', async (t) => {
+    const vim = stub();
+    const config = stub().returns(true);
+    const _config = stub();
+    
+    const event = {
+        keyCode: ESC,
+        key: 'Escape',
+        altKey: false,
+    };
+    
+    Key.setBind();
+    
+    await _listener(event, {
+        vim,
+        config,
+        _config,
+        switchKey: stub(),
+    });
+    
+    t.calledWith(vim, ['Escape', event]);
+    t.end();
+});
+
+test('cloudcmd: client: key: disable vim', async (t) => {
+    const _config = stub();
+    const config = stub();
+    
+    const event = {
+        keyCode: ESC,
+        key: 'Escape',
+        altKey: false,
+    };
+    
+    Key.setBind();
+    await _listener(event, {
+        config,
+        _config,
+        switchKey: stub(),
+    });
+    
+    t.calledWith(_config, ['vim', true]);
+    t.end();
+});

client/key/key.js

@@ -1,81 +1,58 @@
-'use strict';
-
-module.exports = {
-    BACKSPACE   : 8,
-    TAB         : 9,
-    ENTER       : 13,
-    ESC         : 27,
-    
-    SPACE       : 32,
-    PAGE_UP     : 33,
-    PAGE_DOWN   : 34,
-    END         : 35,
-    HOME        : 36,
-    
-    LEFT        : 37,
-    UP          : 38,
-    RIGHT       : 39,
-    DOWN        : 40,
-    
-    INSERT      : 45,
-    DELETE      : 46,
-    
-    ZERO        : 48,
-    
-    SEMICOLON   : 52,
-    
-    COLON       : 54,
-    
-    A           : 65,
-    
-    C           : 67,
-    D           : 68,
-    
-    G           : 71,
-    
-    J           : 74,
-    K           : 75,
-    
-    M           : 77,
-    
-    O           : 79,
-    P           : 80,
-    Q           : 81,
-    R           : 82,
-    S           : 83,
-    T           : 84,
-    U           : 85,
-    
-    V           : 86,
-    
-    X           : 88,
-    
-    Z           : 90,
-    
-    INSERT_MAC  : 96,
-    
-    ASTERISK    : 106,
-    PLUS        : 107,
-    MINUS       : 109,
-    
-    F1          : 112,
-    F2          : 113,
-    F3          : 114,
-    F4          : 115,
-    F5          : 116,
-    F6          : 117,
-    F7          : 118,
-    F8          : 119,
-    F9          : 120,
-    F10         : 121,
-    
-    EQUAL       : 187,
-    HYPHEN      : 189,
-    DOT         : 190,
-    SLASH       : 191,
-    TRA         : 192, /* Typewritten Reverse Apostrophe (`) */
-    BACKSLASH   : 220,
-    
-    BRACKET_CLOSE: 221
-};
-
+export const BACKSPACE = 8;
+export const TAB = 9;
+export const ENTER = 13;
+export const CAPSLOCK = 20;
+export const ESC = 27;
+export const SPACE = 32;
+export const PAGE_UP = 33;
+export const PAGE_DOWN = 34;
+export const END = 35;
+export const HOME = 36;
+export const LEFT = 37;
+export const UP = 38;
+export const RIGHT = 39;
+export const DOWN = 40;
+export const INSERT = 45;
+export const DELETE = 46;
+export const ZERO = 48;
+export const SEMICOLON = 52;
+export const A = 65;
+export const C = 67;
+export const D = 68;
+export const G = 71;
+export const J = 74;
+export const K = 75;
+export const L = 76;
+export const M = 77;
+export const O = 79;
+export const P = 80;
+export const Q = 81;
+export const R = 82;
+export const S = 83;
+export const T = 84;
+export const U = 85;
+export const V = 86;
+export const X = 88;
+export const Z = 90;
+export const INSERT_MAC = 96;
+export const ASTERISK = 106;
+export const PLUS = 107;
+export const MINUS = 109;
+export const F1 = 112;
+export const F2 = 113;
+export const F3 = 114;
+export const F4 = 115;
+export const F5 = 116;
+export const F6 = 117;
+export const F7 = 118;
+export const F8 = 119;
+export const F9 = 120;
+export const F10 = 121;
+export const COLON = 186;
+export const EQUAL = 187;
+export const HYPHEN = 189;
+export const DOT = 190;
+export const SLASH = 191;
+export const TRA = 192;
+export const BACKSLASH = 220;
+export const BRACKET_CLOSE = 221;

client/key/set-current-by-char.js

@@ -1,23 +1,20 @@
 /* global DOM */
+import {escapeRegExp} from '#common/util';
 
-'use strict';
-
-const Info = DOM.CurrentInfo;
-const {escapeRegExp} = require('../../common/util');
-
-module.exports = function setCurrentByChar(char, charStore) {
+export default function setCurrentByChar(char, charStore) {
+    const Info = DOM.CurrentInfo;
     let firstByName;
     let skipCount = 0;
-    let setted = false;
+    let set = false;
     let i = 0;
     
     const escapeChar = escapeRegExp(char);
-    const regExp = new RegExp('^' + escapeChar + '.*$', 'i');
+    const regExp = new RegExp(`^${escapeChar}.*$`, 'i');
     const {files} = Info;
     const chars = charStore();
     const n = chars.length;
     
-    while(i < n && char === chars[i])
+    while (i < n && char === chars[i])
         i++;
     
     if (!i)
@@ -31,19 +28,21 @@ module.exports = function setCurrentByChar(char, charStore) {
     const isTest = (a) => regExp.test(a);
     const isRoot = (a) => a === '..';
     const not = (f) => (a) => !f(a);
+    
     const setCurrent = (name) => {
         const byName = DOM.getCurrentByName(name);
         
         if (!skipCount) {
-            setted = true;
+            set = true;
             DOM.setCurrentFile(byName);
-            return true;
-        } else {
-            if (skipN === skipCount)
-                firstByName = byName;
             
-            --skipCount;
+            return true;
         }
+        
+        if (skipN === skipCount)
+            firstByName = byName;
+        
+        --skipCount;
     };
     
     names
@@ -51,9 +50,8 @@ module.exports = function setCurrentByChar(char, charStore) {
         .filter(not(isRoot))
         .some(setCurrent);
     
-    if (!setted) {
+    if (!set) {
         DOM.setCurrentFile(firstByName);
         charStore([char]);
     }
-};
-
+}

client/key/vim/find.js

@@ -1,41 +1,36 @@
-'use strict';
-/* global DOM */
-
-const fullstore = require('fullstore/legacy');
-const limier = require('limier/legacy');
-const Info = DOM.CurrentInfo;
+import {fullstore} from 'fullstore';
+import limier from 'limier';
 
 const searchStore = fullstore([]);
 const searchIndex = fullstore(0);
 
-module.exports.find = (value) => {
-    const names = Info.files.map(DOM.getCurrentName);
+export const find = (value, names) => {
     const result = limier(value, names);
     
     searchStore(result);
     searchIndex(0);
     
-    DOM.setCurrentByName(result[0]);
+    return result;
 };
 
-module.exports.findNext = () => {
+export const findNext = () => {
     const names = searchStore();
     const index = next(searchIndex(), names.length);
     
     searchIndex(index);
-    DOM.setCurrentByName(names[searchIndex()]);
+    return names[searchIndex()];
 };
 
-module.exports.findPrevious = () => {
+export const findPrevious = () => {
     const names = searchStore();
     const index = previous(searchIndex(), names.length);
     
     searchIndex(index);
-    DOM.setCurrentByName(names[index]);
+    return names[index];
 };
 
-module.exports._next = next;
-module.exports._previous = previous;
+export const _next = next;
+export const _previous = previous;
 
 function next(index, length) {
     if (index === length - 1)
@@ -50,4 +45,3 @@ function previous(index, length) {
     
     return --index;
 }
-

client/key/vim/find.spec.js

@@ -0,0 +1,55 @@
+import test from 'supertape';
+import {getDOM} from './globals.fixture.js';
+import {
+    _next,
+    _previous,
+    find,
+    findNext,
+    findPrevious,
+} from './find.js';
+
+globalThis.DOM = getDOM();
+
+test('cloudcmd: client: vim: _next', (t) => {
+    const result = _next(1, 2);
+    
+    t.notOk(result, 'should return 0');
+    t.end();
+});
+
+test('cloudcmd: client: vim: _next: increment', (t) => {
+    const result = _next(0, 2);
+    
+    t.equal(result, 1, 'should return 1');
+    t.end();
+});
+
+test('cloudcmd: client: vim: _previous', (t) => {
+    const result = _previous(0, 2);
+    
+    t.equal(result, 1, 'should return 1');
+    t.end();
+});
+
+test('cloudcmd: client: vim: _previous: decrement', (t) => {
+    const result = _previous(1, 2);
+    
+    t.equal(result, 0, 'should return 0');
+    t.end();
+});
+
+test('cloudcmd: client: vim: findNext: after find', (t) => {
+    find('a', ['alpha', 'beta', 'apple']);
+    const result = findNext();
+    
+    t.equal(result, 'beta', 'should return next found name');
+    t.end();
+});
+
+test('cloudcmd: client: vim: findPrevious: after find', (t) => {
+    find('a', ['alpha', 'beta', 'apple']);
+    const result = findPrevious();
+    
+    t.equal(result, 'apple', 'should return previous found name');
+    t.end();
+});

client/key/vim/globals.fixture.js

@@ -1,20 +1,19 @@
-'use strict';
+const noop = () => {};
 
-module.exports.getDOM = () => {
-    const resolve = Promise.resolve.bind(Promise);
+export const getDOM = () => {
+    const prompt = Promise.resolve.bind(Promise);
     const CurrentInfo = {
         element: {},
         files: [],
     };
     
-    const noop = () => {};
     const Buffer = {
         copy: noop,
         paste: noop,
     };
     
     const Dialog = {
-        prompt: resolve
+        prompt,
     };
     
     return {
@@ -28,16 +27,20 @@ module.exports.getDOM = () => {
         getCurrentName: noop,
         setCurrentByName: noop,
         toggleSelectedFile: noop,
+        prompNewDirectory: noop,
+        promptNewFile: noop,
     };
 };
 
-module.exports.getCloudCmd = () => {
+export const getCloudCmd = () => {
     const show = () => {};
     
     return {
-        Operation:  {
-            show
-        }
+        Operation: {
+            show,
+        },
+        
+        config: noop,
+        _config: noop,
     };
 };
-

client/key/vim/index.js

@@ -1,199 +1,167 @@
-'use strict';
-/* global CloudCmd, DOM */
+import vim from './vim.js';
+import * as finder from './find.js';
+import {
+    setCurrent,
+    selectFileNotParent,
+} from './set-current.js';
 
-const KEY = require('../key');
-const Info = DOM.CurrentInfo;
-const Dialog = DOM.Dialog;
-
-const fullstore = require('fullstore/legacy');
-const store = fullstore('');
-const visual = fullstore(false);
-const {
-    find,
-    findNext,
-    findPrevious,
-} = require('./find');
-
-const TITLE = 'Cloud Commander';
-
-const stopVisual = () => {
-    visual(false);
+export default (key, event, overrides = {}) => {
+    const defaults = {
+        ...globalThis.DOM,
+        ...globalThis.CloudCmd,
+    };
+    
+    const deps = {
+        ...defaults,
+        ...overrides,
+    };
+    
+    const operations = getOperations(event, deps);
+    
+    vim(key, operations, deps);
 };
 
-const end = () => {
-    store('');
+const getOperations = (event, deps) => {
+    const {
+        Info = globalThis.DOM.CurrentInfo,
+        CloudCmd = globalThis.CloudCmd,
+        Operation,
+        unselectFiles,
+        setCurrentFile,
+        setCurrentByName,
+        getCurrentName,
+        prompt = globalThis.DOM.Dialog.prompt,
+        preventDefault = event?.preventDefault?.bind(event),
+        stopImmediatePropagation = event?.preventDefault?.bind(event),
+        promptNewFile = globalThis.DOM.promptNewFile,
+        toggleSelectedFile,
+        Buffer = {},
+        createFindNext = _createFindNext,
+        createFindPrevious = _createFindPrevious,
+        createMakeFile = _createMakeFile,
+        renameCurrent,
+    } = deps;
+    
+    return {
+        makeFile: createMakeFile({
+            promptNewFile,
+            preventDefault,
+            stopImmediatePropagation,
+        }),
+        findNext: createFindNext({
+            setCurrentByName,
+        }),
+        findPrevious: createFindPrevious({
+            setCurrentByName,
+        }),
+        escape: unselectFiles,
+        rename: () => {
+            event.preventDefault();
+            renameCurrent();
+        },
+        remove: () => {
+            Operation.show('delete');
+        },
+        operationCopy: () => {
+            event.preventDefault();
+            Operation.show('copy');
+        },
+        operationMove: () => {
+            event.preventDefault();
+            Operation.show('move');
+        },
+        
+        makeDirectory: () => {
+            event.stopImmediatePropagation();
+            event.preventDefault();
+            globalThis.DOM.promptNewDir();
+        },
+        
+        terminal: () => {
+            CloudCmd.Terminal.show();
+        },
+        
+        edit: () => {
+            CloudCmd.EditFileVim.show();
+        },
+        
+        copy: () => {
+            Buffer.copy();
+            unselectFiles();
+        },
+        
+        select: () => {
+            const current = Info.element;
+            toggleSelectedFile(current);
+        },
+        
+        paste: Buffer.paste,
+        
+        moveNext: ({count, isVisual, isDelete}) => {
+            setCurrent('next', {
+                count,
+                isVisual,
+                isDelete,
+            }, {
+                Info,
+                setCurrentFile,
+                unselectFiles,
+                Operation,
+            });
+        },
+        
+        movePrevious: ({count, isVisual, isDelete}) => {
+            setCurrent('previous', {
+                count,
+                isVisual,
+                isDelete,
+            }, {
+                Info,
+                setCurrentFile,
+                unselectFiles,
+                Operation,
+            });
+        },
+        
+        find: async () => {
+            preventDefault();
+            const [, value] = await prompt('Find', '');
+            
+            if (!value)
+                return;
+            
+            const names = Info.files.map(getCurrentName);
+            const [result] = finder.find(value, names);
+            
+            setCurrentByName(result);
+        },
+    };
 };
 
-const rmFirst = (a) => {
-    return a
-        .split('')
-        .slice(1)
-        .join('');
+export const selectFile = selectFileNotParent;
+
+const _createFindPrevious = (overrides = {}) => () => {
+    const {setCurrentByName} = overrides;
+    const name = finder.findPrevious();
+    
+    setCurrentByName(name);
 };
 
-module.exports = (key, event) => {
-    const current = Info.element;
-    const keyCode = event.keyCode;
-    const prevStore = store();
+const _createFindNext = (overrides = {}) => () => {
+    const {setCurrentByName} = overrides;
+    const name = finder.findNext();
     
-    const value = store(prevStore.concat(key));
-    
-    if (keyCode === KEY.ENTER)
-        return end();
-    
-    if (keyCode === KEY.ESC) {
-        DOM.unselectFiles();
-        visual(false);
-        return end();
-    }
-    
-    if (key === 'j') {
-        move('next', {
-            prevStore,
-            current,
-        });
-        
-        return end();
-    }
-    
-    if (key === 'k') {
-        move('previous', {
-            prevStore,
-            current,
-        });
-        
-        return end();
-    }
-    
-    if (/gg/.test(value)) {
-        move('previous', {
-            current,
-            prevStore,
-            max: Infinity,
-        });
-        
-        return end();
-    }
-    
-    if (key === 'd' && (visual() || prevStore === 'd')) {
-        CloudCmd.Operation.show('delete');
-        stopVisual();
-        return end();
-    }
-    
-    if (key === 'G') {
-        move('next', {
-            current,
-            prevStore,
-            max: Infinity,
-        });
-        
-        return end();
-    }
-    
-    if (key === 'y') {
-        if (!visual())
-            return end();
-        
-        DOM.Buffer.copy();
-        stopVisual();
-        DOM.unselectFiles();
-        return end();
-    }
-    
-    if (/^p$/i.test(key)) {
-        DOM.Buffer.paste();
-        return end();
-    }
-    
-    if (/^v$/i.test(key)) {
-        DOM.toggleSelectedFile(current);
-        visual(!visual());
-        
-        return end();
-    }
-    
-    if (key === '/') {
-        event.preventDefault();
-        
-        Dialog.prompt(TITLE, 'Find', '', {cancel: false})
-            .then(find);
-       
-        return end();
-    }
-    
-    if (key === 'n') {
-        findNext();
-        return end();
-    }
-    
-    if (key === 'N') {
-        findPrevious();
-        return end();
-    }
+    setCurrentByName(name);
 };
 
-module.exports.selectFile = selectFile;
-
-function move(sibling, {max, current, prevStore}) {
-    const isDelete = prevStore[0] === 'd';
+const _createMakeFile = (overrides = {}) => () => {
+    const {
+        promptNewFile,
+        stopImmediatePropagation,
+        preventDefault,
+    } = overrides;
     
-    if (isDelete) {
-        visual(true);
-        prevStore = rmFirst(prevStore);
-    }
-    
-    const n = max || getNumber(prevStore);
-    
-    if (isNaN(n))
-        return;
-    
-    setCurrent({
-        n,
-        current,
-        sibling,
-        visual: visual(),
-    });
-    
-    if (isDelete)
-        CloudCmd.Operation.show('delete');
-}
-
-function getNumber(value) {
-    if (!value)
-        return 1;
-    
-    if (value === 'g')
-        return 1;
-    
-    return parseInt(value);
-}
-
-function selectFile(current) {
-    const name = DOM.getCurrentName(current);
-    
-    if (name === '..')
-        return;
-    
-    DOM.selectFile(current);
-}
-
-function setCurrent({n, current, visual, sibling}) {
-    const select = visual ? selectFile : DOM.unselectFile;
-    
-    select(current);
-    
-    const position = `${sibling}Sibling`;
-    for (let i = 0; i < n; i++) {
-        const next = current[position];
-        
-        if (!next)
-            break;
-        
-        current = next;
-        select(current);
-    }
-    
-    DOM.setCurrentFile(current);
-}
-
+    stopImmediatePropagation();
+    preventDefault();
+    promptNewFile();
+};

client/key/vim/index.spec.js

@@ -0,0 +1,756 @@
+import {test, stub} from 'supertape';
+import {getDOM, getCloudCmd} from './globals.fixture.js';
+import vim, {selectFile as vimSelectFile} from './index.js';
+import * as finder from './find.js';
+
+globalThis.DOM = getDOM();
+globalThis.CloudCmd = getCloudCmd();
+
+const {assign} = Object;
+const {DOM} = globalThis;
+const {Buffer} = DOM;
+
+test('cloudcmd: client: key: set next file: no', (t) => {
+    const element = {};
+    const setCurrentFile = stub();
+    const unselectFiles = stub();
+    
+    const Info = {
+        element,
+    };
+    
+    vim('j', {}, {
+        Info,
+        setCurrentFile,
+        unselectFiles,
+    });
+    
+    t.calledWith(setCurrentFile, [element], 'should set next file');
+    t.end();
+});
+
+test('cloudcmd: client: key: set next file current: j', async (t) => {
+    const nextSibling = 'hello';
+    const element = {
+        nextSibling,
+    };
+    
+    const setCurrentFile = stub();
+    
+    const Info = {
+        element,
+    };
+    
+    await vim('j', {}, {
+        Info,
+        setCurrentFile,
+        unselectFiles: stub(),
+    });
+    
+    t.calledWith(setCurrentFile, [nextSibling], 'should set next file');
+    t.end();
+});
+
+test('cloudcmd: client: key: set next file current: mjj', (t) => {
+    const nextSibling = 'hello';
+    const element = {
+        nextSibling,
+    };
+    
+    const setCurrentFile = stub();
+    
+    const Info = {
+        element,
+    };
+    
+    const deps = {
+        Info,
+        setCurrentFile,
+        unselectFiles: stub(),
+    };
+    
+    vim('m', {}, deps);
+    vim('j', {}, deps);
+    vim('j', {}, deps);
+    
+    t.calledWith(setCurrentFile, [nextSibling], 'should set next file');
+    t.end();
+});
+
+test('cloudcmd: client: key: set next file current: g', (t) => {
+    const nextSibling = 'hello';
+    const element = {
+        nextSibling,
+    };
+    
+    const setCurrentFile = stub();
+    
+    const Info = {
+        element,
+    };
+    
+    const deps = {
+        Info,
+        setCurrentFile,
+        unselectFiles: stub(),
+    };
+    
+    vim('g', {}, deps);
+    vim('j', {}, deps);
+    
+    t.calledWith(setCurrentFile, [nextSibling], 'should ignore g');
+    t.end();
+});
+
+test('cloudcmd: client: key: set +2 file current', (t) => {
+    const last = {};
+    const setCurrentFile = stub();
+    const element = {};
+    
+    const Info = {
+        element,
+    };
+    
+    const deps = {
+        setCurrentFile,
+        Info,
+        unselectFiles: stub(),
+    };
+    
+    const event = {};
+    
+    vim('2', event, deps);
+    vim('j', event, deps);
+    
+    t.calledWith(setCurrentFile, [last], 'should set next file');
+    t.end();
+});
+
+test('cloudcmd: client: key: select +2 files from current before delete', (t) => {
+    const last = {};
+    const nextSibling = {
+        nextSibling: last,
+    };
+    
+    const element = {
+        nextSibling,
+    };
+    
+    const setCurrentFile = stub();
+    
+    const Info = {
+        element,
+    };
+    
+    const Operation = {
+        show: stub(),
+    };
+    
+    const selectFile = stub();
+    const getCurrentName = stub().returns('x');
+    
+    const event = {};
+    
+    const deps = {
+        Info,
+        setCurrentFile,
+        selectFile,
+        getCurrentName,
+        Operation,
+    };
+    
+    vim('d', event, deps);
+    vim('2', event, deps);
+    vim('j', event, deps);
+    
+    t.calledWith(setCurrentFile, [last], 'should set next file');
+    t.end();
+});
+
+test('cloudcmd: client: key: delete +2 files from current', (t) => {
+    const last = {};
+    const nextSibling = {
+        nextSibling: last,
+    };
+    
+    const element = {
+        nextSibling,
+    };
+    
+    const setCurrentFile = stub();
+    const show = stub();
+    
+    const deps = {
+        Info: {
+            element,
+        },
+        Operation: {
+            show,
+        },
+        setCurrentFile,
+        selectFile: stub(),
+        getCurrentName: stub().returns('x'),
+        unselectFiles: stub(),
+    };
+    
+    const event = {};
+    
+    vim('d', event, deps);
+    vim('2', event, deps);
+    vim('j', event, deps);
+    
+    t.calledWith(show, ['delete'], 'should call delete');
+    t.end();
+});
+
+test('cloudcmd: client: key: set previous file current', (t) => {
+    const previousSibling = 'hello';
+    const element = {
+        previousSibling,
+    };
+    
+    const setCurrentFile = stub();
+    const unselectFiles = stub();
+    
+    const Info = {
+        element,
+    };
+    
+    const deps = {
+        Info,
+        setCurrentFile,
+        unselectFiles,
+    };
+    
+    vim('k', {}, deps);
+    
+    t.calledWith(setCurrentFile, [previousSibling], 'should set previous file');
+    t.end();
+});
+
+test('cloudcmd: client: key: copy: no', (t) => {
+    const copy = stub();
+    
+    vim('y', {}, {
+        unselectFiles: stub(),
+        Buffer: {
+            copy,
+        },
+    });
+    
+    t.notCalled(copy, 'should not copy files');
+    t.end();
+});
+
+test('cloudcmd: client: key: copy', (t) => {
+    const copy = stub();
+    const Info = {
+        element: {},
+    };
+    
+    const toggleSelectedFile = stub();
+    const unselectFiles = stub();
+    
+    const deps = {
+        Info,
+        unselectFiles,
+        toggleSelectedFile,
+        Buffer: {
+            copy,
+        },
+    };
+    
+    vim('v', {}, deps);
+    vim('y', {}, deps);
+    
+    t.calledWithNoArgs(copy, 'should copy files');
+    t.end();
+});
+
+test('cloudcmd: client: key: copy: unselectFiles', (t) => {
+    const unselectFiles = stub();
+    const Info = {
+        element: {},
+    };
+    
+    const toggleSelectedFile = stub();
+    
+    const deps = {
+        Info,
+        unselectFiles,
+        toggleSelectedFile,
+        Buffer: {
+            copy: stub(),
+        },
+    };
+    
+    vim('v', {}, deps);
+    vim('y', {}, deps);
+    
+    t.calledWithNoArgs(unselectFiles, 'should unselect files');
+    t.end();
+});
+
+test('cloudcmd: client: key: paste', (t) => {
+    const paste = stub();
+    
+    Buffer.paste = paste;
+    
+    vim('p', {}, {
+        Buffer,
+    });
+    
+    t.calledWithNoArgs(paste, 'should paste files');
+    t.end();
+});
+
+test('cloudcmd: client: key: selectFile: ..', (t) => {
+    const getCurrentName = stub().returns('..');
+    const selectFile = stub();
+    const current = {};
+    
+    vimSelectFile(current, {
+        selectFile,
+        getCurrentName,
+    });
+    
+    t.notCalled(selectFile, 'should not call selectFile');
+    t.end();
+});
+
+test('cloudcmd: client: key: selectFile', (t) => {
+    const selectFile = stub();
+    const getCurrentName = stub().returns('x');
+    const current = {};
+    
+    vimSelectFile(current, {
+        selectFile,
+        getCurrentName,
+    });
+    
+    t.calledWith(selectFile, [current], 'should call selectFile');
+    t.end();
+});
+
+test('cloudcmd: client: key: set last file current: shift + g', async (t) => {
+    const last = 'last';
+    const nextSibling = {
+        nextSibling: last,
+    };
+    
+    const element = {
+        nextSibling,
+    };
+    
+    const setCurrentFile = stub();
+    
+    await vim('G', {}, {
+        Info: {
+            element,
+        },
+        setCurrentFile,
+        unselectFiles: stub(),
+    });
+    
+    t.calledWith(setCurrentFile, [last], 'should set last file');
+    t.end();
+});
+
+test('cloudcmd: client: key: set last file current: $', (t) => {
+    const last = 'last';
+    const nextSibling = {
+        nextSibling: last,
+    };
+    
+    const element = {
+        nextSibling,
+    };
+    
+    const setCurrentFile = stub();
+    
+    vim('$', {}, {
+        Info: {
+            element,
+        },
+        setCurrentFile,
+        unselectFiles: stub(),
+    });
+    
+    t.calledWith(setCurrentFile, [last], 'should set last file');
+    t.end();
+});
+
+test('cloudcmd: client: key: set first file current: gg', (t) => {
+    const first = 'first';
+    const previousSibling = {
+        previousSibling: first,
+    };
+    
+    const element = {
+        previousSibling,
+    };
+    
+    const Operation = {
+        show: stub(),
+    };
+    
+    const unselectFiles = stub();
+    const setCurrentFile = stub();
+    
+    const deps = {
+        Operation,
+        unselectFiles,
+        setCurrentFile,
+        Info: {
+            element,
+        },
+    };
+    
+    vim('g', {}, deps);
+    vim('g', {}, deps);
+    
+    t.calledWith(setCurrentFile, [first], 'should set first file');
+    t.end();
+});
+
+test('cloudcmd: client: key: set first file current: ^', async (t) => {
+    const first = 'first';
+    const previousSibling = {
+        previousSibling: first,
+    };
+    
+    const element = {
+        previousSibling,
+    };
+    
+    const Operation = {
+        show: stub(),
+    };
+    
+    const unselectFiles = stub();
+    const setCurrentFile = stub();
+    
+    const deps = {
+        setCurrentFile,
+        Info: {
+            element,
+        },
+        unselectFiles,
+        Operation,
+    };
+    
+    await vim('^', {}, deps);
+    
+    t.calledWith(setCurrentFile, [first], 'should set first file');
+    t.end();
+});
+
+test('cloudcmd: client: key: visual', (t) => {
+    const element = {};
+    const toggleSelectedFile = stub();
+    
+    const Info = {
+        element,
+    };
+    
+    vim('v', {}, {
+        Info,
+        toggleSelectedFile,
+    });
+    
+    t.calledWith(toggleSelectedFile, [element], 'should toggle selection');
+    t.end();
+});
+
+test('cloudcmd: client: key: ESC', (t) => {
+    const element = {};
+    const unselectFiles = stub();
+    
+    const Info = {
+        element,
+    };
+    
+    vim('Escape', null, {
+        Info,
+        unselectFiles,
+    });
+    
+    t.calledWithNoArgs(unselectFiles, 'should toggle selection');
+    t.end();
+});
+
+test('cloudcmd: client: key: Enter', async (t) => {
+    const nextSibling = 'hello';
+    const element = {
+        nextSibling,
+    };
+    
+    const unselectFiles = stub();
+    const setCurrentFile = stub();
+    
+    const Info = {
+        element,
+    };
+    
+    await vim('Enter', null, {
+        Info,
+        setCurrentFile,
+        unselectFiles,
+    });
+    
+    await vim('j', null, {
+        Info,
+        setCurrentFile,
+        unselectFiles,
+    });
+    
+    t.calledWith(setCurrentFile, [nextSibling], 'should set next file');
+    t.end();
+});
+
+test('cloudcmd: client: key: /', (t) => {
+    const preventDefault = stub();
+    const element = {};
+    
+    const Info = {
+        element,
+        files: [],
+    };
+    
+    const getCurrentName = stub().returns('');
+    
+    const event = {
+        preventDefault,
+    };
+    
+    const prompt = stub().returns([]);
+    
+    vim('/', event, {
+        getCurrentName,
+        Info,
+        prompt,
+    });
+    
+    t.calledWithNoArgs(preventDefault);
+    t.end();
+});
+
+test('cloudcmd: client: find', (t) => {
+    assign(DOM.Dialog, {
+        prompt: stub().returns([]),
+    });
+    
+    const setCurrentByName = stub();
+    
+    assign(DOM, {
+        setCurrentByName,
+    });
+    
+    const event = {
+        preventDefault: stub(),
+    };
+    
+    vim('/', event);
+    
+    t.notCalled(setCurrentByName);
+    t.end();
+});
+
+test('cloudcmd: client: key: n', (t) => {
+    const findNext = stub();
+    const createFindNext = stub().returns(findNext);
+    
+    const event = {};
+    
+    vim('n', event, {
+        createFindNext,
+    });
+    
+    t.calledWithNoArgs(findNext, 'should call findNext');
+    t.end();
+});
+
+test('cloudcmd: client: key: N', (t) => {
+    const findPrevious = stub();
+    const createFindPrevious = stub().returns(findPrevious);
+    const event = {};
+    
+    vim('N', event, {
+        createFindPrevious,
+    });
+    
+    t.calledWithNoArgs(findPrevious);
+    t.end();
+});
+
+test('cloudcmd: client: key: make directory', async (t) => {
+    const {DOM} = globalThis;
+    
+    assign(DOM, {
+        promptNewDir: stub(),
+    });
+    
+    const event = {
+        stopImmediatePropagation: stub(),
+        preventDefault: stub(),
+    };
+    
+    await vim('m', event);
+    await vim('d', event);
+    
+    t.calledWithNoArgs(DOM.promptNewDir);
+    t.end();
+});
+
+test('cloudcmd: client: key: make file', (t) => {
+    const promptNewFile = stub();
+    
+    const event = {
+        stopImmediatePropagation: stub(),
+        preventDefault: stub(),
+    };
+    
+    vim('m', event);
+    vim('f', event, {
+        promptNewFile,
+    });
+    
+    t.calledWithNoArgs(promptNewFile);
+    t.end();
+});
+
+test('cloudcmd: client: vim: terminal', (t) => {
+    const CloudCmd = {
+        Terminal: {
+            show: stub(),
+        },
+    };
+    
+    const event = {};
+    
+    vim('t', event, {
+        CloudCmd,
+    });
+    vim('t', event, {
+        CloudCmd,
+    });
+    
+    t.calledWithNoArgs(CloudCmd.Terminal.show);
+    t.end();
+});
+
+test('cloudcmd: client: vim: edit', async (t) => {
+    globalThis.DOM = getDOM();
+    globalThis.CloudCmd = getCloudCmd();
+    
+    const {CloudCmd} = globalThis;
+    
+    assign(CloudCmd, {
+        EditFileVim: {
+            show: stub(),
+        },
+    });
+    
+    const event = {};
+    
+    await vim('e', event);
+    
+    t.calledWithNoArgs(CloudCmd.EditFileVim.show);
+    t.end();
+});
+
+test('cloudcmd: client: vim: rename', async (t) => {
+    const DOM = getDOM();
+    const renameCurrent = stub();
+    
+    assign(DOM, {
+        renameCurrent,
+    });
+    
+    const event = {
+        preventDefault: stub(),
+    };
+    
+    await vim('rr', event, DOM);
+    
+    t.calledWithNoArgs(renameCurrent);
+    t.end();
+});
+
+test('cloudcmd: client: key: cc: operationCopy', (t) => {
+    const show = stub();
+    const preventDefault = stub();
+    
+    const Operation = {
+        show,
+    };
+    
+    const event = {
+        preventDefault,
+    };
+    
+    vim('c', event, {
+        Operation,
+    });
+    
+    vim('c', event, {
+        Operation,
+    });
+    
+    t.calledWith(show, ['copy'], 'should show copy operation');
+    t.end();
+});
+
+test('cloudcmd: client: key: mm: operationMove', (t) => {
+    const show = stub();
+    const preventDefault = stub();
+    
+    const Operation = {
+        show,
+    };
+    
+    const event = {
+        preventDefault,
+    };
+    
+    vim('m', event, {
+        Operation,
+    });
+    
+    vim('m', event, {
+        Operation,
+    });
+    
+    t.calledWith(show, ['move'], 'should show move operation');
+    t.end();
+});
+
+test('cloudcmd: client: key: n: findNext: real', (t) => {
+    const setCurrentByName = stub();
+    
+    finder.find('a', ['alpha', 'beta', 'apple']);
+    
+    const event = {};
+    
+    vim('n', event, {
+        setCurrentByName,
+    });
+    
+    t.calledWith(setCurrentByName, ['beta'], 'should set current by next found name');
+    t.end();
+});
+
+test('cloudcmd: client: key: N: findPrevious: real', (t) => {
+    const setCurrentByName = stub();
+    
+    finder.find('a', ['alpha', 'beta', 'apple']);
+    
+    const event = {};
+    
+    vim('N', event, {
+        setCurrentByName,
+    });
+    
+    t.calledWith(setCurrentByName, ['apple'], 'should set current by previous found name');
+    t.end();
+});

client/key/vim/set-current.js

@@ -0,0 +1,33 @@
+/* global DOM */
+export function selectFileNotParent(current, {getCurrentName, selectFile} = DOM) {
+    const name = getCurrentName(current);
+    
+    if (name === '..')
+        return;
+    
+    selectFile(current);
+}
+
+export const setCurrent = (sibling, {count, isVisual, isDelete}, {Info, setCurrentFile, unselectFiles, Operation}) => {
+    let current = Info.element;
+    const select = isVisual ? selectFileNotParent : unselectFiles;
+    
+    select(current);
+    
+    const position = `${sibling}Sibling`;
+    
+    for (let i = 0; i < count; i++) {
+        const next = current[position];
+        
+        if (!next)
+            break;
+        
+        current = next;
+        select(current);
+    }
+    
+    setCurrentFile(current);
+    
+    if (isDelete)
+        Operation.show('delete');
+};

client/key/vim/vim.js

@@ -0,0 +1,220 @@
+import {fullstore} from 'fullstore';
+
+const store = fullstore('');
+const visual = fullstore(false);
+
+const stopVisual = () => {
+    visual(false);
+};
+
+const end = () => {
+    store('');
+};
+
+const rmFirst = (a) => {
+    return a
+        .split('')
+        .slice(1)
+        .join('');
+};
+
+const noop = () => {};
+
+export default (key, operations = {}) => {
+    const prevStore = store();
+    const isVisual = visual();
+    const value = store(prevStore.concat(key));
+    
+    const {
+        escape = noop,
+        moveNext = noop,
+        movePrevious = noop,
+        remove = noop,
+        copy = noop,
+        paste = noop,
+        select = noop,
+        find = noop,
+        findNext = noop,
+        findPrevious = noop,
+        makeFile = noop,
+        makeDirectory = noop,
+        terminal = noop,
+        edit = noop,
+        operationCopy = noop,
+        operationMove = noop,
+        rename = noop,
+    } = operations;
+    
+    if (key === 'Enter')
+        return end();
+    
+    if (key === 'Escape') {
+        visual(false);
+        escape();
+        
+        return end();
+    }
+    
+    if (key === 'j' || key === 'w') {
+        const {
+            count,
+            isDelete,
+            isVisual,
+        } = handleDelete(prevStore);
+        
+        !isNaN(count) && moveNext({
+            count,
+            isVisual,
+            isDelete,
+        });
+        
+        return end();
+    }
+    
+    if (key === 'k' || key === 'b') {
+        const {
+            count,
+            isDelete,
+            isVisual,
+        } = handleDelete(prevStore);
+        
+        !isNaN(count) && movePrevious({
+            count,
+            isVisual,
+            isDelete,
+        });
+        
+        return end();
+    }
+    
+    if (value === 'gg' || key === '^') {
+        const {isDelete, isVisual} = handleDelete(prevStore);
+        
+        movePrevious({
+            count: Infinity,
+            isVisual,
+            isDelete,
+        });
+        
+        return end();
+    }
+    
+    if (value === 'md') {
+        makeDirectory();
+        return end();
+    }
+    
+    if (value === 'tt') {
+        terminal();
+        return end();
+    }
+    
+    if (value === 'e') {
+        edit();
+        return end();
+    }
+    
+    if (value === 'cc') {
+        operationCopy();
+        return end();
+    }
+    
+    if (value === 'mm') {
+        operationMove();
+        return end();
+    }
+    
+    if (value === 'mf') {
+        makeFile();
+        return end();
+    }
+    
+    if (value === 'rr') {
+        rename();
+        return end();
+    }
+    
+    if (key === 'd' && (visual() || prevStore === 'd')) {
+        stopVisual();
+        remove();
+        
+        return end();
+    }
+    
+    if (key === 'G' || key === '$') {
+        moveNext({
+            count: Infinity,
+            isVisual,
+        });
+        
+        return end();
+    }
+    
+    if (key === 'y') {
+        if (!visual())
+            return end();
+        
+        stopVisual();
+        copy();
+        
+        return end();
+    }
+    
+    if (/^p$/i.test(key)) {
+        paste();
+        return end();
+    }
+    
+    if (/^v$/i.test(key)) {
+        visual(!visual());
+        select();
+        
+        return end();
+    }
+    
+    if (key === '/') {
+        find();
+        return end();
+    }
+    
+    if (key === 'n') {
+        findNext();
+        return end();
+    }
+    
+    if (key === 'N') {
+        findPrevious();
+        return end();
+    }
+    
+    if (key === ' ')
+        return end();
+};
+
+function handleDelete(prevStore) {
+    const isDelete = prevStore[0] === 'd';
+    
+    if (isDelete) {
+        visual(true);
+        prevStore = rmFirst(prevStore);
+    }
+    
+    const count = getNumber(prevStore);
+    const isVisual = visual();
+    
+    return {
+        count,
+        isDelete,
+        isVisual,
+    };
+}
+
+function getNumber(value) {
+    if (!value)
+        return 1;
+    
+    if (value === 'g')
+        return 1;
+    
+    return parseInt(value);
+}

client/key/vim/vim.spec.js

@@ -0,0 +1,100 @@
+import {test, stub} from 'supertape';
+import vim from './vim.js';
+
+test('vim: no operations', (t) => {
+    const result = vim('hello', {});
+    
+    t.notOk(result);
+    t.end();
+});
+
+test('vim: space', (t) => {
+    const moveNext = stub();
+    
+    vim(' ');
+    vim('j', {
+        moveNext,
+    });
+    
+    const args = [{
+        count: 1,
+        isDelete: false,
+        isVisual: false,
+    }];
+    
+    t.calledWith(moveNext, args);
+    t.end();
+});
+
+test('vim: ^', (t) => {
+    const movePrevious = stub();
+    
+    vim('^', {
+        movePrevious,
+    });
+    
+    const expected = {
+        count: Infinity,
+        isVisual: false,
+        isDelete: false,
+    };
+    
+    t.calledWith(movePrevious, [expected], 'should call movePrevious');
+    t.end();
+});
+
+test('vim: cc', (t) => {
+    const operationCopy = stub();
+    
+    vim('cc', {
+        operationCopy,
+    });
+    
+    t.calledWithNoArgs(operationCopy);
+    t.end();
+});
+
+test('vim: mm', (t) => {
+    const operationMove = stub();
+    
+    vim('mm', {
+        operationMove,
+    });
+    
+    t.calledWithNoArgs(operationMove);
+    t.end();
+});
+
+test('vim: w', (t) => {
+    const moveNext = stub();
+    
+    vim('w', {
+        moveNext,
+    });
+    
+    const expected = {
+        count: 1,
+        isVisual: false,
+        isDelete: false,
+    };
+    
+    t.calledWith(moveNext, [expected], 'should call moveNext');
+    t.end();
+});
+
+test('vim: b', (t) => {
+    const movePrevious = stub();
+    
+    vim('b', {
+        movePrevious,
+    });
+    
+    const expected = {
+        count: 1,
+        isVisual: false,
+        isDelete: false,
+    };
+    
+    t.calledWith(movePrevious, [expected], 'should call movePrevious');
+    t.end();
+});

client/listeners/get-index.js

@@ -1,11 +1,10 @@
-'use strict';
+import currify from 'currify';
 
-module.exports = (array, item) => {
+export const getIndex = currify((array, item) => {
     const index = array.indexOf(item);
     
     if (!~index)
         return 0;
     
     return index;
-};
-
+});

client/listeners/get-index.spec.js

@@ -1,9 +1,5 @@
-'use strict';
-
-const test = require('tape');
-
-const dir = '../../../client/listeners';
-const getIndex = require(`${dir}/get-index`);
+import test from 'supertape';
+import {getIndex} from './get-index.js';
 
 test('cloudcmd: client: listeners: getIndex: not found', (t) => {
     const array = ['hello'];
@@ -13,9 +9,11 @@ test('cloudcmd: client: listeners: getIndex: not found', (t) => {
 });
 
 test('cloudcmd: client: listeners: getIndex: found', (t) => {
-    const array = ['hello', 'world'];
+    const array = [
+        'hello',
+        'world',
+    ];
     
     t.equal(getIndex(array, 'world'), 1, 'should return index');
     t.end();
 });
-

client/listeners/get-range.js

@@ -1,6 +1,4 @@
-'use strict';
-
-module.exports = (indexFrom, indexTo, files) => {
+export const getRange = (indexFrom, indexTo, files) => {
     if (indexFrom < indexTo)
         return files.slice(indexFrom, indexTo + 1);
     
@@ -9,4 +7,3 @@ module.exports = (indexFrom, indexTo, files) => {
     
     return [files[indexFrom]];
 };
-

client/listeners/get-range.spec.js

@@ -0,0 +1,52 @@
+import test from 'supertape';
+import {getRange} from './get-range.js';
+
+test('cloudcmd: client: listeners: getRange: direct', (t) => {
+    const expected = [
+        'hello',
+        'world',
+    ];
+    
+    const files = [
+        ...expected,
+        'how',
+        'come',
+    ];
+    
+    const result = getRange(0, 1, files);
+    
+    t.deepEqual(result, expected, 'should return range');
+    t.end();
+});
+
+test('cloudcmd: client: listeners: getRange: reverse', (t) => {
+    const expected = [
+        'hello',
+        'world',
+    ];
+    
+    const files = [
+        ...expected,
+        'how',
+        'come',
+    ];
+    
+    const result = getRange(1, 0, files);
+    
+    t.deepEqual(result, expected, 'should return range');
+    t.end();
+});
+
+test('cloudcmd: client: listeners: getRange: one', (t) => {
+    const expected = ['hello'];
+    const files = [
+        ...expected,
+        'how',
+        'come',
+    ];
+    
+    const result = getRange(0, 0, files);
+    
+    t.deepEqual(result, expected, 'should return range');
+    t.end();
+});

client/listeners/index.js

@@ -1,38 +1,30 @@
 /* global DOM, CloudCmd */
-
-'use strict';
-
-const exec = require('execon');
-const itype = require('itype/legacy');
-const currify = require('currify/legacy');
-const getRange = require('./get-range');
-
-const getIndex = currify(require('./get-index'));
-
-const uploadFiles = require('../dom/upload-files');
-
-const {
-    FS,
-    apiURL
-} = require('../../common/cloudfunc');
+import exec from 'execon';
+import itype from 'itype';
+import currify from 'currify';
+import {tryToCatch} from 'try-to-catch';
+import clipboard from '@cloudcmd/clipboard';
+import * as Events from '#dom/events';
+import {uploadFiles} from '#dom/upload-files';
+import {FS} from '#common/cloudfunc';
+import {getRange} from './get-range.js';
+import {getIndex} from './get-index.js';
 
 const NBSP_REG = RegExp(String.fromCharCode(160), 'g');
 const SPACE = ' ';
 
-module.exports.init = () => {
+export async function init() {
     contextMenu();
     dragndrop();
     unload();
     pop();
     resize();
-    config();
     header();
-};
-
-CloudCmd.Listeners = module.exports;
+    await config();
+}
 
 const unselect = (event) => {
-    const isMac = /Mac/.test(window.navigator.platform);
+    const isMac = /Mac/.test(globalThis.navigator.platform);
     const {
         shiftKey,
         metaKey,
@@ -46,23 +38,16 @@ const unselect = (event) => {
 };
 
 const execAll = currify((funcs, event) => {
-    funcs.forEach((fn) => {
+    for (const fn of funcs)
         fn(event);
-    });
 });
 
-const Info = DOM.CurrentInfo;
-const Storage = DOM.Storage;
-const Events = DOM.Events;
 const EventsFiles = {
     mousedown: exec.with(execIfNotUL, setCurrentFileByEvent),
-    click: execAll([
-        onClick,
-        unselect,
-    ]),
+    click: execAll([onClick, exec.with(execIfNotMobile, unselect)]),
     dragstart: exec.with(execIfNotUL, onDragStart),
     dblclick: exec.with(execIfNotUL, onDblClick),
-    touchstart: exec.with(execIfNotUL, onTouch)
+    touchstart: exec.with(execIfNotUL, onTouch),
 };
 
 let EXT;
@@ -70,6 +55,7 @@ let EXT;
 function header() {
     const fm = DOM.getFM();
     const isDataset = (el) => el.dataset;
+    
     const isPanel = (el) => {
         return /^js-(left|right)$/.test(el.dataset.name);
     };
@@ -81,8 +67,7 @@ function header() {
         if (parent.dataset.name !== 'js-fm-header')
             return;
         
-        const name = (el.dataset.name || '')
-            .replace('js-', '');
+        const name = (el.dataset.name || '').replace('js-', '');
         
         if (!/^(name|size|date)$/.test(name))
             return;
@@ -103,44 +88,48 @@ function getPath(el, path = []) {
     return getPath(el.parentElement, path.concat(el));
 }
 
-function config() {
-    DOM.Files.get('config', (e, config) => {
-        const type = config && config.packer;
-        EXT = DOM.getPackerExt(type);
-    });
+async function config() {
+    const [, config] = await tryToCatch(DOM.Files.get, 'config');
+    const type = config?.packer;
+    
+    EXT = DOM.getPackerExt(type);
 }
 
-module.exports.initKeysPanel = () => {
+export const initKeysPanel = () => {
     const keysElement = DOM.getById('js-keyspanel');
     
     if (!keysElement)
         return;
     
-    Events.addClick(keysElement, ({target}) => {
-        const id = target.id;
+    Events.addClick(keysElement, (event) => {
+        const {target} = event;
+        const {id} = target;
+        
         const operation = (name) => {
-            const Operation = CloudCmd.Operation;
-            const fn = Operation.show.bind(null, name);
+            const {Operation} = CloudCmd;
             
-            return fn;
+            return Operation.show.bind(null, name);
         };
         
         const clickFuncs = {
-            'f1'        : CloudCmd.Help.show,
-            'f2'        : DOM.renameCurrent,
-            'f3'        : CloudCmd.View.show,
-            'f4'        : CloudCmd.EditFile.show,
-            'f5'        : operation('copy'),
-            'f6'        : operation('move'),
-            'f7'        : DOM.promptNewDir,
-            'f8'        : operation('delete'),
-            'f9'        : CloudCmd.Menu.show,
-            'f10'       : CloudCmd.Config.show,
-            '~'         : CloudCmd.Konsole.show,
-            'shift~'    : CloudCmd.Terminal.show,
-            'contact'   : CloudCmd.Contact.show,
+            'f1': CloudCmd.Help.show,
+            'f2': CloudCmd.UserMenu.show,
+            'f3': CloudCmd.View.show,
+            'f4': CloudCmd.EditFile.show,
+            'f5': operation('copy'),
+            'f6': operation('move'),
+            'f7': DOM.promptNewDir,
+            'f8': operation('delete'),
+            'f9': () => {
+                event.stopPropagation();
+                CloudCmd.Menu.show();
+            },
+            'f10': CloudCmd.Config.show,
+            '~': CloudCmd.Konsole.show,
+            'shift~': CloudCmd.Terminal.show,
+            'contact': CloudCmd.Contact.show,
         };
-       
+        
         exec(clickFuncs[id]);
     });
 };
@@ -149,10 +138,10 @@ const getPanel = (side) => {
     if (!itype.string(side))
         return side;
     
-    return DOM.getByDataName('js-' + side);
+    return DOM.getByDataName(`js-${side}`);
 };
 
-module.exports.setOnPanel = (side) => {
+export const setOnPanel = (side) => {
     const panel = getPanel(side);
     
     const filesElement = DOM.getByDataName('js-files', panel);
@@ -168,41 +157,45 @@ function getPathListener(panel) {
 }
 
 function isNoCurrent(panel) {
+    const Info = DOM.CurrentInfo;
     const infoPanel = Info.panel;
+    
+    if (!infoPanel)
+        return true;
+    
     const namePanel = panel.getAttribute('data-name');
     const nameInfoPanel = infoPanel.getAttribute('data-name');
     
     return namePanel !== nameInfoPanel;
 }
 
-function decodePath(path){
+function decodePath(path) {
     const url = CloudCmd.HOST;
-    const prefix = CloudCmd.PREFIX;
+    const {prefix} = CloudCmd;
     const prefixReg = RegExp('^' + prefix + FS);
     
     return decodeURI(path)
         .replace(url, '')
-        .replace(prefixReg, '')
-    // browser doesn't replace % -> %25% do it for him
+        .replace(prefixReg, '') // browser doesn't replace % -> %25% do it for him
         .replace('%%', '%25%')
         .replace(NBSP_REG, SPACE) || '/';
 }
-    
 
-function onPathElementClick(panel, event) {
+async function onPathElementClick(panel, event) {
+    const Info = DOM.CurrentInfo;
     event.preventDefault();
     
     const element = event.target;
     const attr = element.getAttribute('data-name');
     const noCurrent = isNoCurrent(panel);
     
-    if (attr === 'js-clear-storage')
-        return Storage.clear();
+    if (attr === 'js-copy-path')
+        return copyPath(element);
     
     if (attr === 'js-refresh')
         return CloudCmd.refresh({
             panel,
-            noCurrent
+            noCurrent,
         });
     
     if (attr !== 'js-path-link')
@@ -211,13 +204,26 @@ function onPathElementClick(panel, event) {
     const {href} = element;
     const path = decodePath(href);
     
-    CloudCmd.loadDir({
-        path,
+    await CloudCmd.changeDir(path, {
         isRefresh: false,
-        panel: noCurrent ? panel : Info.panel
+        panel: noCurrent ? panel : Info.panel,
     });
 }
 
+function copyPath(el) {
+    clipboard
+        .writeText(el.parentElement.title)
+        .then(CloudCmd.log)
+        .catch(CloudCmd.log);
+}
+
+function execIfNotMobile(callback, event) {
+    const isMobile = DOM.getCSSVar('is-mobile');
+    
+    if (!isMobile)
+        callback(event);
+}
+
 function execIfNotUL(callback, event) {
     const {target} = event;
     const {tagName} = target;
@@ -227,30 +233,27 @@ function execIfNotUL(callback, event) {
 }
 
 function onClick(event) {
-    const ctrl = event.ctrlKey;
-    
-    if (!ctrl)
-        event.preventDefault();
-    
+    event.preventDefault();
     changePanel(event.target);
 }
 
 function toggleSelect(key, files) {
-    const isMac = /Mac/.test(window.navigator.platform);
+    const isMac = /Mac/.test(globalThis.navigator.platform);
     
     if (!key)
         throw Error('key should not be undefined!');
     
     const [file] = files;
     
-    if (isMac && key.meta || key.ctrl)
+    if (isMac && key.meta)
         return DOM.toggleSelectedFile(file);
     
     if (key.shift)
-        return files.forEach(DOM.selectFile);
+        return files.map(DOM.selectFile);
 }
 
 function changePanel(element) {
+    const Info = DOM.CurrentInfo;
     const {panel} = Info;
     const files = DOM.getByDataName('js-files', panel);
     const ul = getULElement(element);
@@ -259,21 +262,20 @@ function changePanel(element) {
         DOM.changePanel();
 }
 
-function onDblClick(event) {
+async function onDblClick(event) {
+    event.preventDefault();
+    
     const current = getLIElement(event.target);
     const isDir = DOM.isCurrentIsDir(current);
     const path = DOM.getCurrentPath(current);
     
-    if (isDir) {
-        CloudCmd.loadDir({
-            path: path === '/' ? '/' : path + '/'
-        });
-        
-        event.preventDefault();
-    }
+    if (!isDir)
+        return CloudCmd.View.show();
+    
+    await CloudCmd.changeDir(path);
 }
 
-function onTouch(event) {
+async function onTouch(event) {
     const current = getLIElement(event.target);
     const isDir = DOM.isCurrentIsDir(current);
     
@@ -285,11 +287,7 @@ function onTouch(event) {
     if (!isCurrent)
         return;
     
-    CloudCmd.loadDir({
-        path: DOM.getCurrentPath(current)
-    });
-    
-    event.preventDefault();
+    await CloudCmd.changeDir(DOM.getCurrentPath(current));
 }
 
 /*
@@ -297,8 +295,10 @@ function onTouch(event) {
   * in Chrome (HTML5)
   */
 function onDragStart(event) {
+    const Info = DOM.CurrentInfo;
+    const {prefixURL} = CloudCmd;
     const element = getLIElement(event.target);
-    const isDir = Info.isDir;
+    const {isDir} = Info;
     let link = DOM.getCurrentLink(element);
     let name = DOM.getCurrentName(element);
     
@@ -307,13 +307,15 @@ function onDragStart(event) {
         name += EXT;
         link = document.createElement('a');
         link.textContent = name;
-        link.href = apiURL + '/pack' + Info.path + EXT;
+        link.href = prefixURL + '/pack' + Info.path + EXT;
     }
     
-    event.dataTransfer.setData('DownloadURL',
-        'application/octet-stream'  + ':' +
-        name                        + ':' +
-        link);
+    event.dataTransfer.setData(
+        'DownloadURL',
+        'application/octet-stream' + ':' + name +
+        ':' +
+        link,
+    );
 }
 
 function getLIElement(element) {
@@ -334,13 +336,14 @@ function getULElement(element) {
 }
 
 function setCurrentFileByEvent(event) {
+    const Info = DOM.CurrentInfo;
     const BUTTON_LEFT = 0;
     
     const key = {
         alt: event.altKey,
         ctrl: event.ctrlKey,
         meta: event.metaKey,
-        shift: event.shiftKey
+        shift: event.shiftKey,
     };
     
     const element = getLIElement(event.target);
@@ -377,7 +380,7 @@ function contextMenu() {
     Events.addOnce('contextmenu', fm, (event) => {
         CloudCmd.Menu.show({
             x: event.clientX,
-            y: event.clientY
+            y: event.clientY,
         });
     });
     
@@ -388,21 +391,17 @@ function contextMenu() {
 
 function dragndrop() {
     const panels = DOM.getByClassAll('panel');
-    const select = () => {
-        [...panels].forEach((panel) => {
-            panel.classList.add('selected-panel');
-        });
+    const select = ({target}) => {
+        target.classList.add('selected-panel');
     };
     
-    const unselect = () => {
-        [...panels].forEach((panel) => {
-            panel.classList.remove('selected-panel');
-        });
+    const unselect = ({target}) => {
+        target.classList.remove('selected-panel');
     };
     
     const onDrop = (event) => {
-        const files = event.dataTransfer.files;
-        const items = event.dataTransfer.items;
+        const {files, items} = event.dataTransfer;
+        
         const {length: filesCount} = files;
         
         event.preventDefault();
@@ -411,7 +410,10 @@ function dragndrop() {
             return uploadFiles(files);
         
         const isFile = (item) => item.kind === 'file';
-        const dirFiles = [...items].filter(isFile);
+        
+        const dirFiles = Array
+            .from(items)
+            .filter(isFile);
         
         if (dirFiles.length)
             return DOM.uploadDirectory(dirFiles);
@@ -423,13 +425,13 @@ function dragndrop() {
     };
     
     /**
-     * In Mac OS Chrome dropEffect = 'none'
+     * In macOS Chrome dropEffect = 'none'
      * so drop do not firing up when try
      * to upload file from download bar
      */
     const onDragOver = (event) => {
-        const dataTransfer = event.dataTransfer;
-        const effectAllowed = dataTransfer.effectAllowed;
+        const {dataTransfer} = event;
+        const {effectAllowed} = dataTransfer;
         
         if (/move|linkMove/.test(effectAllowed))
             dataTransfer.dropEffect = 'move';
@@ -439,19 +441,18 @@ function dragndrop() {
         event.preventDefault();
     };
     
-    Events.add('dragenter', select);
-    Events.add(['dragleave', 'drop'], unselect);
-    
-    [...panels].forEach((panel) => {
-        Events.add('dragover', panel, onDragOver)
-            .add('drop', panel, onDrop);
-    });
+    for (const panel of panels)
+        Events
+            .add('dragover', panel, onDragOver)
+            .add('drop', panel, onDrop)
+            .add('dragenter', select)
+            .add(['dragleave', 'drop'], unselect);
 }
 
 function unload() {
-    DOM.Events.add(['unload', 'beforeunload'], (event) => {
-        const Key = CloudCmd.Key;
-        const isBind = Key && Key.isBind();
+    Events.add(['unload', 'beforeunload'], (event) => {
+        const {Key} = CloudCmd;
+        const isBind = Key?.isBind();
         
         if (isBind)
             return;
@@ -462,15 +463,15 @@ function unload() {
 }
 
 function pop() {
-    Events.add('popstate', ({state}) => {
+    Events.add('popstate', async ({state}) => {
         const path = (state || '').replace(FS, '');
         
         if (!path)
             return CloudCmd.route(location.hash);
         
         const history = false;
-        CloudCmd.loadDir({
-            path,
+        
+        await CloudCmd.changeDir(path, {
             history,
         });
     });
@@ -478,7 +479,8 @@ function pop() {
 
 function resize() {
     Events.add('resize', () => {
-        const is = window.innerWidth < CloudCmd.MIN_ONE_PANEL_WIDTH;
+        const Info = DOM.CurrentInfo;
+        const is = globalThis.innerWidth < CloudCmd.MIN_ONE_PANEL_WIDTH;
         
         if (!is)
             return;
@@ -498,4 +500,3 @@ function resize() {
         DOM.changePanel();
     });
 }
-