chore: cloudcmd: v19.1.9

This reverts commit 8200874912.

.babelrc.json

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

.browserslistrc

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

.cloudcmd.menu.js

@@ -0,0 +1,45 @@
+'use strict';
+
+module.exports = {
+    'F2 - Rename file': async ({DOM}) => {
+        await DOM.renameCurrent();
+    },
+    'L - Lint': async ({CloudCmd}) => {
+        const {TerminalRun} = CloudCmd;
+        await run(TerminalRun, 'npm run lint');
+    },
+    'F - Fix Lint': async ({CloudCmd}) => {
+        const {TerminalRun} = CloudCmd;
+        await run(TerminalRun, 'npm run fix:lint');
+    },
+    'T - Test': async ({CloudCmd}) => {
+        const {TerminalRun} = CloudCmd;
+        
+        await run(TerminalRun, 'npm run test');
+    },
+    'C - Coverage': async ({CloudCmd}) => {
+        const {TerminalRun} = CloudCmd;
+        
+        await run(TerminalRun, 'npm run coverage');
+    },
+    'D - Build Dev': async ({CloudCmd}) => {
+        const {TerminalRun} = CloudCmd;
+        
+        await run(TerminalRun, 'npm run build:client:dev');
+        CloudCmd.refresh();
+    },
+    'P - Build Prod': async ({CloudCmd}) => {
+        const {TerminalRun} = CloudCmd;
+        
+        await run(TerminalRun, 'npm run build:client');
+        CloudCmd.refresh();
+    },
+};
+
+async function run(TerminalRun, command) {
+    await TerminalRun.show({
+        command,
+        closeMessage: 'Press any key to close Terminal',
+        autoClose: false,
+    });
+}

.dockerignore

@@ -0,0 +1,23 @@
+.*
+*.spec.js
+node_modules
+npm-debug.log*
+coverage
+test
+manifest.yml
+app.json
+bower.json
+yarn-error.log
+yarn.lock
+now.json
+
+docker
+
+webpack.config.js
+cssnano.config.js
+
+bin/release.js
+
+client
+server_
+

.editorconfig

@@ -0,0 +1,17 @@
+# This file is for unifying the coding style for different editors and IDEs
+# http://editorconfig.org
+
+# top-most EditorConfig file
+root = true
+
+# Unix-style newlines with a newline ending every file
+[*]
+charset = utf-8
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = false
+indent_style = space
+indent_size = 4
+
+[*.hbs]
+insert_final_newline = false

.github/FUNDING.yml

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

.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

@@ -0,0 +1,8 @@
+<!--
+Thank you for making pull request. Please fill in the template below. If unsure
+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 fix:lint` is OK
+- [ ] `npm test` is OK

.github/workflows/docker.yml

@@ -0,0 +1,71 @@
+name: Docker CI
+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
+          echo "::set-output name=version::$(grep '"version":' package.json -m1 | cut -d\" -f4)"
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v3
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v3
+      - name: Login to DockerHub
+        uses: docker/login-action@v3
+        with:
+          username: ${{ secrets.DOCKER_USERNAME }}
+          password: ${{ secrets.DOCKER_TOKEN }}
+      - name: Login to GitHub Container Registry
+        uses: docker/login-action@v3
+        with:
+          registry: ghcr.io
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+      - name: Build and push base-image
+        uses: docker/build-push-action@v5
+        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@v5
+        with:
+          context: .
+          file: docker/Dockerfile.alpine
+          platforms: linux/amd64,linux/arm64
+          push: true
+          tags: |
+            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

.github/workflows/nodejs.yml

@@ -0,0 +1,58 @@
+name: Node CI
+on:
+  - push
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    env:
+      NAME: cloudcmd
+    strategy:
+      matrix:
+        node-version:
+          - 22.x
+          - 24.x
+          - 25.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 -g --no-save
+      - name: Install
+        run: bun i --no-save
+      - name: Lint
+        run: redrun fix:lint
+      - uses: actions/cache@v4
+        with:
+          path: |
+            ~/.cargo/bin/
+            ~/.cargo/registry/index/
+            ~/.cargo/registry/cache/
+            ~/.cargo/git/db/
+            target/
+          key: ${{ runner.os }}-cargo-${{ hashFiles('**/Cargo.lock') }}
+      - name: Typos Install
+        run: cargo install typos-cli || echo 'already installed'
+      - name: Typos
+        run: typos --write-changes
+      - name: Commit fixes
+        uses: EndBug/add-and-commit@v9
+        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,20 +1,19 @@
-#files, the will be ignored by git
-
-#file with changes
-json/changes.json
-
-#c9 files
-.c9revisions
-*tmp
-
-#node modules folder
+package-lock.json
+yarn.lock
+yarn-error.log
 node_modules
+npm-debug.log*
+coverage
 
-#temporary files folder
-tmp
+modules/execon
+modules/emitify
 
-#log file
-log.txt
+.nyc_output
 
-#cloudfoundry file
-manifest.yml
+*.swp
+.DS_Store
+
+dist
+dist-dev
+
+.idea

.madrun.mjs

@@ -0,0 +1,63 @@
+import process from 'node:process';
+import {run, cutEnv} from 'madrun';
+
+const testEnv = {
+    SUPERTAPE_TIMEOUT: 7000,
+};
+
+const is17 = /^v1[789]/.test(process.version);
+const is20 = process.version.startsWith('v2');
+
+// fix for ERR_OSSL_EVP_UNSUPPORTED on node v17
+// flag '--openssl-legacy-provider' not supported
+// on earlier version of node.js
+//
+// https://stackoverflow.com/a/69746937/4536327
+const buildEnv = (is17 || is20) && {
+    NODE_OPTIONS: '--openssl-legacy-provider',
+    NODE_ENV: 'production',
+};
+
+export default {
+    'start': () => 'node bin/cloudcmd.mjs',
+    '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': () => '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': () => run('lint', '--fix'),
+    'lint:stream': () => run('lint', '-f stream'),
+    'test': () => [testEnv, `tape 'test/**/*.{js,mjs}' '{client,static,common,server}/**/*.spec.{js,mjs}' -f fail`],
+    'test:client': () => `tape 'test/client/**/*.js'`,
+    'test:server': () => `tape 'test/**/*.js' 'server/**/*.spec.js' 'common/**/*.spec.js'`,
+    'wisdom': () => run(['lint:all', 'build', 'test']),
+    'wisdom:type': () => 'bin/release.mjs',
+    'coverage': async () => [testEnv, `c8 ${await cutEnv('test')}`],
+    'coverage:report': () => 'c8 report --reporter=lcov',
+    'report': () => 'c8 report --reporter=lcov',
+    '6to5': () => [buildEnv, 'webpack --progress'],
+    '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')}`],
+    '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

@@ -0,0 +1,34 @@
+.*
+*.spec.*
+*.config.*
+*.fixture.js*
+manifest.yml
+docker
+docker-compose.yml
+test
+fixture
+fixture-*
+coverage
+css
+html
+yarn-error.log
+yarn.lock
+now.json
+
+app.json
+bower.json
+manifest.yml
+deno.json
+
+bin/release.mjs
+
+client
+img/logo/cloudcmd-hq.png
+
+webpack.config.js
+
+*.ai
+*.cdr
+*.eps
+
+*.config.*

.nvmrc

@@ -0,0 +1 @@
+v20.15.1

.nycrc.json

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

.putout.json

@@ -0,0 +1,57 @@
+{
+    "plugins": ["cloudcmd"],
+    "ignore": [
+        "html",
+        "fixture*",
+        "app.json",
+        "fontello.json",
+        "*.md"
+    ],
+    "rules": {
+        "package-json/add-type": "off"
+    },
+    "match": {
+        "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"
+        }
+    }
+}

.travis.yml

@@ -1,17 +0,0 @@
-language: node_js
-node_js:
-    - 0.6
-    - 0.8
-    - 0.10
-    - 0.11
-
-matrix:
-  allow_failures:
-    - node_js: '0.11'
-
-notifications:
-    #webhooks:
-        #http://requestb.in/12h5bl71
-    email:
-        on_success: never
-        on_failure: change

.typos.toml

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

.webpack/css.mjs

@@ -0,0 +1,34 @@
+import {env} from 'node:process';
+import OptimizeCssAssetsPlugin from 'optimize-css-assets-webpack-plugin';
+import MiniCssExtractPlugin from 'mini-css-extract-plugin';
+
+const isDev = env.NODE_ENV === 'development';
+
+const clean = (a) => a.filter(Boolean);
+
+const plugins = clean([
+    new MiniCssExtractPlugin({
+        filename: '[name].css',
+    }),
+    !isDev && new OptimizeCssAssetsPlugin(),
+]);
+
+const rules = [{
+    test: /\.css$/i,
+    use: [MiniCssExtractPlugin.loader, {
+        loader: 'css-loader',
+        options: {
+            url: true,
+        },
+    }],
+}, {
+    test: /\.(png|gif|svg|woff|woff2|eot|ttf)$/,
+    type: 'asset/inline',
+}];
+
+export default {
+    plugins,
+    module: {
+        rules,
+    },
+};

.webpack/html.mjs

@@ -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,
+    };
+}

.webpack/js.mjs

@@ -0,0 +1,160 @@
+import {resolve, sep} from 'node:path';
+import {env} from 'node:process';
+import webpack from 'webpack';
+import WebpackBar from 'webpackbar';
+
+const {
+    EnvironmentPlugin,
+    NormalModuleReplacementPlugin,
+} = webpack;
+
+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 notEmpty = (a) => a;
+const clean = (array) => array.filter(notEmpty);
+
+const noParse = (a) => a.endsWith('.spec.js');
+const options = {
+    babelrc: true,
+};
+
+const rules = clean([
+    !isDev && {
+        test: /\.js$/,
+        exclude: /node_modules/,
+        loader: 'babel-loader',
+    },
+    isDev && {
+        test: /\.js$/,
+        exclude: /node_modules/,
+        loader: 'babel-loader',
+        options,
+    },
+]);
+
+const plugins = [
+    new NormalModuleReplacementPlugin(/^node:/, (resource) => {
+        resource.request = resource.request.replace(/^node:/, '');
+    }),
+    new NormalModuleReplacementPlugin(/^putout$/, '@putout/bundle'),
+    new EnvironmentPlugin({
+        NODE_ENV,
+    }),
+    new WebpackBar(),
+];
+
+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',
+                ];
+                
+                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: import.meta.resolve('path-browserify'),
+            process: import.meta.resolve('process/browser'),
+        },
+    },
+    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`,
+        '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.mjs`,
+        [`${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.mjs`,
+        [`${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: 600_000,
+        maxAssetSize: 600_000,
+    },
+};
+
+function devtoolModuleFilenameTemplate(info) {
+    const resource = info.absoluteResourcePath.replace(rootDir + sep, '');
+    return `file://cloudcmd/${resource}`;
+}

.yaspellerrc

@@ -0,0 +1,72 @@
+{
+    "ignoreDigits": true,
+    "excludeFiles": [
+        ".git",
+        "modules",
+        "lib",
+        "node_modules"
+    ],
+    "fileExtensions": [
+        ".md"
+    ],
+    "dictionary":[
+        "CloudCmd",
+        "Dev",
+        "Dropbox",
+        "Deepword",
+        "Dword",
+        "FilePicker",
+        "GDrive",
+        "Github",
+        "Heroku",
+        "Iptables",
+        "JitSu",
+        "Node",
+        "IO",
+        "Olena",
+        "TarZak",
+        "Termux",
+        "Zalitok",
+        "WebSocket",
+        "auth",
+        "autostart",
+        "binded",
+        "cd",
+        "cloudcmd",
+        "coderaiser",
+        "com",
+        "deepword",
+        "dev",
+        "destructuring",
+        "dropbox",
+        "dword",
+        "edward",
+        "favicon",
+        "github",
+        "gz",
+        "io",
+        "js",
+        "linux",
+        "maintainers",
+        "markdown",
+        "microservice",
+        "minification",
+        "mouseup",
+        "named",
+        "nginx",
+        "npm",
+        "or io",
+        "patreon",
+        "rc",
+        "refactor",
+        "sexualized",
+        "sslPort",
+        "unselect",
+        "util",
+        "v0",
+        "v1",
+        "v2",
+        "yml",
+        "systemd"
+    ]
+}

CODE_OF_CONDUCT.md

@@ -0,0 +1,46 @@
+# Contributor Covenant Code of Conduct
+
+## Our Pledge
+
+In the interest of fostering an open and welcoming environment, we as contributors and maintainers pledge to making participation in our project and our community a harassment-free experience for everyone, regardless of age, body size, disability, ethnicity, gender identity and expression, level of experience, nationality, personal appearance, race, religion, or sexual identity and orientation.
+
+## Our Standards
+
+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
+
+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
+
+## Our Responsibilities
+
+Project maintainers are responsible for clarifying the standards of acceptable behavior and are expected to take appropriate and fair corrective action in response to any instances of unacceptable behavior.
+
+Project maintainers have the right and responsibility to remove, edit, or reject comments, commits, code, wiki edits, issues, and other contributions that are not aligned to this Code of Conduct, or to ban temporarily or permanently any contributor for other behaviors that they deem inappropriate, threatening, offensive, or harmful.
+
+## Scope
+
+This Code of Conduct applies both within project spaces and in public spaces when an individual is representing the project or its community. Examples of representing a project or community include using an official project e-mail address, posting via an official social media account, or acting as an appointed representative at an online or offline event. Representation of a project may be further defined and clarified by project maintainers.
+
+## Enforcement
+
+Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by contacting the project team. The project team will review and investigate all complaints, and will respond in a way that it deems appropriate to the circumstances. The project team is obligated to maintain confidentiality with regard to the reporter of an incident. Further details of specific enforcement policies may be posted separately.
+
+Project maintainers who do not follow or enforce the Code of Conduct in good faith may face temporary or permanent repercussions as determined by other members of the project's leadership.
+
+## Attribution
+
+This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, available at [http://contributor-covenant.org/version/1/4][version]
+
+[homepage]: http://contributor-covenant.org
+[version]: http://contributor-covenant.org/version/1/4/

CONTRIBUTING.md

@@ -1,47 +1,30 @@
-Brunch
----------------
-If you would like to contribute - send pull request to dev branch.
-Getting dev version of **Cloud Commander**:
+## Commit
 
-    git clone git://github.com/coderaiser/cloudcmd.git
-    git checkout dev
-
-or by [link](https://github.com/coderaiser/cloudcmd/tree/dev "Dev version").
-
-It is possible thet dev version Cloud Commander will needed dev version of Minify,
-so to get it you should type a couple more commands:
-
-    cd node_modules
-    rm -rf minify
-    git clone git://github.com/coderaiser/minify
-    cd  minify
-    git checkout dev
-
-Commit
----------------
 Format of the commit message: **type(scope) subject**
 
 **Type**:
-- feature
-- fix (bug fix)
-- docs (documentation)
-- style (formatting, missing semi colons, …)
-- refactor
-- test (when adding missing tests)
-- chore (maintain)
+
+- 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)

ChangeLog.rus.md

@@ -1,228 +0,0 @@
-2012.07.01, v0.3.0
-===============
-Уже прошла середина лета и, благодаря легкому похолоданию, мы, кажется, начали больше ценить эту волшебную пору года. Через месяц детишки пойдут в школу, в город нахлынут толпы жаждущих новых знаний студентов, и город плавно войдет в привычный ритм.
-С момента прошлого релиза прошло уже больше трёх месяцев, а это значит пора выкатывать новый релиз. В нём будет очень много нового и интересного. У командира наконецто появилась новая иконка, терминал и редактор были полностью заменены и привязаны к вьеру. Код значительно упрощен и оптимизирован. Далее подробнее.
-
-**Добавлена внешняя возможность:**
-- Назначено f3 - просмотр.
-- FilePicker получает ключ из modules.json.
-- Добавлена возможность показывать помощь по F1.
-- Jquery-terminal заменён на JQ-Console.
-- Добавлена лицензия.
-- Добавлено соглашение по именованию коммитов.
-- Добавлен favicon.
-- CodeMirror заменён на Ace.
-- Обновление теперь возможно, при запуске с любого каталога.
-- Добавлен исполняемый файл для npm -g.
-- Файл сохраняется только если он был изменён в Editor.
-- Для определения разделов на Windows, утилита diskpart заменена на wmic.
-- Добавлена кнопка "~ - console" для вызова Консоли.
-- Добавлена кнопка "f9 - menu" для вызова Меню.
-
-**Исправленные ошибки:**
-- Функция загрузки в Filepicker.
-- this.promptNewFile -> Cmd.promptNewFile.
-- Стили: .name{width}: 37% -> 35%.
-- socket: log level: debug -> info.
-- help: удален стиль "pre".
-- Стили: .mode width: 25% -> 23%.
-- DOM: убрана возможность принимать массив в jsload.
-- Стили: .cmd-button: "outline:0".
-- Сохранение и создание нового файла.
-
-**Обновлены:**
-- socket.io до v0.9.16.
-- jquery до v2.0.3.
-- minify до v0.2.1.
-
-**Внутренние изминения:**
-- Изменена jquery cdn в пользу той, что поддерживает https (jquery.com -> google cdn).
-- Добавлен заголовок Access-Control-Allow-Origin для под возможности ajax запросов с других адресов.
-- Добавлены функции в DOM:  createEvent(createKeyEvent, createClickEvent, createDblClickEvent), dispatch(dispatchKeyEvent, dispatchClickEvent, dispatchDblClickEvent).
-- Переименован обьект CloudCommander -> CloudCmd.
-- Функции загрузки перемещены в обьект Loader модуля DOM.
-- Добавлен скрипт addtables.sh, добавляющий правила в фаервол.
-- Исправлены повторяющиеся правила, связанные с фоном, в css.
-- Переименована функция DOM.addListener - DOM.Events.add.
-- Добавлена возможность повесить несколько обработчиков через Events.add.
-- jqeuryLoader и socketLoader перемещены в обьект CMD в модуле DOM.
-- Исправлена ошибка с удалением файла в Menu.
-- Удалена функция _editFileName из Client.
-- Удалена функция linuxWatch из Main.
-- Добавлен tryCatch в fs.watch в cloudcmd.js.
-- Переименовано KeyBinding в Key.
-- Переименовано set - setBinded, unSet -> unsetBinded, get -> isBinded.
-- Следующие функции теперь приватные: ajaxload, changeLinks, createFileTable, getJSONfromFileTable.
-- Данные обйъекта CloudCmd.KEY перемещены в прототип CloudCmd.Key.
-- Упрощены id плагинов.
-- Переписаны модули _codemirror и View с прототипами.
-- Добавлен метод hide в модуль View.
-- Удалено свойство init из модулей View и Edit.
-- Добавлена возможность передавать колбек во View: show(pData) -> show(pData, pCallBack).
-- Добавлен модуль Help.
-- Добавлена возможность устанавливать атрибуты в Loader.anyload.
-- Добавлен обработчик disconect в Socket.
-- Добавлена минификация и gzip в Socket.
-- Если id уже используется происходит повторное соединение в Socket.
-- Util.log теперь может вызываться с любым количеством параметров.
-- Добавлена функция logArray в Util.
-- Добавлена возможность смены каталога по cd в Socket.
-- Добавлена возможность передавать функции Events.add массив.
-- Добавлено событие unload.
-- Добавлена в экспорт функция checkCallBackParams.
-- Функция dispatch принимает на вход event или его название.
-- Добавлены media-query для .cmd-button.
-
-2012.04.22, v0.2.0
-===============
-Весна в разгаре, на деревьях появляются почки, наконец-то начинает теплеть.
-А это значит, что пришло время выпускать на свободу новую версию Командира.
-
-Много интересных вещей произошло и изменилось со времени прошлого релиза.
-Сейчас мы рассмотрим поближе, что же именно изменилось. Итак начнём.
-
-**Добавленна внешняя возможность:**
-- Всплывающее сообщение об ошибках
-- Создание папки.
-- FilePicker.
-- загружать файлы в облако и скачивать их в файловую систему.
-- SSL.
-- Перемещения файлов.
-- Перехода на http, если https-сервер запустить не удалось.
-- Если создаётся директория индикатор загрузки будет сверху.
-- Обновления размера файла после изминения оного в редакторе.
-- Копирования файлов.
-- Выделения файлов клавишей Insert.
-- Получения размера текущей папки при нажатии клавиши Space.
-- Выделение всех файлов по Ctrl + A.
-- Удаления файла по F8.
-- Удаления нескольких файлов.
-
-**Исправленные ошибки:**
-- Несколько обработчиков клика по нажатию клавиш F3 и F4.
-- Множественный вызов Sockets.
-- Запись json в localStorage: всегда обновлялось содержимое корневой директории.
-- В функциях Util.time и Util.timeEnd.
-- Генереация href файла, который переименовывается.
-- Выделение коревой директории клавишей Space
-- Обработка выделенной корневой директории.
-- Создание нового файла.
-- Стиль выделения в Опере.
-- Заголовок выдачи REST-фукнции fs метода GET.
-- Отправка данных в ответ на запрос отличный от ?json в пути /url.
-- Возвращение в папку, из которой был удален файл.
-
-**Обновлены:**
-- jquery до версии v2.0.0.
-- dropbox до версии v0.9.2.
-- socket.io до версии v0.9.14.
-
-**Внутренние изминения:**
-- Удален массив Listeners из модуля DOM.
-- Переделан и оптимизирована функция getShortSize в CloudFunc.
-- Контроль генерации заголовка кеша перенесен в модуль Main.
-- Установка текущего файла перенесена в Client из CloudFunc.
-- Изменён способ построения таблицы файлов. Теперь используются шаблоны.
-- Загрузка SSL-сертификатов теперь асинхронная.
-- Модуль DropBox перенесён в packege.json из папки Storage.
-- Удаления выделеного файла из DOM.
-- Рекурсивного получения размера текущей папки.
-- Переименована функция promptNewFolder -> promptNewDir.
-- Добавлена функция getSelectedNames.
-- Удален модуль Сache.
-- Оптимизирован модуль CloudFunc.
-
-2012.03.01, v0.1.9
-===============
-Сегодня, в первый день весны, вышла новая версия облачного менеджера файлов: 0.1.9.
-В связи с этим, есть двойной повод порадоватся: наконец, пришла весна,
-с полной готовностью согревать серца жителей, после зимних холодов,
-а так же новая порция положительных изминений и исправленных ошибок в
-Облачном Командире.
-
-Теперь Cloud Commander гораздо стабильнее,
-продуманее, внего гораздо проще вносить изминения и добавлять новые функции.
-Скоро будет много всего интересного.
-
-С прошлой версии произошло очень много перемен и для пользователей и
-для программистов, некоторые части были полностью переписаны, и теперь программа
-более стабильна, а исходный код более простой и логичный.
-К примеру раньше был один баг, из-за которого при нескольких одновременных
-соединениях людям могли не приходить запрошенные файлы. Сейчас подобные просчёты
-позади. Рассмотрим подробнее, чем нас порадует новая версия Cloud Commaner’а.
-
-**Добавленна внешняя возможность:**
-- загрузки файлов на Google Drive и DropBox;
-- пункт VK в меню;
-- прятать пункт меню Upload To, если ниодного storage модуля не задано в modules.json.
-- показывать контекстное меню, правкой кнопкой мыши, даже если оно уже открыто
-- не менять путь, если у нас нет прав на чтение папки.
-- времнный редирект для старых no-js урлов.
-- отключения кеширования файлов браузером в config.json
-- загрузка файлов;
-- сохранение файлов по <Ctrl> + <S> в CodeMirror;
-- удаление файлов;
-- пункт меню и возможность переименовать;
-- экран помощи (<F1>, когда Viewer загружен);
-
-**Убрана внешняя возможность:**
-- Удалена часть URL, которая говорит о том, что JavaScript отключен. Теперь json-данные о структуре файлов будут получатся в собитии click с флагом ?json. Часть URL /no-js больше не будет поддерживатся;
-
-**Исправленные ошибки:**
-- загрузка терминала;
-- в браузерах, которые поддерживают не все функции: jquery загружался после ie.js, должен загружатся — до;
-- закрытием терминала и откритием Вьюера, внутри функции, которая возникает во-время возникновения события переменной event не существует (всё хорошо работало на вебките);
-- высотой терминала;
-- установка текущего курсора, когда выбрали пункт меню;
-- ссылки в панели пути и с кликами на файлы.;
-- поддержка старых браузеров;
-- скроллинг в опере и Фаерфоксе;
-- (ненастоящее) удаление файлов;
-- установка текущего файла после обновления содержимого директории;
-- нажатие на файле;
-- первый и последующие показы меню, а так же выделение даблкликом в Firefox
-
-**Обновлены:**
-- jquery до версии v1.9.0.
-- jquery-terminal до версии v0.4.22.
-- jQuery-contextMenu до версии v1.6.5.
-- socket.io до версии 0.9.13.
-- CodeMirror до версии 2.37.01.
-- dropbox до версии v.0.8.1.
-- funcyBox до версии v2.1.4.
-
-**Внутренние изминения:**
-- Изменен способ получения github id (теперь это делается через config.json, rest api были удалены).
-- Добавлены функции DOM.getCurrentFileContent(pCallBack [, pCurrentFile]) для получения содержимого файла в ФС, а так же обёртка Util.setTimeout(pFunction [, pCallBack, pTime]).
-- Добавлена функция в win.js для парсинга вывода команды diskpart (которая используется для опредиления локальных дисков).
-- Добавлена функция DOM.getCurrentDir().
-- API url на клиенте читается с файла config.json.
-- Если выбрана загрузка на Gist (GitHub) и у файла в формате json нет расширения — оно добавляется.
-- Добавлена возможность авторизовыватся на Гитхабе через новое окно. Изминен редирект на /auth и добавлена фнукция rout в cloudcmd.js.
-- DropBox, GDrive и GitHub модули теперь выглядят одинаково.
-- Рефакторинг в модуле Viewer.
-- Улучшена оптимизация файла menu.js с 2539 до 2444 байт.
-- Добавлена возможность читать GDrive key из конфига.
-- Добавлена возможность авторизовыватся на дропбоксе через popup.
-- Добавлена возможность авторизовыватся на vk.com.
-- Улучшен формат и парсинг файла modules.json.
-- Добавлена возможность читать информацию о модулях сохранения из модуля меню.
-- Добавлена простая система рендеринга шаблонов Util.render.
-- Добавлены функции DOM.parseJSON и DOM.stringifyJSON, как обёртки над системными функциями.
-- Добавлен плагин для миграции к новой версии jquery.
-- Убрано получения данных из кеша Minify.
-- JSON-файлы перемещены в папки json.
-- Изминен шрифт с Octicons на Fonteollo.
-- Полностью удален шрифт Octicons.
-- Удалено свойство allowed из свойства cache в конфиге.
-- С этого момента оптимизироватся будут лишь те файлы, дата последнего изминения которых была изменена.
-- Убрана возможность кешировать файлы в памяти.
-- Перемещены расширения из main.js в json/ext.json.
-- Основная функциональность CloudCmd перемещена в commander.js из server.js.
-- Добавлена возможность удалять приставку к URL /fs когда мы в корневом каталоге.
-- Убраны перересовки создаваемые js.
-- Добавлена возможность добавлять флаг ?json только если мы работаем с папкой.
-- Изминен принцип работы функции clickProcessing в меню, теперь он гораздо проще.
-- Произведен тотальный рефакторинг в файле commander.js, теперь там только генерация.
-структуры каталогов в формате json.
-- добавлен обьект RESTfull в DOM модуль для упрощения работы с CloudCmd REST API.

LICENSE

@@ -1,6 +1,6 @@
 (The MIT License)
 
-Copyright (c) 2013 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,339 +1,177 @@
-Cloud Commander v0.4.0 [![NPM version][NPMIMGURL]][NPMURL] [![Dependency Status][DependencyStatusIMGURL]][DependencyStatusURL] [![Build Status][BuildStatusIMGURL]][BuildStatusURL]
-===============
-###[Main][MainURL] [Blog][BlogURL] [Demo][DemoURL]
-[![Flattr][FlattrIMGURL]][FlattrURL]
-[NPMIMGURL]:                https://badge.fury.io/js/cloudcmd.png
-[BuildStatusIMGURL]:        https://secure.travis-ci.org/coderaiser/cloudcmd.png?branch=master
-[DependencyStatusIMGURL]:   https://gemnasium.com/coderaiser/cloudcmd.png
-[FlattrIMGURL]:             http://api.flattr.com/button/flattr-badge-large.png
-[NPM_INFO_IMG]:             https://nodei.co/npm/cloudcmd.png?downloads=true&&stars
-[NPMURL]:                   http://badge.fury.io/js/cloudcmd
-[BuildStatusURL]:           http://travis-ci.org/coderaiser/cloudcmd  "Build Status"
-[DependencyStatusURL]:      https://gemnasium.com/coderaiser/cloudcmd "Dependency Status"
-[FlattrURL]:                https://flattr.com/submit/auto?user_id=coderaiser&url=github.com/coderaiser/cloudcmd&title=cloudcmd&language=&tags=github&category=software "flattr"
-[NPM_INFO_URL]:             https://npmjs.org/package/cloudcmd "npm"
-[MainURL]:                  http://cloudcmd.io "Main"
-[BlogURL]:                  http://blog.cloudcmd.io "Blog"
-[DemoURL]:                  http://io.cloudcmd.io "Demo"
+# Cloud Commander v19.1.9 [![Build Status][BuildStatusIMGURL]][BuildStatusURL] [![Codacy][CodacyIMG]][CodacyURL] [![Gitter][GitterIMGURL]][GitterURL]
 
-**Cloud Commander** - cloud file manager with console and editor.
+### [Main][MainURL] [Blog][BlogURL] [Support][SupportURL] [Demo][DemoURL]
 
-![Cloud Commander](/img/logo/cloudcmd.png "Cloud Commander")
+[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
 
-Benefits
----------------
-- full browser compatibility *(ie6+,chrome,safari,opera,firefox)*;
-- responsible design
-- one full page loading, *and then just one-time json-dir-listings loading
-(with refresh opportunity).*
-- caching read directories *to localStorage (for now)
-(so if network will disconnected or something happens with a signal, we
-definitely will can work with cached copy of directory listings)*;
-- key binding
-- disabled js support *(working in limited mode)*.
-- automated minification *client js-files and onstart-reading Cloud manager files on server starting.*
+**Cloud Commander** a file manager for the web with console and editor.
 
-**Cloud Commander** uses all benefits of js, so if js is disabled,
-we go to *limited mode*.
+![Cloud Commander](https://cloudcmd.io/img/logo/cloudcmd.png "Cloud Commander")
 
-Limited-mode features
----------------
-- no keybinding
-- no local caching
-- full loading of all web page(with styles, js-scripts, html-page etc).
-
-Hot keys
----------------
-In all modern web browsers (but not in IE, becouse he special) hot keys works.
-There is a short list:
-- **F1**                - help
-- **F2**                - rename current file
-- **F3**                - view
-- **F4**                - edit
-- **F5**                - copy
-- **F6**                - rename/move
-- **F7**                - new dir
-- **F8, Delete**        - remove current file
-- **F9**                - menu
-- **Ctrl + r**          - reload dir content
-- **Ctrl + d**          - clear local cache (wich contains dir contents)
-- **Alt  + q**          - disable key bindings
-- **Alt  + s**          - get all key bindings back
-- **Ctrl + a**          - select all files in a panel
-- **up, down, enter**   - filesystem navigation
-- **Tab**               - move via panels
-- **Page Up**           - up on one page
-- **Page Down**         - down on one page
-- **Home**              - to begin of list
-- **End**               - to end of list
-- **Shift + Delete**    - remove without prompt
-- **Insert**            - select current file
-- **Shift + F10**       - context menu
-- **~**                 - console
-
-Edit
----------------
-[Demo](http://io.cloudcmd.io/fs/etc#/edit/passwd "Edit")
-![Edit](/img/screenshot/edit.png "Edit")
-
-###Hot keys
-- **F4**                - open
-- **Ctrl + s**          - save
-- **Esc**               - close
-
-Console
----------------
-[Demo](http://io.cloudcmd.io#/console "Console")
-![Console](/img/screenshot/console.png "Console")
-
-###Hot keys
-- **~**                 - open
-- **Esc**               - close
-
-Menu
----------------
-[Demo](http://io.cloudcmd.io#/menu "Menu")
-![Menu](/img/screenshot/menu.png "Menu")
-Right mouse click button shows context menu with items:
-- View
-- Edit
-- Rename
-- Delete
-- Zip file
-- Upload to (Dropbox, Github, GDrive)
-- Download
-- New (File, Dir, from cloud)
-
-###Hot keys
-- **F9**                - open
-- **Esc**               - close
-
-Menu
----------------
-Right mouse click button shows context menu with items:
-- View
-- Edit
-- Rename
-- Delete
-- Upload to (Dropbox, Github, GDrive)
-- Download
-- New (File, Dir, from cloud)
-
-Install
----------------
-[![NPM_INFO][NPM_INFO_IMG]][NPM_INFO_URL]
-
-Installing **Cloud Commander** is very simple.
-All you need is 
-- install [node.js](http://nodejs.org/ "node.js")
-- [download](https://github.com/coderaiser/cloudcmd/archive/master.zip)
-and unpack or just clone repository from github:
+## Install
 
 ```
-    git clone git://github.com/coderaiser/cloudcmd.git
-    cd cloudcmd
-    node cloudcmd
-```
-or install in npm:
-```
-    npm i cloudcmd -g
-    cloudcmd
+npm i cloudcmd -g
 ```
 
-Configuration
----------------
-All main configuration could be done via config.json.
+## Start
+
+For starting just type in console:
+
+```sh
+cloudcmd
+```
+
+## How to use?
+
+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]
+
+## Using as Middleware
+
+Cloud Commander could be used as middleware for `node.js` applications based on [socket.io](http://socket.io "Socket.IO") and [express](http://expressjs.com "Express"):
+
+Init `package.json`:
+
+```
+npm init -y
+```
+
+Install dependencies:
+
+```
+npm i cloudcmd express socket.io -S
+```
+
+And create `index.js`:
+
 ```js
-{
-    "api_url"           :"/api/v1",
-    "appcache"          : false,    /* cache files for offline use              */
-    "analytics"         : true,     /* google analytics suport                  */
-    "localStorage"      : true,     /* cache directory data                     */
-    "minification" : {              /* minification of js,css,html and img      */
-        "js"    : false,            /* minify module needed                     */
-        "css"   : false,            /* npm i minify                             */
-        "html"  : true,
-        "img"   : false
+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 = '/';
+
+const server = http.createServer(app);
+const socket = new Server(server, {
+    path: `${prefix}socket.io`,
+});
+
+const config = {
+    name: 'cloudcmd :)',
+};
+
+const filePicker = {
+    data: {
+        FilePicker: {
+            key: 'key',
+        },
     },
-    "cache"             : true,
-    "logs"              : false,     /* logs or console ouput                    */
-    "show_keys_panel"   : true,      /* show classic panel with buttons of keys  */
-    "server"            : true,      /* server mode or testing mode              */
-    "socket"            : true       /* enable web sockets                       */
-    "port"              : 8000,      /* http port or null(default)               */
-    "sslPort"           : 443,       /* https port or null(default)              */
-    "ip"                : null,      /* ip or null(default)                      */
-    "ssl"               : false      /* should use https?                        */
-    "rest"              : true       /* enable rest interface                    */
-}
+};
+
+// override option from json/modules.json
+const modules = {
+    filePicker,
+};
+
+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);
 ```
 
-Server
----------------
-Standard practices say no non-root process gets to talk to
-the Internet on a port less than 1024. Anyway I suggest you
-to start Cloud Commander as non-root. How it could be solved?
-There is a couple easy and fast ways. One of them is port forwarding.
-###Iptables
-Just run [shell/addtables.sh](shell/addtables.sh) for default options.
-```sh
-@:/tmp/cloudcmd (dev) $ sudo iptables -t nat -L # look rules before
-@:/tmp/cloudcmd (dev) $ sudo iptables -t nat -A PREROUTING -p tcp --dport 80 -j REDIRECT --to-ports 8000
-@:/tmp/cloudcmd (dev) $ sudo iptables -t nat -A PREROUTING -p tcp --dport 443 -j REDIRECT --to-ports 4430
-@:/tmp/cloudcmd (dev) $ sudo iptables -t nat -L # look rules after
-```
-You should see something like this ( **8000** and **4430** should be in config as **port** and **sslPort** )
+## Docker
 
-    target     prot opt source               destination
-    REDIRECT   tcp  --  anywhere             anywhere             tcp dpt:http redir ports 8000
-    REDIRECT   tcp  --  anywhere             anywhere             tcp dpt:https redir ports 4430
+The docker images are provided for multiple architectures and types. The following list shows all existing images:
 
-If you would want to get things back just clear rules ( **1** and **2** it's rule numbers,
-in your list they could differ).
+| 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
-@:/tmp/cloudcmd (dev) $ sudo iptables -t nat -D PREROUTING 2
-@:/tmp/cloudcmd (dev) $ sudo iptables -t nat -D PREROUTING 1
+docker run -it --rm -v ~:/root -v /:/mnt/fs -w=/root -p 8000:8000 coderaiser/cloudcmd
 ```
 
-###nginx
-Get [nginx](http://nginx.org/ "nginx"). On linux it could be done like that
+Config would be read from home directory, hosts root file system would be mount to `/mnt/fs`,
+`8000` port would be exposed to hosts port.
+
+Also you could use [docker compose](https://docs.docker.com/compose/ "Docker Compose") with `docker-compose.yml`:
+
+```yml
+version: '2'
+services:
+  web:
+    ports:
+      - 8000:8000
+    volumes:
+      - ~:/root
+      - /:/mnt/fs
+    image: coderaiser/cloudcmd
+```
+
+When you create this file run:
+
 ```sh
-sudo apt-get install nginx #for ubuntu and debian
-```
-Than make host file **/etc/nginx/sites-enabled/io.cloudcmd.io**
-( *io.cloudcmd.io* is your domain name) with content:
-```sh
-server {
-    listen 80;
-    server_name io.cloudcmd.io;
-    access_log /var/log/nginx/io.cloudcmd.io.access.log;
-    location / {
-        proxy_pass    http://127.0.0.1:8000/;
-    }
-}
-```
-```sh
-# create symlink of this file
-ln -s ./sites-enabled/io.cloudcmd.io ./sites-available
-# restart nginx
-/etc/init.d/nginx restart
+docker-compose up
 ```
 
-To run Cloud Commander as daemon in linux you could set **log** to true in config and
-do something like this:
-    
-    nohup node cloudcmd
+## Documentation
 
-Authorization
----------------
-Cloud Commander could authorize clients on GitHub via openID.
-All things that should be done is must be added **id** and **secret** of application
-from github settings page and added to [modules.json](json/modules.json) (id just) and env variable (secret)
-with names: *github_id*, *github_secret*, *dropbox_key*, *dropbox_secret* etc in
-[secret.bat](shell/secret.bat) *(on win32)* or [secret.sh](shell/secret.sh) *(on nix)*.
+More documentation you can find on https://cloudcmd.io/.
 
+## Get involved
 
-Start
----------------
-To start **Cloud Commander** only one command needed:
-    
-    node cloudcmd
-or on win platform just
+There is a lot ways to be involved in `Cloud Commander` development:
 
-    cloudcmd
-After that Cloud Commander reads port information from config file [config.json](json/config.json#L17) and start server
-on this port ( **8000** by default ), if none of port varibles ( *cloud9*, *cloudfoundry* and *nodester* ) isn't exist.
-Then type in browser
+- 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");
 
-    http://127.0.0.1:8000
-or
+## License
 
-    http://localhost:8000
-Update
----------------
-**Cloud Commander** is very often updates.
-Update is doing automagically but it could be done also manualy
-by typing a few commands in cloudcmd directory:
-
-    git pull
-or check new version on npm
-
-    npm info cloudcmd
-
-and then, if there is new version
-
-    npm r cloudcmd
-    npm i cloudcmd
-
-Additional modules
----------------
-**Cloud Commander's Server Side** not using additional modules for main functionality.
-But for minification and optimization tricks optional can be
-assingned (and installed) modules: [Minify] (https://github.com/coderaiser/minify "Minify")
-and [socket.io] (https://github.com/LearnBoost/socket.io "Socket.IO").
-
-Install addtitional modules (type in **Cloud Commander** directory):
-
-    npm i
-
-Extensions
----------------
-**Cloud Commander** desinged to easily porting extensions.
-For extend main functionality Cloud Commander use next modules:
-- [Ace]                     [AceURL]
-- [FancyBox]                [FancyBoxURL]
-- [jQuery-contextMenu]      [jQuery-contextMenuURL]
-- [jq-console]              [jq-consoleURL]
-- [github]                  [githubURL]
-- [dropbox-js]              [dropbox-jsURL]
-- [jquery]                  [jqueryURL]
-
-[AceURL]:                   //ace.ajax.org/ "Ace"
-[FancyBoxURL]:              //github.com/fancyapps/fancyBox "FancyBox"
-[jQuery-contextMenuURL]:    //github.com/medialize/jQuery-contextMenu "jQuery-contextMenu"
-[jq-consoleURL]:            //github.com/replit/jq-console‎ "jq-console"
-[githubURL]:                //github.com/michael/github "github"
-[dropbox-jsURL]:            //github.com/dropbox/dropbox-js "dropbox-js"
-[jqueryURL]:                //jquery.com
-
-Contributing
----------------
-If you would like to contribute - send pull request to dev branch.
-Getting dev version of **Cloud Commander**:
-
-    git clone git://github.com/coderaiser/cloudcmd.git
-    git checkout dev
-
-It is possible that dev version of Cloud Commander will needed dev version of Minify,
-so to get it you should type a couple more commands:
-
-    cd node_modules
-    rm -rf minify
-    git clone git://github.com/coderaiser/minify
-    git checkout dev
-
-Version history
----------------
-- *2013.09.27*, **[v0.4.0](//github.com/coderaiser/cloudcmd-archive/raw/master/cloudcmd-v0.4.0.zip)**
-- *2013.07.01*, **[v0.3.0](//github.com/coderaiser/cloudcmd-archive/raw/master/cloudcmd-v0.3.0.zip)**
-- *2013.04.22*, **[v0.2.0](//github.com/coderaiser/cloudcmd-archive/raw/master/cloudcmd-v0.2.0.zip)**
-- *2013.03.01*, **[v0.1.9](//github.com/coderaiser/cloudcmd-archive/raw/master/cloudcmd-v0.1.9.zip)**
-- *2012.12.12*, **[v0.1.8](//github.com/coderaiser/cloudcmd-archive/raw/master/cloudcmd-v0.1.8.zip)**
-- *2012.10.01*, **[v0.1.7](//github.com/coderaiser/cloudcmd-archive/raw/master/cloudcmd-v0.1.7.zip)**
-- *2012.08.24*, **[v0.1.6](//github.com/coderaiser/cloudcmd-archive/raw/master/cloudcmd-v0.1.6.zip)**
-- *2012.08.06*, **[v0.1.5](//github.com/coderaiser/cloudcmd-archive/raw/master/cloudcmd-v0.1.5.zip)**
-- *2012.07.27*, **[v0.1.4](//github.com/coderaiser/cloudcmd-archive/raw/master/cloudcmd-v0.1.4.zip)**
-- *2012.07.19*, **[v0.1.3](//github.com/coderaiser/cloudcmd-archive/raw/master/cloudcmd-v0.1.3.zip)**
-- *2012.07.14*, **[v0.1.2](//github.com/coderaiser/cloudcmd-archive/raw/master/cloudcmd-v0.1.2.zip)**
-- *2012.07.11*, **[v0.1.1](//github.com/coderaiser/cloudcmd-archive/raw/master/cloudcmd-v0.1.1.zip)**
-- *2012.00.00*, **[v0.1.0](//github.com/coderaiser/cloudcmd-archive/raw/master/cloudcmd-v0.1.0.zip)**
-
-License
----------------
-MIT [license](LICENSE "license").
-
-Special Thanks
----------------
-- [Polietilena](http://polietilena.github.io/ "Polietilena") for [logo](img/logo/cloudcmd.png "logo") and [favicon](img/favicon/favicon.png "favicon").
-- [Elec-ua](https://github.com/elec-ua) for [ru](http://ru.cloudcmd.io "Cloud Commander in Russian") and [ua](http://ua.cloudcmd.io "Cloud Commander in Ukrainian") translations.
+MIT

app.json

@@ -0,0 +1,162 @@
+{
+  "name": "cloudcmd",
+  "description": "Cloud Commander orthodox web file manager with console and editor",
+  "repository": "https://github.com/coderaiser/cloudcmd",
+  "logo": "http://cloudcmd.io/img/logo/cloudcmd.png",
+  "keywords": [
+    "console",
+    "editor",
+    "file",
+    "file manager",
+    "folder",
+    "orthodox"
+  ],
+  "stack": "heroku-18",
+  "env": {
+      "NPM_CONFIG_PRODUCTION": {
+          "description": "Keep false to install devDependencies and build frontend",
+          "value": "false",
+          "required": false
+      },
+      "CLOUDCMD_EDITOR": {
+          "description": "set editor",
+          "value": "edward",
+          "required": false
+      },
+      "CLOUDCMD_CONTACT": {
+          "description": "enable contact",
+          "value": "true",
+          "required": false
+      },
+      "CLOUDCMD_CONFIG_DIALOG": {
+          "description": "show config dialog",
+          "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",
+          "required": false
+      },
+      "CLOUDCMD_SYNC_CONSOLE_PATH": {
+          "description": "sync console path",
+          "value": "false",
+          "required": false
+      },
+      "CLOUDCMD_TERMINAL": {
+          "description": "enable terminal",
+          "value": "true",
+          "required": false
+      },
+      "CLOUDCMD_TERMINAL_PATH": {
+          "description": "set terminal path",
+          "value": "gritty",
+          "required": false
+      },
+      "CLOUDCMD_TERMINAL_COMMAND": {
+          "description": "set command to run in terminal (shell by default)",
+          "value": "",
+          "required": false
+      },
+      "CLOUDCMD_ONE_FILE_PANEL": {
+          "description": "show one file panel",
+          "value": "false",
+          "required": false
+      },
+      "CLOUDCMD_KEYS_PANEL": {
+          "description": "show keys panel",
+          "value": "true",
+          "required": false
+      },
+      "CLOUDCMD_NAME": {
+          "description": "set tab name in web browser",
+          "value": "",
+          "required": false
+      },
+      "CLOUDCMD_AUTH": {
+          "description": "enable authorization",
+          "value": "false",
+          "required": false
+      },
+      "CLOUDCMD_USERNAME": {
+          "description": "set username",
+          "value": "root",
+          "required": false
+      },
+      "CLOUDCMD_PASSWORD": {
+          "description": "set password",
+          "value": "toor",
+          "required": false
+      },
+      "CLOUDCMD_ROOT": {
+          "description": "set root dir",
+          "value": "",
+          "required": false
+      },
+      "CLOUDCMD_VIM": {
+          "description": "enable vim hot keys",
+          "value": "false",
+          "required": false
+      },
+      "CLOUDCMD_COLUMNS": {
+          "description": "set visible columns",
+          "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",
+          "required": false
+      },
+      "CLOUDCMD_CONFIRM_MOVE": {
+          "description": "confirm move",
+          "value": "true",
+          "required": false
+      },
+      "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

@@ -1,12 +0,0 @@
-#!/usr/bin/env node
-
-/* cloudcmd binary
- * usage: node cloudcmd
- */
-(function(){
-    'use strict';
-    
-    require('../cloudcmd');
-    
-})();
-

bin/cloudcmd.mjs

@@ -0,0 +1,365 @@
+#!/usr/bin/env node
+
+import process from 'node:process';
+import {createRequire} from 'node:module';
+import {promisify} from 'node:util';
+import {tryToCatch} from 'try-to-catch';
+import {createSimport} from 'simport';
+import parse from 'yargs-parser';
+import exit from '../server/exit.js';
+import {createConfig, configPath} from '../server/config.mjs';
+import * as env from '../server/env.mjs';
+import prefixer from '../server/prefixer.js';
+import * as validate from '../server/validate.mjs';
+
+process.on('unhandledRejection', exit);
+
+const require = createRequire(import.meta.url);
+
+const Info = require('../package.json');
+const isUndefined = (a) => typeof a === 'undefined';
+const simport = createSimport(import.meta.url);
+
+const choose = (a, b) => {
+    if (isUndefined(a))
+        return b;
+    
+    return a;
+};
+
+const config = createConfig({
+    configPath,
+});
+
+const DIR_SERVER = '../server/';
+
+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',
+        'password',
+        'username',
+        'config',
+        'editor',
+        'packer',
+        'root',
+        'prefix',
+        'prefix-socket',
+        'terminal-path',
+        'terminal-command',
+        'columns',
+        'menu',
+        'theme',
+        'import-url',
+        'import-token',
+        'export-token',
+        'dropbox-token',
+    ],
+    boolean: [
+        'auth',
+        'repl',
+        'save',
+        'server',
+        'online',
+        'open',
+        'config-dialog',
+        'config-auth',
+        'console',
+        'sync-console-path',
+        'contact',
+        'terminal',
+        'terminal-auto-restart',
+        'one-file-panel',
+        'confirm-copy',
+        'confirm-move',
+        '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.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': 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')),
+        'config-auth': choose(env.bool('config_auth'), config('configAuth')),
+        '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')),
+        '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: {
+        version: 'v',
+        help: 'h',
+        password: 'p',
+        online: 'o',
+        username: 'u',
+        save: 's',
+        auth: 'a',
+        config: 'c',
+    },
+};
+
+const {argv} = process;
+const args = parse(argv.slice(2), yargsOptions);
+
+if (args.version)
+    version();
+else if (args.help)
+    help();
+else
+    main();
+
+async function main() {
+    const {validateArgs} = await simport('@putout/cli-validate-args');
+    
+    const error = await validateArgs(args, [
+        ...yargsOptions.boolean,
+        ...yargsOptions.string,
+    ]);
+    
+    if (error)
+        return exit(error);
+    
+    if (args.repl)
+        repl();
+    
+    validate.columns(args.columns);
+    validate.theme(args.theme);
+    
+    port(args.port);
+    
+    config('name', args.name);
+    config('auth', args.auth);
+    config('online', args.online);
+    config('open', args.open);
+    config('username', args.username);
+    config('console', args.console);
+    config('syncConsolePath', args.syncConsolePath);
+    config('showDotFiles', args.showDotFiles);
+    config('showFileName', args.showFileName);
+    config('contact', args.contact);
+    config('terminal', args.terminal);
+    config('terminalPath', args.terminalPath);
+    config('terminalCommand', args.terminalCommand);
+    config('terminalAutoRestart', args.terminalAutoRestart);
+    config('editor', args.editor);
+    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('log', args.log);
+    config('confirmCopy', args.confirmCopy);
+    config('confirmMove', args.confirmMove);
+    config('oneFilePanel', args.oneFilePanel);
+    config('configDialog', args.configDialog);
+    config('configAuth', args.configAuth);
+    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);
+    
+    config('dropbox', args.dropbox);
+    config('dropboxToken', args.dropboxToken);
+    
+    await readConfig(args.config);
+    
+    const options = {
+        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.parse('password') || args.password;
+    
+    if (password)
+        config('password', await getPassword(password));
+    
+    validateRoot(options.root, config);
+    
+    if (args.showConfig)
+        await showConfig();
+    
+    const {distributeImport} = await simport('../server/distribute/import.mjs');
+    const importConfig = promisify(distributeImport);
+    
+    await start(options, config);
+    
+    if (args.save)
+        config.write();
+    
+    await tryToCatch(checkUpdate);
+    await importConfig(config);
+}
+
+function validateRoot(root, config) {
+    validate.root(root, config);
+    
+    if (root === '/')
+        return;
+    
+    console.log(`root: ${root}`);
+}
+
+async function getPassword(password) {
+    const criton = await simport('criton');
+    return criton(password, config('algo'));
+}
+
+function version() {
+    console.log('v' + Info.version);
+}
+
+async function start(options, config) {
+    const SERVER = `${DIR_SERVER}server.mjs`;
+    
+    if (!args.server)
+        return;
+    
+    const server = await simport(SERVER);
+    server(options, config);
+}
+
+function port(arg) {
+    const number = parseInt(arg, 10);
+    
+    if (!isNaN(number))
+        return config('port', number);
+    
+    exit('cloudcmd --port: should be a number');
+}
+
+async function showConfig() {
+    const show = await simport('../server/show-config');
+    const data = show(config('*'));
+    
+    console.log(data);
+}
+
+async function readConfig(name) {
+    if (!name)
+        return;
+    
+    const tryToCatch = await simport('try-to-catch');
+    const forEachKey = await simport('for-each-key');
+    
+    const [error, data] = await tryToCatch(simport, name);
+    
+    if (error)
+        return exit(error.message);
+    
+    forEachKey(config, data);
+}
+
+async function help() {
+    const {default: bin} = await import('../json/help.json', {
+        with: {
+            type: 'json',
+        },
+    });
+    
+    const forEachKey = await simport('for-each-key');
+    const currify = await simport('currify');
+    
+    const usage = 'Usage: cloudcmd [options]';
+    const url = Info.homepage;
+    const log = currify((a, b, c) => console.log(a, b, c));
+    
+    console.log(usage);
+    console.log('Options:');
+    forEachKey(log('  %s %s'), bin);
+    console.log('\nGeneral help using Cloud Commander: <%s>', url);
+}
+
+function repl() {
+    console.log('REPL mode enabled (telnet localhost 1337)');
+    require(`${DIR_SERVER}repl`);
+}
+
+async function checkUpdate() {
+    const load = await simport('package-json');
+    
+    const {version} = await load(Info.name, 'latest');
+    await showUpdateInfo(version);
+}
+
+async function showUpdateInfo(version) {
+    if (version === Info.version)
+        return;
+    
+    const chalk = await simport('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/release.mjs

@@ -0,0 +1,75 @@
+#!/usr/bin/env node
+
+import {promisify} from 'node:util';
+import process from 'node:process';
+import {tryToCatch} from 'try-to-catch';
+import {createSimport} from 'simport';
+import minor from 'minor';
+import _place from 'place';
+import rendy from 'rendy';
+import shortdate from 'shortdate';
+
+const simport = createSimport(import.meta.url);
+const place = promisify(_place);
+
+const Info = await simport('../package.json');
+
+await main();
+
+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)
+        return console.error(error);
+    
+    await replaceVersion('README.md', version, versionNew);
+    await replaceVersion('HELP.md', version, versionNew);
+    
+    const historyNew = history + rendy(template, {
+        date: shortdate(),
+        version: versionNew,
+    });
+    
+    await replaceVersion('HELP.md', history, historyNew);
+}
+
+async function replaceVersion(name, version, versionNew) {
+    const [error] = await tryToCatch(place, name, version, versionNew);
+    
+    if (error)
+        return console.error(error);
+    
+    console.log(`done: ${name}`);
+}
+
+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) || [];
+    
+    console.log(last);
+    
+    if (!regExp.test(last))
+        throw Error('ERROR: version is missing. release --patch|--minor|--major');
+    
+    return getVersionNew(last, match);
+}
+
+function getVersionNew(last, match) {
+    if (match)
+        return minor(match, Info.version);
+    
+    return last.substr(3);
+}

client/client.mjs

@@ -0,0 +1,425 @@
+import process from 'node:process';
+
+/* global DOM */
+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 * as Images from './dom/images.mjs';
+import {unregisterSW} from './sw/register.js';
+import {getJsonFromFileTable} from './get-json-from-file-table.mjs';
+import {Key} from './key/index.mjs';
+import {
+    apiURL,
+    formatMsg,
+    buildFromJSON,
+} from '../common/cloudfunc.mjs';
+import {loadModule} from './load-module.mjs';
+
+const noJS = (a) => a.replace(/.js$/, '');
+
+const isDev = process.env.NODE_ENV === 'development';
+
+inherits(CloudCmdProto, Emitify);
+
+export const createCloudCmd = ({DOM, Listeners}) => {
+    return new CloudCmdProto({
+        DOM,
+        Listeners,
+    });
+};
+
+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, Files} = DOM;
+    
+    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',
+    };
+    
+    this.order = {
+        left: 'asc',
+        right: 'asc',
+    };
+    
+    this.changeDir = async (path, overrides = {}) => {
+        const {
+            isRefresh,
+            panel,
+            history = true,
+            noCurrent,
+            currentName,
+        } = overrides;
+        
+        const refresh = isRefresh;
+        let panelChanged;
+        
+        if (!noCurrent && panel && panel !== Info.panel) {
+            DOM.changePanel();
+            panelChanged = true;
+        }
+        
+        let imgPosition;
+        
+        if (panelChanged || refresh || !history)
+            imgPosition = 'top';
+        
+        Images.show.load(imgPosition, panel);
+        
+        /* загружаем содержимое каталога */
+        await ajaxLoad(addSlashToEnd(path), {
+            refresh,
+            history,
+            noCurrent,
+            currentName,
+            showDotFiles: CloudCmd.config('showDotFiles'),
+        }, panel);
+    };
+    
+    /**
+     * Конструктор CloudClient, который
+     * выполняет весь функционал по
+     * инициализации
+     */
+    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));
+        CloudCmd._config = (key, value) => {
+            /*
+             * should be called from config.js only
+             * after successful update on server
+             */
+            if (key === 'password')
+                return;
+            
+            config[key] = value;
+        };
+        
+        if (config.oneFilePanel)
+            CloudCmd.MIN_ONE_PANEL_WIDTH = Infinity;
+        
+        if (!document.body.scrollIntoViewIfNeeded)
+            await load.js(`${CloudCmd.DIR_MODULES}/polyfill.js`);
+        
+        await initModules();
+        await baseInit();
+        
+        CloudCmd.route(location.hash);
+    };
+    
+    this.route = (path) => {
+        const query = path.split('/');
+        
+        if (!path)
+            return;
+        
+        const [kebabModule] = query;
+        const module = noJS(pascalCase(kebabModule.slice(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 = async () => {
+        const url = CloudCmd.prefix + '/logout';
+        const error = () => document.location.reload();
+        const {prefix} = CloudCmd;
+        
+        await DOM.Storage.clear();
+        unregisterSW(prefix);
+        DOM.load.ajax({
+            url,
+            error,
+        });
+    };
+    
+    const initModules = async () => {
+        CloudCmd.Key = Key;
+        CloudCmd.Key.bind();
+        
+        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,
+            });
+        };
+        
+        if (!modules)
+            return;
+        
+        for (const module of modules.local) {
+            load(null, module, doBefore[module]);
+        }
+    };
+    
+    async function saveCurrentName(currentName) {
+        await Storage.set('current-name', currentName);
+    }
+    
+    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(currentFile, {
+                // when hash is present
+                // it should be handled with this.route
+                // overwre otherwise
+                history: !location.hash,
+            });
+        
+        const dirPath = DOM.getCurrentDirPath();
+        
+        Listeners.init();
+        
+        const panels = getPanels();
+        panels.forEach(Listeners.setOnPanel);
+        
+        Listeners.initKeysPanel();
+        
+        if (!CloudCmd.config('dirStorage'))
+            return;
+        
+        const data = await Storage.get(dirPath);
+        
+        if (!data)
+            await Storage.setJson(dirPath, getJsonFromFileTable());
+    }
+    
+    function getPanels() {
+        const panels = ['left'];
+        
+        if (CloudCmd.config('oneFilePanel'))
+            return panels;
+        
+        return [
+            ...panels,
+            'right',
+        ];
+    }
+    
+    this.execFromModule = async (moduleName, funcName, ...args) => {
+        await CloudCmd[moduleName]();
+        
+        const func = CloudCmd[moduleName][funcName];
+        func(...args);
+    };
+    
+    this.refresh = async (options = {}) => {
+        const {panel = Info.panel, currentName} = options;
+        
+        const path = DOM.getCurrentDirPath(panel);
+        
+        const isRefresh = true;
+        const history = false;
+        const noCurrent = options?.noCurrent;
+        
+        await CloudCmd.changeDir(path, {
+            isRefresh,
+            history,
+            panel,
+            noCurrent,
+            currentName,
+        });
+    };
+    
+    /**
+     * Функция загружает json-данные о Файловой Системе
+     * через ajax-запрос.
+     * @param path - каталог для чтения
+     * @param options
+     * { refresh, history } - необходимость обновить данные о каталоге
+     * @param panel
+     *
+     */
+    async function ajaxLoad(path, options = {}, panel) {
+        const {RESTful} = DOM;
+        
+        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;
+        
+        Storage.setJson(path, newObj);
+    }
+    
+    /**
+     * Функция строит файловую таблицу
+     * @param data - данные о файлах
+     * @param panelParam
+     * @param options - history, noCurrent, showDotFiles
+     */
+    async function createFileTable(data, panelParam, options) {
+        const {
+            history,
+            noCurrent,
+            showDotFiles,
+        } = options;
+        
+        const names = [
+            'file',
+            'path',
+            'link',
+            'pathLink',
+        ];
+        
+        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;
+            
+            if (name === '..' && dir !== '/')
+                current = DOM.getCurrentByName(dir);
+            
+            if (!current)
+                [current] = DOM.getFiles(panel);
+            
+            DOM.setCurrentFile(current, {
+                history,
+            });
+            
+            CloudCmd.emit('active-dir', Info.dirPath);
+        }
+    }
+    
+    this.goToParentDir = async () => {
+        const {
+            dir,
+            dirPath,
+            parentDirPath,
+            panel,
+        } = Info;
+        
+        if (dirPath === parentDirPath)
+            return;
+        
+        const path = parentDirPath;
+        
+        await CloudCmd.changeDir(path);
+        
+        const current = DOM.getCurrentByName(dir);
+        const [first] = DOM.getFiles(panel);
+        
+        DOM.setCurrentFile(current || first, {
+            history,
+        });
+    };
+}

client/cloudcmd.mjs

@@ -0,0 +1,74 @@
+import process from 'node:process';
+import wraptile from 'wraptile';
+import load from 'load.js';
+import '../css/main.css';
+import {registerSW, listenSW} from './sw/register.js';
+import {initSortPanel, sortPanel} from './sort.mjs';
+import Util from '../common/util.js';
+import * as CloudFunc from '../common/cloudfunc.mjs';
+import DOM from './dom/index.js';
+import {createCloudCmd} from './client.mjs';
+import * as Listeners from './listeners/index.js';
+
+const isDev = process.env.NODE_ENV === 'development';
+
+export default init;
+
+globalThis.CloudCmd = init;
+
+async function init(config) {
+    globalThis.CloudCmd = createCloudCmd({
+        DOM,
+        Listeners,
+    });
+    globalThis.DOM = DOM;
+    globalThis.Util = Util;
+    globalThis.CloudFunc = CloudFunc;
+    
+    await register(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');
+        }, 100);
+}
+
+function getPrefix(prefix) {
+    if (!prefix)
+        return '';
+    
+    if (!prefix.indexOf('/'))
+        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.mjs

@@ -0,0 +1,124 @@
+/* global CloudCmd*/
+import tryToPromiseAll from '../../common/try-to-promise-all.js';
+import Storage from './storage.js';
+
+const CLASS = 'cut-file';
+const COPY = 'copy';
+const CUT = 'cut';
+
+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/current-file.mjs

@@ -0,0 +1,310 @@
+/* global DOM */
+/* global CloudCmd */
+import createElement from '@cloudcmd/create-element';
+import {encode, decode} from '../../common/entity.js';
+import {getTitle, FS} from '../../common/cloudfunc.mjs';
+
+let Title;
+
+const CURRENT_FILE = 'current-file';
+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
+ *
+ * @param name
+ * @param current
+ */
+export const setCurrentName = (name, current) => {
+    const Info = DOM.CurrentInfo;
+    const {link} = Info;
+    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', createNameAttribute(name));
+    CloudCmd.emit('current-file', current);
+    
+    return link;
+};
+
+/**
+ * get name from current (or param) file
+ *
+ * @param currentFile
+ */
+export const getCurrentName = (currentFile) => {
+    const current = currentFile || DOM.getCurrentFile();
+    
+    if (!current)
+        return '';
+    
+    return parseNameAttribute(current.getAttribute('data-name'));
+};
+
+/**
+ * Generate a `data-name` attribute for the given filename
+ * @param name The string name to encode
+ */
+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 direcotory path
+ */
+export const getCurrentDirPath = (panel = DOM.getPanel()) => {
+    const path = DOM.getByDataName('js-path', panel);
+    return path.textContent;
+};
+
+/**
+ * get link from current (or param) file
+ *
+ * @param currentFile - current file by default
+ */
+export const getCurrentPath = (currentFile) => {
+    const current = currentFile || DOM.getCurrentFile();
+    const [element] = DOM.getByTag('a', current);
+    const {prefix} = CloudCmd;
+    
+    return parseHrefAttribute(prefix, element.getAttribute('href'));
+};
+
+/**
+ * get current direcotory name
+ */
+export const getCurrentDirName = () => {
+    const href = DOM
+        .getCurrentDirPath()
+        .replace(/\/$/, '');
+    
+    const substr = href.substr(href, href.lastIndexOf('/'));
+    
+    return href.replace(`${substr}/`, '') || '/';
+};
+
+/**
+ * get current direcotory path
+ */
+export const getParentDirPath = (panel) => {
+    const path = DOM.getCurrentDirPath(panel);
+    const dirName = DOM.getCurrentDirName() + '/';
+    const index = path.lastIndexOf(dirName);
+    
+    if (path === '/')
+        return path;
+    
+    return path.slice(0, index);
+};
+
+/**
+ * get not current direcotory path
+ */
+export const getNotCurrentDirPath = () => {
+    const panel = DOM.getPanel({
+        active: false,
+    });
+    
+    return DOM.getCurrentDirPath(panel);
+};
+
+/**
+ * unified way to get current file
+ *
+ * @currentFile
+ */
+export const getCurrentFile = () => {
+    return DOM.getByClass(CURRENT_FILE);
+};
+
+/**
+ * get current file by 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
+ *
+ * @currentFile
+ */
+function unsetCurrentFile(currentFile) {
+    const is = DOM.isCurrentFile(currentFile);
+    
+    if (!is)
+        return;
+    
+    currentFile.classList.remove(CURRENT_FILE);
+}
+
+/**
+ * unified way to set current file
+ */
+export const setCurrentFile = (currentFile, options) => {
+    const o = options;
+    const currentFileWas = DOM.getCurrentFile();
+    
+    if (!currentFile)
+        return DOM;
+    
+    let pathWas = '';
+    
+    if (currentFileWas) {
+        pathWas = DOM.getCurrentDirPath();
+        unsetCurrentFile(currentFileWas);
+    }
+    
+    currentFile.classList.add(CURRENT_FILE);
+    
+    const path = DOM.getCurrentDirPath();
+    const name = CloudCmd.config('name');
+    
+    if (path !== pathWas) {
+        DOM.setTitle(getTitle({
+            name,
+            path,
+        }));
+        
+        /* history could be present
+         * but it should be false
+         * to prevent default behavior
+         */
+        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);
+    CloudCmd.emit('current-path', path);
+    CloudCmd.emit('current-name', DOM.getCurrentName(currentFile));
+    
+    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}
+  */
+export const getCurrentByPosition = ({x, y}) => {
+    const element = document.elementFromPoint(x, y);
+    
+    const getEl = (el) => {
+        const {tagName} = el;
+        const isChild = /A|SPAN|LI/.test(tagName);
+        
+        if (!isChild)
+            return null;
+        
+        if (tagName === 'A')
+            return el.parentElement.parentElement;
+        
+        if (tagName === 'SPAN')
+            return el.parentElement;
+        
+        return el;
+    };
+    
+    const el = getEl(element);
+    
+    if (el && el.tagName !== 'LI')
+        return null;
+    
+    return el;
+};
+
+/**
+ * current file check
+ *
+ * @param currentFile
+ */
+export const isCurrentFile = (currentFile) => {
+    if (!currentFile)
+        return false;
+    
+    return DOM.isContainClass(currentFile, CURRENT_FILE);
+};
+
+/**
+ * set title or create title element
+ *
+ * @param name
+ */
+export const setTitle = (name) => {
+    if (!Title)
+        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.mjs

@@ -0,0 +1,307 @@
+import {test, stub} from 'supertape';
+import {create} from 'auto-globals';
+import wraptile from 'wraptile';
+import * as currentFile from './current-file.mjs';
+
+const id = (a) => a;
+
+const returns = wraptile(id);
+const {_CURRENT_FILE} = currentFile;
+
+test('current-file: setCurrentName: setAttribute', (t) => {
+    const {DOM, CloudCmd} = globalThis;
+    
+    globalThis.DOM = getDOM();
+    globalThis.CloudCmd = getCloudCmd();
+    
+    const current = create();
+    const {setAttribute} = current;
+    
+    currentFile.setCurrentName('hello', current);
+    
+    t.calledWith(setAttribute, ['data-name', 'js-file-aGVsbG8='], 'should call setAttribute');
+    
+    globalThis.DOM = DOM;
+    globalThis.CloudCmd = CloudCmd;
+    
+    t.end();
+});
+
+test('current-file: setCurrentName: setAttribute: cyrillic', (t) => {
+    const {DOM, CloudCmd} = globalThis;
+    
+    globalThis.DOM = getDOM();
+    globalThis.CloudCmd = getCloudCmd();
+    
+    const current = create();
+    const {setAttribute} = current;
+    
+    currentFile.setCurrentName('ай', current);
+    
+    t.calledWith(setAttribute, ['data-name', 'js-file-JUQwJUIwJUQwJUI5'], 'should call setAttribute');
+    
+    globalThis.DOM = DOM;
+    globalThis.CloudCmd = CloudCmd;
+    
+    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} = globalThis;
+    
+    const emit = stub();
+    
+    globalThis.DOM = getDOM();
+    globalThis.CloudCmd = getCloudCmd({
+        emit,
+    });
+    
+    const current = create();
+    
+    currentFile.setCurrentName('hello', current);
+    
+    t.calledWith(emit, ['current-file', current], 'should call emit');
+    
+    globalThis.DOM = DOM;
+    globalThis.CloudCmd = CloudCmd;
+    
+    t.end();
+});
+
+test('current-file: setCurrentName: return', (t) => {
+    const {DOM, CloudCmd} = globalThis;
+    
+    const link = {};
+    
+    globalThis.DOM = getDOM({
+        link,
+    });
+    
+    globalThis.CloudCmd = getCloudCmd();
+    
+    const current = create();
+    
+    const result = currentFile.setCurrentName('hello', current);
+    
+    t.equal(result, link, 'should return link');
+    
+    globalThis.DOM = DOM;
+    globalThis.CloudCmd = CloudCmd;
+    
+    t.end();
+});
+
+test('current-file: getParentDirPath: result', (t) => {
+    const {DOM} = globalThis;
+    
+    const getCurrentDirPath = returns('/D/Films/+++favorite films/');
+    const getCurrentDirName = returns('+++favorite films');
+    
+    globalThis.DOM = getDOM({
+        getCurrentDirPath,
+        getCurrentDirName,
+    });
+    
+    const result = currentFile.getParentDirPath();
+    const expected = '/D/Films/';
+    
+    globalThis.DOM = DOM;
+    
+    t.equal(result, expected, 'should return parent dir path');
+    t.end();
+});
+
+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();
+});
+
+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

@@ -0,0 +1,26 @@
+'use strict';
+
+const {tryToCatch} = require('try-to-catch');
+
+const {
+    alert,
+    prompt,
+    confirm,
+    progress,
+} = require('smalltalk');
+
+const title = 'Cloud Commander';
+
+module.exports.alert = (...a) => alert(title, ...a, {
+    cancel: false,
+});
+
+module.exports.prompt = (...a) => tryToCatch(prompt, title, ...a);
+module.exports.confirm = (...a) => tryToCatch(confirm, title, ...a);
+module.exports.progress = (...a) => progress(title, ...a);
+
+module.exports.alert.noFiles = () => {
+    return alert(title, 'No files selected!', {
+        cancel: false,
+    });
+};

client/dom/directory.js

@@ -0,0 +1,70 @@
+'use strict';
+
+/* global CloudCmd */
+const philip = require('philip');
+
+const Images = require('./images.mjs');
+const {FS} = require('../../common/cloudfunc.mjs');
+const DOM = require('.');
+const Dialog = require('./dialog');
+
+const {getCurrentDirPath: getPathWhenRootEmpty} = DOM;
+
+module.exports = (items) => {
+    if (items.length)
+        Images.show('top');
+    
+    const entries = Array
+        .from(items)
+        .map((item) => item.webkitGetAsEntry());
+    
+    const dirPath = getPathWhenRootEmpty();
+    const path = dirPath.replace(/\/$/, '');
+    
+    const progress = Dialog.progress('Uploading...');
+    
+    progress.catch(() => {
+        Dialog.alert('Upload aborted');
+        uploader.abort();
+    });
+    
+    const uploader = philip(entries, (type, name, data, i, n, callback) => {
+        const {prefixURL} = CloudCmd;
+        const full = prefixURL + FS + path + name;
+        
+        let upload;
+        switch(type) {
+        case 'file':
+            upload = uploadFile(full, data);
+            break;
+        
+        case 'directory':
+            upload = uploadDir(full);
+            break;
+        }
+        
+        upload.on('end', callback);
+        
+        upload.on('progress', (count) => {
+            const current = percent(i, n);
+            const next = percent(i + 1, n);
+            const max = next - current;
+            const value = current + percent(count, 100, max);
+            
+            progress.setProgress(value);
+        });
+    });
+    
+    uploader.on('error', (error) => {
+        Dialog.alert(error);
+        uploader.abort();
+    });
+    
+    uploader.on('end', CloudCmd.refresh);
+};
+
+const percent = (i, n, per = 100) => Math.round(i * per / n);
+
+const uploadFile = (url, data) => DOM.load.put(url, data);
+
+const uploadDir = (url) => DOM.load.put(`${url}?dir`);

client/dom/dom-tree.js

@@ -0,0 +1,83 @@
+'use strict';
+
+const currify = require('currify');
+
+const DOM = module.exports;
+
+/**
+ * check class of element
+ *
+ * @param element
+ * @param className
+ */
+const isContainClass = (element, className) => {
+    if (!element)
+        throw Error('element could not be empty!');
+    
+    if (!className)
+        throw Error('className could not be empty!');
+    
+    if (Array.isArray(className))
+        return className.some(currify(
+            isContainClass,
+            element,
+        ));
+    
+    const {classList} = element;
+    
+    return classList.contains(className);
+};
+
+module.exports.isContainClass = isContainClass;
+/**
+ * Function search element by tag
+ * @param tag - className
+ * @param element - element
+ */
+module.exports.getByTag = (tag, element = document) => {
+    return element.getElementsByTagName(tag);
+};
+
+/**
+ * Function search element by id
+ * @param Id - id
+ */
+module.exports.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) => DOM.getByClassAll(className, element)[0];
+
+module.exports.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
+ */
+module.exports.getByClassAll = (className, element) => {
+    return (element || document).getElementsByClassName(className);
+};
+
+/**
+ * add class=hidden to element
+ *
+ * @param element
+ */
+module.exports.hide = (element) => {
+    element.classList.add('hidden');
+    return DOM;
+};
+
+module.exports.show = (element) => {
+    element.classList.remove('hidden');
+    return DOM;
+};

client/dom/dom-tree.spec.js

@@ -0,0 +1,43 @@
+'use strict';
+
+const test = require('supertape');
+const {create} = require('auto-globals');
+const {tryCatch} = require('try-catch');
+
+const {isContainClass} = require('./dom-tree');
+
+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();
+});

client/dom/events/event-store.js

@@ -0,0 +1,17 @@
+'use strict';
+
+let list = [];
+
+module.exports.add = (el, name, fn) => {
+    list.push([
+        el,
+        name,
+        fn,
+    ]);
+};
+
+module.exports.clear = () => {
+    list = [];
+};
+
+module.exports.get = () => list;

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

@@ -0,0 +1,39 @@
+'use strict';
+
+const test = require('supertape');
+const eventStore = require('./event-store');
+
+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.mjs

@@ -0,0 +1,203 @@
+import itype from 'itype';
+import 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

@@ -0,0 +1,139 @@
+'use strict';
+
+/* global CloudCmd */
+const itype = require('itype');
+const {promisify} = require('es6-promisify');
+
+const load = require('./load');
+const RESTful = require('./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_JSON = '/json/';
+const timeout = getTimeoutOnce(2000);
+
+module.exports.get = getFile;
+
+function getFile(name) {
+    const type = itype(name);
+    check(name);
+    
+    if (type === 'string')
+        return getModule(name);
+    
+    if (type === 'array')
+        return Promise.all(name.map(getFile));
+}
+
+function check(name) {
+    if (!name)
+        throw Error('name could not be empty!');
+}
+
+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)
+        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 = 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 += '.hbs';
+    } else if (isJSON) {
+        path = DIR_JSON + name + '.json';
+    }
+    
+    return path;
+}
+
+function showError(name) {
+    const str = `Wrong file name: ${name}`;
+    const error = Error(str);
+    
+    throw error;
+}
+
+const getSystemFile = promisify((file, callback) => {
+    const {prefix} = CloudCmd;
+    
+    if (!Promises[file])
+        Promises[file] = new Promise((success, error) => {
+            const url = prefix + file;
+            
+            load.ajax({
+                url,
+                success,
+                error,
+            });
+        });
+    
+    Promises[file].then((data) => {
+        callback(null, data);
+    }, (error) => {
+        Promises[file] = null;
+        callback(error);
+    });
+});
+
+const getConfig = async () => {
+    let is;
+    
+    if (!Promises.config)
+        Promises.config = () => {
+            is = true;
+            return RESTful.Config.read();
+        };
+    
+    const [, data] = await Promises.config();
+    
+    if (data)
+        is = false;
+    
+    timeout(() => {
+        if (!is)
+            Promises.config = null;
+    });
+    
+    return data;
+};
+
+function getTimeoutOnce(time) {
+    let is;
+    
+    return (callback) => {
+        if (is)
+            return;
+        
+        is = true;
+        
+        setTimeout(() => {
+            is = false;
+            callback();
+        }, time);
+    };
+}

client/dom/images.mjs

@@ -0,0 +1,149 @@
+/* global DOM */
+import createElement from '@cloudcmd/create-element';
+
+const LOADING = 'loading';
+const HIDDEN = 'hidden';
+const ERROR = 'error';
+
+const getLoadingType = () => isSVG() ? '-svg' : '-gif';
+
+export const get = getElement;
+
+/**
+ * check SVG SMIL animation support
+ */
+function isSVG() {
+    const createNS = document.createElementNS;
+    const SVG_URL = 'http://www.w3.org/2000/svg';
+    
+    if (!createNS)
+        return false;
+    
+    const create = createNS.bind(document);
+    const svgNode = create(SVG_URL, 'animate');
+    const name = svgNode.toString();
+    
+    return /SVGAnimate/.test(name);
+}
+
+function getElement() {
+    return createElement('span', {
+        id: 'js-status-image',
+        className: 'icon',
+        dataName: 'progress',
+        notAppend: true,
+    });
+}
+
+/* Функция создаёт картинку загрузки */
+export const loading = () => {
+    const element = getElement();
+    const {classList} = element;
+    const loadingImage = LOADING + getLoadingType();
+    
+    classList.add(LOADING, loadingImage);
+    classList.remove(ERROR, HIDDEN);
+    
+    return element;
+};
+
+/* Функция создаёт картинку ошибки загрузки */
+export const error = () => {
+    const element = getElement();
+    const {classList} = element;
+    const loadingImage = LOADING + getLoadingType();
+    
+    classList.add(ERROR);
+    classList.remove(HIDDEN, LOADING, loadingImage);
+    
+    return element;
+};
+
+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};
+*/
+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 {
+        current = DOM.getCurrentFile();
+        
+        if (current)
+            current = DOM.getByDataName('js-name', current);
+        else
+            current = refreshButton.parentElement;
+    }
+    
+    if (!parent || parent && parent !== current)
+        current.appendChild(image);
+    
+    DOM.show(image);
+    
+    return image;
+}
+
+/**
+* hide load image
+*/
+export const hide = () => {
+    const element = Images.get();
+    
+    DOM.hide(element);
+    
+    return Images;
+};
+
+export const setProgress = (value, title) => {
+    const DATA = 'data-progress';
+    const element = Images.get();
+    
+    if (!element)
+        return Images;
+    
+    element.setAttribute(DATA, `${value}%`);
+    
+    if (title)
+        element.title = title;
+    
+    return Images;
+};
+
+export const clearProgress = () => {
+    const DATA = 'data-progress';
+    const element = Images.get();
+    
+    if (!element)
+        return Images;
+    
+    element.setAttribute(DATA, '');
+    element.title = '';
+    
+    return Images;
+};
+
+const Images = {
+    clearProgress,
+    setProgress,
+    show,
+    hide,
+    get,
+    error,
+    loading,
+};

client/dom/index.js

@@ -0,0 +1,840 @@
+'use strict';
+
+/* global CloudCmd */
+const Util = require('../../common/util');
+
+const Images = require('./images.mjs');
+const RESTful = require('./rest');
+const Storage = require('./storage');
+const renameCurrent = require('./operations/rename-current');
+
+const CurrentFile = require('./current-file.mjs');
+const DOMTree = require('./dom-tree');
+
+const Cmd = module.exports;
+const DOM = {
+    ...DOMTree,
+    ...CurrentFile,
+    ...Cmd,
+};
+
+const CurrentInfo = {};
+
+DOM.Images = Images;
+DOM.load = require('./load');
+DOM.Files = require('./files');
+DOM.RESTful = RESTful;
+DOM.IO = require('./io');
+DOM.Storage = Storage;
+DOM.Dialog = require('./dialog');
+DOM.CurrentInfo = CurrentInfo;
+
+module.exports = DOM;
+
+DOM.uploadDirectory = require('./directory');
+DOM.Buffer = require('./buffer.mjs');
+DOM.Events = require('#dom/events');
+
+const loadRemote = require('./load-remote');
+const selectByPattern = require('./select-by-pattern');
+const isString = (a) => typeof a === 'string';
+const SELECTED_FILE = 'selected-file';
+
+const TabPanel = {
+    'js-left': null,
+    'js-right': null,
+};
+
+module.exports.loadRemote = (name, options, callback) => {
+    loadRemote(name, options, callback);
+    return DOM;
+};
+
+module.exports.loadSocket = (callback) => {
+    DOM.loadRemote('socket', {
+        name: 'io',
+    }, callback);
+    
+    return DOM;
+};
+
+/**
+ * create new folder
+ *
+ */
+module.exports.promptNewDir = async function() {
+    await promptNew('directory');
+};
+
+/**
+ * create new file
+ *
+ * @typeName
+ * @type
+ */
+module.exports.promptNewFile = async () => {
+    await promptNew('file');
+};
+
+async function promptNew(typeName) {
+    const {Dialog} = DOM;
+    const dir = DOM.getCurrentDirPath();
+    const msg = `New ${typeName}` || 'File';
+    
+    const getName = () => {
+        const name = DOM.getCurrentName();
+        
+        if (name === '..')
+            return '';
+        
+        return name;
+    };
+    
+    const name = getName();
+    const [cancel, currentName] = await Dialog.prompt(msg, name);
+    
+    if (cancel)
+        return;
+    
+    const path = `${dir}${currentName}`;
+    
+    if (typeName === 'directory')
+        await RESTful.createDirectory(path);
+    else
+        await RESTful.write(path);
+    
+    await CloudCmd.refresh({
+        currentName,
+    });
+}
+
+/**
+ * get current direcotory name
+ */
+module.exports.getCurrentDirName = () => {
+    const href = DOM
+        .getCurrentDirPath()
+        .replace(/\/$/, '');
+    
+    const substr = href.substr(href, href.lastIndexOf('/'));
+    
+    return href.replace(`${substr}/`, '') || '/';
+};
+
+/**
+ * get current direcotory path
+ */
+module.exports.getParentDirPath = (panel) => {
+    const path = DOM.getCurrentDirPath(panel);
+    const dirName = DOM.getCurrentDirName() + '/';
+    const index = path.lastIndexOf(dirName);
+    
+    if (path !== '/')
+        return path.slice(0, index);
+    
+    return path;
+};
+
+/**
+ * get not current direcotory path
+ */
+module.exports.getNotCurrentDirPath = () => {
+    const panel = DOM.getPanel({
+        active: false,
+    });
+    
+    return DOM.getCurrentDirPath(panel);
+};
+
+/**
+ * unified way to get selected files
+ *
+ * @currentFile
+ */
+module.exports.getSelectedFiles = () => {
+    const panel = DOM.getPanel();
+    const selected = DOM.getByClassAll(SELECTED_FILE, panel);
+    
+    return Array.from(selected);
+};
+
+/*
+ * unselect all files
+ */
+module.exports.unselectFiles = (files) => {
+    files = files || DOM.getSelectedFiles();
+    
+    Array
+        .from(files)
+        .forEach(DOM.toggleSelectedFile);
+};
+
+/**
+ * get all selected files or current when none selected
+ *
+ * @currentFile
+ */
+module.exports.getActiveFiles = () => {
+    const current = DOM.getCurrentFile();
+    const files = DOM.getSelectedFiles();
+    const name = DOM.getCurrentName(current);
+    
+    if (!files.length && name !== '..')
+        return [current];
+    
+    return files;
+};
+
+module.exports.getCurrentDate = (currentFile) => {
+    const current = currentFile || DOM.getCurrentFile();
+    
+    return DOM.getByDataName('js-date', current).textContent;
+};
+
+/**
+ * get size
+ * @currentFile
+ */
+module.exports.getCurrentSize = (currentFile) => {
+    const current = currentFile || DOM.getCurrentFile();
+    
+    /* если это папка - возвращаем слово dir вместо размера*/
+    const size = DOM
+        .getByDataName('js-size', current)
+        .textContent
+        .replace(/^<|>$/g, '');
+    
+    return size;
+};
+
+/**
+ * get size
+ * @currentFile
+ */
+module.exports.loadCurrentSize = async (currentFile) => {
+    const current = currentFile || DOM.getCurrentFile();
+    const query = '?size';
+    const link = DOM.getCurrentPath(current);
+    
+    Images.show.load();
+    
+    if (name === '..')
+        return;
+    
+    const [, size] = await RESTful.read(link + query);
+    
+    DOM.setCurrentSize(size, current);
+    Images.hide();
+    
+    return current;
+};
+
+/**
+ * load hash
+ * @callback
+ * @currentFile
+ */
+module.exports.loadCurrentHash = async (currentFile) => {
+    const current = currentFile || DOM.getCurrentFile();
+    const query = '?hash';
+    const link = DOM.getCurrentPath(current);
+    
+    const [, data] = await RESTful.read(link + query);
+    
+    return data;
+};
+
+/**
+ * set size
+ * @currentFile
+ */
+module.exports.setCurrentSize = (size, currentFile) => {
+    const current = currentFile || DOM.getCurrentFile();
+    const sizeElement = DOM.getByDataName('js-size', current);
+    
+    sizeElement.textContent = size;
+};
+
+/**
+ * @currentFile
+ */
+module.exports.getCurrentMode = (currentFile) => {
+    const current = currentFile || DOM.getCurrentFile();
+    const mode = DOM.getByDataName('js-mode', current);
+    
+    return mode.textContent;
+};
+
+/**
+ * @currentFile
+ */
+module.exports.getCurrentOwner = (currentFile) => {
+    const current = currentFile || DOM.getCurrentFile();
+    const owner = DOM.getByDataName('js-owner', current);
+    
+    return owner.textContent;
+};
+
+/**
+ * unified way to get current file content
+ *
+ * @param currentFile
+ */
+module.exports.getCurrentData = async (currentFile) => {
+    const {Dialog} = DOM;
+    const Info = DOM.CurrentInfo;
+    const current = currentFile || DOM.getCurrentFile();
+    const path = DOM.getCurrentPath(current);
+    const isDir = DOM.isCurrentIsDir(current);
+    
+    if (Info.name === '..') {
+        Dialog.alert.noFiles();
+        return [
+            Error('No Files'),
+        ];
+    }
+    
+    if (isDir)
+        return await RESTful.read(path);
+    
+    const [hashNew, hash] = await DOM.checkStorageHash(path);
+    
+    if (!hashNew)
+        return [
+            Error(`Can't get hash of a file`),
+        ];
+    
+    if (hash === hashNew)
+        return [null, await Storage.get(`${path}-data`)];
+    
+    const [e, data] = await RESTful.read(path);
+    
+    if (e)
+        return [
+            e,
+            null,
+        ];
+    
+    const ONE_MEGABYTE = 1024 ** 2 * 1024;
+    const {length} = data;
+    
+    if (hash && length < ONE_MEGABYTE)
+        await DOM.saveDataToStorage(path, data, hashNew);
+    
+    return [null, data];
+};
+
+/**
+ * unified way to get RefreshButton
+ */
+module.exports.getRefreshButton = (panel = DOM.getPanel()) => {
+    return DOM.getByDataName('js-refresh', panel);
+};
+
+/**
+ * select current file
+ * @param currentFile
+ */
+module.exports.selectFile = (currentFile) => {
+    const current = currentFile || DOM.getCurrentFile();
+    
+    current.classList.add(SELECTED_FILE);
+    
+    return Cmd;
+};
+
+module.exports.unselectFile = (currentFile) => {
+    const current = currentFile || DOM.getCurrentFile();
+    
+    current.classList.remove(SELECTED_FILE);
+    
+    return Cmd;
+};
+
+module.exports.toggleSelectedFile = (currentFile) => {
+    const current = currentFile || DOM.getCurrentFile();
+    const name = DOM.getCurrentName(current);
+    
+    if (name === '..')
+        return Cmd;
+    
+    current.classList.toggle(SELECTED_FILE);
+    
+    return Cmd;
+};
+
+module.exports.toggleAllSelectedFiles = () => {
+    DOM
+        .getAllFiles()
+        .map(DOM.toggleSelectedFile);
+    
+    return Cmd;
+};
+
+module.exports.selectAllFiles = () => {
+    DOM
+        .getAllFiles()
+        .map(DOM.selectFile);
+    
+    return Cmd;
+};
+
+module.exports.getAllFiles = () => {
+    const panel = DOM.getPanel();
+    const files = DOM.getFiles(panel);
+    const name = DOM.getCurrentName(files[0]);
+    
+    const from = (a) => a === '..' ? 1 : 0;
+    const i = from(name);
+    
+    return Array
+        .from(files)
+        .slice(i);
+};
+
+/**
+ * open dialog with expand selection
+ */
+module.exports.expandSelection = () => {
+    const msg = 'expand';
+    const {files} = CurrentInfo;
+    
+    selectByPattern(msg, files);
+};
+
+/**
+ * open dialog with shrink selection
+ */
+module.exports.shrinkSelection = () => {
+    const msg = 'shrink';
+    const {files} = CurrentInfo;
+    
+    selectByPattern(msg, files);
+};
+
+/**
+ * setting history wrapper
+ */
+module.exports.setHistory = (data, title, url) => {
+    const ret = globalThis.history;
+    const {prefix} = CloudCmd;
+    
+    url = prefix + url;
+    
+    if (ret)
+        history.pushState(data, title, url);
+    
+    return ret;
+};
+
+/**
+ * selected file check
+ *
+ * @param currentFile
+ */
+module.exports.isSelected = (selected) => {
+    if (!selected)
+        return false;
+    
+    return DOM.isContainClass(selected, SELECTED_FILE);
+};
+
+/**
+ * get link from current (or param) file
+ *
+ * @param currentFile - current file by default
+ */
+module.exports.getCurrentLink = (currentFile) => {
+    const current = currentFile || DOM.getCurrentFile();
+    const link = DOM.getByTag('a', current);
+    
+    return link[0];
+};
+
+module.exports.getFilenames = (files) => {
+    if (!files)
+        throw Error('AllFiles could not be empty');
+    
+    const first = files[0] || DOM.getCurrentFile();
+    const name = DOM.getCurrentName(first);
+    
+    const allFiles = Array.from(files);
+    
+    if (name === '..')
+        allFiles.shift();
+    
+    const names = allFiles.map((current) => {
+        return DOM.getCurrentName(current);
+    });
+    
+    return names;
+};
+
+/**
+ * check storage hash
+ */
+module.exports.checkStorageHash = async (name) => {
+    const nameHash = `${name}-hash`;
+    
+    if (!isString(name))
+        throw Error('name should be a string!');
+    
+    const [loadHash, storeHash] = await Promise.all([
+        DOM.loadCurrentHash(),
+        Storage.get(nameHash),
+    ]);
+    
+    return [loadHash, storeHash];
+};
+
+/**
+ * save data to storage
+ *
+ * @param name
+ * @param data
+ * @param hash
+ * @param callback
+ */
+module.exports.saveDataToStorage = async (name, data, hash) => {
+    const isDir = DOM.isCurrentIsDir();
+    
+    if (isDir)
+        return;
+    
+    hash = hash || await DOM.loadCurrentHash();
+    
+    const nameHash = `${name}-hash`;
+    const nameData = `${name}-data`;
+    
+    await Storage.set(nameHash, hash);
+    await Storage.set(nameData, data);
+    
+    return hash;
+};
+
+module.exports.getFM = () => DOM.getPanel().parentElement;
+
+module.exports.getPanelPosition = (panel) => {
+    panel = panel || DOM.getPanel();
+    
+    return panel.dataset.name.replace('js-', '');
+};
+
+module.exports.getCSSVar = (name, {body = document.body} = {}) => {
+    const bodyStyle = getComputedStyle(body);
+    return bodyStyle.getPropertyValue(`--${name}`);
+};
+
+/** function getting panel active, or passive
+ * @param options = {active: true}
+ */
+module.exports.getPanel = (options) => {
+    let files;
+    let panel;
+    let isLeft;
+    let dataName = 'js-';
+    
+    const current = DOM.getCurrentFile();
+    
+    if (!current) {
+        panel = DOM.getByDataName('js-left');
+    } else {
+        files = current.parentElement;
+        panel = files.parentElement;
+        isLeft = panel.getAttribute('data-name') === 'js-left';
+    }
+    
+    /* if {active : false} getting passive panel */
+    if (options && !options.active) {
+        dataName += isLeft ? 'right' : 'left';
+        panel = DOM.getByDataName(dataName);
+    }
+    
+    /* if two panels showed
+     * then always work with passive
+     * panel
+     */
+    if (globalThis.innerWidth < CloudCmd.MIN_ONE_PANEL_WIDTH)
+        panel = DOM.getByDataName('js-left');
+    
+    if (!panel)
+        throw Error('can not find Active Panel!');
+    
+    return panel;
+};
+
+module.exports.getFiles = (element) => {
+    const files = DOM.getByDataName('js-files', element);
+    return files.children || [];
+};
+
+/**
+ * shows panel right or left (or active)
+ */
+module.exports.showPanel = (active) => {
+    const panel = DOM.getPanel({
+        active,
+    });
+    
+    if (!panel)
+        return false;
+    
+    DOM.show(panel);
+    
+    return true;
+};
+
+/**
+ * hides panel right or left (or active)
+ */
+module.exports.hidePanel = (active) => {
+    const panel = DOM.getPanel({
+        active,
+    });
+    
+    if (!panel)
+        return false;
+    
+    return DOM.hide(panel);
+};
+
+/**
+ * remove child of element
+ * @param pChild
+ * @param element
+ */
+module.exports.remove = (child, element) => {
+    const parent = element || document.body;
+    
+    parent.removeChild(child);
+    
+    return DOM;
+};
+
+/**
+ * remove current file from file table
+ * @param current
+ *
+ */
+module.exports.deleteCurrent = (current) => {
+    if (!current)
+        DOM.getCurrentFile();
+    
+    const parent = current?.parentElement;
+    const name = DOM.getCurrentName(current);
+    
+    if (current && name !== '..') {
+        const next = current.nextSibling;
+        const prev = current.previousSibling;
+        
+        DOM.setCurrentFile(next || prev);
+        parent.removeChild(current);
+    }
+};
+
+/**
+ * remove selected files from file table
+ * @Selected
+ */
+module.exports.deleteSelected = (selected) => {
+    selected = selected || DOM.getSelectedFiles();
+    
+    if (!selected)
+        return;
+    
+    selected.map(DOM.deleteCurrent);
+};
+
+/**
+ * rename current file
+ *
+ * @currentFile
+ */
+module.exports.renameCurrent = renameCurrent;
+/**
+ * unified way to scrollIntoViewIfNeeded
+ * (native suporte by webkit only)
+ * @param element
+ * @param center - to scroll as small as possible param should be false
+ */
+module.exports.scrollIntoViewIfNeeded = (element, center = false) => {
+    if (!element || !element.scrollIntoViewIfNeeded)
+        return;
+    
+    element.scrollIntoViewIfNeeded(center);
+};
+
+/* scroll on one page */
+module.exports.scrollByPages = (element, pPages) => {
+    const ret = element?.scrollByPages && pPages;
+    
+    if (ret)
+        element.scrollByPages(pPages);
+    
+    return ret;
+};
+
+module.exports.changePanel = () => {
+    const Info = CurrentInfo;
+    let panel = DOM.getPanel();
+    
+    CloudCmd.emit('passive-dir', Info.dirPath);
+    
+    const panelPassive = DOM.getPanel({
+        active: false,
+    });
+    
+    let name = DOM.getCurrentName();
+    const filesPassive = DOM.getFiles(panelPassive);
+    
+    let dataName = panel.getAttribute('data-name');
+    
+    TabPanel[dataName] = name;
+    
+    panel = panelPassive;
+    dataName = panel.getAttribute('data-name');
+    
+    name = TabPanel[dataName];
+    
+    let files;
+    let current;
+    
+    if (name) {
+        current = DOM.getCurrentByName(name, panel);
+        
+        if (current)
+            files = current.parentElement;
+    }
+    
+    if (!files || !files.parentElement) {
+        current = DOM.getCurrentByName(name, panel);
+        
+        if (!current)
+            [current] = filesPassive;
+    }
+    
+    DOM.setCurrentFile(current, {
+        history: true,
+    });
+    
+    CloudCmd.emit('active-dir', Info.dirPath);
+    
+    return DOM;
+};
+
+module.exports.getPackerExt = (type) => {
+    if (type === 'zip')
+        return '.zip';
+    
+    return '.tar.gz';
+};
+
+module.exports.goToDirectory = async (overrides = {}) => {
+    const {Dialog} = DOM;
+    const {prompt = Dialog.prompt, changeDir = CloudCmd.changeDir} = overrides;
+    
+    const msg = 'Go to directory:';
+    const {dirPath} = CurrentInfo;
+    
+    const [cancel, path = dirPath] = await prompt(msg, dirPath);
+    
+    if (cancel)
+        return;
+    
+    await changeDir(path);
+};
+
+module.exports.duplicatePanel = async () => {
+    const Info = CurrentInfo;
+    const {isDir} = Info;
+    const panel = Info.panelPassive;
+    const noCurrent = !Info.isOnePanel;
+    
+    const getPath = (isDir) => {
+        if (isDir)
+            return Info.path;
+        
+        return Info.dirPath;
+    };
+    
+    const path = getPath(isDir);
+    
+    await CloudCmd.changeDir(path, {
+        panel,
+        noCurrent,
+    });
+};
+
+module.exports.swapPanels = async () => {
+    const Info = CurrentInfo;
+    const {
+        panel,
+        files,
+        element,
+        panelPassive,
+    } = Info;
+    
+    const path = DOM.getCurrentDirPath();
+    const dirPathPassive = DOM.getNotCurrentDirPath();
+    
+    let currentIndex = files.indexOf(element);
+    
+    await CloudCmd.changeDir(path, {
+        panel: panelPassive,
+        noCurrent: true,
+    });
+    
+    await CloudCmd.changeDir(dirPathPassive, {
+        panel,
+    });
+    
+    const length = Info.files.length - 1;
+    
+    if (currentIndex > length)
+        currentIndex = length;
+    
+    const el = Info.files[currentIndex];
+    
+    DOM.setCurrentFile(el);
+};
+
+module.exports.CurrentInfo = CurrentInfo;
+
+module.exports.updateCurrentInfo = (currentFile) => {
+    const info = DOM.CurrentInfo;
+    const current = currentFile || DOM.getCurrentFile();
+    const files = current.parentElement;
+    
+    const panelPassive = DOM.getPanel({
+        active: false,
+    });
+    
+    const filesPassive = DOM.getFiles(panelPassive);
+    const name = DOM.getCurrentName(current);
+    
+    info.dir = DOM.getCurrentDirName();
+    info.dirPath = DOM.getCurrentDirPath();
+    info.parentDirPath = DOM.getParentDirPath();
+    info.element = current;
+    info.ext = Util.getExt(name);
+    info.files = Array.from(files.children);
+    info.filesPassive = Array.from(filesPassive);
+    info.first = files.firstChild;
+    info.getData = DOM.getCurrentData;
+    info.last = files.lastChild;
+    info.link = DOM.getCurrentLink(current);
+    info.mode = DOM.getCurrentMode(current);
+    info.name = name;
+    info.path = DOM.getCurrentPath(current);
+    info.panel = files.parentElement || DOM.getPanel();
+    info.panelPassive = panelPassive;
+    info.size = DOM.getCurrentSize(current);
+    info.isDir = DOM.isCurrentIsDir();
+    info.isSelected = DOM.isSelected(current);
+    info.panelPosition = DOM
+        .getPanel()
+        .dataset
+        .name
+        .replace('js-', '');
+    info.isOnePanel = info.panel.getAttribute('data-name') === info.panelPassive.getAttribute('data-name');
+};

client/dom/index.spec.js

@@ -0,0 +1,56 @@
+'use strict';
+
+require('css-modules-require-hook/preset');
+
+const {test, stub} = require('supertape');
+const {getCSSVar, goToDirectory} = require('./index');
+
+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,155 @@
+'use strict';
+
+const {FS} = require('../../../common/cloudfunc.mjs');
+const _sendRequest = require('./send-request');
+
+const imgPosition = {
+    top: true,
+};
+
+module.exports.delete = async (url, data) => {
+    return await _sendRequest({
+        method: 'DELETE',
+        url: FS + url,
+        data,
+        imgPosition: {
+            top: Boolean(data),
+        },
+    });
+};
+
+module.exports.patch = async (url, data) => {
+    return await _sendRequest({
+        method: 'PATCH',
+        url: FS + url,
+        data,
+        imgPosition,
+    });
+};
+
+module.exports.write = async (url, data) => {
+    return await _sendRequest({
+        method: 'PUT',
+        url: FS + url,
+        data,
+        imgPosition,
+    });
+};
+
+module.exports.createDirectory = async (url, overrides = {}) => {
+    const {
+        sendRequest = _sendRequest,
+    } = overrides;
+    
+    return await sendRequest({
+        method: 'PUT',
+        url: `${FS}${url}?dir`,
+        imgPosition,
+    });
+};
+
+module.exports.read = async (url, dataType = 'text') => {
+    const notLog = !url.includes('?');
+    
+    return await _sendRequest({
+        method: 'GET',
+        url: FS + url,
+        notLog,
+        dataType,
+    });
+};
+
+module.exports.copy = async (from, to, names) => {
+    return await _sendRequest({
+        method: 'PUT',
+        url: '/copy',
+        data: {
+            from,
+            to,
+            names,
+        },
+        imgPosition,
+    });
+};
+
+module.exports.pack = async (data) => {
+    return await _sendRequest({
+        method: 'PUT',
+        url: '/pack',
+        data,
+    });
+};
+
+module.exports.extract = async (data) => {
+    return await _sendRequest({
+        method: 'PUT',
+        url: '/extract',
+        data,
+    });
+};
+
+module.exports.move = async (from, to, names) => {
+    return await _sendRequest({
+        method: 'PUT',
+        url: '/move',
+        data: {
+            from,
+            to,
+            names,
+        },
+        imgPosition,
+    });
+};
+
+module.exports.rename = async (from, to) => {
+    return await _sendRequest({
+        method: 'PUT',
+        url: '/rename',
+        data: {
+            from,
+            to,
+        },
+        imgPosition,
+    });
+};
+
+module.exports.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,
+        });
+    },
+};
+
+module.exports.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,23 @@
+'use strict';
+
+const {test, stub} = require('supertape');
+const io = require('.');
+
+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();
+});

client/dom/io/send-request.js

@@ -0,0 +1,50 @@
+'use strict';
+
+/* global CloudCmd */
+const {promisify} = require('es6-promisify');
+
+const Images = require('../images.mjs');
+const load = require('../load');
+
+module.exports = 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);
+        },
+    });
+});
+
+module.exports._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,13 @@
+'use strict';
+
+const test = require('supertape');
+const {_replaceHash} = require('./send-request');
+
+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

@@ -0,0 +1,56 @@
+'use strict';
+
+/* global CloudCmd */
+const rendy = require('rendy');
+const itype = require('itype');
+const load = require('load.js');
+const {tryToCatch} = require('try-to-catch');
+
+const {findObjByNameInArr} = require('../../common/util');
+
+const Files = require('./files');
+
+module.exports = (name, options, callback = options) => {
+    const {prefix, config} = CloudCmd;
+    const o = options;
+    
+    if (o.name && window[o.name])
+        return callback();
+    
+    Files.get('modules').then(async (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 = local.map((url) => prefix + url);
+        
+        const remoteURL = remoteTmpls.map((tmpl) => {
+            return rendy(tmpl, {
+                version,
+            });
+        });
+        
+        if (online) {
+            const [e] = await tryToCatch(load.parallel, remoteURL);
+            
+            if (!e)
+                return callback();
+        }
+        
+        const [e] = await tryToCatch(load.parallel, localURL);
+        callback(e);
+    });
+};

client/dom/load.js

@@ -0,0 +1,134 @@
+'use strict';
+
+const itype = require('itype');
+const jonny = require('jonny');
+const Emitify = require('emitify');
+const exec = require('execon');
+const Images = require('./images.mjs');
+
+module.exports.getIdBySrc = getIdBySrc;
+/**
+ * Function gets id by src
+ * @param src
+ *
+ * Example: http://domain.com/1.js -> 1_js
+ */
+function getIdBySrc(src) {
+    const isStr = itype.string(src);
+    
+    if (!isStr)
+        return;
+    
+    if (src.includes(':'))
+        src += '-join';
+    
+    const num = src.lastIndexOf('/') + 1;
+    const sub = src.substr(src, num);
+    
+    const id = src
+        .replace(sub, '')
+        .replace(/\./g, '-');
+    
+    return id;
+}
+
+/**
+ * load file countent via ajax
+ *
+ * @param params
+ */
+module.exports.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;
+    
+    const xhr = new XMLHttpRequest();
+    
+    xhr.open(type, p.url, true);
+    
+    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);
+    
+    xhr.onreadystatechange = (event) => {
+        const xhr = event.target;
+        const OK = 200;
+        
+        if (xhr.readyState !== xhr.DONE)
+            return;
+        
+        Images.clearProgress();
+        
+        const TYPE_JSON = 'application/json';
+        const type = xhr.getResponseHeader('content-type');
+        
+        if (xhr.status !== OK)
+            return exec(p.error, xhr);
+        
+        const notText = p.dataType !== 'text';
+        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) => {
+    const emitter = Emitify();
+    const xhr = new XMLHttpRequest();
+    
+    url = encodeURI(url).replace(/#/g, '%23');
+    
+    xhr.open('put', url, true);
+    
+    xhr.upload.onprogress = (event) => {
+        if (!event.lengthComputable)
+            return;
+        
+        const percent = event.loaded / event.total * 100;
+        const count = Math.round(percent);
+        
+        emitter.emit('progress', count);
+    };
+    
+    xhr.onreadystatechange = () => {
+        const over = xhr.readyState === xhr.DONE;
+        const OK = 200;
+        
+        if (!over)
+            return;
+        
+        if (xhr.status === OK) {
+            emitter.emit('progress', 100);
+            return emitter.emit('end');
+        }
+        
+        const error = Error(xhr.responseText);
+        emitter.emit('error', error);
+    };
+    
+    xhr.send(body);
+    
+    return emitter;
+};

client/dom/operations/rename-current.js

@@ -0,0 +1,70 @@
+'use strict';
+
+/* global CloudCmd */
+const capitalize = require('just-capitalize');
+
+const _Dialog = require('../dialog');
+const Storage = require('../storage');
+const RESTful = require('../rest');
+
+const _currentFile = require('../current-file.mjs');
+
+module.exports = 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,89 @@
+'use strict';
+
+const {test, stub} = require('supertape');
+
+const renameCurrent = require('./rename-current');
+
+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

@@ -0,0 +1,44 @@
+'use strict';
+
+const {tryToCatch} = require('try-to-catch');
+
+const {encode} = require('../../common/entity');
+
+const Images = require('./images.mjs');
+const IO = require('./io');
+const Dialog = require('./dialog');
+
+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];
+};
+
+module.exports.delete = handleError(IO.delete);
+module.exports.patch = handleError(IO.patch);
+module.exports.write = handleError(IO.write);
+module.exports.createDirectory = handleError(IO.createDirectory);
+module.exports.read = handleError(IO.read);
+module.exports.copy = handleError(IO.copy);
+module.exports.pack = handleError(IO.pack);
+module.exports.extract = handleError(IO.extract);
+module.exports.move = handleError(IO.move);
+module.exports.rename = handleError(IO.rename);
+
+module.exports.Config = {
+    read: handleError(IO.Config.read),
+    write: handleError(IO.Config.write),
+};
+
+module.exports.Markdown = {
+    read: handleError(IO.Markdown.read),
+    render: handleError(IO.Markdown.render),
+};

client/dom/select-by-pattern.js

@@ -0,0 +1,45 @@
+'use strict';
+
+let SelectType = '*.*';
+
+const {getRegExp} = require('../../common/util');
+const {alert, prompt} = require('./dialog');
+
+const DOM = require('.');
+
+module.exports = async (msg, files) => {
+    if (!files)
+        return;
+    
+    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 = DOM.getCurrentName(current);
+        
+        if (name === '..' || !regExp.test(name))
+            continue;
+        
+        ++matches;
+        
+        let isSelected = DOM.isSelected(current);
+        const shouldSel = msg === 'expand';
+        
+        if (shouldSel)
+            isSelected = !isSelected;
+        
+        if (isSelected)
+            DOM.toggleSelectedFile(current);
+    }
+    
+    if (!matches)
+        alert('No matches found!');
+};

client/dom/storage.js

@@ -0,0 +1,28 @@
+'use strict';
+
+const {parse, stringify} = JSON;
+
+module.exports.set = async (name, data) => {
+    localStorage.setItem(name, data);
+};
+
+module.exports.setJson = async (name, data) => {
+    localStorage.setItem(name, stringify(data));
+};
+
+module.exports.get = async (name) => {
+    return localStorage.getItem(name);
+};
+
+module.exports.getJson = async (name) => {
+    const data = localStorage.getItem(name);
+    return parse(data);
+};
+
+module.exports.clear = () => {
+    localStorage.clear();
+};
+
+module.exports.remove = (item) => {
+    localStorage.removeItem(item);
+};

client/dom/storage.spec.js

@@ -0,0 +1,108 @@
+'use strict';
+
+const {test, stub} = require('supertape');
+
+const storage = require('./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

@@ -0,0 +1,72 @@
+'use strict';
+
+/* global CloudCmd */
+const {eachSeries} = require('execon');
+const wraptile = require('wraptile');
+
+const load = require('./load');
+const Images = require('./images.mjs');
+const {alert} = require('./dialog');
+
+const {FS} = require('../../common/cloudfunc.mjs');
+
+const {getCurrentDirPath: getPathWhenRootEmpty} = require('.');
+const loadFile = wraptile(_loadFile);
+
+const onEnd = wraptile(_onEnd);
+
+module.exports = (dir, files) => {
+    if (!files) {
+        files = dir;
+        dir = getPathWhenRootEmpty();
+    }
+    
+    const n = files.length;
+    
+    if (!n)
+        return;
+    
+    const array = Array.from(files);
+    const {name} = files[0];
+    
+    eachSeries(array, loadFile(dir, n), onEnd(name));
+};
+
+function _onEnd(currentName) {
+    CloudCmd.refresh({
+        currentName,
+    });
+}
+
+function _loadFile(dir, n, file, callback) {
+    let i = 0;
+    
+    const {name} = file;
+    const path = dir + name;
+    const {prefixURL} = CloudCmd;
+    const api = prefixURL + FS;
+    
+    const percent = (i, n, per = 100) => {
+        return Math.round(i * per / n);
+    };
+    
+    const step = (n) => 100 / n;
+    
+    ++i;
+    
+    load
+        .put(api + path, file)
+        .on('error', showError)
+        .on('end', callback)
+        .on('progress', (count) => {
+            const max = step(n);
+            const value = (i - 1) * max + percent(count, 100, max);
+            
+            Images.show.load('top');
+            Images.setProgress(Math.round(value));
+        });
+}
+
+function showError({message}) {
+    alert(message);
+}

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

@@ -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/key/binder.js

@@ -0,0 +1,17 @@
+'use strict';
+
+module.exports.createBinder = () => {
+    let binded = false;
+    
+    return {
+        isBind() {
+            return binded;
+        },
+        setBind() {
+            binded = true;
+        },
+        unsetBind() {
+            binded = false;
+        },
+    };
+};

client/key/index.mjs

@@ -0,0 +1,536 @@
+/* global CloudCmd, DOM */
+import clipboard from '@cloudcmd/clipboard';
+import {fullstore} from 'fullstore';
+import * as Events from '#dom/events';
+import * as Buffer from '../dom/buffer.mjs';
+import KEY from './key.js';
+import _vim from './vim/index.js';
+import setCurrentByChar from './set-current-by-char.js';
+import {createBinder} from './binder.js';
+
+const Chars = fullstore();
+
+const toggleVim = (keyCode, overrides = {}) => {
+    const {_config, config} = overrides;
+    
+    if (keyCode === KEY.ESC)
+        _config('vim', !config('vim'));
+};
+
+const isUndefined = (a) => typeof a === 'undefined';
+
+Chars([]);
+
+const {assign} = Object;
+const binder = createBinder();
+
+const bind = () => {
+    Events.addKey(listener, true);
+    binder.setBind();
+};
+
+export const Key = assign(binder, KEY, {
+    bind,
+});
+
+export const _listener = listener;
+
+function getChar(event) {
+    /*
+      * event.keyIdentifier deprecated in chrome v51
+      * but event.key is absent in chrome <= v51
+      */
+    const {
+        key,
+        shift,
+        keyCode,
+        keyIdentifier,
+    } = event;
+    
+    const char = key || fromCharCode(keyIdentifier);
+    const symbol = getSymbol(shift, keyCode);
+    
+    return [symbol, char];
+}
+
+async function listener(event, overrides = {}) {
+    const {
+        config = CloudCmd.config,
+        _config = CloudCmd._config,
+        switchKey = _switchKey,
+        vim = _vim,
+    } = overrides;
+    
+    const {keyCode} = event;
+    
+    // strange chrome bug calles listener twice
+    // in second time event misses a lot fields
+    if (isUndefined(event.altKey))
+        return;
+    
+    const alt = event.altKey;
+    const ctrl = event.ctrlKey;
+    const meta = event.metaKey;
+    const isBetween = keyCode >= KEY.ZERO && keyCode <= KEY.Z;
+    const isNumpad = /Numpad/.test(event.code);
+    
+    const [symbol, char] = getChar(event);
+    
+    if (!binder.isBind())
+        return;
+    
+    toggleVim(keyCode, {
+        config,
+        _config,
+    });
+    
+    const isVim = config('vim');
+    
+    if (!isVim && !isNumpad && !alt && !ctrl && !meta && (isBetween || symbol))
+        return setCurrentByChar(char, Chars);
+    
+    Chars([]);
+    await switchKey(event);
+    
+    if (keyCode >= KEY.F1 && keyCode <= KEY.F10)
+        return;
+    
+    if (isVim)
+        vim(char, event);
+}
+
+function getSymbol(shift, keyCode) {
+    switch(keyCode) {
+    case KEY.DOT:
+        return '.';
+    
+    case KEY.HYPHEN:
+        return shift ? '_' : '-';
+    
+    case KEY.EQUAL:
+        return shift ? '+' : '=';
+    }
+    
+    return '';
+}
+
+function fromCharCode(keyIdentifier) {
+    const code = keyIdentifier.substring(2);
+    const hex = parseInt(code, 16);
+    
+    return String.fromCharCode(hex);
+}
+
+async function _switchKey(event) {
+    const Info = DOM.CurrentInfo;
+    let i;
+    let isSelected;
+    let prev;
+    let next;
+    let current = Info.element;
+    let dataName;
+    
+    const {
+        name,
+        panel,
+        path,
+        isDir,
+    } = Info;
+    
+    const {
+        Operation,
+        changeDir,
+        config,
+    } = CloudCmd;
+    
+    const {keyCode} = event;
+    
+    const alt = event.altKey;
+    const shift = event.shiftKey;
+    const ctrl = event.ctrlKey;
+    const meta = event.metaKey;
+    const ctrlMeta = ctrl || meta;
+    
+    if (current) {
+        prev = current.previousSibling;
+        next = current.nextSibling;
+    }
+    
+    switch(keyCode) {
+    case KEY.TAB:
+        DOM.changePanel();
+        event.preventDefault();
+        break;
+    
+    case KEY.INSERT:
+        DOM
+            .toggleSelectedFile(current)
+            .setCurrentFile(next);
+        break;
+    
+    case KEY.INSERT_MAC:
+        DOM
+            .toggleSelectedFile(current)
+            .setCurrentFile(next);
+        break;
+    
+    case KEY.DELETE:
+        if (shift)
+            Operation.show('delete:silent');
+        else
+            Operation.show('delete');
+        
+        break;
+    
+    case KEY.ASTERISK:
+        DOM.toggleAllSelectedFiles(current);
+        break;
+    
+    case KEY.PLUS:
+        DOM.expandSelection();
+        event.preventDefault();
+        break;
+    
+    case KEY.MINUS:
+        DOM.shrinkSelection();
+        event.preventDefault();
+        break;
+    
+    case KEY.F1:
+        CloudCmd.Help.show();
+        event.preventDefault();
+        break;
+    
+    case KEY.F2:
+        CloudCmd.UserMenu.show();
+        break;
+    
+    case KEY.F3:
+        event.preventDefault();
+        
+        if (Info.isDir)
+            await changeDir(path);
+        else if (shift)
+            CloudCmd.View.show(null, {
+                raw: true,
+            });
+        else if (ctrlMeta)
+            CloudCmd.sortPanel('name');
+        else
+            CloudCmd.View.show();
+        
+        break;
+    
+    case KEY.F4:
+        if (config('vim'))
+            CloudCmd.EditFileVim.show();
+        else
+            CloudCmd.EditFile.show();
+        
+        event.preventDefault();
+        break;
+    
+    case KEY.F5:
+        if (ctrlMeta)
+            CloudCmd.sortPanel('date');
+        else if (alt)
+            Operation.show('pack');
+        else
+            Operation.show('copy');
+        
+        event.preventDefault();
+        break;
+    
+    case KEY.F6:
+        if (ctrlMeta)
+            CloudCmd.sortPanel('size');
+        else if (shift)
+            DOM.renameCurrent(current);
+        else
+            Operation.show('move');
+        
+        event.preventDefault();
+        break;
+    
+    case KEY.F7:
+        if (shift)
+            DOM.promptNewFile();
+        else
+            DOM.promptNewDir();
+        
+        event.preventDefault();
+        break;
+    
+    case KEY.F8:
+        Operation.show('delete');
+        event.preventDefault();
+        break;
+    
+    case KEY.F9:
+        if (alt)
+            Operation.show('extract');
+        else
+            CloudCmd.Menu.show();
+        
+        event.preventDefault();
+        break;
+    
+    case KEY.F10:
+        CloudCmd.Config.show();
+        event.preventDefault();
+        break;
+    
+    case KEY.TRA:
+        event.preventDefault();
+        
+        if (shift)
+            return CloudCmd.Terminal.show();
+        
+        CloudCmd.Konsole.show();
+        break;
+    
+    case KEY.BRACKET_CLOSE:
+        CloudCmd.Konsole.show();
+        event.preventDefault();
+        break;
+    
+    case KEY.SPACE:
+        event.preventDefault();
+        
+        if (!isDir || name === '..')
+            isSelected = true;
+        else
+            isSelected = DOM.isSelected(current);
+        
+        if (!isSelected)
+            await DOM.loadCurrentSize(current);
+        
+        DOM.toggleSelectedFile(current);
+        
+        break;
+    
+    case KEY.U:
+        if (ctrlMeta) {
+            DOM.swapPanels();
+            event.preventDefault();
+        }
+        
+        break;
+    
+    /* navigation on file table:        *
+     * in case of pressing button 'up', *
+     * select previous row              */
+    case KEY.UP:
+        if (shift)
+            DOM.toggleSelectedFile(current);
+        
+        DOM.setCurrentFile(prev);
+        event.preventDefault();
+        break;
+    
+    /* in case of pressing button 'down', *
+     * select next row                    */
+    case KEY.DOWN:
+        if (shift)
+            DOM.toggleSelectedFile(current);
+        
+        DOM.setCurrentFile(next);
+        event.preventDefault();
+        break;
+    
+    case KEY.LEFT:
+        if (!alt)
+            return;
+        
+        event.preventDefault();
+        
+        dataName = Info.panel.getAttribute('data-name');
+        
+        if (dataName === 'js-right')
+            DOM.duplicatePanel();
+        
+        break;
+    
+    case KEY.RIGHT:
+        if (!alt)
+            return;
+        
+        event.preventDefault();
+        
+        dataName = Info.panel.getAttribute('data-name');
+        
+        if (dataName === 'js-left')
+            DOM.duplicatePanel();
+        
+        break;
+    
+    /* in case of pressing button 'Home',  *
+     * go to top element                   */
+    case KEY.HOME:
+        DOM.setCurrentFile(Info.first);
+        event.preventDefault();
+        break;
+    
+    /* in case of pressing button 'End', select last element */
+    case KEY.END:
+        DOM.setCurrentFile(Info.last);
+        event.preventDefault();
+        break;
+    
+    /* если нажали клавишу page down проматываем экран */
+    case KEY.PAGE_DOWN:
+        DOM.scrollByPages(panel, 1);
+        
+        for (i = 0; i < 30; i++) {
+            if (!current.nextSibling)
+                break;
+            
+            current = current.nextSibling;
+        }
+        
+        DOM.setCurrentFile(current);
+        event.preventDefault();
+        break;
+    
+    /* если нажали клавишу page up проматываем экран */
+    case KEY.PAGE_UP:
+        DOM.scrollByPages(panel, -1);
+        
+        for (i = 0; i < 30; i++) {
+            if (!current.previousSibling)
+                break;
+            
+            current = current.previousSibling;
+        }
+        
+        DOM.setCurrentFile(current);
+        event.preventDefault();
+        break;
+    
+    case KEY.ENTER:
+        if (Info.isDir)
+            await changeDir(path);
+        else
+            CloudCmd.View.show();
+        
+        break;
+    
+    case KEY.BACKSPACE:
+        CloudCmd.goToParentDir();
+        event.preventDefault();
+        break;
+    
+    case KEY.BACKSLASH:
+        if (ctrlMeta)
+            await changeDir('/');
+        
+        break;
+    
+    case KEY.A:
+        if (ctrlMeta) {
+            DOM.selectAllFiles();
+            event.preventDefault();
+        }
+        
+        break;
+    
+    case KEY.G:
+        if (alt) {
+            DOM.goToDirectory();
+            event.preventDefault();
+        }
+        
+        break;
+    
+    case KEY.M:
+        if (ctrlMeta) {
+            if (config('vim'))
+                CloudCmd.EditNamesVim.show();
+            else
+                CloudCmd.EditNames.show();
+            
+            event.preventDefault();
+        }
+        
+        break;
+    
+    case KEY.P:
+        if (!ctrlMeta)
+            return;
+        
+        event.preventDefault();
+        clipboard
+            .writeText(Info.dirPath)
+            .catch(CloudCmd.log);
+        
+        break;
+    
+    /**
+     * обновляем страницу,
+     * загружаем содержимое каталога
+     * при этом данные берём всегда с
+     * сервера, а не из кэша
+     * (обновляем кэш)
+     */
+    case KEY.R:
+        if (ctrlMeta) {
+            CloudCmd.log('reloading page...\n');
+            CloudCmd.refresh();
+            event.preventDefault();
+        }
+        
+        break;
+    
+    case KEY.C:
+        if (ctrlMeta)
+            Buffer.copy();
+        
+        break;
+    
+    case KEY.X:
+        if (ctrlMeta)
+            Buffer.cut();
+        
+        break;
+    
+    case KEY.V:
+        if (ctrlMeta)
+            Buffer.paste();
+        
+        break;
+    
+    case KEY.Z:
+        if (ctrlMeta)
+            Buffer.clear();
+        
+        break;
+    
+    case KEY.COLON:
+        CloudCmd.CommandLine.show();
+        event.preventDefault();
+        break;
+    
+    /* чистим хранилище */
+    case KEY.D:
+        if (ctrlMeta) {
+            CloudCmd.log('clearing storage...');
+            await DOM.Storage.clear();
+            CloudCmd.log('storage cleared');
+            event.preventDefault();
+        }
+        
+        break;
+    
+    case KEY.DOT:
+        if (meta && shift) {
+            const showDotFiles = !CloudCmd.config('showDotFiles');
+            CloudCmd._config('showDotFiles', showDotFiles);
+            CloudCmd.refresh();
+            await DOM.RESTful.Config.write({
+                showDotFiles,
+            });
+        }
+        
+        break;
+    }
+}

client/key/index.spec.js

@@ -0,0 +1,61 @@
+'use strict';
+
+require('css-modules-require-hook/preset');
+
+const autoGlobals = require('auto-globals');
+const supertape = require('supertape');
+
+const {ESC} = require('./key');
+
+const {Key, _listener} = require('./index.mjs');
+
+const {getDOM, getCloudCmd} = require('./vim/globals.fixture');
+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

@@ -0,0 +1,81 @@
+'use strict';
+
+module.exports = {
+    BACKSPACE: 8,
+    TAB: 9,
+    ENTER: 13,
+    CAPSLOCK: 20,
+    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,
+    
+    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,
+    
+    COLON: 186,
+    EQUAL: 187,
+    HYPHEN: 189,
+    DOT: 190,
+    SLASH: 191,
+    /* Typewritten Reverse Apostrophe (`) */
+    TRA: 192,
+    BACKSLASH: 220,
+    
+    BRACKET_CLOSE: 221,
+};

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

@@ -0,0 +1,60 @@
+/* global DOM */
+
+'use strict';
+
+const {escapeRegExp} = require('../../common/util');
+
+module.exports = function setCurrentByChar(char, charStore) {
+    const Info = DOM.CurrentInfo;
+    let firstByName;
+    let skipCount = 0;
+    let setted = false;
+    let i = 0;
+    
+    const escapeChar = escapeRegExp(char);
+    const regExp = new RegExp(`^${escapeChar}.*$`, 'i');
+    const {files} = Info;
+    const chars = charStore();
+    const n = chars.length;
+    
+    while (i < n && char === chars[i])
+        i++;
+    
+    if (!i)
+        charStore([]);
+    
+    const skipN = skipCount = i;
+    
+    charStore(charStore().concat(char));
+    
+    const names = DOM.getFilenames(files);
+    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;
+            DOM.setCurrentFile(byName);
+            
+            return true;
+        }
+        
+        if (skipN === skipCount)
+            firstByName = byName;
+        
+        --skipCount;
+    };
+    
+    names
+        .filter(isTest)
+        .filter(not(isRoot))
+        .some(setCurrent);
+    
+    if (!setted) {
+        DOM.setCurrentFile(firstByName);
+        charStore([char]);
+    }
+};

client/key/vim/find.js

@@ -0,0 +1,49 @@
+'use strict';
+
+const {fullstore} = require('fullstore');
+const limier = require('limier');
+
+const searchStore = fullstore([]);
+const searchIndex = fullstore(0);
+
+module.exports.find = (value, names) => {
+    const result = limier(value, names);
+    
+    searchStore(result);
+    searchIndex(0);
+    
+    return result;
+};
+
+module.exports.findNext = () => {
+    const names = searchStore();
+    const index = next(searchIndex(), names.length);
+    
+    searchIndex(index);
+    return names[searchIndex()];
+};
+
+module.exports.findPrevious = () => {
+    const names = searchStore();
+    const index = previous(searchIndex(), names.length);
+    
+    searchIndex(index);
+    return names[index];
+};
+
+module.exports._next = next;
+module.exports._previous = previous;
+
+function next(index, length) {
+    if (index === length - 1)
+        return 0;
+    
+    return ++index;
+}
+
+function previous(index, length) {
+    if (!index)
+        return length - 1;
+    
+    return --index;
+}

client/key/vim/find.spec.js

@@ -0,0 +1,24 @@
+'use strict';
+
+const test = require('supertape');
+const dir = './';
+
+const {getDOM} = require('./globals.fixture');
+
+globalThis.DOM = getDOM();
+
+const {_next, _previous} = require(`${dir}find`);
+
+test('cloudcmd: client: vim: _next', (t) => {
+    const result = _next(1, 2);
+    
+    t.notOk(result, 'should return 0');
+    t.end();
+});
+
+test('cloudcmd: client: vim: _previous', (t) => {
+    const result = _previous(0, 2);
+    
+    t.equal(result, 1, 'should return 1');
+    t.end();
+});

client/key/vim/globals.fixture.js

@@ -0,0 +1,48 @@
+'use strict';
+
+const noop = () => {};
+
+module.exports.getDOM = () => {
+    const prompt = Promise.resolve.bind(Promise);
+    const CurrentInfo = {
+        element: {},
+        files: [],
+    };
+    
+    const Buffer = {
+        copy: noop,
+        paste: noop,
+    };
+    
+    const Dialog = {
+        prompt,
+    };
+    
+    return {
+        Buffer,
+        CurrentInfo,
+        Dialog,
+        selectFile: noop,
+        unselectFile: noop,
+        unselectFiles: noop,
+        setCurrentFile: noop,
+        getCurrentName: noop,
+        setCurrentByName: noop,
+        toggleSelectedFile: noop,
+        prompNewDirectory: noop,
+        promptNewFile: noop,
+    };
+};
+
+module.exports.getCloudCmd = () => {
+    const show = () => {};
+    
+    return {
+        Operation: {
+            show,
+        },
+        
+        config: noop,
+        _config: noop,
+    };
+};

client/key/vim/index.js

@@ -0,0 +1,140 @@
+'use strict';
+
+/* global CloudCmd */
+/* global DOM */
+const vim = require('./vim');
+const finder = require('./find');
+const {
+    setCurrent,
+    selectFileNotParent,
+} = require('./set-current');
+
+module.exports = (key, event, overrides = {}) => {
+    const defaults = {
+        ...globalThis.DOM,
+        ...globalThis.CloudCmd,
+    };
+    
+    const deps = {
+        ...defaults,
+        ...overrides,
+    };
+    
+    const operations = getOperations(event, deps);
+    
+    vim(key, operations, deps);
+};
+
+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),
+        
+        toggleSelectedFile,
+        Buffer = {},
+        createFindNext = _createFindNext,
+    } = deps;
+    
+    return {
+        findNext: createFindNext({
+            setCurrentByName,
+        }),
+        escape: unselectFiles,
+        
+        remove: () => {
+            Operation.show('delete');
+        },
+        
+        makeDirectory: () => {
+            event.stopImmediatePropagation();
+            event.preventDefault();
+            DOM.promptNewDir();
+        },
+        
+        makeFile: () => {
+            event.stopImmediatePropagation();
+            event.preventDefault();
+            DOM.promptNewFile();
+        },
+        
+        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);
+        },
+        
+        findPrevious: () => {
+            const name = finder.findPrevious();
+            setCurrentByName(name);
+        },
+    };
+};
+
+module.exports.selectFile = selectFileNotParent;
+
+const _createFindNext = (overrides = {}) => () => {
+    const {setCurrentByName} = overrides;
+    const name = finder.findNext();
+    
+    setCurrentByName(name);
+};

client/key/vim/index.spec.js

@@ -0,0 +1,681 @@
+'use strict';
+
+const {join} = require('node:path');
+const {test, stub} = require('supertape');
+const mockRequire = require('mock-require');
+
+const dir = '../';
+
+const pathVim = join(dir, 'vim');
+
+const {getDOM, getCloudCmd} = require('./globals.fixture');
+
+globalThis.DOM = getDOM();
+globalThis.CloudCmd = getCloudCmd();
+
+const vim = require('./index.js');
+
+const {assign} = Object;
+const {DOM} = globalThis;
+const {Buffer} = DOM;
+const pathFind = join(dir, 'vim', 'find');
+const {reRequire, stopAll} = mockRequire;
+
+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 = {};
+    
+    vim.selectFile(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 = {};
+    
+    vim.selectFile(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 vim = reRequire(pathVim);
+    
+    const event = {
+        preventDefault: stub(),
+    };
+    
+    vim('/', event);
+    
+    stopAll();
+    
+    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();
+    
+    mockRequire(pathFind, {
+        findPrevious,
+    });
+    
+    const vim = reRequire(`${dir}vim`);
+    const event = {};
+    
+    vim('N', event);
+    
+    stopAll();
+    
+    t.calledWithNoArgs(findPrevious, 'should call findPrevious');
+    t.end();
+});
+
+test('cloudcmd: client: key: make directory', async (t) => {
+    const vim = reRequire(pathVim);
+    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 vim = reRequire(pathVim);
+    const {DOM} = globalThis;
+    
+    assign(DOM, {
+        promptNewFile: stub(),
+    });
+    
+    const event = {
+        stopImmediatePropagation: stub(),
+        preventDefault: stub(),
+    };
+    
+    vim('m', event);
+    vim('f', event);
+    
+    t.calledWithNoArgs(DOM.promptNewDir);
+    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();
+});

client/key/vim/set-current.js

@@ -0,0 +1,36 @@
+'use strict';
+
+/* global DOM */
+module.exports.selectFileNotParent = selectFileNotParent;
+function selectFileNotParent(current, {getCurrentName, selectFile} = DOM) {
+    const name = getCurrentName(current);
+    
+    if (name === '..')
+        return;
+    
+    selectFile(current);
+}
+
+module.exports.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,203 @@
+'use strict';
+
+const {fullstore} = require('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 = () => {};
+
+module.exports = (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,
+    } = 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 === 'mf') {
+        makeFile();
+        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,81 @@
+'use strict';
+
+const {test, stub} = require('supertape');
+
+const vim = require('./vim');
+
+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: 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

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

client/listeners/get-range.js

@@ -0,0 +1,11 @@
+'use strict';
+
+module.exports = (indexFrom, indexTo, files) => {
+    if (indexFrom < indexTo)
+        return files.slice(indexFrom, indexTo + 1);
+    
+    if (indexFrom > indexTo)
+        return files.slice(indexTo, indexFrom + 1);
+    
+    return [files[indexFrom]];
+};

client/listeners/index.js

@@ -0,0 +1,504 @@
+/* global DOM, CloudCmd */
+
+'use strict';
+
+const exec = require('execon');
+const itype = require('itype');
+const currify = require('currify');
+const {tryToCatch} = require('try-to-catch');
+const clipboard = require('@cloudcmd/clipboard');
+
+const getRange = require('./get-range');
+const uploadFiles = require('../dom/upload-files');
+const {FS} = require('../../common/cloudfunc.mjs');
+const Events = require('#dom/events');
+
+const getIndex = currify(require('./get-index'));
+
+const NBSP_REG = RegExp(String.fromCharCode(160), 'g');
+const SPACE = ' ';
+
+module.exports.init = async () => {
+    await Promise.all([
+        contextMenu(),
+        dragndrop(),
+        unload(),
+        pop(),
+        resize(),
+        header(),
+        config(),
+    ]);
+};
+
+const unselect = (event) => {
+    const isMac = /Mac/.test(globalThis.navigator.platform);
+    const {
+        shiftKey,
+        metaKey,
+        ctrlKey,
+    } = event;
+    
+    if (shiftKey || isMac && metaKey || ctrlKey)
+        return;
+    
+    DOM.unselectFiles();
+};
+
+const execAll = currify((funcs, event) => {
+    for (const fn of funcs)
+        fn(event);
+});
+
+const EventsFiles = {
+    mousedown: exec.with(execIfNotUL, setCurrentFileByEvent),
+    click: execAll([onClick, exec.with(execIfNotMobile, unselect)]),
+    dragstart: exec.with(execIfNotUL, onDragStart),
+    dblclick: exec.with(execIfNotUL, onDblClick),
+    touchstart: exec.with(execIfNotUL, onTouch),
+};
+
+let EXT;
+
+function header() {
+    const fm = DOM.getFM();
+    const isDataset = (el) => el.dataset;
+    const isPanel = (el) => {
+        return /^js-(left|right)$/.test(el.dataset.name);
+    };
+    
+    Events.addClick(fm, (event) => {
+        const el = event.target;
+        const parent = el.parentElement;
+        
+        if (parent.dataset.name !== 'js-fm-header')
+            return;
+        
+        const name = (el.dataset.name || '').replace('js-', '');
+        
+        if (!/^(name|size|date)$/.test(name))
+            return;
+        
+        const panel = getPath(el)
+            .filter(isDataset)
+            .filter(isPanel)
+            .pop();
+        
+        CloudCmd.sortPanel(name, panel);
+    });
+}
+
+function getPath(el, path = []) {
+    if (!el)
+        return path;
+    
+    return getPath(el.parentElement, path.concat(el));
+}
+
+async function config() {
+    const [, config] = await tryToCatch(DOM.Files.get, 'config');
+    const type = config?.packer;
+    
+    EXT = DOM.getPackerExt(type);
+}
+
+module.exports.initKeysPanel = () => {
+    const keysElement = DOM.getById('js-keyspanel');
+    
+    if (!keysElement)
+        return;
+    
+    Events.addClick(keysElement, (event) => {
+        const {target} = event;
+        const {id} = target;
+        
+        const operation = (name) => {
+            const {Operation} = CloudCmd;
+            
+            return Operation.show.bind(null, name);
+        };
+        
+        const clickFuncs = {
+            '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]);
+    });
+};
+
+const getPanel = (side) => {
+    if (!itype.string(side))
+        return side;
+    
+    return DOM.getByDataName(`js-${side}`);
+};
+
+module.exports.setOnPanel = (side) => {
+    const panel = getPanel(side);
+    
+    const filesElement = DOM.getByDataName('js-files', panel);
+    const pathElement = DOM.getByDataName('js-path', panel);
+    
+    /* ставим загрузку гифа на клик*/
+    Events.addClick(pathElement, getPathListener(panel));
+    Events.add(filesElement, EventsFiles);
+};
+
+function getPathListener(panel) {
+    return onPathElementClick.bind(null, 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) {
+    const url = CloudCmd.HOST;
+    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('%%', '%25%')
+        .replace(NBSP_REG, SPACE) || '/';
+}
+
+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-copy-path')
+        return copyPath(element);
+    
+    if (attr === 'js-refresh')
+        return CloudCmd.refresh({
+            panel,
+            noCurrent,
+        });
+    
+    if (attr !== 'js-path-link')
+        return;
+    
+    const {href} = element;
+    const path = decodePath(href);
+    
+    await CloudCmd.changeDir(path, {
+        isRefresh: false,
+        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;
+    
+    if (tagName !== 'UL')
+        callback(event);
+}
+
+function onClick(event) {
+    event.preventDefault();
+    changePanel(event.target);
+}
+
+function toggleSelect(key, files) {
+    const isMac = /Mac/.test(globalThis.navigator.platform);
+    
+    if (!key)
+        throw Error('key should not be undefined!');
+    
+    const [file] = files;
+    
+    if (isMac && key.meta)
+        return DOM.toggleSelectedFile(file);
+    
+    if (key.shift)
+        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);
+    
+    if (ul !== files)
+        DOM.changePanel();
+}
+
+async function onDblClick(event) {
+    event.preventDefault();
+    
+    const current = getLIElement(event.target);
+    const isDir = DOM.isCurrentIsDir(current);
+    const path = DOM.getCurrentPath(current);
+    
+    if (!isDir)
+        return CloudCmd.View.show();
+    
+    await CloudCmd.changeDir(path);
+}
+
+async function onTouch(event) {
+    const current = getLIElement(event.target);
+    const isDir = DOM.isCurrentIsDir(current);
+    
+    if (!isDir)
+        return;
+    
+    const isCurrent = DOM.isCurrentFile(current);
+    
+    if (!isCurrent)
+        return;
+    
+    await CloudCmd.changeDir(DOM.getCurrentPath(current));
+}
+
+/*
+  * download file from browser to desktop
+  * in Chrome (HTML5)
+  */
+function onDragStart(event) {
+    const Info = DOM.CurrentInfo;
+    const {prefixURL} = CloudCmd;
+    const element = getLIElement(event.target);
+    const {isDir} = Info;
+    let link = DOM.getCurrentLink(element);
+    let name = DOM.getCurrentName(element);
+    
+    /* if it's directory - adding json extension */
+    if (isDir) {
+        name += EXT;
+        link = document.createElement('a');
+        link.textContent = name;
+        link.href = prefixURL + '/pack' + Info.path + EXT;
+    }
+    
+    event.dataTransfer.setData('DownloadURL', 'application/octet-stream' + ':' + name +
+    ':' + link);
+}
+
+function getLIElement(element) {
+    if (!element)
+        return element;
+    
+    while (element.tagName !== 'LI')
+        element = element.parentElement;
+    
+    return element;
+}
+
+function getULElement(element) {
+    while (element.tagName !== 'UL')
+        element = element.parentElement;
+    
+    return 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,
+    };
+    
+    const element = getLIElement(event.target);
+    
+    const fromName = Info.name;
+    DOM.setCurrentFile(element);
+    const toName = Info.name;
+    
+    let files = [];
+    
+    if (key.shift)
+        files = getFilesRange(fromName, toName);
+    else
+        files.push(Info.element);
+    
+    if (event.button === BUTTON_LEFT)
+        toggleSelect(key, files);
+}
+
+function getFilesRange(from, to) {
+    const files = DOM.getAllFiles();
+    const names = DOM.getFilenames(files);
+    const getNameIndex = getIndex(names);
+    
+    const indexFrom = getNameIndex(from);
+    const indexTo = getNameIndex(to);
+    
+    return getRange(indexFrom, indexTo, files);
+}
+
+function contextMenu() {
+    const fm = DOM.getFM();
+    
+    Events.addOnce('contextmenu', fm, (event) => {
+        CloudCmd.Menu.show({
+            x: event.clientX,
+            y: event.clientY,
+        });
+    });
+    
+    Events.addContextMenu(fm, (event) => {
+        CloudCmd.Menu.ENABLED || event.preventDefault();
+    });
+}
+
+function dragndrop() {
+    const panels = DOM.getByClassAll('panel');
+    const select = ({target}) => {
+        target.classList.add('selected-panel');
+    };
+    
+    const unselect = ({target}) => {
+        target.classList.remove('selected-panel');
+    };
+    
+    const onDrop = (event) => {
+        const {files, items} = event.dataTransfer;
+        
+        const {length: filesCount} = files;
+        
+        event.preventDefault();
+        
+        if (filesCount && (!items || !items.length || !items[0].webkitGetAsEntry))
+            return uploadFiles(files);
+        
+        const isFile = (item) => item.kind === 'file';
+        
+        const dirFiles = Array
+            .from(items)
+            .filter(isFile);
+        
+        if (dirFiles.length)
+            return DOM.uploadDirectory(dirFiles);
+        
+        const {Operation} = CloudCmd;
+        const operation = event.shiftKey ? 'move' : 'copy';
+        
+        return Operation.show(operation);
+    };
+    
+    /**
+     * 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;
+        const {effectAllowed} = dataTransfer;
+        
+        if (/move|linkMove/.test(effectAllowed))
+            dataTransfer.dropEffect = 'move';
+        else
+            dataTransfer.dropEffect = 'copy';
+        
+        event.preventDefault();
+    };
+    
+    for (const panel of panels)
+        Events
+            .add('dragover', panel, onDragOver)
+            .add('drop', panel, onDrop)
+            .add('dragenter', select)
+            .add(['dragleave', 'drop'], unselect);
+}
+
+function unload() {
+    Events.add(['unload', 'beforeunload'], (event) => {
+        const {Key} = CloudCmd;
+        const isBind = Key?.isBind();
+        
+        if (isBind)
+            return;
+        
+        event.preventDefault();
+        return 'Please make sure that you saved all work.';
+    });
+}
+
+function pop() {
+    Events.add('popstate', async ({state}) => {
+        const path = (state || '').replace(FS, '');
+        
+        if (!path)
+            return CloudCmd.route(location.hash);
+        
+        const history = false;
+        
+        await CloudCmd.changeDir(path, {
+            history,
+        });
+    });
+}
+
+function resize() {
+    Events.add('resize', () => {
+        const Info = DOM.CurrentInfo;
+        const is = globalThis.innerWidth < CloudCmd.MIN_ONE_PANEL_WIDTH;
+        
+        if (!is)
+            return;
+        
+        const {panel} = Info;
+        const isEmptyRoot = !panel;
+        
+        if (isEmptyRoot)
+            return;
+        
+        const name = panel.getAttribute('data-name');
+        const isLeft = name === 'js-left';
+        
+        if (isLeft)
+            return;
+        
+        DOM.changePanel();
+    });
+}

client/load-module.mjs

@@ -0,0 +1,56 @@
+/* global CloudCmd */
+import exec from 'execon';
+import {tryToCatch} from 'try-to-catch';
+import {js as loadJS} from 'load.js';
+import pascalCase from 'just-pascal-case';
+
+const noJS = (a) => a.replace(/.js$/, '');
+
+/**
+ * function load modules
+ * @params = {name, path, func, dobefore, arg}
+ */
+export const loadModule = (params) => {
+    if (!params)
+        return;
+    
+    const {path} = params;
+    
+    const name = path && noJS(pascalCase(path));
+    const doBefore = params.dobefore;
+    
+    if (CloudCmd[name])
+        return;
+    
+    CloudCmd[name] = async () => {
+        exec(doBefore);
+        
+        const {DIR_MODULES} = CloudCmd;
+        const pathFull = `${DIR_MODULES}/${path}.js`;
+        
+        await loadJS(pathFull);
+        const newModule = async (f) => f && f();
+        const module = CloudCmd[name];
+        
+        Object.assign(newModule, module);
+        
+        CloudCmd[name] = newModule;
+        CloudCmd.log('init', name);
+        
+        await module.init();
+        
+        return newModule;
+    };
+    
+    CloudCmd[name].show = async (...args) => {
+        CloudCmd.log('show', name, args);
+        const m = CloudCmd[name];
+        
+        const [e, a] = await tryToCatch(m);
+        
+        if (e)
+            return;
+        
+        return await a.show(...args);
+    };
+};

client/modules/cloud.js

@@ -0,0 +1,64 @@
+/* global CloudCmd, filepicker */
+
+'use strict';
+
+const exec = require('execon');
+const currify = require('currify');
+const load = require('load.js');
+
+const {ajax} = require('../dom/load');
+
+const Files = require('../dom/files');
+const Images = require('../dom/images.mjs');
+const {log} = CloudCmd;
+
+const upload = currify(_upload);
+
+const Name = 'Cloud';
+
+CloudCmd[Name] = module.exports;
+
+module.exports.init = async () => {
+    const [modules] = await loadFiles();
+    const {key} = modules.data.FilePicker;
+    
+    filepicker.setKey(key);
+    Images.hide();
+};
+
+module.exports.uploadFile = (filename, data) => {
+    const mimetype = '';
+    
+    filepicker.store(data, {
+        mimetype,
+        filename,
+    }, (fpFile) => {
+        filepicker.exportFile(fpFile, log, log);
+    });
+};
+
+module.exports.saveFile = (callback) => {
+    filepicker.pick(upload(callback));
+};
+
+function _upload(callback, file) {
+    const {url, filename} = file;
+    
+    const responseType = 'arraybuffer';
+    const success = exec.with(callback, filename);
+    
+    ajax({
+        url,
+        responseType,
+        success,
+    });
+}
+
+function loadFiles() {
+    const js = '//api.filepicker.io/v2/filepicker.js';
+    
+    return Promise.all([
+        Files.get('modules'),
+        load.js(js),
+    ]);
+}

client/modules/command-line.js

@@ -0,0 +1,35 @@
+'use strict';
+
+/* global CloudCmd */
+CloudCmd.CommandLine = exports;
+
+const Dialog = require('../dom/dialog');
+
+const noop = () => {};
+
+module.exports.init = noop;
+
+module.exports.show = show;
+module.exports.hide = hide;
+
+async function show() {
+    const [, cmd] = await Dialog.prompt('Command Line', '');
+    const TERMINAL = '^(t|terminal)';
+    
+    if (RegExp(`${TERMINAL}$`).test(cmd))
+        return await CloudCmd.Terminal.show();
+    
+    if (RegExp(TERMINAL).test(cmd)) {
+        const command = cmd.replace(RegExp(`${TERMINAL} `), '');
+        const exitCode = await CloudCmd.TerminalRun.show({
+            command: `bash -c '${command}'`,
+        });
+        
+        if (exitCode === -1)
+            await Dialog.alert(`☝️ Looks like Terminal is disabled, start Cloud Coammnder with '--terminal' flag.`);
+        
+        return;
+    }
+}
+
+function hide() {}

client/modules/config/index.js

@@ -0,0 +1,248 @@
+'use strict';
+
+/* global CloudCmd, DOM, io */
+require('../../../css/config.css');
+
+const rendy = require('rendy');
+const currify = require('currify');
+const wraptile = require('wraptile');
+const squad = require('squad');
+const {promisify} = require('es6-promisify');
+const {tryToCatch} = require('try-to-catch');
+const load = require('load.js');
+const createElement = require('@cloudcmd/create-element');
+
+const input = require('./input');
+const Images = require('../../dom/images.mjs');
+const Events = require('#dom/events');
+const Files = require('../../dom/files');
+
+const {getTitle} = require('../../../common/cloudfunc.mjs');
+const {Dialog, setTitle} = DOM;
+
+const Name = 'Config';
+
+CloudCmd[Name] = module.exports;
+
+const loadSocket = promisify(DOM.loadSocket);
+
+const showLoad = () => {
+    Images.show.load('top');
+};
+
+const addKey = currify((fn, input) => {
+    Events.addKey(input, fn);
+    return input;
+});
+
+const addChange = currify((fn, input) => {
+    Events.add('change', input, fn);
+    return input;
+});
+
+const Config = {};
+
+let Template;
+
+const loadCSS = load.css;
+
+module.exports.init = async () => {
+    if (!CloudCmd.config('configDialog'))
+        return;
+    
+    showLoad();
+    
+    const {DIR_DIST} = CloudCmd;
+    
+    [Template] = await Promise.all([
+        Files.get('config-tmpl'),
+        loadSocket(),
+        loadCSS(`${DIR_DIST}/config.css`),
+        CloudCmd.View(),
+    ]);
+    
+    initSocket();
+};
+
+const {config, Key} = CloudCmd;
+
+let Element;
+
+function getHost() {
+    const {
+        host,
+        origin,
+        protocol,
+    } = location;
+    
+    return origin || `${protocol}//${host}`;
+}
+
+function initSocket() {
+    const href = getHost();
+    const {prefixSocket, prefix} = CloudCmd;
+    
+    const ONE_MINUTE = 60 * 1000;
+    
+    const socket = io.connect(href + prefixSocket + '/config', {
+        reconnectionAttempts: Infinity,
+        reconnectionDelay: ONE_MINUTE,
+        path: `${prefix}/socket.io`,
+    });
+    
+    const save = (data) => {
+        onSave(data);
+        socket.send(data);
+    };
+    
+    authCheck(socket);
+    
+    socket.on('connect', () => {
+        Config.save = save;
+    });
+    
+    socket.on('message', onSave);
+    socket.on('log', CloudCmd.log);
+    
+    socket.on('disconnect', () => {
+        Config.save = saveHttp;
+    });
+    
+    socket.on('err', Dialog.alert);
+}
+
+function authCheck(socket) {
+    socket.emit('auth', config('username'), config('password'));
+    socket.on('reject', wraptile(Dialog.alert, 'Wrong credentials!'));
+}
+
+Config.save = saveHttp;
+
+module.exports.show = show;
+
+async function show() {
+    if (!CloudCmd.config('configDialog'))
+        return;
+    
+    await fillTemplate();
+}
+
+async function fillTemplate() {
+    const [error, config] = await tryToCatch(Files.get, 'config');
+    
+    if (error)
+        return Dialog.alert('Could not load config!');
+    
+    const {
+        editor,
+        menu,
+        packer,
+        columns,
+        theme,
+        configAuth,
+        ...obj
+    } = input.convert(config);
+    
+    obj[`${menu}-selected`] = 'selected';
+    obj[`${editor}-selected`] = 'selected';
+    obj[`${packer}-selected`] = 'selected';
+    obj[`${columns}-selected`] = 'selected';
+    obj[`${theme}-selected`] = 'selected';
+    obj.configAuth = configAuth ? '' : 'hidden';
+    
+    const innerHTML = rendy(Template, obj);
+    
+    Element = createElement('form', {
+        className: 'config',
+        innerHTML,
+    });
+    
+    const inputs = document.querySelectorAll('input, select', Element);
+    const [inputFirst] = inputs;
+    
+    let afterShow;
+    
+    if (inputFirst) {
+        onAuthChange(inputFirst.checked);
+        afterShow = inputFirst.focus.bind(inputFirst);
+    }
+    
+    const getTarget = ({target}) => target;
+    const handleChange = squad(onChange, getTarget);
+    
+    Array
+        .from(inputs)
+        .map(addKey(onKey))
+        .map(addChange(handleChange));
+    
+    const autoSize = true;
+    
+    CloudCmd.View.show(Element, {
+        autoSize,
+        afterShow,
+    });
+}
+
+module.exports.hide = hide;
+
+function hide() {
+    CloudCmd.View.hide();
+}
+
+async function onChange(el) {
+    const obj = {};
+    const name = input.getName(el);
+    const data = input.getValue(name, Element);
+    
+    if (name === 'name')
+        onNameChange(data);
+    else if (name === 'auth')
+        onAuthChange(data);
+    
+    obj[name] = data;
+    
+    await Config.save(obj);
+}
+
+function onSave(obj) {
+    for (const name of Object.keys(obj)) {
+        const data = obj[name];
+        
+        CloudCmd._config(name, data);
+        input.setValue(name, data, Element);
+    }
+}
+
+async function saveHttp(obj) {
+    const {RESTful} = DOM;
+    const [e] = await RESTful.Config.write(obj);
+    
+    if (e)
+        return;
+    
+    onSave(obj);
+}
+
+function onAuthChange(checked) {
+    const elUsername = input.getElementByName('username', Element);
+    const elPassword = input.getElementByName('password', Element);
+    
+    elUsername.disabled = !checked;
+    elPassword.disabled = !checked;
+}
+
+function onNameChange(name) {
+    setTitle(getTitle({
+        name,
+    }));
+}
+
+async function onKey({keyCode, target}) {
+    switch(keyCode) {
+    case Key.ESC:
+        return hide();
+    
+    case Key.ENTER:
+        return await onChange(target);
+    }
+}

client/modules/config/input.js

@@ -0,0 +1,75 @@
+'use strict';
+
+const currify = require('currify');
+
+const isType = currify((type, object, name) => type === typeof object[name]);
+
+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 = config;
+    const array = Object.keys(config);
+    
+    const filtered = array.filter(isBool(config));
+    
+    for (const name of filtered) {
+        const item = config[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;
+    
+    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;
+    
+    switch(type) {
+    case 'checkbox':
+        el.checked = value;
+        break;
+    
+    default:
+        el.value = value;
+        break;
+    }
+};

client/modules/contact.js

@@ -0,0 +1,41 @@
+/* global CloudCmd */
+/* global DOM */
+
+'use strict';
+
+CloudCmd.Contact = exports;
+
+const olark = require('@cloudcmd/olark');
+const Images = require('../dom/images.mjs');
+
+const {Events} = DOM;
+const {Key} = CloudCmd;
+
+module.exports.show = show;
+module.exports.hide = hide;
+
+module.exports.init = () => {
+    Events.addKey(onKey);
+    
+    olark.identify('6216-545-10-4223');
+    olark('api.box.onExpand', show);
+    olark('api.box.onShow', show);
+    olark('api.box.onShrink', hide);
+};
+
+function show() {
+    Key.unsetBind();
+    Images.hide();
+    
+    olark('api.box.expand');
+}
+
+function hide() {
+    Key.setBind();
+    olark('api.box.hide');
+}
+
+function onKey({keyCode}) {
+    if (keyCode === Key.ESC)
+        hide();
+}

client/modules/edit-file-vim.js

@@ -0,0 +1,45 @@
+'use strict';
+
+/* global CloudCmd */
+CloudCmd.EditFileVim = exports;
+
+const Events = require('#dom/events');
+
+const {Key} = CloudCmd;
+
+const ConfigView = {
+    bindKeys: false,
+    beforeClose: () => {
+        Events.rmKey(listener);
+        CloudCmd.EditFile.isChanged();
+    },
+};
+
+module.exports.init = async () => {
+    await CloudCmd.EditFile();
+};
+
+module.exports.show = async () => {
+    Events.addKey(listener);
+    
+    const editFile = await CloudCmd.EditFile.show(ConfigView);
+    
+    editFile
+        .getEditor()
+        .setKeyMap('vim');
+};
+
+module.exports.hide = hide;
+
+function hide() {
+    CloudCmd.Edit.hide();
+}
+
+function listener(event) {
+    const {keyCode, shiftKey} = event;
+    
+    if (shiftKey && keyCode === Key.ESC) {
+        event.preventDefault();
+        hide();
+    }
+}

client/modules/edit-file.js

@@ -0,0 +1,194 @@
+'use strict';
+
+/* global CloudCmd, DOM*/
+CloudCmd.EditFile = exports;
+
+const Format = require('format-io');
+const {fullstore} = require('fullstore');
+const exec = require('execon');
+const supermenu = require('supermenu');
+
+const Info = DOM.CurrentInfo;
+
+const {Dialog, Images} = DOM;
+
+const {config} = CloudCmd;
+
+let Menu;
+let MSG_CHANGED;
+
+const isLoading = fullstore();
+
+const ConfigView = {
+    beforeClose: async () => {
+        exec.ifExist(Menu, 'hide');
+        await isChanged();
+    },
+};
+
+module.exports.init = async () => {
+    isLoading(true);
+    
+    await CloudCmd.Edit();
+    
+    const editor = CloudCmd.Edit.getEditor();
+    authCheck(editor);
+    setListeners(editor);
+    
+    isLoading(false);
+};
+
+function getName() {
+    const {name, isDir} = Info;
+    
+    if (isDir)
+        return `${name}.json`;
+    
+    return name;
+}
+
+module.exports.show = async (options) => {
+    if (isLoading())
+        return;
+    
+    const optionsEdit = {
+        ...ConfigView,
+        ...options,
+    };
+    
+    if (CloudCmd.config('showFileName'))
+        optionsEdit.title = Info.name;
+    
+    Images.show.load();
+    
+    CloudCmd.Edit
+        .getEditor()
+        .setOption('keyMap', 'default');
+    
+    const [error, data] = await Info.getData();
+    
+    if (error) {
+        Images.hide();
+        return CloudCmd.Edit;
+    }
+    
+    const {path} = Info;
+    const name = getName();
+    
+    setMsgChanged(name);
+    
+    CloudCmd.Edit
+        .getEditor()
+        .setValueFirst(path, data)
+        .setModeForPath(name)
+        .enableKey();
+    
+    CloudCmd.Edit.show(optionsEdit);
+    
+    return CloudCmd.Edit;
+};
+
+module.exports.hide = hide;
+
+function hide() {
+    CloudCmd.Edit.hide();
+}
+
+function setListeners(editor) {
+    const element = CloudCmd.Edit.getElement();
+    
+    DOM.Events.addOnce('contextmenu', element, setMenu);
+    
+    editor.on('save', (value) => {
+        DOM.setCurrentSize(Format.size(value));
+    });
+}
+
+function authCheck(spawn) {
+    spawn.emit('auth', config('username'), config('password'));
+    spawn.on('reject', () => {
+        Dialog.alert('Wrong credentials!');
+    });
+}
+
+function setMenu(event) {
+    const position = {
+        x: event.clientX,
+        y: event.clientY,
+    };
+    
+    event.preventDefault();
+    
+    if (Menu)
+        return;
+    
+    const options = {
+        beforeShow: (params) => {
+            params.x -= 18;
+            params.y -= 27;
+        },
+        
+        afterClick: () => {
+            CloudCmd.Edit
+                .getEditor()
+                .focus();
+        },
+    };
+    
+    const element = CloudCmd.Edit.getElement();
+    
+    Menu = supermenu(element, options, getMenuData());
+    
+    Menu.addContextMenuListener();
+    Menu.show(position.x, position.y);
+}
+
+function getMenuData() {
+    const editor = CloudCmd.Edit.getEditor();
+    
+    return {
+        'Save           Ctrl+S': () => {
+            editor.save();
+        },
+        'Go To Line     Ctrl+G': () => {
+            editor.goToLine();
+        },
+        'Cut            Ctrl+X': () => {
+            editor.cutToClipboard();
+        },
+        'Copy           Ctrl+C': () => {
+            editor.copyToClipboard();
+        },
+        'Paste          Ctrl+V': () => {
+            editor.pasteFromClipboard();
+        },
+        'Delete         Del': () => {
+            editor.remove('right');
+        },
+        'Select All     Ctrl+A': () => {
+            editor.selectAll();
+        },
+        'Close          Esc': hide,
+    };
+}
+
+function setMsgChanged(name) {
+    MSG_CHANGED = `Do you want to save changes to ${name}?`;
+}
+
+module.exports.isChanged = isChanged;
+
+async function isChanged() {
+    const editor = CloudCmd.Edit.getEditor();
+    const is = editor.isChanged();
+    
+    if (!is)
+        return;
+    
+    const [cancel] = await Dialog.confirm(MSG_CHANGED);
+    
+    if (cancel)
+        return;
+    
+    editor.save();
+}

client/modules/edit-names-vim.js

@@ -0,0 +1,43 @@
+'use strict';
+
+/* global CloudCmd */
+CloudCmd.EditNamesVim = exports;
+
+const Events = require('#dom/events');
+const {Key} = CloudCmd;
+
+const ConfigView = {
+    bindKeys: false,
+    beforeClose: () => {
+        Events.rmKey(listener);
+        CloudCmd.EditNames.isChanged();
+    },
+};
+
+module.exports.init = async () => {
+    await CloudCmd.EditNames();
+};
+
+module.exports.show = () => {
+    Events.addKey(listener);
+    
+    CloudCmd.EditNames
+        .show(ConfigView)
+        .getEditor()
+        .setKeyMap('vim');
+};
+
+module.exports.hide = hide;
+
+function hide() {
+    CloudCmd.Edit.hide();
+}
+
+function listener(event) {
+    const {keyCode, shiftKey} = event;
+    
+    if (shiftKey && keyCode === Key.ESC) {
+        event.preventDefault();
+        hide();
+    }
+}

client/modules/edit-names.js

@@ -0,0 +1,216 @@
+'use strict';
+
+const {tryToCatch} = require('try-to-catch');
+
+/* global CloudCmd, DOM */
+CloudCmd.EditNames = exports;
+
+const exec = require('execon');
+const supermenu = require('supermenu');
+const {multiRename} = require('multi-rename');
+
+const Info = DOM.CurrentInfo;
+const {Dialog} = DOM;
+
+let Menu;
+
+const ConfigView = {
+    beforeClose: async () => {
+        exec.ifExist(Menu, 'hide');
+        DOM.Events.remove('keydown', keyListener);
+        await isChanged();
+    },
+};
+
+module.exports.init = async () => {
+    await CloudCmd.Edit();
+    
+    setListeners();
+};
+
+module.exports.show = (options) => {
+    const names = getActiveNames().join('\n');
+    const config = {
+        ...ConfigView,
+        ...options,
+    };
+    
+    if (Info.name === '..' && names.length === 1)
+        return Dialog.alert.noFiles();
+    
+    DOM.Events.addKey(keyListener);
+    
+    CloudCmd.Edit
+        .getEditor()
+        .setValueFirst('edit-names', names)
+        .setMode()
+        .setOption('keyMap', 'default')
+        .disableKey();
+    
+    CloudCmd.Edit.show(config);
+    
+    return CloudCmd.Edit;
+};
+
+async function keyListener(event) {
+    const ctrl = event.ctrlKey;
+    const meta = event.metaKey;
+    const ctrlMeta = ctrl || meta;
+    const {Key} = CloudCmd;
+    
+    if (ctrlMeta && event.keyCode === Key.S) {
+        hide();
+    } else if (ctrlMeta && event.keyCode === Key.P) {
+        const [, pattern] = await Dialog.prompt('Apply pattern:', '[n][e]');
+        pattern && applyPattern(pattern);
+    }
+}
+
+function applyPattern(pattern) {
+    const newNames = multiRename(pattern, getActiveNames());
+    const editor = CloudCmd.Edit.getEditor();
+    
+    editor.setValue(newNames.join('\n'));
+}
+
+function getActiveNames() {
+    return DOM.getFilenames(DOM.getActiveFiles());
+}
+
+module.exports.hide = hide;
+
+function hide() {
+    CloudCmd.Edit.hide();
+}
+
+function setListeners() {
+    const element = CloudCmd.Edit.getElement();
+    
+    DOM.Events.addOnce('contextmenu', element, setMenu);
+}
+
+async function applyNames() {
+    const dir = Info.dirPath;
+    const from = getActiveNames();
+    const nameIndex = from.indexOf(Info.name);
+    
+    const editor = CloudCmd.Edit.getEditor();
+    const to = editor
+        .getValue()
+        .split('\n');
+    
+    const root = CloudCmd.config('root');
+    
+    const response = rename(dir, from, to, root);
+    const [error] = await tryToCatch(refresh, to, nameIndex, response);
+    
+    if (error)
+        alert(error);
+}
+
+function refresh(to, nameIndex, res) {
+    if (res.status === 404) {
+        const error = res.text();
+        throw error;
+    }
+    
+    const currentName = to[nameIndex];
+    
+    CloudCmd.refresh({
+        currentName,
+    });
+}
+
+function getDir(root, dir) {
+    if (root === '/')
+        return dir;
+    
+    return root + dir;
+}
+
+function rename(path, from, to, root) {
+    const dir = getDir(root, path);
+    const {prefix} = CloudCmd;
+    
+    return fetch(`${prefix}/rename`, {
+        method: 'put',
+        credentials: 'include',
+        body: JSON.stringify({
+            from,
+            to,
+            dir,
+        }),
+    });
+}
+
+function setMenu(event) {
+    const position = {
+        x: event.clientX,
+        y: event.clientY,
+    };
+    
+    event.preventDefault();
+    
+    if (Menu)
+        return;
+    
+    const editor = CloudCmd.Edit.getEditor();
+    
+    const options = {
+        beforeShow: (params) => {
+            params.x -= 18;
+            params.y -= 27;
+        },
+        
+        afterClick: () => {
+            editor.focus();
+        },
+    };
+    
+    const menuData = {
+        'Save           Ctrl+S': async () => {
+            await applyNames();
+            hide();
+        },
+        'Go To Line     Ctrl+G': () => {
+            editor.goToLine();
+        },
+        'Cut            Ctrl+X': () => {
+            editor.cutToClipboard();
+        },
+        'Copy           Ctrl+C': () => {
+            editor.copyToClipboard();
+        },
+        'Paste          Ctrl+V': () => {
+            editor.pasteFromClipboard();
+        },
+        'Delete         Del': () => {
+            editor.remove('right');
+        },
+        'Select All     Ctrl+A': () => {
+            editor.selectAll();
+        },
+        'Close          Esc': hide,
+    };
+    
+    const element = CloudCmd.Edit.getElement();
+    
+    Menu = supermenu(element, options, menuData);
+    
+    Menu.addContextMenuListener();
+    Menu.show(position.x, position.y);
+}
+
+module.exports.isChanged = isChanged;
+
+async function isChanged() {
+    const editor = CloudCmd.Edit.getEditor();
+    const msg = 'Apply new names?';
+    
+    if (!editor.isChanged())
+        return;
+    
+    const [cancel] = await Dialog.confirm(msg);
+    
+    !cancel && await applyNames();
+}

client/modules/edit.js

@@ -0,0 +1,122 @@
+/* global CloudCmd */
+
+'use strict';
+
+const montag = require('montag');
+
+const {promisify} = require('es6-promisify');
+const {tryToCatch} = require('try-to-catch');
+const createElement = require('@cloudcmd/create-element');
+const load = require('load.js');
+const {MAX_FILE_SIZE: maxSize} = require('../../common/cloudfunc.mjs');
+
+const {time, timeEnd} = require('../../common/util');
+const getEditor = () => editor;
+const isFn = (a) => typeof a === 'function';
+const loadJS = load.js;
+
+const Name = 'Edit';
+
+CloudCmd[Name] = exports;
+
+const EditorName = CloudCmd.config('editor');
+
+let Loading = true;
+let Element;
+let editor;
+
+const ConfigView = {
+    afterShow: () => {
+        editor
+            .moveCursorTo(0, 0)
+            .focus();
+    },
+};
+
+module.exports.init = async () => {
+    const element = create();
+    
+    await CloudCmd.View();
+    await loadFiles(element);
+};
+
+function create() {
+    const element = createElement('div', {
+        style: montag`
+            width: 100%;
+            height: 100%;
+            font-family: "Droid Sans Mono";
+        `,
+        notAppend: true,
+    });
+    
+    Element = element;
+    
+    return element;
+}
+
+function checkFn(name, fn) {
+    if (!isFn(fn))
+        throw Error(`${name} should be a function!`);
+}
+
+function initConfig(options = {}) {
+    const config = {
+        ...options,
+        ...ConfigView,
+    };
+    
+    if (!options.afterShow)
+        return config;
+    
+    checkFn('options.afterShow', options.afterShow);
+    
+    config.afterShow = () => {
+        ConfigView.afterShow();
+        options.afterShow();
+    };
+    
+    return config;
+}
+
+module.exports.show = (options) => {
+    if (Loading)
+        return;
+    
+    CloudCmd.View.show(Element, initConfig(options));
+    
+    getEditor().setOptions({
+        fontSize: 16,
+    });
+};
+
+module.exports.getEditor = getEditor;
+
+module.exports.getElement = () => Element;
+
+module.exports.hide = () => {
+    CloudCmd.View.hide();
+};
+
+const loadFiles = async (element) => {
+    const prefix = `${CloudCmd.prefix}/${EditorName}`;
+    const socketPath = CloudCmd.prefix;
+    const prefixSocket = `${CloudCmd.prefixSocket}/${EditorName}`;
+    const url = `${prefix}/${EditorName}.js`;
+    
+    time(`${Name} load`);
+    
+    await loadJS(url);
+    
+    const word = promisify(window[EditorName]);
+    const [ed] = await tryToCatch(word, element, {
+        maxSize,
+        prefix,
+        prefixSocket,
+        socketPath,
+    });
+    
+    timeEnd(`${Name} load`);
+    editor = ed;
+    Loading = false;
+};

client/modules/help.js

@@ -0,0 +1,27 @@
+'use strict';
+
+/* global CloudCmd */
+CloudCmd.Help = exports;
+
+const Images = require('../dom/images.mjs');
+
+module.exports.init = () => {
+    Images.show.load('top');
+};
+
+module.exports.show = show;
+module.exports.hide = hide;
+
+function show() {
+    const positionLoad = 'top';
+    const relative = true;
+    
+    CloudCmd.Markdown.show('/HELP.md', {
+        positionLoad,
+        relative,
+    });
+}
+
+function hide() {
+    CloudCmd.View.hide();
+}

client/modules/konsole.js

@@ -0,0 +1,141 @@
+'use strict';
+
+/* global CloudCmd */
+/* global Util */
+/* global DOM */
+/* global Console */
+CloudCmd.Konsole = exports;
+
+const exec = require('execon');
+const currify = require('currify');
+const {tryToCatch} = require('try-to-catch');
+const loadJS = require('load.js').js;
+const createElement = require('@cloudcmd/create-element');
+
+const Images = require('../dom/images.mjs');
+const {Dialog, CurrentInfo: Info} = DOM;
+
+const rmLastSlash = (a) => a.replace(/\/$/, '') || '/';
+
+let konsole;
+const {config} = CloudCmd;
+
+const cd = currify((fn, dir) => fn(`cd ${rmLastSlash(dir)}`));
+
+const Name = 'Konsole';
+
+let Element;
+let Loaded;
+
+module.exports.init = async () => {
+    if (!config('console'))
+        return;
+    
+    Images.show.load('top');
+    
+    await CloudCmd.View();
+    await load();
+    await create();
+};
+
+module.exports.hide = () => {
+    CloudCmd.View.hide();
+};
+
+module.exports.clear = () => {
+    konsole.clear();
+};
+
+const getPrefix = () => CloudCmd.prefix + '/console';
+
+function getPrefixSocket() {
+    return CloudCmd.prefixSocket + '/console';
+}
+
+const getEnv = () => ({
+    ACTIVE_DIR: DOM.getCurrentDirPath.bind(DOM),
+    PASSIVE_DIR: DOM.getNotCurrentDirPath.bind(DOM),
+    CURRENT_NAME: DOM.getCurrentName.bind(DOM),
+    CURRENT_PATH: () => Info.path,
+});
+
+async function onPath(path) {
+    if (Info.dirPath === path)
+        return;
+    
+    await CloudCmd.changeDir(path);
+}
+
+const getDirPath = () => {
+    if (config('syncConsolePath'))
+        return Info.dirPath;
+};
+
+const create = async () => {
+    const options = {
+        cwd: getDirPath(),
+        env: getEnv(),
+        prefix: getPrefix(),
+        prefixSocket: getPrefixSocket(),
+        socketPath: CloudCmd.prefix,
+    };
+    
+    Element = createElement('div', {
+        className: 'console',
+    });
+    
+    konsole = await Console(Element, options);
+    
+    konsole.on('connect', exec.with(authCheck, konsole));
+    konsole.on('path', config.if('syncConsolePath', onPath));
+    
+    CloudCmd.on('active-dir', config.if('syncConsolePath', cd(konsole.handler)));
+    
+    konsole.addShortCuts({
+        P: () => {
+            const command = konsole.getPromptText();
+            const path = DOM.getCurrentDirPath();
+            
+            konsole.setPromptText(command + path);
+        },
+    });
+};
+
+function authCheck(konsole) {
+    konsole.emit('auth', config('username'), config('password'));
+    
+    konsole.on('reject', () => {
+        Dialog.alert('Wrong credentials!');
+    });
+}
+
+module.exports.show = (callback) => {
+    if (!Loaded)
+        return;
+    
+    if (!config('console'))
+        return;
+    
+    CloudCmd.View.show(Element, {
+        afterShow: () => {
+            konsole.focus();
+            exec(callback);
+        },
+    });
+};
+
+const load = async () => {
+    Util.time(`${Name} load`);
+    
+    const prefix = getPrefix();
+    const url = `${prefix}/console.js`;
+    const [error] = await tryToCatch(loadJS, url);
+    
+    Loaded = true;
+    Util.timeEnd(`${Name} load`);
+    
+    if (error)
+        return Dialog.alert(error.message, {
+            cancel: false,
+        });
+};

client/modules/markdown.js

@@ -0,0 +1,47 @@
+'use strict';
+
+/* global CloudCmd */
+CloudCmd.Markdown = exports;
+
+const createElement = require('@cloudcmd/create-element');
+
+const Images = require('../dom/images.mjs');
+const {Markdown} = require('../dom/rest');
+const {alert} = require('../dom/dialog');
+
+module.exports.init = async () => {
+    Images.show.load('top');
+    await CloudCmd.View();
+};
+
+module.exports.show = show;
+
+module.exports.hide = () => {
+    CloudCmd.View.hide();
+};
+
+async function show(name, options = {}) {
+    const {positionLoad, relative} = options;
+    
+    Images.show.load(positionLoad);
+    
+    if (relative)
+        name += '?relative';
+    
+    const [error, innerHTML] = await Markdown.read(name);
+    Images.hide();
+    
+    if (error)
+        return alert(error.message, {
+            cancel: false,
+        });
+    
+    const className = 'help';
+    
+    const div = createElement('div', {
+        className,
+        innerHTML,
+    });
+    
+    CloudCmd.View.show(div);
+}

client/modules/menu/cloudmenu.mjs

@@ -0,0 +1,30 @@
+import supermenu from 'supermenu';
+
+const noop = () => {};
+const {CloudCmd} = globalThis;
+
+export const createCloudMenu = async (fm, options, menuData) => {
+    const createMenu = await loadMenu();
+    const menu = await createMenu(fm, options, menuData);
+    
+    menu.addContextMenuListener = menu.addContextMenuListener || noop;
+    
+    return menu;
+};
+
+async function loadMenu() {
+    if (CloudCmd.config('menu') === 'aleman') {
+        const {host, protocol} = globalThis.location;
+        const url = `${protocol}//${host}/node_modules/aleman/menu/menu.js`;
+        const {createMenu} = await import(/* webpackIgnore: true */url);
+        
+        return createMenu;
+    }
+    
+    return createSupermenu;
+}
+
+function createSupermenu(name, options, menuData) {
+    const element = document.querySelector('[data-name="js-fm"]');
+    return supermenu(element, options, menuData);
+}

client/modules/menu/index.js

@@ -0,0 +1,357 @@
+/* global CloudCmd, DOM */
+
+'use strict';
+
+const exec = require('execon');
+const wrap = require('wraptile');
+const createElement = require('@cloudcmd/create-element');
+
+const {FS} = require('../../../common/cloudfunc.mjs');
+const {getIdBySrc} = require('../../dom/load');
+const RESTful = require('../../dom/rest');
+
+const {config, Key} = CloudCmd;
+
+const {
+    Buffer,
+    Events,
+    Dialog,
+    Images,
+} = DOM;
+
+const Info = DOM.CurrentInfo;
+const alertNoFiles = Dialog.alert.noFiles;
+const uploadTo = wrap(_uploadTo);
+
+let MenuShowedName;
+let MenuContext;
+let MenuContextFile;
+
+module.exports.ENABLED = false;
+
+CloudCmd.Menu = exports;
+
+module.exports.init = async () => {
+    const {isAuth, menuDataFile} = getFileMenuData();
+    
+    const fm = DOM.getFM();
+    const menuData = getMenuData(isAuth);
+    
+    const options = getOptions({
+        type: 'context',
+    });
+    
+    const optionsFile = getOptions({
+        type: 'file',
+    });
+    
+    const {createCloudMenu} = await import('./cloudmenu.mjs');
+    
+    const {name} = fm.dataset;
+    
+    MenuContext = await createCloudMenu(name, options, menuData);
+    MenuContextFile = await createCloudMenu(name, optionsFile, menuDataFile);
+    
+    MenuContext.addContextMenuListener();
+    MenuContextFile.addContextMenuListener();
+    
+    Events.addKey(listener);
+};
+
+module.exports.hide = hide;
+
+function hide() {
+    MenuContext.hide();
+    MenuContextFile.hide();
+}
+
+module.exports.show = (position) => {
+    const {x, y} = getPosition(position);
+    
+    MenuContext.show(x, y);
+    MenuContextFile.show(x, y);
+    
+    Images.hide();
+};
+
+function getPosition(position) {
+    if (position)
+        return {
+            x: position.x,
+            y: position.y,
+        };
+    
+    return getCurrentPosition();
+}
+
+function getMenuNameByEl(el) {
+    if (!el)
+        return 'context';
+    
+    const name = DOM.getCurrentName(el);
+    
+    if (name === '..')
+        return 'context';
+    
+    return 'contextFile';
+}
+
+function getOptions({type}) {
+    let name;
+    let func;
+    
+    if (type === 'context') {
+        name = 'context';
+        func = Key.unsetBind;
+    } else if (type === 'file') {
+        name = 'contextFile';
+    }
+    
+    const options = {
+        icon: true,
+        infiniteScroll: false,
+        beforeClose: Key.setBind,
+        beforeHide: Key.setBind,
+        beforeShow: exec.with(beforeShow, func),
+        beforeClick,
+        name,
+    };
+    
+    return options;
+}
+
+function getMenuData(isAuth) {
+    const menu = {
+        'Paste': Buffer.paste,
+        'New': {
+            File: DOM.promptNewFile,
+            Directory: DOM.promptNewDir,
+        },
+        'Upload': () => {
+            CloudCmd.Upload.show();
+        },
+        'Upload From Cloud': uploadFromCloud,
+        'Toggle File Selection': DOM.toggleSelectedFile,
+        '(Un)Select All': DOM.toggleAllSelectedFiles,
+    };
+    
+    if (isAuth)
+        menu['Log Out'] = CloudCmd.logOut;
+    
+    return menu;
+}
+
+function getFileMenuData() {
+    const isAuth = CloudCmd.config('auth');
+    
+    const menuBottom = getMenuData(isAuth);
+    const menuTop = {
+        'View': () => {
+            CloudCmd.View.show();
+        },
+        'Edit': () => {
+            const name = config('vim') ? 'EditFileVim' : 'EditFile';
+            CloudCmd[name].show();
+        },
+        'Rename': () => {
+            setTimeout(DOM.renameCurrent, 100);
+        },
+        'Delete': () => {
+            CloudCmd.Operation.show('delete');
+        },
+        'Pack': () => {
+            CloudCmd.Operation.show('pack');
+        },
+        'Extract': () => {
+            CloudCmd.Operation.show('extract');
+        },
+        'Download': preDownload,
+        'Upload To Cloud': uploadTo('Cloud'),
+        'Cut': () => {
+            isCurrent(Buffer.cut, alertNoFiles);
+        },
+        'Copy': () => {
+            isCurrent(Buffer.copy, alertNoFiles);
+        },
+    };
+    
+    const menuDataFile = {
+        ...menuTop,
+        ...menuBottom,
+    };
+    
+    return {
+        isAuth,
+        menuDataFile,
+    };
+}
+
+function isCurrent(yesFn, noFn) {
+    if (Info.name !== '..')
+        return yesFn();
+    
+    noFn();
+}
+
+function isPath(x, y) {
+    const {panel} = Info;
+    const isEmptyRoot = !panel;
+    
+    if (isEmptyRoot)
+        return false;
+    
+    const el = document.elementFromPoint(x, y);
+    const elements = panel.querySelectorAll('[data-name="js-path"] *');
+    
+    return !~[].indexOf.call(elements, el);
+}
+
+function beforeShow(callback, params) {
+    Key.unsetBind();
+    
+    const {
+        name,
+        position = {
+            x: params.x,
+            y: params.y,
+        },
+    } = params;
+    
+    const {x, y} = position;
+    
+    const el = DOM.getCurrentByPosition({
+        x,
+        y,
+    });
+    
+    const menuName = getMenuNameByEl(el);
+    
+    let isShow = menuName !== 'contextFile';
+    
+    if (params.name === 'contextFile')
+        isShow = !isShow;
+    
+    if (isShow)
+        MenuShowedName = name;
+    
+    exec(callback);
+    
+    if (isShow)
+        isShow = isPath(x, y);
+    
+    return isShow;
+}
+
+const beforeClick = (name) => MenuShowedName !== name;
+
+async function _uploadTo(nameModule) {
+    const [error, data] = await Info.getData();
+    
+    if (error)
+        return;
+    
+    const {name} = Info;
+    
+    CloudCmd.execFromModule(nameModule, 'uploadFile', name, data);
+    CloudCmd.log(`Uploading to ${name}...`);
+}
+
+function uploadFromCloud() {
+    Images.show.load('top');
+    
+    CloudCmd.execFromModule('Cloud', 'saveFile', async (currentName, data) => {
+        const path = DOM.getCurrentDirPath() + currentName;
+        const [e] = await RESTful.write(path, data);
+        
+        if (e)
+            return;
+        
+        await CloudCmd.refresh({
+            currentName,
+        });
+    });
+}
+
+function preDownload() {
+    download(config('packer'));
+}
+
+function download(type) {
+    const TIME = 30 * 1000;
+    const {prefixURL} = CloudCmd;
+    const PACK = '/pack';
+    const date = Date.now();
+    const files = DOM.getActiveFiles();
+    
+    if (!files.length)
+        return alertNoFiles();
+    
+    for (const file of files) {
+        const selected = DOM.isSelected(file);
+        const isDir = DOM.isCurrentIsDir(file);
+        const path = DOM.getCurrentPath(file);
+        
+        CloudCmd.log(`downloading file ${path}...`);
+        
+        /*
+          * if we send ajax request -
+          * no need in hash so we escape #
+          * and all other characters, like "%"
+          */
+        const encodedPath = encodeURI(path).replace(/#/g, '%23');
+        const id = getIdBySrc(path);
+        
+        let src;
+        
+        if (isDir)
+            src = prefixURL + PACK + encodedPath + DOM.getPackerExt(type);
+        else
+            src = prefixURL + FS + encodedPath + '?download';
+        
+        const element = createElement('iframe', {
+            id: id + '-' + date,
+            async: false,
+            className: 'hidden',
+            src,
+        });
+        
+        const {body} = document;
+        const removeChild = body.removeChild.bind(body, element);
+        
+        setTimeout(removeChild, TIME);
+        
+        if (selected)
+            DOM.toggleSelectedFile(file);
+    }
+}
+
+function getCurrentPosition() {
+    const current = Info.element;
+    const rect = current.getBoundingClientRect();
+    
+    const position = {
+        x: Math.round(rect.left + rect.width / 3),
+        y: Math.round(rect.top),
+    };
+    
+    return position;
+}
+
+function listener(event) {
+    const {F9, ESC} = Key;
+    
+    const key = event.keyCode;
+    const isBind = Key.isBind();
+    
+    if (key === ESC) {
+        Key.setBind();
+        return hide();
+    }
+    
+    if (isBind && key === F9) {
+        const position = getCurrentPosition();
+        MenuContext.show(position.x, position.y);
+        
+        event.preventDefault();
+    }
+}

client/modules/operation/format.js

@@ -0,0 +1,8 @@
+'use strict';
+
+module.exports = (operation, from, to) => {
+    if (!to)
+        return `${operation} ${from}`;
+    
+    return `${operation} ${from} -> ${to}`;
+};

client/modules/operation/get-next-current-name.js

@@ -0,0 +1,18 @@
+'use strict';
+
+const currify = require('currify');
+
+const not = currify((array, value) => !array.includes(value));
+const notOneOf = currify((a, b) => a.filter(not(b)));
+
+module.exports = (currentName, names, removedNames) => {
+    const i = names.indexOf(currentName);
+    
+    const nextNames = notOneOf(names, removedNames);
+    const {length} = nextNames;
+    
+    if (nextNames[i])
+        return nextNames[i];
+    
+    return nextNames[length - 1];
+};