1
0
mirror of https://github.com/sehugg/8bitworkshop.git synced 2024-07-20 23:29:09 +00:00

more control instructions fade in/out; flexbox, focus ring for emulator

This commit is contained in:
Steven Hugg 2019-05-18 11:19:12 -04:00
parent f93bdece20
commit d47231eb79
9 changed files with 59 additions and 10 deletions

View File

@ -223,6 +223,8 @@ a.dropdown-toggle {
div.emulator {
background-color: #666;
margin-top: 20px auto 0;
display:flex;
flex-direction:column;
}
div.emuoverlay {
display:flex;
@ -249,6 +251,10 @@ div.emuspacer {
width:90%;
pointer-events:auto;
}
.emuvideo:focus {
outline:none;
border-color:#888;
}
canvas.pixelated {
image-rendering: optimizeSpeed; /* Older versions of FF */
image-rendering: -moz-crisp-edges; /* FF 6.0+ */
@ -517,7 +523,8 @@ div.asset_toolbar {
margin:8px;
}
.control-insns {
margin-top:1em;
margin-top: auto;
margin-bottom: 2em;
}
.control-key {
border: 2px solid rgba(0,0,0,0.2);

View File

@ -214,7 +214,7 @@ if (window.location.host.endsWith('8bitworkshop.com')) {
</div>
<div id="workspace">
</div>
<div class="emulator" id="emulator">
<div class="emulator disable-select" id="emulator">
<div id="replaydiv" class="replaydiv" style="display:none">
<div style="display:flex">
<button id="replay_min" class="btn" title="Start of replay"><span class="glyphicon glyphicon-fast-backward" aria-hidden="true"></span></button>
@ -226,13 +226,34 @@ if (window.location.host.endsWith('8bitworkshop.com')) {
</div>
</div>
<!-- control instructions -->
<div id="emucontrols-nes" class="text-center small control-insns" style="display:none">
<div class="emucontrols-vcs text-center small control-insns" style="display:none">
<span class="control-def"><span class="control-key">&#x2190;&#x2191;&#x2193;&#x2192;</span> Joystick</span>
<span class="control-def"><span class="control-key small">Space</span> Button</span>
</div>
<div class="emucontrols-nes text-center small control-insns" style="display:none">
<span class="control-def"><span class="control-key">&#x2190;&#x2191;&#x2193;&#x2192;</span> Joypad</span>
<span class="control-def"><span class="control-key">X</span> Button A</span>
<span class="control-def"><span class="control-key">Z</span> Button B</span>
<span class="control-def"><span class="control-key small">Space</span> Select</span>
<span class="control-def"><span class="control-key small">Enter</span> Start</span>
</div>
<div class="emucontrols-vicdual emucontrols-galaxian text-center small control-insns" style="display:none">
<span class="control-def"><span class="control-key">&#x2190;&#x2191;&#x2193;&#x2192;</span> Joystick</span>
<span class="control-def"><span class="control-key small">Space</span> Button 1</span>
<span class="control-def"><span class="control-key small">Shift</span> Button 2</span>
<span class="control-def"><span class="control-key">1</span> 1p</span>
<span class="control-def"><span class="control-key">2</span> 2p</span>
<span class="control-def"><span class="control-key">5</span> Coin</span>
</div>
<div class="emucontrols-mw8080bw text-center small control-insns" style="display:none">
<span class="control-def"><span class="control-key">&#x2190;&nbsp;&#x2192;</span> Joystick</span>
<span class="control-def"><span class="control-key small">Space</span> Fire</span>
</div>
<div class="emucontrols-williams text-center small control-insns" style="display:none">
<span class="control-def"><span class="control-key">A W S D</span> Move</span>
<span class="control-def"><span class="control-key">&#x2190;&#x2191;&#x2193;&#x2192;</span> Fire</span>
</div>
<!-- -->
<div id="javatari-div" style="float:center;margin:10px;display:none">
<div id="javatari-screen" style="margin: 0 auto; box-shadow: 2px 2px 10px rgb(60, 60, 60);"></div>
<div id="javatari-console-panel" style="margin: 0 auto; box-shadow: 2px 2px 10px rgb(60, 60, 60);"></div>

View File

@ -2,5 +2,5 @@
. ./scripts/env.sh
DESTPATH=$RSYNC_PATH/dev/
git ls-files -z | rsync --stats --exclude '.*' --exclude 'scripts/*' --exclude=node_modules -ril --chmod=a+rx -e "ssh -p 2222" --files-from - -0 . $DESTPATH
rsync --stats -rpilvz --chmod=a+rx -e "ssh -p 2222" ./gen $DESTPATH/
git ls-files -z | rsync --stats --exclude '.*' --exclude 'scripts/*' --exclude=node_modules -ril --chmod=a+rx -e "ssh" --files-from - -0 . $DESTPATH
rsync --stats -rpilvz --chmod=a+rx -e "ssh" ./gen config.js $DESTPATH/

View File

@ -21,5 +21,5 @@ mkdir -p $TMPDIR
git archive $VERSION | tar x -C $TMPDIR
echo "Copying to $DESTPATH..."
rsync --stats --exclude '.*' --exclude 'scripts/*' --exclude=node_modules --copy-dest=$DEVPATH -rilz --chmod=a+rx -e "ssh -p 2222" $TMPDIR/ $SUBMODS $DESTPATH
rsync --stats -rpilvz --chmod=a+rx -e "ssh -p 2222" --copy-dest=$DEVPATH ./gen $DESTPATH/
rsync --stats -rpilvz --chmod=a+rx -e "ssh -p 2222" --copy-dest=$DEVPATH ./gen config.js $DESTPATH/
echo "Done."

View File

@ -1653,7 +1653,17 @@ function addPageFocusHandlers() {
}
function showInstructions() {
$("#emucontrols-" + getRootBasePlatform(platform_id)).show();
var div = $(document).find(".emucontrols-" + getRootBasePlatform(platform_id));
$("#emulator").append(div);
var vcanvas = $("#emulator").find("canvas");
if (vcanvas) {
vcanvas.on('focus', () => {
if (platform.isRunning()) div.fadeIn(200);
});
vcanvas.on('blur', () => {
div.fadeOut(200);
});
}
}
function installGAHooks() {

View File

@ -1,5 +1,5 @@
all: binaries images/parrot.c
all: binaries
%.lzg: %
lzg -9 $< $@

View File

@ -1,4 +1,9 @@
all: nametable.dat
clean:
rm -f *.dat road.png
nametable.dat: road.png
makechr -e error.png $< #-b 0000ff

View File

@ -1,6 +1,9 @@
all: cp437.vicdual.c c64.vicdual.c
clean:
rm -f cp437.vicdual.c c64.vicdual.c
# convert DOS CP437 font (256 chars)
cp437.vicdual.c: ../fonts/cp437-8x8.bdf
python ../parsebdf8.py $< -r -C > $@

View File

@ -1,12 +1,15 @@
all: baddies.c badspacerobots.tga tom-thumb.c swave.c.rom.h
clean:
rm -f baddies.[ch] *.gif *.tga *.tga.png tom-thumb.c swave.c.rom.h
%.h: %
cat $* | hexdump -v -e '"\n" 128/1 "0x%02x,"' > $@
# convert PCX (or PNG) file to Williams C sprite
%.c: %.pcx
python ../pcx2will.py $< > $@
python3 ../pcx2will.py $< > $@
# convert PNG into RLE-encoded TGA bitmap
%.tga: %.png
@ -23,5 +26,5 @@ all: baddies.c badspacerobots.tga tom-thumb.c swave.c.rom.h
# convert BDF font file to definitions
%.c: ../fonts/%.bdf
python ../parsebdf4bit.py -s 33 -e 97 $< > $@
python3 ../parsebdf4bit.py -s 33 -e 97 $< > $@