Widget:Interrupt: Difference between revisions
From COMP15212 Wiki
W81054ch [PHRhYmxlIGNsYXNzPSJ0d3BvcHVwIj48dHI+PHRkIGNsYXNzPSJ0d3BvcHVwLWVudHJ5dGl0bGUiPkdyb3Vwczo8L3RkPjx0ZD51c2VyPGJyIC8+YnVyZWF1Y3JhdDxiciAvPmludGVyZmFjZS1hZG1pbjxiciAvPnN5c29wPGJyIC8+PC90ZD48L3RyPjwvdGFibGU+] (talk | contribs) m (1 revision imported) |
W81054ch [PHRhYmxlIGNsYXNzPSJ0d3BvcHVwIj48dHI+PHRkIGNsYXNzPSJ0d3BvcHVwLWVudHJ5dGl0bGUiPkdyb3Vwczo8L3RkPjx0ZD51c2VyPGJyIC8+YnVyZWF1Y3JhdDxiciAvPmludGVyZmFjZS1hZG1pbjxiciAvPnN5c29wPGJyIC8+PC90ZD48L3RyPjwvdGFibGU+] (talk | contribs) m (1 revision imported) |
||
(3 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
<noinclude> | <noinclude> | ||
This widget demonstrates the operation of an interrupt handler, and what happens when interrupts are disabled. | This widget demonstrates the operation of an interrupt handler, and what happens when interrupts are disabled. | ||
[{{canonicalurl:Special:ShowWidget|widget=Interrupt}} Dark-mode widget for embedding] | |||
{{#widget:Interrupt}} | {{#widget:Interrupt}} | ||
</noinclude> | </noinclude> | ||
Line 6: | Line 9: | ||
<p><canvas id="interrupt_canvas" width="800" height="250"></canvas></p> | <p><canvas id="interrupt_canvas" width="800" height="250"></canvas></p> | ||
<script> | <script> | ||
// Set to use dark theme if the body's background color is too dark | |||
var bodyColour = window.getComputedStyle(document.querySelector('body')).getPropertyValue("background-color").match(/rgba?\((.*)\)/)[1].split(',').map(Number); | |||
var usingDarkTheme; | |||
if (bodyColour[3] === 0) | |||
usingDarkTheme = false; | |||
else | |||
usingDarkTheme = bodyColour.reduce((a, b) => a + b, 0) < 255 * 1.5; | |||
// Interactive interrupt demonstration | // Interactive interrupt demonstration | ||
const STEP_TIME = 20; | const STEP_TIME = 20; | ||
Line 153: | Line 164: | ||
ctx.save(); | ctx.save(); | ||
ctx.font = '30px Arial'; | ctx.font = '30px Arial'; | ||
ctx.fillStyle = "black"; | ctx.fillStyle = usingDarkTheme ? "white" : "black"; | ||
ctx.fillText("Interrupt demonstration", 200, 30); | ctx.fillText("Interrupt demonstration", 200, 30); | ||
ctx.restore(); | ctx.restore(); | ||
Line 163: | Line 174: | ||
ctx.save(); | ctx.save(); | ||
ctx.font = '15px Arial'; | ctx.font = '15px Arial'; | ||
ctx.fillStyle = "black"; | ctx.fillStyle = usingDarkTheme ? "white" : "black"; | ||
ctx.fillText(" Normal", x - text_x_displacement, y + 5 - 21); | ctx.fillText(" Normal", x - text_x_displacement, y + 5 - 21); | ||
ctx.fillText(" execution", x - text_x_displacement, y + 5 - 7); | ctx.fillText(" execution", x - text_x_displacement, y + 5 - 7); | ||
Line 175: | Line 186: | ||
ctx.save(); // save state | ctx.save(); // save state | ||
ctx.beginPath(); | ctx.beginPath(); | ||
ctx.strokeStyle = "black"; | ctx.strokeStyle = usingDarkTheme ? "white" : "black"; | ||
ctx.lineWidth = 1; | ctx.lineWidth = 1; | ||
ctx.beginPath(); | ctx.beginPath(); | ||
Line 201: | Line 212: | ||
ctx.save(); | ctx.save(); | ||
ctx.font = '15px Arial'; | ctx.font = '15px Arial'; | ||
ctx.fillStyle = "black"; | ctx.fillStyle = usingDarkTheme ? "white" : "black"; | ||
ctx.fillText("Request", PEND_X - 27, PEND_Y - 12); | ctx.fillText("Request", PEND_X - 27, PEND_Y - 12); | ||
ctx.fillText("Pending", PEND_X - 27, PEND_Y + 22); | ctx.fillText("Pending", PEND_X - 27, PEND_Y + 22); | ||
Line 215: | Line 226: | ||
context.fill(); | context.fill(); | ||
if (stroke > 0) { | if (stroke > 0) { | ||
context.strokeStyle = "black"; | context.strokeStyle = usingDarkTheme ? "white" : "black"; | ||
context.lineWidth = stroke; | context.lineWidth = stroke; | ||
context.stroke(); | context.stroke(); |
Latest revision as of 07:22, 14 August 2019
This widget demonstrates the operation of an interrupt handler, and what happens when interrupts are disabled.
Dark-mode widget for embedding