Merge pull request #17 from IFB-ElixirFr/newLangages

Add ruby

nuxt.config.ts

@@ -28,6 +28,9 @@ export default defineNuxtConfig({
         {
           src: "https://cdn.jsdelivr.net/pyodide/v0.23.4/full/pyodide.js",
         },
+        {
+          src: "https://cdn.jsdelivr.net/npm/@ruby/wasm-wasi@latest/dist/browser.umd.js",
+        },
       ],
       link: [
         { rel: 'icon', type: 'image/x-icon', href: 'https://www.france-bioinformatique.fr/wp-content/uploads/logo-ifb-couleur.svg' }

package.json

@@ -32,6 +32,8 @@
     "nuxt-content-assets": "^1.3.2",
     "pyodide": "^0.23.4",
     "quickjs-emscripten": "^0.23.0",
+    "ruby-3_2-wasm-wasi": "^2.1.0",
+    "ruby-head-wasm-wasi": "^2.1.0",
     "sass": "^1.64.1",
     "split.js": "^1.6.5",
     "vite-plugin-vuetify": "^1.0.2",

pages/[lang]/[...slug].vue

@@ -102,6 +102,14 @@ import Split from "split.js";
 
 let tempLineArray = [];
 
+let logBackup = console.log;
+let logMessages = [];
+
+console.log = function () {
+  logMessages.push.apply(logMessages, arguments);
+  logBackup.apply(console, arguments);
+};
+
 export default {
   data() {
     return {
@@ -154,6 +162,19 @@ export default {
         stdout: (line) => document.getElementById("out").append(line + "\n"),
         stderr: (line) => document.getElementById("out").append(line + "\n"),
       });
+    } else if (lang == "ruby") {
+      const { DefaultRubyVM } = window["ruby-wasm-wasi"];
+      // Fetch and instantiate WebAssembly binary
+      const response = await fetch(
+        //      Tips: Replace the binary with debug info if you want symbolicated stack trace.
+        //      (only nightly release for now)
+        //      "https://cdn.jsdelivr.net/npm/ruby-head-wasm-wasi@next/dist/ruby.debug+stdlib.wasm"
+        "https://cdn.jsdelivr.net/npm/ruby-head-wasm-wasi@latest/dist/ruby.wasm"
+      );
+      const buffer = await response.arrayBuffer();
+      const module = await WebAssembly.compile(buffer);
+      const { vm } = await DefaultRubyVM(module);
+      webConsole = vm;
     }
 
     // Get Tuto pages
@@ -190,7 +211,17 @@ print("Welcome to the Pyodide terminal emulator 🐍\\n" + BANNER)
       );
     } else if (this.lang == "r") {
       await this.webConsole.run();
+    } else if (this.lang == "ruby") {
+      var pos = logMessages.length;
+
+      this.webConsole.printVersion();
+      var temp = logMessages;
+      for (let i = pos; i < temp.length; i++) {
+        document.getElementById("out").append(temp[i] + "\n");
+      }
+      temp = [];
     }
+
     this.data = this.tutosList[this.step];
     Split(["#split-0", "#split-1"], {
       direction: "vertical",
@@ -242,6 +273,19 @@ print("Welcome to the Pyodide terminal emulator 🐍\\n" + BANNER)
         this.updateCanvas();
       } else if (this.lang == "js") {
         this.runJS();
+      } else if ((this.lang = "ruby")) {
+        var pos = logMessages.length;
+        document.getElementById("out").append(this.command + "\n");
+        try {
+          this.webConsole.eval(this.command);
+        } catch (err) {
+          document.getElementById("out").append(err + "\n");
+        }
+        var temp = logMessages;
+        for (let i = pos; i < temp.length; i++) {
+          document.getElementById("out").append(temp[i] + "\n");
+        }
+        temp = [];
       }
 
       this.command = "";
@@ -320,6 +364,19 @@ print("Welcome to the Pyodide terminal emulator 🐍\\n" + BANNER)
           this.runPython();
         } else if (this.lang == "js") {
           this.runJS();
+        } else if ((this.lang = "ruby")) {
+          var pos = logMessages.length;
+          document.getElementById("out").append(this.command + "\n");
+          try {
+            this.webConsole.eval(this.command);
+          } catch (err) {
+            document.getElementById("out").append(err + "\n");
+          }
+          var temp = logMessages;
+          for (let i = pos; i < temp.length; i++) {
+            document.getElementById("out").append(temp[i] + "\n");
+          }
+          temp = [];
         }
         this.store.reset();
         var objDiv = document.getElementById("divConsole");

yarn.lock

@@ -840,6 +840,13 @@
     "estree-walker" "^2.0.2"
     "picomatch" "^2.3.1"
 
+"@ruby/wasm-wasi@^2.0.0":
+  "integrity" "sha512-0XlKcAEJhfzQsCifqNtDdICoPza5MEcSSKjINjtObY4BYumvOZ3qrLmn2uSixkhnPpl4cIt/EBw9KlXdbz5FBg=="
+  "resolved" "https://registry.npmjs.org/@ruby/wasm-wasi/-/wasm-wasi-2.1.0.tgz"
+  "version" "2.1.0"
+  dependencies:
+    "tslib" "^2.3.1"
+
 "@sideway/address@^4.1.3":
   "integrity" "sha512-7vwq+rOHVWjyXxVlR76Agnvhy8I9rpzjosTESvmhNeXOXdZZB15Fl+TI9x1SiHZH5Jv2wTGduSxFDIaq0m3DUw=="
   "resolved" "https://registry.npmjs.org/@sideway/address/-/address-4.1.4.tgz"
@@ -6134,6 +6141,20 @@
   optionalDependencies:
     "fsevents" "~2.3.2"
 
+"ruby-3_2-wasm-wasi@^2.1.0":
+  "integrity" "sha512-52wbP/vxaqeqX1LWvk4shrNBcwI5K7LP2XsSOkselPiggrnlp0m6aR/4kPzDqssa+D9xppbUOecB/4Ke2gmLXA=="
+  "resolved" "https://registry.npmjs.org/ruby-3_2-wasm-wasi/-/ruby-3_2-wasm-wasi-2.1.0.tgz"
+  "version" "2.1.0"
+  dependencies:
+    "@ruby/wasm-wasi" "^2.0.0"
+
+"ruby-head-wasm-wasi@^2.1.0":
+  "integrity" "sha512-WIEuSSTTJHyO0040fbX9eUw4QQ92RYarPfaIHG7SukDCHtUNYbwzRNhtoUmKWnXepVjWURFypB3iNnKaHu5Lpg=="
+  "resolved" "https://registry.npmjs.org/ruby-head-wasm-wasi/-/ruby-head-wasm-wasi-2.1.0.tgz"
+  "version" "2.1.0"
+  dependencies:
+    "@ruby/wasm-wasi" "^2.0.0"
+
 "run-applescript@^5.0.0":
   "integrity" "sha512-XcT5rBksx1QdIhlFOCtgZkB99ZEouFZ1E2Kc2LHqNW13U3/74YGdkQRmThTwxy4QIyookibDKYZOPqX//6BlAg=="
   "resolved" "https://registry.npmjs.org/run-applescript/-/run-applescript-5.0.0.tgz"
@@ -6749,7 +6770,7 @@
   "resolved" "https://registry.npmjs.org/trough/-/trough-2.1.0.tgz"
   "version" "2.1.0"
 
-"tslib@^2.0.1", "tslib@^2.1.0":
+"tslib@^2.0.1", "tslib@^2.1.0", "tslib@^2.3.1":
   "integrity" "sha512-t0hLfiEKfMUoqhG+U1oid7Pva4bbDPHYfJNiB7BiIjRkj1pyC++4N3huJfqY6aRH6VTB0rvtzQwjM4K6qpfOig=="
   "resolved" "https://registry.npmjs.org/tslib/-/tslib-2.6.1.tgz"
   "version" "2.6.1"