diff --git a/src/renderer/handlers/image-preview.js b/src/renderer/handlers/image-preview.js index 9c8ba67..b693a31 100644 --- a/src/renderer/handlers/image-preview.js +++ b/src/renderer/handlers/image-preview.js @@ -12,6 +12,7 @@ let _hideTimer = null; let _visible = false; let _loaderEl = null; let _activeCard = null; +let _enabled = true; export function init() { _el = document.createElement('div'); @@ -22,12 +23,26 @@ export function init() { document.body.appendChild(_el); } +export function setEnabled(v) { + _enabled = v; + if (!v) { + clearTimeout(_showTimer); _showTimer = null; + clearTimeout(_hideTimer); _hideTimer = null; + _removeLoader(); + _activeCard = null; + _visible = false; + _el.style.display = 'none'; + _el.style.visibility = 'hidden'; + } +} + export function setupCard(card) { card.addEventListener('mouseenter', _onEnter); card.addEventListener('mouseleave', _onLeave); } function _onEnter() { + if (!_enabled) return; const card = this; _activeCard = card; diff --git a/src/renderer/index.html b/src/renderer/index.html index 65dbc30..d94e74d 100644 --- a/src/renderer/index.html +++ b/src/renderer/index.html @@ -21,6 +21,8 @@
+
+
폴더를 선택하세요 diff --git a/src/renderer/renderer.js b/src/renderer/renderer.js index ce5f4af..8cb44ef 100644 --- a/src/renderer/renderer.js +++ b/src/renderer/renderer.js @@ -25,10 +25,11 @@ const statusText = document.getElementById('status-text'); const loading = document.getElementById('loading'); const loadingText = document.getElementById('loading-text'); const toast = document.getElementById('toast'); -const rubberBand = document.getElementById('rubber-band'); -const gridContainer = document.getElementById('grid-container'); -const dragGhostEl = document.getElementById('drag-ghost'); -const thumbSizeHint = document.getElementById('thumb-size-hint'); +const rubberBand = document.getElementById('rubber-band'); +const gridContainer = document.getElementById('grid-container'); +const dragGhostEl = document.getElementById('drag-ghost'); +const thumbSizeHint = document.getElementById('thumb-size-hint'); +const btnPreviewToggle = document.getElementById('btn-preview-toggle'); // ── 핸들러 초기화 ───────────────────────────────── const callbacks = { @@ -57,6 +58,10 @@ document.addEventListener('keydown', (e) => { if (e.code === 'KeyO') btnOpen.click(); if (e.code === 'KeyS' && !btnRename.disabled) btnRename.click(); }); +btnPreviewToggle.addEventListener('click', () => { + const on = btnPreviewToggle.classList.toggle('active'); + hoverPreview.setEnabled(on); +}); btnSortName.addEventListener('click', () => sortFiles('name')); btnSortDate.addEventListener('click', () => sortFiles('date')); btnRename.addEventListener('click', doRename); diff --git a/src/renderer/style.css b/src/renderer/style.css index d93e6f6..e47bd5c 100644 --- a/src/renderer/style.css +++ b/src/renderer/style.css @@ -82,6 +82,7 @@ body.fullscreen #titlebar { .btn-ghost { background: transparent; color: var(--text); border: 1px solid var(--border); } .btn-ghost:hover { background: var(--card); } .btn-ghost:disabled { color: var(--muted); border-color: var(--border); opacity: .4; cursor: not-allowed; } +.btn-ghost.active { border-color: var(--accent); color: var(--accent); } .sort-group { display: flex; background: var(--card);