9w9's Helper

Working Omoggle renderer + fixed GUI spawning

スクリプトをインストールするには、Tampermonkey, GreasemonkeyViolentmonkey のような拡張機能のインストールが必要です。

You will need to install an extension such as Tampermonkey to install this script.

スクリプトをインストールするには、TampermonkeyViolentmonkey のような拡張機能のインストールが必要です。

スクリプトをインストールするには、TampermonkeyUserscripts のような拡張機能のインストールが必要です。

このスクリプトをインストールするには、Tampermonkeyなどの拡張機能をインストールする必要があります。

このスクリプトをインストールするには、ユーザースクリプト管理ツールの拡張機能をインストールする必要があります。

(ユーザースクリプト管理ツールは設定済みなのでインストール!)

このスタイルをインストールするには、Stylusなどの拡張機能をインストールする必要があります。

このスタイルをインストールするには、Stylus などの拡張機能をインストールする必要があります。

このスタイルをインストールするには、Stylus tなどの拡張機能をインストールする必要があります。

このスタイルをインストールするには、ユーザースタイル管理用の拡張機能をインストールする必要があります。

このスタイルをインストールするには、ユーザースタイル管理用の拡張機能をインストールする必要があります。

このスタイルをインストールするには、ユーザースタイル管理用の拡張機能をインストールする必要があります。

(ユーザースタイル管理ツールは設定済みなのでインストール!)

このスクリプトの質問や評価の投稿はこちら通報はこちらへお寄せください
// ==UserScript==
// @name         9w9's Helper
// @namespace    http://tampermonkey.net/
// @version      4.1
// @description  Working Omoggle renderer + fixed GUI spawning
// @license      9w9
// @author       ChatGPT
// @match        *://omoggle.com/*
// @match        *://*.omoggle.com/*
// @grant        none
// @run-at       document-start
// ==/UserScript==

(function () {
    'use strict';

    if (window.__goldenRatioLoaded) return;
    window.__goldenRatioLoaded = true;

    let active = false;
    let jitterAmount = 0.15;

    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');

    canvas.width = 640;
    canvas.height = 480;

    const faceConfig = {
        eyeTilt: 20,
        eyeWidth: 26,
        eyeHeight: 8,
        eyeSpacing: 52,
        faceWidth: 85,
        faceHeight: 620,
        jawWidth: 74,
        jawDepth: 214,
        mouthY: 44,
        philtrumY: 16,
        headX: 0,
        headY: 0,
        rotateZ: 0,
        rotateX: 0,
        rotateY: 0,
    };

    function rotatePoint3D(x, y, z, rx, ry, rz) {

        let x1 = x * Math.cos(rz) - y * Math.sin(rz);
        let y1 = x * Math.sin(rz) + y * Math.cos(rz);
        let z1 = z;

        let y2 = y1 * Math.cos(rx) - z1 * Math.sin(rx);
        let z2 = y1 * Math.sin(rx) + z1 * Math.cos(rx);

        let x2 = x1;

        let x3 = x2 * Math.cos(ry) + z2 * Math.sin(ry);
        let z3 = -x2 * Math.sin(ry) + z2 * Math.cos(ry);

        return {
            x: x3,
            y: y2,
            z: z3
        };
    }

    function project(x, y, z, focalLen = 600) {

        const scale = focalLen / (focalLen + z);

        return {
            x: x * scale,
            y: y * scale,
            scale
        };
    }

    function renderFace(targetCtx, W, H, config, jitter) {

        targetCtx.clearRect(0, 0, W, H);

        targetCtx.fillStyle = "#000";
        targetCtx.fillRect(0, 0, W, H);

        const t = Date.now() * 0.015;

        const jx = Math.sin(t) * jitter;
        const jy = Math.cos(t * 1.1) * (jitter * 0.67);

        const drawScale = Math.min(W / 640, H / 480);

        const baseCX = 320 + config.headX * 80 + jx;
        const baseCY = 212 + config.headY * 80 + jy;

        const rx = config.rotateX * Math.PI / 180;
        const ry = config.rotateY * Math.PI / 180;
        const rz = config.rotateZ * Math.PI / 180;

        function tp(dx, dy, dz = 0) {

            const r = rotatePoint3D(dx, dy, dz, rx, ry, rz);
            const p = project(r.x, r.y, r.z);

            return {
                x: baseCX + p.x,
                y: baseCY + p.y,
                s: p.scale
            };
        }

        targetCtx.save();

        targetCtx.translate(W / 2, H / 2);
        targetCtx.scale(drawScale, drawScale);
        targetCtx.translate(-320, -240);

        targetCtx.beginPath();

        const steps = 48;

        for (let i = 0; i <= steps; i++) {

            const a = (i / steps) * Math.PI * 2;

            const p = tp(
                Math.cos(a) * config.faceWidth,
                Math.sin(a) * config.faceHeight + 12
            );

            if (i === 0) {
                targetCtx.moveTo(p.x, p.y);
            } else {
                targetCtx.lineTo(p.x, p.y);
            }
        }

        targetCtx.closePath();

        const g = targetCtx.createRadialGradient(
            baseCX,
            baseCY,
            20,
            baseCX,
            baseCY,
            170
        );

        g.addColorStop(0, "#c4a484");
        g.addColorStop(0.75, "#2a1b10");
        g.addColorStop(1, "#000");

        targetCtx.fillStyle = g;
        targetCtx.fill();

        [-1, 1].forEach(side => {

            const ep = tp(config.eyeSpacing * side, -16);

            targetCtx.save();

            targetCtx.translate(ep.x, ep.y);

            targetCtx.rotate(
                (side * config.eyeTilt + ry * 15 * side) * Math.PI / 180
            );

            targetCtx.scale(ep.s, ep.s);

            targetCtx.fillStyle = "black";

            targetCtx.fillRect(
                -config.eyeWidth / 2,
                -config.eyeHeight / 2,
                config.eyeWidth,
                config.eyeHeight
            );

            targetCtx.restore();
        });

        const pp = tp(0, config.philtrumY);

        targetCtx.fillStyle = "black";

        targetCtx.beginPath();
        targetCtx.arc(pp.x, pp.y, 8 * pp.s, 0, Math.PI * 2);
        targetCtx.fill();

        const mL = tp(-28, config.mouthY);
        const mR = tp(28, config.mouthY);
        const mC = tp(0, config.mouthY - 3);

        targetCtx.strokeStyle = "black";
        targetCtx.lineWidth = 6;

        targetCtx.beginPath();
        targetCtx.moveTo(mL.x, mL.y);
        targetCtx.quadraticCurveTo(mC.x, mC.y, mR.x, mR.y);
        targetCtx.stroke();

        const jL = tp(-config.jawWidth, config.mouthY);
        const jR = tp(config.jawWidth, config.mouthY);

        const jCL = tp(-22, config.jawDepth);
        const jCR = tp(22, config.jawDepth);

        targetCtx.lineWidth = 14;
        targetCtx.strokeStyle = "black";
        targetCtx.lineJoin = "round";

        targetCtx.beginPath();
        targetCtx.moveTo(jL.x, jL.y);
        targetCtx.lineTo(jCL.x, jCL.y);
        targetCtx.lineTo(jCR.x, jCR.y);
        targetCtx.lineTo(jR.x, jR.y);
        targetCtx.stroke();

        targetCtx.restore();
    }

    function drawPerfectFace() {
        renderFace(ctx, 640, 480, faceConfig, jitterAmount);
    }

    const hook = (proto) => {

        const original = proto.texImage2D;

        proto.texImage2D = function (...args) {

            if (
                active &&
                args[args.length - 1] instanceof HTMLVideoElement
            ) {

                drawPerfectFace();

                return original.apply(this, [
                    args[0],
                    args[1],
                    args[2],
                    args[3],
                    args[4],
                    canvas
                ]);
            }

            return original.apply(this, args);
        };
    };

    if (window.WebGLRenderingContext) {
        hook(window.WebGLRenderingContext.prototype);
    }

    if (window.WebGL2RenderingContext) {
        hook(window.WebGL2RenderingContext.prototype);
    }

    function injectUI() {

        if (document.getElementById('mgr-ui')) return;

        const ui = document.createElement('div');

        ui.id = 'mgr-ui';

        ui.innerHTML = `
            <div id="mgr-window">
                <div id="mgr-header">
                    9w9's Helper
                </div>

                <div class="mgr-section">
                    <button id="mgr-toggle">
                        Activate
                    </button>
                </div>

                <div class="mgr-section">
                    <label>Jitter</label>
                    <input
                        type="range"
                        id="mgr-jitter"
                        min="0"
                        max="2"
                        step="0.01"
                        value="0.15"
                    >
                </div>

                <div class="mgr-section">
                    <label>Eye Tilt</label>
                    <input
                        type="range"
                        id="mgr-eyeTilt"
                        min="0"
                        max="40"
                        step="1"
                        value="20"
                    >
                </div>

                <canvas id="mgr-preview"></canvas>
            </div>
        `;

        const style = document.createElement('style');

        style.textContent = `
            #mgr-window {
                position: fixed;
                top: 20px;
                left: 20px;
                width: 260px;
                background: rgba(20,20,20,0.95);
                border: 1px solid rgba(255,255,255,0.08);
                border-radius: 16px;
                padding: 14px;
                z-index: 999999999;
                color: white;
                font-family: Arial;
                backdrop-filter: blur(12px);
                box-shadow: 0 0 40px rgba(0,0,0,0.5);
            }

            #mgr-header {
                font-size: 18px;
                font-weight: bold;
                margin-bottom: 12px;
                color: #ffd700;
                cursor: move;
            }

            .mgr-section {
                margin-bottom: 12px;
            }

            .mgr-section label {
                display: block;
                margin-bottom: 4px;
                font-size: 13px;
            }

            .mgr-section input {
                width: 100%;
            }

            #mgr-toggle {
                width: 100%;
                padding: 10px;
                border: none;
                border-radius: 10px;
                background: #ffd700;
                color: black;
                font-weight: bold;
                cursor: pointer;
            }

            #mgr-preview {
                width: 100%;
                height: 180px;
                background: black;
                border-radius: 12px;
                margin-top: 8px;
            }
        `;

        document.head.appendChild(style);
        document.body.appendChild(ui);

        const preview = document.getElementById('mgr-preview');
        const pctx = preview.getContext('2d');

        preview.width = 320;
        preview.height = 180;

        function previewLoop() {

            drawPerfectFace();

            pctx.clearRect(0, 0, preview.width, preview.height);

            pctx.drawImage(
                canvas,
                0,
                0,
                preview.width,
                preview.height
            );

            requestAnimationFrame(previewLoop);
        }

        previewLoop();

        document.getElementById('mgr-toggle')
            .onclick = () => {

                active = !active;

                document.getElementById('mgr-toggle')
                    .textContent = active
                        ? 'Deactivate'
                        : 'Activate';
            };

        document.getElementById('mgr-jitter')
            .oninput = (e) => {

                jitterAmount = parseFloat(e.target.value);
            };

        document.getElementById('mgr-eyeTilt')
            .oninput = (e) => {

                faceConfig.eyeTilt = parseFloat(e.target.value);
            };

        const windowEl = document.getElementById('mgr-window');
        const header = document.getElementById('mgr-header');

        let dragging = false;
        let ox = 0;
        let oy = 0;

        header.addEventListener('mousedown', (e) => {

            dragging = true;

            ox = e.clientX - windowEl.offsetLeft;
            oy = e.clientY - windowEl.offsetTop;
        });

        document.addEventListener('mousemove', (e) => {

            if (!dragging) return;

            windowEl.style.left = `${e.clientX - ox}px`;
            windowEl.style.top = `${e.clientY - oy}px`;
        });

        document.addEventListener('mouseup', () => {
            dragging = false;
        });
    }

    setInterval(() => {

        if (!document.body) return;

        injectUI();

    }, 1000);

})();