@kangsicj/dcinsideenhancer 1.3.3 → 1.3.5

package/dist/DCInsideEnhancer.user.js

@@ -2,7 +2,7 @@
 // @name         DCInside Enhancer
 // @name:ko      디시 인핸서
 // @namespace    https://github.com/kangsicj/DCInsideEnhancer
-// @version      1.3.3
+// @version      1.3.5
 // @description  DCInside filter & enhancer — mobile & PC. Block users/words/heads/notices/images & GIFs across posts, infinite list, zoom viewer, theme sync, encrypted multi-device sync (no account, no tracking).
 // @description:ko 디시인사이드 차단·편의 기능 (모바일·PC) - 유저·단어(제목/본문)·말머리·공지 차단, 같은/비슷한 이미지·움짤 모든 글 차단, 디시콘 제거, 차단 미디어 데이터 절약, 목록 자동 보충·무한 스크롤·뒤로 가기 위치 복원, 스크랩, 이미지 확대뷰 개선, 야간모드 자동 연동, 암호화 기기 간 동기화 (계정 없음·추적 없음)
 // @author       kangsicj
@@ -37,7 +37,7 @@
     window.__dcInsideEnhancer = true;
     window.__dcRefinery = true;
 
-    const SCRIPT_VERSION = '1.3.3';
+    const SCRIPT_VERSION = '1.3.5';
     const PROJECT_URL = 'https://github.com/kangsicj/DCInsideEnhancer';
     const DONATE_URL = 'https://fairy.hada.io/@kangsicj';
     const DONATE_URL_BMC = 'https://buymeacoffee.com/kangsicj';
@@ -187,7 +187,6 @@
         hideCommentAds: true,
         hideCommentFab: true,
         mobileRecentBar: true,
-        mobileRecentStrip: true,
         hideSilbeAlarm: true,
         alarmBubble: true,
         alarmKeepPolling: true,
@@ -2032,17 +2031,16 @@
         #dc-recent-bar {
             display: flex;
             align-items: center;
-            gap: 0;
-            height: 34px;
+            gap: var(--dc-rb-gap, 30px);
+            height: 40px;
             margin: 0;
-            padding: 0 6px;
+            padding: 0 var(--dc-rb-pad, 14px);
             overflow-x: auto;
             overflow-y: hidden;
             -webkit-overflow-scrolling: touch;
             scrollbar-width: none;
             overscroll-behavior-x: contain;
             background: var(--dc-rb-bg, #3b4890);
-            border-bottom: 1px solid rgba(255,255,255,.12);
             box-sizing: border-box;
         }
         #dc-recent-bar::-webkit-scrollbar { display: none; }
@@ -2050,74 +2048,23 @@
             flex: 0 0 auto;
             display: inline-flex;
             align-items: center;
-            gap: 2px;
-            max-width: 46vw;
-            height: 34px;
-            padding: 0 10px;
+            gap: 3px;
+            max-width: 60vw;
+            height: 40px;
+            padding: 0;
             overflow: hidden;
-            color: rgba(255,255,255,.82);
-            font-size: 13px;
-            font-weight: 500;
-            letter-spacing: -.3px;
+            color: var(--dc-rb-color, #fff);
+            font-family: var(--dc-rb-family, inherit);
+            font-size: var(--dc-rb-size, 16px);
+            font-weight: var(--dc-rb-weight, 700);
+            letter-spacing: var(--dc-rb-spacing, normal);
             text-decoration: none;
             text-overflow: ellipsis;
             white-space: nowrap;
+            opacity: .9;
         }
-        #dc-recent-bar .dc-rb-item + .dc-rb-item { border-left: 1px solid rgba(255,255,255,.18); }
-        #dc-recent-bar .dc-rb-item.on { color: var(--dc-rb-on, #ffe10a); font-weight: 700; }
-        #dc-recent-bar .dc-rb-kind { font-size: 11px; opacity: .8; }
-
-        html.dc-recent-strip-on #lately_pop.dc-strip-lately #swiper-lately,
-        html.dc-recent-strip-on #lately_pop.dc-strip-lately #lately_paging1 { display: none !important; }
-        .dc-recent-strip {
-            display: flex;
-            gap: 8px;
-            padding: 12px 12px 14px;
-            overflow-x: auto;
-            overflow-y: hidden;
-            -webkit-overflow-scrolling: touch;
-            scroll-snap-type: x proximity;
-            scrollbar-width: none;
-            overscroll-behavior-x: contain;
-        }
-        .dc-recent-strip::-webkit-scrollbar { display: none; }
-        .dc-recent-strip[hidden] { display: none !important; }
-        .dc-recent-strip .dc-rs-chip {
-            flex: 0 0 auto;
-            display: inline-flex;
-            align-items: center;
-            gap: 4px;
-            max-width: 60vw;
-            height: 36px;
-            padding: 0 4px 0 14px;
-            border: 1px solid var(--dc-border);
-            border-radius: 999px;
-            background: var(--dc-surface-2);
-            color: var(--dc-text);
-            font-size: 14px;
-            font-weight: 600;
-            text-decoration: none;
-            white-space: nowrap;
-            scroll-snap-align: start;
-        }
-        .dc-recent-strip .dc-rs-chip.here { border-color: var(--dc-accent-ink); color: var(--dc-accent-ink); background: var(--dc-accent-soft); }
-        .dc-recent-strip .dc-rs-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
-        .dc-recent-strip .dc-rs-kind { color: var(--dc-text-dim); font-size: 13px; }
-        .dc-recent-strip .dc-rs-del {
-            flex: 0 0 auto;
-            width: 28px;
-            height: 28px;
-            margin: 0;
-            padding: 0;
-            border: none;
-            border-radius: 50%;
-            background: transparent;
-            color: var(--dc-text-dim);
-            font-size: 18px;
-            line-height: 28px;
-        }
-        .dc-recent-strip .dc-rs-pin,
-        .dc-recent-strip .dc-rs-empty { flex: 0 0 auto; align-self: center; padding: 0 6px; color: var(--dc-text-dim); font-size: 12px; white-space: nowrap; }
+        #dc-recent-bar .dc-rb-item.on { color: var(--dc-rb-on, #ffe10a); opacity: 1; }
+        #dc-recent-bar .dc-rb-kind { font-size: .75em; font-weight: 400; opacity: .85; }
 
         .dc-key-cursor { outline: 2px solid var(--dc-accent-ink) !important; outline-offset: -2px; background: var(--dc-accent-soft) !important; }
 
@@ -3362,6 +3309,13 @@
             saveSettings();
         }
 
+        const staleSettings = Object.keys(settings).filter(key => !(key in DEFAULT_SETTINGS) && key !== 'settingsRev');
+
+        if (staleSettings.length) {
+            staleSettings.forEach(key => delete settings[key]);
+            saveSettings();
+        }
+
         OBSOLETE_STORAGE.forEach(key => {
             try {
                 localStorage.removeItem(key);
@@ -9961,6 +9915,17 @@
         area.querySelectorAll('.dc-row').forEach(row => {
             row.hidden = !matchesFilter(row.textContent);
         });
+
+        area.querySelectorAll('.dc-setting-row').forEach(row => {
+            row.hidden = !matchesFilter(row.textContent);
+        });
+        area.querySelectorAll('.dc-settings-group[data-dc-group]').forEach(box => {
+            const empty = !!blockFilter.trim() && ![...box.querySelectorAll('.dc-setting-row')].some(row => !row.hidden);
+
+            area.querySelectorAll(`[data-dc-group="${box.dataset.dcGroup}"]`).forEach(el => {
+                el.hidden = empty;
+            });
+        });
     };
 
     const matchesFilter = text => !blockFilter || String(text).toLowerCase().includes(blockFilter.trim().toLowerCase());
@@ -10309,6 +10274,7 @@
         { key: 'alarm', title: '🔔 알림', intro: '디시 알림(댓글·답글·힛갤 등)을 보기 쉽게 바꿉니다. 알림 내용은 사이트가 받은 것을 그대로 씁니다.' },
         { key: 'dccon', title: '😶 디시콘', intro: '디시 자체 이모티콘을 다룹니다.' },
         { key: 'list', title: '📜 목록 보기', intro: '게시판 목록을 넘겨 보는 방식을 정합니다.' },
+        { key: 'handy', title: '✨ 편의 기능', intro: '최근 방문 · 글 미리보기 · 단축키 · 스크랩처럼 사이트를 더 편하게 쓰는 기능입니다.' },
         { key: 'media', title: '🖼 이미지·영상', intro: '본문 이미지 차단과 확대 보기를 다룹니다.' },
         { key: 'data', title: '📶 데이터 절약', intro: '모바일 데이터를 아끼는 기능입니다.' },
         { key: 'theme', title: '🌓 화면 테마', intro: '주간/야간 모드를 기기 설정에 맞춥니다.' },
@@ -10455,21 +10421,13 @@
             refresh: 'root'
         },
         {
-            group: 'clean',
+            group: 'handy',
             key: 'mobileRecentBar',
             name: '메뉴 위에 최근 방문 갤러리 늘 보이기 (모바일)',
             on: '검색창과 [갤러리 · 마이너갤 · …] 메뉴 사이에 최근 방문 갤러리를 한 줄로 보여 줍니다. 옆으로 밀어 보고, 누르면 바로 이동합니다. 지금 갤러리는 노란색입니다.',
             off: '[최근 방문]을 눌러야 보입니다.',
             refresh: 'root'
         },
-        {
-            group: 'clean',
-            key: 'mobileRecentStrip',
-            name: "'최근 방문'을 한 줄로 밀어 보기 (모바일)",
-            on: '위쪽 [최근 방문]을 누르면 넓은 표 대신 갤러리가 순서대로 한 줄에 나오고, 옆으로 밀어 봅니다. 고정한 순서를 그대로 따릅니다.',
-            off: '사이트 기본 표(2줄 × 4칸, 넘겨 보기)로 보여 줍니다.',
-            refresh: 'root'
-        },
         {
             group: 'clean',
             key: 'hideAdSlots',
@@ -10545,7 +10503,7 @@
             refresh: 'all'
         },
         {
-            group: 'list',
+            group: 'handy',
             key: 'keyboardShortcuts',
             name: '키보드 단축키 (PC)',
             on: '목록에서 J/K 로 글을 고르고 Enter 로 엽니다. 글에서는 J/K 로 다음·이전 글, S 스크랩, / 검색창, B 차단 관리, ? 안내.',
@@ -10553,7 +10511,7 @@
             refresh: 'none'
         },
         {
-            group: 'list',
+            group: 'handy',
             key: 'hoverPreview',
             name: '제목을 길게 누르면 글 미리보기 (PC)',
             on: '아이폰처럼 목록 제목을 길게 누르면 화면이 흐려지며 글 전체가 가운데에 떠오릅니다. 짧게 누르면 평소처럼 글로 갑니다. 창에서 본문을 누르면 글로 이동, 바깥을 누르거나 Esc 로 닫습니다. 스크랩·작성자 차단도 바로 할 수 있고, 차단한 이미지·단어는 미리보기에서도 가립니다. 키보드로 고른 글은 P 로 엽니다.',
@@ -10561,7 +10519,7 @@
             refresh: 'root'
         },
         {
-            group: 'list',
+            group: 'handy',
             key: 'previewHover',
             parent: 'hoverPreview',
             name: '마우스를 올려 멈춰도 미리보기 (PC)',
@@ -10606,7 +10564,7 @@
             refresh: 'root'
         },
         {
-            group: 'list',
+            group: 'handy',
             key: 'autoHideScrollbar',
             name: '스크롤바 자동 숨기기',
             on: '화면 스크롤바를 숨기고, 스크롤하는 동안만 얇은 표시가 잠깐 나타납니다 (스크롤바가 자리를 차지하는 PC).',
@@ -10614,7 +10572,7 @@
             refresh: 'root'
         },
         {
-            group: 'list',
+            group: 'handy',
             key: 'scrapIntercept',
             name: '무제한 스크랩',
             on: '글의 스크랩 버튼을 누르면 개수 제한 없이 이 기기에 저장합니다. 플로팅 메뉴의 📌 스크랩 탭에서 봅니다.',
@@ -10622,7 +10580,7 @@
             refresh: 'none'
         },
         {
-            group: 'list',
+            group: 'handy',
             key: 'showScrollTop',
             name: '맨 위로 버튼',
             on: '목록을 많이 내려가면 플로팅 버튼 위에 ↑ 버튼이 나타납니다.',
@@ -10766,10 +10724,6 @@
                     renderRecentBar();
                 }
 
-                if (item.key === 'mobileRecentStrip') {
-                    renderRecentStrip();
-                }
-
                 if (item.key === 'alarmBubble') {
                     paintAlarmBadge();
                 }
@@ -11150,7 +11104,7 @@
         const seg = h('div', 'dc-choice-seg');
 
         head.append(
-            h('span', 'dc-setting-name', item.name),
+            h('span', 'dc-setting-name', settingLabel(item)),
             h('span', 'dc-state-badge on', chosen ? chosen.label : String(current))
         );
         text.append(head, h('span', 'dc-setting-desc', item.on));
@@ -11186,17 +11140,43 @@
         return row;
     };
 
+    const settingPlatform = item => (/\(PC\)$/.test(item.name) ? 'pc' : /\(모바일\)$/.test(item.name) ? 'mobile' : 'all');
+    const settingShownHere = item => {
+        const platform = settingPlatform(item);
+
+        return platform === 'all' || (platform === 'pc') === IS_PC_SITE;
+    };
+    const settingLabel = item => item.name.replace(/\s*\((PC|모바일)\)$/, '');
+
     const renderSettings = area => {
         area.appendChild(
-            makeNote('스위치가 초록색이면 켜짐입니다. 바꾸면 바로 적용되고 자동으로 저장됩니다.')
+            makeNote(`스위치가 초록색이면 켜짐입니다. 바꾸면 바로 적용되고 자동으로 저장됩니다. ${IS_PC_SITE ? 'PC' : '모바일'}에서 쓰는 설정만 보입니다.`)
         );
 
+        const search = makeFilterRow(99);
+
+        if (search) {
+            search.querySelector('input').placeholder = '🔍 설정에서 찾기';
+            area.appendChild(search);
+        }
+
         SETTING_GROUPS.forEach(group => {
+            const items = SETTING_ITEMS.filter(item => item.group === group.key && settingShownHere(item));
+
+            if (!items.length) {
+                return;
+            }
+
             const box = h('div', 'dc-settings-group');
+            const title = h('div', 'dc-group-title', group.title);
+            const intro = h('div', 'dc-group-intro', group.intro);
 
-            area.append(h('div', 'dc-group-title', group.title), h('div', 'dc-group-intro', group.intro), box);
+            title.dataset.dcGroup = group.key;
+            intro.dataset.dcGroup = group.key;
+            box.dataset.dcGroup = group.key;
+            area.append(title, intro, box);
 
-            SETTING_ITEMS.filter(item => item.group === group.key).forEach(item => {
+            items.forEach(item => {
                 if (item.choices) {
                     box.appendChild(renderChoiceSetting(item));
                     return;
@@ -11211,7 +11191,7 @@
                 const toggle = h('button', `dc-switch${on ? ' on' : ''}`);
 
                 head.append(
-                    h('span', 'dc-setting-name', item.name),
+                    h('span', 'dc-setting-name', settingLabel(item)),
                     h('span', `dc-state-badge${on ? ' on' : ''}`, on ? '켜짐' : '꺼짐')
                 );
                 text.append(head, h('span', 'dc-setting-desc', on || !item.off ? item.on : item.off));
@@ -11221,7 +11201,7 @@
                 }
 
                 const status = !effective
-                    ? `위의 '${parent.name}' 설정을 먼저 켜 주세요.`
+                    ? `위의 '${settingLabel(parent)}' 설정을 먼저 켜 주세요.`
                     : item.status
                         ? item.status(on)
                         : null;
@@ -11233,7 +11213,7 @@
                 toggle.type = 'button';
                 toggle.disabled = !effective;
                 toggle.setAttribute('role', 'switch');
-                toggle.setAttribute('aria-label', item.name);
+                toggle.setAttribute('aria-label', settingLabel(item));
                 toggle.setAttribute('aria-checked', String(on));
 
                 toggle.addEventListener('click', () => {
@@ -11685,7 +11665,13 @@
     };
 
     const setModalView = view => {
-        currentView = MODAL_VIEWS[view] ? view : 'overview';
+        const next = MODAL_VIEWS[view] ? view : 'overview';
+
+        if (next !== currentView) {
+            blockFilter = '';
+        }
+
+        currentView = next;
 
         document.getElementById('dc-modal-title').textContent = MODAL_VIEWS[currentView].title;
         document.querySelectorAll('[data-dc-view]').forEach(btn => {
@@ -11994,6 +11980,18 @@
         return out;
     };
 
+    const pickKnownSettings = (source = {}) => {
+        const out = {};
+
+        Object.keys(source || {}).forEach(key => {
+            if (key in DEFAULT_SETTINGS && !SYNC_SETTINGS_SKIP.includes(key)) {
+                out[key] = source[key];
+            }
+        });
+
+        return out;
+    };
+
     const collectSyncData = () => ({
         users: [...blockedUsers],
         images: [...blockedMedia],
@@ -12153,7 +12151,7 @@
         if (after.scraps) diff('스크랩', (before.scraps || []).map(scrapKeyOf), after.scraps.map(scrapKeyOf));
 
         if (after.settings) {
-            const changed = Object.keys(after.settings).filter(key => JSON.stringify(after.settings[key]) !== JSON.stringify((before.settings || {})[key])).length;
+            const changed = Object.keys(pickKnownSettings(after.settings)).filter(key => JSON.stringify(after.settings[key]) !== JSON.stringify((before.settings || {})[key])).length;
 
             if (changed) {
                 parts.push(`설정 ${changed}개`);
@@ -12575,6 +12573,10 @@
                 delete incoming.devices;
                 skippedFields(conf.skip).forEach(field => delete incoming[field]);
 
+                if (incoming.settings) {
+                    incoming.settings = pickKnownSettings(incoming.settings);
+                }
+
                 const mine = {};
 
                 Object.keys(incoming).forEach(field => {
@@ -13887,82 +13889,6 @@
         }
     }
 
-    const renderRecentStrip = () => {
-        const pop = document.getElementById('lately_pop');
-
-        if (!IS_MOBILE_SITE || !pop || settings.mobileRecentStrip === false) {
-            document.documentElement.classList.remove('dc-recent-strip-on');
-            pop?.querySelector('.dc-recent-strip')?.remove();
-            return;
-        }
-
-        const latelyTab = document.getElementById('lately_gall');
-        const showing = !latelyTab || latelyTab.classList.contains('on');
-        let strip = pop.querySelector('.dc-recent-strip');
-
-        if (!strip) {
-            strip = h('div', 'dc-ui dc-recent-strip');
-            strip.setAttribute('role', 'list');
-            const slider = pop.querySelector('#swiper-lately') || pop.querySelector('.vst-slider');
-
-            (slider ? slider.parentNode : pop).insertBefore(strip, slider || null);
-        }
-
-        document.documentElement.classList.add('dc-recent-strip-on');
-        strip.hidden = !showing;
-        pop.classList.toggle('dc-strip-lately', showing);
-
-        if (!showing) {
-            return;
-        }
-
-        const keepScroll = strip.scrollLeft;
-
-        strip.textContent = '';
-
-        if (!recentGalls.length) {
-            strip.appendChild(h('span', 'dc-rs-empty', '최근 방문한 갤러리가 없습니다'));
-            return;
-        }
-
-        const here = (currentGalleryVisit() || {}).id;
-
-        recentGalls.forEach(item => {
-            const chip = h('a', `dc-rs-chip${item.id === here ? ' here' : ''}`);
-
-            chip.href = recentUrl(item);
-            chip.setAttribute('role', 'listitem');
-            chip.appendChild(h('span', 'dc-rs-name', item.n || item.id));
-
-            if (RECENT_KIND_LABEL[item.k]) {
-                chip.appendChild(h('span', 'dc-rs-kind', item.k === 'M' ? 'ⓜ' : item.k === 'N' ? 'ⓝ' : 'ⓟ'));
-            }
-
-            const del = h('button', 'dc-rs-del', '×');
-
-            del.type = 'button';
-            del.setAttribute('aria-label', `${item.n || item.id} 지우기`);
-            del.addEventListener('click', event => {
-                event.preventDefault();
-                event.stopPropagation();
-                recentGalls = recentGalls.filter(other => other !== item);
-                saveRecent();
-                exportNativeRecent();
-                renderRecentStrip();
-            });
-            chip.appendChild(del);
-            strip.appendChild(chip);
-        });
-
-        if (recentOrder.fixed) {
-            strip.appendChild(h('span', 'dc-rs-pin', '📌 순서 고정'));
-        }
-
-        strip.scrollLeft = keepScroll;
-
-        strip.querySelector('.dc-rs-chip.here')?.scrollIntoView?.({ block: 'nearest', inline: 'nearest' });
-    };
-
     const renderRecentBar = () => {
         const nav = IS_MOBILE_SITE ? document.querySelector('nav.nav') : null;
         let bar = document.getElementById('dc-recent-bar');
@@ -13982,9 +13908,21 @@
         try {
             const cs = getComputedStyle(nav);
             const active = nav.querySelector('li.on a') || nav.querySelector('a');
-
-            bar.style.setProperty('--dc-rb-bg', cs.backgroundColor);
-            bar.style.setProperty('--dc-rb-on', active ? getComputedStyle(active).color : '#ffe10a');
+            const plain = nav.querySelector('li:not(.on) a') || active;
+            const items = [...nav.querySelectorAll('li')].filter(li => li.getBoundingClientRect().width);
+            const gap = items.length > 1 ? Math.round(items[1].getBoundingClientRect().left - items[0].getBoundingClientRect().right) : 30;
+            const ps = plain ? getComputedStyle(plain) : null;
+            const set = (name, value) => value && bar.style.setProperty(name, value);
+
+            set('--dc-rb-bg', cs.backgroundColor);
+            set('--dc-rb-on', active ? getComputedStyle(active).color : '');
+            set('--dc-rb-color', ps ? ps.color : '');
+            set('--dc-rb-size', ps ? ps.fontSize : '');
+            set('--dc-rb-weight', ps ? ps.fontWeight : '');
+            set('--dc-rb-family', ps ? ps.fontFamily : '');
+            set('--dc-rb-spacing', ps ? ps.letterSpacing : '');
+            set('--dc-rb-gap', `${Math.max(16, Math.min(40, gap))}px`);
+            set('--dc-rb-pad', items[0] ? `${Math.round(items[0].getBoundingClientRect().left - nav.getBoundingClientRect().left)}px` : '');
         } catch {
         }
 
@@ -14019,41 +13957,11 @@
         }
     };
 
-    const watchRecentStrip = () => {
-        const pop = document.getElementById('lately_pop');
-
-        if (!IS_MOBILE_SITE || !pop) {
-            return;
-        }
-
-        let timer = null;
-        const refresh = () => {
-            clearTimeout(timer);
-            timer = setTimeout(() => {
-                if (pop.style.display !== 'none') {
-                    importNativeRecent();
-                    renderRecentStrip();
-                }
-            }, 30);
-        };
-
-        new MutationObserver(refresh).observe(pop, { attributes: true, attributeFilter: ['style'] });
-
-        const tabs = pop.querySelector('.tab-lst');
-
-        if (tabs) {
-            new MutationObserver(refresh).observe(tabs, { attributes: true, subtree: true, attributeFilter: ['class'] });
-        }
-
-        renderRecentStrip();
-    };
-
     const initRecent = () => {
         importNativeRecent();
         recordGalleryVisit();
         exportNativeRecent();
         watchNativeRecentDom();
-        watchRecentStrip();
         renderRecentBar();
 
         const follow = () => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kangsicj/dcinsideenhancer",
-  "version": "1.3.3",
+  "version": "1.3.5",
   "description": "DCInside filter & enhancer userscript for mobile and PC (디시인사이드 차단·편의 유저스크립트)",
   "license": "GPL-3.0-only",
   "author": "kangsicj",
@@ -12,10 +12,10 @@
   "bugs": {
     "url": "https://github.com/kangsicj/DCInsideEnhancer/issues"
   },
-  "funding": {
-    "type": "individual",
-    "url": "https://fairy.hada.io/@jinny"
-  },
+  "funding": [
+    { "type": "individual", "url": "https://fairy.hada.io/@kangsicj" },
+    { "type": "individual", "url": "https://buymeacoffee.com/kangsicj" }
+  ],
   "keywords": [
     "userscript",
     "tampermonkey",