desmos-wasd.js

/*jshint esversion: 6 */
// coded by SlimRunner
// patchRegression made with the help of CyanideDuality
// Desmos WASD variable manipulator

(function() {
    'use strict';

    // you can change the name of your variables here
    const X_VAR = 'P_{x}';
    const Y_VAR = 'P_{y}';
    const RESOL = 2; // decimal places

    // use destructred assignment to populate variables
    let {
        px_id,      // id of x location variable
        py_id,      // id of y location variable
        x_min_id,   // id of variable for minimum on x
        x_max_id,   // id of variable for maximum on x
        y_min_id,   // id of variable for minimum on y
        y_max_id,   // id of variable for maximum on y
        x_step,     // stepping value of x
        y_step      // stepping value of y
    } = captureVars(X_VAR, Y_VAR);

    let obs_x = Calc.HelperExpression({
        latex: X_VAR
    });
    let obs_y = Calc.HelperExpression({
        latex: Y_VAR
    });

    obs_x.observe('numericValue', () => {
        patchRegression();
    });
    obs_y.observe('numericValue', () => {
        patchRegression();
    });

    // listen to window keydown
    window.addEventListener('keydown', (e) => {
        // do something only when the target isn't a textinput
        if (e.target.nodeName.toLowerCase() === 'body') {
            // prevent caps lock from killing the code
            let cKey = e.key.toLowerCase();
            let evalExp = Calc.expressionAnalysis;

            switch (true) {
                case cKey === 'w': // up
                    increaseVar({
                        id: py_id,
                        varName: Y_VAR,
                        varValue: evalExp[py_id].evaluation.value,
                        delta: y_step,
                        min: evalExp[y_min_id].evaluation.value,
                        max: evalExp[y_max_id].evaluation.value,
                        resolution: RESOL
                    });
                    break;

                case cKey === 'a': // left
                    increaseVar({
                        id: px_id,
                        varName: X_VAR,
                        varValue: evalExp[px_id].evaluation.value,
                        delta: -x_step,
                        min: evalExp[x_min_id].evaluation.value,
                        max: evalExp[x_max_id].evaluation.value,
                        resolution: RESOL
                    });
                    break;

                case cKey === 's': // down
                    increaseVar({
                        id: py_id,
                        varName: Y_VAR,
                        varValue: evalExp[py_id].evaluation.value,
                        delta: -y_step,
                        min: evalExp[y_min_id].evaluation.value,
                        max: evalExp[y_max_id].evaluation.value,
                        resolution: RESOL
                    });
                    break;

                case cKey === 'd': // right
                    increaseVar({
                        id: px_id,
                        varName: X_VAR,
                        varValue: evalExp[px_id].evaluation.value,
                        delta: x_step,
                        min: evalExp[x_min_id].evaluation.value,
                        max: evalExp[x_max_id].evaluation.value,
                        resolution: RESOL
                    });
                    break;

                default:
                // huh? not wasd?
            }

        }
    });


    function patchRegression() {
        let evalExp = Calc.expressionAnalysis;
        let x = evalExp[px_id].evaluation.value;
        let y = evalExp[py_id].evaluation.value;

        x = Math.min(Math.max(x, evalExp[x_min_id].evaluation.value), evalExp[x_max_id].evaluation.value);
        y = Math.min(Math.max(y, evalExp[y_min_id].evaluation.value), evalExp[y_max_id].evaluation.value);

        Calc.setExpression({
            id: px_id,
            latex: `${X_VAR}=${x}`
        });

        Calc.setExpression({
            id: py_id,
            latex: `${Y_VAR}=${y}`
        });
    }


    function increaseVar({
        id,
        varName,
        varValue,
        delta,
        min, max,
        resolution
    }) {
        const round = (val, scl) => Math.round(val * scl) / scl;

        let output = round(varValue + delta, Math.pow(10, resolution));
        if (output < min || output > max) return false;

        Calc.setExpression({
            id: id,
            latex: `${varName}=${(output).toFixed(resolution)}`
        });

        return true;
    }

    function filterExprAssignment(exprs, varNames) {
        let rxFilter = new RegExp(String.raw`^((?:${varNames.join('|')})=)(.+)$`, '');

        return exprs.filter((exp) => {
            if (exp.hasOwnProperty('latex')) {
                return rxFilter.test(exp.latex);
            }

            return false;
        });
    }

    function captureVars(x_name, y_name) {
        let exprs = Calc.getExpressions();

        // get array with expressions containing sought variables
        let xy_expr = filterExprAssignment(exprs, [x_name, y_name]);

        let x_idx = xy_expr[0].latex.indexOf('x') === -1 ? 1 : 0;
        let y_idx = x_idx ? 0 : 1;

        // gets min and max expressions
        let lim_bounds = xy_expr.map((exp) => {
            return exp.sliderBounds;
        });

        let x_lims = {
            max: filterExprAssignment(exprs, [lim_bounds[x_idx].max])[0],
            min: filterExprAssignment(exprs, [lim_bounds[x_idx].min])[0]
        };

        let y_lims = {
            max: filterExprAssignment(exprs, [lim_bounds[y_idx].max])[0],
            min: filterExprAssignment(exprs, [lim_bounds[y_idx].min])[0]
        };

        return {
            px_id: xy_expr[x_idx].id,
            py_id: xy_expr[y_idx].id,
            x_min_id: x_lims.min.id,
            x_max_id: x_lims.max.id,
            y_min_id: y_lims.min.id,
            y_max_id: y_lims.max.id,
            x_step: Number(lim_bounds[x_idx].step),
            y_step: Number(lim_bounds[y_idx].step)
        };
    }
}());