Jul.5, 2026 - ROUTINE INITIALISATION + COUNTING

Threw together a little monkey script so you can see your window! It will show you a little red box where your pixel/window is.

Add it to tampermonkey/greasemonkey/etc. in your browser and it will give you an overlay you can enter your prime window into! :saluting_face: :heart:

// ==UserScript==
// @name         Skyscraper Prime Window Highlighter
// @namespace    http://project-skyscraper.com/
// @version      1.0
// @description  Enter your prime window number and see its pixel highlighted on the tower grid
// @author       vector_cmdr
// @match        https://project-skyscraper.com/counting/
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    const COLS = 131;
    const ROWS = 541;
    const PIXELS_PER_GRID = COLS * ROWS;
    const CELL_SIZE = 2;
    const GAP = 1;
    const STEP = CELL_SIZE + GAP;

    const container = document.querySelector('div[style*="position:relative"]');
    if (!container) return;

    const overlay = document.createElement('div');
    overlay.id = 'prime-overlay';
    overlay.innerHTML = `
        <label style="color:#fff; font-family:inherit; font-size:0.8rem;">
            Enter prime window:
            <input type="number" id="prime-input" min="1" max="212613"
                   style="width:100px; background:#111; color:#fff; border:1px solid #04879d; padding:4px 8px; font-family:inherit;">
            <button id="prime-go"
                    style="background:#04879d; color:#fff; border:none; padding:4px 12px; cursor:pointer; font-family:inherit;">Go</button>
            <button id="prime-clear"
                    style="background:#333; color:#fff; border:none; padding:4px 12px; cursor:pointer; font-family:inherit;">Clear</button>
        </label>
        <div id="prime-status" style="color:#888; font-size:0.7rem; margin-top:4px;"></div>
        <div style="color:#444; font-size:0.6rem; margin-top:8px; text-align:center;">by vector_cmdr</div>
    `;
    overlay.style.cssText = `
        position:fixed; bottom:20px; left:50%; transform:translateX(-50%);
        background:rgba(0,0,0,0.85); border:1px solid #04879d;
        padding:12px 20px; z-index:9999; text-align:center;
        font-family:"IBM Plex Mono", monospace;
    `;
    document.body.appendChild(overlay);

    let highlightEl = null;

    function clearHighlight() {
        if (highlightEl) { highlightEl.remove(); highlightEl = null; }
        document.getElementById('prime-status').textContent = '';
    }

    function showHighlight(n) {
        clearHighlight();

        const globalIndex = n - 1;
        if (globalIndex < 0 || globalIndex >= 212613) {
            document.getElementById('prime-status').textContent = 'Out of range (1–212613)';
            return;
        }

        const grid = Math.floor(globalIndex / PIXELS_PER_GRID);
        const local = globalIndex % PIXELS_PER_GRID;
        const x = local % COLS;
        const y = Math.floor(local / COLS);

        const canvasId = 'grid' + (grid + 1);
        const canvas = document.getElementById(canvasId);
        if (!canvas) return;

        const rect = canvas.getBoundingClientRect();
        const drawX = x * STEP;
        const drawY = y * STEP;

        // Check if it's prime
        function isPrime(n) {
            if (n <= 1) return false;
            if (n <= 3) return true;
            if (n % 2 === 0 || n % 3 === 0) return false;
            for (let i = 5; i * i <= n; i += 6) {
                if (n % i === 0 || n % (i + 2) === 0) return false;
            }
            return true;
        }

        const prime = isPrime(n);

        highlightEl = document.createElement('div');
        highlightEl.style.cssText = `
            position:fixed; left:${rect.left + drawX - 1}px; top:${rect.top + drawY - 1}px;
            width:${CELL_SIZE + 2}px; height:${CELL_SIZE + 2}px;
            border:2px solid red; pointer-events:none; z-index:1000;
            box-shadow: 0 0 8px rgba(255,0,0,0.8);
        `;
        document.body.appendChild(highlightEl);

        document.getElementById('prime-status').textContent =
            `Grid ${grid + 1} — col ${x}, row ${y} — index ${n} ${prime ? 'Y PRIME' : 'N composite'}`;
    }

    document.getElementById('prime-go').addEventListener('click', () => {
        const val = parseInt(document.getElementById('prime-input').value);
        if (val) showHighlight(val);
    });

    document.getElementById('prime-clear').addEventListener('click', clearHighlight);

    document.getElementById('prime-input').addEventListener('keydown', (e) => {
        if (e.key === 'Enter') document.getElementById('prime-go').click();
    });

    // Re-highlight after page updates (reposition on scroll/resize)
    let lastVal = 0;
    setInterval(() => {
        if (highlightEl) {
            const val = parseInt(document.getElementById('prime-input').value);
            if (val && val !== lastVal) { lastVal = val; showHighlight(val); }
            else if (val) {
                // reposition
                const globalIndex = val - 1;
                const grid = Math.floor(globalIndex / PIXELS_PER_GRID);
                const local = globalIndex % PIXELS_PER_GRID;
                const x = local % COLS;
                const y = Math.floor(local / COLS);
                const canvas = document.getElementById('grid' + (grid + 1));
                if (canvas) {
                    const rect = canvas.getBoundingClientRect();
                    highlightEl.style.left = (rect.left + x * STEP - 1) + 'px';
                    highlightEl.style.top = (rect.top + y * STEP - 1) + 'px';
                }
            }
        }
    }, 500);
})();

So who is my neighbour? I cook a mean meal. Drop by!

12 Likes