mirror of
https://github.com/sehugg/8bitworkshop.git
synced 2025-04-05 11:38:54 +00:00
more control instructions fade in/out; flexbox, focus ring for emulator
This commit is contained in:
Steven Hugg
parent
f93bdece20
commit
d47231eb79
@ -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);
|
||||
|
||||
25
index.html
25
index.html
@ -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">←↑↓→</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">←↑↓→</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">←↑↓→</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">← →</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">←↑↓→</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>
|
||||
|
||||
@ -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/
|
||||
|
||||
@ -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."
|
||||
|
||||
12
src/ui.ts
12
src/ui.ts
@ -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() {
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
|
||||
all: binaries images/parrot.c
|
||||
all: binaries
|
||||
|
||||
%.lzg: %
|
||||
lzg -9 $< $@
|
||||
|
||||
@ -1,4 +1,9 @@
|
||||
|
||||
all: nametable.dat
|
||||
|
||||
clean:
|
||||
rm -f *.dat road.png
|
||||
|
||||
nametable.dat: road.png
|
||||
makechr -e error.png $< #-b 0000ff
|
||||
|
||||
|
||||
@ -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 > $@
|
||||
|
||||
@ -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 $< > $@
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user