dwindown/emoji-glossary
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix javascript issues

Browse Source
This commit is contained in:
dwindown
2025-08-23 16:53:43 +07:00
parent b0244b7ac0
commit 5f38b274cc
2 changed files with 20 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
index.html
View File

@@ -40,8 +40,8 @@
</button> </button>
<h1 class="text-4xl font-bold tracking-tight flex-1 text-center">Emoji Glossary</h1> <h1 class="text-4xl font-bold tracking-tight flex-1 text-center">Emoji Glossary</h1>
<button id="dark-mode-toggle" class="p-2 rounded-full text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800 focus:outline-none"> <button id="dark-mode-toggle" class="p-2 rounded-full text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800 focus:outline-none">
<svg id="theme-toggle-dark-icon" class="hidden dark:block w-6 h-6" fill="currentColor" viewBox="0 0 20 20"><path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z"></path></svg> <svg id="theme-toggle-dark-icon" class="block dark:hidden w-6 h-6" fill="currentColor" viewBox="0 0 20 20"><path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z"></path></svg>
<svg id="theme-toggle-light-icon" class="block dark:hidden w-6 h-6" fill="currentColor" viewBox="0 0 20 20"><path d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 5.05A1 1 0 003.636 6.464l.707.707a1 1 0 001.414-1.414l-.707-.707zM3 11a1 1 0 100-2H2a1 1 0 100 2h1zM13.536 14.95a1 1 0 011.414 0l.707.707a1 1 0 01-1.414 1.414l-.707-.707a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg> <svg id="theme-toggle-light-icon" class="hidden dark:block w-6 h-6" fill="currentColor" viewBox="0 0 20 20"><path d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 5.05A1 1 0 003.636 6.464l.707.707a1 1 0 001.414-1.414l-.707-.707zM3 11a1 1 0 100-2H2a1 1 0 100 2h1zM13.536 14.95a1 1 0 011.414 0l.707.707a1 1 0 01-1.414 1.414l-.707-.707a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg>
</button> </button>
</div> </div>
@@ -49,8 +49,8 @@
<div class="hidden lg:block relative"> <div class="hidden lg:block relative">
<h1 class="text-4xl font-bold tracking-tight">Emoji Glossary</h1> <h1 class="text-4xl font-bold tracking-tight">Emoji Glossary</h1>
<button id="dark-mode-toggle-desktop" class="absolute top-1/2 right-0 -translate-y-1/2 p-2 rounded-full text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800 focus:outline-none"> <button id="dark-mode-toggle-desktop" class="absolute top-1/2 right-0 -translate-y-1/2 p-2 rounded-full text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800 focus:outline-none">
<svg id="theme-toggle-dark-icon-desktop" class="hidden dark:block w-6 h-6" fill="currentColor" viewBox="0 0 20 20"><path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z"></path></svg> <svg id="theme-toggle-dark-icon-desktop" class="block dark:hidden w-6 h-6" fill="currentColor" viewBox="0 0 20 20"><path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z"></path></svg>
<svg id="theme-toggle-light-icon-desktop" class="block dark:hidden w-6 h-6" fill="currentColor" viewBox="0 0 20 20"><path d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 5.05A1 1 0 003.636 6.464l.707.707a1 1 0 001.414-1.414l-.707-.707zM3 11a1 1 0 100-2H2a1 1 0 100 2h1zM13.536 14.95a1 1 0 011.414 0l.707.707a1 1 0 01-1.414 1.414l-.707-.707a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg> <svg id="theme-toggle-light-icon-desktop" class="hidden dark:block w-6 h-6" fill="currentColor" viewBox="0 0 20 20"><path d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 5.05A1 1 0 003.636 6.464l.707.707a1 1 0 001.414-1.414l-.707-.707zM3 11a1 1 0 100-2H2a1 1 0 100 2h1zM13.536 14.95a1 1 0 011.414 0l.707.707a1 1 0 01-1.414 1.414l-.707-.707a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg>
</button> </button>
</div> </div>

20
script.js
View File

@@ -8,6 +8,12 @@ document.addEventListener('DOMContentLoaded', () => {
const darkIcon = document.getElementById('theme-toggle-dark-icon'); const darkIcon = document.getElementById('theme-toggle-dark-icon');
const lightIconDesktop = document.getElementById('theme-toggle-light-icon-desktop'); const lightIconDesktop = document.getElementById('theme-toggle-light-icon-desktop');
const darkIconDesktop = document.getElementById('theme-toggle-dark-icon-desktop'); const darkIconDesktop = document.getElementById('theme-toggle-dark-icon-desktop');
// Check if essential elements exist
if (!emojiGrid || !searchInput) {
console.error('Critical DOM elements missing');
return;
}
const modal = document.getElementById('emoji-modal'); const modal = document.getElementById('emoji-modal');
const modalContent = document.getElementById('modal-content'); const modalContent = document.getElementById('modal-content');
const modalCloseBtn = document.getElementById('modal-close-btn'); const modalCloseBtn = document.getElementById('modal-close-btn');
@@ -57,8 +63,8 @@ document.addEventListener('DOMContentLoaded', () => {
applyTheme(isDark); applyTheme(isDark);
}; };
darkModeToggle.addEventListener('click', toggleDarkMode); if (darkModeToggle) darkModeToggle.addEventListener('click', toggleDarkMode);
darkModeToggleDesktop.addEventListener('click', toggleDarkMode); if (darkModeToggleDesktop) darkModeToggleDesktop.addEventListener('click', toggleDarkMode);
// Set initial icon state on load // Set initial icon state on load
const initialIsDark = document.documentElement.classList.contains('dark'); const initialIsDark = document.documentElement.classList.contains('dark');
@@ -89,10 +95,16 @@ document.addEventListener('DOMContentLoaded', () => {
Promise.all(jsonFiles.map(file => Promise.all(jsonFiles.map(file =>
fetch(file) fetch(file)
.then(response => { .then(response => {
if (!response.ok) throw new Error(`Failed to load ${file}`); if (!response.ok) {
console.error(`Failed to load ${file}: ${response.status}`);
throw new Error(`Failed to load ${file}`);
}
return response.json(); return response.json();
}) })
.catch(error => { console.error(error); return []; }) .catch(error => {
console.error(`Error loading ${file}:`, error);
return file.includes('indonesian-keywords') ? {keywords: {}} : [];
})
)) ))
.then(allData => { .then(allData => {
// Extract Indonesian keywords from the last file // Extract Indonesian keywords from the last file