☰

lolcast macro

Create and manage chat command shortcuts

Od 04.02.2025.. Pogledajte najnovija verzija.

// ==UserScript==
// @name         lolcast macro
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  Create and manage chat command shortcuts
// @match        https://insagirl-toto.appspot.com/chatting/lgic/*
// @grant        GM_addStyle
// @grant        GM_registerMenuCommand
// ==/UserScript==

(function () {
    'use strict';

    const LOCAL_STORAGE_KEY = 'chat_command_shortcuts';
    const MAX_SHORTCUTS = 15; // 최대 단축 입력 갯수

    // 기존 저장된 단축 목록 불러오기 (없으면 기본값으로 빈 객체)
    let shortcuts = JSON.parse(localStorage.getItem(LOCAL_STORAGE_KEY)) || {};

    // 단축 목록 버튼 생성
    function createShortcutButton(label, command) {
        const button = document.createElement('button');
        button.textContent = label;
        button.className = 'shortcut-btn';
        button.addEventListener('click', () => {
            const chatInput = document.querySelector('#ichatinput');
            if (chatInput) {
                const commands = command.split('\n');

                // 명령어 하나씩 순차적으로 처리
                commands.forEach((cmd, index) => {
                    setTimeout(() => {
                        chatInput.value = cmd.trim();
                        chatInput.focus();

                        const enterEvent = new KeyboardEvent('keydown', {
                            bubbles: true,
                            cancelable: true,
                            key: 'Enter',
                            code: 'Enter',
                            keyCode: 13,
                            which: 13
                        });
                        chatInput.dispatchEvent(enterEvent);

                        if (index === commands.length - 1) {
                            chatInput.value = '';
                        }
                    }, index * 80);
                });
            }
        });
        return button;
    }

    // 단축 목록에서 버튼 추가 및 화면에 고정
    function renderShortcuts() {
        const shortcutDiv = document.createElement('div');
        shortcutDiv.className = 'shortcut-container';
        const sortedShortcuts = Object.entries(shortcuts).sort(([a], [b]) => a.localeCompare(b)); // 정렬

        if (sortedShortcuts.length > MAX_SHORTCUTS) {
            sortedShortcuts.length = MAX_SHORTCUTS; // 최대 갯수 제한
        }

        sortedShortcuts.forEach(([label, command]) => {
            const button = createShortcutButton(label, command);
            shortcutDiv.appendChild(button);
        });

        // 버튼들을 body에 고정된 상태로 추가
        document.body.appendChild(shortcutDiv);
    }

    renderShortcuts();  // 처음 렌더링

    // 설정 창 UI 생성
    function openSettingsWindow() {
        const settingsDiv = document.createElement('div');
        settingsDiv.className = 'settings-modal';

        const title = document.createElement('h2');
        title.textContent = '단축 목록 설정';
        title.className = 'settings-title';
        settingsDiv.appendChild(title);

        const listDiv = document.createElement('div');
        listDiv.className = 'shortcut-list';
        const shortcutEntries = Object.entries(shortcuts);
        shortcutEntries.forEach(([label, command], index) => {
            const itemDiv = document.createElement('div');
            itemDiv.className = 'shortcut-item';

            const labelSpan = document.createElement('span');
            labelSpan.textContent = `${label}: ${command}`;
            labelSpan.className = 'shortcut-label';
            itemDiv.appendChild(labelSpan);

            const upButton = document.createElement('button');
            upButton.textContent = '▲';
            upButton.className = 'move-btn';
            upButton.disabled = (index === 0);
            upButton.addEventListener('click', () => {
                if (index > 0) {
                    moveShortcut(index, index - 1);
                    openSettingsWindow();
                }
            });
            itemDiv.appendChild(upButton);

            const downButton = document.createElement('button');
            downButton.textContent = '▼';
            downButton.className = 'move-btn';
            downButton.disabled = (index === shortcutEntries.length - 1);
            downButton.addEventListener('click', () => {
                if (index < shortcutEntries.length - 1) {
                    moveShortcut(index, index + 1);
                    openSettingsWindow();
                }
            });
            itemDiv.appendChild(downButton);

            const deleteButton = document.createElement('button');
            deleteButton.textContent = '삭제';
            deleteButton.className = 'delete-btn';
            deleteButton.addEventListener('click', () => {
                delete shortcuts[label];
                saveShortcuts();
                renderShortcuts();
                openSettingsWindow();
            });
            itemDiv.appendChild(deleteButton);

            listDiv.appendChild(itemDiv);
        });
        settingsDiv.appendChild(listDiv);

        const addDiv = document.createElement('div');
        addDiv.className = 'add-shortcut';

        const newLabelInput = document.createElement('input');
        newLabelInput.placeholder = '단축명';
        newLabelInput.className = 'input-field';
        addDiv.appendChild(newLabelInput);

        const newCommandInput = document.createElement('textarea');
        newCommandInput.placeholder = '명령어 (여러 줄 입력 가능)';
        newCommandInput.className = 'input-field';
        newCommandInput.style.height = '100px';
        addDiv.appendChild(newCommandInput);

        const addButton = document.createElement('button');
        addButton.textContent = '추가';
        addButton.className = 'add-btn';
        addButton.addEventListener('click', () => {
            const label = newLabelInput.value.trim();
            const command = newCommandInput.value.trim();
            if (label && command && Object.keys(shortcuts).length < MAX_SHORTCUTS) { // 입력 갯수 제한
                shortcuts[label] = command;
                saveShortcuts();
                renderShortcuts();
                openSettingsWindow();
            }
        });
        addDiv.appendChild(addButton);
        settingsDiv.appendChild(addDiv);

        const closeButton = document.createElement('button');
        closeButton.textContent = '닫기';
        closeButton.className = 'close-btn';
        closeButton.addEventListener('click', () => {
            settingsDiv.remove();
        });
        settingsDiv.appendChild(closeButton);

        const existingSettingsDiv = document.querySelector('#shortcutSettingsDiv');
        if (existingSettingsDiv) {
            existingSettingsDiv.remove();
        }

        settingsDiv.id = 'shortcutSettingsDiv';
        document.body.appendChild(settingsDiv);
    }

    function saveShortcuts() {
        localStorage.setItem(LOCAL_STORAGE_KEY, JSON.stringify(shortcuts));
    }

    function moveShortcut(fromIndex, toIndex) {
        const shortcutEntries = Object.entries(shortcuts);
        const temp = shortcutEntries[fromIndex];
        shortcutEntries[fromIndex] = shortcutEntries[toIndex];
        shortcutEntries[toIndex] = temp;

        shortcuts = Object.fromEntries(shortcutEntries);
        saveShortcuts();
        renderShortcuts();
    }

    GM_registerMenuCommand('단축 목록 설정', openSettingsWindow);

GM_addStyle(`
    .shortcut-container {
        position: fixed;
        top: 10;
        left: 0;
        width: 100%;
        z-index: 1000;
        background-color: transparent;
        padding: 5px;
        display: flex;
        flex-wrap: wrap;
        gap: 3px;
        justify-content: flex-start;
        border-bottom: none;
    }

    .shortcut-btn {
        background-color: #4CAF50;
        border: none;
        color: white;
        padding: 4px 8px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 12px;
        border-radius: 4px;
        transition-duration: 0.3s;
    }

    .shortcut-btn:hover {
        background-color: #45a049;
    }

   .settings-modal {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #fefefe;
    border: 1px solid #888;
    z-index: 10000;
    padding: 20px;
    width: 300px;
    max-width: 80%;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
    border-radius: 8px;
    font-family: Arial, sans-serif;
    text-align: center;  /* Add this to center the content inside the modal */
  }

    .settings-title {
        margin-top: 0;
        margin-bottom: 20px;
        font-size: 18px;
        color: #333;
        text-align: center;
    }

    .shortcut-list {
        max-height: 150px;
        overflow-y: auto;
        margin-bottom: 20px;
    }

    .shortcut-item {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 10px;
        padding: 5px 0;
        border-bottom: 1px solid #ddd;
    }

    .shortcut-label {
        font-size: 14px;
        color: #555;
        flex-grow: 1;
    }

    .delete-btn, .move-btn {
        background-color: #f44336;
        border: none;
        color: white;
        padding: 3px 6px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 12px;
        border-radius: 4px;
        cursor: pointer;
        transition-duration: 0.3s;
        margin-left: 5px;
    }

    .move-btn {
        background-color: #008CBA;
    }

    .delete-btn:hover {
        background-color: #d32f2f;
    }

    .move-btn:hover {
        background-color: #007bb5;
    }

    .input-field {
        padding: 8px;
        font-size: 14px;
        border: 1px solid #ccc;
        border-radius: 4px;
        margin-bottom: 10px;
        width: calc(100% - 16px);
    }

 .add-btn, .close-btn {
    background-color: #4CAF50;
    border: none;
    color: white;
    padding: 8px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    width: 100%;  /* Adjusted width to fit better */
    font-size: 14px;
    border-radius: 4px;
    cursor: pointer;
    transition-duration: 0.3s;
    margin-bottom: 10px;
    margin: 10px auto 0;  /* Center the buttons vertically and horizontally */
}

.add-btn:hover, .close-btn:hover {
    background-color: #45a049;
}
`);
})();