hmml_to_html.c: Highlight current reference [#15]
Also pause the player upon following a ref's url, and do some clean-up
This commit is contained in:
Matt Mascarenhas
parent
3394daf8b0
commit
012693bd39
|
|
@ -116,7 +116,7 @@ main(int ArgC, char **Args)
|
|||
if(HMML.well_formed)
|
||||
{
|
||||
Working.Location = MemoryArena + ClaimedMemory;
|
||||
Working.Size = 351;
|
||||
Working.Size = 1024 * 2;
|
||||
ClaimedMemory += Working.Size;
|
||||
|
||||
sprintf(Working.Location,
|
||||
|
|
@ -140,23 +140,16 @@ main(int ArgC, char **Args)
|
|||
*Out.Ptr++ = *Working.Ptr++;
|
||||
}
|
||||
|
||||
Working.Location = '\0';
|
||||
ClaimedMemory -= Working.Size;
|
||||
|
||||
Working.Location = MemoryArena + ClaimedMemory;
|
||||
Working.Size = 1024;
|
||||
ClaimedMemory += Working.Size;
|
||||
|
||||
int AnnotationIndex = 0;
|
||||
while(AnnotationIndex < HMML.annotation_count)
|
||||
{
|
||||
if(HMML.annotations[AnnotationIndex].reference_count)
|
||||
{
|
||||
sprintf(Working.Location,
|
||||
" <div class=\"refs_container\">\n"
|
||||
" <span>References ▼</span>\n"
|
||||
" <div class=\"mouse_catcher\"></div>\n"
|
||||
" <div class=\"refs\">\n");
|
||||
" <div class=\"refs_container\">\n"
|
||||
" <span>References ▼</span>\n"
|
||||
" <div class=\"mouse_catcher\"></div>\n"
|
||||
" <div class=\"refs\">\n");
|
||||
|
||||
Working.Ptr = Working.Location;
|
||||
while(*Working.Ptr)
|
||||
|
|
@ -169,13 +162,14 @@ main(int ArgC, char **Args)
|
|||
for(int i = 0; i < HMML.annotations[AnnotationIndex].reference_count; ++i)
|
||||
{
|
||||
sprintf(Working.Location,
|
||||
" <a href=\"%s\" target=\"_blank\" class=\"ref\">\n"
|
||||
" <span data-timestamp=\"%d\" class=\"timecode\">(<span class=\"time\">%s</span>)</span>\n"
|
||||
" <span class=\"ref_content\">\n"
|
||||
" <div class=\"source\">%s</div>\n"
|
||||
" <div class=\"ref_title\">%s</div>\n"
|
||||
" </span>\n"
|
||||
" </a>\n",
|
||||
" <a data-id=\"%d\" href=\"%s\" target=\"_blank\" class=\"ref\">\n"
|
||||
" <span data-timestamp=\"%d\" class=\"timecode\">(<span class=\"time\">%s</span>)</span>\n"
|
||||
" <span class=\"ref_content\">\n"
|
||||
" <div class=\"source\">%s</div>\n"
|
||||
" <div class=\"ref_title\">%s</div>\n"
|
||||
" </span>\n"
|
||||
" </a>\n",
|
||||
AnnotationIndex,
|
||||
HMML.annotations[AnnotationIndex].references[i].url,
|
||||
TimecodeToSeconds(HMML.annotations[AnnotationIndex].time),
|
||||
HMML.annotations[AnnotationIndex].time,
|
||||
|
|
@ -194,28 +188,14 @@ HMML.annotations[AnnotationIndex].references[i].page ? HMML.annotations[Annotati
|
|||
++AnnotationIndex;
|
||||
}
|
||||
|
||||
Working.Location = '\0';
|
||||
ClaimedMemory -= Working.Size;
|
||||
|
||||
Working.Location = MemoryArena + ClaimedMemory;
|
||||
Working.Size = 256;
|
||||
ClaimedMemory += Working.Size;
|
||||
|
||||
Working.Location = '\0';
|
||||
ClaimedMemory -= Working.Size;
|
||||
|
||||
Working.Location = MemoryArena + ClaimedMemory;
|
||||
Working.Size = 1024;
|
||||
ClaimedMemory += Working.Size;
|
||||
|
||||
sprintf(Working.Location,
|
||||
" </div>\n"
|
||||
" </div>\n"
|
||||
" <span class=\"annotator_container\">Annotator: <span class=\"annotator\">%s</span></span>\n"
|
||||
" </div>\n"
|
||||
" <span class=\"annotator_container\">Annotator: <span class=\"annotator\">%s</span></span>\n"
|
||||
"</div>\n"
|
||||
"<div class=\"player_container\">\n"
|
||||
" <div class=\"video_container\" data-videoId=\"%s\"></div>\n"
|
||||
" <div class=\"markers_container\">\n", HMML.metadata.annotator, HMML.metadata.id);
|
||||
" <div class=\"player_container\">\n"
|
||||
" <div class=\"video_container\" data-videoId=\"%s\"></div>\n"
|
||||
" <div class=\"markers_container\">\n", HMML.metadata.annotator, HMML.metadata.id);
|
||||
|
||||
Working.Ptr = Working.Location;
|
||||
|
||||
|
|
@ -224,25 +204,20 @@ HMML.annotations[AnnotationIndex].references[i].page ? HMML.annotations[Annotati
|
|||
*Out.Ptr++ = *Working.Ptr++;
|
||||
}
|
||||
|
||||
Working.Location = '\0';
|
||||
ClaimedMemory -= Working.Size;
|
||||
|
||||
int DataRef = 0;
|
||||
|
||||
for(int AnnotationIndex = 0; AnnotationIndex < HMML.annotation_count; ++AnnotationIndex)
|
||||
{
|
||||
Working.Location = MemoryArena + ClaimedMemory;
|
||||
Working.Size = 1024;
|
||||
ClaimedMemory += Working.Size;
|
||||
|
||||
if(HMML.annotations[AnnotationIndex].reference_count || HMML.annotations[AnnotationIndex].is_quote)
|
||||
if(HMML.annotations[AnnotationIndex].reference_count) // || HMML.annotations[AnnotationIndex].is_quote)
|
||||
{
|
||||
sprintf(Working.Location, "<div class=\"marker\" data-timestamp=\"%d\" data-ref=\"%d\">\n", TimecodeToSeconds(HMML.annotations[AnnotationIndex].time), DataRef);
|
||||
sprintf(Working.Location,
|
||||
" <div class=\"marker\" data-timestamp=\"%d\" data-ref=\"%d\">\n", TimecodeToSeconds(HMML.annotations[AnnotationIndex].time), AnnotationIndex);
|
||||
++DataRef;
|
||||
}
|
||||
else
|
||||
{
|
||||
sprintf(Working.Location, "<div class=\"marker\" data-timestamp=\"%d\">\n", TimecodeToSeconds(HMML.annotations[AnnotationIndex].time));
|
||||
sprintf(Working.Location,
|
||||
" <div class=\"marker\" data-timestamp=\"%d\">\n", TimecodeToSeconds(HMML.annotations[AnnotationIndex].time));
|
||||
}
|
||||
|
||||
Working.Ptr = Working.Location;
|
||||
|
|
@ -251,14 +226,15 @@ HMML.annotations[AnnotationIndex].references[i].page ? HMML.annotations[Annotati
|
|||
*Out.Ptr++ = *Working.Ptr++;
|
||||
}
|
||||
|
||||
sprintf(Working.Location, "<div class=\"content\"><span class=\"timecode\">%s</span>%s</div>\n"
|
||||
"<div class=\"progress faded\">\n"
|
||||
"<div class=\"content\"><span class=\"timecode\">%s</span>%s</div>\n"
|
||||
"</div>\n"
|
||||
"<div class=\"progress main\">\n"
|
||||
"<div class=\"content\"><span class=\"timecode\">%s</span>%s</div>\n"
|
||||
"</div>\n"
|
||||
"</div>\n",
|
||||
sprintf(Working.Location,
|
||||
" <div class=\"content\"><span class=\"timecode\">%s</span>%s</div>\n"
|
||||
" <div class=\"progress faded\">\n"
|
||||
" <div class=\"content\"><span class=\"timecode\">%s</span>%s</div>\n"
|
||||
" </div>\n"
|
||||
" <div class=\"progress main\">\n"
|
||||
" <div class=\"content\"><span class=\"timecode\">%s</span>%s</div>\n"
|
||||
" </div>\n"
|
||||
" </div>\n",
|
||||
HMML.annotations[AnnotationIndex].time,
|
||||
HMML.annotations[AnnotationIndex].text,
|
||||
HMML.annotations[AnnotationIndex].time,
|
||||
|
|
@ -271,40 +247,76 @@ HMML.annotations[AnnotationIndex].references[i].page ? HMML.annotations[Annotati
|
|||
{
|
||||
*Out.Ptr++ = *Working.Ptr++;
|
||||
}
|
||||
|
||||
Working.Location = '\0';
|
||||
ClaimedMemory -= Working.Size;
|
||||
|
||||
*Out.Ptr++ = '\n';
|
||||
}
|
||||
|
||||
Working.Location = MemoryArena + ClaimedMemory;
|
||||
Working.Size = 256;
|
||||
ClaimedMemory += Working.Size;
|
||||
|
||||
sprintf(Working.Location, "</div>\n"
|
||||
"</div>\n"
|
||||
"<script>\n"
|
||||
"var player = new Player(document.querySelector(\".player_container\"));\n"
|
||||
"window.addEventListener(\"resize\", function() { player.updateSize(); });\n"
|
||||
"document.addEventListener(\"keypress\", function(ev) {\n"
|
||||
" switch (ev.key) {\n"
|
||||
" case 'n':\n"
|
||||
" case 'd':\n"
|
||||
" case 's': {\n"
|
||||
" player.jumpToNextMarker();\n"
|
||||
" } break;\n"
|
||||
sprintf(Working.Location,
|
||||
" </div>\n"
|
||||
" </div>\n"
|
||||
" <script>\n"
|
||||
" var player = new Player(document.querySelector(\".player_container\"), onRefChanged);\n"
|
||||
" window.addEventListener(\"resize\", function() { player.updateSize(); });\n"
|
||||
" document.addEventListener(\"keypress\", function(ev) {\n"
|
||||
" switch (ev.key) {\n"
|
||||
" case 'n':\n"
|
||||
" case 'd':\n"
|
||||
" case 's': {\n"
|
||||
" player.jumpToNextMarker();\n"
|
||||
" } break;\n"
|
||||
"\n"
|
||||
" case 'p':\n"
|
||||
" case 'a':\n"
|
||||
" case 'w': {\n"
|
||||
" player.jumpToPrevMarker();\n"
|
||||
" } break;\n"
|
||||
" case 'p':\n"
|
||||
" case 'a':\n"
|
||||
" case 'w': {\n"
|
||||
" player.jumpToPrevMarker();\n"
|
||||
" } break;\n"
|
||||
" }\n"
|
||||
"});\n"
|
||||
"</script>\n"
|
||||
"</body>\n"
|
||||
"</html>\n");
|
||||
"\n"
|
||||
"var refTimecodes = document.querySelectorAll(\".refs .ref .timecode\");\n"
|
||||
"for (var i = 0; i < refTimecodes.length; ++i) {\n"
|
||||
" refTimecodes[i].addEventListener(\"click\", function(ev) {\n"
|
||||
" if (player) {\n"
|
||||
" var time = ev.currentTarget.getAttribute(\"data-timestamp\");\n"
|
||||
" player.setTime(parseInt(time, 10));\n"
|
||||
" player.play();\n"
|
||||
" ev.preventDefault();\n"
|
||||
" return false;\n"
|
||||
" }\n"
|
||||
" });\n"
|
||||
"}\n"
|
||||
"\n"
|
||||
"var refSources = document.querySelectorAll(\".refs .ref\");\n"
|
||||
"for (var i = 0; i < refSources.length; ++i) {\n"
|
||||
" refSources[i].addEventListener(\"click\", function(ev) {\n"
|
||||
" if (player) {\n"
|
||||
" player.pause();\n"
|
||||
" }\n"
|
||||
" });\n"
|
||||
"}\n"
|
||||
"\n"
|
||||
"function onRefChanged(ref) {\n"
|
||||
" if (ref !== undefined && ref !== null) {\n"
|
||||
" document.querySelector(\".refs_container\").classList.add(\"current\");\n"
|
||||
" var refs = document.querySelectorAll(\".refs .ref\");\n"
|
||||
" for (var i = 0; i < refs.length; ++i) {\n"
|
||||
" var dataID = refs[i].getAttribute(\"data-id\");\n"
|
||||
" if (ref == dataID) {\n"
|
||||
" refs[i].classList.add(\"current\");\n"
|
||||
" } else {\n"
|
||||
" refs[i].classList.remove(\"current\");\n"
|
||||
" }\n"
|
||||
" }\n"
|
||||
" } else {\n"
|
||||
" document.querySelector(\".refs_container\").classList.remove(\"current\");\n"
|
||||
" var refs = document.querySelectorAll(\".refs .ref\");\n"
|
||||
" for (var i = 0; i < refs.length; ++i) {\n"
|
||||
" refs[i].classList.remove(\"current\");\n"
|
||||
" }\n"
|
||||
" }\n"
|
||||
"}\n"
|
||||
"\n"
|
||||
" </script>\n"
|
||||
" </body>\n"
|
||||
"</html>\n");
|
||||
|
||||
Working.Ptr = Working.Location;
|
||||
while(*Working.Ptr)
|
||||
|
|
|
|||
|
|
@ -8,280 +8,277 @@
|
|||
</head>
|
||||
<body>
|
||||
<div class="title">
|
||||
<span class="episode_name">Ripple Carry Adders & Two's Complement</span>
|
||||
<div class="refs_container">
|
||||
<span>References ▼</span>
|
||||
<div class="mouse_catcher"></div>
|
||||
<div class="refs">
|
||||
<a href="http://www.charlespetzold.com/code/" target="_blank" class="ref">
|
||||
<span data-timestamp="61" class="timecode">(<span class="time">1:01</span>)</span>
|
||||
<span class="ref_content">
|
||||
<div class="source">Charles Petzold</div>
|
||||
<div class="ref_title">Code: The Hidden Language of Computer Hardware and Software</div>
|
||||
</span>
|
||||
</a>
|
||||
<a href="https://en.wikipedia.org/wiki/Logic_gate" target="_blank" class="ref">
|
||||
<span data-timestamp="1082" class="timecode">(<span class="time">18:02</span>)</span>
|
||||
<span class="ref_content">
|
||||
<div class="source">Wikipedia</div>
|
||||
<div class="ref_title">Logic gate</div>
|
||||
</span>
|
||||
</a>
|
||||
<a href="https://en.wikipedia.org/wiki/Adder_(electronics)" target="_blank" class="ref">
|
||||
<span data-timestamp="2218" class="timecode">(<span class="time">36:58</span>)</span>
|
||||
<span class="ref_content">
|
||||
<div class="source">Wikipedia</div>
|
||||
<div class="ref_title">Adder (electronics)</div>
|
||||
</span>
|
||||
</a>
|
||||
<a href="https://en.wikipedia.org/wiki/Ones'_complement" target="_blank" class="ref">
|
||||
<span data-timestamp="2886" class="timecode">(<span class="time">48:06</span>)</span>
|
||||
<span class="ref_content">
|
||||
<div class="source">Wikipedia</div>
|
||||
<div class="ref_title">Ones' complement</div>
|
||||
</span>
|
||||
</a>
|
||||
<a href="https://en.wikipedia.org/wiki/Two's_complement" target="_blank" class="ref">
|
||||
<span data-timestamp="3268" class="timecode">(<span class="time">54:28</span>)</span>
|
||||
<span class="ref_content">
|
||||
<div class="source">Wikipedia</div>
|
||||
<div class="ref_title">Two's complement</div>
|
||||
</span>
|
||||
</a>
|
||||
<a href="https://gcc.gnu.org/onlinedocs/gcc/Statement-Exprs.html" target="_blank" class="ref">
|
||||
<span data-timestamp="3883" class="timecode">(<span class="time">1:04:43</span>)</span>
|
||||
<span class="ref_content">
|
||||
<div class="source">GCC, the GNU Compiler Collection</div>
|
||||
<div class="ref_title">Statements and Declarations in Expressions</div>
|
||||
</span>
|
||||
</a>
|
||||
<span class="episode_name">Studying the Machine Interrupt Registers</span>
|
||||
<div class="refs_container">
|
||||
<span>References ▼</span>
|
||||
<div class="mouse_catcher"></div>
|
||||
<div class="refs">
|
||||
<a data-id="3" href="https://github.com/ucb-bar/rocket/blob/master/src/main/scala/instructions.scala" target="_blank" class="ref">
|
||||
<span data-timestamp="543" class="timecode">(<span class="time">9:03</span>)</span>
|
||||
<span class="ref_content">
|
||||
<div class="source">GitHub</div>
|
||||
<div class="ref_title">instructions.scala</div>
|
||||
</span>
|
||||
</a>
|
||||
<a data-id="3" href="https://en.wikipedia.org/wiki/Register-transfer_level" target="_blank" class="ref">
|
||||
<span data-timestamp="543" class="timecode">(<span class="time">9:03</span>)</span>
|
||||
<span class="ref_content">
|
||||
<div class="source">Wikipedia</div>
|
||||
<div class="ref_title">Register-transfer level</div>
|
||||
</span>
|
||||
</a>
|
||||
<a data-id="4" href="https://forums.sifive.com/t/confusion-regarding-freedom-e-sdk-inline-asm/383" target="_blank" class="ref">
|
||||
<span data-timestamp="955" class="timecode">(<span class="time">15:55</span>)</span>
|
||||
<span class="ref_content">
|
||||
<div class="source">SiFive Forums</div>
|
||||
<div class="ref_title">Confusion Regarding Freedom E SDK inline asm</div>
|
||||
</span>
|
||||
</a>
|
||||
<a data-id="6" href="https://riscv.org/specifications" target="_blank" class="ref">
|
||||
<span data-timestamp="1344" class="timecode">(<span class="time">22:24</span>)</span>
|
||||
<span class="ref_content">
|
||||
<div class="source">RISC-V"</div>
|
||||
<div class="ref_title">User-Level ISA Specification v2.1</div>
|
||||
</span>
|
||||
</a>
|
||||
<a data-id="8" href="http://ericw.ca/notes/a-tiny-guide-to-gcc-inline-assembly.html" target="_blank" class="ref">
|
||||
<span data-timestamp="1733" class="timecode">(<span class="time">28:53</span>)</span>
|
||||
<span class="ref_content">
|
||||
<div class="source">ericw.</div>
|
||||
<div class="ref_title">A Tiny Guide to GCC Inline Assembly</div>
|
||||
</span>
|
||||
</a>
|
||||
<a data-id="10" href="https://riscv.org/specifications/privileged-isa/" target="_blank" class="ref">
|
||||
<span data-timestamp="2421" class="timecode">(<span class="time">40:21</span>)</span>
|
||||
<span class="ref_content">
|
||||
<div class="source">RISC-V</div>
|
||||
<div class="ref_title">Draft Privileged ISA Specification v1.9.1</div>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<span class="annotator_container">Annotator: <span class="annotator">Miblo</span></span>
|
||||
</div>
|
||||
<span class="annotator_container">Annotator: <span class="annotator">Miblo</span></span>
|
||||
</div>
|
||||
<div class="player_container">
|
||||
<div class="video_container" data-videoId="BObABjzvVPw"></div>
|
||||
<div class="markers_container">
|
||||
<div class="marker" data-timestamp="7">
|
||||
<div class="content"><span class="timecode">0:07</span>Set the stage for the day, looking at two's complement and sign extension</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">0:07</span>Set the stage for the day, looking at two's complement and sign extension</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">0:07</span>Set the stage for the day, looking at two's complement and sign extension</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="player_container">
|
||||
<div class="video_container" data-videoId="ug5WkCROkOk"></div>
|
||||
<div class="markers_container">
|
||||
<div class="marker" data-timestamp="6">
|
||||
<div class="content"><span class="timecode">0:06</span>Recap and set the stage for the day</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">0:06</span>Recap and set the stage for the day</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">0:06</span>Recap and set the stage for the day</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="marker" data-timestamp="51">
|
||||
<div class="content"><span class="timecode">0:51</span>Intuition on two's complement</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">0:51</span>Intuition on two's complement</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">0:51</span>Intuition on two's complement</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="marker" data-timestamp="250">
|
||||
<div class="content"><span class="timecode">4:10</span>We are counting with zeroes</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">4:10</span>We are counting with zeroes</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">4:10</span>We are counting with zeroes</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="marker" data-timestamp="543" data-ref="3">
|
||||
<div class="content"><span class="timecode">9:03</span>Revisit instructions.scala and research register-transfer level</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">9:03</span>Revisit instructions.scala and research register-transfer level</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">9:03</span>Revisit instructions.scala and research register-transfer level</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="marker" data-timestamp="955" data-ref="4">
|
||||
<div class="content"><span class="timecode">15:55</span>Come to understand how to specify that rs1 represents an immediate or a register, thanks to the reply to the "Confusion Regarding Freedom E SDK inline asm" forum thread</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">15:55</span>Come to understand how to specify that rs1 represents an immediate or a register, thanks to the reply to the "Confusion Regarding Freedom E SDK inline asm" forum thread</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">15:55</span>Come to understand how to specify that rs1 represents an immediate or a register, thanks to the reply to the "Confusion Regarding Freedom E SDK inline asm" forum thread</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="marker" data-timestamp="1105">
|
||||
<div class="content"><span class="timecode">18:25</span>Read clear_csr() to put csrrc into perspective with our new understanding of pseudo-instructions and the i vs r hints</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">18:25</span>Read clear_csr() to put csrrc into perspective with our new understanding of pseudo-instructions and the i vs r hints</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">18:25</span>Read clear_csr() to put csrrc into perspective with our new understanding of pseudo-instructions and the i vs r hints</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="marker" data-timestamp="1344" data-ref="6">
|
||||
<div class="content"><span class="timecode">22:24</span>Read about CSRRCI in the CSR Instructions section of the User-Level ISA Specification</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">22:24</span>Read about CSRRCI in the CSR Instructions section of the User-Level ISA Specification</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">22:24</span>Read about CSRRCI in the CSR Instructions section of the User-Level ISA Specification</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="marker" data-timestamp="1385">
|
||||
<div class="content"><span class="timecode">23:05</span>Walk through clear_csr() again</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">23:05</span>Walk through clear_csr() again</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">23:05</span>Walk through clear_csr() again</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="marker" data-timestamp="1733" data-ref="8">
|
||||
<div class="content"><span class="timecode">28:53</span>GNU Assembly Syntax: Constraints and Syntax</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">28:53</span>GNU Assembly Syntax: Constraints and Syntax</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">28:53</span>GNU Assembly Syntax: Constraints and Syntax</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="marker" data-timestamp="2115">
|
||||
<div class="content"><span class="timecode">35:15</span>Continue reading clear_csr()</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">35:15</span>Continue reading clear_csr()</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">35:15</span>Continue reading clear_csr()</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="marker" data-timestamp="2421" data-ref="10">
|
||||
<div class="content"><span class="timecode">40:21</span>Pop back up to the top of the stack, to reset_demo(), and read about the currently allocated RISC-V machine-level CSR addresses</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">40:21</span>Pop back up to the top of the stack, to reset_demo(), and read about the currently allocated RISC-V machine-level CSR addresses</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">40:21</span>Pop back up to the top of the stack, to reset_demo(), and read about the currently allocated RISC-V machine-level CSR addresses</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="marker" data-timestamp="2651">
|
||||
<div class="content"><span class="timecode">44:11</span>Read about Machine Interrupt Registers, including the mie (machine interrupt-enable) register</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">44:11</span>Read about Machine Interrupt Registers, including the mie (machine interrupt-enable) register</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">44:11</span>Read about Machine Interrupt Registers, including the mie (machine interrupt-enable) register</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="marker" data-timestamp="2966">
|
||||
<div class="content"><span class="timecode">49:26</span>Note how common it is in plic_driver.c for us to compute an address of a memory mapped register in order to mess with interrupts</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">49:26</span>Note how common it is in plic_driver.c for us to compute an address of a memory mapped register in order to mess with interrupts</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">49:26</span>Note how common it is in plic_driver.c for us to compute an address of a memory mapped register in order to mess with interrupts</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="marker" data-timestamp="3105">
|
||||
<div class="content"><span class="timecode">51:45</span>A few words on the sponge mode that we're in</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">51:45</span>A few words on the sponge mode that we're in</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">51:45</span>A few words on the sponge mode that we're in</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="marker" data-timestamp="3170">
|
||||
<div class="content"><span class="timecode">52:50</span>Continue reading about the Machine Interrupt Registers</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">52:50</span>Continue reading about the Machine Interrupt Registers</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">52:50</span>Continue reading about the Machine Interrupt Registers</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="marker" data-timestamp="3513">
|
||||
<div class="content"><span class="timecode">58:33</span>Return to demo_gpio.c and come to understand the clear_csr() calls in relation to the documentation</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">58:33</span>Return to demo_gpio.c and come to understand the clear_csr() calls in relation to the documentation</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">58:33</span>Return to demo_gpio.c and come to understand the clear_csr() calls in relation to the documentation</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="marker" data-timestamp="4008">
|
||||
<div class="content"><span class="timecode">1:06:48</span>We're out of time for today</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">1:06:48</span>We're out of time for today</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">1:06:48</span>We're out of time for today</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
var player = new Player(document.querySelector(".player_container"), onRefChanged);
|
||||
window.addEventListener("resize", function() { player.updateSize(); });
|
||||
document.addEventListener("keypress", function(ev) {
|
||||
switch (ev.key) {
|
||||
case 'n':
|
||||
case 'd':
|
||||
case 's': {
|
||||
player.jumpToNextMarker();
|
||||
} break;
|
||||
|
||||
<div class="marker" data-timestamp="41" data-ref="0">
|
||||
<div class="content"><span class="timecode">0:41</span>"It seems like, as you get older, the years start to go by like weeks"</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">0:41</span>"It seems like, as you get older, the years start to go by like weeks"</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">0:41</span>"It seems like, as you get older, the years start to go by like weeks"</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="marker" data-timestamp="61" data-ref="1">
|
||||
<div class="content"><span class="timecode">1:01</span>Recommend Code by Charles Petzold</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">1:01</span>Recommend Code by Charles Petzold</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">1:01</span>Recommend Code by Charles Petzold</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="marker" data-timestamp="303">
|
||||
<div class="content"><span class="timecode">5:03</span>Using an electromagnet with a telegraph to communicate in Morse code</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">5:03</span>Using an electromagnet with a telegraph to communicate in Morse code</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">5:03</span>Using an electromagnet with a telegraph to communicate in Morse code</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="marker" data-timestamp="596">
|
||||
<div class="content"><span class="timecode">9:56</span>Adder circuit</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">9:56</span>Adder circuit</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">9:56</span>Adder circuit</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="marker" data-timestamp="1082" data-ref="2">
|
||||
<div class="content"><span class="timecode">18:02</span>Research logic gates</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">18:02</span>Research logic gates</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">18:02</span>Research logic gates</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="marker" data-timestamp="1167">
|
||||
<div class="content"><span class="timecode">19:27</span>XOR</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">19:27</span>XOR</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">19:27</span>XOR</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="marker" data-timestamp="1538">
|
||||
<div class="content"><span class="timecode">25:38</span>Redraw the tables</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">25:38</span>Redraw the tables</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">25:38</span>Redraw the tables</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="marker" data-timestamp="1681">
|
||||
<div class="content"><span class="timecode">28:01</span>What an XOR gate will do when the carry is off</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">28:01</span>What an XOR gate will do when the carry is off</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">28:01</span>What an XOR gate will do when the carry is off</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="marker" data-timestamp="2007">
|
||||
<div class="content"><span class="timecode">33:27</span>Propagating the carry through our circuit</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">33:27</span>Propagating the carry through our circuit</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">33:27</span>Propagating the carry through our circuit</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="marker" data-timestamp="2218" data-ref="3">
|
||||
<div class="content"><span class="timecode">36:58</span>Consult Wikipedia for a ripple carry adder</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">36:58</span>Consult Wikipedia for a ripple carry adder</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">36:58</span>Consult Wikipedia for a ripple carry adder</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="marker" data-timestamp="2338">
|
||||
<div class="content"><span class="timecode">38:58</span>This circuit does 1 bit of the adder computation</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">38:58</span>This circuit does 1 bit of the adder computation</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">38:58</span>This circuit does 1 bit of the adder computation</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="marker" data-timestamp="2485">
|
||||
<div class="content"><span class="timecode">41:25</span>Subtraction circuit</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">41:25</span>Subtraction circuit</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">41:25</span>Subtraction circuit</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="marker" data-timestamp="2686">
|
||||
<div class="content"><span class="timecode">44:46</span>Agreeing on an encoding in order to communicate useful information</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">44:46</span>Agreeing on an encoding in order to communicate useful information</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">44:46</span>Agreeing on an encoding in order to communicate useful information</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="marker" data-timestamp="2793" data-ref="4">
|
||||
<div class="content"><span class="timecode">46:33</span>"You can quote whatever you like, Miblo"</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">46:33</span>"You can quote whatever you like, Miblo"</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">46:33</span>"You can quote whatever you like, Miblo"</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="marker" data-timestamp="2886" data-ref="5">
|
||||
<div class="content"><span class="timecode">48:06</span>Start with looking at ones' complement</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">48:06</span>Start with looking at ones' complement</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">48:06</span>Start with looking at ones' complement</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="marker" data-timestamp="3268" data-ref="6">
|
||||
<div class="content"><span class="timecode">54:28</span>Go to two's complement</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">54:28</span>Go to two's complement</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">54:28</span>Go to two's complement</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="marker" data-timestamp="3552">
|
||||
<div class="content"><span class="timecode">59:12</span>Using both ones' complement and two's complement to enable our circuit to perform subtraction</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">59:12</span>Using both ones' complement and two's complement to enable our circuit to perform subtraction</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">59:12</span>Using both ones' complement and two's complement to enable our circuit to perform subtraction</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="marker" data-timestamp="3883" data-ref="7">
|
||||
<div class="content"><span class="timecode">1:04:43</span>GCC's "Statements and Declarations in Expressions" Extension</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">1:04:43</span>GCC's "Statements and Declarations in Expressions" Extension</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">1:04:43</span>GCC's "Statements and Declarations in Expressions" Extension</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="marker" data-timestamp="3972">
|
||||
<div class="content"><span class="timecode">1:06:12</span>That's all for now</div>
|
||||
<div class="progress faded">
|
||||
<div class="content"><span class="timecode">1:06:12</span>That's all for now</div>
|
||||
</div>
|
||||
<div class="progress main">
|
||||
<div class="content"><span class="timecode">1:06:12</span>That's all for now</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
var player = new Player(document.querySelector(".player_container"));
|
||||
window.addEventListener("resize", function() { player.updateSize(); });
|
||||
document.addEventListener("keypress", function(ev) {
|
||||
switch (ev.key) {
|
||||
case 'n':
|
||||
case 'd':
|
||||
case 's': {
|
||||
player.jumpToNextMarker();
|
||||
} break;
|
||||
|
||||
case 'p':
|
||||
case 'a':
|
||||
case 'w': {
|
||||
player.jumpToPrevMarker();
|
||||
} break;
|
||||
case 'p':
|
||||
case 'a':
|
||||
case 'w': {
|
||||
player.jumpToPrevMarker();
|
||||
} break;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
||||
var refTimecodes = document.querySelectorAll(".refs .ref .timecode");
|
||||
for (var i = 0; i < refTimecodes.length; ++i) {
|
||||
refTimecodes[i].addEventListener("click", function(ev) {
|
||||
if (player) {
|
||||
var time = ev.currentTarget.getAttribute("data-timestamp");
|
||||
player.setTime(parseInt(time, 10));
|
||||
player.play();
|
||||
ev.preventDefault();
|
||||
return false;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var refSources = document.querySelectorAll(".refs .ref");
|
||||
for (var i = 0; i < refSources.length; ++i) {
|
||||
refSources[i].addEventListener("click", function(ev) {
|
||||
if (player) {
|
||||
player.pause();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function onRefChanged(ref) {
|
||||
if (ref !== undefined && ref !== null) {
|
||||
document.querySelector(".refs_container").classList.add("current");
|
||||
var refs = document.querySelectorAll(".refs .ref");
|
||||
for (var i = 0; i < refs.length; ++i) {
|
||||
var dataID = refs[i].getAttribute("data-id");
|
||||
if (ref == dataID) {
|
||||
refs[i].classList.add("current");
|
||||
} else {
|
||||
refs[i].classList.remove("current");
|
||||
}
|
||||
}
|
||||
} else {
|
||||
document.querySelector(".refs_container").classList.remove("current");
|
||||
var refs = document.querySelectorAll(".refs .ref");
|
||||
for (var i = 0; i < refs.length; ++i) {
|
||||
refs[i].classList.remove("current");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -39,6 +39,8 @@ function Player(htmlContainer, refsCallback) {
|
|||
this.youtubePlayerReady = false;
|
||||
this.playing = false;
|
||||
this.shouldPlay = false;
|
||||
this.buffering = false;
|
||||
this.pauseAfterBuffer = false;
|
||||
this.speed = 1;
|
||||
this.currentTime = 0;
|
||||
this.lastFrameTime = 0;
|
||||
|
|
@ -75,6 +77,8 @@ Player.prototype.pause = function() {
|
|||
if (this.youtubePlayerReady) {
|
||||
if (this.playing) {
|
||||
this.youtubePlayer.pauseVideo();
|
||||
} else if (this.buffering) {
|
||||
this.pauseAfterBuffer = true;
|
||||
}
|
||||
} else {
|
||||
this.shouldPlay = false;
|
||||
|
|
@ -365,6 +369,12 @@ Player.prototype.onYoutubePlayerStateChange = function(ev) {
|
|||
} else {
|
||||
this.playing = false;
|
||||
}
|
||||
|
||||
this.buffering = ev.data == YT.PlayerState.BUFFERING;
|
||||
if (this.playing && this.pauseAfterBuffer) {
|
||||
this.pauseAfterBuffering = false;
|
||||
this.pause();
|
||||
}
|
||||
};
|
||||
|
||||
Player.prototype.onYoutubePlayerPlaybackRateChange = function(ev) {
|
||||
|
|
|
|||
Loading…
Reference in New Issue