QWEN3.6용 llama.cpp 웹 채팅 <Think> 토글 버튼

llama-serve 웹 채팅에 LM Studio처럼 추론 기능을 켜고 끌 수 있는 버튼이 없나요?

이것은 기존 웹 페이지에 추가 기능을 주입하는 브라우저 확장 프로그램인 Tampermonkey에서 실행되는 스니펫입니다. 매일 llama.cpp를 다시 컴파일하거나 패치할 필요 없이 브라우저에 그대로 유지됩니다.

확장 프로그램을 설치하고 다음 스크립트를 추가하세요:

// ==UserScript==
// @name QWEN3.6 reasoning toggle
// @namespace http://tampermonkey.net/
// @version 3.1
// @description Reasoning toggle button for llama.cp chat
// @author Eaman
// @match http://localhost:8080/*
// @match http://127.0.0.1:8080/*
// @grant none
// @run-at document-start
// ==/UserScript==
(function() {
    'use strict';
    window.__reasoningEnabled = (localStorage.getItem('qwen_reasoning') !== 'false');

    // ==========================================
    // 1. NETWORK INTERCEPT
    // ==========================================
    const originalFetch = window.fetch;
    window.fetch = async function(...args) {
        const url = args[0];
        const options = args[1];
        if (typeof url === 'string' && (url.includes('/v1/chat/completions') || url.includes('/chat/completions')) && options && options.body) {
            try {
                let data = JSON.parse(options.body);
                if (!window.__reasoningEnabled) {
                    if (!data.chat_template_kwargs) data.chat_template_kwargs = {};
                    data.chat_template_kwargs.enable_thinking = false;
                    data.reasoning_budget = 0;
                } else {
                    if (!data.chat_template_kwargs) data.chat_template_kwargs = {};
                    data.chat_template_kwargs.enable_thinking = true;
                }
                options.body = JSON.stringify(data);
            } catch (e) {
                console.error(e);
            }
        }
        return originalFetch.apply(this, args);
    };

    // ==========================================
    // 2. NATIVE INLINE INJECTION
    // ==========================================
    function drawToggleBtn() {
        if (document.getElementById('llama-native-inline-toggle')) return;
        const plusBtn = document.querySelector('.file-upload-button');
        if (!plusBtn || !plusBtn.parentNode) return;
        const btn = document.createElement('button');
        btn.id = "llama-native-inline-toggle";
        btn.type = "button";
        updateButtonUI(btn, window.__reasoningEnabled);

        // Layout properties
        btn.style.display = 'inline-flex';
        btn.style.alignItems = 'center';
        btn.style.justifyContent = 'center';
        btn.style.shrink = '0';
        // Circular pill framing matching native elements
        btn.style.padding = '0px 10px';
        btn.style.fontSize = '10px';
        btn.style.borderRadius = '9999px';
        btn.style.cursor = 'pointer';
        btn.style.fontWeight = 'bold';
        btn.style.height = '32px';
        btn.style.whiteSpace = 'nowrap';
        btn.style.transition = 'all 0.15s ease';

        btn.addEventListener('mousedown', (e) => { e.preventDefault(); });
        btn.addEventListener('click', (e) => {
            e.preventDefault();
            e.stopPropagation();
            window.__reasoningEnabled = !window.__reasoningEnabled;
            localStorage.setItem('qwen_reasoning', window.__reasoningEnabled);
            updateButtonUI(btn, window.__reasoningEnabled);
            const textarea = document.querySelector('textarea');
            if (textarea) textarea.focus();
        });
        plusBtn.parentNode.insertBefore(btn, plusBtn.nextSibling);
    }

    function updateButtonUI(element, enabled) {
        if (enabled) {
            // ON State: Pure White background, dark text (Matches Submit Arrow)
            element.innerText = "🧠 ON";
            element.title = "Reasoning Enabled";
            element.style.backgroundColor = '#ffffff';
            element.style.color = '#121212';
            element.style.border = '1px solid #ffffff';
        } else {
            // OFF State: Muted Dark Gray background, white text (Matches Plus Button)
            element.innerText = "⚡ OFF";
            element.title = "Reasoning Disabled";
            element.style.backgroundColor = 'rgba(255, 255, 255, 0.15)';
            element.style.color = '#ffffff';
            element.style.border = '1px solid rgba(255, 255, 255, 0.05)';
        }
    }

    const observer = new MutationObserver(() => {
        drawToggleBtn();
    });
    observer.observe(document.body, { childList: true, subtree: true });
})();