codymaster 4.8.0 → 7.0.0

package/skills/cm-readit/examples/voice-cro.js

@@ -1,390 +0,0 @@
-/**
- * Voice CRO System — AI Sales Consultant (1-chiều)
- * Trigger-based bottom sheet + pre-generated MP3 + TTS fallback
- * Config-driven, per-page voice scripts & triggers
- */
-
-(function () {
-    'use strict';
-
-    /* ─── Page Config ─── */
-    const CONFIG = {
-        '/': {
-            delay: 20000, scroll: 0.30,
-            audio: ['/audio/homepage-intro.mp3', '/audio/homepage-full.mp3'],
-            sheetIcon: '🎧',
-            sheetText: 'Bạn muốn nghe giới thiệu nhanh về dịch vụ?',
-            ctaText: 'Đặt Lịch Ngay', ctaHref: '#uu-dai'
-        },
-        '/index.html': null, // alias → use '/'
-        '/tri-lieu-co-vai-gay.html': {
-            delay: 15000, scroll: 0.25,
-            audio: ['/audio/vai-gay-intro.mp3', '/audio/vai-gay-full.mp3'],
-            sheetIcon: '💆',
-            sheetText: 'Đau vai gáy lâu rồi? Nghe tư vấn nhanh từ chuyên gia',
-            ctaText: 'Đặt Lịch Ngay', ctaHref: '#dat-lich'
-        },
-        '/tri-mat-ngu.html': {
-            delay: 18000, scroll: 0.30,
-            audio: ['/audio/mat-ngu-intro.mp3', '/audio/mat-ngu-full.mp3'],
-            sheetIcon: '🌙',
-            sheetText: 'Mất ngủ kiệt sức? Dưỡng sinh tạng giúp lấy lại giấc ngủ sâu',
-            ctaText: 'Đặt Lịch Dưỡng Sinh', ctaHref: '#dat-lich',
-            checkboxTrigger: { selector: '.check-item input[type=checkbox]', minChecked: 2 }
-        },
-        '/tri-lieu-dau-lung-xuong-khop.html': {
-            delay: 20000, scroll: 0.35,
-            audio: ['/audio/dau-lung-intro.mp3', '/audio/dau-lung-full.mp3'],
-            sheetIcon: '🦴',
-            sheetText: 'Tìm hiểu cho bố mẹ? Nghe tư vấn an toàn từ chuyên gia',
-            ctaText: 'Tư Vấn Miễn Phí', ctaHref: '#dat-lich'
-        },
-        '/phuc-hoi-the-thao.html': {
-            delay: 12000, scroll: 0.20,
-            audio: ['/audio/the-thao-intro.mp3', '/audio/the-thao-full.mp3'],
-            sheetIcon: '💪',
-            sheetText: 'DOMS kéo dài? Massage Đông y giúp recovery thật sự',
-            ctaText: 'Đặt Lịch Massage', ctaHref: '#dat-lich'
-        },
-        '/cham-soc-me-sau-sinh.html': {
-            delay: 18000, scroll: 0.25,
-            audio: ['/audio/me-sau-sinh-intro.mp3', '/audio/me-sau-sinh-full.mp3'],
-            sheetIcon: '💝',
-            sheetText: 'Mẹ ơi, mẹ xứng đáng được chăm sóc',
-            ctaText: 'Đặt Lịch Cho Mẹ', ctaHref: '#dat-lich'
-        },
-        '/thu-gian-premium.html': {
-            delay: 22000, scroll: 0.35,
-            audio: ['/audio/premium-intro.mp3', '/audio/premium-full.mp3'],
-            sheetIcon: '✦',
-            sheetText: 'Tìm kiếm trải nghiệm dưỡng sinh toàn diện?',
-            ctaText: 'Đặt Lịch Dưỡng Sinh', ctaHref: '#dat-lich'
-        },
-        '/khoa-hoc-bam-huyet.html': {
-            delay: 25000, scroll: 0.40,
-            audio: ['/audio/khoa-hoc-intro.mp3', '/audio/khoa-hoc-full.mp3'],
-            sheetIcon: '📚',
-            sheetText: 'Muốn chuyển nghề? Nghe chia sẻ từ học viên',
-            ctaText: 'Đăng Ký Tư Vấn', ctaHref: '#dat-lich'
-        }
-    };
-
-    /* ─── State ─── */
-    const STATE_KEY = 'voiceCroDismissed';
-    const STATS_KEY = 'voiceCroStats';
-    let currentAudio = null;
-    let sheetEl = null;
-    let playerEl = null;
-    let isPlaying = false;
-    let playingPart = 0; // 0=none, 1=intro, 2=full
-
-    /* ─── Helpers ─── */
-    function getPageConfig() {
-        const path = window.location.pathname;
-        // Try exact match, then alias, then root
-        let cfg = CONFIG[path];
-        if (cfg === null && CONFIG['/']) cfg = CONFIG['/']; // alias
-        if (!cfg && path === '/') cfg = CONFIG['/'];
-        return cfg || null;
-    }
-
-    function isDismissed() {
-        try { return sessionStorage.getItem(STATE_KEY) === '1'; } catch { return false; }
-    }
-
-    function setDismissed() {
-        try { sessionStorage.setItem(STATE_KEY, '1'); } catch { /* noop */ }
-    }
-
-    function trackStat(event) {
-        try {
-            const stats = JSON.parse(localStorage.getItem(STATS_KEY) || '{}');
-            const page = window.location.pathname;
-            if (!stats[page]) stats[page] = {};
-            stats[page][event] = (stats[page][event] || 0) + 1;
-            stats[page].lastSeen = Date.now();
-            localStorage.setItem(STATS_KEY, JSON.stringify(stats));
-        } catch { /* noop */ }
-    }
-
-    function getScrollPercent() {
-        const h = document.documentElement.scrollHeight - window.innerHeight;
-        return h > 0 ? window.scrollY / h : 0;
-    }
-
-    /* ─── Audio Playback ─── */
-    function playAudio(src, onEnd) {
-        stopAudio();
-        currentAudio = new Audio(src);
-        currentAudio.volume = 0.85;
-        currentAudio.addEventListener('ended', () => {
-            isPlaying = false;
-            if (onEnd) onEnd();
-            updatePlayerUI();
-        });
-        currentAudio.addEventListener('error', () => {
-            isPlaying = false;
-            if (onEnd) onEnd();
-            updatePlayerUI();
-        });
-        const playPromise = currentAudio.play();
-        if (playPromise) {
-            playPromise.then(() => {
-                isPlaying = true;
-                updatePlayerUI();
-            }).catch(() => {
-                isPlaying = false;
-                updatePlayerUI();
-            });
-        }
-    }
-
-    function stopAudio() {
-        if (currentAudio) {
-            currentAudio.pause();
-            currentAudio.currentTime = 0;
-            currentAudio = null;
-        }
-        isPlaying = false;
-    }
-
-    function togglePause() {
-        if (!currentAudio) return;
-        if (currentAudio.paused) {
-            currentAudio.play();
-            isPlaying = true;
-        } else {
-            currentAudio.pause();
-            isPlaying = false;
-        }
-        updatePlayerUI();
-    }
-
-    /* ─── Bottom Sheet ─── */
-    function createSheet(cfg) {
-        const el = document.createElement('div');
-        el.className = 'vcro-sheet';
-        el.innerHTML = `
-      <div class="vcro-sheet-inner">
-        <button class="vcro-sheet-close" aria-label="Đóng">✕</button>
-        <div class="vcro-sheet-icon">${cfg.sheetIcon}</div>
-        <p class="vcro-sheet-text">${cfg.sheetText}</p>
-        <div class="vcro-sheet-actions">
-          <button class="vcro-sheet-listen btn btn-primary btn-sm">🔊 Nghe Ngay</button>
-          <button class="vcro-sheet-dismiss btn btn-outline btn-sm">Để Sau</button>
-        </div>
-      </div>
-    `;
-
-        // Close
-        el.querySelector('.vcro-sheet-close').addEventListener('click', () => dismiss(el));
-        el.querySelector('.vcro-sheet-dismiss').addEventListener('click', () => dismiss(el));
-
-        // Listen
-        el.querySelector('.vcro-sheet-listen').addEventListener('click', () => {
-            trackStat('listen');
-            el.classList.remove('active');
-            setTimeout(() => el.remove(), 400);
-            playIntro(cfg);
-        });
-
-        // Swipe down to dismiss (mobile)
-        let startY = 0;
-        el.addEventListener('touchstart', (e) => { startY = e.touches[0].clientY; }, { passive: true });
-        el.addEventListener('touchmove', (e) => {
-            const dy = e.touches[0].clientY - startY;
-            if (dy > 60) dismiss(el);
-        }, { passive: true });
-
-        document.body.appendChild(el);
-        // Animate in
-        requestAnimationFrame(() => requestAnimationFrame(() => el.classList.add('active')));
-        sheetEl = el;
-        trackStat('shown');
-    }
-
-    function dismiss(el) {
-        setDismissed();
-        trackStat('dismissed');
-        el.classList.remove('active');
-        setTimeout(() => el.remove(), 400);
-    }
-
-    /* ─── Mini Player Bar ─── */
-    function createPlayer(cfg) {
-        const el = document.createElement('div');
-        el.className = 'vcro-player';
-        el.innerHTML = `
-      <div class="vcro-player-inner">
-        <button class="vcro-player-toggle" aria-label="Play/Pause">
-          <span class="vcro-player-icon">⏸</span>
-        </button>
-        <div class="vcro-player-info">
-          <span class="vcro-player-label">Đang phát...</span>
-          <div class="vcro-player-progress"><div class="vcro-player-bar"></div></div>
-        </div>
-        <button class="vcro-player-next btn btn-primary btn-sm" style="display:none;">Nghe Tiếp</button>
-        <a href="${cfg.ctaHref}" class="vcro-player-cta btn btn-primary btn-sm">${cfg.ctaText}</a>
-        <button class="vcro-player-close" aria-label="Đóng">✕</button>
-      </div>
-    `;
-
-        el.querySelector('.vcro-player-toggle').addEventListener('click', togglePause);
-        el.querySelector('.vcro-player-close').addEventListener('click', () => {
-            stopAudio();
-            el.classList.remove('active');
-            setTimeout(() => el.remove(), 400);
-            playerEl = null;
-        });
-
-        // Next button → play full audio
-        el.querySelector('.vcro-player-next').addEventListener('click', () => {
-            trackStat('listenFull');
-            playingPart = 2;
-            el.querySelector('.vcro-player-next').style.display = 'none';
-            el.querySelector('.vcro-player-label').textContent = 'Nghe tư vấn chi tiết...';
-            playAudio(cfg.audio[1], () => {
-                el.querySelector('.vcro-player-label').textContent = 'Cảm ơn bạn đã lắng nghe!';
-                el.querySelector('.vcro-player-icon').textContent = '✓';
-                el.querySelector('.vcro-player-cta').style.display = 'inline-flex';
-            });
-        });
-
-        document.body.appendChild(el);
-        requestAnimationFrame(() => requestAnimationFrame(() => el.classList.add('active')));
-        playerEl = el;
-
-        // Progress tracking
-        startProgressTracking();
-    }
-
-    function updatePlayerUI() {
-        if (!playerEl) return;
-        const icon = playerEl.querySelector('.vcro-player-icon');
-        if (isPlaying) {
-            icon.textContent = '⏸';
-        } else if (currentAudio && !currentAudio.ended) {
-            icon.textContent = '▶';
-        }
-    }
-
-    function startProgressTracking() {
-        const update = () => {
-            if (!currentAudio || !playerEl) return;
-            const bar = playerEl.querySelector('.vcro-player-bar');
-            if (bar && currentAudio.duration) {
-                bar.style.width = (currentAudio.currentTime / currentAudio.duration * 100) + '%';
-            }
-            if (isPlaying) requestAnimationFrame(update);
-        };
-        requestAnimationFrame(update);
-        // Also re-trigger on play
-        if (currentAudio) {
-            currentAudio.addEventListener('play', () => requestAnimationFrame(update));
-        }
-    }
-
-    /* ─── Play Flow ─── */
-    function playIntro(cfg) {
-        playingPart = 1;
-        createPlayer(cfg);
-        playerEl.querySelector('.vcro-player-label').textContent = 'Nghe giới thiệu...';
-        playerEl.querySelector('.vcro-player-cta').style.display = 'none';
-
-        playAudio(cfg.audio[0], () => {
-            // Intro done → show "Nghe Tiếp" button
-            if (playerEl) {
-                playerEl.querySelector('.vcro-player-label').textContent = 'Bạn muốn nghe thêm?';
-                playerEl.querySelector('.vcro-player-next').style.display = 'inline-flex';
-                playerEl.querySelector('.vcro-player-icon').textContent = '✓';
-                playerEl.querySelector('.vcro-player-cta').style.display = 'inline-flex';
-            }
-        });
-    }
-
-    /* ─── Trigger Logic ─── */
-    function initTrigger(cfg) {
-        if (isDismissed()) return;
-        if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) return;
-
-        let timeReady = false;
-        let scrollReady = false;
-        let checkboxReady = false;
-        let triggered = false;
-
-        const tryTrigger = () => {
-            if (triggered) return;
-            // Normal path: time + scroll
-            if (timeReady && scrollReady) {
-                triggered = true;
-                createSheet(cfg);
-                return;
-            }
-            // Checkbox shortcut (mất ngủ page)
-            if (checkboxReady) {
-                triggered = true;
-                createSheet(cfg);
-            }
-        };
-
-        // Time trigger
-        setTimeout(() => {
-            timeReady = true;
-            tryTrigger();
-        }, cfg.delay);
-
-        // Scroll trigger
-        const onScroll = () => {
-            if (getScrollPercent() >= cfg.scroll) {
-                scrollReady = true;
-                window.removeEventListener('scroll', onScroll);
-                tryTrigger();
-            }
-        };
-        window.addEventListener('scroll', onScroll, { passive: true });
-        // Check immediately in case page is already scrolled
-        onScroll();
-
-        // Checkbox trigger (if configured)
-        if (cfg.checkboxTrigger) {
-            const checkboxes = document.querySelectorAll(cfg.checkboxTrigger.selector);
-            if (checkboxes.length) {
-                checkboxes.forEach(cb => {
-                    cb.addEventListener('change', () => {
-                        const checked = document.querySelectorAll(cfg.checkboxTrigger.selector + ':checked').length;
-                        if (checked >= cfg.checkboxTrigger.minChecked) {
-                            checkboxReady = true;
-                            tryTrigger();
-                        }
-                    });
-                });
-            }
-        }
-    }
-
-    /* ─── Init ─── */
-    function init() {
-        const cfg = getPageConfig();
-        if (!cfg) return;
-
-        // Verify audio files exist (preload)
-        if (cfg.audio && cfg.audio.length) {
-            const preload = new Audio();
-            preload.preload = 'none'; // Just check existence later
-            preload.src = cfg.audio[0];
-        }
-
-        // Don't compete with blog reader
-        if (document.querySelector('.reader-player-bar.active')) return;
-
-        initTrigger(cfg);
-    }
-
-    // Wait for DOM
-    if (document.readyState === 'loading') {
-        document.addEventListener('DOMContentLoaded', init);
-    } else {
-        init();
-    }
-
-})();

package/skills/cm-readit/tts-engine.md

@@ -1,262 +0,0 @@
-# TTS Engine — SpeechSynthesis API Reference
-
-> The browser's built-in text-to-speech engine. Zero dependencies, works offline on most devices.
-
----
-
-## API Quick Reference
-
-```javascript
-const synth = window.speechSynthesis;
-
-// Core methods
-synth.speak(utterance)     // Start speaking
-synth.pause()              // Pause
-synth.resume()             // Resume
-synth.cancel()             // Stop all (⚠️ triggers onerror!)
-synth.getVoices()          // Returns SpeechSynthesisVoice[]
-
-// Properties
-synth.speaking             // boolean — currently speaking?
-synth.paused               // boolean — currently paused?
-synth.pending              // boolean — utterances in queue?
-
-// Events
-synth.onvoiceschanged      // Fires when voice list changes
-```
-
-### SpeechSynthesisUtterance
-
-```javascript
-const u = new SpeechSynthesisUtterance(text);
-u.lang   = 'vi-VN';        // BCP-47 language tag
-u.voice  = voiceObject;     // SpeechSynthesisVoice
-u.rate   = 1.0;             // 0.1 — 10 (normal = 1.0)
-u.pitch  = 1.0;             // 0 — 2 (normal = 1.0)
-u.volume = 1.0;             // 0 — 1
-
-// Events
-u.onstart    = fn;          // Speaking started
-u.onend      = fn;          // Finished speaking this utterance
-u.onerror    = fn(event);   // Error occurred (event.error = string)
-u.onpause    = fn;          // Paused
-u.onresume   = fn;          // Resumed
-u.onboundary = fn(event);   // Word/sentence boundary (event.charIndex)
-```
-
----
-
-## Content Extraction Pattern
-
-```javascript
-function extractCoreText(containerSelector) {
-    const container = document.querySelector(containerSelector);
-    if (!container || !container.textContent.trim()) return '';
-
-    const clone = container.cloneNode(true);
-
-    // STRIP non-content elements
-    clone.querySelectorAll([
-        // Navigation & structure
-        'nav, footer, header, aside',
-        // Media (cannot be spoken)
-        'img, video, audio, iframe, svg, figure, canvas',
-        // Scripts & styles
-        'script, style, noscript',
-        // Hidden elements
-        '[aria-hidden="true"], [hidden], .sr-only',
-        // Site-specific noise (customize per project)
-        '.cta-box, .tags, .related-posts, .comments',
-        '.advertisement, .promo, .popup'
-    ].join(', ')).forEach(el => el.remove());
-
-    return clone.innerText
-        .replace(/\n{3,}/g, '\n\n')   // collapse excess newlines
-        .replace(/\s{2,}/g, ' ')       // collapse excess spaces
-        .trim();
-}
-```
-
-**Customization:** The strip selector should be adapted per project. Common additions:
-- Blog: `.blog-cta-box, .blog-tags, .blog-related`
-- E-commerce: `.add-to-cart, .price-compare, .reviews-count`
-- Docs: `.sidebar-nav, .edit-on-github, .breadcrumb`
-
----
-
-## Chunking Strategy
-
-### Why Chunk?
-
-Browsers have hard limits on utterance text length:
-- **Chrome**: ~5000 chars (silently fails beyond)
-- **Safari**: ~4000 chars
-- **Firefox**: ~3000 chars
-- **Safe maximum**: **2500 chars**
-
-### Sentence-Aware Splitting
-
-```javascript
-function splitIntoChunks(text, maxLen = 2500) {
-    const chunks = [];
-    const sentences = text.split(/(?<=[.!?。？！\n])\s+/);
-    let current = '';
-
-    for (const sentence of sentences) {
-        if ((current + ' ' + sentence).length > maxLen && current) {
-            chunks.push(current.trim());
-            current = sentence;
-        } else {
-            current += (current ? ' ' : '') + sentence;
-        }
-    }
-    if (current.trim()) chunks.push(current.trim());
-    return chunks;
-}
-```
-
-### Chunk Chaining
-
-```javascript
-function buildUtterances(chunks, voice, rate = 1.0) {
-    return chunks.map((chunk, i) => {
-        const u = new SpeechSynthesisUtterance(chunk);
-        u.lang = 'vi-VN'; // set per project
-        u.rate = rate;
-        u.pitch = 1.0;
-        if (voice) u.voice = voice;
-
-        u.onend = () => {
-            if (i < chunks.length - 1) {
-                currentIdx = i + 1;
-                synth.speak(utterances[currentIdx]);
-                updateProgress();
-            } else {
-                stopReading(); // last chunk done
-            }
-        };
-
-        u.onerror = (e) => {
-            // synth.cancel() fires onerror with 'canceled'
-            if (e.error === 'canceled' || e.error === 'interrupted') return;
-            stopReading();
-        };
-
-        return u;
-    });
-}
-```
-
----
-
-## Voice Selection
-
-### Strategy
-
-```javascript
-function getVoice(langCode = 'vi-VN') {
-    const voices = speechSynthesis.getVoices();
-    const prefix = langCode.split('-')[0]; // 'vi'
-
-    // 1. Exact match + local (fastest, works offline)
-    const local = voices.find(v => v.lang === langCode && v.localService);
-    if (local) return local;
-
-    // 2. Exact match (may be network/higher quality)
-    const exact = voices.find(v => v.lang === langCode);
-    if (exact) return exact;
-
-    // 3. Language prefix match
-    const prefix_match = voices.find(v => v.lang.startsWith(prefix));
-    if (prefix_match) return prefix_match;
-
-    // 4. null = browser default
-    return null;
-}
-```
-
-### Voices Loading (Async)
-
-On some browsers (Chrome), `getVoices()` returns empty until loaded:
-
-```javascript
-if (synth.getVoices().length === 0) {
-    synth.addEventListener('voiceschanged', function onVoices() {
-        synth.removeEventListener('voiceschanged', onVoices);
-        // Now voices are available
-    });
-}
-```
-
----
-
-## Chrome Keep-Alive
-
-> **The #1 TTS bug:** Chrome stops `SpeechSynthesis` after ~15 seconds of continuous speech. No error is thrown. Audio simply stops.
-
-### Fix
-
-```javascript
-let keepAliveTimer = null;
-
-function startKeepAlive() {
-    stopKeepAlive();
-    keepAliveTimer = setInterval(() => {
-        if (synth.speaking && !synth.paused) {
-            synth.pause();
-            synth.resume();
-        }
-    }, 10000); // every 10 seconds
-}
-
-function stopKeepAlive() {
-    if (keepAliveTimer) {
-        clearInterval(keepAliveTimer);
-        keepAliveTimer = null;
-    }
-}
-```
-
-**Always start keep-alive when speaking, stop when done.**
-
----
-
-## Rate & Pitch Guide
-
-| Rate | Feel | Use Case |
-|------|------|----------|
-| 0.7 | Very slow | Elderly users, complex medical content |
-| 0.85 | Slow | Educational, foreign language |
-| 1.0 | Normal | General content |
-| 1.2 | Slightly fast | News, light reading |
-| 1.5 | Fast | Familiar content, power users |
-| 2.0 | Very fast | Scanning, speed reading |
-
-**Default recommendation:** `1.0` for general, `0.9` for specialized/medical content.
-
----
-
-## Browser Support
-
-| Browser | SpeechSynthesis | Voices | Keep-Alive Needed |
-|---------|----------------|--------|-------------------|
-| Chrome | ✅ | Network + Local | ✅ Yes (pause/resume) |
-| Safari | ✅ | Local only | ❌ No |
-| Firefox | ✅ | Local only | ❌ No |
-| Edge | ✅ | Network + Local | ✅ Yes (same as Chrome) |
-| Mobile Chrome | ✅ | Limited | ✅ Yes |
-| Mobile Safari | ✅ | Good vi-VN | ❌ No |
-
----
-
-## Error Handling Matrix
-
-| Error | Cause | Recovery |
-|-------|-------|----------|
-| `canceled` | `synth.cancel()` called | Ignore (expected) |
-| `interrupted` | New utterance replaced current | Ignore (expected) |
-| `audio-busy` | Another utterance playing | Wait and retry |
-| `network` | Network voice unavailable | Fall back to local voice |
-| `synthesis-unavailable` | TTS engine not available | Show "Not supported" message |
-| `synthesis-failed` | Voice failed to synthesize | Try different voice or skip chunk |
-| `not-allowed` | User hasn't interacted | Require button click first |