logic: add example of synthesis

Signed-off-by: Sean Cross <sean@xobs.io>
This commit is contained in:
Sean Cross 2023-04-12 22:40:18 +08:00
parent b21b2174d6
commit 3ea46743fb
3 changed files with 90 additions and 88 deletions

BIN
img/boolean-1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 26 KiB

BIN
img/boolean-4.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

View File

@ -9,7 +9,7 @@
<link rel="stylesheet" href="dist/reset.css"> <link rel="stylesheet" href="dist/reset.css">
<link rel="stylesheet" href="dist/reveal.css"> <link rel="stylesheet" href="dist/reveal.css">
<link rel="stylesheet" href="dist/theme/fossasia2023.css"> <link rel="stylesheet" href="dist/theme/fossasia2023.css">
<!-- Theme used for syntax highlighted code --> <!-- Theme used for syntax highlighted code -->
<link rel="stylesheet" href="plugin/highlight/zenburn.css"> <link rel="stylesheet" href="plugin/highlight/zenburn.css">
@ -17,9 +17,9 @@
<body> <body>
<div class="reveal"> <div class="reveal">
<div class="footer"> <div class="footer">
<a class="url" href="https://p.xobs.io/fa23/">p.xobs.io/fa23</a> <a class="url" href="https://p.xobs.io/fa23/">p.xobs.io/fa23</a>
</div> </div>
<div class="slides"> <div class="slides">
<section> <section>
<h2>The State of Open Silicon</h2> <h2>The State of Open Silicon</h2>
@ -110,17 +110,19 @@
</section> </section>
<section> <section>
<h2>Digital logic overview (Today)</h2> <h2>Digital logic overview (Today)</h2>
<pre data-id="code-animation"><code class="hljs verilog" data-trim data-line-numbers> <div class="r-hstack">
module inverter(input clk, input [15:0] A, output [15:0] X); <pre data-id="code-animation"><code class="hljs verilog" data-trim data-line-numbers>
reg [15:0] R; module and_four(input A, input B,
assign X = R; input C, input D,
always @(posedge clk) output X);
begin assign X = A & B & C & D;
R <= ~A;
end
endmodule endmodule
</code></pre> </code></pre>
<img data-src="img/gf180mcu_fd_sc_mcu7t5v0__inv_16.layout.png"> <div class="r-vstack">
<img data-src="img/boolean-4.png">
<img data-src="img/boolean-1.png">
</div>
</div>
</section> </section>
<section> <section>
@ -381,97 +383,97 @@
</div> </div>
</div> </div>
<script src="dist/reveal.js"></script> <script src="dist/reveal.js"></script>
<script src="plugin/notes/notes.js"></script> <script src="plugin/notes/notes.js"></script>
<script src="plugin/zoom/zoom.js"></script> <script src="plugin/zoom/zoom.js"></script>
<script src="plugin/markdown/markdown.js"></script> <script src="plugin/markdown/markdown.js"></script>
<script src="plugin/highlight/highlight.js"></script> <script src="plugin/highlight/highlight.js"></script>
<script> <script>
/** This used to be a part of Reveal.js, but was removed at some point */ /** This used to be a part of Reveal.js, but was removed at some point */
function getQueryHash() { function getQueryHash() {
function deserialize(value) { function deserialize(value) {
if (typeof value === 'string') { if (typeof value === 'string') {
if (value === 'null') return null; if (value === 'null') return null;
else if (value === 'true') return true; else if (value === 'true') return true;
else if (value === 'false') return false; else if (value === 'false') return false;
else if (value.match(/^-?[\d\.]+$/)) return parseFloat(value); else if (value.match(/^-?[\d\.]+$/)) return parseFloat(value);
} }
return value; return value;
} }
let query = {}; let query = {};
location.search.replace(/[A-Z0-9]+?=([\w\.%-]*)/gi, a => { location.search.replace(/[A-Z0-9]+?=([\w\.%-]*)/gi, a => {
query[a.split('=').shift()] = a.split('=').pop(); query[a.split('=').shift()] = a.split('=').pop();
}); });
// Basic deserialization // Basic deserialization
for (let i in query) { for (let i in query) {
let value = query[i]; let value = query[i];
query[i] = deserialize(unescape(value)); query[i] = deserialize(unescape(value));
} }
// Do not accept new dependencies via query config to avoid // Do not accept new dependencies via query config to avoid
// the potential of malicious script injection // the potential of malicious script injection
if (typeof query['dependencies'] !== 'undefined') delete query['dependencies']; if (typeof query['dependencies'] !== 'undefined') delete query['dependencies'];
return query; return query;
} }
var presenter = !!getQueryHash().s; var presenter = !!getQueryHash().s;
var stream = !!getQueryHash().stream; var stream = !!getQueryHash().stream;
// More info about initialization & config: // More info about initialization & config:
// - https://revealjs.com/initialization/ // - https://revealjs.com/initialization/
// - https://revealjs.com/config/ // - https://revealjs.com/config/
reveal_dependencies = [ reveal_dependencies = [
{ src: 'https://reveal-multiplex.glitch.me/socket.io/socket.io.js', async: true }, { src: 'https://reveal-multiplex.glitch.me/socket.io/socket.io.js', async: true },
]; ];
if (presenter) { if (presenter) {
reveal_dependencies.push({ src: 'https://reveal-multiplex.glitch.me/master.js', async: true },); reveal_dependencies.push({ src: 'https://reveal-multiplex.glitch.me/master.js', async: true },);
} else { } else {
reveal_dependencies.push({ src: 'https://reveal-multiplex.glitch.me/client.js', async: true }); reveal_dependencies.push({ src: 'https://reveal-multiplex.glitch.me/client.js', async: true });
} }
Reveal.initialize({ Reveal.initialize({
hash: true, hash: true,
controls: presenter ? false : (stream ? false : true), controls: presenter ? false : (stream ? false : true),
progress: true, progress: true,
history: true, history: true,
center: true, center: true,
controlsTutorial: presenter ? false : (stream ? false : true), controlsTutorial: presenter ? false : (stream ? false : true),
slideNumber: presenter ? null : (stream ? null : 'c/t'), slideNumber: presenter ? null : (stream ? null : 'c/t'),
// The "normal" size of the presentation, aspect ratio will be preserved // The "normal" size of the presentation, aspect ratio will be preserved
// when the presentation is scaled to fit different resolutions. Can be // when the presentation is scaled to fit different resolutions. Can be
// specified using percentage units. // specified using percentage units.
width: 1280, width: 1280,
height: 840, height: 840,
// Factor of the display size that should remain empty around the content // Factor of the display size that should remain empty around the content
margin: 0.1, margin: 0.1,
multiplex: { multiplex: {
// Example values. To generate your own, see the socket.io server instructions. // Example values. To generate your own, see the socket.io server instructions.
secret: getQueryHash().s || null, secret: getQueryHash().s || null,
id: 'ef4a6dfa448e19c1', id: 'ef4a6dfa448e19c1',
url: 'https://p.xobs.io/' url: 'https://p.xobs.io/'
}, },
// Bounds for smallest/largest possible scale to apply to content // Bounds for smallest/largest possible scale to apply to content
minScale: 0.02, minScale: 0.02,
maxScale: 5.5, maxScale: 5.5,
defaultTiming: 40, defaultTiming: 40,
transition: 'slide', // none/fade/slide/convex/concave/zoom transition: 'slide', // none/fade/slide/convex/concave/zoom
// Don't forget to add the dependencies // Don't forget to add the dependencies
dependencies: reveal_dependencies, dependencies: reveal_dependencies,
// Learn about plugins: https://revealjs.com/plugins/ // Learn about plugins: https://revealjs.com/plugins/
plugins: [RevealMarkdown, RevealHighlight, RevealZoom, RevealNotes] plugins: [RevealMarkdown, RevealHighlight, RevealZoom, RevealNotes]
}); });
</script> </script>
</body> </body>