add abort function

Author: taisukef

DNCL3.js

@@ -12,9 +12,9 @@ export class DNCL3 {
   parseTokens(s) {
     return this.parser.parseTokens(s);
   }
-  run(maxloop) {
+  run(maxloop, signal) {
     this.runtime = new Runtime(this.ast, this.callbackoutput, this.callbackinput);
-    return this.runtime.run(maxloop);
+    return this.runtime.run(maxloop, signal);
   }
   getVars() {
     return this.runtime.getVars();

Runtime.js

@@ -1,3 +1,6 @@
+//import { sleep } from "https://js.sabae.cc/sleep.js";
+import { sleep } from "./sleep.js";
+
 const DEFAULT_MAX_LOOP = 1000;
 
 const isUpperAlphabet = (c) => "ABCDEFGHIJKLMNOPQRSTUVWXYZ".indexOf(c) >= 0;
@@ -67,6 +70,7 @@ export class Runtime {
     this.callbackoutput = callbackoutput;
     this.callbackinput = callbackinput;
     this.ast = ast;
+    this.pc = 0;
   }
   async getArrayIndex(ast, scope) {
     const prop = await this.calcExpression(ast, scope);
@@ -80,6 +84,10 @@ export class Runtime {
       ast.type == "Program" ? ast.body :
       ast.type == "SequenceExpression" ? ast.expressions : [ast];
     for (const cmd of body) {
+      this.checkAbort();
+      if (this.pc++ % 100 == 0) {
+        await sleep(1, this.signal);
+      }
       //console.log(cmd)
       if (cmd.type == "ExpressionStatement") {
         await this.runBlock(cmd.expression, scope);
@@ -221,8 +229,15 @@ export class Runtime {
       throw new Error(funcname + "の呼び出し回数が、" + this.maxloop + "回の繰り返し上限に達しました");
     }
   }
-  async run(maxloop = DEFAULT_MAX_LOOP) {
+  checkAbort() {
+    //console.log(this.signal?.aborted);
+    if (this.signal?.aborted) {
+      throw new Error("abort: ", this.signal.reason);
+    }
+  }
+  async run(maxloop = DEFAULT_MAX_LOOP, signal = null) {
     this.maxloop = parseInt(maxloop);
+    this.signal = signal;
     if (isNaN(this.maxloop)) throw new Error("maxloopが不正です");
     this.callcount = {};
     this.scope = new Scope();

index.html

@@ -6,6 +6,7 @@ <h1>DNCL3実行環境</h1>
 サンプル <select id=selexamples></select>
 <label><input type=checkbox id=chkvar checked>変数表示</label>
 <label><input type=checkbox id=chkmaxloop checked>繰り返し上限 <input id=inmaxloop value=1000></label>
+<button id=btnstop>STOP</button>
 <main>
 <div class=diveditor id=divprog></div>
 <div class=diveditor id=divrun></div>
@@ -91,10 +92,15 @@ <h1>DNCL3実行環境</h1>
   }
 };
 
-let bkval = null;
 let running = false;
+let abortctrl = null;
 const onchange = async () => {
-  if (running) return;
+  console.log("onchange", performance.now())
+  if (running) {
+    //abortctrl.abort();
+    return;
+  }
+  abortctrl = new AbortController();
   running = true;
   const src = prog.getValue();
   run.setValue("");
@@ -104,7 +110,10 @@ <h1>DNCL3実行環境</h1>
       run.setValue(run.getValue() + s + "\n");
     });
     const maxloop = chkmaxloop.checked ? inmaxloop.value : 0;
-    await dncl.run(maxloop);
+    btnstop.onclick = () => {
+      abortctrl.abort();
+    };
+    await dncl.run(maxloop, abortctrl.signal);
     if (chkvar.checked) {
       run.setValue(run.getValue() + "\nvars " + JSON.stringify(dncl.getVars(), null, 2) + "\n");
     }
@@ -113,15 +122,16 @@ <h1>DNCL3実行環境</h1>
     //ast.setValue(JSON.stringify(e, null, 2));
     run.setValue(run.getValue() + e.toString() + "\n");
   }
-  bkval = src;
   running = false;
 };
 
 //prog.onDidChangeModelContent = onchange; // なぜか初回のみ
+let bkval = null;
 setInterval(() => {
   const txt = prog.getValue();
   if (bkval == txt) return;
   onchange();
+  bkval = txt;
 }, 500);
 
 const data = await CSV.fetchJSON("examples.csv");

sleep.js

@@ -0,0 +1,16 @@
+export const sleep = (ms, signal) => {
+  return new Promise((resolve, reject) => {
+    let abortfunc;
+    const timer = setTimeout(() => {
+      resolve();
+      signal?.removeEventListener("abort", abortfunc);
+    }, ms);
+
+    abortfunc = () => {
+      clearTimeout(timer);
+      reject(new Error("sleep aborted"));
+      signal?.removeEventListener("abort", abortfunc);
+    };
+    signal?.addEventListener("abort", abortfunc);
+  });
+};