(docs) iprove animation running example #408

jcubic · Nov 8, 2024 · b235894 · b235894
1 parent b9f12e1
commit b235894
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 4 deletions.
diff --git a/docs/src/components/Interpreter/examples.ts b/docs/src/components/Interpreter/examples.ts
@@ -137,9 +137,13 @@ const examples = [
 ;; but the return value is ignored so the terminal
 ;; is not paused when it find a Promise from
 ;; Terminal typing animation
-(ignore
-  (term.css "--background" "#2E2E2E")
-  (term.echo "This is LIPS Scheme" &(:typing #t)))`
+(ignore (term.animation
+          (lambda ()
+            (let (($button ($ ".run")))
+              ($button.attr "disabled" #t)
+              (term.css "--background" "#2E2E2E")
+              (term.echo "This is LIPS Scheme" &(:typing #t))
+              ($button.removeAttr "disabled")))))`
   },
   {
     description: 'Dynamic variables with R7RS parameterize',

diff --git a/docs/src/components/Interpreter/index.tsx b/docs/src/components/Interpreter/index.tsx
@@ -53,7 +53,7 @@ export default function Interpreter(): JSX.Element {
 
   useScripts(!globalThis.jQuery && [
     'https://cdn.jsdelivr.net/npm/jquery',
-    'https://cdn.jsdelivr.net/combine/npm/jquery.terminal/js/jquery.terminal.min.js,npm/js-polyfills/keyboard.js,npm/prismjs/prism.js,npm/jquery.terminal/js/prism.js,npm/prismjs/components/prism-scheme.min.js',
+    'https://cdn.jsdelivr.net/combine/npm/jquery.terminal@latest/js/jquery.terminal.min.js,npm/js-polyfills/keyboard.js,npm/prismjs/prism.js,npm/jquery.terminal@latest/js/prism.js,npm/prismjs/components/prism-scheme.min.js',
     'https://cdn.jsdelivr.net/gh/jcubic/lips@devel/lib/js/terminal.js',
     'https://cdn.jsdelivr.net/gh/jcubic/lips@devel/lib/js/prism.js'
   ]);

diff --git a/docs/src/components/Interpreter/styles.css b/docs/src/components/Interpreter/styles.css
@@ -210,6 +210,10 @@ body.full-screen .term {
     transition: transform 100ms linear;
     z-index: 100;
 }
+.run[disabled] {
+    opacity: 0.5;
+    cursor: not-allowed;
+}
 .run:active {
     transform: translate(-100%, 1px);
 }