cdnhost 2.5.8 → 2.6.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cdnhost",
-  "version": "2.5.8",
+  "version": "2.6.0",
   "description": "cdnhost",
   "main": "index.js",
   "scripts": {

package/ws_cdn.js

@@ -1,15 +1,9 @@
 
     document.addEventListener('DOMContentLoaded', function() {
-        
-        const languages = [
-            { code: 'ko', name: '한국어' }, { code: 'en', name: 'English' }, { code: 'es', name: 'Español' }, 
-            { code: 'hi', name: 'हिन्दी' }, { code: 'ar', name: 'العربية' }, { code: 'de', name: 'Deutsch' }, 
-            { code: 'fr', name: 'Français' }, { code: 'pt', name: 'Português' }, { code: 'bn', name: 'বাংলা' }, 
-            { code: 'ja', name: '日本語' }, { code: 'ru', name: 'Русский' }, { code: 'zh', name: '简体中文' },
-            { code: 'th', name: 'ไทย' }, { code: 'vi', name: 'Tiếng Việt' }, { code: 'id', name: 'Indonesia' }, 
-            { code: 'tr', name: 'Türkçe' }, { code: 'ur', name: 'اردو' }
-        ];
-        
+        if (window.FHLWidgetInitialized) return;
+        window.FHLWidgetInitialized = true;
+
+        const languages = [ { code: 'ko', name: '한국어' }, { code: 'en', name: 'English' }, { code: 'es', name: 'Español' }, { code: 'hi', name: 'हिन्दी' }, { code: 'ar', name: 'العربية' }, { code: 'de', name: 'Deutsch' }, { code: 'fr', name: 'Français' }, { code: 'pt', name: 'Português' }, { code: 'bn', name: 'বাংলা' }, { code: 'ja', name: '日本語' }, { code: 'ru', name: 'Русский' }, { code: 'zh', name: '简体中文' }, { code: 'th', name: 'ไทย' }, { code: 'vi', name: 'Tiếng Việt' }, { code: 'id', name: 'Indonesia' }, { code: 'tr', name: 'Türkçe' }, { code: 'ur', name: 'اردو' }];
         let fullApiItemsData = null;
         let currentDisplayItems = []; 
         let currentPage = 1; 
@@ -98,14 +92,7 @@
             });
         };
 
-        const showToast = (message) => {
-            clearTimeout(toastTimeout);
-            toastElement.textContent = message;
-            toastElement.classList.add('visible');
-            toastTimeout = setTimeout(() => {
-                toastElement.classList.remove('visible');
-            }, 2500);
-        };
+        const showToast = (message) => { clearTimeout(toastTimeout); toastElement.textContent = message; toastElement.classList.add('visible'); toastTimeout = setTimeout(() => { toastElement.classList.remove('visible'); }, 2500); };
         
         const applyLanguage = (langCode) => {
             if (typeof translations === 'undefined') {
@@ -166,32 +153,22 @@
 
 
 
-
-
-
-
-const createIconItem = (item, type = 'default') => {
+        const createIconItem = (item, type = 'default') => {
             const link = document.createElement('a');
             
-            // ✨ [수정됨] 검색 결과 링크에도 GET 파라미터를 추가하도록 로직 변경
             if (type === 'search') {
                 const paramString = shortcutManager.getAsParam();
                 let finalUrl = item.url;
                 if (paramString) {
                     try {
-                        // URL 객체를 사용하여 기존 파라미터는 유지하고 새 파라미터 추가/수정
                         let newUrl = new URL(item.url);
                         const [key, value] = paramString.split('=');
                         newUrl.searchParams.set(key, value);
                         finalUrl = newUrl.toString();
-                    } catch (e) {
-                        // URL이 유효하지 않은 경우(예: javascript:void(0)) 원본 URL을 그대로 사용
-                        console.error('Invalid URL for search result link:', item.url);
-                    }
+                    } catch (e) { console.error('Invalid URL for search result link:', item.url); }
                 }
                 link.href = finalUrl;
             } else {
-                // 검색 결과가 아닌 다른 아이콘들은 updateAllWidgetLinks 함수가 처리하므로 원본 URL 사용
                 link.href = item.url;
             }
 
@@ -200,11 +177,7 @@ const createIconItem = (item, type = 'default') => {
             
             if (type === 'search') {
                 link.addEventListener('mousedown', () => {
-                    fetch('update_view_count.php', {
-                        method: 'POST',
-                        headers: { 'Content-Type': 'application/json' },
-                        body: JSON.stringify({ url: item.url })
-                    }).catch(console.error);
+                    fetch('https://isai.kr/update_view_count.php', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ url: item.url }) }).catch(console.error);
                 });
                 link.target = '_blank';
             }
@@ -304,49 +277,10 @@ const createIconItem = (item, type = 'default') => {
 
 
 
-        const appendNextPage = () => {
-            if (isLoadingNextPage) return;
-            isLoadingNextPage = true;
-            const startIndex = (currentPage - 1) * ITEMS_PER_PAGE;
-            const endIndex = currentPage * ITEMS_PER_PAGE;
-            if (startIndex >= currentDisplayItems.length) {
-                isLoadingNextPage = false;
-                return;
-            }
-            const itemsToAppend = currentDisplayItems.slice(startIndex, endIndex);
-            itemsToAppend.forEach(item => {
-                searchResultsContainer.appendChild(createIconItem(item, 'search'));
-            });
-            currentPage++;
-            isLoadingNextPage = false;
-        };
-
-        const renderInitialResults = (items) => {
-            searchResultsContainer.innerHTML = '';
-            currentPage = 1;
-            currentDisplayItems = items;
-            appendNextPage();
-        };
-
-        const openSearch = async () => {
-            widgetContainer.classList.add('search-mode');
-            widgetWrapper.classList.add('search-mode');
-            searchInput.focus();
-            if (fullApiItemsData === null) {
-                try {
-                    const response = await fetch('appapi2.php');
-                    if (!response.ok) throw new Error('API 응답 오류');
-                    fullApiItemsData = await response.json();
-                } catch (error) {
-                    console.error('전체 앱 목록 로드 실패:', error);
-                    searchResultsContainer.innerHTML = '<p>목록 로드 실패</p>';
-                    fullApiItemsData = [];
-                    return;
-                }
-            }
-            renderInitialResults(fullApiItemsData);
-        };
-
+        const appendNextPage = () => { if (isLoadingNextPage) return; isLoadingNextPage = true; const startIndex = (currentPage - 1) * ITEMS_PER_PAGE; const endIndex = currentPage * ITEMS_PER_PAGE; if (startIndex >= currentDisplayItems.length) { isLoadingNextPage = false; return; } const itemsToAppend = currentDisplayItems.slice(startIndex, endIndex); itemsToAppend.forEach(item => { searchResultsContainer.appendChild(createIconItem(item, 'search')); }); currentPage++; isLoadingNextPage = false; };
+        const renderInitialResults = (items) => { searchResultsContainer.innerHTML = ''; currentPage = 1; currentDisplayItems = items; appendNextPage(); };
+        const openSearch = async () => { widgetContainer.classList.add('search-mode'); widgetWrapper.classList.add('search-mode'); searchInput.focus(); if (fullApiItemsData === null) { try { const response = await fetch('https://isai.kr/appapi2.php'); if (!response.ok) throw new Error('API 응답 오류'); fullApiItemsData = await response.json(); } catch (error) { console.error('전체 앱 목록 로드 실패:', error); searchResultsContainer.innerHTML = '<p>목록 로드 실패</p>'; fullApiItemsData = []; return; } } renderInitialResults(fullApiItemsData); };
+        
         const initialRender = () => {
             const t = translations[currentLang] || translations['en'];
             const initialItemsData = [
@@ -360,120 +294,34 @@ const createIconItem = (item, type = 'default') => {
                 { name: t.psychology, url: 'https://simpong.oduc.kr/', img: 'http://cdn.jsdelivr.net/npm/cdnhost@2.2.0/_simpong.png' },
                 { name: t.ads, url: 'https://gig.snapp.im/', icon: 'ph-currency-circle-dollar' },
             ];
-
             listContainer.innerHTML = '';
             const storedItems = shortcutManager.get();
             let combinedItems = [...initialItemsData];
             combinedItems.splice(2, 0, ...storedItems);
-            
-            combinedItems.forEach(item => {
-                const isLocal = storedItems.some(stored => stored.url === item.url);
-                const itemType = isLocal && !item.icon && !item.img ? 'local' : 'default';
-                listContainer.appendChild(createIconItem(item, itemType));
-            });
-            
+            combinedItems.forEach(item => { const isLocal = storedItems.some(stored => stored.url === item.url); const itemType = isLocal && !item.icon && !item.img ? 'local' : 'default'; listContainer.appendChild(createIconItem(item, itemType)); });
             checkScrollability();
             updateAllWidgetLinks();
         };
 
-        const updateScrollIndicator = () => {
-            const scrollLeft = listContainer.scrollLeft;
-            const maxScrollLeft = listContainer.scrollWidth - listContainer.clientWidth;
-            if (maxScrollLeft <= 0) return;
-            const scrollFraction = scrollLeft / maxScrollLeft;
-            const trackWidth = indicatorTrack.clientWidth;
-            const indicatorWidth = scrollIndicator.clientWidth;
-            const maxIndicatorLeft = trackWidth - indicatorWidth;
-            const indicatorLeft = scrollFraction * maxIndicatorLeft;
-            scrollIndicator.style.transform = `translateY(-50%) translateX(${indicatorLeft}px)`;
-        };
-
-        const checkScrollability = () => {
-            const isScrollable = listContainer.scrollWidth > listContainer.clientWidth;
-            widgetContainer.classList.toggle('scrollable', isScrollable);
-            if (isScrollable) updateScrollIndicator();
-        };
-
+        const updateScrollIndicator = () => { const scrollLeft = listContainer.scrollLeft; const maxScrollLeft = listContainer.scrollWidth - listContainer.clientWidth; if (maxScrollLeft <= 0) return; const scrollFraction = scrollLeft / maxScrollLeft; const trackWidth = indicatorTrack.clientWidth; const indicatorWidth = scrollIndicator.clientWidth; const maxIndicatorLeft = trackWidth - indicatorWidth; const indicatorLeft = scrollFraction * maxIndicatorLeft; scrollIndicator.style.transform = `translateY(-50%) translateX(${indicatorLeft}px)`; };
+        const checkScrollability = () => { const isScrollable = listContainer.scrollWidth > listContainer.clientWidth; widgetContainer.classList.toggle('scrollable', isScrollable); if (isScrollable) updateScrollIndicator(); };
         let isDragging = false;
-        const handleDragMove = (e) => {
-            if (!isDragging) return;
-            e.preventDefault();
-            const trackRect = indicatorTrack.getBoundingClientRect();
-            const maxScrollLeft = listContainer.scrollWidth - listContainer.clientWidth;
-            let positionRatio = (e.clientX - trackRect.left) / trackRect.width;
-            positionRatio = Math.max(0, Math.min(1, positionRatio));
-            listContainer.scrollLeft = positionRatio * maxScrollLeft;
-        };
-        const handleDragEnd = () => {
-            if (!isDragging) return;
-            isDragging = false;
-            document.removeEventListener('mousemove', handleDragMove);
-            document.removeEventListener('mouseup', handleDragEnd);
-        };
-        
-        indicatorTrack.addEventListener('mousedown', (e) => {
-            isDragging = true;
-            handleDragMove(e);
-            document.addEventListener('mousemove', handleDragMove);
-            document.addEventListener('mouseup', handleDragEnd);
-        });
-
-        const closeSearch = () => {
-            widgetContainer.classList.remove('search-mode');
-            widgetWrapper.classList.remove('search-mode');
-            searchInput.value = '';
-            searchResultsContainer.innerHTML = '';
-        };
-
+        const handleDragMove = (e) => { if (!isDragging) return; e.preventDefault(); const trackRect = indicatorTrack.getBoundingClientRect(); const maxScrollLeft = listContainer.scrollWidth - listContainer.clientWidth; let positionRatio = (e.clientX - trackRect.left) / trackRect.width; positionRatio = Math.max(0, Math.min(1, positionRatio)); listContainer.scrollLeft = positionRatio * maxScrollLeft; };
+        const handleDragEnd = () => { if (!isDragging) return; isDragging = false; document.removeEventListener('mousemove', handleDragMove); document.removeEventListener('mouseup', handleDragEnd); };
+        indicatorTrack.addEventListener('mousedown', (e) => { isDragging = true; handleDragMove(e); document.addEventListener('mousemove', handleDragMove); document.addEventListener('mouseup', handleDragEnd); });
+        const closeSearch = () => { widgetContainer.classList.remove('search-mode'); widgetWrapper.classList.remove('search-mode'); searchInput.value = ''; searchResultsContainer.innerHTML = ''; };
         let hideTimeout = null;
         widgetContainer.addEventListener('mouseenter', () => { clearTimeout(hideTimeout); });
         widgetContainer.addEventListener('mouseleave', () => { hideTimeout = setTimeout(() => { widgetContainer.classList.add('hidden'); }, 6000); });
-        
-        document.addEventListener('click', (e) => {
-            if (!languagePanel.contains(e.target) && !languageBtn.contains(e.target)) {
-                languagePanel.classList.remove('visible');
-            }
-            if (!widgetContainer.classList.contains('hidden') || widgetContainer.contains(e.target)) {
-                return;
-            }
-            widgetContainer.classList.remove('hidden');
-            clearTimeout(hideTimeout);
-            hideTimeout = setTimeout(() => {
-                widgetContainer.classList.add('hidden');
-            }, 6000);
-        });
-
+        document.addEventListener('click', (e) => { if (!languagePanel.contains(e.target) && !languageBtn.contains(e.target)) { languagePanel.classList.remove('visible'); } if (!widgetContainer.classList.contains('hidden') || widgetContainer.contains(e.target)) { return; } widgetContainer.classList.remove('hidden'); clearTimeout(hideTimeout); hideTimeout = setTimeout(() => { widgetContainer.classList.add('hidden'); }, 6000); });
         listContainer.addEventListener('scroll', updateScrollIndicator);
         window.addEventListener('resize', checkScrollability);
-        
         searchTrigger.addEventListener('click', openSearch);
-        
-        languageBtn.addEventListener('click', (e) => {
-            e.stopPropagation();
-            languagePanel.classList.toggle('visible');
-        });
-        
-        searchInput.addEventListener('input', function() {
-            if (!fullApiItemsData) return;
-            const searchTerm = this.value.toLowerCase().trim();
-            const filteredItems = fullApiItemsData.filter(item => item.name.toLowerCase().includes(searchTerm));
-            renderInitialResults(filteredItems);
-        });
-        
-        searchResultsContainer.addEventListener('scroll', () => {
-            const isAtBottom = searchResultsContainer.scrollTop + searchResultsContainer.clientHeight >= searchResultsContainer.scrollHeight - 10;
-            if (isAtBottom) {
-                appendNextPage();
-            }
-        });
-
+        languageBtn.addEventListener('click', (e) => { e.stopPropagation(); languagePanel.classList.toggle('visible'); });
+        searchInput.addEventListener('input', function() { if (!fullApiItemsData) return; const searchTerm = this.value.toLowerCase().trim(); const filteredItems = fullApiItemsData.filter(item => item.name.toLowerCase().includes(searchTerm)); renderInitialResults(filteredItems); });
+        searchResultsContainer.addEventListener('scroll', () => { const isAtBottom = searchResultsContainer.scrollTop + searchResultsContainer.clientHeight >= searchResultsContainer.scrollHeight - 10; if (isAtBottom) { appendNextPage(); } });
         searchClose.addEventListener('click', closeSearch);
-        
-        document.addEventListener('keydown', (e) => {
-            if (e.key === 'Escape' && widgetWrapper.classList.contains('search-mode')) {
-                closeSearch();
-            }
-        });
+        document.addEventListener('keydown', (e) => { if (e.key === 'Escape' && widgetWrapper.classList.contains('search-mode')) { closeSearch(); } });
         
         const addCurrentPageToWidget = async (e) => {
             e.preventDefault();
@@ -481,32 +329,19 @@ const createIconItem = (item, type = 'default') => {
             const baseUrl = getProcessedUrl(window.location.href);
             let iconName = document.title || t.currentPage;
             try {
-                const response = await fetch(`get_title.php?url=${encodeURIComponent(baseUrl)}`);
-                if (response.ok) {
-                    const data = await response.json();
-                    if (data.title) { iconName = data.title; }
-                }
+                const response = await fetch(`https://isai.kr/get_title.php?url=${encodeURIComponent(baseUrl)}`);
+                if (response.ok) { const data = await response.json(); if (data.title) { iconName = data.title; } }
             } catch (error) { console.error('Failed to fetch title:', error); }
-
             const newIcon = { name: iconName, url: baseUrl };
             let storedItems = shortcutManager.get();
             const isAlreadyAdded = storedItems.some(item => getProcessedUrl(item.url) === getProcessedUrl(newIcon.url));
-            
             if (!isAlreadyAdded) {
-                if (storedItems.length >= 10) {
-                    storedItems.shift();
-                }
+                if (storedItems.length >= 10) { storedItems.shift(); }
                 storedItems.push(newIcon);
                 shortcutManager.set(storedItems);
-                
-                try {
-                    await fetch('register_app.php', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(newIcon) });
-                } catch (error) { console.error('DB 등록/갱신 실패:', error); }
-                
+                try { await fetch('https://isai.kr/register_app.php', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(newIcon) }); } catch (error) { console.error('DB 등록/갱신 실패:', error); }
                 initialRender();
-                if (widgetWrapper.classList.contains('search-mode')) {
-                    closeSearch();
-                }
+                if (widgetWrapper.classList.contains('search-mode')) { closeSearch(); }
             } else {
                 showToast(t.alreadyAdded);
             }
@@ -516,41 +351,15 @@ const createIconItem = (item, type = 'default') => {
             e.preventDefault();
             const textToCopy = "<script src='https://cdn.jsdelivr.net/npm/cdnhost@latest/ws_cdn.js'><\/script>";
             const t = translations[currentLang] || translations['en'];
-            
-            const fallbackCopy = () => {
-                const textArea = document.createElement("textarea");
-                textArea.value = textToCopy;
-                textArea.style.position = "fixed";
-                textArea.style.top = 0;
-                textArea.style.left = "-9999px";
-                document.body.appendChild(textArea);
-                textArea.focus();
-                textArea.select();
-                try {
-                    document.execCommand('copy');
-                    showToast(t.codeCopied);
-                } catch (err) {
-                    console.error('Fallback: Oops, unable to copy', err);
-                }
-                document.body.removeChild(textArea);
-            };
-
-            if (navigator.clipboard && window.isSecureContext) {
-                navigator.clipboard.writeText(textToCopy).then(() => {
-                    showToast(t.codeCopied);
-                }).catch(() => {
-                    fallbackCopy();
-                });
-            } else {
-                fallbackCopy();
-            }
+            const fallbackCopy = () => { const textArea = document.createElement("textarea"); textArea.value = textToCopy; textArea.style.position = "fixed"; textArea.style.top = 0; textArea.style.left = "-9999px"; document.body.appendChild(textArea); textArea.focus(); textArea.select(); try { document.execCommand('copy'); showToast(t.codeCopied); } catch (err) { console.error('Fallback: Oops, unable to copy', err); } document.body.removeChild(textArea); };
+            if (navigator.clipboard && window.isSecureContext) { navigator.clipboard.writeText(textToCopy).then(() => { showToast(t.codeCopied); }).catch(() => { fallbackCopy(); }); } else { fallbackCopy(); }
         };
 
         addToHomeBtn.addEventListener('click', addCurrentPageToWidget);
         searchAddBtn.addEventListener('click', copyWidgetScript);
         
         shortcutManager.syncFromURL();
-        shortcutManager.get(); 
+        shortcutManager.get();
         
         populateLanguagePanel();
         applyLanguage(currentLang);

package/ws_cdnhtml.js

@@ -5,6 +5,7 @@ const appContainer = document.getElementById('app');
 // 이렇게 하면 모든 id, class, 속성들이 완벽하게 보존됩니다.
 const widgetHTML = `
 
+
     <div id="fhl-toast-notification" class="fhl-toast"></div>
     <div class="fhl-widget-container" id="fhl-widget-container">
         <div class="fhl-indicator-track" id="fhl-indicator-track">
@@ -25,8 +26,8 @@ const widgetHTML = `
                 <div class="fhl-search-content">
                     <div class="fhl-search-results" id="fhl-search-results"></div>
                     <div class="fhl-fixed-panel">
-                        <a href="#" id="fhl-search-add-btn" class="fhl-fixed-item"><i class="ph-bold ph-code"></i></a>
-                        <a href="https://isai.kr/#chat" id="fhl-fixed-question" class="fhl-fixed-item"><i class="ph-bold ph-question"></i></a>
+                        <a href="#" id="fhl-search-add-btn" class="fhl-fixed-item"><i class="ph-bold ph-download-simple"></i></a>
+                        <a href="#" id="fhl-fixed-image" class="fhl-fixed-item"><i class="ph-bold ph-image"></i></a>
                         <a href="https://zoai.oduc.kr/ko/character/select" id="fhl-fixed-chat" class="fhl-fixed-item"><i class="ph-bold ph-smiley"></i></a>
                         <a href="https://gig.snapp.im/" id="fhl-fixed-ad" class="fhl-fixed-item"><i class="ph-bold ph-megaphone"></i></a>
                     </div>
@@ -36,6 +37,7 @@ const widgetHTML = `
         <div id="fhl-language-panel" class="fhl-language-panel"></div>
     </div>
 
+
 `;
 
 // 3. appContainer가 실제로 존재하는지 확인한 후,

package/ws_css.css

@@ -1,42 +1,24 @@
 
         .fhl-widget-wrapper *, .fhl-widget-wrapper *::before, .fhl-widget-wrapper *::after { box-sizing: border-box; }
-        .fhl-widget-container {
-            position: fixed; z-index: 1000; bottom: 20px; left: 50%;
-            transform: translateX(-50%) translateY(0); display: flex; flex-direction: column; align-items: center;
-            width: calc(100% - 30px); max-width: 460px; pointer-events: auto;
-            transition: opacity 0.4s ease-in-out, transform 0.4s ease-in-out;
-        }
+        .fhl-widget-container { position: fixed; z-index: 1000; bottom: 20px; left: 50%; transform: translateX(-50%) translateY(0); display: flex; flex-direction: column; align-items: center; width: calc(100% - 30px); max-width: 460px; pointer-events: auto; transition: opacity 0.4s ease-in-out, transform 0.4s ease-in-out; }
         .fhl-widget-container.hidden { opacity: 0; transform: translateX(-50%) translateY(20px); pointer-events: none; }
         .fhl-indicator-track { position: relative; width: 100px; height: 14px; margin-bottom: 8px; cursor: pointer; background-color: transparent; transition: opacity 0.3s ease; opacity: 0; pointer-events: auto; }
         .fhl-widget-container.scrollable .fhl-indicator-track { opacity: 1; }
         .fhl-widget-container.search-mode .fhl-indicator-track { display: none; }
         .fhl-scroll-indicator { position: absolute; top: 50%; left: 0; width: 12px; height: 12px; background-color: #555; border-radius: 50%; transform: translateY(-50%); transition: transform 0.1s linear; pointer-events: none; }
-        .fhl-widget-wrapper { 
-            position: relative; display: flex; align-items: center; width: 100%; max-width: 460px; height: 52px; padding: 7px 10px; border-radius: 26px; 
-            background-color: rgba(255, 255, 255, 0.9); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); 
-            box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; 
-            transition: all 0.3s ease-in-out; pointer-events: auto;
-            overflow: visible;
-        }
+        .fhl-widget-wrapper { position: relative; display: flex; align-items: center; width: 100%; max-width: 460px; height: 52px; padding: 7px 10px; border-radius: 26px; background-color: rgba(255, 255, 255, 0.9); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; transition: all 0.3s ease-in-out; pointer-events: auto; overflow: visible; }
         .fhl-icon-display { position: relative; flex-shrink: 0; display: flex; justify-content: center; align-items: center; width: 38px; height: 38px; color: #333; background-color: rgba(0, 0, 0, 0.05); border: none; border-radius: 50%; text-decoration: none; cursor: pointer; padding: 0; transition: background-color 0.2s ease; }
         .fhl-icon-display:hover { background-color: rgba(0, 0, 0, 0.1); }
         .fhl-icon-display i { font-size: 22px; }
         .fhl-list-container .fhl-icon-display { display: inline-flex; width: auto; padding: 0 8px 0 0; border-radius: 20px; background-color: transparent; }
         .fhl-list-container .fhl-icon-display:hover { background-color: rgba(0, 0, 0, 0.08); }
         .fhl-list-container .fhl-icon-display:hover .fhl-icon-circle { background-color: transparent; }
-        .fhl-item-name {
-            font-size: 14px; font-weight: 500; white-space: nowrap; overflow: hidden;
-            max-width: 0; opacity: 0; transition: max-width 0.3s ease-in-out, opacity 0.2s ease-in-out 0.05s;
-        }
+        .fhl-item-name { font-size: 14px; font-weight: 500; white-space: nowrap; overflow: hidden; max-width: 0; opacity: 0; transition: max-width 0.3s ease-in-out, opacity 0.2s ease-in-out 0.05s; }
         .fhl-list-container .fhl-icon-display:hover .fhl-item-name { max-width: 150px; opacity: 1; }
         .fhl-icon-circle { flex-shrink: 0; display: flex; justify-content: center; align-items: center; width: 38px; height: 38px; background-color: rgba(0, 0, 0, 0.05); border-radius: 50%; transition: background-color 0.2s ease; overflow: hidden; }
         .fhl-icon-circle img { width: 24px; height: 24px; object-fit: cover; border-radius: 50%; }
         .fhl-icon-bar { display: flex; align-items: center; gap: 8px; width: 100%; transition: opacity 0.3s ease; }
-        .fhl-list-container { 
-            padding:0 8px; flex-grow: 1; display: flex; align-items: center; gap: 6px; overflow-x: auto; -ms-overflow-style: none; scrollbar-width: none; scroll-snap-type: x mandatory; 
-            mask-image: linear-gradient(to right, transparent, black 20px, black calc(100% - 20px), transparent); -webkit-mask-image: linear-gradient(to right, transparent, black 20px, black calc(100% - 20px), transparent);
-            padding-bottom: 30px; margin-bottom: -30px; overflow-y: visible;
-        }
+        .fhl-list-container { padding:0 8px; flex-grow: 1; display: flex; align-items: center; gap: 6px; overflow-x: auto; -ms-overflow-style: none; scrollbar-width: none; scroll-snap-type: x mandatory; mask-image: linear-gradient(to right, transparent, black 20px, black calc(100% - 20px), transparent); -webkit-mask-image: linear-gradient(to right, transparent, black 20px, black calc(100% - 20px), transparent); padding-bottom: 30px; margin-bottom: -30px; overflow-y: visible; }
         .fhl-list-container::-webkit-scrollbar { display: none; }
         .fhl-list-container > .fhl-icon-display { scroll-snap-align: center; }
         .fhl-widget-wrapper.search-mode { height: 280px; align-items: flex-start; border-radius: 20px; }
@@ -57,58 +39,13 @@
         .fhl-fixed-item { display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 10px; text-decoration: none; color: #444; cursor: pointer; transition: background-color 0.2s ease; }
         .fhl-fixed-item:hover { background-color: rgba(0, 0, 0, 0.08); }
         .fhl-fixed-item i { font-size: 24px; }
-        .fhl-item-controls {
-            position: absolute; bottom: -20px; left: 50%; transform: translateX(-50%); display: flex; gap: 4px;
-            background-color: rgba(0,0,0,0.7); border-radius: 10px; padding: 2px 4px; opacity: 0; visibility: hidden;
-            transition: all 0.2s ease; pointer-events: none; z-index: 20;
-        }
+        .fhl-item-controls { position: absolute; bottom: -20px; left: 50%; transform: translateX(-50%); display: flex; gap: 4px; background-color: rgba(0,0,0,0.7); border-radius: 10px; padding: 2px 4px; opacity: 0; visibility: hidden; transition: all 0.2s ease; pointer-events: none; z-index: 20; }
         .fhl-list-container .fhl-icon-display:hover .fhl-item-controls { opacity: 1; visibility: visible; pointer-events: auto; bottom: -13px; }
         .fhl-control-btn { background: none; border: none; color: white; cursor: pointer; font-size: 16px; line-height: 1; padding: 2px; font-family: monospace; }
         .fhl-control-btn:hover { color: #007bff; }
-        .fhl-toast {
-            position: fixed; bottom: 90px; left: 50%; transform: translateX(-50%) translateY(10px);
-            background-color: rgba(0, 0, 0, 0.8); color: #fff; padding: 8px 16px; border-radius: 18px;
-            font-size: 14px; z-index: 1001; opacity: 0; visibility: hidden; pointer-events: none;
-            transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s;
-        }
+        .fhl-toast { position: fixed; bottom: 90px; left: 50%; transform: translateX(-50%) translateY(10px); background-color: rgba(0, 0, 0, 0.8); color: #fff; padding: 8px 16px; border-radius: 18px; font-size: 14px; z-index: 1001; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s; }
         .fhl-toast.visible { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
-        .fhl-language-panel {
-            position: absolute;
-            bottom: 100%;
-            left: 50%;
-            transform: translateX(-50%);
-            margin-bottom: 15px;
-            background-color: rgba(255, 255, 255, 0.95);
-            backdrop-filter: blur(10px);
-            -webkit-backdrop-filter: blur(10px);
-            border-radius: 12px;
-            box-shadow: 0 4px 15px rgba(0,0,0,0.2);
-            padding: 8px;
-            display: grid;
-            grid-template-columns: 1fr 1fr;
-            gap: 4px;
-            opacity: 0;
-            visibility: hidden;
-            pointer-events: none;
-            transition: opacity 0.3s ease, transform 0.3s ease;
-            transform-origin: bottom center;
-        }
-        .fhl-language-panel.visible {
-            opacity: 1;
-            visibility: visible;
-            pointer-events: auto;
-        }
-        .fhl-language-item {
-            display: block;
-            padding: 6px 12px;
-            font-size: 14px;
-            color: #333;
-            text-decoration: none;
-            border-radius: 8px;
-            transition: background-color 0.2s ease;
-            cursor: pointer;
-            text-align: center;
-        }
-        .fhl-language-item:hover {
-            background-color: rgba(0,0,0,0.1);
-        }
+        .fhl-language-panel { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); margin-bottom: 15px; background-color: rgba(255, 255, 255, 0.95); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-radius: 12px; box-shadow: 0 4px 15px rgba(0,0,0,0.2); padding: 8px; display: grid; grid-template-columns: 1fr 1fr; gap: 4px; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.3s ease, transform 0.3s ease; transform-origin: bottom center; }
+        .fhl-language-panel.visible { opacity: 1; visibility: visible; pointer-events: auto; }
+        .fhl-language-item { display: block; padding: 6px 12px; font-size: 14px; color: #333; text-decoration: none; border-radius: 8px; transition: background-color 0.2s ease; cursor: pointer; text-align: center; }
+        .fhl-language-item:hover { background-color: rgba(0,0,0,0.1); }

package/ws_lg.js

@@ -16,5 +16,5 @@ const translations = {
   vi: { search: 'Tìm kiếm', question: 'Câu hỏi', forum: 'Diễn đàn', blog: 'Blog', characterChat: 'Trò chuyện nhân vật', translate: 'Dịch', tarot: 'Tarot', psychology: 'Tâm lý học', ads: 'Quảng cáo', openSearch: 'Mở tìm kiếm', addToWidget: 'Thêm vào tiện ích', closeSearch: 'Đóng tìm kiếm', changeLanguage: 'Đổi ngôn ngữ', images: 'Hình ảnh', searchPlaceholder: 'Tìm kiếm...', alreadyAdded: 'Trang này đã được thêm vào tiện ích.', currentPage: 'Trang hiện tại', codeCopied: 'Đã sao chép mã. Vui lòng dán vào trang web của bạn.' },
   id: { search: 'Cari', question: 'Pertanyaan', forum: 'Forum', blog: 'Blog', characterChat: 'Obrolan Karakter', translate: 'Terjemahkan', tarot: 'Tarot', psychology: 'Psikologi', ads: 'Iklan', openSearch: 'Buka Pencarian', addToWidget: 'Tambah ke Widget', closeSearch: 'Tutup Pencarian', changeLanguage: 'Ubah Bahasa', images: 'Gambar', searchPlaceholder: 'Cari...', alreadyAdded: 'Halaman ini sudah ditambahkan ke widget.', currentPage: 'Halaman Saat Ini', codeCopied: 'Kode disalin. Silakan tempel di situs Anda.' },
   tr: { search: 'Ara', question: 'Soru', forum: 'Forum', blog: 'Blog', characterChat: 'Karakter Sohbeti', translate: 'Çevir', tarot: 'Tarot', psychology: 'Psikoloji', ads: 'Reklamlar', openSearch: 'Aramayı Aç', addToWidget: 'Widget\'a Ekle', closeSearch: 'Aramayı Kapat', changeLanguage: 'Dili Değiştir', images: 'Görseller', searchPlaceholder: 'Ara...', alreadyAdded: 'Bu sayfa zaten widget\'a eklenmiş.', currentPage: 'Mevcut Sayfa', codeCopied: 'Kod kopyalandı. Lütfen sitenize yapıştırın.' },
-  ur: { search: 'تلاش', question: 'سوال', forum: 'فورم', blog: 'بلاگ', characterChat: 'کردار چیٹ', translate: 'ترجمہ', tarot: 'ٹیرو', psychology: 'نفسیات', ads: 'اشتہارات', openSearch: 'تلاش کھولیں', addToWidget: 'ویجیٹ میں شامل کریں', closeSearch: 'تلاش بند کریں', changeLanguage: 'زبان تبدیل کریں', images: 'تصاویر', searchPlaceholder: 'تلاش کریں...', alreadyAdded: 'یہ صفحہ پہلے ہی ویجیٹ میں شامل ہے۔', currentPage: 'موجودہ صفحہ', codeCopied: 'کوڈ کاپی ہوگیا ہے۔ براہ کرم اسے اپنی سائٹ پر چسپاں کریں۔' }
+  ur: { search: 'تلاش', question: 'سوال', forum: 'فورم', blog: 'بلاگ', characterChat: 'کردار چیٹ', translate: 'ترجمہ', tarot: 'ٹیرو', psychology: 'نفسیات', ads: 'اشتہارات', openSearch: 'تلاش کھولیں', addToWidget: 'ویجیٹ میں شامل کریں', closeSearch: 'تلاش بند کریں', changeLanguage: 'زبان تبدیل کریں', images: 'تصاویر', searchPlaceholder: 'تلاش کریں...', alreadyAdded: 'یہ صفحہ پہلے ہی ویجیট میں شامل ہے۔', currentPage: 'موجودہ صفحہ', codeCopied: 'کوڈ کاپی ہوگیا ہے۔ براہ کرم اسے اپنی سائٹ پر چسپاں کریں۔' }
 };