pywebexec 1.1.2__py3-none-any.whl → 1.4.12__py3-none-any.whl

pywebexec/static/js/commands.js

@@ -0,0 +1,223 @@
+// commands.js
+let commandInput = document.getElementById('commandName');
+let paramsInput = document.getElementById('params');
+let commandListSelect = document.getElementById('commandList');
+let showCommandListButton = document.getElementById('showCommandListButton');
+let isHandlingKeydown = false;
+
+function unfilterCommands() {
+    const options = commandListSelect.options;
+    for (let i = 0; i < options.length; i++) {
+        options[i].style.display = 'block';
+    }
+    commandListSelect.size = Math.min(20, commandListSelect.options.length);
+}
+
+function filterCommands() {
+    const value = commandInput.value.slice(0, commandInput.selectionStart);
+    const options = commandListSelect.options;
+    let nbVisibleItems = 0;
+    for (let i = 0; i < options.length; i++) {
+        if (options[i].text.startsWith(value)) {
+            options[i].style.display = 'block';
+            nbVisibleItems += 1;
+        } else {
+            options[i].style.display = 'none';
+        }
+    }
+    if (nbVisibleItems > 1) {
+        commandListSelect.size = Math.min(20, nbVisibleItems);
+        commandListSelect.style.display = 'block';
+    } else {
+        commandListSelect.style.display = 'none';
+    }
+}
+
+function setCommandListPosition() {
+    const rect = commandInput.getBoundingClientRect();
+    commandListSelect.style.left = `${rect.left}px`;
+    commandListSelect.style.top = `${rect.bottom}px`;
+}
+
+function adjustInputWidth(input) {
+    input.style.width = 'auto';
+    input.style.width = `${input.scrollWidth}px`;
+}
+
+
+paramsInput.addEventListener('input', () => adjustInputWidth(paramsInput));
+commandInput.addEventListener('input', () => {
+    adjustInputWidth(commandInput);
+    filterCommands(); // Filter commands on input
+});
+
+paramsInput.addEventListener('mouseover', () => {
+    paramsInput.focus();
+    paramsInput.setSelectionRange(0, paramsInput.value.length);
+});
+
+commandInput.addEventListener('mouseover', () => {
+    commandInput.focus();
+    commandInput.setSelectionRange(0, commandInput.value.length);
+});
+
+commandInput.addEventListener('input', (event) => {
+    if (event.inputType === 'deleteContentBackward') {
+        const newValue = commandInput.value.slice(0, -1);
+        commandInput.value = newValue;
+        commandInput.setSelectionRange(newValue.length, newValue.length);
+    }
+    const value = commandInput.value;
+    const options = commandListSelect.options;
+    if (value) {
+        const match = Array.from(options).find(option => option.text.startsWith(value));
+        if (match) {
+            commandInput.value = match.text;
+            commandInput.setSelectionRange(value.length, match.text.length);
+        } else {
+            commandInput.value = value.slice(0, -1);
+        }
+    }
+    filterCommands();
+    adjustInputWidth(commandInput); // Adjust width on input
+});
+
+commandInput.addEventListener('keydown', (event) => {
+    if (event.key === ' ' || event.key === 'ArrowRight') {
+        event.preventDefault();
+        paramsInput.focus();
+        paramsInput.setSelectionRange(0, paramsInput.value.length);
+    } else if (event.key === 'ArrowDown') {
+        /*setCommandListPosition();*/
+        unfilterCommands();
+        if (commandListSelect.options.length > 1) {
+            commandListSelect.style.display = 'block';
+            commandListSelect.focus();
+            commandListSelect.selectedIndex = 0;
+        }
+        event.preventDefault();
+    }
+});
+
+paramsInput.addEventListener('keydown', (event) => {
+    if (paramsInput.selectionStart > 0) return;
+    if (event.key === 'ArrowLeft') {
+        commandInput.focus();
+        commandInput.setSelectionRange(0, commandInput.value.length);
+        event.preventDefault();
+        return;
+    }
+    if (event.key === 'Backspace') {
+        val = paramsInput.value
+        paramsInput.value = val.slice(0, paramsInput.selectionStart) + val.slice(paramsInput.selectionEnd)
+        commandInput.focus();
+        commandInput.setSelectionRange(0, commandInput.value.length);
+        event.preventDefault();
+    }
+});
+
+commandListSelect.addEventListener('keydown', (event) => {
+    if (event.key === 'Enter') {
+        event.preventDefault(); // Prevent form submission
+        const selectedOption = commandListSelect.options[commandListSelect.selectedIndex];
+        commandInput.value = selectedOption.text;
+        commandListSelect.style.display = 'none';
+        adjustInputWidth(commandInput);
+        paramsInput.focus();
+        return;
+    }
+    if (event.key === 'ArrowUp' && commandListSelect.selectedIndex == 0) {
+        commandInput.focus();
+        commandListSelect.style.display = 'none'
+    }
+});
+
+commandListSelect.addEventListener('click', (event) => {
+    event.preventDefault(); // Prevent form submission
+    const selectedOption = commandListSelect.options[commandListSelect.selectedIndex];
+    commandInput.value = selectedOption.text;
+    commandListSelect.style.display = 'none';
+    adjustInputWidth(commandInput);
+    paramsInput.focus();
+});
+
+
+commandInput.addEventListener('click', () => {
+    setCommandListPosition();
+    if (commandListSelect.style.display == 'none')
+        commandListSelect.style.display = 'block';
+    else
+        commandListSelect.style.display = 'none';
+    filterCommands();
+});
+
+commandInput.addEventListener('blur', (event) => {
+    if (event.relatedTarget === showCommandListButton || event.relatedTarget === commandListSelect) {
+        event.preventDefault();
+        return;
+    }
+    commandListSelect.style.display = 'none';
+    adjustInputWidth(commandInput);
+});
+
+showCommandListButton.addEventListener('click', (event) => {
+    event.preventDefault();
+    setCommandListPosition();
+    unfilterCommands();
+    if (commandListSelect.style.display == 'none')
+        commandListSelect.style.display = 'block';
+    else
+        commandListSelect.style.display = 'none';
+});
+
+window.addEventListener('click', (event) => {
+    if (!commandInput.contains(event.target) && !commandListSelect.contains(event.target) && !showCommandListButton.contains(event.target)) {
+        commandListSelect.style.display = 'none';
+    }
+});
+
+window.addEventListener('keydown', (event) => {
+    if ([commandInput, paramsInput, commandListSelect].includes(document.activeElement)) return;
+    if (event.code === `Key${event.key.toUpperCase()}`) {
+        commandInput.focus();
+        commandInput.dispatchEvent(new KeyboardEvent('keydown', event));
+    }
+});
+
+window.addEventListener('resize', () => {
+    setCommandListPosition();
+});
+
+window.addEventListener('load', () => {
+    fetchExecutables();
+    adjustInputWidth(paramsInput); // Adjust width on load
+    adjustInputWidth(commandInput); // Adjust width on load
+    setCommandListPosition();
+});
+
+async function fetchExecutables() {
+    try {
+        const response = await fetch(`/executables${urlToken}`);
+        if (!response.ok) {
+            throw new Error('Failed to fetch command status');
+        }
+        const executables = await response.json();
+        commandListSelect.innerHTML = '';
+        executables.forEach(executable => {
+            const option = document.createElement('option');
+            option.className = 'command-item';
+            option.text = executable;
+            commandListSelect.appendChild(option);
+        });
+    } catch (error) {
+        alert("Failed to fetch executables");
+    }
+    commandListSelect.size = Math.min(20, commandListSelect.options.length);
+    if (commandListSelect.options.length == 1) {
+        commandInput.value = commandListSelect.options[0].text;
+        showCommandListButton.style.display = 'none';
+    }
+    if (commandListSelect.options.length == 0)
+        document.getElementById('launchForm').style.display = 'none';
+
+}

pywebexec/static/js/popup.js

@@ -0,0 +1,141 @@
+const maxScrollback = 99999;
+const maxSize = 10485760; // 10MB
+let terminal = new Terminal({
+    cursorBlink: false,
+    cursorInactiveStyle: 'none',
+    disableStdin: true,
+    convertEol: true,
+    fontFamily: 'Consolas NF, monospace, courier-new, courier',
+    scrollback: maxScrollback,
+    theme: {
+        background: '#111412',
+        black: '#111412',
+        green: '#088a5b',
+        blue: "#2760aa",
+        red: '#ba1611',
+        yellow: "#cf8700",
+        magenta: "#4c3d80",
+        cyan: "#00a7aa",
+        brightBlack: "#243C4F",
+        brightBlue: "#5584b1",
+        brightGreen: "#18Ed93",
+    },
+    customGlyphs: false,
+    rescaleOverlappingGlyphs: true,
+});
+
+const fitAddon = new FitAddon.FitAddon();
+terminal.loadAddon(fitAddon);
+terminal.open(document.getElementById('output'));
+fitAddon.fit();
+
+let currentCommandId = null;
+let outputInterval = null;
+let nextOutputLink = null;
+let fullOutput = '';
+let outputLength = 0;
+let title = null;
+let slider = null;
+
+function getTokenParam() {
+    const urlParams = new URLSearchParams(window.location.search);
+    return urlParams.get('token') ? `?token=${urlParams.get('token')}` : '';
+}
+const urlToken = getTokenParam();
+
+async function fetchOutput(url) {
+    try {
+        const response = await fetch(url);
+        if (!response.ok) {
+            document.getElementById('dimmer').style.display = 'none';
+            return;
+        }
+        const data = await response.json();
+        if (data.error) {
+            terminal.write(data.error);
+            clearInterval(outputInterval);
+        } else {
+            percentage = slider.value;
+            fullOutput += data.output;
+            if (fullOutput.length > maxSize)
+                fullOutput = fullOutput.slice(-maxSize);
+            if (percentage == 100)
+                terminal.write(data.output);
+            else {
+                percentage = Math.round((outputLength * 100)/fullOutput.length);
+                slider.value = percentage;
+                document.getElementById('outputPercentage').innerText = `${percentage}%`;
+            }
+            nextOutputLink = data.links.next;
+            if (data.status != 'running') {
+                title.innerText = `${data.status} ${title.innerText.split(' ').slice(1).join(' ')}`;
+                clearInterval(outputInterval);
+            }
+        }
+    } catch (error) {
+        document.getElementById('dimmer').style.display = 'block';
+        console.log('Error fetching output:', error);
+    }
+}
+
+async function viewOutput(command_id) {
+    slider.value = 100;
+    adjustOutputHeight();
+    currentCommandId = command_id;
+    nextOutputLink = `/command_output/${command_id}${urlToken}`;
+    clearInterval(outputInterval);
+    terminal.clear();
+    terminal.reset();
+    fullOutput = '';
+    try {
+        const response = await fetch(`/command_status/${command_id}${urlToken}`);
+        if (!response.ok) {
+            return;
+        }
+        const data = await response.json();
+        title.innerText = `${data.status} ${data.command} ${data.params.join(' ')}`;
+        if (data.command == 'term')
+            terminal.options.cursorInactiveStyle = 'outline';
+        else
+            terminal.options.cursorInactiveStyle = 'none';
+        if (data.status === 'running') {
+            fetchOutput(nextOutputLink);
+            outputInterval = setInterval(() => fetchOutput(nextOutputLink), 1000);
+        } else {
+            fetchOutput(nextOutputLink);
+        }
+    } catch (error) {
+        console.log('Error viewing output:', error);
+    }
+}
+
+function adjustOutputHeight() {
+    const outputDiv = document.getElementById('output');
+    const windowHeight = window.innerHeight;
+    const outputTop = outputDiv.getBoundingClientRect().top;
+    const maxHeight = windowHeight - outputTop - 60; // Adjusted for slider height
+    outputDiv.style.height = `${maxHeight}px`;
+    fitAddon.fit();
+    sliderUpdateOutput();
+}
+
+function sliderUpdateOutput() {
+    const percentage = slider.value;
+    outputLength = Math.floor((fullOutput.length * percentage) / 100);
+    const limitedOutput = fullOutput.slice(0, outputLength);
+    terminal.clear();
+    terminal.reset();
+    terminal.write(limitedOutput);
+    document.getElementById('outputPercentage').innerText = `${percentage}%`;
+}
+
+
+window.addEventListener('resize', adjustOutputHeight);
+window.addEventListener('load', () => {
+    title = document.getElementById('outputTitle');
+    slider = document.getElementById('outputSlider');
+    slider.addEventListener('input', sliderUpdateOutput);
+    const commandId = window.location.pathname.split('/').slice(-1)[0];
+    viewOutput(commandId);
+});
+