1
0
mirror of https://github.com/pkimpel/retro-b5500.git synced 2026-02-11 19:05:01 +00:00

Commit initial coding for console and SPO; fix minor spacing type in SYMBOL/ALGOL.

This commit is contained in:
paul
2012-12-16 16:29:22 +00:00
parent 77033f640f
commit 925bc93e59
5 changed files with 445 additions and 48 deletions

266
webUI/B5500Console.css Normal file
View File

@@ -0,0 +1,266 @@
/***********************************************************************
* retro-b5500/emulator B5500Console.css
************************************************************************
* Copyright (c) 2012, Nigel Williams and Paul Kimpel.
* Licensed under the MIT License, see http://www.opensource.org/licenses/mit-license.php
************************************************************************
* B5500 emulator Console web interface style sheet.
************************************************************************
* 2012-12-14 P.Kimpel
* Original version, from B5500DistributionAndDisplay.css.
***********************************************************************/
BODY {
position: relative;
margin: 4px}
DIV#consoleDiv {
position: relative;
width: 1052px;
height: 72px;
padding: 32px;
background-color: #666666}
DIV#SPODiv {
position: relative;
width: 1052px;
margin-top: 1em;
text-align: center}
DIV#SPOInnerDiv {
position: relative;
background-color: #FDA;
margin-left: auto;
margin-right: auto;
border-radius: 32px;
padding: 2em;
text-align: left;
width: 800px}
DIV#BurroughsLogo {
background-color: black;
position: absolute;
top: 32px;
right: 32px;
border-top: 3px solid #EEEEEE;
border-bottom: 3px solid #EEEEEE}
DIV#B5500Logo {
background-color: #EEEEEE;
font-family: Arial Narrow, Arial, Helvetica, sans-serif;
font-size: 24px;
color: #333333;
letter-spacing: 1px;
padding-left: 4px;
padding-right: 4px;
position: absolute;
top: 72px;
right: 32px}
DIV.blackButton {
background-color: black;
color: white;
font-size: 10px;
position: absolute;
top: 32px;
width: 48px;
height: 32px;
text-align: center;
padding: 2px;
border: 1px solid #DDDDDD;
border-radius: 4px}
DIV.whiteButton {
background-color: #CCCCCC;
color: black;
font-size: 10px;
position: absolute;
top: 32px;
width: 48px;
height: 32px;
text-align: center;
padding: 2px;
border: 1px solid #DDDDDD;
border-radius: 4px}
DIV.whiteLit {
background-color: white}
DIV.yellowButton {
background-color: #999900;
color: black;
font-size: 10px;
position: absolute;
top: 32px;
width: 48px;
height: 32px;
text-align: center;
padding: 2px;
border: 2px solid #DDDDDD;
border-radius: 4px}
DIV.yellowLit {
background-color: #FFFF00}
DIV.buttonCaption {
font-family: Arial Rounded, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
margin-top: 0.25em}
IMG#BurroughsLogoImage {
width: 150px;
text-align: center;
vertical-align: middle;
padding-top: 3px;
padding-bottom: 3px;
padding-left: 8px;
padding-right: 8px}
IMG#TeletypeLogo {
position: absolute;
top: 32px;
right: 64px}
BUTTON.whiteButton {
position: absolute;
background-color: #CCC;
color: black;
font-family: Arial Rounded, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
width: 60px;
height: 40px;
border: 1px solid #DDD;
border-radius: 4px}
BUTTON.blackButton {
position: absolute;
background-color: black;
color: white;
font-family: Arial Rounded, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
width: 60px;
height: 40px;
border: 1px solid #DDD;
border-radius: 4px}
BUTTON.yellowButton {
position: absolute;
background-color: #990;
color: black;
font-family: Arial Rounded, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
width: 60px;
height: 40px;
border: 1px solid #DDD;
border-radius: 4px}
BUTTON.yellowLit {
background-color: #FFFF00}
BUTTON.blackBorder {
border: 1px solid black}
BUTTON#HaltBtn {
top: 31px;
right: 1020px}
BUTTON#NotReadyBtn {
top: 31px;
right: 920px}
BUTTON#LoadSelectBtn {
top: 31px;
right: 850px}
BUTTON#LoadBtn {
top: 31px;
right: 780px}
BUTTON#MemoryCheckBtn {
top: 31px;
right: 680px}
BUTTON#ANormalBtn {
top: 31px;
right: 610px}
BUTTON#AControlBtn {
top: 31px;
right: 540px}
BUTTON#BNormalBtn {
top: 31px;
right: 470px}
BUTTON#BControlBtn {
top: 31px;
right: 400px}
BUTTON#PowerOnBtn {
top: 31px;
right: 300px}
BUTTON#PowerOffBtn {
top: 31px;
right: 230px}
BUTTON#SPOReadyBtn {
bottom: 256px;
right: 120px}
BUTTON#SPOPowerBtn {
bottom: 256px;
right: 44px}
BUTTON#SPORemoteBtn {
bottom: 200px;
right: 120px}
BUTTON#SPOLocalBtn {
bottom: 200px;
right: 44px}
BUTTON#SPOInputRequestBtn {
bottom: 144px;
right: 120px}
BUTTON#SPOEndOfMessageBtn {
bottom: 144px;
right: 44px}
BUTTON#SPOBlank1Btn {
bottom: 88px;
right: 120px}
BUTTON#SPOErrorBtn {
bottom: 88px;
right: 44px}
BUTTON#SPOBlank2Btn {
bottom: 32px;
right: 120px}
BUTTON#SPOBlank3Btn {
bottom: 32px;
right: 44px}
TEXTAREA#SPOUT {
width: 620px;
/*
font-family: Lucida Sans Typewriter, Courier New, Courier, monospace;
font-size: 10pt */ }
.center {
text-align: center}
.data {
font-family: Courier New, Courier, monospace;
text-align: left}
.number {
font-family: Courier New, Courier, monospace;
text-align: right}

View File

@@ -5,7 +5,7 @@
<meta name="Author" content="Nigel Williams & Paul Kimpel">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<meta http-equiv="Content-Style-Type" content="text/css">
<link id=defaultStyleSheet rel=stylesheet type="text/css" href="B5500DistributionAndDisplay.css">
<link id=defaultStyleSheet rel=stylesheet type="text/css" href="B5500Console.css">
<script>
var paPanel;
@@ -84,57 +84,48 @@ var PowerOffBtn_Click = function() {
</script>
</head>
<body class=consoleBody>
<body>
<div style="position:relative; width:1300px; height:128px">
<div id=consoleDiv>
<button id=HaltBtn class=blackButton>HALT</button>
<div id=HaltBtn class=blackButton style="right:1200px">
<div class=buttonCaption style="margin-top:1em">HALT</div>
<button id=NotReadyBtn class=yellowButton>NOT READY</button>
<button id=LoadSelectBtn class=blackButton>LOAD SELECT</button>
<button id=LoadBtn class=blackButton>LOAD</button>
<button id=MemoryCheckBtn class=yellowButton>MEMORY CHECK</button>
<button id=ANormalBtn class=yellowButton>A NORMAL</button>
<button id=AControlBtn class=yellowButton>A CONTROL</button>
<button id=BNormalBtn class=yellowButton>B NORMAL</button>
<button id=BControlBtn class=yellowButton>B CONTROL</button>
<button id=PowerOnBtn class=whiteButton
onclick="return PowerOnBtn_Click()">POWER<br>ON</button>
<button id=PowerOffBtn class=blackButton
onclick="return PowerOffBtn_Click()">POWER OFF</button>
<div id=BurroughsLogo>
<img id=BurroughsLogoImage src="Burroughs-Logo-Neg.jpg">
</div>
<div id=B5500Logo> B 5500 </div>
</div>
<div id=NotReadyBtn class=yellowButton style="right:1050px">
<div class=buttonCaption>NOT READY</div>
<div id=SPODiv>
<div id=SPOInnerDiv>
<img id=TeletypeLogo src="TeletypeLogo.gif">
<textarea id=SPOUT rows=30 cols=73 ></textarea>
<button id=SPOReadyBtn class="yellowButton blackBorder yellowLit">READY</button>
<button id=SPOPowerBtn class=blackButton>POWER</button>
<button id=SPORemoteBtn class="yellowButton blackBorder">REMOTE</button>
<button id=SPOLocalBtn class="yellowButton blackBorder">LOCAL</button>
<button id=SPOInputRequestBtn class="yellowButton blackBorder">INPUT<br>REQUEST</button>
<button id=SPOEndOfMessageBtn class="yellowButton blackBorder">END OF<br>MESSAGE</button>
<button id=SPOBlank1Btn class="yellowButton blackBorder"></button>
<button id=SPOErrorBtn class="yellowButton blackBorder">ERROR</button>
<button id=SPOBlank2Btn class="yellowButton blackBorder"></button>
<button id=SPOBlank3Btn class="yellowButton blackBorder"></button>
</div>
</div>
<div id=LoadSelectBtn class=blackButton style="right:975px">
<div class=buttonCaption>LOAD SELECT</div>
</div>
<div id=LoadBtn class=blackButton style="right:900px">
<div class=buttonCaption style="margin-top:1em">LOAD</div>
</div>
<div id=MemoryCheckBtn class=yellowButton style="right:750px">
<div class=buttonCaption>MEMORY CHECK</div>
</div>
<div id=ANormalBtn class=yellowButton style="right:675px">
<div class=buttonCaption>A NORMAL</div>
</div>
<div id=AControlBtn class=yellowButton style="right:600px">
<div class=buttonCaption>A CONTROL</div>
</div>
<div id=BNormalBtn class=yellowButton style="right:525px">
<div class=buttonCaption>B NORMAL</div>
</div>
<div id=BControlBtn class=yellowButton style="right:450px">
<div class=buttonCaption>B CONTROL</div>
</div>
<div id=PowerOnBtn class=whiteButton style="right:300px"
onclick="return PowerOnBtn_Click()">
<div class=buttonCaption>POWER ON</div>
</div>
<div id=PowerOffBtn class=blackButton style="right:225px"
onclick="return PowerOffBtn_Click()">
<div class=buttonCaption>POWER OFF</div>
</div>
<div id=BurroughsLogo>
<img id=BurroughsLogoImage src="Burroughs-Logo-Neg.jpg">
</div>
<div id=B5500Logo> B 5500 </div>
</div>
<p class=center>(Click the <b>Power On</b> button)</p>
</body>
</html>

140
webUI/B5500ConsoleDemo.html Normal file
View File

@@ -0,0 +1,140 @@
<!DOCTYPE html>
<head>
<title>B5500 Emulator Operator Console Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Author" content="Nigel Williams & Paul Kimpel">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<meta http-equiv="Content-Style-Type" content="text/css">
<link id=defaultStyleSheet rel=stylesheet type="text/css" href="B5500DistributionAndDisplay.css">
<script>
var paPanel;
var paState = 0;
var paTimer = null;
var pbState = 0;
var pbTimer = null;
var PAStateChange = function() {
var aNormal = document.getElementById("ANormalBtn");
var aControl = document.getElementById("AControlBtn");
var delay = Math.random();
if (paState || !pbState) { // PA will go to Normal State onlyl if PB is already in Normal State
paState = 0;
aNormal.className = "yellowButton";
aControl.className = "yellowButton yellowLit";
delay = Math.log(delay+1)*250;
} else {
paState = 1;
aNormal.className = "yellowButton yellowLit";
aControl.className = "yellowButton";
delay = Math.log(2-delay)*delay*250;
}
paTimer = setTimeout(PAStateChange, delay);
};
var PBStateChange = function() {
var bNormal = document.getElementById("BNormalBtn");
var delay = Math.random();
if (pbState) {
pbState = 0;
bNormal.className = "yellowButton";
delay = Math.log(delay+1)*1000;
} else {
pbState = 1;
bNormal.className = "yellowButton yellowLit";
delay = Math.log(2-delay)*delay*delay*1000;
}
pbTimer = setTimeout(PBStateChange, delay);
};
var PowerOnBtn_Click = function() {
document.getElementById("PowerOnBtn").className = "whiteButton whiteLit";
document.getElementById("AControlBtn").className = "yellowButton yellowLit";
paState = pbState = 0;
paTimer = setTimeout(PAStateChange, 3000);
pbTimer = setTimeout(PBStateChange, 10000);
if (!paPanel) {
paPanel = window.open("B5500ProcessorPanel.html", "PAPanel", "resizable=yes,scrollbars=yes,width=1,height=1");
}
return true;
};
var PowerOffBtn_Click = function() {
paState = pbSate = 0;
document.getElementById("PowerOnBtn").className = "whiteButton";
document.getElementById("ANormalBtn").className = "yellowButton";
document.getElementById("AControlBtn").className = "yellowButton";
document.getElementById("BNormalBtn").className = "yellowButton";
if (paPanel) {
paPanel.close();
paPanel = null;
}
if (paTimer) {
clearTimeout(paTimer);
paTimer = null;
}
if (pbTimer) {
clearTimeout(pbTimer);
pbTimer = null;
}
return true;
};
</script>
</head>
<body class=consoleBody>
<div style="position:relative; width:1300px; height:128px">
<div id=HaltBtn class=blackButton style="right:1200px">
<div class=buttonCaption style="margin-top:1em">HALT</div>
</div>
<div id=NotReadyBtn class=yellowButton style="right:1050px">
<div class=buttonCaption>NOT READY</div>
</div>
<div id=LoadSelectBtn class=blackButton style="right:975px">
<div class=buttonCaption>LOAD SELECT</div>
</div>
<div id=LoadBtn class=blackButton style="right:900px">
<div class=buttonCaption style="margin-top:1em">LOAD</div>
</div>
<div id=MemoryCheckBtn class=yellowButton style="right:750px">
<div class=buttonCaption>MEMORY CHECK</div>
</div>
<div id=ANormalBtn class=yellowButton style="right:675px">
<div class=buttonCaption>A NORMAL</div>
</div>
<div id=AControlBtn class=yellowButton style="right:600px">
<div class=buttonCaption>A CONTROL</div>
</div>
<div id=BNormalBtn class=yellowButton style="right:525px">
<div class=buttonCaption>B NORMAL</div>
</div>
<div id=BControlBtn class=yellowButton style="right:450px">
<div class=buttonCaption>B CONTROL</div>
</div>
<div id=PowerOnBtn class=whiteButton style="right:300px"
onclick="return PowerOnBtn_Click()">
<div class=buttonCaption>POWER ON</div>
</div>
<div id=PowerOffBtn class=blackButton style="right:225px"
onclick="return PowerOffBtn_Click()">
<div class=buttonCaption>POWER OFF</div>
</div>
<div id=BurroughsLogo>
<img id=BurroughsLogoImage src="Burroughs-Logo-Neg.jpg">
</div>
<div id=B5500Logo> B 5500 Demo </div>
</div>
<p class=center>(Click the <b>Power On</b> button)</p>
</body>
</html>

View File

@@ -16,7 +16,7 @@ TD {
<script src="../emulator/B5500CentralControl.js"></script>
<script>
var displayRefreshPeriod = 50; // milliseconds
var displayRefreshPeriod = 1000/60; // milliseconds
var nextRefresh = 0;
var refreshTimer = null;

BIN
webUI/TeletypeLogo.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB