paulhorn/sqlite
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Split the fiddle JS code into separate pre-/post-init files to simplify editing. emcc will combine these into the final fiddle.js, so the number of output deliverables does not change.

Browse Source 
FossilOrigin-Name: d3d8ea011868bcfa11bb3fe2db78eea6e77ac1005534d9c091f9a81e03f0a7e6
This commit is contained in:
stephan
2022-05-19 09:55:14 +00:00
parent b8a2b20509
commit 0fb074ab61
6 changed files with 211 additions and 178 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Makefile.in
+4 -1
View File
@@ -1535,7 +1535,10 @@ emcc_flags = $(emcc_opt) \
-sEXPORTED_RUNTIME_METHODS=ccall,cwrap \
-sEXPORTED_FUNCTIONS=_fiddle_exec \
-sEXIT_RUNTIME=1 \
--pre-js $(fiddle_dir)/module-pre.js \
--post-js $(fiddle_dir)/module-post.js \
--shell-file $(fiddle_tmpl)
$(fiddle_html): Makefile sqlite3.c shell.c $(fiddle_tmpl)
$(fiddle_html): Makefile sqlite3.c shell.c $(fiddle_tmpl) \
$(fiddle_dir)/module-pre.js $(fiddle_dir)/module-post.js
emcc -o $@ $(emcc_flags) sqlite3.c shell.c
fiddle: $(fiddle_html)
ext/fiddle/fiddle.in.html
+10 -169
View File
@@ -170,179 +170,20 @@ SELECT * FROM t;</textarea>
</li>
</ul>
</div><!-- #notes-caveats -->
<script type='text/javascript'>
(function(){
/* An object for propagating certain config state between our
JS code and the WASM module. */
const config = {
/* If true, the Module.print() impl will auto-scroll
the output widget to the bottom when it receives output,
else it won't. */
autoScrollOutput: true,
/* If true, the output area will be cleared before each
command is run, else it will not. */
autoClearOutput: false
};
/**
Callback for the emscripten module init process, gets
passed the module object after all parts of the module
have been loaded and initialized.
*/
const doAppSetup = function(Module) {
const taInput = document.querySelector('#input');
const btnClearIn = document.querySelector('#btn-clear');
document.querySelectorAll('button').forEach(function(e){
e.removeAttribute('disabled');
});
btnClearIn.addEventListener('click',function(){
taInput.value = '';
},false);
// Ctrl-enter and shift-enter both run the current SQL.
taInput.addEventListener('keydown',function(ev){
if((ev.ctrlKey || ev.shiftKey) && 13 === ev.keyCode){
ev.preventDefault();
ev.stopPropagation();
btnRun.click();
}
}, false);
const taOutput = document.querySelector('#output');
const btnClearOut = document.querySelector('#btn-clear-output');
btnClearOut.addEventListener('click',function(){
taOutput.value = '';
},false);
/* Sends the given text to the shell. If it's null or empty, this
is a no-op except that the very first call will initialize the
db and output an informational header. */
const doExec = function f(sql){
if(!f._) f._ = Module.cwrap('fiddle_exec', null, ['string']);
if(Module._isDead){
Module.printErr("shell module has exit()ed. Cannot run SQL.");
return;
}
if(config.autoClearOutput) taOutput.value='';
f._(sql);
};
const btnRun = document.querySelector('#btn-run');
btnRun.addEventListener('click',function(){
const sql = taInput.value.trim();
if(sql){
doExec(sql);
}
},false);
doExec(null)/*sets up the db and outputs the header*/;
<!-- Maintenance notes:
document.querySelector('#opt-cb-sbs')
.addEventListener('change', function(){
document.querySelector('#main-wrapper').classList[
this.checked ? 'add' : 'remove'
]('side-by-side');
}, false);
document.querySelector('#btn-notes-caveats')
.addEventListener('click', function(){
document.querySelector('#notes-caveats').remove();
}, false);
- emscripten module init goes is in fiddle-pre.js and gets
prepended to the generated script code.
/* For each checkbox with data-config=X, set up a binding to
config[X]. */
document.querySelectorAll('input[type=checkbox][data-config]')
.forEach(function(e){
e.checked = !!config[e.dataset.config];
e.addEventListener('change', function(){
config[this.dataset.config] = this.checked;
}, false);
});
- App-specific code is in fiddle-post.js and gets appended to
the generated script code.
/* For each button with data-cmd=X, map a click handler which
calls doExec(X). */
const cmdClick = function(){doExec(this.dataset.cmd);};
document.querySelectorAll('button[data-cmd]').forEach(
e => e.addEventListener('click', cmdClick, false)
);
};
- 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.
/**
What follows is part of the emscripten core setup. Do not
modify without understanding what it's doing...
*/
const statusElement = document.getElementById('status');
const progressElement = document.getElementById('progress');
const spinnerElement = document.getElementById('spinner');
const Module = window.Module = {
preRun: [],
postRun: [],
onRuntimeInitialized: function(){
doAppSetup(this);
},
print: (function f() {
if(!f._){
f._ = document.getElementById('output');
}
f._.value = ''; // clear browser cache
return function(text) {
if(arguments.length > 1) text = Array.prototype.slice.call(arguments).join(' ');
// These replacements are necessary if you render to raw HTML
//text = text.replace(/&/g, "&amp;");
//text = text.replace(/</g, "&lt;");
//text = text.replace(/>/g, "&gt;");
//text = text.replace('\n', '<br>', 'g');
//console.log("arguments",arguments);
console.log(text);
f._.value += text + "\n";
if(config.autoScrollOutput){
f._.scrollTop = f._.scrollHeight;
}
};
})(),
setStatus: function f(text) {
if(!f.last) f.last = { time: Date.now(), text: '' };
if(text === f.last.text) return;
const m = text.match(/([^(]+)\((\d+(\.\d+)?)\/(\d+)\)/);
const now = Date.now();
if(m && now - f.last.time < 30) return; // if this is a progress update, skip it if too soon
f.last.time = now;
f.last.text = text;
if(m) {
text = m[1];
progressElement.value = parseInt(m[2])*100;
progressElement.max = parseInt(m[4])*100;
progressElement.hidden = false;
spinnerElement.hidden = false;
} else {
progressElement.value = null;
progressElement.max = null;
progressElement.hidden = true;
if(!text) spinnerElement.hidden = true;
}
statusElement.innerHTML = text;
},
totalDependencies: 0,
monitorRunDependencies: function(left) {
this.totalDependencies = Math.max(this.totalDependencies, left);
this.setStatus(left
? ('Preparing... (' + (this.totalDependencies-left)
+ '/' + this.totalDependencies + ')')
: 'All downloads complete.');
}
};
Module.printErr = Module.print/*capture stderr output*/;
Module.setStatus('Downloading...');
window.onerror = function(/*message, source, lineno, colno, error*/) {
const err = arguments[4];
if(err && 'ExitStatus'==err.name){
Module._isDead = true;
Module.printErr("FATAL ERROR:", err.message);
Module.printErr("Restarting the app requires reloading the page.");
const taOutput = document.querySelector('#output');
if(taOutput) taOutput.classList.add('error');
}
Module.setStatus('Exception thrown, see JavaScript console');
spinnerElement.style.display = 'none';
Module.setStatus = function(text) {
if(text) console.error('[post-exception status] ' + text);
};
};
})();
</script>
-->
{{{ SCRIPT }}}
</body>
</html>
ext/fiddle/module-post.js
+87
View File
@@ -0,0 +1,87 @@
/* 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
init is finished, Module.onRuntimeInitialized() will be
triggered. All app-level init code should go into that callback or
be triggered via it. Calling wasm-bound functions before that
callback is run will trigger an assertion in the wasm environment.
*/
window.Module.onRuntimeInitialized = function(){
'use strict';
const Module = window.Module /* wasm module as set up by emscripten */;
delete Module.onRuntimeInitialized;
const taInput = document.querySelector('#input');
const btnClearIn = document.querySelector('#btn-clear');
document.querySelectorAll('button').forEach(function(e){
e.removeAttribute('disabled');
});
btnClearIn.addEventListener('click',function(){
taInput.value = '';
},false);
// Ctrl-enter and shift-enter both run the current SQL.
taInput.addEventListener('keydown',function(ev){
if((ev.ctrlKey || ev.shiftKey) && 13 === ev.keyCode){
ev.preventDefault();
ev.stopPropagation();
btnRun.click();
}
}, false);
const taOutput = document.querySelector('#output');
const btnClearOut = document.querySelector('#btn-clear-output');
btnClearOut.addEventListener('click',function(){
taOutput.value = '';
},false);
/* Sends the given text to the shell. If it's null or empty, this
is a no-op except that the very first call will initialize the
db and output an informational header. */
const doExec = function f(sql){
if(!f._) f._ = Module.cwrap('fiddle_exec', null, ['string']);
if(Module._isDead){
Module.printErr("shell module has exit()ed. Cannot run SQL.");
return;
}
if(Module.config.autoClearOutput) taOutput.value='';
f._(sql);
};
const btnRun = document.querySelector('#btn-run');
btnRun.addEventListener('click',function(){
const sql = taInput.value.trim();
if(sql){
doExec(sql);
}
},false);
document.querySelector('#opt-cb-sbs')
.addEventListener('change', function(){
document.querySelector('#main-wrapper').classList[
this.checked ? 'add' : 'remove'
]('side-by-side');
}, false);
document.querySelector('#btn-notes-caveats')
.addEventListener('click', function(){
document.querySelector('#notes-caveats').remove();
}, false);
/* For each checkbox with data-config=X, set up a binding to
Module.config[X]. */
document.querySelectorAll('input[type=checkbox][data-config]')
.forEach(function(e){
e.checked = !!Module.config[e.dataset.config];
e.addEventListener('change', function(){
Module.config[this.dataset.config] = this.checked;
}, false);
});
/* For each button with data-cmd=X, map a click handler which
calls doExec(X). */
const cmdClick = function(){doExec(this.dataset.cmd);};
document.querySelectorAll('button[data-cmd]').forEach(
e => e.addEventListener('click', cmdClick, false)
);
doExec(null)/*sets up the db and outputs the header*/;
};
ext/fiddle/module-pre.js
+100
View File
@@ -0,0 +1,100 @@
/* This is the --pre-js file for emcc. It gets prepended to the
generated fiddle.js. It should contain only code which is relevant
to the setup and initialization of the wasm module. */
(function(){
'use strict';
/**
What follows is part of the emscripten core setup. Do not
modify it without understanding what it's doing.
*/
const statusElement = document.getElementById('status');
const progressElement = document.getElementById('progress');
const spinnerElement = document.getElementById('spinner');
const Module = window.Module = {
/* Config object. Referenced by certain Module methods and
app-level code. */
config: {
/* If true, the Module.print() impl will auto-scroll
the output widget to the bottom when it receives output,
else it won't. */
autoScrollOutput: true,
/* If true, the output area will be cleared before each
command is run, else it will not. */
autoClearOutput: false,
/* If true, Module.print() will echo its output to
the console, in addition to its normal output widget. */
printToConsole: false,
},
preRun: [],
postRun: [],
//onRuntimeInitialized: function(){},
print: (function f() {
if(!f._){
f._ = document.getElementById('output');
}
f._.value = ''; // clear browser cache
return function(text) {
if(arguments.length > 1) text = Array.prototype.slice.call(arguments).join(' ');
// These replacements are necessary if you render to raw HTML
//text = text.replace(/&/g, "&amp;");
//text = text.replace(/</g, "&lt;");
//text = text.replace(/>/g, "&gt;");
//text = text.replace('\n', '<br>', 'g');
//console.log("arguments",arguments);
if(window.Module.config.printToConsole) console.log(text);
f._.value += text + "\n";
if(window.Module.config.autoScrollOutput){
f._.scrollTop = f._.scrollHeight;
}
};
})(),
setStatus: function f(text) {
if(!f.last) f.last = { time: Date.now(), text: '' };
if(text === f.last.text) return;
const m = text.match(/([^(]+)\((\d+(\.\d+)?)\/(\d+)\)/);
const now = Date.now();
if(m && now - f.last.time < 30) return; // if this is a progress update, skip it if too soon
f.last.time = now;
f.last.text = text;
if(m) {
text = m[1];
progressElement.value = parseInt(m[2])*100;
progressElement.max = parseInt(m[4])*100;
progressElement.hidden = false;
spinnerElement.hidden = false;
} else {
progressElement.value = null;
progressElement.max = null;
progressElement.hidden = true;
if(!text) spinnerElement.hidden = true;
}
statusElement.innerHTML = text;
},
totalDependencies: 0,
monitorRunDependencies: function(left) {
this.totalDependencies = Math.max(this.totalDependencies, left);
this.setStatus(left
? ('Preparing... (' + (this.totalDependencies-left)
+ '/' + this.totalDependencies + ')')
: 'All downloads complete.');
}
};
Module.printErr = Module.print/*capture stderr output*/;
Module.setStatus('Downloading...');
window.onerror = function(/*message, source, lineno, colno, error*/) {
const err = arguments[4];
if(err && 'ExitStatus'==err.name){
Module._isDead = true;
Module.printErr("FATAL ERROR:", err.message);
Module.printErr("Restarting the app requires reloading the page.");
const taOutput = document.querySelector('#output');
if(taOutput) taOutput.classList.add('error');
}
Module.setStatus('Exception thrown, see JavaScript console');
spinnerElement.style.display = 'none';
Module.setStatus = function(text) {
if(text) console.error('[post-exception status] ' + text);
};
};
})();
manifest
+9 -7
View File
@@ -1,9 +1,9 @@
C Added\san\soption\sto\sauto-clear\sthe\soutput\sarea\sbefore\ssubmitting\sthe\sinput.\sExperimentally\sinverted\sthe\scolors\sin\sthe\sinput/output\sareas.
D 2022-05-19T09:22:16.127
C Split\sthe\sfiddle\sJS\scode\sinto\sseparate\spre-/post-init\sfiles\sto\ssimplify\sediting.\semcc\swill\scombine\sthese\sinto\sthe\sfinal\sfiddle.js,\sso\sthe\snumber\sof\soutput\sdeliverables\sdoes\snot\schange.
D 2022-05-19T09:55:14.804
F .fossil-settings/empty-dirs dbb81e8fc0401ac46a1491ab34a7f2c7c0452f2f06b54ebb845d024ca8283ef1
F .fossil-settings/ignore-glob 35175cdfcf539b2318cb04a9901442804be81cd677d8b889fcc9149c21f239ea
F LICENSE.md df5091916dbb40e6e9686186587125e1b2ff51f022cc334e886c19a0e9982724
F Makefile.in 92890acbab78c76f32ebb1ad50b961c3fc413f7b05052663c8b17d1b7f74a697
F Makefile.in 7835a8858609cd5f40b84e86cca78bd2c25c54f2e8b22fa76b16acf83509cb63
F Makefile.linux-gcc f609543700659711fbd230eced1f01353117621dccae7b9fb70daa64236c5241
F Makefile.msc b28a8a7a977e7312f6859f560348e1eb110c21bd6cf9fab0d16537c0a514eef3
F README.md 8b8df9ca852aeac4864eb1e400002633ee6db84065bd01b78c33817f97d31f5e
@@ -56,8 +56,10 @@ F ext/expert/sqlite3expert.c 6ca30d73b9ed75bd56d6e0d7f2c962d2affaa72c505458619d0
F ext/expert/sqlite3expert.h ca81efc2679a92373a13a3e76a6138d0310e32be53d6c3bfaedabd158ea8969b
F ext/expert/test_expert.c d56c194b769bdc90cf829a14c9ecbc1edca9c850b837a4d0b13be14095c32a72
F ext/fiddle/Makefile ea647919e6ac4b50edde1490f60ee87e8ccd75141e4aa650718c6f28eb323bbc
F ext/fiddle/fiddle.in.html 05192302452a1ff410a12de04d10802c89fd90c67d2e7a0983cca599b78d802d
F ext/fiddle/fiddle.in.html 69f8eeb8dc22cbaca2c890ed689d65dd8ad00e896b1a29caae8a22893fc51d8e
F ext/fiddle/index.md d9c1c308d8074341bc3b11d1d39073cd77754cb3ca9aeb949f23fdd8323d81cf
F ext/fiddle/module-post.js 8d62f2199cb367267b7799f259c43673f43578f788f30e106a17b2eccbc8a918
F ext/fiddle/module-pre.js 31661050c461fa05fbaa564e5369795eed8957458ea81fd2038157d852ff93c8
F ext/fts1/README.txt 20ac73b006a70bcfd80069bdaf59214b6cf1db5e
F ext/fts1/ft_hash.c 3927bd880e65329bdc6f506555b228b28924921b
F ext/fts1/ft_hash.h 06df7bba40dadd19597aa400a875dbc2fed705ea
@@ -1957,8 +1959,8 @@ F vsixtest/vsixtest.tcl 6a9a6ab600c25a91a7acc6293828957a386a8a93
F vsixtest/vsixtest.vcxproj.data 2ed517e100c66dc455b492e1a33350c1b20fbcdc
F vsixtest/vsixtest.vcxproj.filters 37e51ffedcdb064aad6ff33b6148725226cd608e
F vsixtest/vsixtest_TemporaryKey.pfx e5b1b036facdb453873e7084e1cae9102ccc67a0
P 6661d60527820417bbfd01c782d242c5190252ea703fc6f56376537d5c8f6a1e
R 1ba355c6c9a1901c14ddac3fca9f90fb
P 1a1e4e7fdbd0ec61218c3a311164086316d825181f3fc1c1ec235b63488746ef
R 845cc95de5a1a485fbec7d915e3ef826
U stephan
Z 350abcb9556383a2d29c463740d62bfd
Z 439fa3de2a51242095eb61aca5099555
# Remove this line to create a well-formed Fossil manifest.
manifest.uuid
+1 -1
View File
@@ -1 +1 @@
1a1e4e7fdbd0ec61218c3a311164086316d825181f3fc1c1ec235b63488746ef
d3d8ea011868bcfa11bb3fe2db78eea6e77ac1005534d9c091f9a81e03f0a7e6