feat: select mode

example/css/style.css

@@ -5,7 +5,6 @@
 
 #code {
     border: solid black;
-    height: 100%;
 }
 
 .inner-container:not(.inner-container:first-child) {

example/dist/bundle.js

@@ -234,12 +234,10 @@ var Processor = class {
   }
   executeFunc() {
     for (const instruction of this.func.instructions) {
-      if (instruction == Opcodes.get_local) {
+      if (instruction == Opcodes.get_local)
         this.stack.push(this.params[this.func.locals.shift()]);
-      }
-      if (instruction == Opcodes.i32_const) {
+      if (instruction == Opcodes.i32_const)
         this.stack.push(this.func.internals.shift());
-      }
       this.#parseInstruction(instruction);
     }
   }
@@ -282,7 +280,6 @@ function invokeFunction(ast, funcName, params) {
 // runtime/runtime/start.js
 var startAeonRuntime = (wasm, ...args) => {
   const ast = createAST(wasm);
-  console.log("FUCK", wasm);
   const [funcName, ...rest] = args;
   const params = rest;
   const result = invokeFunction(ast, funcName, params);

example/index.html

@@ -19,6 +19,13 @@ <h1>Luna</h1>
     <div class="container">
       <div class="inner-container">
         <div id="code"></div>
+        <select id="instruction">
+          <option value="addition">Addition</option>
+          <option value="subtraction">Subtraction</option>
+          <option value="division">Division</option>
+          <option value="multiplication">Multiplication</option>
+          <option value="const">Const</option>
+        </select>
         <button id="compile">Compile</button>
       </div>
       <div class="inner-container">
@@ -29,11 +36,11 @@ <h1>Luna</h1>
       <div class="inner-container">
         Calculate (add or subtract):
         <div>
-          <label for="t-input-1">Num 1</label>
+          <label id="label-1" for="t-input-1">Num 1</label>
           <input name="t-input-1" id="input-1" type="text" />
         </div>
         <div>
-          <label for="t-input-2">Num 2</label>
+          <label id="label-2" for="t-input-2">Num 2</label>
           <input name="t-input-2" id="input-2" type="text" />
         </div>
         <div id="btn-result-container"><button id="btn">Result</button></div>

example/js/index.js

@@ -1,4 +1,6 @@
 import startAeonRuntime from '../dist/bundle.js';
+import { defaultText } from './inputDefaultText.js';
+import { CONST_MODE } from './texts/texts.js';
 
 const go = new Go(); // Defined in wasm_exec.js. Don't forget to add this in your index.html.
 
@@ -43,8 +45,10 @@ const runLunaAddition = async () => {
   // Set the result onto the doc
   const input1 = document.getElementById('input-1');
   const input2 = document.getElementById('input-2');
+  const label2 = document.getElementById('label-2')
   const codeContainer = document.getElementById('code');
   const moduleContainer = document.getElementById('module');
+  const selectInstruction = document.getElementById('instruction');
 
   const compile = document.getElementById('compile');
   const btn = document.getElementById('btn')
@@ -54,21 +58,23 @@ const runLunaAddition = async () => {
 
 
   btn.setAttribute('disabled', true)
-  const input = `(module
-  (func (export "addNumbers") (param i32 i32) (result i32)
-    local.get 0
-    local.get 1
-    i32.add)
-)
-`
 
-
-  const editor = CodeMirror(codeContainer, {
-    value: input,
+  let editor = CodeMirror(codeContainer, {
+    value: defaultText(selectInstruction),
     mode:  "wast",
     lineNumbers: true,
   });
 
+  // Change editor content based on selected mode
+  selectInstruction.onchange = (e) => {
+    editor.setValue(defaultText(selectInstruction));
+    // Hide second input on const
+    if (e.target.value === CONST_MODE) {
+      input2.style.display = 'none';
+      label2.style.display = 'none';
+    }
+  }
+
   compile.addEventListener('click', async () => {
     moduleContainer.innerHTML = ""
     const textContent = editor.getValue()

example/js/inputDefaultText.js

@@ -0,0 +1,47 @@
+import { ADDITION_MODE, CONST_MODE, DIVISION_MODE, MULTIPLICATION_MODE, SUBTRACTION_MODE } from "./texts/texts.js"
+
+export const defaultText = (select) => {
+    const instruction = select.value
+    switch (instruction) {
+        case ADDITION_MODE:
+            return `(module
+  (func (export "addNumbers") (param i32 i32) (result i32)
+    local.get 0
+    local.get 1
+    i32.add)
+)
+`
+        case SUBTRACTION_MODE:
+            return `(module
+  (func (export "subtractNumbers") (param i32 i32) (result i32)
+    local.get 0
+    local.get 1
+    i32.sub)
+)
+`
+        case MULTIPLICATION_MODE:
+            return `(module
+  (func (export "multiplyNumbers") (param i32 i32) (result i32)
+    local.get 0
+    local.get 1
+    i32.mul)
+)
+`
+        case DIVISION_MODE:
+            return `(module
+  (func (export "divideNumbers") (param i32 i32) (result i32)
+    local.get 0
+    local.get 1
+    i32.div)
+)
+`
+        case CONST_MODE:
+            return `(module
+  (func (export "operationWithInternalVariable") (param i32 i32) (result i32)
+    local.get 0
+    i32.const 10
+    i32.add)
+)
+`
+    }
+}

example/js/texts/texts.js

@@ -0,0 +1,5 @@
+export const CONST_MODE = 'const';
+export const ADDITION_MODE = 'addition';
+export const SUBTRACTION_MODE = 'subtraction';
+export const MULTIPLICATION_MODE = 'multiplication';
+export const DIVISION_MODE = 'division';

runtime/runtime/start.js

@@ -3,7 +3,6 @@ import { invokeFunction } from "./invoker.js";
 
 const startAeonRuntime = (wasm, ...args) => {
     const ast = createAST(wasm);
-    console.log("FUCK", wasm)
     const [funcName, ...rest] = args;
     const params = rest;