SQLite: Check-in [82b57f2e21]

Many hyperlinks are disabled.
Use anonymous login to enable hyperlinks.

Overview

Comment:	Add a terminal-style view to the fiddle app, based on jquery.terminal.
Downloads:	Tarball \| ZIP archive
Timelines:	family \| ancestors \| fiddle-terminal-view
Files:	files \| file ages \| folders
SHA3-256:	82b57f2e212128ac83af577c9fe0a19814c6771c058d04eadf7b54489c1ad55e
User & Date:	stephan 2022-05-20 13:27:57.777

Context

2022-05-20
13:27		Add a terminal-style view to the fiddle app, based on jquery.terminal. (Leaf check-in: 82b57f2e21 user: stephan tags: fiddle-terminal-view)
2022-05-19
22:04		#if'd out the '.nonce' and '.check' commends in WASM builds. (check-in: 326f79ea54 user: stephan tags: trunk)

Changes

Changes to Makefile.in.

Changes to ext/fiddle/fiddle.in.html.

Added ext/fiddle/jqterm/jqterm-bundle.min.js.

cannot compute difference between binary files

Added ext/fiddle/jqterm/jquery.terminal.min.css.

Changes to ext/fiddle/module-post.js.

Changes to ext/fiddle/module-pre.js.

1 2 3 4 5 6 ~~7 8~~ 9 10 11 12 13 14 15	<!doctype html> <html lang="en-us"> <head> <meta charset="utf-8"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>sqlite3 fiddle (experimental!)</title> ~~~~<!-- script src="jqterm/jqterm-bundle.min.js"></script>~~ <link rel="stylesheet" href="~~jqt~~e~~rm/jquery.terminal.min~~.css"/ -->~~ <style> /* emcscript-related styling, used during the intialization phase... / .emscripten { padding-right: 0; margin-left: auto; margin-right: auto; display: block; } div.emscripten { text-align: center; } div.emscripten_border { border: 1px solid black; } #spinner { overflow: visible; } #spinner > {	< \|	1 2 3 4 5 6 7 8 9 10 11 12 13 14	<!doctype html> <html lang="en-us"> <head> <meta charset="utf-8"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>sqlite3 fiddle (experimental!)</title> <link rel="stylesheet" href="fiddle.css"/> <style> /* emcscript-related styling, used during the intialization phase... / .emscripten { padding-right: 0; margin-left: auto; margin-right: auto; display: block; } div.emscripten { text-align: center; } div.emscripten_border { border: 1px solid black; } #spinner { overflow: visible; } #spinner > {
︙			︙
119 120 121 122 123 124 125 ~~126~~ 127 128 129 130 131 132 133	body.terminal-mode { max-height: calc(100% - 2em); display: flex; flex-direction: column; align-items: stretch; } ~~#jqterminal {~~ } .app-view { flex: 20 1 auto; } #titlebar { display: flex; justify-content: space-between;	\|	118 119 120 121 122 123 124 125 126 127 128 129 130 131 132	body.terminal-mode { max-height: calc(100% - 2em); display: flex; flex-direction: column; align-items: stretch; } #terminal { } .app-view { flex: 20 1 auto; } #titlebar { display: flex; justify-content: space-between;
︙			︙
151 152 153 154 155 156 157 ~~158~~ 159 160 161 162 163 164 165	</div> </figure> <div class="emscripten" id="status">Downloading...</div> <div class="emscripten"> <progress value="0" max="100" id="progress" hidden='1'></progress> </div> ~~<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=''>	\|	150 151 152 153 154 155 156 157 158 159 160 161 162 163 164	</div> </figure> <div class="emscripten" id="status">Downloading...</div> <div class="emscripten"> <progress value="0" max="100" id="progress" hidden='1'></progress> </div> <div id='terminal' 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=''>
︙			︙
213 214 215 216 217 218 219 ~~220~~ 221 222 ~~223~~ 224 ~~225 226~~ ~~227 228~~ 229 230 231 232 233	</div> </div> </div> </div> <!-- #view-split --> <!-- Maintenance notes: - emscripten module init goes is in module-pre.js and gets ~~prepended to the generated script code.~~ - App-specific code is in module-post.js and gets appended to ~~the generated script code.~~ ~~- The following placeholder (if you're reading this in ~~the~~ input template file) gets replaced by a generated~~ ~~~~amalgamation of:~~ module-pre.js, emcc-generated bootstrapping ~~code, and~~ module-post.js.~~ --> {{{ SCRIPT }}} </body> </html>	\| > \| \| \| > \| \|	212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234	</div> </div> </div> </div> <!-- #view-split --> <!-- Maintenance notes: - emscripten module init goes is in module-pre.js and gets prepended to the generated script code by the compilation process. - App-specific code is in module-post.js and gets appended to the generated script code by the compilation process. - The following SCRIPT placeholder (if you're reading this in the input template file) gets replaced by a generated amalgamation of: (possibly) some imported 3rd-party JS code, module-pre.js, emcc-generated bootstrapping code, and module-post.js. --> {{{ SCRIPT }}} </body> </html>

1 2 3 4 5 6 7	/* This is the --post-js file for emcc. It gets appended to the generated fiddle.js. It should contain all app-level code. Maintenance achtung: do not call any wasm-bound functions from outside of the onRuntimeInitialized() function. They are not permitted to be called until after the module init is complete, which does not happen until after this file is processed. Once that	> > > > > > > >	1 2 3 4 5 6 7 8 9 10 11 12 13 14 15	/************************************************************************ The author disclaims copyright to this source code. In place of a legal notice, here is a blessing: * May you do good and not evil. * May you find forgiveness for yourself and forgive others. * May you share freely, never taking more than you give. ***********************************************************************/ / This is the --post-js file for emcc. It gets appended to the generated fiddle.js. It should contain all app-level code. Maintenance achtung: do not call any wasm-bound functions from outside of the onRuntimeInitialized() function. They are not permitted to be called until after the module init is complete, which does not happen until after this file is processed. Once that
︙			︙
206 207 208 209 210 211 212 ~~213~~ 214 215 216 217 218 219 220 ~~221~~ 222 223 224 225 226 227 228	window.addEventListener('resize', debounce(resized, 250), false); return resized; })(); Module.print(null/clear any output generated by the init process/); if(window.jQuery && window.jQuery.terminal){ /* Set up the terminal-style view... / ~~const eTerm = window.jQuery('#jqterminal').empty();~~ Module.jqTerm = eTerm.terminal(doExec,{ prompt: 'sqlite> ', greetings: false / note that the docs incorrectly call this 'greeting' / }); //Module.jqTerm.clear(/remove the "greeting"/); / Set up a button to toggle the views... */ const head = E('header#titlebar'); ~~const btnToggleView = jQue~~ry("<~~button~~>Toggle View</button>")[0]~~;~~ head.appendChild(btnToggleView); btnToggleView.addEventListener('click',function f(){ EAll('.app-view').forEach(e=>e.classList.toggle('hidden')); if(document.body.classList.toggle('terminal-mode')){ ForceResizeKludge(); } }, false);	\| \| >	214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237	window.addEventListener('resize', debounce(resized, 250), false); return resized; })(); Module.print(null/clear any output generated by the init process/); if(window.jQuery && window.jQuery.terminal){ /* Set up the terminal-style view... / const eTerm = window.jQuery('#terminal').empty(); Module.jqTerm = eTerm.terminal(doExec,{ prompt: 'sqlite> ', greetings: false / note that the docs incorrectly call this 'greeting' / }); //Module.jqTerm.clear(/remove the "greeting"/); / Set up a button to toggle the views... */ const head = E('header#titlebar'); const btnToggleView = document.createElement('button'); btnToggleView.appendChild(document.createTextNode("Toggle View")); head.appendChild(btnToggleView); btnToggleView.addEventListener('click',function f(){ EAll('.app-view').forEach(e=>e.classList.toggle('hidden')); if(document.body.classList.toggle('terminal-mode')){ ForceResizeKludge(); } }, false);
︙			︙