fix: enhance shortcut key detection for alt key combinations and update Discord invite link across all pages.

This commit is contained in:
abdullahalam123
2025-11-21 19:32:08 +05:30
parent 1a17cd4e7e
commit 83aadb6d98
14 changed files with 57 additions and 39 deletions

View File

@@ -241,7 +241,7 @@
clip-rule="evenodd" /> clip-rule="evenodd" />
</svg> </svg>
</a> </a>
<a href="https://discord.gg/q42xWQmJ" target="_blank" rel="noopener noreferrer" <a href="https://discord.gg/AP2Y97juZT" target="_blank" rel="noopener noreferrer"
class="text-gray-400 hover:text-indigo-400" title="Discord"> class="text-gray-400 hover:text-indigo-400" title="Discord">
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true"> <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path <path

View File

@@ -138,7 +138,7 @@
clip-rule="evenodd" /> clip-rule="evenodd" />
</svg> </svg>
</a> </a>
<a href="https://discord.gg/q42xWQmJ" target="_blank" rel="noopener noreferrer" <a href="https://discord.gg/AP2Y97juZT" target="_blank" rel="noopener noreferrer"
class="text-gray-400 hover:text-indigo-400" title="Discord"> class="text-gray-400 hover:text-indigo-400" title="Discord">
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true"> <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path <path

View File

@@ -285,7 +285,7 @@
clip-rule="evenodd" /> clip-rule="evenodd" />
</svg> </svg>
</a> </a>
<a href="https://discord.gg/q42xWQmJ" target="_blank" rel="noopener noreferrer" <a href="https://discord.gg/AP2Y97juZT" target="_blank" rel="noopener noreferrer"
class="text-gray-400 hover:text-indigo-400" title="Discord"> class="text-gray-400 hover:text-indigo-400" title="Discord">
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true"> <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path <path

View File

@@ -734,7 +734,7 @@
clip-rule="evenodd" /> clip-rule="evenodd" />
</svg> </svg>
</a> </a>
<a href="https://discord.gg/q42xWQmJ" target="_blank" rel="noopener noreferrer" <a href="https://discord.gg/AP2Y97juZT" target="_blank" rel="noopener noreferrer"
class="text-gray-400 hover:text-indigo-400" title="Discord"> class="text-gray-400 hover:text-indigo-400" title="Discord">
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true"> <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path <path
@@ -767,4 +767,4 @@
<script type="module" src="src/js/mobileMenu.ts"></script> <script type="module" src="src/js/mobileMenu.ts"></script>
</body> </body>
</html> </html>

View File

@@ -530,18 +530,19 @@
<span class="text-lg font-semibold text-white">How do I purchase a commercial license?</span> <span class="text-lg font-semibold text-white">How do I purchase a commercial license?</span>
<i data-lucide="chevron-down" class="faq-icon w-6 h-6 text-gray-400 transition-transform"></i> <i data-lucide="chevron-down" class="faq-icon w-6 h-6 text-gray-400 transition-transform"></i>
</button> </button>
<div class="faq-answer max-h-0 overflow-hidden transition-all duration-300 ease-in-out"> <div class="faq-answer max-h-0 overflow-hidden transition-all duration-300 ease-in-out">
<p class="p-6 pt-0 text-gray-400"> <p class="p-6 pt-0 text-gray-400">
BentoPDF is available under a lifetime, one-time purchase commercial license. BentoPDF is available under a lifetime, one-time purchase commercial license.
You can purchase it directly here: You can purchase it directly here:
<a href="https://ko-fi.com/s/f32ca4cb75" class="text-indigo-400 hover:underline">Buy Commercial License</a>. <a href="https://ko-fi.com/s/f32ca4cb75" class="text-indigo-400 hover:underline">Buy
<br><br> Commercial License</a>.
If you have specific requirements or want a custom licensing arrangement, <br><br>
feel free to <a href="./contact.html" class="text-indigo-400 hover:underline">contact us</a> If you have specific requirements or want a custom licensing arrangement,
with details about your use case, company size, and deployment needs. feel free to <a href="./contact.html" class="text-indigo-400 hover:underline">contact us</a>
We're happy to work with you to find the best fit. with details about your use case, company size, and deployment needs.
</p> We're happy to work with you to find the best fit.
</div> </p>
</div>
</div> </div>
</div> </div>
</section> </section>
@@ -619,7 +620,7 @@
clip-rule="evenodd" /> clip-rule="evenodd" />
</svg> </svg>
</a> </a>
<a href="https://discord.gg/q42xWQmJ" target="_blank" rel="noopener noreferrer" <a href="https://discord.gg/AP2Y97juZT" target="_blank" rel="noopener noreferrer"
class="text-gray-400 hover:text-indigo-400" title="Discord"> class="text-gray-400 hover:text-indigo-400" title="Discord">
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true"> <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path <path

View File

@@ -245,7 +245,7 @@
clip-rule="evenodd" /> clip-rule="evenodd" />
</svg> </svg>
</a> </a>
<a href="https://discord.gg/q42xWQmJ" target="_blank" rel="noopener noreferrer" <a href="https://discord.gg/AP2Y97juZT" target="_blank" rel="noopener noreferrer"
class="text-gray-400 hover:text-indigo-400" title="Discord"> class="text-gray-400 hover:text-indigo-400" title="Discord">
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true"> <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path <path

View File

@@ -155,7 +155,16 @@ export class ShortcutsManager {
if (e.altKey) keys.push('alt'); if (e.altKey) keys.push('alt');
if (e.shiftKey) keys.push('shift'); if (e.shiftKey) keys.push('shift');
const key = e.key.toLowerCase(); let key = e.key.toLowerCase();
if (e.altKey && e.code) {
if (e.code.startsWith('Key')) {
key = e.code.slice(3).toLowerCase();
} else if (e.code.startsWith('Digit')) {
key = e.code.slice(5);
}
}
if (!['control', 'shift', 'alt', 'meta'].includes(key)) { if (!['control', 'shift', 'alt', 'meta'].includes(key)) {
keys.push(key); keys.push(key);
} }
@@ -184,6 +193,6 @@ export class ShortcutsManager {
return; return;
} }
} }
}, { capture: true }); }, { capture: true });
} }
} }

View File

@@ -283,7 +283,7 @@ const init = () => {
} }
if (window.location.hash.startsWith('#tool-')) { if (window.location.hash.startsWith('#tool-')) {
const toolId = window.location.hash.substring(6); const toolId = window.location.hash.substring(6);
setTimeout(() => { setTimeout(() => {
setupToolInterface(toolId); setupToolInterface(toolId);
history.replaceState(null, '', window.location.pathname); history.replaceState(null, '', window.location.pathname);
@@ -560,7 +560,7 @@ const init = () => {
input.className = 'shortcut-input w-32 bg-gray-800 border border-gray-600 text-white text-center text-sm rounded px-2 py-1 focus:ring-2 focus:ring-indigo-500 focus:border-transparent outline-none transition-all'; input.className = 'shortcut-input w-32 bg-gray-800 border border-gray-600 text-white text-center text-sm rounded px-2 py-1 focus:ring-2 focus:ring-indigo-500 focus:border-transparent outline-none transition-all';
input.placeholder = 'Click to set'; input.placeholder = 'Click to set';
input.value = formatShortcutDisplay(currentShortcut, isMac); input.value = formatShortcutDisplay(currentShortcut, isMac);
input.readOnly = true; input.readOnly = true;
const clearBtn = document.createElement('button'); const clearBtn = document.createElement('button');
clearBtn.className = 'absolute -right-2 -top-2 bg-gray-700 hover:bg-red-600 text-white rounded-full p-0.5 hidden group-hover:block shadow-sm'; clearBtn.className = 'absolute -right-2 -top-2 bg-gray-700 hover:bg-red-600 text-white rounded-full p-0.5 hidden group-hover:block shadow-sm';
@@ -572,7 +572,7 @@ const init = () => {
clearBtn.onclick = (e) => { clearBtn.onclick = (e) => {
e.stopPropagation(); e.stopPropagation();
ShortcutsManager.setShortcut(toolId, ''); ShortcutsManager.setShortcut(toolId, '');
renderShortcutsList(); renderShortcutsList();
}; };
input.onkeydown = async (e) => { input.onkeydown = async (e) => {
@@ -597,7 +597,16 @@ const init = () => {
if (e.altKey) keys.push('alt'); if (e.altKey) keys.push('alt');
if (e.shiftKey) keys.push('shift'); if (e.shiftKey) keys.push('shift');
const key = e.key.toLowerCase(); let key = e.key.toLowerCase();
if (e.altKey && e.code) {
if (e.code.startsWith('Key')) {
key = e.code.slice(3).toLowerCase();
} else if (e.code.startsWith('Digit')) {
key = e.code.slice(5);
}
}
const isModifier = ['control', 'shift', 'alt', 'meta'].includes(key); const isModifier = ['control', 'shift', 'alt', 'meta'].includes(key);
const isDeadKey = key === 'dead' || key.startsWith('dead'); const isDeadKey = key === 'dead' || key.startsWith('dead');
@@ -628,7 +637,7 @@ const init = () => {
`<strong>${displayCombo}</strong> is already assigned to:<br><br>` + `<strong>${displayCombo}</strong> is already assigned to:<br><br>` +
`<em>"${existingToolName}"</em><br><br>` + `<em>"${existingToolName}"</em><br><br>` +
`Please choose a different shortcut.`, `Please choose a different shortcut.`,
false false
); );
input.value = formatShortcutDisplay(ShortcutsManager.getShortcut(toolId) || '', isMac); input.value = formatShortcutDisplay(ShortcutsManager.getShortcut(toolId) || '', isMac);

View File

@@ -93,13 +93,12 @@
<h2 class="text-lg font-semibold text-white">Stamp Editor</h2> <h2 class="text-lg font-semibold text-white">Stamp Editor</h2>
<p class="text-xs text-gray-400">Use the toolbar's image stamp tool to place stamps.</p> <p class="text-xs text-gray-400">Use the toolbar's image stamp tool to place stamps.</p>
</div> </div>
<div id="stamp-viewer-container" class="h-[70vh] bg-black/70 flex items-stretch justify-stretch"> <div id="stamp-viewer-container" class="h-[70vh] bg-black/70 flex items-stretch justify-stretch">
<!-- iframe injected by add-stamps.ts --> <!-- iframe injected by add-stamps.ts -->
</div> </div>
</div> </div>
<button id="save-stamped-btn" <button id="save-stamped-btn" class="btn-gradient w-full mt-6 flex items-center justify-center gap-2">
class="btn-gradient w-full mt-6 flex items-center justify-center gap-2">
<span>Save Stamped PDF</span> <span>Save Stamped PDF</span>
</button> </button>
</div> </div>
@@ -159,7 +158,7 @@
clip-rule="evenodd" /> clip-rule="evenodd" />
</svg> </svg>
</a> </a>
<a href="https://discord.gg/q42xWQmJ" target="_blank" rel="noopener noreferrer" <a href="https://discord.gg/AP2Y97juZT" target="_blank" rel="noopener noreferrer"
class="text-gray-400 hover:text-indigo-400" title="Discord"> class="text-gray-400 hover:text-indigo-400" title="Discord">
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true"> <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path <path
@@ -191,4 +190,4 @@
<script type="module" src="../js/mobileMenu.ts"></script> <script type="module" src="../js/mobileMenu.ts"></script>
</body> </body>
</html> </html>

View File

@@ -462,7 +462,7 @@
clip-rule="evenodd" /> clip-rule="evenodd" />
</svg> </svg>
</a> </a>
<a href="https://discord.gg/q42xWQmJ" target="_blank" rel="noopener noreferrer" <a href="https://discord.gg/AP2Y97juZT" target="_blank" rel="noopener noreferrer"
class="text-gray-400 hover:text-indigo-400" title="Discord"> class="text-gray-400 hover:text-indigo-400" title="Discord">
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true"> <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path <path
@@ -494,4 +494,4 @@
<script type="module" src="../js/mobileMenu.ts"></script> <script type="module" src="../js/mobileMenu.ts"></script>
</body> </body>
</html> </html>

View File

@@ -158,7 +158,7 @@
clip-rule="evenodd" /> clip-rule="evenodd" />
</svg> </svg>
</a> </a>
<a href="https://discord.gg/q42xWQmJ" target="_blank" rel="noopener noreferrer" <a href="https://discord.gg/AP2Y97juZT" target="_blank" rel="noopener noreferrer"
class="text-gray-400 hover:text-indigo-400" title="Discord"> class="text-gray-400 hover:text-indigo-400" title="Discord">
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true"> <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path <path
@@ -190,4 +190,4 @@
<script type="module" src="../js/mobileMenu.ts"></script> <script type="module" src="../js/mobileMenu.ts"></script>
</body> </body>
</html> </html>

View File

@@ -152,7 +152,7 @@
clip-rule="evenodd" /> clip-rule="evenodd" />
</svg> </svg>
</a> </a>
<a href="https://discord.gg/q42xWQmJ" target="_blank" rel="noopener noreferrer" <a href="https://discord.gg/AP2Y97juZT" target="_blank" rel="noopener noreferrer"
class="text-gray-400 hover:text-indigo-400" title="Discord"> class="text-gray-400 hover:text-indigo-400" title="Discord">
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true"> <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path <path
@@ -184,4 +184,4 @@
<script type="module" src="../js/mobileMenu.ts"></script> <script type="module" src="../js/mobileMenu.ts"></script>
</body> </body>
</html> </html>

View File

@@ -221,7 +221,7 @@
clip-rule="evenodd" /> clip-rule="evenodd" />
</svg> </svg>
</a> </a>
<a href="https://discord.gg/q42xWQmJ" target="_blank" rel="noopener noreferrer" <a href="https://discord.gg/AP2Y97juZT" target="_blank" rel="noopener noreferrer"
class="text-gray-400 hover:text-indigo-400" title="Discord"> class="text-gray-400 hover:text-indigo-400" title="Discord">
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true"> <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path <path

View File

@@ -241,7 +241,7 @@
clip-rule="evenodd" /> clip-rule="evenodd" />
</svg> </svg>
</a> </a>
<a href="https://discord.gg/q42xWQmJ" target="_blank" rel="noopener noreferrer" <a href="https://discord.gg/AP2Y97juZT" target="_blank" rel="noopener noreferrer"
class="text-gray-400 hover:text-indigo-400" title="Discord"> class="text-gray-400 hover:text-indigo-400" title="Discord">
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true"> <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
<path <path