mirror of
https://github.com/inexorabletash/jsbasic.git
synced 2024-09-27 13:55:00 +00:00
UI tweaks
This commit is contained in:
parent
20f302339f
commit
266f60893e
102
index.html
102
index.html
@ -49,60 +49,67 @@ By <a href="mailto:inexorabletash@gmail.com">Joshua Bell</a>
|
|||||||
<!-- Source -->
|
<!-- Source -->
|
||||||
<div style="float: left; margin: 5px;">
|
<div style="float: left; margin: 5px;">
|
||||||
Enter code:
|
Enter code:
|
||||||
<input type="button" value="Run" id="btn_run">
|
<button id="btn_run">▶ Run</button>
|
||||||
<input type="button" value="Stop" id="btn_stop" disabled="disabled">
|
<button id="btn_stop" disabled>◼ Stop</button>
|
||||||
|
|
||||||
<select id="lb_files">
|
<select id="lb_files">
|
||||||
<option disabled selected="selected">Select a file...</option>
|
<option disabled selected="selected">Select a sample...</option>
|
||||||
<option value="sample.basic">DEMOS</option>
|
<option value="sample.basic">DEMOS</option>
|
||||||
|
|
||||||
<option disabled>---- Tests ----</option>
|
<option disabled>____________________________________________</option>
|
||||||
<option value="sample.unittests">Unit Tests</option>
|
<option disabled>Tests</option>
|
||||||
<option value="sample.keyboard">Keyboard Test</option>
|
<option value="sample.unittests"> Unit Tests</option>
|
||||||
<option value="sample.charset">Charset Test</option>
|
<option value="sample.keyboard"> Keyboard Test</option>
|
||||||
|
<option value="sample.charset"> Charset Test</option>
|
||||||
|
|
||||||
|
|
||||||
<option disabled>---- User Submissions ----</option>
|
<option disabled>____________________________________________</option>
|
||||||
|
|
||||||
<option disabled>Games</option>
|
<option disabled>Games</option>
|
||||||
<option value="simple.pong">SIMPLE.PONG</option>
|
|
||||||
<option value="sample.adventure">Text Adventure (Floyd McWilliams)</option>
|
|
||||||
<option value="sample.pacman">(Not Really) ASCII Pac-Man (Michael Kemp)</option>
|
|
||||||
<option value="sample.puzzler">Puzzler (Gregg Buntin)</option>
|
|
||||||
<option value="sample.hangman">Hangman (Mike Gleason)</option>
|
|
||||||
<option value="sample.raindrops">Catch the Raindrop (Nicholas Merchant)</option>
|
|
||||||
<option value="sample.jot">JOT (Mike Gleason)</option>
|
|
||||||
|
|
||||||
|
<option value="simple.pong"> SIMPLE.PONG</option>
|
||||||
|
<option value="sample.adventure"> Text Adventure (Floyd McWilliams)</option>
|
||||||
|
<option value="sample.pacman"> (Not Really) ASCII Pac-Man (Michael Kemp)</option>
|
||||||
|
<option value="sample.puzzler"> Puzzler (Gregg Buntin)</option>
|
||||||
|
<option value="sample.hangman"> Hangman (Mike Gleason)</option>
|
||||||
|
<option value="sample.raindrops"> Catch the Raindrop (Nicholas Merchant)</option>
|
||||||
|
<option value="sample.jot"> JOT (Mike Gleason)</option>
|
||||||
|
|
||||||
|
<option disabled>____________________________________________</option>
|
||||||
<option disabled>Graphics</option>
|
<option disabled>Graphics</option>
|
||||||
<option value="sample.rodscolorpattern">Rod's Color Pattern</option>
|
|
||||||
<option value="sample.hacker">Hacker Logo (markwstock)</option>
|
|
||||||
<option value="sample.loreswalk">Random LoRes (John Melesky)</option>
|
|
||||||
<option value="sample.hireswalk">Random HiRes (John Melesky)</option>
|
|
||||||
<option value="sample.sierpinski">Sierpinski Triangles (Kevin Miller)</option>
|
|
||||||
<option value="sample.stringart">String Art (Chris Heric)</option>
|
|
||||||
<option value="sample.paint">Drawing Program (Brian Broker)</option>
|
|
||||||
<option value="sample.scribble">Scribble (William Simms)</option>
|
|
||||||
<option value="sample.connections">Connections (Gregg Buntin)</option>
|
|
||||||
<option value="sample.squiggle">Squiggle (Gregg Buntin)</option>
|
|
||||||
<option value="sample.boys_surface">Boy's Surface (Lukas Innig)</option>
|
|
||||||
<option value="sample.gaussian">Gaussian Distribution 2D (John Russ)</option>
|
|
||||||
<option value="sample.bitmaps">Bitmap Images (Brian Broker)</option>
|
|
||||||
<option value="sample.mandelbrot">Mandelbrot Set (c/o Gregory Lewis)</option>
|
|
||||||
<option value="sample.mandelbrot2">Mandelbrot Set in Color</option>
|
|
||||||
<option value="sample.steve">Steve (Nicola Foggi)</option>
|
|
||||||
<option value="sample.logo">Apple Logo (Brendan Robert)</option>
|
|
||||||
|
|
||||||
|
<option value="sample.rodscolorpattern"> Rod's Color Pattern</option>
|
||||||
|
<option value="sample.hacker"> Hacker Logo (markwstock)</option>
|
||||||
|
<option value="sample.loreswalk"> Random LoRes (John Melesky)</option>
|
||||||
|
<option value="sample.hireswalk"> Random HiRes (John Melesky)</option>
|
||||||
|
<option value="sample.sierpinski"> Sierpinski Triangles (Kevin Miller)</option>
|
||||||
|
<option value="sample.stringart"> String Art (Chris Heric)</option>
|
||||||
|
<option value="sample.paint"> Drawing Program (Brian Broker)</option>
|
||||||
|
<option value="sample.scribble"> Scribble (William Simms)</option>
|
||||||
|
<option value="sample.connections"> Connections (Gregg Buntin)</option>
|
||||||
|
<option value="sample.squiggle"> Squiggle (Gregg Buntin)</option>
|
||||||
|
<option value="sample.boys_surface"> Boy's Surface (Lukas Innig)</option>
|
||||||
|
<option value="sample.gaussian"> Gaussian Distribution 2D (John Russ)</option>
|
||||||
|
<option value="sample.bitmaps"> Bitmap Images (Brian Broker)</option>
|
||||||
|
<option value="sample.mandelbrot"> Mandelbrot Set (c/o Gregory Lewis)</option>
|
||||||
|
<option value="sample.mandelbrot2"> Mandelbrot Set in Color</option>
|
||||||
|
<option value="sample.steve"> Steve (Nicola Foggi)</option>
|
||||||
|
<option value="sample.logo"> Apple Logo (Brendan Robert)</option>
|
||||||
|
|
||||||
|
<option disabled>____________________________________________</option>
|
||||||
<option disabled>Other</option>
|
<option disabled>Other</option>
|
||||||
<option value="sample.primes">Prime Sieve (Kevin Miller)</option>
|
|
||||||
<option value="sample.february">February Surprise (Antti Pirskanen)</option>
|
|
||||||
<option value="sample.hellosine">Hello World Sine Wave (Jamie Beu)</option>
|
|
||||||
<option value="sample.bodymass">Body Mass Index Calculator (Tim Dwyer)</option>
|
|
||||||
|
|
||||||
<option disabled>---- Traveller RPG Utilities ----</option>
|
<option value="sample.primes"> Prime Sieve (Kevin Miller)</option>
|
||||||
<option value="TRADER C">TRADER</option>
|
<option value="sample.february"> February Surprise (Antti Pirskanen)</option>
|
||||||
<option value="sample.sectorgen">Traveller Sector Generator</option>
|
<option value="sample.hellosine"> Hello World Sine Wave (Jamie Beu)</option>
|
||||||
<option value="sample.zhorelay">Zhodani Relay Station Placement</option>
|
<option value="sample.bodymass"> Body Mass Index Calculator (Tim Dwyer)</option>
|
||||||
<option value="sample.readsector">Read Sector File</option>
|
|
||||||
|
<option disabled>____________________________________________</option>
|
||||||
|
<option disabled>Traveller RPG Utilities</option>
|
||||||
|
|
||||||
|
<option value="TRADER C"> TRADER</option>
|
||||||
|
<option value="sample.sectorgen"> Traveller Sector Generator</option>
|
||||||
|
<option value="sample.zhorelay"> Zhodani Relay Station Placement</option>
|
||||||
|
<option value="sample.readsector"> Read Sector File</option>
|
||||||
</select>
|
</select>
|
||||||
|
|
||||||
<!-- Source code editor inserted here -->
|
<!-- Source code editor inserted here -->
|
||||||
@ -111,12 +118,13 @@ By <a href="mailto:inexorabletash@gmail.com">Joshua Bell</a>
|
|||||||
<form id="submission" method="post" enctype="text/plain" action="mailto:inexorabletash@gmail.com?subject=Applesoft%20Sample%20Submission">
|
<form id="submission" method="post" enctype="text/plain" action="mailto:inexorabletash@gmail.com?subject=Applesoft%20Sample%20Submission">
|
||||||
<textarea name="source" id="source" style="display: none;">
|
<textarea name="source" id="source" style="display: none;">
|
||||||
</textarea>
|
</textarea>
|
||||||
<button id="btn_save" title="Save">💾</button>
|
|
||||||
<button id="btn_load" title="Load">📂</button>
|
|
||||||
|
|
||||||
<input type="submit" id="btn_share" value="Share your sample!">
|
<button id="btn_save" title="Save as a file">💾 Save</button>
|
||||||
<input type="button" id="show_paper" value="Show output" title="Echo all output to a "print-out", so you can copy/paste">
|
<button id="btn_load" title="Load a file">📂 Load</button>
|
||||||
<input type="button" id="hide_paper" value="Hide output" title="Hide the "print-out"">
|
<button id="btn_share" title="Share by email">📩 Share</button>
|
||||||
|
|
||||||
|
<button id="show_paper" title="Echo all output to a "print-out", so you can copy/paste">📃 Show output</button>
|
||||||
|
<button id="hide_paper" title="Hide the "print-out"">🚫 Hide output</button>
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
16
index.js
16
index.js
@ -91,7 +91,7 @@ window.addEventListener('DOMContentLoaded', function () {
|
|||||||
}());
|
}());
|
||||||
}
|
}
|
||||||
|
|
||||||
$('#btn_share').onclick = function () {
|
$('#btn_share').onclick = function(e) {
|
||||||
// Load up the hidden text area with the current source
|
// Load up the hidden text area with the current source
|
||||||
$('#source').value = getSource();
|
$('#source').value = getSource();
|
||||||
};
|
};
|
||||||
@ -105,7 +105,9 @@ window.addEventListener('DOMContentLoaded', function () {
|
|||||||
}
|
}
|
||||||
|
|
||||||
var program;
|
var program;
|
||||||
$('#btn_run').addEventListener('click', function () {
|
$('#btn_run').addEventListener('click', function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
dos.reset();
|
dos.reset();
|
||||||
tty.reset();
|
tty.reset();
|
||||||
tty.autoScroll = true;
|
tty.autoScroll = true;
|
||||||
@ -137,7 +139,9 @@ window.addEventListener('DOMContentLoaded', function () {
|
|||||||
setTimeout(driver, 0);
|
setTimeout(driver, 0);
|
||||||
});
|
});
|
||||||
|
|
||||||
$('#btn_stop').addEventListener('click', function () {
|
$('#btn_stop').addEventListener('click', function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
tty.reset(); // cancel any blocking input
|
tty.reset(); // cancel any blocking input
|
||||||
stopped = true;
|
stopped = true;
|
||||||
updateUI();
|
updateUI();
|
||||||
@ -179,11 +183,13 @@ window.addEventListener('DOMContentLoaded', function () {
|
|||||||
// Add a "printer" on demand
|
// Add a "printer" on demand
|
||||||
var printer = null;
|
var printer = null;
|
||||||
var paper = $('#paper');
|
var paper = $('#paper');
|
||||||
$('#show_paper').addEventListener('click', function () {
|
$('#show_paper').addEventListener('click', function(e) {
|
||||||
|
e.preventDefault();
|
||||||
document.body.classList.add('printout');
|
document.body.classList.add('printout');
|
||||||
printer = new Printer(tty, paper);
|
printer = new Printer(tty, paper);
|
||||||
});
|
});
|
||||||
$('#hide_paper').addEventListener('click', function () {
|
$('#hide_paper').addEventListener('click', function(e) {
|
||||||
|
e.preventDefault();
|
||||||
document.body.classList.remove('printout');
|
document.body.classList.remove('printout');
|
||||||
printer.close();
|
printer.close();
|
||||||
printer = null;
|
printer = null;
|
||||||
|
Loading…
Reference in New Issue
Block a user