Retro/pcjs
Watch
1
0
Fork
You've already forked pcjs
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improved screenshot styling

Browse source
This commit is contained in:
Jeff Parsons 2015-12-14 09:33:28 -08:00
commit 956c4506c1
5 changed files with 46 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

16
README.md
View file

@ -39,14 +39,14 @@ Demos
--- ---
Some pre-configured machines are shown below, ready to run BASIC, DOS, Windows 1.01, and assorted non-DOS software. Some pre-configured machines are shown below, ready to run BASIC, DOS, Windows 1.01, and assorted non-DOS software.
[<img src="/devices/pc/machine/5150/cga/64kb/donkey/thumbnail.jpg" width="200" height="100" alt="IBM PC running DONKEY.BAS"/>](/devices/pc/machine/5150/cga/64kb/donkey/) {% include screenshot.html src="/devices/pc/machine/5150/cga/64kb/donkey/thumbnail.jpg" width="200" height="100" title="IBM PC running DONKEY.BAS" link="/devices/pc/machine/5150/cga/64kb/donkey/" %}
[<img src="/devices/pc/machine/5160/cga/256kb/demo/thumbnail.jpg" width="200" height="100" alt="IBM PC XT w/CGA, 10Mb Hard Drive"/>](/devices/pc/machine/5160/cga/256kb/demo/) {% include screenshot.html src="/devices/pc/machine/5160/cga/256kb/demo/thumbnail.jpg" width="200" height="100" title="IBM PC XT w/CGA, 10Mb Hard Drive" link="/devices/pc/machine/5160/cga/256kb/demo/" %}
[<img src="/devices/pc/machine/5160/cga/256kb/win101/thumbnail.jpg" width="200" height="100" alt="IBM PC XT w/CGA, Windows 1.01"/>](/devices/pc/machine/5160/cga/256kb/win101/) {% include screenshot.html src="/devices/pc/machine/5160/cga/256kb/win101/thumbnail.jpg" width="200" height="100" title="IBM PC XT w/CGA, Windows 1.01" link="/devices/pc/machine/5160/cga/256kb/win101/" %}
[<img src="/devices/pc/machine/5160/ega/640kb/win101/thumbnail.jpg" width="200" height="100" alt="IBM PC XT w/EGA, Windows 1.01"/>](/devices/pc/machine/5160/ega/640kb/win101/) {% include screenshot.html src="/devices/pc/machine/5160/ega/640kb/win101/thumbnail.jpg" width="200" height="100" title="IBM PC XT w/EGA, Windows 1.01" link="/devices/pc/machine/5160/ega/640kb/win101/" %}
[<img src="/disks/pc/os2/ibm/1.0/thumbnail.jpg" width="200" height="100" alt="IBM PC AT w/EGA, OS/2 1.0"/>](/disks/pc/os2/ibm/1.0/) {% include screenshot.html src="/disks/pc/os2/ibm/1.0/thumbnail.jpg" width="200" height="100" title="IBM PC AT w/EGA, OS/2 1.0" link="/disks/pc/os2/ibm/1.0/" %}
[<img src="/disks/pc/cpm/1.1b/thumbnail.jpg" width="200" height="100" alt="IBM PC w/MDA, CP/M-86"/>](/disks/pc/cpm/1.1b/) {% include screenshot.html src="/disks/pc/cpm/1.1b/thumbnail.jpg" width="200" height="100" title="IBM PC w/MDA, CP/M-86" link="/disks/pc/cpm/1.1b/" %}
[<img src="/disks/pc/games/microsoft/adventure/thumbnail.jpg" width="200" height="100" alt="IBM PC w/MDA, Microsoft Adventure"/>](/disks/pc/games/microsoft/adventure/) {% include screenshot.html src="/disks/pc/games/microsoft/adventure/thumbnail.jpg" width="200" height="100" title="IBM PC w/MDA, Microsoft Adventure" link="/disks/pc/games/microsoft/adventure/" %}
[<img src="/disks/pc/games/infocom/zork1/thumbnail.jpg" width="200" height="100" alt="IBM PC w/CGA, Zork I"/>](/disks/pc/games/infocom/zork1/) {% include screenshot.html src="/disks/pc/games/infocom/zork1/thumbnail.jpg" width="200" height="100" title="IBM PC w/CGA, Zork I" link="/disks/pc/games/infocom/zork1/" %}
Check out the rest of the PCjs [Application](/apps/pc/), [Boot Disk](/disks/pc/) and [Machine](/devices/pc/machine/) Check out the rest of the PCjs [Application](/apps/pc/), [Boot Disk](/disks/pc/) and [Machine](/devices/pc/machine/)
demos, including an [IBM PC Dual Display System](/devices/pc/machine/5150/dual/64kb/) demo of multiple monitor support, demos, including an [IBM PC Dual Display System](/devices/pc/machine/5150/dual/64kb/) demo of multiple monitor support,

8
_includes/screenshot.html Normal file
View file

@ -0,0 +1,8 @@
<div class="screenshot-frame">
<div class="screenshot-image">
<a href="{{ site.baseurl }}{{ include.link }}">
<img src="{{ site.baseurl }}{{ include.src }}" width="{{ include.width }}" height="{{ include.height }}" alt="{{ include.title }}"/>
</a>
</div>
<span class="screenshot-label">{{ include.title }}</span>
</div>

8
_posts/2014-09-02-minor-fixes-and-additions.md
View file

@ -6,8 +6,8 @@ category: Releases
permalink: /blog/2014/09/02/ permalink: /blog/2014/09/02/
--- ---
The following fixes were made in PCjs v1.15.1: The following fixes were made in PCjs v1.15.1
1. Using the "User-defined URL" option when loading a disk image from a 3rd-party server was broken if the URL 1. Using the "User-defined URL" option when loading a disk image from a 3rd-party server was broken if the URL
contained certain special characters; that should be fixed now, but be aware that only web servers (ie, URLs contained certain special characters; that should be fixed now, but be aware that only web servers (ie, URLs
using the HTTP protocol) are supported. URLs that trigger a redirect may also not work (more testing required). using the HTTP protocol) are supported. URLs that trigger a redirect may also not work (more testing required).
@ -19,7 +19,7 @@ and shutdown process:
or *true* to re-enable; or *true* to re-enable;
+ *sendEvent(string)*: pass *"init"*, *"show"* or *"exit"* to simulate the corresponding browser event + *sendEvent(string)*: pass *"init"*, *"show"* or *"exit"* to simulate the corresponding browser event
(*onload*, *onpageshow* or *onbeforeunload*, respectively). (*onload*, *onpageshow* or *onbeforeunload*, respectively).
If a page calls *enableEvents(false)* before calling *embedPC()*, all machine layouts will be instantiated If a page calls *enableEvents(false)* before calling *embedPC()*, all machine layouts will be instantiated
but the machines themselves will not be initialized. When the page is ready, call *enableEvents(true)* to restore but the machines themselves will not be initialized. When the page is ready, call *enableEvents(true)* to restore
normal event processing, and if the browser has already sent the *onload* event, then call *sendEvent("init")* normal event processing, and if the browser has already sent the *onload* event, then call *sendEvent("init")*
@ -27,6 +27,6 @@ to manually initialize the machine(s).
These two new functions are designed to assist in testing the starting up, shutting down and restarting of machines, These two new functions are designed to assist in testing the starting up, shutting down and restarting of machines,
by allowing scripts to control the overall process, without requiring use of the browser's back/forward/close controls. by allowing scripts to control the overall process, without requiring use of the browser's back/forward/close controls.
*[@jeffpar](http://twitter.com/jeffpar)* *[@jeffpar](http://twitter.com/jeffpar)*
*September 2, 2014* *September 2, 2014*

19
_sass/_base.scss
View file

@ -202,3 +202,22 @@ pre {
} }
} }
} }
/**
* Screenshot links
*/
.screenshot-frame {
display: inline-block;
margin: 8px;
text-align: center;
}
.screenshot-image {
padding: 5px;
border: 1px solid black;
border-radius: 5px;
background-color: #FAEBD7;
}
.screenshot-label {
font-size: x-small;
}

8
notes.md
View file

@ -158,6 +158,12 @@ Although I created image.html in the **_includes** folder, so that I could do th
instead of this: instead of this:
[<img src="{{ site.baseurl }}/devices/pc/machine/5150/cga/64kb/donkey/thumbnail.jpg" width="200" height="100"/>](/devices/pc/machine/5150/cga/64kb/donkey/ "IBM PC running DONKEY.BAS") [<img src="/devices/pc/machine/5150/cga/64kb/donkey/thumbnail.jpg" width="200" height="100"/>](/devices/pc/machine/5150/cga/64kb/donkey/ "IBM PC running DONKEY.BAS")
I decided to stick with the latter, since it has a better chance of rendering as normal Markdown. I decided to stick with the latter, since it has a better chance of rendering as normal Markdown.
Technically, the URLs in the latter should include:
{{ site.baseurl }}
but since I'm using a custom domain name (http://pcjs.net instead of http://jeffpar.github.io/pcjs), it's not necessary.