sqlite3 fiddle

From: stephan Date: Thu, 19 May 2022 15:58:13 +0000 (+0000) Subject: Numerous layout tweaks, the most significant being that the layout now adapts to... X-Git-Tag: version-3.39.0~132^2~4 X-Git-Url: http://git.ipfire.org/?a=commitdiff_plain;h=38240592ad483954d9d10055dec39ebd1af504ce;p=thirdparty%2Fsqlite.git Numerous layout tweaks, the most significant being that the layout now adapts to the window size. Swapped positions of the input/output areas. This version supports, by uncommenting a few bits, a jquery.terminal-based view but alternatives to that 300kb dependency are still under investigation. FossilOrigin-Name: 1aad3642c9fc14c25223628a309d84decc8d73a123e42d6efdc36d855b5b0666 --- diff --git a/ext/fiddle/fiddle.in.html b/ext/fiddle/fiddle.in.html index b78019565a..a14bf5b4b4 100644 --- a/ext/fiddle/fiddle.in.html +++ b/ext/fiddle/fiddle.in.html @@ -4,6 +4,8 @@ sqlite3 fiddle + -

sqlite3 fiddle

Initializing app...

@@ -123,75 +154,56 @@

- Options -

- - - Side-by-side - - - - Auto-scroll output - - - - Auto-clear output - -

+
+    <div id='jqterminal' class='app-view hidden initially-hidden'>
+      This is a placeholder for a terminal-like view.
+    </div>
+
+    <div id='view-split' class='app-view initially-hidden'>
+      <fieldset class='options'>
+        <legend>Options</legend>
+        <div class=''>
+          <span class='labeled-input'>
+            <input type='checkbox' id='opt-cb-sbs' checked>
+            <label for='opt-cb-sbs'>Side-by-side</label>
+          </span>
+          <span class='labeled-input'>
+            <input type='checkbox' id='opt-cb-autoscroll'
+                   data-config='autoScrollOutput'>
+            <label for='opt-cb-autoscroll'>Auto-scroll output</label>
+          </span>
+          <span class='labeled-input'>
+            <input type='checkbox' id='opt-cb-autoclear'
+                   data-config='autoClearOutput'>
+            <label for='opt-cb-autoclear'>Auto-clear output</label>
+          </span>
+        </div>
+      </fieldset>
+      <div id='main-wrapper' class='side-by-side'>
+        <div class='ta-wrapper input'>
+          <textarea id="input"
+                    placeholder="Shell input. Ctrl-enter/shift-enter runs it.">
 -- Use ctrl-enter or shift-enter to execute SQL
 .nullvalue NULL
 .mode box
 CREATE TABLE t(a,b);
 INSERT INTO t(a,b) VALUES('abc',123),('def',456),(NULL,789),('ghi',012);
 SELECT * FROM t;

- - - +

+ + + +

- -

- +

+ +

- Notes and Caveats - -

- This JavaScript application runs a C application which has been - compiled into WASM (Web Assembly). As such, it has certain - limitations. Those include, but are not limited to: -

It cannot recover after a call to - exit(). If the native code triggers - an exit, reloading the page is the only way to restart - the application. (Making the app restartable without reloading - the page would require significant surgery in the C code.) -
It cannot perform any file I/O, and running - any command which attempts to do so might trigger an - exit(). -
A number of dot-commands available in the CLI shell are - explicitly removed from this version of the shell. -