Make the PC8080 prototype page more responsive

This commit is contained in:
Jeff Parsons 2016-04-20 16:43:01 -07:00
commit 87d01130bd
5 changed files with 16 additions and 22 deletions

View file

@ -1,6 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="/versions/pc8080/1.21.7/machine.xsl"?>
<machine id="invaders" class="pc8080" border="1" width="980px" pos="center" background="#FAEBD7">
<machine id="invaders" class="pc8080" border="1" pos="center" background="#FAEBD7">
<name pos="center">Space Invaders</name>
<computer id="computer"/>
<cpu id="cpu8080" model="8080" cycles="2000000"/>
@ -9,9 +9,9 @@
<rom id="romF" addr="0x1000" size="0x0800" file="/devices/pc8080/rom/invaders/INVADERS-F.json"/>
<rom id="romE" addr="0x1800" size="0x0800" file="/devices/pc8080/rom/invaders/INVADERS-E.json"/>
<ram id="ram" addr="0x2000" size="0x2000"/>
<video id="video" screenwidth="256" screenheight="224" scale="true" aspect="1.33" rotate="90" addr="0x2000" pos="left" padding="8px">
<video id="video" screenWidth="224" screenHeight="256" aspect="1.33" rotate="90" addr="0x2400" width="40%" pos="left" padding="8px">
<menu>
<title>256x224 Screen</title>
<title>224x256 Screen</title>
</menu>
</video>
<panel ref="/devices/pc8080/panel/default.xml"/>

View file

@ -1,30 +1,21 @@
<?xml version="1.0" encoding="UTF-8"?>
<panel id="panel" width="500px" pos="left" padding="8px">
<panel id="panel" width="50%" pos="left" padding="8px">
<name>Control Panel</name>
<control type="container" class="pcjs-textarea" width="58%" padbottom="8px" padright="8px">
<control type="textarea" binding="print" width="100%" height="260px" pos="relative" padbottom="4px" style="resize:vertical;"/>
<control type="container">
<control type="text" binding="debugInput" width="auto"/>
<control type="button" binding="debugEnter">Enter</control>
<control type="button" binding="clear">Clear</control>
</control>
<control type="container" class="pcjs-textarea" width="100%" padright="8px">
<control type="textarea" binding="print" width="100%" height="252px" pos="relative" style="resize:vertical;"/>
</control>
<control type="container" class="pcjs-registers" width="20%" padleft="8px">
<control type="container" class="pcjs-registers" width="100%" padleft="8px">
<control type="register" label="P" binding="PS" width="20px" padright="8px" padbottom="8px">00</control>
<control type="register" label="A" binding="A" width="20px" padright="8px" padbottom="8px">00</control>
<control pos=""/>
<control type="register" label="B" binding="B" width="20px" padright="8px" padbottom="8px">00</control>
<control type="register" label="C" binding="C" width="20px" padright="8px" padbottom="8px">00</control>
<control pos=""/>
<control type="register" label="D" binding="D" width="20px" padright="8px" padbottom="8px">00</control>
<control type="register" label="E" binding="E" width="20px" padright="8px" padbottom="8px">00</control>
<control pos=""/>
<control type="register" label="H" binding="H" width="20px" padright="8px" padbottom="8px">00</control>
<control type="register" label="L" binding="L" width="20px" padright="8px" padbottom="8px">00</control>
<control pos=""/>
<control type="register" label="SP" binding="SP" width="40px" padright="8px" padbottom="8px">0000</control>
<control type="register" label="PC" binding="PC" width="40px" padright="8px" padbottom="8px">0000</control>
<control type="container" width="200px" pos="left">
<control type="container" pos="left">
<control type="flag" label="I" binding="I" width="8px" padright="4px" padbottom="8px">0</control>
<control type="flag" label="S" binding="S" width="8px" padright="4px" padbottom="8px">0</control>
<control type="flag" label="Z" binding="Z" width="8px" padright="4px" padbottom="8px">0</control>
@ -32,8 +23,7 @@
<control type="flag" label="P" binding="P" width="8px" padright="4px" padbottom="8px">0</control>
<control type="flag" label="C" binding="C" width="8px" padright="4px" padbottom="8px">0</control>
</control>
<control pos=""/>
<control type="description" padbottom="8px">Speed:</control>
<control type="description" padleft="16px" padbottom="8px">Speed:</control>
<control type="description" binding="speed" padleft="4px" padbottom="8px">Stopped</control>
</control>
<control type="container" padleft="8px" padbottom="8px">
@ -41,5 +31,9 @@
<control type="button" binding="step">Step</control>
<control type="button" binding="reset">Reset</control>
<control type="button" binding="setSpeed">Fast</control>
<control pos=""/>
<control type="text" binding="debugInput" width="100px"/>
<control type="button" binding="debugEnter">Enter</control>
<control type="button" binding="clear">Clear</control>
</control>
</panel>

View file

@ -49,7 +49,6 @@ if (NODE) {
*
* screenWidth: width of the screen canvas, in pixels
* screenHeight: height of the screen canvas, in pixels
* scale: true for font scaling, false (default) to center the display on the screen
* aspect
* rotate
* addr
@ -92,7 +91,7 @@ Video.init = function()
return;
}
eCanvas.setAttribute("class", PCJSCLASS + "-canvas");
eCanvas.setAttribute("class", "pcjs-canvas");
eCanvas.setAttribute("width", parmsVideo['screenWidth']);
eCanvas.setAttribute("height", parmsVideo['screenHeight']);
eCanvas.style.backgroundColor = parmsVideo['screenColor'];

View file

@ -7245,7 +7245,7 @@ Video.init = function()
return;
}
eCanvas.setAttribute("class", PCJSCLASS + "-canvas");
eCanvas.setAttribute("class", "pcjs-canvas");
eCanvas.setAttribute("width", parmsVideo['screenWidth']);
eCanvas.setAttribute("height", parmsVideo['screenHeight']);
eCanvas.style.backgroundColor = parmsVideo['screenColor'];

View file

@ -163,6 +163,7 @@
<xsl:when test="@width">
<xsl:choose>
<xsl:when test="$left != '' or $top != ''">width:<xsl:value-of select="@width"/>;</xsl:when>
<xsl:when test="@pos = 'left' or @pos = 'right'">width:<xsl:value-of select="@width"/>;max-width:<xsl:value-of select="@width"/>;</xsl:when>
<xsl:otherwise>width:auto;max-width:<xsl:value-of select="@width"/>;</xsl:otherwise>
</xsl:choose>
</xsl:when>