~cadence/crumpet

375a8af1440b40998f7703e40f55c5c967458c24 — Cadence Ember 10 months ago 7162472
Rework scrolling to improve touchpad experience
2 files changed, 20 insertions(+), 2 deletions(-)

M root/crumpet/index.html
M root/crumpet/plus.js
M root/crumpet/index.html => root/crumpet/index.html +8 -1
@@ 70,7 70,7 @@
        <canvas></canvas>
        <div id="settings" class="overlay editoroverlay" style="display: none;">
            <div>
                <h3>Settings</h3>
                <h3>Attributes</h3>
                <table>
                    <tr>
                        <td>Level name</td>


@@ 192,6 192,13 @@
                    </label>
                </div>
            </div>
            <div>
                <h3>Settings</h3>
                <div>
                    <label>Scroll speed modifier (default 1.00x)</label>
                    <div class="buttonContainer"><input type="range" id="iScrollSpeed" min=-30 max=30 value=0></input><span id="scrollspeed" style="white-space: pre">0.0 → 1.00x</span></div>
                </div>
            </div>
        </div>
        <div id="saveToast"></div>
        <script src="/crumpet/request.js"></script>

M root/crumpet/plus.js => root/crumpet/plus.js +12 -1
@@ 5,6 5,7 @@ const level = {
    signs: Array(20).fill("")
};
const imagesDir = "/images";
let scrollSpeedMultiplier = 1;
let TH; // variable referencing

let drawHexOverlay = true


@@ 110,6 111,12 @@ function loadCurrentSign() {
    }
}

function applyScrollSpeed() {
    let scrollSpeedDisplay = q("#iScrollSpeed").value / 10;
    scrollSpeedMultiplier = Math.pow(2, scrollSpeedDisplay);
    q("#scrollspeed").textContent = scrollSpeedDisplay.toFixed(1) + " → " + scrollSpeedMultiplier.toFixed(2) + "x";
}

function registerHexTile(hex, layer) {
    // Create data
    const hexString = hex.toString(16).padStart(4, "0").toUpperCase()


@@ 211,7 218,8 @@ class World {
        this.lastEvent = null;
        this.lastClickObject = undefined;
        this.C.canvas.addEventListener("wheel", event => {
            let deltaY = Math.sign(event.deltaY) * 53;
            let deltaX = Math.round(event.deltaX * 0.5 * scrollSpeedMultiplier)
            let deltaY = Math.round(event.deltaY * 0.5 * scrollSpeedMultiplier)
            if (event.ctrlKey) {
                let posBefore = this.worldToPos([event.clientX, event.clientY]);
                if (deltaY > 0) {


@@ 224,6 232,7 @@ class World {
            } else if (event.shiftKey) {
                this.scroll[0] += deltaY;
            } else {
                this.scroll[0] += deltaX;
                this.scroll[1] += deltaY;
            }
            event.preventDefault();


@@ 283,6 292,7 @@ class World {
            }
        });
        q("#iCurrentSign").addEventListener("input", () => loadCurrentSign())
        q("#iScrollSpeed").addEventListener("input", () => applyScrollSpeed())
        q("#iSignText").addEventListener("input", event => {
            let currentSign = getCurrentSignIndex();
            if (currentSign !== null) {


@@ 302,6 312,7 @@ class World {
        })

        loadCurrentSign();
        applyScrollSpeed();
    }
    handleMouseEvent(type, event) {
        this.lastEvent = event;