Widget:Interrupt: Difference between revisions
From COMP15212 Wiki
 W81054ch [   PHRhYmxlIGNsYXNzPSJ0d3BvcHVwIj48dHI+PHRkIGNsYXNzPSJ0d3BvcHVwLWVudHJ5dGl0bGUiPkdyb3Vwczo8L3RkPjx0ZD51c2VyPGJyIC8+YnVyZWF1Y3JhdDxiciAvPmludGVyZmFjZS1hZG1pbjxiciAvPnN5c29wPGJyIC8+PC90ZD48L3RyPjwvdGFibGU+] (talk | contribs)m (1 revision imported) |
pc>Yuron No edit summary |
||
| Line 6: | Line 6: | ||
<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 161: | ||
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 171: | ||
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 183: | ||
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 209: | ||
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 223: | ||
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(); | ||
Revision as of 15:24, 13 August 2019
This widget demonstrates the operation of an interrupt handler, and what happens when interrupts are disabled.
