More YosysJS stuff

This commit is contained in:
Clifford Wolf 2015-02-16 13:23:54 +01:00
parent 33e80b96c7
commit 3e5e9a3889
5 changed files with 83 additions and 105 deletions

2
.gitignore vendored
View File

@ -22,6 +22,6 @@
/yosys-filterlib.exe /yosys-filterlib.exe
/kernel/version_*.cc /kernel/version_*.cc
/share /share
/libyosys
/yosys-win32-mxebin-* /yosys-win32-mxebin-*
/yosys-win32-vcxsrc-* /yosys-win32-vcxsrc-*
/yosysjs-*

View File

@ -73,6 +73,8 @@ int getopt(int argc, char **argv, const char *optstring)
USING_YOSYS_NAMESPACE USING_YOSYS_NAMESPACE
#ifdef EMSCRIPTEN #ifdef EMSCRIPTEN
# include <sys/stat.h>
# include <sys/types.h>
extern "C" int main(int, char**); extern "C" int main(int, char**);
extern "C" void run(const char*); extern "C" void run(const char*);
@ -80,6 +82,8 @@ extern "C" const char *prompt();
int main(int, char**) int main(int, char**)
{ {
mkdir("/work", 0777);
chdir("/work");
log_files.push_back(stdout); log_files.push_back(stdout);
log_error_stderr = true; log_error_stderr = true;
yosys_banner(); yosys_banner();

View File

@ -1,16 +1,34 @@
<html><head> <html><head>
<title>YosysJS Example Application #01</title> <title>YosysJS Example Application #01</title>
<script type="text/javascript" src="yosysjs.js"></script>
</head><body onload="document.getElementById('command').focus()"> </head><body onload="document.getElementById('command').focus()">
<h1>YosysJS Example Application #01</h1> <h1>YosysJS Example Application #01</h1>
<table width="100%"><tr><td><div id="tabs"></div></td><td align="right"><tt>[ <span onclick="load_example()">load example</span> ]</tt></td></tr></table> <table width="100%"><tr><td><div id="tabs"></div></td><td align="right"><tt>[ <span onclick="load_example()">load example</span> ]</tt></td></tr></table>
<iframe id="viz" style="display: none"><script type="text/javascript" src="viz.js"></script></iframe> <svg id="svg" style="display: none; position: absolute; padding: 10px; width: calc(100% - 40px);"></svg>
<svg id="svg" style="display: none; position: absolute; padding: 10px; width: 100%; height: 80%;"></svg>
<div><textarea id="output" style="width: 100%" rows="30" cols="100"></textarea></div> <div><textarea id="output" style="width: 100%" rows="30" cols="100"></textarea></div>
<div id="wait" style="display: block"><br/><b><span id="waitmsg">Loading...</span></b></div> <div id="wait" style="display: block"><br/><b><span id="waitmsg">Loading...</span></b></div>
<div id="input" style="display: none"><form onsubmit="window.setTimeout(run_command); return false"><tt><span id="prompt"> <div id="input" style="display: none"><form onsubmit="window.setTimeout(run_command); return false"><br/><tt><span id="prompt">
</span></tt><input id="command" type="text" onkeydown="history(event)" style="font-family: monospace; font-weight: bold;" size="100"></form></div> </span></tt><input id="command" type="text" onkeydown="history(event)" style="font-family: monospace; font-weight: bold;" size="100"></form></div>
<script type='text/javascript'> <script type='text/javascript'>
var got_log_messages = false; function print_output(text) {
var el = document.getElementById('output');
el.value += text + "\n";
}
YosysJS.load_viz();
var ys = YosysJS.create("", function() {
print_output(ys.print_buffer);
document.getElementById('wait').style.display = 'none';
document.getElementById('input').style.display = 'block';
document.getElementById('waitmsg').textContent = 'Waiting for yosys.js...';
document.getElementById('prompt').textContent = ys.prompt();
update_tabs();
});
ys.echo = true;
var history_log = []; var history_log = [];
var history_index = 0; var history_index = 0;
var history_bak = ""; var history_bak = "";
@ -34,42 +52,12 @@
} }
} }
var Module = {
print: (function() {
var element = document.getElementById('output');
if (element) element.value = ''; // clear browser cache
return function(text) {
if (!got_log_messages) {
window.setTimeout(startup, 50);
got_log_messages = true;
}
if (element && typeof(text) != "number") {
element.value += text + "\n";
element.scrollTop = element.scrollHeight; // focus on bottom
}
};
})(),
printErr: (function() {
var element = document.getElementById('output');
if (element) element.value = ''; // clear browser cache
return function(text) {
if (element && typeof(text) != "number") {
console.log(text);
if (got_log_messages) {
element.value += text + "\n";
element.scrollTop = element.scrollHeight; // focus on bottom
}
}
};
})(),
};
var current_file = ""; var current_file = "";
var console_messages = ""; var console_messages = "";
var svg_cache = { }; var svg_cache = { };
function update_tabs() { function update_tabs() {
var f, html = "", flist = FS.readdir('.'); var f, html = "", flist = ys.read_dir('.');
if (current_file == "") { if (current_file == "") {
html += '<tt>[ <b>Console</b>'; html += '<tt>[ <b>Console</b>';
} else { } else {
@ -103,26 +91,22 @@
if (current_file == "") if (current_file == "")
console_messages = document.getElementById('output').value; console_messages = document.getElementById('output').value;
else if (!/\.dot$/.test(current_file)) else if (!/\.dot$/.test(current_file))
FS.writeFile(current_file, document.getElementById('output').value, {encoding: 'utf8'}); ys.write_file(current_file, document.getElementById('output').value);
if (filename == "") { if (filename == "") {
document.getElementById('output').value = console_messages; document.getElementById('output').value = console_messages;
} else { } else {
try { try {
document.getElementById('output').value = FS.readFile(filename, {encoding: 'utf8'}); document.getElementById('output').value = ys.read_file(filename);
} catch (e) { } catch (e) {
document.getElementById('output').value = ""; document.getElementById('output').value = "";
FS.writeFile(filename, document.getElementById('output').value, {encoding: 'utf8'}); ys.write_file(filename, document.getElementById('output').value);
} }
} }
if (/\.dot$/.test(filename)) { if (/\.dot$/.test(filename)) {
dot = document.getElementById('output').value; dot = document.getElementById('output').value;
if (!(dot in svg_cache)) { YosysJS.dot_into_svg(dot, 'svg');
el = document.getElementById('viz');
svg_cache[dot] = el.contentWindow.Viz(dot, "svg");
}
document.getElementById('svg').innerHTML = svg_cache[dot];
document.getElementById('svg').style.display = 'block'; document.getElementById('svg').style.display = 'block';
document.getElementById('output').value = ''; document.getElementById('output').value = '';
} else { } else {
@ -135,21 +119,6 @@
} }
function startup() { function startup() {
el = document.getElementById('viz');
el.contentWindow.document.open();
el.contentWindow.document.write('<script type="text/javascript" src="viz.js"></' + 'script>');
el.contentWindow.document.close();
document.getElementById('wait').style.display = 'none';
document.getElementById('input').style.display = 'block';
document.getElementById('waitmsg').textContent = 'Waiting for yosys.js...';
document.getElementById('prompt').textContent = yosys_prompt();
try { FS.mkdir('/work'); } catch (e) { }
FS.chdir('/work');
update_tabs();
console.log('yosys.js loaded.');
} }
function load_example() { function load_example() {
@ -167,7 +136,7 @@
txt += " end\n"; txt += " end\n";
txt += "endmodule\n"; txt += "endmodule\n";
txt += "\n"; txt += "\n";
FS.writeFile('example.v', txt, {encoding: 'utf8'}); ys.write_file('example.v', txt);
var txt = ""; var txt = "";
txt += "# a simple yosys.js example. run \"script example.ys\".\n"; txt += "# a simple yosys.js example. run \"script example.ys\".\n";
@ -178,20 +147,12 @@
txt += "opt\n"; txt += "opt\n";
txt += "show\n"; txt += "show\n";
txt += "\n"; txt += "\n";
FS.writeFile('example.ys', txt, {encoding: 'utf8'}); ys.write_file('example.ys', txt);
open_file('example.ys') open_file('example.ys')
document.getElementById('command').focus(); document.getElementById('command').focus();
} }
function yosys_command(cmd) {
Module.ccall('run', '', ['string'], [cmd])
}
function yosys_prompt() {
return Module.ccall('prompt', 'string', [], [])
}
function run_command() { function run_command() {
var cmd = document.getElementById('command').value; var cmd = document.getElementById('command').value;
document.getElementById('command').value = ''; document.getElementById('command').value = '';
@ -200,28 +161,28 @@
history_index = history_log.length; history_index = history_log.length;
var show_dot_before = ""; var show_dot_before = "";
try { show_dot_before = FS.readFile('show.dot', { encoding: 'utf8' }); } catch (e) { } try { show_dot_before = ys.read_file('show.dot'); } catch (e) { }
open_file(''); open_file('');
Module.print(yosys_prompt() + cmd);
document.getElementById('wait').style.display = 'block'; document.getElementById('wait').style.display = 'block';
document.getElementById('input').style.display = 'none'; document.getElementById('input').style.display = 'none';
function run_command_bh() { function run_command_bh() {
try { try {
yosys_command(cmd); ys.run(cmd);
} catch (e) { } catch (e) {
Module.print('Caught JavaScript exception. (see JavaScript console for details.)'); ys.write('Caught JavaScript exception. (see JavaScript console for details.)');
console.log(e); console.log(e);
} }
print_output(ys.print_buffer);
document.getElementById('wait').style.display = 'none'; document.getElementById('wait').style.display = 'none';
document.getElementById('input').style.display = 'block'; document.getElementById('input').style.display = 'block';
document.getElementById('prompt').textContent = yosys_prompt(); document.getElementById('prompt').textContent = ys.prompt();
var show_dot_after = ""; var show_dot_after = "";
try { show_dot_after = FS.readFile('show.dot', { encoding: 'utf8' }); } catch (e) { } try { show_dot_after = ys.read_file('show.dot'); } catch (e) { }
if (show_dot_before != show_dot_after) if (show_dot_before != show_dot_after)
open_file('show.dot'); open_file('show.dot');
@ -233,5 +194,4 @@
return false; return false;
} }
</script> </script>
<script async type="text/javascript" src="yosys.js"></script>
</body></html> </body></html>

View File

@ -59,7 +59,7 @@ endmodule
function work() { function work() {
ys.write_file("input.v", document.getElementById('code').value); ys.write_file("input.v", document.getElementById('code').value);
ys.run('design -reset; read_verilog input.v; show -stretch'); ys.run('design -reset; read_verilog input.v; show -stretch');
YosysJS.dot_into_svg(ys.read_file('show.dot'), document.getElementById('svg')); YosysJS.dot_into_svg(ys.read_file('show.dot'), 'svg');
document.getElementById('popup').style.visibility = 'hidden'; document.getElementById('popup').style.visibility = 'hidden';
} }
document.getElementById('popup').style.visibility = 'visible'; document.getElementById('popup').style.visibility = 'visible';
@ -69,7 +69,7 @@ endmodule
function work() { function work() {
ys.write_file("input.v", document.getElementById('code').value); ys.write_file("input.v", document.getElementById('code').value);
ys.run('design -reset; read_verilog input.v; proc; opt_clean; show -stretch'); ys.run('design -reset; read_verilog input.v; proc; opt_clean; show -stretch');
YosysJS.dot_into_svg(ys.read_file('show.dot'), document.getElementById('svg')); YosysJS.dot_into_svg(ys.read_file('show.dot'), 'svg');
document.getElementById('popup').style.visibility = 'hidden'; document.getElementById('popup').style.visibility = 'hidden';
} }
document.getElementById('popup').style.visibility = 'visible'; document.getElementById('popup').style.visibility = 'visible';
@ -79,7 +79,7 @@ endmodule
function work() { function work() {
ys.write_file("input.v", document.getElementById('code').value); ys.write_file("input.v", document.getElementById('code').value);
ys.run('design -reset; read_verilog input.v; synth -run coarse; show -stretch'); ys.run('design -reset; read_verilog input.v; synth -run coarse; show -stretch');
YosysJS.dot_into_svg(ys.read_file('show.dot'), document.getElementById('svg')); YosysJS.dot_into_svg(ys.read_file('show.dot'), 'svg');
document.getElementById('popup').style.visibility = 'hidden'; document.getElementById('popup').style.visibility = 'hidden';
} }
document.getElementById('popup').style.visibility = 'visible'; document.getElementById('popup').style.visibility = 'visible';
@ -89,7 +89,7 @@ endmodule
function work() { function work() {
ys.write_file("input.v", document.getElementById('code').value); ys.write_file("input.v", document.getElementById('code').value);
ys.run('design -reset; read_verilog input.v; synth -run coarse; synth -run fine; show -stretch'); ys.run('design -reset; read_verilog input.v; synth -run coarse; synth -run fine; show -stretch');
YosysJS.dot_into_svg(ys.read_file('show.dot'), document.getElementById('svg')); YosysJS.dot_into_svg(ys.read_file('show.dot'), 'svg');
document.getElementById('popup').style.visibility = 'hidden'; document.getElementById('popup').style.visibility = 'hidden';
} }
document.getElementById('popup').style.visibility = 'visible'; document.getElementById('popup').style.visibility = 'visible';

View File

@ -22,6 +22,8 @@ var YosysJS = new function() {
} }
this.dot_into_svg = function(dot_text, svg_element) { this.dot_into_svg = function(dot_text, svg_element) {
if (typeof(svg_element) == 'string')
svg_element = document.getElementById(svg_element);
svg_element.innerHTML = this.dot_to_svg(dot_text); svg_element.innerHTML = this.dot_to_svg(dot_text);
c = svg_element.firstChild; c = svg_element.firstChild;
while (c) { while (c) {
@ -62,49 +64,61 @@ var YosysJS = new function() {
} }
} else { } else {
ys.iframe_element = document.createElement('iframe'); ys.iframe_element = document.createElement('iframe');
ys.iframe_element.style.display = 'none';
document.body.appendChild(ys.iframe_element); document.body.appendChild(ys.iframe_element);
} }
var return_buffer = ""; ys.print_buffer = "";
var last_line_empty = false; ys.last_line_empty = false;
ys.got_normal_log_message = false;
ys.window = ys.iframe_element.contentWindow;
var win = ys.iframe_element.contentWindow; var doc = ys.window.document;
var doc = ys.iframe_element.contentWindow.document; var mod = ys.window.Module = {
var mod = ys.iframe_element.contentWindow.Module = {
print: function(text) { print: function(text) {
return_buffer += text + "\n"; if (typeof(text) == 'number')
return;
ys.print_buffer += text + "\n";
ys.got_normal_log_message = true;
if (ys.verbose) { if (ys.verbose) {
last_line_empty = text == ""; ys.last_line_empty = text == "";
span = doc.createElement('span'); span = doc.createElement('span');
span.textContent = text + "\n"; span.textContent = text + "\n";
span.style.fontFamily = 'monospace'; span.style.fontFamily = 'monospace';
span.style.whiteSpace = 'pre'; span.style.whiteSpace = 'pre';
doc.body.appendChild(span); doc.body.appendChild(span);
win.scrollTo(0, doc.body.scrollHeight) ys.window.scrollTo(0, doc.body.scrollHeight)
} }
ys.ready = true; ys.ready = true;
}, },
printErr: function(text) { printErr: function(text) {
return_buffer += text + "\n"; if (typeof(text) == 'number')
last_line_empty = text == ""; return;
span = doc.createElement('span'); if (ys.got_normal_log_message) {
span.textContent = text + "\n"; ys.print_buffer += text + "\n";
span.style.fontFamily = 'monospace'; ys.last_line_empty = text == "";
span.style.whiteSpace = 'pre'; span = doc.createElement('span');
span.style.color = 'red'; span.textContent = text + "\n";
doc.body.appendChild(span); span.style.fontFamily = 'monospace';
win.scrollTo(0, doc.body.scrollHeight) span.style.whiteSpace = 'pre';
span.style.color = 'red';
doc.body.appendChild(span);
ys.window.scrollTo(0, doc.body.scrollHeight)
} else {
console.log(text);
}
}, },
}; };
ys.write = function(text) { ys.write = function(text) {
last_line_empty = text == ""; ys.print_buffer += text + "\n";
ys.last_line_empty = text == "";
span = doc.createElement('span'); span = doc.createElement('span');
span.textContent = text + "\n"; span.textContent = text + "\n";
span.style.fontFamily = 'monospace'; span.style.fontFamily = 'monospace';
span.style.whiteSpace = 'pre'; span.style.whiteSpace = 'pre';
doc.body.appendChild(span); doc.body.appendChild(span);
win.scrollTo(0, doc.body.scrollHeight) ys.window.scrollTo(0, doc.body.scrollHeight)
} }
ys.prompt = function() { ys.prompt = function() {
@ -112,26 +126,26 @@ var YosysJS = new function() {
} }
ys.run = function(cmd) { ys.run = function(cmd) {
return_buffer = ""; ys.print_buffer = "";
if (ys.echo) { if (ys.echo) {
if (!last_line_empty) if (!ys.last_line_empty)
ys.write(""); ys.write("");
ys.write(ys.prompt() + cmd); ys.write(ys.prompt() + cmd);
} }
mod.ccall('run', '', ['string'], [cmd]); mod.ccall('run', '', ['string'], [cmd]);
return return_buffer; return ys.print_buffer;
} }
ys.read_file = function(filename) { ys.read_file = function(filename) {
return win.FS.readFile(filename, {encoding: 'utf8'}); return ys.window.FS.readFile(filename, {encoding: 'utf8'});
} }
ys.write_file = function(filename, text) { ys.write_file = function(filename, text) {
return win.FS.writeFile(filename, text, {encoding: 'utf8'}); return ys.window.FS.writeFile(filename, text, {encoding: 'utf8'});
} }
ys.read_dir = function(dirname) { ys.read_dir = function(dirname) {
return win.FS.readdir(dirname); return ys.window.FS.readdir(dirname);
} }
el = doc.createElement('script'); el = doc.createElement('script');