User Menu Cookbook

User Menu is a power feature of Cloud Commander that was added in v12.2.0.

If you create file .cloudcmd.menu.js in the HOME or any top-level directory, it will be used when you press F2.

Here you can find ready to use scripts for your user menu. You can combine them in any way, and also add yours 😉.

Rename file

The simplest way to show rename file dialog.

export default {
    'F2 - Rename file': async ({DOM}) => {
        await DOM.renameCurrent();
    },
};

Copy URL to current file

export default {
    'F6 - Copy URL to Current File': async ({DOM}) => {
        const {path} = DOM.CurrentInfo;
        const url = `${window.location.href}${path}`;
        const {default: clipboard}  = await import('https://cdn.skypack.dev/@cloudcmd/clipboard');
        
        await clipboard.writeText(url); 
    }
}

Convert flac to mp3

Simple example of running bash scripts with help of TerminalRun.

'use strict';

const isMp3 = (a) => /\.mp3$/.test(a);

export default {
    'F - Convert flac to mp3': async ({DOM, CloudCmd}) => {
        const {IO, CurrentInfo} = DOM;

        const root = CloudCmd.config('root');
        const {dirPath, files} = CurrentInfo;
        const cwd = `${root}${dirPath}`;

        const convert = 'for f in *.flac; do ffmpeg -vsync 2 -i "$f" -b:a 320k "${f%flac}mp3"; done';
        const exitCode = await CloudCmd.TerminalRun.show({
            cwd,
            command: `bash -c '${convert}'`,
        });

        if (exitCode)
            return;

        await CloudCmd.refresh();

        const mp3Dir = `${cwd}mp3`;

        const names = DOM.getFilenames(files);
        const mp3Names = names.filter(isMp3);

        await IO.createDirectory(mp3Dir);      
        await IO.move(dirPath, mp3Dir, mp3Names);

        await CloudCmd.refresh();
    },
};

async function createDefaultMenu({path, data, DOM, CloudCmd}) {
    const {IO} = DOM;

    await IO.write(path, data);
    await CloudCmd.refresh();

    DOM.setCurrentByName('.cloudcmd.menu.js');

    await CloudCmd.EditFile.show();
}

async function readDefaultMenu({prefix}) {
    const res = await fetch(`${prefix}/api/v1/user-menu/default`);
    const data = await res.text();

    return data;
}

Create User Menu File

This is how you can create .cloudcmd.menu.js file.

export default {
    'C - Create User Menu File': async ({DOM, CloudCmd}) => {
        const {CurrentInfo} = DOM;
        
        const {dirPath} = CurrentInfo;
        const path = `${dirPath}.cloudcmd.menu.js`;
        const {prefix} = CloudCmd;
        
        const data = await readDefaultMenu({prefix});
        await createDefaultMenu({
            path,
            data,
            DOM,
            CloudCmd,
        });
    },
};

async function createDefaultMenu({path, data, DOM, CloudCmd}) {
    const {IO} = DOM;
    
    await IO.write(path, data);
    await CloudCmd.refresh();
    
    DOM.setCurrentByName('.cloudcmd.menu.js');
    
    await CloudCmd.EditFile.show();
}

async function readDefaultMenu({prefix}) {
    const res = await fetch(`${prefix}/api/v1/user-menu/default`);
    const data = await res.text();
    
    return data;
}

Compare Directories

export default { 
    'D - Compare directories': async ({DOM}) => {
        const {
            CurrentInfo,
            getFilenames,
            getCurrentByName,
            selectFile,
        } = DOM;
        
        const {
            files,
            filesPassive,
            panel,
            panelPassive,
        } = CurrentInfo;

        const names = getFilenames(files);
        const namesPassive = getFilenames(filesPassive);

        const selectedNames = compare(names, namesPassive);
        const selectedNamesPassive = compare(namesPassive, names);

        selectNames(selectedNames, panel, {
            selectFile,
            getCurrentByName,
        });

        selectNames(selectedNamesPassive, panelPassive, {
            selectFile,
            getCurrentByName,
        });
    },
}

function selectNames(names, panel, {selectFile, getCurrentByName}) {
    for (const name of names) {
        const file = getCurrentByName(name, panel);
        selectFile(file);
    }
};

function compare(a, b) {
    const result = [];

    for (const el of a) {
        if (b.includes(el))
            continue;

        result.push(el);
    }

    return result;
}

Execute Npm Script

export default {
    'D - Build Dev': async ({CloudCmd}) => {
        await CloudCmd.TerminalRun.show({
            command: 'npm run build:client:dev',
            autoClose: false,
            // custom close message
            closeMessage: 'Press any button to close Terminal',
        });

        await CloudCmd.refresh();
    },
    'P - Build Prod': async ({CloudCmd}) => {
        await CloudCmd.TerminalRun.show({
            command: 'npm run build:client',
            // close window when done
            autoClose: true,
        });

        await CloudCmd.refresh();
    },
}