Added rudimentary CSS support for side-by-side machines (the PDP-11/45 with VT100 is the first test case)

This commit is contained in:
Jeff Parsons 2016-12-01 17:32:56 -08:00 committed by Jeff Parsons
commit 4f7f72af57
19 changed files with 80 additions and 30 deletions

View file

@ -1,6 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="/versions/pc8080/1.30.5/machine.xsl"?>
<machine id="vt100" class="pc8080" border="1" pos="center" background="#FAEBD7">
<machine id="vt100" class="pc8080 machine-right" border="1" pos="center" background="#FAEBD7">
<name pos="center">VT100 Terminal</name>
<computer id="computer" busWidth="16"/>
<cpu id="cpu8080" model="8080" cycles="2764800" autoStart="true"/>

View file

@ -1,6 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="/versions/pc8080/1.30.5/machine.xsl"?>
<machine id="vt100" class="pc8080" border="1" pos="center" background="#FAEBD7">
<machine id="vt100" class="pc8080 machine-right" border="1" pos="center" background="#FAEBD7">
<name pos="center">VT100 Terminal</name>
<computer id="computer" busWidth="16"/>
<cpu id="cpu8080" model="8080" cycles="2764800"/>

View file

@ -15,6 +15,6 @@ machines:
{% include machine.html id="test1145" %}
This PDP-11/45 is also available with our built-in [Debugger](debugger/).
{% include machine.html id="vt100" %}
This PDP-11/45 is also available with our built-in [Debugger](debugger/).

View file

@ -1,6 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="/versions/pdpjs/1.30.5/machine.xsl"?>
<machine id="test1145" class="pdp11" border="1" pos="center" background="#FAEBD7">
<machine id="test1145" class="pdp11 machine-left" border="1" pos="center" background="#FAEBD7">
<name pos="center">PDP-11/45 with 256Kb, Front Panel, and Debugger</name>
<computer id="computer" busWidth="18"/>
<cpu id="cpu" model="1145" cycles="6666667" autoStart="true"/>

View file

@ -1,6 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="/versions/pdpjs/1.30.5/machine.xsl"?>
<machine id="test1145" class="pdp11" border="1" pos="center" background="#FAEBD7">
<machine id="test1145" class="pdp11 machine-left" border="1" pos="center" background="#FAEBD7">
<name pos="center">PDP-11/45 with 256Kb and Front Panel</name>
<computer id="computer" busWidth="18"/>
<cpu id="cpu" model="1145" cycles="6666667" autoStart="true"/>

View file

@ -204,7 +204,7 @@
</control>
</control>
<control type="container" class="pcjs-textarea" width="60%" padTop="8px" padBottom="8px">
<control type="textarea" binding="print" width="100%" height="380px" padRight="8px" pos="relative" style="resize:vertical;"/>
<control type="textarea" binding="print" width="100%" height="360px" padRight="8px" pos="relative" style="resize:vertical;"/>
<control type="container" width="100%">
<control type="text" binding="debugInput" width="auto"/>
<control type="button" binding="debugEnter">Enter</control>

View file

@ -204,7 +204,7 @@
</control>
</control>
<control type="container" class="pcjs-textarea" width="60%" padTop="8px" padBottom="8px">
<control type="textarea" binding="print" width="100%" height="380px" padRight="8px" pos="relative" style="resize:vertical;"/>
<control type="textarea" binding="print" width="100%" height="440px" padRight="8px" pos="relative" style="resize:vertical;"/>
<control type="container" width="100%">
<control type="text" binding="debugInput" width="auto"/>
<control type="button" binding="debugEnter">Enter</control>

View file

@ -204,7 +204,7 @@
</control>
</control>
<control type="container" class="pcjs-textarea" width="60%" padTop="8px" padBottom="8px">
<control type="textarea" binding="print" width="100%" height="240px" padRight="8px" pos="relative" style="resize:vertical;"/>
<control type="textarea" binding="print" width="100%" height="280px" padRight="8px" pos="relative" style="resize:vertical;"/>
</control>
<control type="container" class="pcjs-registers" width="35%" padding="8px">
<control type="button" binding="run">Run</control>

View file

@ -204,7 +204,7 @@
</control>
</control>
<control type="container" class="pcjs-textarea" width="60%" padTop="8px" padBottom="8px">
<control type="textarea" binding="print" width="100%" height="380px" padRight="8px" pos="relative" style="resize:vertical;"/>
<control type="textarea" binding="print" width="100%" height="440px" padRight="8px" pos="relative" style="resize:vertical;"/>
<control type="container" width="100%">
<control type="text" binding="debugInput" width="auto"/>
<control type="button" binding="debugEnter">Enter</control>

View file

@ -204,7 +204,7 @@
</control>
</control>
<control type="container" class="pcjs-textarea" width="60%" padTop="8px" padBottom="8px">
<control type="textarea" binding="print" width="100%" height="240px" padRight="8px" pos="relative" style="resize:vertical;"/>
<control type="textarea" binding="print" width="100%" height="280px" padRight="8px" pos="relative" style="resize:vertical;"/>
</control>
<control type="container" class="pcjs-registers" width="35%" padding="8px">
<control type="button" binding="run">Run</control>

View file

@ -53,6 +53,6 @@
<control type="button" binding="loadTape">Load</control>
<control type="description" binding="descTape" padRight="8px"/>
<control type="file" binding="mountTape"/>
<control type="progress" binding="readProgress" pos="default" width="250px" padTop="8px">Tape Progress</control>
<control type="progress" binding="readProgress" pos="default" padTop="8px">Tape Progress</control>
</control>
</device>

View file

@ -52,7 +52,7 @@
}
.pcjs-progress {
height: 20px;
width: 300px;
width: 200px;
margin-top: 8px;
border: 1px solid black;
position: relative;
@ -66,7 +66,7 @@
}
.pcjs-progress-text {
height: 20px;
width: 300px;
width: 200px;
font-size: small;
line-height: 20px;
text-align: center;
@ -224,7 +224,7 @@
text-decoration: none;
}
@media screen and (max-width: 900px) {
@media screen and (max-width: 800px) {
.pcjs-textarea {
width: 100% !important;
}
@ -242,3 +242,13 @@
padding-right: 0 !important;
}
}
@media screen and (min-width: 1400px) {
.machine-left, .machine-right {
max-width: 45%;
float: left;
}
.machine-right + * {
clear: both;
}
}

View file

@ -721,7 +721,7 @@ PC11.prototype.parseTape = function(sTapeName, sTapePath, nTapeTarget, aBytes, a
}
this.iTapeData = 0;
this.aTapeData = aBytes;
this.status("tape attached: " + sTapeName);
this.status('Attached tape "' + sTapeName + '"');
this.displayProgress(0);
};

View file

@ -57,7 +57,7 @@
}
.pcjs-progress {
height: 20px;
width: 300px;
width: 200px;
margin-top: 8px;
border: 1px solid black;
position: relative;
@ -71,7 +71,7 @@
}
.pcjs-progress-text {
height: 20px;
width: 300px;
width: 200px;
font-size: small;
line-height: 20px;
text-align: center;
@ -229,7 +229,7 @@
text-decoration: none;
}
@media screen and (max-width: 900px) {
@media screen and (max-width: 800px) {
.pcjs-textarea {
width: 100% !important;
}
@ -247,3 +247,13 @@
padding-right: 0 !important;
}
}
@media screen and (min-width: 1400px) {
.machine-left, .machine-right {
max-width: 45%;
float: left;
}
.machine-right + * {
clear: both;
}
}

View file

@ -52,7 +52,7 @@
}
.pcjs-progress {
height: 20px;
width: 300px;
width: 200px;
margin-top: 8px;
border: 1px solid black;
position: relative;
@ -66,7 +66,7 @@
}
.pcjs-progress-text {
height: 20px;
width: 300px;
width: 200px;
font-size: small;
line-height: 20px;
text-align: center;
@ -224,7 +224,7 @@
text-decoration: none;
}
@media screen and (max-width: 900px) {
@media screen and (max-width: 800px) {
.pcjs-textarea {
width: 100% !important;
}
@ -242,3 +242,13 @@
padding-right: 0 !important;
}
}
@media screen and (min-width: 1400px) {
.machine-left, .machine-right {
max-width: 45%;
float: left;
}
.machine-right + * {
clear: both;
}
}

View file

@ -52,7 +52,7 @@
}
.pcjs-progress {
height: 20px;
width: 300px;
width: 200px;
margin-top: 8px;
border: 1px solid black;
position: relative;
@ -66,7 +66,7 @@
}
.pcjs-progress-text {
height: 20px;
width: 300px;
width: 200px;
font-size: small;
line-height: 20px;
text-align: center;
@ -224,7 +224,7 @@
text-decoration: none;
}
@media screen and (max-width: 900px) {
@media screen and (max-width: 800px) {
.pcjs-textarea {
width: 100% !important;
}
@ -242,3 +242,13 @@
padding-right: 0 !important;
}
}
@media screen and (min-width: 1400px) {
.machine-left, .machine-right {
max-width: 45%;
float: left;
}
.machine-right + * {
clear: both;
}
}

View file

@ -52,7 +52,7 @@
}
.pcjs-progress {
height: 20px;
width: 300px;
width: 200px;
margin-top: 8px;
border: 1px solid black;
position: relative;
@ -66,7 +66,7 @@
}
.pcjs-progress-text {
height: 20px;
width: 300px;
width: 200px;
font-size: small;
line-height: 20px;
text-align: center;
@ -224,7 +224,7 @@
text-decoration: none;
}
@media screen and (max-width: 900px) {
@media screen and (max-width: 800px) {
.pcjs-textarea {
width: 100% !important;
}
@ -242,3 +242,13 @@
padding-right: 0 !important;
}
}
@media screen and (min-width: 1400px) {
.machine-left, .machine-right {
max-width: 45%;
float: left;
}
.machine-right + * {
clear: both;
}
}

View file

@ -202,7 +202,7 @@ function Eh(a,b,c,d,e,f){var g=-1;if(a.B.toLowerCase()!=c.toLowerCase()||a.v!=d)
function Hh(a,b,c,d,e){var f=c;if(e){var g=new FileReader;g.onload=function(){var e=g.result;e&&(e=new Uint8Array(e,0,e.byteLength),Ih(a,b,c,d,e),a.G="?");Fh(a)};g.readAsArrayBuffer(e);return!0}0>c.indexOf("/api/v1/dump")&&(e=oa(c),f="json"==e||"gz"==e?encodeURI(c):Fa()+"/api/v1/dump?path="+encodeURIComponent(c)+"&format=json");return!!Da(f,null,!0,function(e,f,g){var h=0>g&&a.A&&!a.A.C.la;g?a.N('Unable to load tape "'+b+'" (error '+g+": "+e+")",h):(mb(a.gb,e,f),(e=Ea(e,f))&&Ih(a,b,c,d,e.ga,e.Sa,
e.Ra));a.C.ib=!1;a.F&&(a.F--,a.F||J(a));Fh(a)})}function Ch(a,b,c,d){if((a=a.D.listTapes)&&a.options){for(var e=0;e<a.options.length;e++)if(a.options[e].value==c)return;e=document.createElement("option");e.text=b;e.value=c;d&&a.childNodes[0]?a.insertBefore(e,a.childNodes[0]):a.appendChild(e)}}
function Fh(a){var b=a.D.listTapes;if(b&&b.options){a=a.G||a.B;for(var c=0;c<b.options.length;c++)if(b.options[c].value==a){b.selectedIndex!=c&&(b.selectedIndex=c);break}c==b.options.length&&(b.selectedIndex=0)}}function Ah(a,b){b|=0;if(b!==a.T){var c=a.D.readProgress;c&&(c=(c=F(c,"pcjs-progress-bar"))&&c[0])&&c.style&&(c.style.width=b+"%");a.T=b}}
function Ih(a,b,c,d,e,f,g){a.M=b;a.B=c;a.v=d;a.ga=e;a.Sa=f;a.Ra=g;2==d?a.Y&&Wg(a.Y,e,f,g)?a.status("tape loaded: "+b):(a.M="",a.B="",a.G=wh,a.v=xh,a.N("No load address available for tape: "+b)):(a.K=0,a.I=e,a.status("tape attached: "+b),Ah(a,0))}function Gh(a,b){if(a.B||!1===b)a.M="",a.B="",b||(a.v&&a.status(1==a.v?"tape detached":"tape unloaded"),a.G=wh,a.v=xh,Fh(a))}k.save=function(){return(new S(this)).data()};k.restore=function(){return!0};k.Ud=function(){return this.f&65534};
function Ih(a,b,c,d,e,f,g){a.M=b;a.B=c;a.v=d;a.ga=e;a.Sa=f;a.Ra=g;2==d?a.Y&&Wg(a.Y,e,f,g)?a.status("tape loaded: "+b):(a.M="",a.B="",a.G=wh,a.v=xh,a.N("No load address available for tape: "+b)):(a.K=0,a.I=e,a.status('Attached tape "'+b+'"'),Ah(a,0))}function Gh(a,b){if(a.B||!1===b)a.M="",a.B="",b||(a.v&&a.status(1==a.v?"tape detached":"tape unloaded"),a.G=wh,a.v=xh,Fh(a))}k.save=function(){return(new S(this)).data()};k.restore=function(){return!0};k.Ud=function(){return this.f&65534};
k.Se=function(a){a&1&&(this.f&32768?(a&=-2,this.f&64&&Pc(this.b,this.S)):(this.f&=-129,this.f|=2048,this.L=0,Qc(this.b,this.ca,1E3/Math.round(this.ba/10))));this.f=this.f&-66|a&65};k.Td=function(){this.f&=-129;this.f|=2048;return this.L};k.Re=function(){};var Jh={},Bh=(Jh[65384]=[null,null,kd.prototype.Ud,kd.prototype.Se,"PRS"],Jh[65386]=[null,null,kd.prototype.Td,kd.prototype.Re,"PRB"],Jh);
function Kh(a,b,c){x.call(this,"Disk",{id:a.gb+".disk"+p(++Lh,4)},Kh,8192);this.controller=a;this.A=a.A;this.j=a.j;this.v=b;this.Ta=b.name;this.$b=b.$b;Mh(this,c,b.fa,b.ka,b.ha,b.Aa);J(this)}var Lh=0;B(Kh);k=Kh.prototype;k.Fa=function(a,b,c,d){this.j=d};
function Mh(a,b,c,d,e,f){a.mode=b;a.fa=c;a.ka=d;a.ha=e;a.Aa=f;a.b=[];if("preload"!=a.mode){b=Array(a.fa);for(c=0;c<b.length;c++){d=Array(a.ka);for(e=0;e<d.length;e++){f=Array(a.ha);for(var g=1;g<=f.length;g++)f[g-1]=Nh(null,c,e,g,a.Aa,0);d[e]=f}b[c]=d}a.b=b}a.f=null}

View file

@ -184,7 +184,7 @@ function xf(a){a.m=0;if(a.c){var b=a.c.path||"",c;if(!(c=a.c.name))a:{if((c=a.j.
function sf(a,b,c,d,e){if(c)if("?"==c)a.C('Use "Choose File" and "Mount" to select and load a local tape.');else{if("??"==c){c=window.prompt("Enter the URL of a remote tape image.","")||"";if(!c)return;b=r(c);a.status("Attempting to load "+c+' as "'+b+'"');a.s="??"}else a.s=c;yf(a,b,c,d,!1,e)}else Af(a,!1)}function yf(a,b,c,d,e,f){var g=-1;if(a.i.toLowerCase()!=c.toLowerCase()||a.f!=d)g++,Af(a,!0),a.o.Fa?a.C("PC11 busy"):(e&&a.m++,Bf(a,b,c,d,f)?g++:a.o.Fa=!0);g&&Cf(a,a.B,a.i,a.f,a.M,a.oa,a.na)}
function Bf(a,b,c,d,e){var f=c;if(e){var g=new FileReader;g.onload=function(){var e=g.result;e&&(e=new Uint8Array(e,0,e.byteLength),Cf(a,b,c,d,e),a.s="?");zf(a)};g.readAsArrayBuffer(e);return!0}0>c.indexOf("/api/v1/dump")&&(e=la(c),f="json"==e||"gz"==e?encodeURI(c):ua()+"/api/v1/dump?path="+encodeURIComponent(c)+"&format=json");return!!t(f,null,!0,function(e,f,g){var k=0>g&&a.l&&!a.l.o.P;g?a.C('Unable to load tape "'+b+'" (error '+g+": "+e+")",k):(Ua(a.ya,e,f),(e=ta(e,f))&&Cf(a,b,c,d,e.M,e.oa,e.na));
a.o.Fa=!1;a.m&&(a.m--,a.m||E(a));zf(a)})}function wf(a,b,c,d){if((a=a.j.listTapes)&&a.options){for(var e=0;e<a.options.length;e++)if(a.options[e].value==c)return;e=document.createElement("option");e.text=b;e.value=c;d&&a.childNodes[0]?a.insertBefore(e,a.childNodes[0]):a.appendChild(e)}}function zf(a){var b=a.j.listTapes;if(b&&b.options){a=a.s||a.i;for(var c=0;c<b.options.length;c++)if(b.options[c].value==a){b.selectedIndex!=c&&(b.selectedIndex=c);break}c==b.options.length&&(b.selectedIndex=0)}}
function uf(a,b){b|=0;if(b!==a.I){var c=a.j.readProgress;c&&(c=(c=D(c,"pcjs-progress-bar"))&&c[0])&&c.style&&(c.style.width=b+"%");a.I=b}}function Cf(a,b,c,d,e,f,g){a.B=b;a.i=c;a.f=d;a.M=e;a.oa=f;a.na=g;2==d?a.L&&kf(a.L,e,f,g)?a.status("tape loaded: "+b):(a.B="",a.i="",a.s=qf,a.f=rf,a.C("No load address available for tape: "+b)):(a.w=0,a.v=e,a.status("tape attached: "+b),uf(a,0))}
function uf(a,b){b|=0;if(b!==a.I){var c=a.j.readProgress;c&&(c=(c=D(c,"pcjs-progress-bar"))&&c[0])&&c.style&&(c.style.width=b+"%");a.I=b}}function Cf(a,b,c,d,e,f,g){a.B=b;a.i=c;a.f=d;a.M=e;a.oa=f;a.na=g;2==d?a.L&&kf(a.L,e,f,g)?a.status("tape loaded: "+b):(a.B="",a.i="",a.s=qf,a.f=rf,a.C("No load address available for tape: "+b)):(a.w=0,a.v=e,a.status('Attached tape "'+b+'"'),uf(a,0))}
function Af(a,b){if(a.i||!1===b)a.B="",a.i="",b||(a.f&&a.status(1==a.f?"tape detached":"tape unloaded"),a.s=qf,a.f=rf,zf(a))}h.save=function(){return(new P(this)).data()};h.restore=function(){return!0};h.ld=function(){return this.b&65534};h.je=function(a){a&1&&(this.b&32768?(a&=-2,this.b&64&&L(this.a,this.H)):(this.b&=-129,this.b|=2048,this.A=0,Zb(this.a,this.T,1E3/Math.round(this.R/10))));this.b=this.b&-66|a&65};h.kd=function(){this.b&=-129;this.b|=2048;return this.A};h.ie=function(){};
var Df={},vf=(Df[65384]=[null,null,hc.prototype.ld,hc.prototype.je,"PRS"],Df[65386]=[null,null,hc.prototype.kd,hc.prototype.ie,"PRB"],Df);function Ef(a,b,c){w.call(this,"Disk",{id:a.ya+".disk"+ka(++Ff,4)},Ef,8192);this.controller=a;this.l=a.l;this.G=a.G;this.f=b;this.pa=b.name;this.sb=b.sb;Gf(this,c,b.K,b.O,b.N,b.U);E(this)}var Ff=0;y(Ef);h=Ef.prototype;h.ha=function(a,b,c,d){this.G=d};
function Gf(a,b,c,d,e,f){a.mode=b;a.K=c;a.O=d;a.N=e;a.U=f;a.a=[];if("preload"!=a.mode){b=Array(a.K);for(c=0;c<b.length;c++){d=Array(a.O);for(e=0;e<d.length;e++){f=Array(a.N);for(var g=1;g<=f.length;g++)f[g-1]=Hf(null,c,e,g,a.U,0);d[e]=f}b[c]=d}a.a=b}a.b=null}