mirror of
https://github.com/pkimpel/retro-220.git
synced 2026-01-13 15:18:24 +00:00
f891d5198d
1. Initial implementation of integer and floating arithmetics, RND (16), and EXT (17) (not fully tested yet). 2. Implement Console Keyboard, integration with main Console, and KAD (08) instruction. 3. Implement BCS (38). 4. Correct S-to-C and S-to-P stop detection. 5. Improvements to lamp glow computation and management. 6. Implement right-hand clear bars on Console registers.
613 lines
16 KiB
CSS
613 lines
16 KiB
CSS
/***********************************************************************
|
|
* retro-220/webUI B220ControlConsole.css
|
|
************************************************************************
|
|
* Copyright (c) 2017, Paul Kimpel.
|
|
* Licensed under the MIT License, see
|
|
* http://www.opensource.org/licenses/mit-license.php
|
|
************************************************************************
|
|
* Burroughs 220 Emulator Control Console style sheet.
|
|
************************************************************************
|
|
* 2017-01-01 P.Kimpel
|
|
* Original version, from D205SupervisoryPanel.css
|
|
***********************************************************************/
|
|
|
|
#BurroughsLogo {
|
|
position: absolute;
|
|
left: 12px;
|
|
top: 6px;
|
|
height: 36px}
|
|
|
|
#BurroughsMeatball {
|
|
position: absolute;
|
|
left: 334px;
|
|
top: 6px;
|
|
height: 36px}
|
|
|
|
#B220Logo {
|
|
position: absolute;
|
|
top: 4px;
|
|
right: 12px;
|
|
height: 36px;
|
|
line-height: 36px;
|
|
font-family: Verdana, Arial, Helvetica, DejaVuSansWeb, san-serif;
|
|
font-size: 36px;
|
|
font-weight: bold}
|
|
|
|
#IntervalTimerResetCaption {
|
|
bottom: 21px;
|
|
left: calc(50% - 206px);
|
|
width: 120px;
|
|
text-align: right}
|
|
#IntervalTimerResetBtn {
|
|
position: absolute;
|
|
box-shadow: 3px 3px 2px #999;
|
|
bottom: 12px;
|
|
left: calc(50% - 80px)}
|
|
|
|
#IntervalTimer {
|
|
position: absolute;
|
|
bottom: 12px;
|
|
left: calc(50% - 42px);
|
|
width: 84px;
|
|
height: 18px;
|
|
font-size: 18px;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 18px;
|
|
border-top: 3px solid #666;
|
|
border-left: 3px solid #666;
|
|
border-right: 3px solid #333;
|
|
border-bottom: 3px solid #333;
|
|
box-shadow: 3px 3px 2px #999;
|
|
color: white;
|
|
background-color: black}
|
|
|
|
#PowerOffBtn {
|
|
box-shadow: 3px 3px 2px #999;
|
|
left: calc(50% + 64px);
|
|
bottom: 12px}
|
|
#PowerOffCaption {
|
|
left: calc(50% + 92px);
|
|
bottom: 21px}
|
|
|
|
#VersionDiv {
|
|
right: 150px;
|
|
bottom: 18px;
|
|
color: black}
|
|
|
|
#LeftPanelBtn {
|
|
width: 100px;
|
|
left: 12px;
|
|
bottom: 12px}
|
|
#RightPanelBtn {
|
|
width: 100px;
|
|
right: 12px;
|
|
bottom: 12px}
|
|
|
|
#PanelSurface {
|
|
height: 100%;
|
|
width: 100%}
|
|
|
|
/***** Main Registers *****/
|
|
|
|
#ARegPanel {
|
|
left: 12px;
|
|
top: 48px;
|
|
width: 312px;
|
|
height: 128px}
|
|
|
|
#RRegPanel {
|
|
left: calc(50% - 156px);
|
|
top: 48px;
|
|
width: 312px;
|
|
height: 128px}
|
|
|
|
#DRegPanel {
|
|
right: 12px;
|
|
top: 48px;
|
|
width: 312px;
|
|
height: 128px}
|
|
|
|
#BRegPanel {
|
|
left: 12px;
|
|
top: 208px;
|
|
width: 144px;
|
|
height: 128px}
|
|
|
|
#PRegPanel {
|
|
left: 180px;
|
|
top: 208px;
|
|
width: 144px;
|
|
height: 128px}
|
|
|
|
#CRegPanel {
|
|
left: calc(50% - 144px);
|
|
top: 208px;
|
|
width: 288px;
|
|
height: 128px}
|
|
|
|
#ERegPanel {
|
|
right: 180px;
|
|
top: 208px;
|
|
width: 144px;
|
|
height: 128px}
|
|
|
|
#SRegPanel {
|
|
right: 12px;
|
|
top: 208px;
|
|
width: 144px;
|
|
height: 128px}
|
|
|
|
/***** Alarm Panel *****/
|
|
|
|
#AlarmPanel {
|
|
left: 12px;
|
|
top: 368px;
|
|
width: 382px;
|
|
height: 64px}
|
|
|
|
#AlarmCaption {
|
|
position: absolute;
|
|
left: 0;
|
|
width: 268px}
|
|
|
|
#NotReadyCaption {
|
|
position: absolute;
|
|
left: 266px;
|
|
right: 0}
|
|
|
|
#DigitCheckLampLabel {
|
|
left: 4px;
|
|
top: 12px}
|
|
#DigitCheckLamp {
|
|
left: 6px;
|
|
top: 32px;
|
|
box-shadow: 3px 3px 2px #000}
|
|
|
|
#ProgramCheckLampLabel {
|
|
left: 42px;
|
|
top: 12px}
|
|
#ProgramCheckLamp {
|
|
left: 44px;
|
|
top: 32px;
|
|
box-shadow: 3px 3px 2px #000}
|
|
|
|
#StorageLampLabel {
|
|
left: 80px;
|
|
top: 12px}
|
|
#StorageLamp {
|
|
left: 82px;
|
|
top: 32px;
|
|
box-shadow: 3px 3px 2px #000}
|
|
|
|
#MagneticTapeLampLabel {
|
|
left: 118px;
|
|
top: 12px}
|
|
#MagneticTapeLamp {
|
|
left: 120px;
|
|
top: 32px;
|
|
box-shadow: 3px 3px 2px #000}
|
|
|
|
#CardatronLampLabel {
|
|
left: 156px;
|
|
top: 12px}
|
|
#CardatronLamp {
|
|
left: 158px;
|
|
top: 32px;
|
|
box-shadow: 3px 3px 2px #000}
|
|
|
|
#PaperTapeLampLabel {
|
|
left: 194px;
|
|
top: 12px}
|
|
#PaperTapeLamp {
|
|
left: 196px;
|
|
top: 32px;
|
|
box-shadow: 3px 3px 2px #000}
|
|
|
|
#HighSpeedPrinterLampLabel {
|
|
left: 232px;
|
|
top: 12px}
|
|
#HighSpeedPrinterLamp {
|
|
left: 234px;
|
|
top: 32px;
|
|
box-shadow: 3px 3px 2px #000}
|
|
|
|
#Blank1LampLabel {
|
|
left: 270px;
|
|
top: 12px}
|
|
|
|
#SystemNotReadyLampLabel {
|
|
left: 308px;
|
|
top: 12px}
|
|
#SystemNotReadyLamp {
|
|
left: 310px;
|
|
top: 32px;
|
|
box-shadow: 3px 3px 2px #000}
|
|
|
|
#ComputerNotReadyLampLabel {
|
|
left: 346px;
|
|
top: 12px}
|
|
#ComputerNotReadyLamp {
|
|
left: 348px;
|
|
top: 32px;
|
|
box-shadow: 3px 3px 2px #000}
|
|
|
|
/***** Operation Panel *****/
|
|
|
|
#OperationPanel {
|
|
left: calc(50% - 77px);
|
|
top: 368px;
|
|
width: 154px;
|
|
height: 64px}
|
|
|
|
#OperationCaption {
|
|
position: absolute;
|
|
left: 0;
|
|
width: 268px}
|
|
|
|
#RunLampLabel {
|
|
left: 4px;
|
|
top: 12px}
|
|
#RunLamp {
|
|
left: 6px;
|
|
top: 32px;
|
|
box-shadow: 3px 3px 2px #000}
|
|
|
|
#FetchLampLabel {
|
|
left: 42px;
|
|
top: 12px}
|
|
#FetchLamp {
|
|
left: 44px;
|
|
top: 32px;
|
|
box-shadow: 3px 3px 2px #000}
|
|
|
|
#ExecuteLampLabel {
|
|
left: 80px;
|
|
top: 12px}
|
|
#ExecuteLamp {
|
|
left: 82px;
|
|
top: 32px;
|
|
box-shadow: 3px 3px 2px #000}
|
|
|
|
#Blank2LampLabel {
|
|
left: 118px;
|
|
top: 12px}
|
|
|
|
/***** Status Panel *****/
|
|
|
|
#StatusPanel {
|
|
right: 12px;
|
|
top: 368px;
|
|
width: 382px;
|
|
height: 64px}
|
|
|
|
#ComparisonCaption {
|
|
position: absolute;
|
|
left: 114px;
|
|
width: 116px}
|
|
|
|
#OverflowLampLabel {
|
|
left: 4px;
|
|
top: 12px}
|
|
#OverflowLamp {
|
|
left: 6px;
|
|
top: 32px;
|
|
box-shadow: 3px 3px 2px #000}
|
|
|
|
#RepeatLampLabel {
|
|
left: 42px;
|
|
top: 12px}
|
|
#RepeatLamp {
|
|
left: 44px;
|
|
top: 32px;
|
|
box-shadow: 3px 3px 2px #000}
|
|
|
|
#Blank3LampLabel {
|
|
left: 80px;
|
|
top: 12px}
|
|
|
|
#LowLampLabel {
|
|
left: 118px;
|
|
top: 12px}
|
|
#LowLamp {
|
|
left: 120px;
|
|
top: 32px;
|
|
box-shadow: 3px 3px 2px #000}
|
|
|
|
#EqualLampLabel {
|
|
left: 156px;
|
|
top: 12px}
|
|
#EqualLamp {
|
|
left: 158px;
|
|
top: 32px;
|
|
box-shadow: 3px 3px 2px #000}
|
|
|
|
#HighLampLabel {
|
|
left: 194px;
|
|
top: 12px}
|
|
#HighLamp {
|
|
left: 196px;
|
|
top: 32px;
|
|
box-shadow: 3px 3px 2px #000}
|
|
|
|
#Blank4LampLabel {
|
|
left: 232px;
|
|
top: 12px}
|
|
|
|
#Blank5LampLabel {
|
|
left: 270px;
|
|
top: 12px}
|
|
|
|
#Blank6LampLabel {
|
|
left: 308px;
|
|
top: 12px}
|
|
|
|
#Blank7LampLabel {
|
|
left: 346px;
|
|
top: 12px}
|
|
|
|
/***** Control Switch Panel *****/
|
|
|
|
#ControlSwitchPanel {
|
|
left: 12px;
|
|
top: 464px;
|
|
width: 382px;
|
|
height: 80px}
|
|
|
|
#ControlSwitch1Label {
|
|
left: 4px;
|
|
top: 12px}
|
|
#ControlSwitch1 {
|
|
position: absolute;
|
|
left: 4px;
|
|
top: 40px;
|
|
height: 32px;
|
|
width: 32px}
|
|
|
|
#ControlSwitch2Label {
|
|
left: 42px;
|
|
top: 12px}
|
|
#ControlSwitch2 {
|
|
position: absolute;
|
|
left: 42px;
|
|
top: 40px;
|
|
height: 32px;
|
|
width: 32px}
|
|
|
|
#ControlSwitch3Label {
|
|
left: 80px;
|
|
top: 12px}
|
|
#ControlSwitch3 {
|
|
position: absolute;
|
|
left: 80px;
|
|
top: 40px;
|
|
height: 32px;
|
|
width: 32px}
|
|
|
|
#ControlSwitch4Label {
|
|
left: 118px;
|
|
top: 12px}
|
|
#ControlSwitch4 {
|
|
position: absolute;
|
|
left: 118px;
|
|
top: 40px;
|
|
height: 32px;
|
|
width: 32px}
|
|
|
|
#ControlSwitch5Label {
|
|
left: 156px;
|
|
top: 12px}
|
|
#ControlSwitch5 {
|
|
position: absolute;
|
|
left: 156px;
|
|
top: 40px;
|
|
height: 32px;
|
|
width: 32px}
|
|
|
|
#ControlSwitch6Label {
|
|
left: 194px;
|
|
top: 12px}
|
|
#ControlSwitch6 {
|
|
position: absolute;
|
|
left: 194px;
|
|
top: 40px;
|
|
height: 32px;
|
|
width: 32px}
|
|
|
|
#ControlSwitch7Label {
|
|
left: 232px;
|
|
top: 12px}
|
|
#ControlSwitch7 {
|
|
position: absolute;
|
|
left: 232px;
|
|
top: 40px;
|
|
height: 32px;
|
|
width: 32px}
|
|
|
|
#ControlSwitch8Label {
|
|
left: 270px;
|
|
top: 12px}
|
|
#ControlSwitch8 {
|
|
position: absolute;
|
|
left: 270px;
|
|
top: 40px;
|
|
height: 32px;
|
|
width: 32px}
|
|
|
|
#ControlSwitch9Label {
|
|
left: 308px;
|
|
top: 12px}
|
|
#ControlSwitch9 {
|
|
position: absolute;
|
|
left: 308px;
|
|
top: 40px;
|
|
height: 32px;
|
|
width: 32px}
|
|
|
|
#ControlSwitch10Label {
|
|
left: 346px;
|
|
top: 12px}
|
|
#ControlSwitch10 {
|
|
position: absolute;
|
|
left: 346px;
|
|
top: 40px;
|
|
height: 32px;
|
|
width: 32px}
|
|
|
|
/***** Operation Switch Panel *****/
|
|
|
|
#OperationSwitchPanel {
|
|
left: calc(50% - 77px);
|
|
top: 464px;
|
|
width: 154px;
|
|
height: 80px}
|
|
|
|
#StopSwitchLabel {
|
|
left: 4px;
|
|
top: 12px}
|
|
#StopSwitch {
|
|
position: absolute;
|
|
left: 4px;
|
|
top: 40px;
|
|
height: 32px;
|
|
width: 32px}
|
|
|
|
#StartSwitchLabel {
|
|
left: 42px;
|
|
top: 12px}
|
|
#StartSwitch {
|
|
position: absolute;
|
|
left: 42px;
|
|
top: 40px;
|
|
height: 32px;
|
|
width: 32px}
|
|
|
|
#StepSwitchLabel {
|
|
left: 80px;
|
|
top: 12px}
|
|
#StepSwitch {
|
|
position: absolute;
|
|
left: 80px;
|
|
top: 40px;
|
|
height: 32px;
|
|
width: 32px}
|
|
|
|
#ClearSwitchLabel {
|
|
left: 118px;
|
|
top: 12px}
|
|
#ClearSwitch {
|
|
position: absolute;
|
|
left: 118px;
|
|
top: 40px;
|
|
height: 32px;
|
|
width: 32px}
|
|
|
|
/***** Miscellaneous Switch Panel *****/
|
|
|
|
#MiscellaneousSwitchPanel {
|
|
right: 12px;
|
|
top: 464px;
|
|
width: 382px;
|
|
height: 80px}
|
|
|
|
#ProgramCheckingCaption {
|
|
position: absolute;
|
|
left: 114px;
|
|
width: 192px}
|
|
|
|
#Blank10SwitchLabel {
|
|
left: 4px;
|
|
top: 12px}
|
|
|
|
#Blank11SwitchLabel {
|
|
left: 42px;
|
|
top: 12px}
|
|
|
|
#Blank12SwitchLabel {
|
|
left: 80px;
|
|
top: 12px}
|
|
|
|
#KeyboardSwitchLabel {
|
|
left: 118px;
|
|
top: 12px}
|
|
#KeyboardSwitch {
|
|
position: absolute;
|
|
left: 118px;
|
|
top: 40px;
|
|
height: 32px;
|
|
width: 32px}
|
|
|
|
#SOnSwitchLabel {
|
|
left: 156px;
|
|
top: 12px}
|
|
#SOnSwitch {
|
|
position: absolute;
|
|
left: 156px;
|
|
top: 40px;
|
|
height: 32px;
|
|
width: 32px}
|
|
|
|
#UnitsSwitchLabel {
|
|
left: 194px;
|
|
top: 12px}
|
|
#UnitsSwitch {
|
|
position: absolute;
|
|
left: 194px;
|
|
top: 40px;
|
|
height: 32px;
|
|
width: 32px}
|
|
|
|
#SToPSwitchLabel {
|
|
left: 232px;
|
|
top: 12px}
|
|
#SToPSwitch {
|
|
position: absolute;
|
|
left: 232px;
|
|
top: 40px;
|
|
height: 32px;
|
|
width: 32px}
|
|
|
|
#SToCSwitchLabel {
|
|
left: 270px;
|
|
top: 12px}
|
|
#SToCSwitch {
|
|
position: absolute;
|
|
left: 270px;
|
|
top: 40px;
|
|
height: 32px;
|
|
width: 32px}
|
|
|
|
#ResetTransferSwitchLabel {
|
|
left: 308px;
|
|
top: 12px}
|
|
#ResetTransferSwitch {
|
|
position: absolute;
|
|
left: 308px;
|
|
top: 40px;
|
|
height: 32px;
|
|
width: 32px}
|
|
|
|
#TCUClearSwitchLabel {
|
|
left: 346px;
|
|
top: 12px}
|
|
#TCUClearSwitch {
|
|
position: absolute;
|
|
left: 346px;
|
|
top: 40px;
|
|
height: 32px;
|
|
width: 32px}
|
|
|
|
|
|
/***** Diagnostics Panel (DEBUG) *****/
|
|
|
|
#Diagnostics {
|
|
display: none}
|
|
|
|
#CallbackTable {
|
|
position: relative;
|
|
top: 1ex;
|
|
visibility: visible;
|
|
border-collapse: collapse;
|
|
border-spacing: 0}
|