add slots

public/js/admin/scripts.js

@@ -3,44 +3,40 @@ document.addEventListener('DOMContentLoaded', function() {
         license_key: 'gpl',
         remove_script_host: false,
         relative_urls: false,  
-        entity_encoding: 'raw', // Записывает символы как есть
-        valid_elements: '*[*]', // Разрешает любые элементы и атрибуты
-        content_css: false,     // Отключает внешнюю CSS-стилизацию
+        entity_encoding: 'raw',
+        valid_elements: '*[*]',
+        content_css: false,
         force_br_newlines: true,
-        //force_p_newlines: true,
-        entities: '160,nbsp', // Мини
+        entities: '160,nbsp',
         remove_linebreaks: false,
-        selector: '.secondary-content', // Ваши текстовые области
-        encoding: 'UTF-8',      // Указывает кодировку 
-        plugins: 'image link media code table lists', // Подключены плагины для изображений, таблиц, списков
-        toolbar: 'undo redo | styleselect | bold italic | bullist numlist | alignleft aligncenter alignright alignjustify | outdent indent | link image media table | code', // Добавлены кнопки для списков
-        menubar: 'file edit view insert format tools table help', // Включаем меню с таблицами
-        contextmenu: 'table', // Контекстное меню для работы с таблицами
-        images_upload_url: '/admin/upload.php', // URL для загрузки изображений
-        automatic_uploads: true, // Автоматическая загрузка изображений
-        file_picker_types: 'image', // Включаем выбор файлов
-        images_reuse_filename: true, // Сохраняем оригинальное название файла
+        selector: '.secondary-content',
+        encoding: 'UTF-8',
+        plugins: 'image link media code table lists',
+        toolbar: 'undo redo | styleselect | bold italic | bullist numlist | alignleft aligncenter alignright alignjustify | outdent indent | link image media table | code',
+        menubar: 'file edit view insert format tools table help',
+        contextmenu: 'table',
+        images_upload_url: '/admin/upload.php',
+        automatic_uploads: true,
+        file_picker_types: 'image',
+        images_reuse_filename: true,
         paste_as_text: true,
         setup: function (editor) {
-            // Обработка перед сохранением
             editor.on('SaveContent', function (e) {
                 e.content = e.content.replace(/<img([^>]*?)src=/g, '<img$1class="lazy" data-src=');
             });
     
-            // Обработка контента при загрузке в редактор
             editor.on('BeforeSetContent', function (e) {
                 e.content = e.content.replace(/<img([^>]*?)src=/g, '<img$1class="lazy" data-src=');
             });
         },
         table_default_attributes: {
-            border: '1', // Граница таблицы по умолчанию
+            border: '1',
         },
         table_default_styles: {
-            width: '100%', // Ширина таблицы по умолчанию
-            borderCollapse: 'collapse', // Границы объединяются
+            width: '100%',
+            borderCollapse: 'collapse',
         },
         file_picker_callback: function(callback, value, meta) {
-            // Если это изображение, открываем стандартный файловый выбор
             if (meta.filetype === 'image') {
                 const input = document.createElement('input');
                 input.setAttribute('type', 'file');
@@ -56,7 +52,7 @@ document.addEventListener('DOMContentLoaded', function() {
                     })
                     .then(response => response.json())
                     .then(result => {
-                        callback(result.location); // URL изображения
+                        callback(result.location);
                     })
                     .catch(() => alert('Ошибка при загрузке изображения.'));
                 };
@@ -68,19 +64,15 @@ document.addEventListener('DOMContentLoaded', function() {
         table { border-collapse: collapse; width: 100%; }
         th, td { border: 1px solid #ddd; padding: 8px; }
         th { background-color: #f2f2f2; text-align: left; }
-    ` // Добавлены стили для таблиц
+    `
     });
 });
 
-
-
-// Выбор цвета-------------------------
+// Color picker functionality
 document.addEventListener('DOMContentLoaded', function () {
-    // Получаем все элементы input с классами inp-color и inp-color-text
     const colorPickers = document.querySelectorAll('.inp-color');
     const textInputs = document.querySelectorAll('.inp-color-text');
 
-    // Синхронизация inp-color -> inp-color-text
     colorPickers.forEach(colorPicker => {
         colorPicker.addEventListener('input', function () {
             const textInput = this.nextElementSibling;
@@ -90,22 +82,18 @@ document.addEventListener('DOMContentLoaded', function () {
         });
     });
 
-    // Синхронизация inp-color-text -> inp-color
     textInputs.forEach(textInput => {
         textInput.addEventListener('input', function () {
             const colorPicker = this.previousElementSibling;
             if (colorPicker && colorPicker.classList.contains('inp-color')) {
-                // Проверяем, что введенное значение является валидным цветом в формате HEX
                 if (/^#([0-9A-F]{3}|[0-9A-F]{6})$/i.test(this.value)) {
                     colorPicker.value = this.value;
                 }
             }
         });
 
-        // Проверяем и синхронизируем значение при загрузке страницы
         const colorPicker = textInput.previousElementSibling;
         if (colorPicker && colorPicker.classList.contains('inp-color')) {
-            // Проверяем, что значение в текстовом поле валидное
             if (/^#([0-9A-F]{3}|[0-9A-F]{6})$/i.test(textInput.value)) {
                 colorPicker.value = textInput.value;
             }
@@ -113,20 +101,7 @@ document.addEventListener('DOMContentLoaded', function () {
     });
 });
 
-
-// function addRepeaterItem(type) {
-//     const container = document.getElementById(`${type}-items`);
-//     const index = container.children.length;
-//     const html = `
-//         <div class="repeater-item">
-//             <input type="text" name="items[${index}][question]" placeholder="Question">
-//             <input type="text" name="items[${index}][answer]" placeholder="Answer">
-//             <button type="button" onclick="this.parentElement.remove()">Remove</button>
-//         </div>`;
-//     container.insertAdjacentHTML('beforeend', html);
-// }
-
-
+// Casino repeater functionality
 function addCasinoItem() {
     const container = document.getElementById('casinoRepeater');
     const tpl = document.getElementById('casinoTemplate').content.cloneNode(true);
@@ -196,7 +171,6 @@ document.addEventListener('DOMContentLoaded', function() {
         return div;
     }
 
-    // Accordion functionality
     function initAccordion() {
         const items = container.querySelectorAll('.casino-item');
 
@@ -208,9 +182,7 @@ document.addEventListener('DOMContentLoaded', function() {
 
             if (!header || !toggleBtn || !content) return;
 
-            // Toggle accordion
             const toggleAccordion = (e) => {
-                // Не закрывать если клик по drag handle
                 if (e.target.closest('.drag-handle')) {
                     return;
                 }
@@ -228,7 +200,6 @@ document.addEventListener('DOMContentLoaded', function() {
 
             header.addEventListener('click', toggleAccordion);
 
-            // Запрет на перетаскивание при клике на header (кроме drag-handle)
             header.addEventListener('mousedown', (e) => {
                 if (!e.target.closest('.drag-handle')) {
                     item.setAttribute('draggable', 'false');
@@ -239,13 +210,11 @@ document.addEventListener('DOMContentLoaded', function() {
                 item.setAttribute('draggable', 'true');
             });
 
-            // Drag только за handle
             dragHandle.addEventListener('mousedown', (e) => {
                 e.stopPropagation();
                 item.setAttribute('draggable', 'true');
             });
 
-            // Обновление заголовка при изменении Casino title
             const headingInput = item.querySelector('.heading');
             if (headingInput) {
                 headingInput.addEventListener('input', function() {
@@ -266,13 +235,11 @@ document.addEventListener('DOMContentLoaded', function() {
 
             const dragHandle = item.querySelector('.drag-handle');
 
-            // Drag только при клике на handle
             dragHandle.addEventListener('mousedown', function(e) {
                 item.setAttribute('draggable', 'true');
             });
 
             item.addEventListener('dragstart', function(e) {
-                // Проверяем что перетаскивание началось с drag-handle
                 if (!e.target.querySelector('.drag-handle')) {
                     e.preventDefault();
                     return;
@@ -352,17 +319,14 @@ document.addEventListener('DOMContentLoaded', function() {
         }, { offset: Number.NEGATIVE_INFINITY }).element;
     }
 
-    // Инициализация при загрузке
     initAccordion();
     initDragAndDrop();
     updateOrderNumbers();
 
-    // Слушаем событие удаления элемента
     container.addEventListener('itemRemoved', function() {
         updateOrderNumbers();
     });
 
-    // Переопределяем addCasinoItem для инициализации drag&drop на новых элементах
     window.originalAddCasinoItem = window.addCasinoItem;
     window.addCasinoItem = function() {
         if (window.originalAddCasinoItem) {
@@ -380,7 +344,7 @@ document.addEventListener('DOMContentLoaded', function() {
     };
 });
 
-
+// Page selector functionality
 const pageSelect = document.getElementById('page-select');
 if (pageSelect) {
     pageSelect.addEventListener('change', function () {
@@ -397,168 +361,15 @@ if (pageSelect) {
     });
 }
 
-// Tab switching functionality for new admin interface
+// Tab switching functionality
 function switchTab(tabName) {
-    // Hide all tab contents
     const contents = document.querySelectorAll('.tab-content');
     contents.forEach(content => content.classList.remove('active'));
     
-    // Remove active class from all tabs
     const tabs = document.querySelectorAll('.tab');
     tabs.forEach(tab => tab.classList.remove('active'));
     
-    // Show selected tab content
     document.getElementById(tabName + '-tab').classList.add('active');
     
-    // Add active class to clicked tab
     event.target.classList.add('active');
-}
-
-// Repeater functionality for new admin interface
-function addRepeaterItem(type) {
-    const container = document.getElementById(`${type}-items`);
-    const index = container.children.length;
-
-    const html = `
-        <div class="repeater-item" style="margin-bottom: 15px; padding: 15px; border: 1px solid #ddd;">
-            ${type === 'menu' ? `
-                <input type="text" name="repeaters[${type}][${index}][title]" placeholder="Menu Title" style="width: 100%; margin-bottom: 10px;">
-                <input type="text" name="repeaters[${type}][${index}][anchor]" placeholder="Anchor Link (#id)" style="width: 100%; margin-bottom: 10px;">
-            ` : `
-                <input type="text" name="repeaters[${type}][${index}][question]" placeholder="Question" style="width: 100%; margin-bottom: 10px;">
-                <textarea name="repeaters[${type}][${index}][answer]" placeholder="Answer" style="width: 100%; margin-bottom: 10px;"></textarea>
-            `}
-            <button type="button" onclick="removeRepeaterItem(this)" style="background: #dc3545; color: white; border: none; padding: 5px 10px;">Remove</button>
-        </div>`;
-    container.insertAdjacentHTML('beforeend', html);
-}
-
-function removeRepeaterItem(button) {
-    button.parentElement.remove();
-}
-
-function addCasinoItem() {
-    const container = document.getElementById('casino-items');
-    const index = container.children.length;
-
-    const html = `
-        <div class="casino-item" style="margin-bottom: 20px; padding: 15px; border: 1px solid #ddd;">
-            <h4>Casino Item #${index + 1}</h4>
-            <input type="text" name="repeaters[casino_list][${index}][heading]" placeholder="Casino Name" style="width: 100%; margin-bottom: 10px;">
-            <input type="text" name="repeaters[casino_list][${index}][text]" placeholder="Bonus Text" style="width: 100%; margin-bottom: 10px;">
-            <input type="text" name="repeaters[casino_list][${index}][button]" placeholder="Button Text" style="width: 100%; margin-bottom: 10px;">
-            <input type="file" name="casino_image_${index}" style="margin-bottom: 10px;">
-            <button type="button" onclick="removeRepeaterItem(this)" style="background: #dc3545; color: white; border: none; padding: 5px 10px;">Remove</button>
-        </div>`;
-    container.insertAdjacentHTML('beforeend', html);
-}
-
-function addHreflangItem() {
-    const container = document.getElementById('hreflang-items');
-    const index = container.children.length;
-
-    const html = `
-        <div style="margin-bottom: 15px; padding: 15px; border: 1px solid #ddd;">
-            <div style="display: grid; grid-template-columns: 1fr 1fr auto; gap: 15px; align-items: center;">
-                <div>
-                    <label style="display: block; margin-bottom: 5px; font-weight: bold;">Hreflang</label>
-                    <input type="text" name="seo[hreflang][${index}][hreflang]" placeholder="en, es, fr, etc." style="width: 100%; padding: 8px; border: 1px solid #ddd; border-radius: 4px;">
-                </div>
-                <div>
-                    <label style="display: block; margin-bottom: 5px; font-weight: bold;">Href URL</label>
-                    <input type="text" name="seo[hreflang][${index}][href]" placeholder="https://example.com/en/" style="width: 100%; padding: 8px; border: 1px solid #ddd; border-radius: 4px;">
-                </div>
-                <button type="button" onclick="removeRepeaterItem(this)" style="background: #dc3545; color: white; border: none; padding: 8px 12px; border-radius: 4px; margin-top: 25px;">Remove</button>
-            </div>
-        </div>`;
-    container.insertAdjacentHTML('beforeend', html);
-}
-
-// Load existing data for new admin interface
-function loadExistingData() {
-    const menuItems = window.menuItems || [];
-    const faqItems = window.faqItems || [];
-    const casinoItems = window.casinoItems || [];
-    const hreflangItems = window.hreflangItems || [];
-
-    // Load existing menu items
-    menuItems.forEach((item, index) => {
-        if (item && item.title) {
-            const container = document.getElementById('menu-items');
-            if (container) {
-                const html = `
-                    <div class="repeater-item" style="margin-bottom: 15px; padding: 15px; border: 1px solid #ddd;">
-                        <input type="text" name="repeaters[menu][${index}][title]" value="${item.title}" placeholder="Menu Title" style="width: 100%; margin-bottom: 10px;">
-                        <input type="text" name="repeaters[menu][${index}][anchor]" value="${item.anchor || ''}" placeholder="Anchor Link (#id)" style="width: 100%; margin-bottom: 10px;">
-                        <button type="button" onclick="removeRepeaterItem(this)" style="background: #dc3545; color: white; border: none; padding: 5px 10px;">Remove</button>
-                    </div>`;
-                container.insertAdjacentHTML('beforeend', html);
-            }
-        }
-    });
-
-    // Load existing FAQ items
-    faqItems.forEach((item, index) => {
-        if (item && item.question) {
-            const container = document.getElementById('faq-items');
-            if (container) {
-                const html = `
-                    <div class="repeater-item" style="margin-bottom: 15px; padding: 15px; border: 1px solid #ddd;">
-                        <input type="text" name="repeaters[faq][${index}][question]" value="${item.question}" placeholder="Question" style="width: 100%; margin-bottom: 10px;">
-                        <textarea name="repeaters[faq][${index}][answer]" placeholder="Answer" style="width: 100%; margin-bottom: 10px;">${item.answer || ''}</textarea>
-                        <button type="button" onclick="removeRepeaterItem(this)" style="background: #dc3545; color: white; border: none; padding: 5px 10px;">Remove</button>
-                    </div>`;
-                container.insertAdjacentHTML('beforeend', html);
-            }
-        }
-    });
-
-    // Load existing casino items
-    casinoItems.forEach((item, index) => {
-        if (item && item.heading) {
-            const container = document.getElementById('casino-items');
-            if (container) {
-                const html = `
-                    <div class="casino-item" style="margin-bottom: 20px; padding: 15px; border: 1px solid #ddd;">
-                        <h4>${item.heading}</h4>
-                        <input type="text" name="repeaters[casino_list][${index}][heading]" value="${item.heading}" placeholder="Casino Name" style="width: 100%; margin-bottom: 10px;">
-                        <input type="text" name="repeaters[casino_list][${index}][text]" value="${item.text || ''}" placeholder="Bonus Text" style="width: 100%; margin-bottom: 10px;">
-                        <input type="text" name="repeaters[casino_list][${index}][button]" value="${item.button || ''}" placeholder="Button Text" style="width: 100%; margin-bottom: 10px;">
-                        <button type="button" onclick="removeRepeaterItem(this)" style="background: #dc3545; color: white; border: none; padding: 5px 10px;">Remove</button>
-                    </div>`;
-                container.insertAdjacentHTML('beforeend', html);
-            }
-        }
-    });
-
-    // Load existing hreflang items
-    hreflangItems.forEach((item, index) => {
-        if (item && (item.hreflang || item.href)) {
-            const container = document.getElementById('hreflang-items');
-            if (container) {
-                const html = `
-                    <div style="margin-bottom: 15px; padding: 15px; border: 1px solid #ddd;">
-                        <div style="display: grid; grid-template-columns: 1fr 1fr auto; gap: 15px; align-items: center;">
-                            <div>
-                                <label style="display: block; margin-bottom: 5px; font-weight: bold;">Hreflang</label>
-                                <input type="text" name="seo[hreflang][${index}][hreflang]" value="${item.hreflang || ''}" placeholder="en, es, fr, etc." style="width: 100%; padding: 8px; border: 1px solid #ddd; border-radius: 4px;">
-                            </div>
-                            <div>
-                                <label style="display: block; margin-bottom: 5px; font-weight: bold;">Href URL</label>
-                                <input type="text" name="seo[hreflang][${index}][href]" value="${item.href || ''}" placeholder="https://example.com/en/" style="width: 100%; padding: 8px; border: 1px solid #ddd; border-radius: 4px;">
-                            </div>
-                            <button type="button" onclick="removeRepeaterItem(this)" style="background: #dc3545; color: white; border: none; padding: 8px 12px; border-radius: 4px; margin-top: 25px;">Remove</button>
-                        </div>
-                    </div>`;
-                container.insertAdjacentHTML('beforeend', html);
-            }
-        }
-    });
-}
-
-// Initialize on DOM ready (for new admin interface)
-if (document.readyState === 'loading') {
-    document.addEventListener('DOMContentLoaded', loadExistingData);
-} else {
-    loadExistingData();
 }