From b0f81b527983bc27dd7b578ab9d2686ce6b8eae4 Mon Sep 17 00:00:00 2001 From: MshNiyaz Date: Fri, 30 Aug 2024 17:31:01 +0800 Subject: [PATCH] Added ace code editor --- css/settings.css | 9 +++++-- index.html | 7 +++-- js/inputs/settings.js | 62 ++++++++++++++++++++++++++++++------------- 3 files changed, 55 insertions(+), 23 deletions(-) diff --git a/css/settings.css b/css/settings.css index ef61851..fa2ea0c 100644 --- a/css/settings.css +++ b/css/settings.css @@ -1,7 +1,7 @@ /*! Window sizing */ #settings { max-width: 25vw !important; - min-width: 250px; + min-width: 300px; } #settings-window-content { @@ -103,7 +103,6 @@ } /*! Checkbox Stylings */ - .neighbor-grid input[type="checkbox"] { width: 100%; height: 100%; @@ -184,3 +183,9 @@ input[type="checkbox"]:disabled { color: var(--bg-color); cursor: pointer; } + +/*! Code Editor */ +#neural-code-editor { + height: 100px; + scrollbar-color: auto; +} diff --git a/index.html b/index.html index fa60a09..236f8d2 100644 --- a/index.html +++ b/index.html @@ -28,6 +28,8 @@ + + @@ -496,9 +498,10 @@

Rules

- - + + +
diff --git a/js/inputs/settings.js b/js/inputs/settings.js index 9cae293..77f3afe 100644 --- a/js/inputs/settings.js +++ b/js/inputs/settings.js @@ -358,24 +358,6 @@ document.getElementById("neural-randomize").onclick = (_) => { automata.randomize(); }; -// Handle changes in activation -const activationSelector = document.getElementById("neural-activation-select"); -activationSelector.selectedIndex = activationSelector.options.length - 2; -activationSelector.onchange = (event) => { - setActivation(event.target.value); -}; - -function setActivation(type, args = []) { - const funcMap = { - identity: (x) => x, - power: (x) => Math.pow(x, 2), - absolute: (x) => Math.abs(x), - tanh: (x) => (Math.exp(2 * x) - 1) / (Math.exp(2 * x) + 1), - "inverse-gaussian": (x) => -(1 / Math.pow(2, 0.6 * Math.pow(x, 2))) + 1, - }; - automata.activation = funcMap[type]; -} - // Handle changes in skip frame document .getElementById("neural-skip-input") @@ -456,6 +438,49 @@ presetSelector.onchange = (event) => { automata.randomize(); }; +// Handle changes in activation +const activationSelector = document.getElementById("neural-activation-select"); +activationSelector.selectedIndex = activationSelector.options.length - 1; // Initially set to custom +activationSelector.onchange = (event) => { + setActivation(event.target.value); +}; + +function setActivation(type, args = []) { + const funcMap = { + identity: (x) => x, + power: (x) => Math.pow(x, 2), + absolute: (x) => Math.abs(x), + tanh: (x) => (Math.exp(2 * x) - 1) / (Math.exp(2 * x) + 1), + "inverse-gaussian": (x) => -(1 / Math.pow(2, Math.pow(x, 2))) + 1, + }; + automata.activation = funcMap[type]; +} + +// Intialize activation func code editor +const editor = ace.edit("neural-code-editor"); +editor.setTheme("ace/theme/monokai"); // Dark theme +editor.session.setMode("ace/mode/javascript"); // JavaScript syntax highlighting +editor.setOptions({ + fontSize: "10px", // Font size + showLineNumbers: true, + showGutter: true, +}); +editor.session.setUseWrapMode(true); +editor.session.setUseSoftTabs(true); +editor.setValue( + "function activation(x) {\n\treturn -(1 / Math.pow(2, 0.6 * Math.pow(x, 2))) + 1;\n}" +); +editor.session.on("change", function (delta) { + const code = editor.getValue(); + try { + // Evaluate the code and assign the function to a variable + const activation = eval(`(${code})`); + console.log(eval(`(${code})`)); + } catch (error) { + console.error("Error in the code:", error); + } +}); + //! Huegene Rules // Handle changes in random factor document @@ -470,7 +495,6 @@ document automata.updateOffset(true); }); -// TODO: Add in fade and psychedelic effects // Switch on/off fade document .getElementById("huegene-fade-input")