Added YosysJS wrapper

This commit is contained in:
Clifford Wolf 2015-02-16 12:41:48 +01:00
parent 0748ef638d
commit 33e80b96c7
6 changed files with 273 additions and 5 deletions

1
.gitignore vendored
View File

@ -15,7 +15,6 @@
/yosys
/yosys.exe
/yosys.js
/yosys.html
/yosys-abc
/yosys-abc.exe
/yosys-config

View File

@ -113,12 +113,18 @@ LDLIBS =
EXE = .js
TARGETS := $(filter-out yosys-config,$(TARGETS))
EXTRA_TARGETS += yosys.html viz.js
EXTRA_TARGETS += yosysjs-$(YOSYS_VER).zip
viz.js:
wget -O viz.js.part https://github.com/mdaines/viz.js/releases/download/0.0.3/viz.js
mv viz.js.part viz.js
yosysjs-$(YOSYS_VER).zip: yosys.js viz.js misc/yosysjs/*
rm -rf yosysjs-$(YOSYS_VER) yosysjs-$(YOSYS_VER).zip
mkdir -p yosysjs-$(YOSYS_VER)
cp viz.js misc/yosysjs/* yosys.js yosysjs-$(YOSYS_VER)/
zip -r yosysjs-$(YOSYS_VER).zip yosysjs-$(YOSYS_VER)
yosys.html: misc/yosys.html
$(P) cp misc/yosys.html yosys.html

View File

@ -93,7 +93,9 @@ void run(const char *command)
const char *prompt()
{
return create_prompt(yosys_get_design(), 0);
const char *p = create_prompt(yosys_get_design(), 0);
while (*p == '\n') p++;
return p;
}
#else /* EMSCRIPTEN */

View File

@ -1,7 +1,7 @@
<html><head>
<title>yosys.js example application</title>
<title>YosysJS Example Application #01</title>
</head><body onload="document.getElementById('command').focus()">
<h1>yosys.js example application</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>
<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: 100%; height: 80%;"></svg>

102
misc/yosysjs/demo02.html Normal file
View File

@ -0,0 +1,102 @@
<html><head>
<title>YosysJS Example Application #02</title>
<script type="text/javascript" src="yosysjs.js"></script>
</head><body>
<div id="popup" style="position: fixed; left: 0; top: 0; width:100%; height:100%; text-align:center; z-index: 1000;"><div
style="width:300px; margin: 200px auto; background-color: #88f; border:3px dashed #000;
padding:15px; text-align:center;"><span id="popupmsg">Loading...</span></div>
</div>
<h1>YosysJS Example Application #02</h1>
<iframe id="ys" style="width: 800px; height: 100px;"></iframe><p/>
<textarea id="code" style="width: 800px; height: 300px;">
// borrowed with some modifications from
// http://www.ee.ed.ac.uk/~gerard/Teach/Verilog/manual/Example/lrgeEx2/cooley.html
module up3down5(clock, data_in, up, down, carry_out, borrow_out, count_out, parity_out);
input [8:0] data_in;
input clock, up, down;
output reg [8:0] count_out;
output reg carry_out, borrow_out, parity_out;
reg [9:0] cnt_up, cnt_dn;
reg [8:0] count_nxt;
always @(posedge clock)
begin
cnt_dn = count_out - 3'b 101;
cnt_up = count_out + 2'b 11;
case ({up,down})
2'b 00 : count_nxt = data_in;
2'b 01 : count_nxt = cnt_dn;
2'b 10 : count_nxt = cnt_up;
2'b 11 : count_nxt = count_out;
default : count_nxt = 9'bX;
endcase
parity_out &lt;= ^count_nxt;
carry_out &lt;= up &amp; cnt_up[9];
borrow_out &lt;= down &amp; cnt_dn[9];
count_out &lt;= count_nxt;
end
endmodule
</textarea><p/>
<input type="button" value="Before Behavioral Synth" onclick="synth1()">
<input type="button" value="After Behavioral Synth" onclick="synth2()">
<input type="button" value="After RTL Synth" onclick="synth3()">
<input type="button" value="After Gate-Level Synth" onclick="synth4()"><p/>
<svg id="svg" width="800"></svg>
</td></tr></table>
<script type="text/javascript">
YosysJS.load_viz();
function on_ys_ready() {
document.getElementById('popup').style.visibility = 'hidden';
document.getElementById('popupmsg').textContent = 'Please wait..';
}
function synth1() {
function work() {
ys.write_file("input.v", document.getElementById('code').value);
ys.run('design -reset; read_verilog input.v; show -stretch');
YosysJS.dot_into_svg(ys.read_file('show.dot'), document.getElementById('svg'));
document.getElementById('popup').style.visibility = 'hidden';
}
document.getElementById('popup').style.visibility = 'visible';
window.setTimeout(work, 100);
}
function synth2() {
function work() {
ys.write_file("input.v", document.getElementById('code').value);
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'));
document.getElementById('popup').style.visibility = 'hidden';
}
document.getElementById('popup').style.visibility = 'visible';
window.setTimeout(work, 100);
}
function synth3() {
function work() {
ys.write_file("input.v", document.getElementById('code').value);
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'));
document.getElementById('popup').style.visibility = 'hidden';
}
document.getElementById('popup').style.visibility = 'visible';
window.setTimeout(work, 100);
}
function synth4() {
function work() {
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');
YosysJS.dot_into_svg(ys.read_file('show.dot'), document.getElementById('svg'));
document.getElementById('popup').style.visibility = 'hidden';
}
document.getElementById('popup').style.visibility = 'visible';
window.setTimeout(work, 100);
}
var ys = YosysJS.create('ys', on_ys_ready);
ys.verbose = true;
ys.echo = true;
</script>
</body></html>

159
misc/yosysjs/yosysjs.js Normal file
View File

@ -0,0 +1,159 @@
var YosysJS = new function() {
this.script_element = document.currentScript;
this.viz_element = undefined;
this.url_prefix = this.script_element.src.replace(/[^/]+$/, '')
this.load_viz = function() {
if (this.viz_element)
return;
this.viz_element = document.createElement('iframe')
this.viz_element.style.display = 'none'
document.body.appendChild(this.viz_element);
this.viz_element.contentWindow.document.open()
this.viz_element.contentWindow.document.write('<script type="text/javascript" src="' + this.url_prefix + 'viz.js"></' + 'script>');
this.viz_element.contentWindow.document.close()
}
this.dot_to_svg = function(dot_text) {
return this.viz_element.contentWindow.Viz(dot_text, "svg");
}
this.dot_into_svg = function(dot_text, svg_element) {
svg_element.innerHTML = this.dot_to_svg(dot_text);
c = svg_element.firstChild;
while (c) {
if (c.tagName == 'svg') {
while (c.firstChild)
svg_element.appendChild(c.firstChild);
svg_element.setAttribute('viewBox', c.getAttribute('viewBox'));
// svg_element.removeChild(c);
break;
}
c = c.nextSibling;
}
}
this.create = function(reference_element, on_ready) {
var ys = new Object();
ys.init_script = "";
ys.ready = false;
ys.verbose = false;
ys.echo = false;
if (typeof(reference_element) == 'string')
reference_element = document.getElementById(reference_element);
if (reference_element) {
if (reference_element.tagName == 'textarea')
ys.init_script = reference_element.value;
if (reference_element.tagName == 'iframe') {
ys.iframe_element = reference_element;
} else {
ys.iframe_element = document.createElement('iframe');
ys.iframe_element.id = reference_element.id;
for (i in reference_element.style)
ys.iframe_element.style[i] = reference_element.style[i];
reference_element.parentNode.insertBefore(ys.iframe_element, reference_element);
reference_element.parentNode.removeChild(reference_element);
}
} else {
ys.iframe_element = document.createElement('iframe');
document.body.appendChild(ys.iframe_element);
}
var return_buffer = "";
var last_line_empty = false;
var win = ys.iframe_element.contentWindow;
var doc = ys.iframe_element.contentWindow.document;
var mod = ys.iframe_element.contentWindow.Module = {
print: function(text) {
return_buffer += text + "\n";
if (ys.verbose) {
last_line_empty = text == "";
span = doc.createElement('span');
span.textContent = text + "\n";
span.style.fontFamily = 'monospace';
span.style.whiteSpace = 'pre';
doc.body.appendChild(span);
win.scrollTo(0, doc.body.scrollHeight)
}
ys.ready = true;
},
printErr: function(text) {
return_buffer += text + "\n";
last_line_empty = text == "";
span = doc.createElement('span');
span.textContent = text + "\n";
span.style.fontFamily = 'monospace';
span.style.whiteSpace = 'pre';
span.style.color = 'red';
doc.body.appendChild(span);
win.scrollTo(0, doc.body.scrollHeight)
},
};
ys.write = function(text) {
last_line_empty = text == "";
span = doc.createElement('span');
span.textContent = text + "\n";
span.style.fontFamily = 'monospace';
span.style.whiteSpace = 'pre';
doc.body.appendChild(span);
win.scrollTo(0, doc.body.scrollHeight)
}
ys.prompt = function() {
return mod.ccall('prompt', 'string', [], [])
}
ys.run = function(cmd) {
return_buffer = "";
if (ys.echo) {
if (!last_line_empty)
ys.write("");
ys.write(ys.prompt() + cmd);
}
mod.ccall('run', '', ['string'], [cmd]);
return return_buffer;
}
ys.read_file = function(filename) {
return win.FS.readFile(filename, {encoding: 'utf8'});
}
ys.write_file = function(filename, text) {
return win.FS.writeFile(filename, text, {encoding: 'utf8'});
}
ys.read_dir = function(dirname) {
return win.FS.readdir(dirname);
}
el = doc.createElement('script');
el.type = 'text/javascript';
el.src = this.url_prefix + 'yosys.js';
doc.head.appendChild(el);
if (on_ready || ys.init_script) {
function check_ready() {
if (ys.ready) {
if (ys.init_script) {
ys.write_file("/script.ys", ys.init_script);
ys.run("script /script.ys");
}
if (on_ready)
on_ready(ys);
} else
window.setTimeout(check_ready, 100);
}
window.setTimeout(check_ready, 100);
}
return ys;
}
}