// ==UserScript==
// @name         Joplin:Copy-Code-And-Fix-CSS
// @namespace    https://github.com/le91
// @version      1.0.0
// @description  Добавляет кнопку копирования кода с SVG-иконкой и уведомление о успешном копировании к элементам с классами "hljs" в Joplin иконка создается с помощью https://yqnn.github.io/svg-path-editor/
// @author       Lukas Endigo
// @match        https://*.lkaz.ru/shares/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=joplinapp.org
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Функция для копирования текста в буфер обмена
    function copyToClipboard(text) {
        const textarea = document.createElement('textarea');
        textarea.value = text;
        document.body.appendChild(textarea);
        textarea.select();
        document.execCommand('copy');
        document.body.removeChild(textarea);
    }

    // Функция для отображения уведомления
    function showNotification(pMessage, pTimer) {
        const notification = document.createElement('div');
        notification.textContent = pMessage;
        notification.style.position = 'fixed';
        notification.style.top = '10px';
        notification.style.right = '10px';
        notification.style.background = 'rgba(76, 175, 80, 0.8)';
        notification.style.color = 'white';
        notification.style.padding = '10px';
        notification.style.borderRadius = '5px';
        notification.style.whiteSpace = 'pre-wrap';
        document.body.appendChild(notification);

        setTimeout(() => {
            document.body.removeChild(notification);
        }, pTimer); // Убираем уведомление через 2 секунды
    }

    // Выбираем все элементы с классами "joplin-editable" и "hljs"
    const elements = document.querySelectorAll('.hljs');

    // Для каждого элемента добавляем кнопку "Копировать код" с SVG-иконкой и уведомлением
    elements.forEach(element => {
        element.style.border = 'solid 1px #767676';
        element.style.borderRadius = '5px';

        const copyButton = document.createElement('button');
        copyButton.innerHTML = `<svg class="svg-icon" viewBox="0 -4 14 26" style="height: 14px;width: 30px;">
            <path d="M0 0V19q0 2 2 2L13 21q2 0 2-2L15 6Q15 4 13 4L2 4Q0 4 0 6M3 6 12 6q1 0 1 1L13 18q0 1-1 1L3 19Q2 19 2 18L2 7Q2 6 3 6M4 0 17 0Q19 0 19 2L19 16C19 17 17 17 17 16L17 3Q17 2 16 2L4 2C3 2 3 0 4 0">
            </path></svg>
            <span style="padding-left: 10px;padding-right: 16px;">Копировать</span>`;
        copyButton.style.position = 'absolute';
        copyButton.style.top = '0';
        copyButton.style.right = '0';
        // copyButton.style.marginTop = '-10px';
        copyButton.addEventListener('click', () => {
            const code = element.textContent;
            const isCopied = copyToClipboard(code);
            //if (isCopied) {
                showNotification('Код скопирован в буфер обмена!\n\n'+code, 1500);
            //}
        });
        element.parentNode.style.position = 'relative'; // Устанавливаем позицию родительского элемента как относительную
        element.parentNode.appendChild(copyButton); // Добавляем кнопку в родительский элемент
    });

    document.querySelector("body > main > div > div.note-main").style.maxWidth = "1400px";
})();