mirror of
https://github.com/whscullin/apple2js.git
synced 2024-01-12 14:14:38 +00:00
Merge pull request #10 from whscullin/whscullin/de-jquery
Remove jQuery and jQuery UI dependencies.
This commit is contained in:
Will Scullin
GitHub
commit
805155d842
400
apple2js.html
400
apple2js.html
@ -27,26 +27,8 @@
|
||||
<link rel="apple-touch-icon" size="72x72" href="img/webapp-ipad.png" />
|
||||
<link rel="shortcut icon" href="img/logoicon.png" />
|
||||
<link rel="stylesheet" type="text/css" href="css/apple2.css" />
|
||||
<link rel="stylesheet" type="text/css"
|
||||
href="//code.jquery.com/ui/1.10.3/themes/mint-choc/jquery-ui.css" />
|
||||
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.2/css/all.css" />
|
||||
|
||||
<!-- white text in controls -->
|
||||
<style type="text/css">
|
||||
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
|
||||
color: white;
|
||||
}
|
||||
.ui-state-default .ui-icon {
|
||||
background-image: url(//code.jquery.com/ui/1.10.3/themes/mint-choc/images/ui-icons_ffffff_256x240.png);
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- jQuery -->
|
||||
<script type="text/javascript" src="//code.jquery.com/jquery-1.9.1.js">
|
||||
</script>
|
||||
<script type="text/javascript" src="//code.jquery.com/ui/1.10.3/jquery-ui.js">
|
||||
</script>
|
||||
|
||||
<!-- Disk Index -->
|
||||
<script type="text/javascript" src="json/disks/index.js"></script>
|
||||
|
||||
@ -55,12 +37,8 @@
|
||||
ondragover="handleDragOver(0, event)"
|
||||
ondrop="handleDrop(0, event)"
|
||||
ondragend="handleDragEnd(0, event)">
|
||||
<div id="fb-root"></div>
|
||||
<div style="margin: auto; width: 614px">
|
||||
<div id="header">
|
||||
<a href="//www.w3.org/html/logo/" target="_blank">
|
||||
<img src="//www.w3.org/html/logo/badge/html5-badge-h-solo.png" style="float: right" />
|
||||
</a>
|
||||
<a href="about.html" target="_blank">
|
||||
<img src="img/badge.png" id="badge" />
|
||||
</a>
|
||||
@ -75,7 +53,7 @@
|
||||
<div style="float: left; width: 50%"
|
||||
ondragover="handleDragOver(1, event)"
|
||||
ondrop="handleDrop(1, event)"
|
||||
ondragend="handleDragEnd(2, event)">
|
||||
ondragend="handleDragEnd(1, event)">
|
||||
<button id="diskload1" class="diskload" title="Load Disk"
|
||||
onclick="openLoad(1, event);">
|
||||
<i class="fas fa-folder-open"></i>
|
||||
@ -112,14 +90,14 @@
|
||||
<button id="toggle-sound" onclick="toggleSound()" title="Toggle Sound">
|
||||
<i class="fas fa-volume-off"></i>
|
||||
</button>
|
||||
<button id="toggle-printer" onclick="$('#printer').dialog('open')" title="Toggle Printer">
|
||||
<button id="toggle-printer" onclick="openPrinterModal()" title="Toggle Printer">
|
||||
<i class="fas fa-print"></i>
|
||||
</button>
|
||||
<div style="float: right">
|
||||
<a class="button" href="about.html" target="_blank" title="About">
|
||||
<button onclick="window.open('about.html', 'blank')" title="About">
|
||||
<i class="fas fa-info"></i>
|
||||
</a>
|
||||
<button onclick="$('#options').dialog('open')" title="Options">
|
||||
</button>
|
||||
<button onclick="openOptions()" title="Options">
|
||||
<i class="fas fa-cog"></i>
|
||||
</button>
|
||||
</div>
|
||||
@ -143,151 +121,261 @@
|
||||
<label for="text_input">Text Input</label>
|
||||
<textarea rows="10" style="width: 99%" id="text_input"></textarea>
|
||||
<br />
|
||||
<button onclick="io.setKeyBuffer($('#text_input').val())">
|
||||
<button onclick="io.setKeyBuffer(document.querySelector('#text_input').innerText)">
|
||||
Send
|
||||
</button>
|
||||
<input type="checkbox" id="buffering" />
|
||||
<label for="buffering">Buffer</label>
|
||||
<button style="float: right"
|
||||
onclick="$('#keyboard').show(); $('#textarea').hide()">
|
||||
onclick="document.querySelector('#keyboard').style.display = 'block'; document.querySelector('#textarea').style.display = 'none'">
|
||||
Keyboard
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loading" title="Loading" style="display: none">
|
||||
Loading...
|
||||
</div>
|
||||
<div id="options" title="Options" style="display: none">
|
||||
<h3>Type</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<select id="computer_type2" value="apple2plus" onchange="updateCPU()">
|
||||
<option value="apple2plus">Apple ][+</option>
|
||||
<option value="apple2">Autostart Apple ][</option>
|
||||
<option value="original">Apple ][</option>
|
||||
<option value="apple2j">Apple ][j+</option>
|
||||
<option value="apple2lc">Apple ][+ (lowercase font)</option>
|
||||
<option value="apple2pig">Apple ][+ (pig font)</option>
|
||||
</select>
|
||||
</li>
|
||||
<li>
|
||||
<i>* Reload page to take effect</i>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>CPU</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<input type="checkbox" id="accelerator_toggle" onclick="updateCPU()"/>
|
||||
<label for="accelerator_toggle">
|
||||
Accelerated CPU
|
||||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>Joystick</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<input type="checkbox" id="disable_mouse"
|
||||
onclick="updateJoystick()" />
|
||||
<label for="disable_mouse">
|
||||
Disable Mouse Joystick
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<input type="checkbox" id="flip_x"
|
||||
onclick="updateJoystick()" />
|
||||
<label for="flip_x">
|
||||
Flip X-Axis
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<input type="checkbox" id="flip_y"
|
||||
onclick="updateJoystick()" />
|
||||
<label for="flip_y">
|
||||
Flip Y-Axis
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<input type="checkbox" id="swap_x_y"
|
||||
onclick="updateJoystick()" />
|
||||
<label for="swap_x_y">
|
||||
Swap X-Y Axis
|
||||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>Monitor</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<input type="checkbox" id="green_screen"
|
||||
onclick="updateScreen()" />
|
||||
<label for="green_screen">
|
||||
Green Screen
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<input type="checkbox" id="show_scanlines"
|
||||
onclick="updateScreen()" />
|
||||
<label for="show_scanlines">
|
||||
Show Scanlines
|
||||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>Sound</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<input type="checkbox" id="enable_sound"
|
||||
onclick="updateSound()" checked="checked" />
|
||||
<label for="enable_sound">
|
||||
Enable (Experimental)
|
||||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div id="save" title="Save Disk" style="display: none">
|
||||
<form action="#" onsubmit="return false;">
|
||||
<b>Save to Browser</b>
|
||||
<br /><br />
|
||||
Save Name: <input type="text" name="name" id="save_name"
|
||||
style="width: 200px" />
|
||||
</form>
|
||||
<hr />
|
||||
<div>
|
||||
<b>Download to Local Disk</b>
|
||||
<br /><br />
|
||||
<a id="local_save_link" class="button">Download</a>
|
||||
|
||||
<div class="modal" id="loading-modal" aria-hidden="true">
|
||||
<div class="modal__overlay" tabindex="-1" data-micromodal-close>
|
||||
<div class="modal__container" role="dialog" aria-modal="true" aria-labelledby="Loading" >
|
||||
<header class="modal__header">
|
||||
<span class="modal__title" id="loading-modal-title">
|
||||
Loading...
|
||||
</span>
|
||||
</header>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="manage" title="Manage Disks" style="display: none">
|
||||
|
||||
<div class="modal" id="options-modal" aria-hidden="true">
|
||||
<div class="modal__overlay" tabindex="-1" data-micromodal-close>
|
||||
<div class="modal__container" role="dialog" aria-modal="true" aria-labelledby="Options">
|
||||
<header class="modal__header">
|
||||
<span class="modal__title" id="options-modal-title">
|
||||
Options
|
||||
</span>
|
||||
<button class="modal__close" aria-label="Close modal" data-micromodal-close>
|
||||
</button>
|
||||
</header>
|
||||
<main class="modal__content" id="options-modal-content">
|
||||
<h3>Type</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<select id="computer_type2" value="apple2plus" onchange="updateCPU()">
|
||||
<option value="apple2plus">Apple ][+</option>
|
||||
<option value="apple2">Autostart Apple ][</option>
|
||||
<option value="original">Apple ][</option>
|
||||
<option value="apple2j">Apple ][j+</option>
|
||||
<option value="apple2lc">Apple ][+ (lowercase font)</option>
|
||||
<option value="apple2pig">Apple ][+ (pig font)</option>
|
||||
</select>
|
||||
</li>
|
||||
<li>
|
||||
<i>* Reload page to take effect</i>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>CPU</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<input type="checkbox" id="accelerator_toggle" onclick="updateCPU()"/>
|
||||
<label for="accelerator_toggle">
|
||||
Accelerated CPU
|
||||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>Joystick</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<input type="checkbox" id="disable_mouse"
|
||||
onclick="updateJoystick()" />
|
||||
<label for="disable_mouse">
|
||||
Disable Mouse Joystick
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<input type="checkbox" id="flip_x"
|
||||
onclick="updateJoystick()" />
|
||||
<label for="flip_x">
|
||||
Flip X-Axis
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<input type="checkbox" id="flip_y"
|
||||
onclick="updateJoystick()" />
|
||||
<label for="flip_y">
|
||||
Flip Y-Axis
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<input type="checkbox" id="swap_x_y"
|
||||
onclick="updateJoystick()" />
|
||||
<label for="swap_x_y">
|
||||
Swap X-Y Axis
|
||||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>Monitor</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<input type="checkbox" id="green_screen"
|
||||
onclick="updateScreen()" />
|
||||
<label for="green_screen">
|
||||
Green Screen
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<input type="checkbox" id="show_scanlines"
|
||||
onclick="updateScreen()" />
|
||||
<label for="show_scanlines">
|
||||
Show Scanlines
|
||||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>Sound</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<input type="checkbox" id="enable_sound"
|
||||
onclick="updateSound()" checked="checked" />
|
||||
<label for="enable_sound">
|
||||
Enable
|
||||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
</main>
|
||||
<footer class="modal__footer">
|
||||
<button class="modal__btn" data-micromodal-close aria-label="Close this dialog window">Close</button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="http_load" title="Load URL" style="display: none">
|
||||
<form action="#">
|
||||
<input type="text" id="http_url" style="width: 500px"/>
|
||||
</form>
|
||||
|
||||
<div class="modal" id="save-modal" aria-hidden="true">
|
||||
<div class="modal__overlay" tabindex="-1" data-micromodal-close>
|
||||
<div class="modal__container" role="dialog" aria-modal="true" aria-labelledby="Save Disk">
|
||||
<header class="modal__header">
|
||||
<span class="modal__title" id="save-modal-title">
|
||||
Save Disk
|
||||
</span>
|
||||
<button class="modal__close" aria-label="Close modal" data-micromodal-close>
|
||||
</button>
|
||||
</header>
|
||||
<main class="modal__content" id="save-modal-content">
|
||||
<form action="#" onsubmit="return false;">
|
||||
<h3>Save to Browser</h3>
|
||||
Save Name: <input type="text" name="name" id="save_name"
|
||||
style="width: 200px" />
|
||||
</form>
|
||||
<hr />
|
||||
<div>
|
||||
<h3>Download to Local Disk</h3>
|
||||
<a id="local_save_link" class="button">Download</a>
|
||||
</div>
|
||||
</main>
|
||||
<footer class="modal__footer">
|
||||
<button class="modal__btn" onclick="doSave()" aria-label="Save disk locally">Save</button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="load" title="Load Disk" style="display: none">
|
||||
<table>
|
||||
<tr>
|
||||
<td>
|
||||
<select id="category_select" multiple="multiple"
|
||||
class="ui-widget ui-state-default"
|
||||
onchange="selectCategory(event)" >
|
||||
</select>
|
||||
</td>
|
||||
<td>
|
||||
<select id="disk_select" multiple="multiple"
|
||||
class="ui-widget ui-state-default"
|
||||
onchange="selectDisk(event)"
|
||||
ondblclick="clickDisk(event)">
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<form action="#">
|
||||
<input type="file" id="local_file" />
|
||||
</form>
|
||||
|
||||
<div class="modal" id="manage-modal" aria-hidden="true">
|
||||
<div class="modal__overlay" tabindex="-1" data-micromodal-close>
|
||||
<div class="modal__container" role="dialog" aria-modal="true" aria-labelledby="Load Disk">
|
||||
<header class="modal__header">
|
||||
<span class="modal__title" id="manage-modal-title">
|
||||
Manage Local Saves
|
||||
</span>
|
||||
<button class="modal__close" aria-label="Close modal" data-micromodal-close>
|
||||
</button>
|
||||
</header>
|
||||
<main class="modal__content" id="manage-modal-content">
|
||||
</main>
|
||||
<footer class="modal__footer">
|
||||
<button class="modal__btn" data-micromodal-close aria-label="Close this dialog window">OK</button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="printer" title="Printer" style="display: none">
|
||||
<div class="paper">
|
||||
|
||||
<div class="modal" id="http-modal" aria-hidden="true">
|
||||
<div class="modal__overlay" tabindex="-1" data-micromodal-close>
|
||||
<div class="modal__container" role="dialog" aria-modal="true" aria-labelledby="Load Disk">
|
||||
<header class="modal__header">
|
||||
<span class="modal__title" id="http-modal-title">
|
||||
Load URL
|
||||
</span>
|
||||
<button class="modal__close" aria-label="Close modal" data-micromodal-close>
|
||||
</button>
|
||||
</header>
|
||||
<main class="modal__content" id="http-modal-content">
|
||||
<form action="#">
|
||||
<input type="text" id="http_url" style="width: 500px"/>
|
||||
</form>
|
||||
</main>
|
||||
<footer class="modal__footer">
|
||||
<button class="modal__btn" data-micromodal-close aria-label="Close this dialog window">OK</button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal" id="load-modal" aria-hidden="true">
|
||||
<div class="modal__overlay" tabindex="-1" data-micromodal-close>
|
||||
<div class="modal__container" role="dialog" aria-modal="true" aria-labelledby="Load Disk">
|
||||
<header class="modal__header">
|
||||
<span class="modal__title" id="load-modal-title">
|
||||
Load Disk
|
||||
</span>
|
||||
<button class="modal__close" aria-label="Close modal" data-micromodal-close>
|
||||
</button>
|
||||
</header>
|
||||
<main class="modal__content" id="load-modal-content">
|
||||
<table>
|
||||
<tr>
|
||||
<td>
|
||||
<select id="category_select" multiple="multiple"
|
||||
onchange="selectCategory(event)" >
|
||||
</select>
|
||||
</td>
|
||||
<td>
|
||||
<select id="disk_select" multiple="multiple"
|
||||
onchange="selectDisk(event)"
|
||||
ondblclick="clickDisk(event)">
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<form action="#">
|
||||
<input type="file" id="local_file" />
|
||||
</form>
|
||||
</main>
|
||||
<footer class="modal__footer">
|
||||
<button class="modal__btn" data-micromodal-close aria-label="Close this dialog window">Cancel</button>
|
||||
<button class="modal__btn" onclick="doLoad()" aria-label="Open the selected disk">Open</button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal" id="printer-modal" aria-hidden="true">
|
||||
<div class="modal__overlay" tabindex="-1" data-micromodal-close>
|
||||
<div class="modal__container" role="dialog" aria-modal="true" aria-labelledby="Printer">
|
||||
<header class="modal__header">
|
||||
<span class="modal__title" id="printer-modal-title">
|
||||
Printer
|
||||
</span>
|
||||
<button class="modal__close" aria-label="Close modal" data-micromodal-close>
|
||||
</button>
|
||||
</header>
|
||||
<main class="modal__content" id="printer-modal-content">
|
||||
<div class="feed">
|
||||
<div class="paper"></div>
|
||||
</div>
|
||||
</main>
|
||||
<footer class="modal__footer">
|
||||
<button class="modal__btn" data-micromodal-close aria-label="Close this dialog window">Close</button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="dist/main2.js"></script>
|
||||
|
||||
394
apple2jse.html
394
apple2jse.html
@ -27,26 +27,8 @@
|
||||
<link rel="apple-touch-icon" size="72x72" href="img/webapp-ipad.png" />
|
||||
<link rel="shortcut icon" href="img/logoicon.png" />
|
||||
<link rel="stylesheet" type="text/css" href="css/apple2.css" />
|
||||
<link rel="stylesheet" type="text/css"
|
||||
href="//code.jquery.com/ui/1.10.3/themes/mint-choc/jquery-ui.css" />
|
||||
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.2/css/all.css" />
|
||||
|
||||
<!-- white text in controls -->
|
||||
<style type="text/css">
|
||||
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
|
||||
color: white;
|
||||
}
|
||||
.ui-state-default .ui-icon {
|
||||
background-image: url(//code.jquery.com/ui/1.10.3/themes/mint-choc/images/ui-icons_ffffff_256x240.png);
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- jQuery -->
|
||||
<script type="text/javascript" src="//code.jquery.com/jquery-1.9.1.js">
|
||||
</script>
|
||||
<script type="text/javascript" src="//code.jquery.com/ui/1.10.3/jquery-ui.js">
|
||||
</script>
|
||||
|
||||
<!-- Disk Index -->
|
||||
<script type="text/javascript" src="json/disks/index.js"></script>
|
||||
|
||||
@ -57,9 +39,6 @@
|
||||
ondragend="handleDragEnd(0, event)">
|
||||
<div class="outer">
|
||||
<div id="header">
|
||||
<a href="//www.w3.org/html/logo/" target="_blank">
|
||||
<img src="//www.w3.org/html/logo/badge/html5-badge-h-solo.png" style="float: right" />
|
||||
</a>
|
||||
<a href="about.html" target="_blank">
|
||||
<img src="img/badge2e.png" id="badge" />
|
||||
</a>
|
||||
@ -114,14 +93,14 @@
|
||||
<button id="toggle-sound" onclick="toggleSound()">
|
||||
<i class="fas fa-volume-off"></i>
|
||||
</button>
|
||||
<button id="toggle-printer" onclick="$('#printer').dialog('open')" title="Toggle Printer">
|
||||
<button id="toggle-printer" onclick="openPrinterModal()" title="Toggle Printer">
|
||||
<i class="fas fa-print"></i>
|
||||
</button>
|
||||
<div style="float: right">
|
||||
<a class="button" href="about.html" target="_blank" title="About">
|
||||
<button onclick="window.open('about.html', 'blank')" title="About">
|
||||
<i class="fas fa-info"></i>
|
||||
</a>
|
||||
<button onclick="$('#options').dialog('open')">
|
||||
</button>
|
||||
<button onclick="openOptions()">
|
||||
<i class="fas fa-cog"></i>
|
||||
</button>
|
||||
</div>
|
||||
@ -134,138 +113,245 @@
|
||||
<div id="keyboard"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loading" title="Loading" style="display: none">
|
||||
Loading...
|
||||
</div>
|
||||
<div id="options" title="Options" style="display: none">
|
||||
<h3>Type</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<select id="computer_type2e" value="apple2enh" onchange="updateCPU()">
|
||||
<option value="apple2enh">Enhanced Apple //e</option>
|
||||
<option value="apple2e">Apple //e</option>
|
||||
<option value="apple2rm">Enhanced Apple //e (Reactive Micro)</option>
|
||||
</select>
|
||||
</li>
|
||||
<li>
|
||||
<i>* Reload page to take effect</i>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>CPU</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<input type="checkbox" id="accelerator_toggle" onclick="updateCPU()"/>
|
||||
<label for="accelerator_toggle">
|
||||
Accelerated CPU
|
||||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>Joystick</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<input type="checkbox" id="disable_mouse"
|
||||
onclick="updateJoystick()" />
|
||||
<label for="disable_mouse">
|
||||
Disable Mouse Joystick
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<input type="checkbox" id="flip_x"
|
||||
onclick="updateJoystick()" />
|
||||
<label for="flip_x">
|
||||
Flip X-Axis
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<input type="checkbox" id="flip_y"
|
||||
onclick="updateJoystick()" />
|
||||
<label for="flip_y">
|
||||
Flip Y-Axis
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<input type="checkbox" id="swap_x_y"
|
||||
onclick="updateJoystick()" />
|
||||
<label for="swap_x_y">
|
||||
Swap X-Y Axis
|
||||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>Monitor</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<input type="checkbox" id="green_screen"
|
||||
onclick="updateScreen()" />
|
||||
<label for="green_screen">
|
||||
Green Screen
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<input type="checkbox" id="show_scanlines"
|
||||
onclick="updateScreen()" />
|
||||
<label for="show_scanlines">
|
||||
Show Scanlines
|
||||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>Sound</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<input type="checkbox" id="enable_sound"
|
||||
onclick="updateSound()" checked="checked" />
|
||||
<label for="enable_sound">
|
||||
Enable (Experimental)
|
||||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div id="save" title="Save Disk" style="display: none">
|
||||
<form action="#" onsubmit="return false;">
|
||||
<b>Save to Browser</b>
|
||||
<br /><br />
|
||||
Save Name: <input type="text" name="name" id="save_name"
|
||||
style="width: 200px" />
|
||||
</form>
|
||||
<hr />
|
||||
<div>
|
||||
<b>Download to Local Disk</b>
|
||||
<br /><br />
|
||||
<a id="local_save_link" class="button">Download</a>
|
||||
|
||||
<div class="modal" id="loading-modal" aria-hidden="true">
|
||||
<div class="modal__overlay" tabindex="-1" data-micromodal-close>
|
||||
<div class="modal__container" role="dialog" aria-modal="true" aria-labelledby="Loading" >
|
||||
<header class="modal__header">
|
||||
<span class="modal__title" id="loading-modal-title">
|
||||
Loading...
|
||||
</span>
|
||||
</header>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="manage" title="Manage Disks" style="display: none">
|
||||
</div>
|
||||
<div id="http_load" title="Load URL" style="display: none">
|
||||
<form action="#">
|
||||
<input type="text" id="http_url" style="width: 500px"/>
|
||||
</form>
|
||||
</div>
|
||||
<div id="load" title="Load Disk" style="display: none">
|
||||
<table>
|
||||
<tr>
|
||||
<td>
|
||||
<select id="category_select" multiple="multiple"
|
||||
class="ui-widget ui-state-default"
|
||||
onchange="selectCategory(event)" >
|
||||
</select>
|
||||
</td>
|
||||
<td>
|
||||
<select id="disk_select" multiple="multiple"
|
||||
class="ui-widget ui-state-default"
|
||||
onchange="selectDisk(event)"
|
||||
ondblclick="clickDisk(event)">
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<form action="#">
|
||||
<input type="file" id="local_file" />
|
||||
</form>
|
||||
</div>
|
||||
<div id="printer" title="Printer" style="display: none">
|
||||
<div class="paper">
|
||||
|
||||
<div class="modal" id="options-modal" aria-hidden="true">
|
||||
<div class="modal__overlay" tabindex="-1" data-micromodal-close>
|
||||
<div class="modal__container" role="dialog" aria-modal="true" aria-labelledby="Options">
|
||||
<header class="modal__header">
|
||||
<span class="modal__title" id="options-modal-title">
|
||||
Options
|
||||
</span>
|
||||
<button class="modal__close" aria-label="Close modal" data-micromodal-close>
|
||||
</button>
|
||||
</header>
|
||||
<main class="modal__content" id="options-modal-content">
|
||||
<h3>Type</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<select id="computer_type2e" value="apple2enh" onchange="updateCPU()">
|
||||
<option value="apple2enh">Enhanced Apple //e</option>
|
||||
<option value="apple2e">Apple //e</option>
|
||||
<option value="apple2rm">Enhanced Apple //e (Reactive Micro)</option>
|
||||
</select>
|
||||
</li>
|
||||
<li>
|
||||
<i>* Reload page to take effect</i>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>CPU</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<input type="checkbox" id="accelerator_toggle" onclick="updateCPU()"/>
|
||||
<label for="accelerator_toggle">
|
||||
Accelerated CPU
|
||||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>Joystick</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<input type="checkbox" id="disable_mouse"
|
||||
onclick="updateJoystick()" />
|
||||
<label for="disable_mouse">
|
||||
Disable Mouse Joystick
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<input type="checkbox" id="flip_x"
|
||||
onclick="updateJoystick()" />
|
||||
<label for="flip_x">
|
||||
Flip X-Axis
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<input type="checkbox" id="flip_y"
|
||||
onclick="updateJoystick()" />
|
||||
<label for="flip_y">
|
||||
Flip Y-Axis
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<input type="checkbox" id="swap_x_y"
|
||||
onclick="updateJoystick()" />
|
||||
<label for="swap_x_y">
|
||||
Swap X-Y Axis
|
||||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>Monitor</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<input type="checkbox" id="green_screen"
|
||||
onclick="updateScreen()" />
|
||||
<label for="green_screen">
|
||||
Green Screen
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<input type="checkbox" id="show_scanlines"
|
||||
onclick="updateScreen()" />
|
||||
<label for="show_scanlines">
|
||||
Show Scanlines
|
||||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>Sound</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<input type="checkbox" id="enable_sound"
|
||||
onclick="updateSound()" checked="checked" />
|
||||
<label for="enable_sound">
|
||||
Enable
|
||||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
</main>
|
||||
<footer class="modal__footer">
|
||||
<button class="modal__btn" data-micromodal-close aria-label="Close this dialog window">Close</button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="dist/main2e.js"></script>
|
||||
|
||||
<div class="modal" id="save-modal" aria-hidden="true">
|
||||
<div class="modal__overlay" tabindex="-1" data-micromodal-close>
|
||||
<div class="modal__container" role="dialog" aria-modal="true" aria-labelledby="Save Disk">
|
||||
<header class="modal__header">
|
||||
<span id="save-modal-title">
|
||||
Save Disk
|
||||
</span>
|
||||
<button class="modal__close" aria-label="Close modal" data-micromodal-close>
|
||||
</button>
|
||||
</header>
|
||||
<main class="modal__content" id="save-modal-content">
|
||||
<form action="#" onsubmit="return false;">
|
||||
<h3>Save to Browser</h3>
|
||||
Save Name: <input type="text" name="name" id="save_name"
|
||||
style="width: 200px" />
|
||||
</form>
|
||||
<hr />
|
||||
<div>
|
||||
<h3>Download to Local Disk</h3>
|
||||
<a id="local_save_link" class="button">Download</a>
|
||||
</div>
|
||||
</main>
|
||||
<footer class="modal__footer">
|
||||
<button class="modal__btn" onclick="doSave()" aria-label="Save disk locally">Save</button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal" id="manage-modal" aria-hidden="true">
|
||||
<div class="modal__overlay" tabindex="-1" data-micromodal-close>
|
||||
<div class="modal__container" role="dialog" aria-modal="true" aria-labelledby="Load Disk">
|
||||
<header class="modal__header">
|
||||
<span class="modal__title" id="manage-modal-title">
|
||||
Manage Local Saves
|
||||
</span>
|
||||
<button class="modal__close" aria-label="Close modal" data-micromodal-close>
|
||||
</button>
|
||||
</header>
|
||||
<main class="modal__content" id="manage-modal-content">
|
||||
</main>
|
||||
<footer class="modal__footer">
|
||||
<button class="modal__btn" data-micromodal-close aria-label="Close this dialog window">OK</button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal" id="http-modal" aria-hidden="true">
|
||||
<div class="modal__overlay" tabindex="-1" data-micromodal-close>
|
||||
<div class="modal__container" role="dialog" aria-modal="true" aria-labelledby="Load Disk">
|
||||
<header class="modal__header">
|
||||
<span class="modal__title" id="http-modal-title">
|
||||
Load URL
|
||||
</span>
|
||||
<button class="modal__close" aria-label="Close modal" data-micromodal-close>
|
||||
</button>
|
||||
</header>
|
||||
<main class="modal__content" id="http-modal-content">
|
||||
<form action="#">
|
||||
<input type="text" id="http_url" style="width: 500px"/>
|
||||
</form>
|
||||
</main>
|
||||
<footer class="modal__footer">
|
||||
<button class="modal__btn" data-micromodal-close aria-label="Close this dialog window">OK</button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal" id="load-modal" aria-hidden="true">
|
||||
<div class="modal__overlay" tabindex="-1" data-micromodal-close>
|
||||
<div class="modal__container" role="dialog" aria-modal="true" aria-labelledby="Load Disk">
|
||||
<header class="modal__header">
|
||||
<span class="modal__title" id="load-modal-title">
|
||||
Load Disk
|
||||
</span>
|
||||
<button class="modal__close" aria-label="Close modal" data-micromodal-close>
|
||||
</button>
|
||||
</header>
|
||||
<main class="modal__content" id="load-modal-content">
|
||||
<table>
|
||||
<tr>
|
||||
<td>
|
||||
<select id="category_select" multiple="multiple"
|
||||
onchange="selectCategory(event)" >
|
||||
</select>
|
||||
</td>
|
||||
<td>
|
||||
<select id="disk_select" multiple="multiple"
|
||||
onchange="selectDisk(event)"
|
||||
ondblclick="clickDisk(event)">
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<form action="#">
|
||||
<input type="file" id="local_file" />
|
||||
</form>
|
||||
</main>
|
||||
<footer class="modal__footer">
|
||||
<button class="modal__btn" data-micromodal-close aria-label="Close this dialog window">Cancel</button>
|
||||
<button class="modal__btn" onclick="doLoad()" aria-label="Open the selected disk">Open</button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal" id="printer-modal" aria-hidden="true">
|
||||
<div class="modal__overlay" tabindex="-1" data-micromodal-close>
|
||||
<div class="modal__container" role="dialog" aria-modal="true" aria-labelledby="Printer">
|
||||
<header class="modal__header">
|
||||
<span class="modal__title" id="printer-modal-title">
|
||||
Printer
|
||||
</span>
|
||||
<button class="modal__close" aria-label="Close modal" data-micromodal-close>
|
||||
</button>
|
||||
</header>
|
||||
<main class="modal__content" id="printer-modal-content">
|
||||
<div class="paper"></div>
|
||||
</main>
|
||||
<footer class="modal__footer">
|
||||
<button class="modal__btn" data-micromodal-close aria-label="Close this dialog window">Close</button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="dist/main2e.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
142
css/apple2.css
142
css/apple2.css
@ -52,7 +52,7 @@ input[type="text"] {
|
||||
|
||||
body {
|
||||
margin: 16px 0;
|
||||
font-size: 10px;
|
||||
font-size: 14px;
|
||||
background-color: #c4c1a0; /* Pantone 453 */
|
||||
font-family: sans-serif;
|
||||
}
|
||||
@ -62,10 +62,6 @@ body {
|
||||
width: 620px;
|
||||
}
|
||||
|
||||
label {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#display {
|
||||
margin: 5px auto;
|
||||
}
|
||||
@ -134,7 +130,6 @@ label {
|
||||
}
|
||||
|
||||
.disklabel {
|
||||
font-size: 11px;
|
||||
font-family: sans-serif;
|
||||
}
|
||||
|
||||
@ -167,6 +162,10 @@ th {
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.inset button {
|
||||
min-width: 36px;
|
||||
}
|
||||
|
||||
#khz {
|
||||
margin-right: 4px;
|
||||
overflow: hidden;
|
||||
@ -216,9 +215,109 @@ canvas {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
#load select {
|
||||
#load-modal select {
|
||||
width: 250px;
|
||||
height: 300px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#load-modal input {
|
||||
font-size: 14px;
|
||||
line-height: 14px;
|
||||
}
|
||||
|
||||
.modal {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.modal.is-open {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.modal__overlay {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba(0,0,0,0.6);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.modal__container {
|
||||
background-color: #c4c1a0;
|
||||
padding: 10px;
|
||||
max-height: 100vh;
|
||||
border-radius: 4px;
|
||||
overflow-y: auto;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.modal__header {
|
||||
display: flex;
|
||||
font-size: 14px;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
background: #44372C;
|
||||
color: #fff;
|
||||
padding: 5px 11px;
|
||||
border: 1px outset #66594E;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.modal__title {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
font-weight: 600;
|
||||
font-size: 1.25rem;
|
||||
line-height: 1.25;
|
||||
color: #fff;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.modal__close, .modal__close:active, .modal__close:hover {
|
||||
background: transparent;
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
.modal__header .modal__close:before {
|
||||
content: "\2715";
|
||||
}
|
||||
|
||||
.modal__content {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
line-height: 1.5;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.modal__footer {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
button {
|
||||
background: #44372C;
|
||||
color: #fff;
|
||||
padding: 2px 8px;
|
||||
border: 1px outset #66594E;
|
||||
border-radius: 3px;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
button:hover {
|
||||
background-color: #55473D;
|
||||
border: 1px outset #66594E;
|
||||
}
|
||||
|
||||
button:active {
|
||||
background-color: #22150A;
|
||||
border: 1px outset #44372C;
|
||||
}
|
||||
|
||||
button:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
#keyboard {
|
||||
@ -228,6 +327,7 @@ canvas {
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
#keyboard .row {
|
||||
@ -472,7 +572,7 @@ canvas {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.standalone #header, .standalone #social {
|
||||
.standalone #header {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@ -480,11 +580,29 @@ canvas {
|
||||
font-family: courier;
|
||||
}
|
||||
|
||||
#options {
|
||||
line-height: 1.75em;
|
||||
height: auto !important;
|
||||
#options-modal {
|
||||
width: 300px;
|
||||
line-height: 1.75em;
|
||||
}
|
||||
|
||||
#options li {
|
||||
#options-modal h3 {
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
#options-modal li {
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
#printer-modal .feed {
|
||||
width: 640px;
|
||||
height: 480px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
#printer-modal .paper {
|
||||
min-width: 640px;
|
||||
min-height: 480px;
|
||||
background-color: white;
|
||||
color: black;
|
||||
font-family: monospace;
|
||||
}
|
||||
|
||||
@ -12,6 +12,8 @@
|
||||
import { base64_decode, base64_encode } from '../base64';
|
||||
import { bytify, debug } from '../util';
|
||||
|
||||
export const DISK_TYPES = ['dsk','d13','do','po','raw','nib','2mg'];
|
||||
|
||||
export default function DiskII(io, slot, callbacks)
|
||||
{
|
||||
slot = slot || 6;
|
||||
|
||||
406
js/main2.js
406
js/main2.js
@ -1,3 +1,5 @@
|
||||
import MicroModal from 'micromodal';
|
||||
|
||||
import Apple2IO from './apple2io';
|
||||
import ApplesoftDump from './applesoft/decompiler';
|
||||
import { HiresPage, LoresPage, VideoModes } from './canvas';
|
||||
@ -7,12 +9,13 @@ import RAM from './ram';
|
||||
import { debug, gup, hup } from './util';
|
||||
|
||||
import Audio from './ui/audio';
|
||||
import DriveLights from './ui/drive_lights';
|
||||
import { gamepad, configGamepad, initGamepad, processGamepad } from './ui/gamepad';
|
||||
import KeyBoard from './ui/keyboard';
|
||||
import Printer from './ui/printer';
|
||||
import Tape from './ui/tape';
|
||||
import Tape, { TAPE_TYPES } from './ui/tape';
|
||||
|
||||
import DiskII from './cards/disk2';
|
||||
import DiskII, { DISK_TYPES } from './cards/disk2';
|
||||
import LanguageCard from './cards/langcard';
|
||||
import Parallel from './cards/parallel';
|
||||
import RAMFactor from './cards/ramfactor';
|
||||
@ -46,86 +49,11 @@ var TRACE = false;
|
||||
var MAX_TRACE = 256;
|
||||
var trace = [];
|
||||
|
||||
/*
|
||||
* Page viewer
|
||||
*/
|
||||
|
||||
/*
|
||||
function PageDebug(page)
|
||||
{
|
||||
var _page = page;
|
||||
|
||||
function _init() {
|
||||
var r, c;
|
||||
var row = $('<tr />').appendTo('#page' + toHex(_page));
|
||||
$('<th>\\</th>').appendTo(row);
|
||||
for (c = 0; c < 16; c++) {
|
||||
$('<th>' + toHex(c) + '</th>').appendTo(row);
|
||||
}
|
||||
for (r = 0; r < 16; r++) {
|
||||
row = $('<tr />').appendTo('#page' + toHex(_page));
|
||||
$('<th>' + toHex(r * 16) + '</th>').appendTo(row);
|
||||
for (c = 0; c < 16; c++) {
|
||||
$('<td>--</td>').appendTo(row).attr('id', 'page' + toHex(_page) + '-' + toHex(r * 16 + c));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
_init();
|
||||
|
||||
return {
|
||||
start: function() { return _page; },
|
||||
end: function() { return _page; },
|
||||
read: null,
|
||||
write: function(page, off, val) {
|
||||
$('#page' + toHex(page) + '-' + toHex(off)).text(toHex(val));
|
||||
}
|
||||
};
|
||||
}
|
||||
*/
|
||||
|
||||
var disk_categories = {'Local Saves': []};
|
||||
var disk_sets = {};
|
||||
var disk_cur_name = [];
|
||||
var disk_cur_cat = [];
|
||||
|
||||
function DriveLights()
|
||||
{
|
||||
return {
|
||||
driveLight: function(drive, on) {
|
||||
$('#disk' + drive).css('background-image',
|
||||
on ? 'url(css/red-on-16.png)' :
|
||||
'url(css/red-off-16.png)');
|
||||
},
|
||||
dirty: function() {
|
||||
// $('#disksave' + drive).button('option', 'disabled', !dirty);
|
||||
},
|
||||
label: function(drive, label) {
|
||||
if (label) {
|
||||
$('#disklabel' + drive).text(label);
|
||||
}
|
||||
return $('#disklabel' + drive).text();
|
||||
},
|
||||
getState: function() {
|
||||
return {
|
||||
disks: [
|
||||
this.label(1),
|
||||
this.label(2)
|
||||
]
|
||||
};
|
||||
},
|
||||
setState: function(state) {
|
||||
if (state && state.disks) {
|
||||
this.label(1, state.disks[0].label);
|
||||
this.label(2, state.disks[1].label);
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
var DISK_TYPES = ['dsk','d13','do','po','raw','nib','2mg'];
|
||||
var TAPE_TYPES = ['wav','aiff','aif','mp3','m4a'];
|
||||
|
||||
var _currentDrive = 1;
|
||||
|
||||
window.openLoad = function(drive, event)
|
||||
@ -135,9 +63,10 @@ window.openLoad = function(drive, event)
|
||||
openLoadHTTP(drive);
|
||||
} else {
|
||||
if (disk_cur_cat[drive]) {
|
||||
$('#category_select').val(disk_cur_cat[drive]).change();
|
||||
document.querySelector('#category_select').value = disk_cur_cat[drive];
|
||||
window.selectCategory();
|
||||
}
|
||||
$('#load').dialog('open');
|
||||
MicroModal.show('load-modal');
|
||||
}
|
||||
};
|
||||
|
||||
@ -147,17 +76,17 @@ window.openSave = function(drive, event)
|
||||
|
||||
var mimetype = 'application/octet-stream';
|
||||
var data = disk2.getBinary(drive);
|
||||
var a = $('#local_save_link');
|
||||
var a = document.querySelector('#local_save_link');
|
||||
|
||||
var blob = new Blob([data], { 'type': mimetype });
|
||||
a.attr('href', window.URL.createObjectURL(blob));
|
||||
a.attr('download', drivelights.label(drive) + '.dsk');
|
||||
a.href = window.URL.createObjectURL(blob);
|
||||
a.download = drivelights.label(drive) + '.dsk';
|
||||
|
||||
if (event.metaKey) {
|
||||
dumpDisk(drive);
|
||||
} else {
|
||||
$('#save_name').val(drivelights.label(drive));
|
||||
$('#save').dialog('open');
|
||||
document.querySelector('#save_name').value = drivelights.label(drive);
|
||||
MicroModal.show('save-modal');
|
||||
}
|
||||
};
|
||||
|
||||
@ -213,32 +142,29 @@ var loading = false;
|
||||
|
||||
function loadAjax(drive, url) {
|
||||
loading = true;
|
||||
$('#loading').dialog('open');
|
||||
MicroModal.show('loading-modal');
|
||||
|
||||
$.ajax({
|
||||
url: url,
|
||||
dataType: 'json',
|
||||
modifiedSince: true,
|
||||
error: function(xhr, status, error) {
|
||||
alert(error || status);
|
||||
$('#loading').dialog('close');
|
||||
loading = false;
|
||||
},
|
||||
success: function(data) {
|
||||
if (data.type == 'binary') {
|
||||
loadBinary(drive, data);
|
||||
} else if ($.inArray(data.type, DISK_TYPES) >= 0) {
|
||||
loadDisk(drive, data);
|
||||
}
|
||||
initGamepad(data.gamepad);
|
||||
$('#loading').dialog('close');
|
||||
loading = false;
|
||||
fetch(url).then(function(response) {
|
||||
return response.json();
|
||||
}).then(function(data) {
|
||||
if (data.type == 'binary') {
|
||||
loadBinary(drive, data);
|
||||
} else if (DISK_TYPES.includes(data.type)) {
|
||||
loadDisk(drive, data);
|
||||
}
|
||||
initGamepad(data.gamepad);
|
||||
MicroModal.close('loading-modal');
|
||||
loading = false;
|
||||
}).catch(function(error) {
|
||||
window.alert(error || status);
|
||||
MicroModal.close('loading-modal');
|
||||
loading = false;
|
||||
});
|
||||
}
|
||||
|
||||
function doLoad() {
|
||||
var urls = $('#disk_select').val(), url;
|
||||
window.doLoad = function doLoad() {
|
||||
MicroModal.close('load-modal');
|
||||
var urls = document.querySelector('#disk_select').value, url;
|
||||
if (urls && urls.length) {
|
||||
if (typeof(urls) == 'string') {
|
||||
url = urls;
|
||||
@ -247,12 +173,12 @@ function doLoad() {
|
||||
}
|
||||
}
|
||||
|
||||
var files = $('#local_file').prop('files');
|
||||
var files = document.querySelector('#local_file').files;
|
||||
if (files.length == 1) {
|
||||
doLoadLocal(_currentDrive, files[0]);
|
||||
} else if (url) {
|
||||
var filename;
|
||||
$('#load').dialog('close');
|
||||
MicroModal.close('load-modal');
|
||||
if (url.substr(0,6) == 'local:') {
|
||||
filename = url.substr(6);
|
||||
if (filename == '__manage') {
|
||||
@ -270,16 +196,15 @@ function doLoad() {
|
||||
var parts = document.location.hash.split('|');
|
||||
parts[_currentDrive - 1] = filename;
|
||||
document.location.hash = parts.join('|');
|
||||
loadAjax(_currentDrive, url);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
function doSave() {
|
||||
var name = $('#save_name').val();
|
||||
window.doSave = function doSave() {
|
||||
var name = document.querySelector('#save_name').value;
|
||||
saveLocalStorage(_currentDrive, name);
|
||||
$('#save').dialog('close');
|
||||
}
|
||||
MicroModal.close('save-modal');
|
||||
};
|
||||
|
||||
window.doDelete = function(name) {
|
||||
if (window.confirm('Delete ' + name + '?')) {
|
||||
@ -290,15 +215,15 @@ window.doDelete = function(name) {
|
||||
function doLoadLocal(drive, file) {
|
||||
var parts = file.name.split('.');
|
||||
var ext = parts[parts.length - 1].toLowerCase();
|
||||
if ($.inArray(ext, DISK_TYPES) >= 0) {
|
||||
if (DISK_TYPES.includes(ext)) {
|
||||
doLoadLocalDisk(drive, file);
|
||||
} else if ($.inArray(ext, TAPE_TYPES) >= 0) {
|
||||
tape.doLoadLocalTape(file, function() {
|
||||
$('#load').dialog('close');
|
||||
MicroModal.close('load-modal');
|
||||
});
|
||||
} else {
|
||||
window.alert('Unknown file type: ' + ext);
|
||||
$('#load').dialog('close');
|
||||
MicroModal.close('load-modal');
|
||||
}
|
||||
}
|
||||
|
||||
@ -310,7 +235,7 @@ function doLoadLocalDisk(drive, file) {
|
||||
var name = parts.join('.');
|
||||
if (disk2.setBinary(drive, name, ext, this.result)) {
|
||||
drivelights.label(drive, name);
|
||||
$('#load').dialog('close');
|
||||
MicroModal.close('load-modal');
|
||||
initGamepad();
|
||||
}
|
||||
};
|
||||
@ -318,7 +243,7 @@ function doLoadLocalDisk(drive, file) {
|
||||
}
|
||||
|
||||
function doLoadHTTP(drive, _url) {
|
||||
var url = _url || $('#http_url').val();
|
||||
var url = _url || document.querySelector('#http_url').value;
|
||||
if (url) {
|
||||
var req = new XMLHttpRequest();
|
||||
req.open('GET', url, true);
|
||||
@ -332,7 +257,7 @@ function doLoadHTTP(drive, _url) {
|
||||
var name = decodeURIComponent(fileParts.join('.'));
|
||||
if (disk2.setBinary(drive, name, ext, req.response)) {
|
||||
drivelights.label(drive, name);
|
||||
$('#http_load').dialog('close');
|
||||
MicroModal.close('http-modal');
|
||||
initGamepad();
|
||||
}
|
||||
};
|
||||
@ -342,11 +267,11 @@ function doLoadHTTP(drive, _url) {
|
||||
|
||||
function openLoadHTTP(drive) {
|
||||
_currentDrive = parseInt(drive, 10);
|
||||
$('#http_load').dialog('open');
|
||||
MicroModal.show('http-modal');
|
||||
}
|
||||
|
||||
function openManage() {
|
||||
$('#manage').dialog('open');
|
||||
MicroModal.show('manage-modal');
|
||||
}
|
||||
|
||||
var prefs = new Prefs();
|
||||
@ -423,7 +348,7 @@ var io = new Apple2IO(cpu, vm);
|
||||
var keyboard = new KeyBoard(cpu, io);
|
||||
var audio = new Audio(io);
|
||||
var tape = new Tape(io);
|
||||
var printer = new Printer($('#printer .paper'));
|
||||
var printer = new Printer('#printer-modal .paper');
|
||||
|
||||
var lc = new LanguageCard(io, 0, rom);
|
||||
var parallel = new Parallel(io, 1, printer);
|
||||
@ -460,11 +385,11 @@ function updateKHz() {
|
||||
if (window.showFPS) {
|
||||
delta = renderedFrames - lastFrames;
|
||||
var fps = parseInt(delta/(ms/1000), 10);
|
||||
$('#khz').text( fps + 'fps');
|
||||
document.querySelector('#khz').innerText = fps + 'fps';
|
||||
} else {
|
||||
delta = cycles - lastCycles;
|
||||
var khz = parseInt(delta/ms);
|
||||
$('#khz').text( khz + 'KHz');
|
||||
document.querySelector('#khz').innerText = khz + 'KHz';
|
||||
}
|
||||
|
||||
startTime = now;
|
||||
@ -473,13 +398,15 @@ function updateKHz() {
|
||||
}
|
||||
|
||||
window.updateSound = function updateSound() {
|
||||
var on = $('#enable_sound').prop('checked');
|
||||
var label = $('#toggle-sound i');
|
||||
var on = document.querySelector('#enable_sound').checked;
|
||||
var label = document.querySelector('#toggle-sound i');
|
||||
audio.enable(on);
|
||||
if (on) {
|
||||
label.removeClass('fa-volume-off').addClass('fa-volume-up');
|
||||
label.classList.remove('fa-volume-off');
|
||||
label.classList.add('fa-volume-up');
|
||||
} else {
|
||||
label.removeClass('fa-volume-up').addClass('fa-volume-off');
|
||||
label.classList.remove('fa-volume-up');
|
||||
label.classList.add('fa-volume-off');
|
||||
}
|
||||
};
|
||||
|
||||
@ -518,7 +445,7 @@ var accelerated = false;
|
||||
|
||||
window.updateCPU = function updateCPU()
|
||||
{
|
||||
accelerated = $('#accelerator_toggle').prop('checked');
|
||||
accelerated = document.querySelector('#accelerator_toggle').checked;
|
||||
kHz = accelerated ? 4092 : 1023;
|
||||
io.updateHz(kHz * 1000);
|
||||
if (runTimer) {
|
||||
@ -686,29 +613,31 @@ function loadBinary(bin) {
|
||||
}
|
||||
|
||||
window.selectCategory = function() {
|
||||
$('#disk_select').empty();
|
||||
var cat = disk_categories[$('#category_select').val()];
|
||||
document.querySelector('#disk_select').innerHTML = '';
|
||||
var cat = disk_categories[document.querySelector('#category_select').value];
|
||||
if (cat) {
|
||||
for (var idx = 0; idx < cat.length; idx++) {
|
||||
var file = cat[idx], name = file.name;
|
||||
if (file.disk) {
|
||||
name += ' - ' + file.disk;
|
||||
}
|
||||
var option = $('<option />').val(file.filename).text(name)
|
||||
.appendTo('#disk_select');
|
||||
var option = document.createElement('option');
|
||||
option.value = file.filename;
|
||||
option.innerText = name;
|
||||
document.querySelector('#disk_select').append(option);
|
||||
if (disk_cur_name[_currentDrive] == name) {
|
||||
option.attr('selected', 'selected');
|
||||
option.selected = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
window.selectDisk = function() {
|
||||
$('#local_file').val('');
|
||||
document.querySelector('#local_file').value = '';
|
||||
};
|
||||
|
||||
window.clickDisk = function() {
|
||||
doLoad();
|
||||
window.doLoad();
|
||||
};
|
||||
|
||||
function loadDisk(drive, disk) {
|
||||
@ -742,7 +671,7 @@ function updateLocalStorage() {
|
||||
}
|
||||
|
||||
cat = disk_categories['Local Saves'] = [];
|
||||
$('#manage').empty();
|
||||
document.querySelector('#manage-modal-content').innerHTML = '';
|
||||
|
||||
names.forEach(function(name) {
|
||||
cat.push({
|
||||
@ -750,13 +679,12 @@ function updateLocalStorage() {
|
||||
'name': name,
|
||||
'filename': 'local:' + name
|
||||
});
|
||||
$('#manage').append(
|
||||
document.querySelector('#manage-modal-content').innerHTML =
|
||||
'<span class="local_save">' +
|
||||
name +
|
||||
' <a href="#" onclick="doDelete(\'' +
|
||||
name +
|
||||
'\')">Delete</a><br /></span>'
|
||||
);
|
||||
'\')">Delete</a><br /></span>';
|
||||
});
|
||||
cat.push({
|
||||
'category': 'Local Saves',
|
||||
@ -832,9 +760,17 @@ function _keydown(evt) {
|
||||
}
|
||||
if (evt.keyCode === 112) { // F1 - Reset
|
||||
cpu.reset();
|
||||
evt.preventDefault(); // prevent launching help
|
||||
} else if (evt.keyCode === 113) { // F2 - Full Screen
|
||||
var elem = document.getElementById('screen');
|
||||
if (document.webkitCancelFullScreen) {
|
||||
if (evt.shiftKey) { // Full window, but not full screen
|
||||
document.querySelector('#display').classList.toggle('zoomwindow');
|
||||
document.querySelector('#display > div').classList.toggle('overscan', 'flexbox-centering');
|
||||
document.querySelector('#screen').classList.toggle('maxhw');
|
||||
document.querySelector('#header').classList.toggle('hidden');
|
||||
document.querySelector('.inset').classList.toggle('hidden');
|
||||
document.querySelector('#reset').classList.toggle('hidden');
|
||||
} else if (document.webkitCancelFullScreen) {
|
||||
if (document.webkitIsFullScreen) {
|
||||
document.webkitCancelFullScreen();
|
||||
} else {
|
||||
@ -876,8 +812,8 @@ function _keyup(evt) {
|
||||
}
|
||||
|
||||
window.updateScreen = function updateScreen() {
|
||||
var green = $('#green_screen').prop('checked');
|
||||
var scanlines = $('#show_scanlines').prop('checked');
|
||||
var green = document.querySelector('#green_screen').checked;
|
||||
var scanlines = document.querySelector('#show_scanlines').checked;
|
||||
|
||||
vm.green(green);
|
||||
vm.scanlines(scanlines);
|
||||
@ -889,10 +825,10 @@ var flipY = false;
|
||||
var swapXY = false;
|
||||
|
||||
window.updateJoystick = function() {
|
||||
disableMouseJoystick = $('#disable_mouse').prop('checked');
|
||||
flipX = $('#flip_x').prop('checked');
|
||||
flipY = $('#flip_y').prop('checked');
|
||||
swapXY = $('#swap_x_y').prop('checked');
|
||||
disableMouseJoystick = document.querySelector('#disable_mouse').checked;
|
||||
flipX = document.querySelector('#flip_x').checked;
|
||||
flipY = document.querySelector('#flip_y').checked;
|
||||
swapXY = document.querySelector('#swap_x_y').checked;
|
||||
configGamepad(flipX, flipY);
|
||||
|
||||
if (disableMouseJoystick) {
|
||||
@ -907,10 +843,10 @@ function _mousemove(evt) {
|
||||
return;
|
||||
}
|
||||
|
||||
var s = $('#screen');
|
||||
var offset = s.offset();
|
||||
var x = (evt.pageX - offset.left) / s.width(),
|
||||
y = (evt.pageY - offset.top) / s.height(),
|
||||
var s = document.querySelector('#screen');
|
||||
var offset = { top: s.clientTop, left: s.clientLeft };
|
||||
var x = (evt.pageX - offset.left) / s.clientWidth,
|
||||
y = (evt.pageY - offset.top) / s.clientHeight,
|
||||
z = x;
|
||||
|
||||
if (swapXY) {
|
||||
@ -923,79 +859,87 @@ function _mousemove(evt) {
|
||||
}
|
||||
|
||||
window.pauseRun = function() {
|
||||
var label = $('#pause-run i');
|
||||
var label = document.querySelector('#pause-run i');
|
||||
if (paused) {
|
||||
run();
|
||||
label.removeClass('fa-play').addClass('fa-pause');
|
||||
label.classList.remove('fa-play');
|
||||
label.classList.add('fa-pause');
|
||||
} else {
|
||||
stop();
|
||||
label.removeClass('fa-pause').addClass('fa-play');
|
||||
label.classList.remove('fa-pause');
|
||||
label.classList.add('fa-play');
|
||||
}
|
||||
paused = !paused;
|
||||
};
|
||||
|
||||
window.toggleSound = function() {
|
||||
var enableSound = $('#enable_sound');
|
||||
enableSound.prop('checked', !enableSound.prop('checked'));
|
||||
var enableSound = document.querySelector('#enable_sound');
|
||||
enableSound.checked = !enableSound.checked;
|
||||
window.updateSound();
|
||||
};
|
||||
|
||||
$(function() {
|
||||
hashtag = document.location.hash;
|
||||
window.openOptions = function () {
|
||||
MicroModal.show('options-modal');
|
||||
};
|
||||
|
||||
$('button,input[type=button],a.button').button().focus(function() {
|
||||
// Crazy hack required by Chrome
|
||||
var self = this;
|
||||
window.setTimeout(function() {
|
||||
self.blur();
|
||||
}, 1);
|
||||
});
|
||||
window.openPrinterModal = function () {
|
||||
MicroModal.show('printer-modal');
|
||||
};
|
||||
|
||||
MicroModal.init();
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
hashtag = document.location.hash;
|
||||
|
||||
/*
|
||||
* Input Handling
|
||||
*/
|
||||
|
||||
$(window)
|
||||
.keydown(_keydown)
|
||||
.keyup(_keyup)
|
||||
.mousedown(function() { audio.autoStart(); });
|
||||
window.addEventListener('keydown', _keydown);
|
||||
window.addEventListener('keyup', _keyup);
|
||||
window.addEventListener('mousedown', function() { audio.autoStart(); });
|
||||
|
||||
$('canvas')
|
||||
.mousedown(function(evt) {
|
||||
document.querySelectorAll('canvas').forEach(function(canvas) {
|
||||
canvas.addEventListener('mousedown', function(evt) {
|
||||
if (!gamepad) {
|
||||
io.buttonDown(evt.which == 1 ? 0 : 1);
|
||||
}
|
||||
evt.preventDefault();
|
||||
})
|
||||
.mouseup(function(evt) {
|
||||
});
|
||||
canvas.addEventListener('mouseup', function(evt) {
|
||||
if (!gamepad) {
|
||||
io.buttonUp(evt.which == 1 ? 0 : 1);
|
||||
}
|
||||
})
|
||||
.bind('contextmenu', function(evt) { evt.preventDefault(); });
|
||||
});
|
||||
});
|
||||
|
||||
$('body').mousemove(_mousemove);
|
||||
document.body.addEventListener('mousemove', _mousemove);
|
||||
|
||||
$('input,textarea')
|
||||
.focus(function() { focused = true; })
|
||||
.blur(function() { focused = false; });
|
||||
document.querySelectorAll('input,textarea').forEach(function(input) {
|
||||
input.addEventListener('input', function() { focused = true; });
|
||||
input.addEventListener('blur', function() { focused = false; });
|
||||
});
|
||||
|
||||
keyboard.create('#keyboard');
|
||||
|
||||
if (prefs.havePrefs()) {
|
||||
$('#options input[type=checkbox]').each(function() {
|
||||
var val = prefs.readPref(this.id);
|
||||
if (val)
|
||||
this.checked = JSON.parse(val);
|
||||
}).change(function() {
|
||||
prefs.writePref(this.id, JSON.stringify(this.checked));
|
||||
document.querySelectorAll('#options-modal input[type=checkbox]').forEach(function(el) {
|
||||
var val = prefs.readPref(el.id);
|
||||
if (val) {
|
||||
el.checked = JSON.parse(val);
|
||||
}
|
||||
el.addEventListener('change', function() {
|
||||
prefs.writePref(el.id, JSON.stringify(el.checked));
|
||||
});
|
||||
});
|
||||
$('#options select').each(function() {
|
||||
var val = prefs.readPref(this.id);
|
||||
if (val)
|
||||
this.value = val;
|
||||
}).change(function() {
|
||||
prefs.writePref(this.id, this.value);
|
||||
document.querySelectorAll('#options-modal select').forEach(function(el) {
|
||||
var val = prefs.readPref(el.id);
|
||||
if (val) {
|
||||
el.value = val;
|
||||
}
|
||||
el.addEventListener('change', function() {
|
||||
prefs.writePref(el.id, el.value);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
@ -1005,54 +949,12 @@ $(function() {
|
||||
window.updateScreen();
|
||||
window.updateCPU();
|
||||
|
||||
var cancel = function() { $(this).dialog('close'); };
|
||||
$('#loading').dialog({ autoOpen: false, modal: true });
|
||||
$('#options').dialog({
|
||||
autoOpen: false,
|
||||
modal: true,
|
||||
width: 320,
|
||||
buttons: {'Close': cancel }
|
||||
});
|
||||
$('#load').dialog({
|
||||
autoOpen: false,
|
||||
modal: true,
|
||||
width: 540,
|
||||
buttons: {'Cancel': cancel, 'Load': doLoad }
|
||||
});
|
||||
$('#save').dialog({
|
||||
autoOpen: false,
|
||||
modal: true,
|
||||
width: 320,
|
||||
buttons: {'Cancel': cancel, 'Save': doSave }
|
||||
});
|
||||
$('#manage').dialog({
|
||||
autoOpen: false,
|
||||
modal: true,
|
||||
width: 320,
|
||||
buttons: {'Close': cancel }
|
||||
});
|
||||
$('#printer').dialog({
|
||||
autoOpen: false,
|
||||
modal: true,
|
||||
resizeable: false,
|
||||
width: 570,
|
||||
buttons: {
|
||||
'Clear': printer.clear,
|
||||
'Close': cancel
|
||||
}
|
||||
});
|
||||
$('#http_load').dialog({
|
||||
autoOpen: false,
|
||||
modal: true,
|
||||
width: 530,
|
||||
buttons: {'Cancel': cancel, 'OK': doLoadHTTP }
|
||||
});
|
||||
|
||||
if (window.localStorage !== undefined) {
|
||||
$('.disksave').show();
|
||||
document.querySelectorAll('.disksave').forEach(function (el) { el.style.display = 'inline-block';});
|
||||
}
|
||||
|
||||
var oldcat = '';
|
||||
var option;
|
||||
for (var idx = 0; idx < window.disk_index.length; idx++) {
|
||||
var file = window.disk_index[idx];
|
||||
var cat = file.category;
|
||||
@ -1061,7 +963,11 @@ $(function() {
|
||||
continue;
|
||||
}
|
||||
if (cat != oldcat) {
|
||||
$('<option />').val(cat).text(cat).appendTo('#category_select');
|
||||
option = document.createElement('option');
|
||||
option.value = cat;
|
||||
option.innerText = cat;
|
||||
document.querySelector('#category_select').append(option);
|
||||
|
||||
disk_categories[cat] = [];
|
||||
oldcat = cat;
|
||||
}
|
||||
@ -1073,7 +979,9 @@ $(function() {
|
||||
disk_sets[name].push(file);
|
||||
}
|
||||
}
|
||||
$('<option/>').text('Local Saves').appendTo('#category_select');
|
||||
option = document.createElement('option');
|
||||
option.innerText = 'Local Saves';
|
||||
document.querySelector('#category_select').append(option);
|
||||
|
||||
updateLocalStorage();
|
||||
initGamepad();
|
||||
@ -1085,23 +993,21 @@ $(function() {
|
||||
processHash(hash);
|
||||
}
|
||||
|
||||
if (navigator.userAgent.match(/(iPod|iPhone|iPad)/)) {
|
||||
$('select').removeAttr('multiple').css('height', 'auto');
|
||||
}
|
||||
|
||||
if (navigator.standalone) {
|
||||
$('body').addClass('standalone');
|
||||
document.body.classList.add('standalone');
|
||||
}
|
||||
|
||||
$('.key-REPT').click(function() {
|
||||
$('#keyboard').hide();
|
||||
$('#textarea').show();
|
||||
$('#text_input').focus();
|
||||
var reptKey = document.querySelector('.key-REPT');
|
||||
reptKey.addEventListener('click', function() {
|
||||
document.querySelector('#keyboard').style.display = 'none';
|
||||
document.querySelector('#textarea').style.display = 'block';
|
||||
document.querySelector.focus();
|
||||
});
|
||||
$('#text_input').keydown(function() {
|
||||
focused = $('#buffering').prop('checked');
|
||||
}).keyup(function() {
|
||||
focused = $('#buffering').prop('checked');
|
||||
document.querySelector('#text_input').addEventListener('keydown', function() {
|
||||
focused = document.querySelector('#buffering').checked;
|
||||
});
|
||||
document.querySelector('#text_input').addEventListener('keyup', function() {
|
||||
focused = document.querySelector('#buffering').checked;
|
||||
});
|
||||
|
||||
run();
|
||||
|
||||
421
js/main2e.js
421
js/main2e.js
@ -1,3 +1,5 @@
|
||||
import MicroModal from 'micromodal';
|
||||
|
||||
import Apple2IO from './apple2io';
|
||||
import ApplesoftDump from './applesoft/decompiler';
|
||||
import { HiresPage, LoresPage, VideoModes } from './canvas';
|
||||
@ -7,12 +9,13 @@ import Prefs from './prefs';
|
||||
import { debug, gup, hup } from './util';
|
||||
|
||||
import Audio from './ui/audio';
|
||||
import DriveLights from './ui/drive_lights';
|
||||
import { gamepad, configGamepad, initGamepad, processGamepad } from './ui/gamepad';
|
||||
import KeyBoard from './ui/keyboard';
|
||||
import Printer from './ui/printer';
|
||||
import Tape from './ui/tape';
|
||||
import Tape, { TAPE_TYPES } from './ui/tape';
|
||||
|
||||
import DiskII from './cards/disk2';
|
||||
import DiskII, { DISK_TYPES } from './cards/disk2';
|
||||
import Parallel from './cards/parallel';
|
||||
import RAMFactor from './cards/ramfactor';
|
||||
import Thunderclock from './cards/thunderclock';
|
||||
@ -41,86 +44,11 @@ var TRACE = false;
|
||||
var MAX_TRACE = 256;
|
||||
var trace = [];
|
||||
|
||||
/*
|
||||
* Page viewer
|
||||
*/
|
||||
|
||||
/*
|
||||
function PageDebug(page)
|
||||
{
|
||||
var _page = page;
|
||||
|
||||
function _init() {
|
||||
var r, c;
|
||||
var row = $('<tr />').appendTo('#page' + toHex(_page));
|
||||
$('<th>\\</th>').appendTo(row);
|
||||
for (c = 0; c < 16; c++) {
|
||||
$('<th>' + toHex(c) + '</th>').appendTo(row);
|
||||
}
|
||||
for (r = 0; r < 16; r++) {
|
||||
row = $('<tr />').appendTo('#page' + toHex(_page));
|
||||
$('<th>' + toHex(r * 16) + '</th>').appendTo(row);
|
||||
for (c = 0; c < 16; c++) {
|
||||
$('<td>--</td>').appendTo(row).attr('id', 'page' + toHex(_page) + '-' + toHex(r * 16 + c));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
_init();
|
||||
|
||||
return {
|
||||
start: function() { return _page; },
|
||||
end: function() { return _page; },
|
||||
read: null,
|
||||
write: function(page, off, val) {
|
||||
$('#page' + toHex(page) + '-' + toHex(off)).text(toHex(val));
|
||||
}
|
||||
};
|
||||
}
|
||||
*/
|
||||
|
||||
var disk_categories = {'Local Saves': []};
|
||||
var disk_sets = {};
|
||||
var disk_cur_name = [];
|
||||
var disk_cur_cat = [];
|
||||
|
||||
function DriveLights()
|
||||
{
|
||||
return {
|
||||
driveLight: function(drive, on) {
|
||||
$('#disk' + drive).css('background-image',
|
||||
on ? 'url(css/red-on-16.png)' :
|
||||
'url(css/red-off-16.png)');
|
||||
},
|
||||
dirty: function() {
|
||||
// $('#disksave' + drive).button('option', 'disabled', !dirty);
|
||||
},
|
||||
label: function(drive, label) {
|
||||
if (label) {
|
||||
$('#disklabel' + drive).text(label);
|
||||
}
|
||||
return $('#disklabel' + drive).text();
|
||||
},
|
||||
getState: function() {
|
||||
return {
|
||||
disks: [
|
||||
this.label(1),
|
||||
this.label(2)
|
||||
]
|
||||
};
|
||||
},
|
||||
setState: function(state) {
|
||||
if (state && state.disks) {
|
||||
this.label(1, state.disks[0].label);
|
||||
this.label(2, state.disks[1].label);
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
var DISK_TYPES = ['dsk','d13','do','po','raw','nib','2mg'];
|
||||
var TAPE_TYPES = ['wav','aiff','aif','mp3','m4a'];
|
||||
|
||||
var _currentDrive = 1;
|
||||
|
||||
window.openLoad = function(drive, event)
|
||||
@ -130,9 +58,10 @@ window.openLoad = function(drive, event)
|
||||
openLoadHTTP(drive);
|
||||
} else {
|
||||
if (disk_cur_cat[drive]) {
|
||||
$('#category_select').val(disk_cur_cat[drive]).change();
|
||||
document.querySelector('#category_select').value = disk_cur_cat[drive];
|
||||
window.selectCategory();
|
||||
}
|
||||
$('#load').dialog('open');
|
||||
MicroModal.show('load-modal');
|
||||
}
|
||||
};
|
||||
|
||||
@ -142,17 +71,17 @@ window.openSave = function(drive, event)
|
||||
|
||||
var mimetype = 'application/octet-stream';
|
||||
var data = disk2.getBinary(drive);
|
||||
var a = $('#local_save_link');
|
||||
var a = document.querySelector('#local_save_link');
|
||||
|
||||
var blob = new Blob([data], { 'type': mimetype });
|
||||
a.attr('href', window.URL.createObjectURL(blob));
|
||||
a.attr('download', drivelights.label(drive) + '.dsk');
|
||||
a.href = window.URL.createObjectURL(blob);
|
||||
a.download = drivelights.label(drive) + '.dsk';
|
||||
|
||||
if (event.metaKey) {
|
||||
dumpDisk(drive);
|
||||
} else {
|
||||
$('#save_name').val(drivelights.label(drive));
|
||||
$('#save').dialog('open');
|
||||
document.querySelector('#save_name').value = drivelights.label(drive);
|
||||
MicroModal.show('save-modal');
|
||||
}
|
||||
};
|
||||
|
||||
@ -191,6 +120,16 @@ window.handleDrop = function(drive, event) {
|
||||
} else if (dt.files.length == 2) {
|
||||
doLoadLocal(1, dt.files[0]);
|
||||
doLoadLocal(2, dt.files[1]);
|
||||
} else {
|
||||
for (var idx = 0; idx < dt.items.length; idx++) {
|
||||
if (dt.items[idx].type === 'text/uri-list') {
|
||||
dt.items[idx].getAsString(function(url) {
|
||||
var parts = document.location.hash.split('|');
|
||||
parts[drive - 1] = url;
|
||||
document.location.hash = parts.join('|');
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@ -198,32 +137,29 @@ var loading = false;
|
||||
|
||||
function loadAjax(drive, url) {
|
||||
loading = true;
|
||||
$('#loading').dialog('open');
|
||||
MicroModal.show('loading-modal');
|
||||
|
||||
$.ajax({
|
||||
url: url,
|
||||
dataType: 'json',
|
||||
modifiedSince: true,
|
||||
error: function(xhr, status, error) {
|
||||
alert(error || status);
|
||||
$('#loading').dialog('close');
|
||||
loading = false;
|
||||
},
|
||||
success: function(data) {
|
||||
if (data.type == 'binary') {
|
||||
loadBinary(drive, data);
|
||||
} else if ($.inArray(data.type, DISK_TYPES) >= 0) {
|
||||
loadDisk(drive, data);
|
||||
}
|
||||
initGamepad(data.gamepad);
|
||||
$('#loading').dialog('close');
|
||||
loading = false;
|
||||
fetch(url).then(function(response) {
|
||||
return response.json();
|
||||
}).then(function(data) {
|
||||
if (data.type == 'binary') {
|
||||
loadBinary(drive, data);
|
||||
} else if (DISK_TYPES.includes(data.type)) {
|
||||
loadDisk(drive, data);
|
||||
}
|
||||
initGamepad(data.gamepad);
|
||||
MicroModal.close('loading-modal');
|
||||
loading = false;
|
||||
}).catch(function(error) {
|
||||
window.alert(error || status);
|
||||
MicroModal.close('loading-modal');
|
||||
loading = false;
|
||||
});
|
||||
}
|
||||
|
||||
function doLoad() {
|
||||
var urls = $('#disk_select').val(), url;
|
||||
window.doLoad = function doLoad() {
|
||||
MicroModal.close('load-modal');
|
||||
var urls = document.querySelector('#disk_select').value, url;
|
||||
if (urls && urls.length) {
|
||||
if (typeof(urls) == 'string') {
|
||||
url = urls;
|
||||
@ -232,12 +168,12 @@ function doLoad() {
|
||||
}
|
||||
}
|
||||
|
||||
var files = $('#local_file').prop('files');
|
||||
var files = document.querySelector('#local_file').files;
|
||||
if (files.length == 1) {
|
||||
doLoadLocal(_currentDrive, files[0]);
|
||||
} else if (url) {
|
||||
var filename;
|
||||
$('#load').dialog('close');
|
||||
MicroModal.close('load-modal');
|
||||
if (url.substr(0,6) == 'local:') {
|
||||
filename = url.substr(6);
|
||||
if (filename == '__manage') {
|
||||
@ -255,16 +191,15 @@ function doLoad() {
|
||||
var parts = document.location.hash.split('|');
|
||||
parts[_currentDrive - 1] = filename;
|
||||
document.location.hash = parts.join('|');
|
||||
loadAjax(_currentDrive, url);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
function doSave() {
|
||||
var name = $('#save_name').val();
|
||||
window.doSave = function doSave() {
|
||||
var name = document.querySelector('#save_name').value;
|
||||
saveLocalStorage(_currentDrive, name);
|
||||
$('#save').dialog('close');
|
||||
}
|
||||
MicroModal.close('save-modal');
|
||||
};
|
||||
|
||||
window.doDelete = function(name) {
|
||||
if (window.confirm('Delete ' + name + '?')) {
|
||||
@ -275,15 +210,15 @@ window.doDelete = function(name) {
|
||||
function doLoadLocal(drive, file) {
|
||||
var parts = file.name.split('.');
|
||||
var ext = parts[parts.length - 1].toLowerCase();
|
||||
if ($.inArray(ext, DISK_TYPES) >= 0) {
|
||||
if (DISK_TYPES.includes(ext)) {
|
||||
doLoadLocalDisk(drive, file);
|
||||
} else if ($.inArray(ext, TAPE_TYPES) >= 0) {
|
||||
tape.doLoadLocalTape(file, function() {
|
||||
$('#load').dialog('close');
|
||||
MicroModal.close('load-modal');
|
||||
});
|
||||
} else {
|
||||
window.alert('Unknown file type: ' + ext);
|
||||
$('#load').dialog('close');
|
||||
MicroModal.close('load-modal');
|
||||
}
|
||||
}
|
||||
|
||||
@ -295,7 +230,7 @@ function doLoadLocalDisk(drive, file) {
|
||||
var name = parts.join('.');
|
||||
if (disk2.setBinary(drive, name, ext, this.result)) {
|
||||
drivelights.label(drive, name);
|
||||
$('#load').dialog('close');
|
||||
MicroModal.close('load-modal');
|
||||
initGamepad();
|
||||
}
|
||||
};
|
||||
@ -303,7 +238,7 @@ function doLoadLocalDisk(drive, file) {
|
||||
}
|
||||
|
||||
function doLoadHTTP(drive, _url) {
|
||||
var url = _url || $('#http_url').val();
|
||||
var url = _url || document.querySelector('#http_url').value;
|
||||
if (url) {
|
||||
var req = new XMLHttpRequest();
|
||||
req.open('GET', url, true);
|
||||
@ -317,7 +252,7 @@ function doLoadHTTP(drive, _url) {
|
||||
var name = decodeURIComponent(fileParts.join('.'));
|
||||
if (disk2.setBinary(drive, name, ext, req.response)) {
|
||||
drivelights.label(drive, name);
|
||||
$('#http_load').dialog('close');
|
||||
MicroModal.close('http-modal');
|
||||
initGamepad();
|
||||
}
|
||||
};
|
||||
@ -327,11 +262,11 @@ function doLoadHTTP(drive, _url) {
|
||||
|
||||
function openLoadHTTP(drive) {
|
||||
_currentDrive = parseInt(drive, 10);
|
||||
$('#http_load').dialog('open');
|
||||
MicroModal.show('http-modal');
|
||||
}
|
||||
|
||||
function openManage() {
|
||||
$('#manage').dialog('open');
|
||||
MicroModal.show('manage-modal');
|
||||
}
|
||||
|
||||
var prefs = new Prefs();
|
||||
@ -397,7 +332,7 @@ var io = new Apple2IO(cpu, vm);
|
||||
var keyboard = new KeyBoard(cpu, io, true);
|
||||
var audio = new Audio(io);
|
||||
var tape = new Tape(io);
|
||||
var printer = new Printer($('#printer .paper'));
|
||||
var printer = new Printer('#printer-modal .paper');
|
||||
|
||||
var mmu = new MMU(cpu, vm, gr, gr2, hgr, hgr2, io, rom);
|
||||
|
||||
@ -424,11 +359,11 @@ function updateKHz() {
|
||||
if (window.showFPS) {
|
||||
delta = renderedFrames - lastFrames;
|
||||
var fps = parseInt(delta/(ms/1000), 10);
|
||||
$('#khz').text( fps + 'fps');
|
||||
document.querySelector('#khz').innerText = fps + 'fps';
|
||||
} else {
|
||||
delta = cycles - lastCycles;
|
||||
var khz = parseInt(delta/ms);
|
||||
$('#khz').text( khz + 'KHz');
|
||||
document.querySelector('#khz').innerText = khz + 'KHz';
|
||||
}
|
||||
|
||||
startTime = now;
|
||||
@ -436,14 +371,16 @@ function updateKHz() {
|
||||
lastFrames = renderedFrames;
|
||||
}
|
||||
|
||||
window.updateSound = function() {
|
||||
var on = $('#enable_sound').prop('checked');
|
||||
var label = $('#toggle-sound i');
|
||||
window.updateSound = function updateSound() {
|
||||
var on = document.querySelector('#enable_sound').checked;
|
||||
var label = document.querySelector('#toggle-sound i');
|
||||
audio.enable(on);
|
||||
if (on) {
|
||||
label.removeClass('fa-volume-off').addClass('fa-volume-up');
|
||||
label.classList.remove('fa-volume-off');
|
||||
label.classList.add('fa-volume-up');
|
||||
} else {
|
||||
label.removeClass('fa-volume-up').addClass('fa-volume-off');
|
||||
label.classList.remove('fa-volume-up');
|
||||
label.classList.add('fa-volume-off');
|
||||
}
|
||||
};
|
||||
|
||||
@ -480,9 +417,9 @@ window.step = function()
|
||||
|
||||
var accelerated = false;
|
||||
|
||||
window.updateCPU = function()
|
||||
window.updateCPU = function updateCPU()
|
||||
{
|
||||
accelerated = $('#accelerator_toggle').prop('checked');
|
||||
accelerated = document.querySelector('#accelerator_toggle').checked;
|
||||
kHz = accelerated ? 4092 : 1023;
|
||||
io.updateHz(kHz * 1000);
|
||||
if (runTimer) {
|
||||
@ -510,7 +447,6 @@ function run(pc) {
|
||||
var now, last = Date.now();
|
||||
var runFn = function() {
|
||||
now = Date.now();
|
||||
renderedFrames++;
|
||||
|
||||
var step = (now - last) * kHz, stepMax = kHz * ival;
|
||||
last = now;
|
||||
@ -543,7 +479,9 @@ function run(pc) {
|
||||
} else {
|
||||
cpu.stepCycles(step);
|
||||
}
|
||||
vm.blit();
|
||||
if (vm.blit()) {
|
||||
renderedFrames++;
|
||||
}
|
||||
io.tick();
|
||||
}
|
||||
|
||||
@ -635,29 +573,31 @@ function loadBinary(bin) {
|
||||
}
|
||||
|
||||
window.selectCategory = function() {
|
||||
$('#disk_select').empty();
|
||||
var cat = disk_categories[$('#category_select').val()];
|
||||
document.querySelector('#disk_select').innerHTML = '';
|
||||
var cat = disk_categories[document.querySelector('#category_select').value];
|
||||
if (cat) {
|
||||
for (var idx = 0; idx < cat.length; idx++) {
|
||||
var file = cat[idx], name = file.name;
|
||||
if (file.disk) {
|
||||
name += ' - ' + file.disk;
|
||||
}
|
||||
var option = $('<option />').val(file.filename).text(name)
|
||||
.appendTo('#disk_select');
|
||||
var option = document.createElement('option');
|
||||
option.value = file.filename;
|
||||
option.innerText = name;
|
||||
document.querySelector('#disk_select').append(option);
|
||||
if (disk_cur_name[_currentDrive] == name) {
|
||||
option.attr('selected', 'selected');
|
||||
option.selected = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
window.selectDisk = function() {
|
||||
$('#local_file').val('');
|
||||
document.querySelector('#local_file').value = '';
|
||||
};
|
||||
|
||||
window.clickDisk = function() {
|
||||
doLoad();
|
||||
window.doLoad();
|
||||
};
|
||||
|
||||
function loadDisk(drive, disk) {
|
||||
@ -691,7 +631,7 @@ function updateLocalStorage() {
|
||||
}
|
||||
|
||||
cat = disk_categories['Local Saves'] = [];
|
||||
$('#manage').empty();
|
||||
document.querySelector('#manage-modal-content').innerHTML = '';
|
||||
|
||||
names.forEach(function(name) {
|
||||
cat.push({
|
||||
@ -699,13 +639,12 @@ function updateLocalStorage() {
|
||||
'name': name,
|
||||
'filename': 'local:' + name
|
||||
});
|
||||
$('#manage').append(
|
||||
document.querySelector('#manage-modal-content').innerHTML =
|
||||
'<span class="local_save">' +
|
||||
name +
|
||||
' <a href="#" onclick="doDelete(\'' +
|
||||
name +
|
||||
'\')">Delete</a><br /></span>'
|
||||
);
|
||||
'\')">Delete</a><br /></span>';
|
||||
});
|
||||
cat.push({
|
||||
'category': 'Local Saves',
|
||||
@ -773,9 +712,7 @@ function processHash(hash) {
|
||||
window.reset = keyboard.reset;
|
||||
|
||||
function _keydown(evt) {
|
||||
audio.autoStart();
|
||||
|
||||
if (!focused) {
|
||||
if (!focused && (!evt.metaKey || evt.ctrlKey)) {
|
||||
evt.preventDefault();
|
||||
|
||||
var key = keyboard.mapKeyEvent(evt);
|
||||
@ -789,14 +726,12 @@ function _keydown(evt) {
|
||||
} else if (evt.keyCode === 113) { // F2 - Full Screen
|
||||
var elem = document.getElementById('screen');
|
||||
if (evt.shiftKey) { // Full window, but not full screen
|
||||
$('#display').toggleClass('zoomwindow');
|
||||
$('#display > div')
|
||||
.toggleClass('overscan')
|
||||
.toggleClass('flexbox-centering');
|
||||
$('#screen').toggleClass('maxhw');
|
||||
$('#header').toggleClass('hidden');
|
||||
$('.inset').toggleClass('hidden');
|
||||
$('#reset').toggleClass('hidden');
|
||||
document.querySelector('#display').classList.toggle('zoomwindow');
|
||||
document.querySelector('#display > div').classList.toggle('overscan', 'flexbox-centering');
|
||||
document.querySelector('#screen').classList.toggle('maxhw');
|
||||
document.querySelector('#header').classList.toggle('hidden');
|
||||
document.querySelector('.inset').classList.toggle('hidden');
|
||||
document.querySelector('#reset').classList.toggle('hidden');
|
||||
} else if (document.webkitCancelFullScreen) {
|
||||
if (document.webkitIsFullScreen) {
|
||||
document.webkitCancelFullScreen();
|
||||
@ -827,7 +762,7 @@ function _keydown(evt) {
|
||||
} else if (evt.keyCode == 91 || evt.keyCode == 93) { // Command
|
||||
keyboard.commandKey(true);
|
||||
} else if (evt.keyCode == 18) { // Alt
|
||||
if (evt.originalEvent.location == 1) {
|
||||
if (evt.location == 1) {
|
||||
keyboard.commandKey(true);
|
||||
} else {
|
||||
keyboard.optionKey(true);
|
||||
@ -846,7 +781,7 @@ function _keyup(evt) {
|
||||
} else if (evt.keyCode == 91 || evt.keyCode == 93) { // Command
|
||||
keyboard.commandKey(false);
|
||||
} else if (evt.keyCode == 18) { // Alt
|
||||
if (evt.originalEvent.location == 1) {
|
||||
if (evt.location == 1) {
|
||||
keyboard.commandKey(false);
|
||||
} else {
|
||||
keyboard.optionKey(false);
|
||||
@ -854,9 +789,9 @@ function _keyup(evt) {
|
||||
}
|
||||
}
|
||||
|
||||
window.updateScreen = function() {
|
||||
var green = $('#green_screen').prop('checked');
|
||||
var scanlines = $('#show_scanlines').prop('checked');
|
||||
window.updateScreen = function updateScreen() {
|
||||
var green = document.querySelector('#green_screen').checked;
|
||||
var scanlines = document.querySelector('#show_scanlines').checked;
|
||||
|
||||
vm.green(green);
|
||||
vm.scanlines(scanlines);
|
||||
@ -868,10 +803,10 @@ var flipY = false;
|
||||
var swapXY = false;
|
||||
|
||||
window.updateJoystick = function() {
|
||||
disableMouseJoystick = $('#disable_mouse').prop('checked');
|
||||
flipX = $('#flip_x').prop('checked');
|
||||
flipY = $('#flip_y').prop('checked');
|
||||
swapXY = $('#swap_x_y').prop('checked');
|
||||
disableMouseJoystick = document.querySelector('#disable_mouse').checked;
|
||||
flipX = document.querySelector('#flip_x').checked;
|
||||
flipY = document.querySelector('#flip_y').checked;
|
||||
swapXY = document.querySelector('#swap_x_y').checked;
|
||||
configGamepad(flipX, flipY);
|
||||
|
||||
if (disableMouseJoystick) {
|
||||
@ -886,10 +821,10 @@ function _mousemove(evt) {
|
||||
return;
|
||||
}
|
||||
|
||||
var s = $('#screen');
|
||||
var offset = s.offset();
|
||||
var x = (evt.pageX - offset.left) / s.width(),
|
||||
y = (evt.pageY - offset.top) / s.height(),
|
||||
var s = document.querySelector('#screen');
|
||||
var offset = { top: s.clientTop, left: s.clientLeft };
|
||||
var x = (evt.pageX - offset.left) / s.clientWidth,
|
||||
y = (evt.pageY - offset.top) / s.clientHeight,
|
||||
z = x;
|
||||
|
||||
if (swapXY) {
|
||||
@ -902,79 +837,87 @@ function _mousemove(evt) {
|
||||
}
|
||||
|
||||
window.pauseRun = function() {
|
||||
var label = $('#pause-run i');
|
||||
var label = document.querySelector('#pause-run i');
|
||||
if (paused) {
|
||||
run();
|
||||
label.removeClass('fa-play').addClass('fa-pause');
|
||||
label.classList.remove('fa-play');
|
||||
label.classList.add('fa-pause');
|
||||
} else {
|
||||
stop();
|
||||
label.removeClass('fa-pause').addClass('fa-play');
|
||||
label.classList.remove('fa-pause');
|
||||
label.classList.add('fa-play');
|
||||
}
|
||||
paused = !paused;
|
||||
};
|
||||
|
||||
window.toggleSound = function() {
|
||||
var enableSound = $('#enable_sound');
|
||||
enableSound.prop('checked', !enableSound.prop('checked'));
|
||||
var enableSound = document.querySelector('#enable_sound');
|
||||
enableSound.checked = !enableSound.checked;
|
||||
window.updateSound();
|
||||
};
|
||||
|
||||
$(function() {
|
||||
hashtag = document.location.hash;
|
||||
window.openOptions = function () {
|
||||
MicroModal.show('options-modal');
|
||||
};
|
||||
|
||||
$('button,input[type=button],a.button').button().focus(function() {
|
||||
// Crazy hack required by Chrome
|
||||
var self = this;
|
||||
window.setTimeout(function() {
|
||||
self.blur();
|
||||
}, 1);
|
||||
});
|
||||
window.openPrinterModal = function () {
|
||||
MicroModal.show('printer-modal');
|
||||
};
|
||||
|
||||
MicroModal.init();
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
hashtag = document.location.hash;
|
||||
|
||||
/*
|
||||
* Input Handling
|
||||
*/
|
||||
|
||||
$(window)
|
||||
.keydown(_keydown)
|
||||
.keyup(_keyup)
|
||||
.mousedown(function() { audio.autoStart(); });
|
||||
window.addEventListener('keydown', _keydown);
|
||||
window.addEventListener('keyup', _keyup);
|
||||
window.addEventListener('mousedown', function() { audio.autoStart(); });
|
||||
|
||||
$('canvas')
|
||||
.mousedown(function(evt) {
|
||||
document.querySelectorAll('canvas').forEach(function(canvas) {
|
||||
canvas.addEventListener('mousedown', function(evt) {
|
||||
if (!gamepad) {
|
||||
io.buttonDown(evt.which == 1 ? 0 : 1);
|
||||
}
|
||||
evt.preventDefault();
|
||||
})
|
||||
.mouseup(function(evt) {
|
||||
});
|
||||
canvas.addEventListener('mouseup', function(evt) {
|
||||
if (!gamepad) {
|
||||
io.buttonUp(evt.which == 1 ? 0 : 1);
|
||||
}
|
||||
})
|
||||
.bind('contextmenu', function(evt) { evt.preventDefault(); });
|
||||
});
|
||||
});
|
||||
|
||||
$('body').mousemove(_mousemove);
|
||||
document.body.addEventListener('mousemove', _mousemove);
|
||||
|
||||
$('input,textarea')
|
||||
.focus(function() { focused = true; })
|
||||
.blur(function() { focused = false; });
|
||||
document.querySelectorAll('input,textarea').forEach(function(input) {
|
||||
input.addEventListener('input', function() { focused = true; });
|
||||
input.addEventListener('blur', function() { focused = false; });
|
||||
});
|
||||
|
||||
keyboard.create('#keyboard');
|
||||
|
||||
if (prefs.havePrefs()) {
|
||||
$('#options input[type=checkbox]').each(function() {
|
||||
var val = prefs.readPref(this.id);
|
||||
if (val)
|
||||
this.checked = JSON.parse(val);
|
||||
}).change(function() {
|
||||
prefs.writePref(this.id, JSON.stringify(this.checked));
|
||||
document.querySelectorAll('#options-modal input[type=checkbox]').forEach(function(el) {
|
||||
var val = prefs.readPref(el.id);
|
||||
if (val) {
|
||||
el.checked = JSON.parse(val);
|
||||
}
|
||||
el.addEventListener('change', function() {
|
||||
prefs.writePref(el.id, JSON.stringify(el.checked));
|
||||
});
|
||||
});
|
||||
$('#options select').each(function() {
|
||||
var val = prefs.readPref(this.id);
|
||||
if (val)
|
||||
this.value = val;
|
||||
}).change(function() {
|
||||
prefs.writePref(this.id, this.value);
|
||||
document.querySelectorAll('#options-modal select').forEach(function(el) {
|
||||
var val = prefs.readPref(el.id);
|
||||
if (val) {
|
||||
el.value = val;
|
||||
}
|
||||
el.addEventListener('change', function() {
|
||||
prefs.writePref(el.id, el.value);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
@ -984,60 +927,22 @@ $(function() {
|
||||
window.updateScreen();
|
||||
window.updateCPU();
|
||||
|
||||
var cancel = function() { $(this).dialog('close'); };
|
||||
$('#loading').dialog({ autoOpen: false, modal: true });
|
||||
$('#options').dialog({
|
||||
autoOpen: false,
|
||||
modal: true,
|
||||
width: 320,
|
||||
buttons: {'Close': cancel }
|
||||
});
|
||||
$('#load').dialog({
|
||||
autoOpen: false,
|
||||
modal: true,
|
||||
width: 540,
|
||||
buttons: {'Cancel': cancel, 'Load': doLoad }
|
||||
});
|
||||
$('#save').dialog({
|
||||
autoOpen: false,
|
||||
modal: true,
|
||||
width: 320,
|
||||
buttons: {'Cancel': cancel, 'Save': doSave }
|
||||
});
|
||||
$('#manage').dialog({
|
||||
autoOpen: false,
|
||||
modal: true,
|
||||
width: 320,
|
||||
buttons: {'Close': cancel }
|
||||
});
|
||||
$('#printer').dialog({
|
||||
autoOpen: false,
|
||||
modal: true,
|
||||
resizeable: false,
|
||||
width: 570,
|
||||
buttons: {
|
||||
'Clear': printer.clear,
|
||||
'Close': cancel
|
||||
}
|
||||
});
|
||||
$('#http_load').dialog({
|
||||
autoOpen: false,
|
||||
modal: true,
|
||||
width: 530,
|
||||
buttons: {'Cancel': cancel, 'OK': doLoadHTTP }
|
||||
});
|
||||
|
||||
if (window.localStorage !== undefined) {
|
||||
$('.disksave').show();
|
||||
document.querySelectorAll('.disksave').forEach(function (el) { el.style.display = 'inline-block';});
|
||||
}
|
||||
|
||||
var oldcat = '';
|
||||
var option;
|
||||
for (var idx = 0; idx < window.disk_index.length; idx++) {
|
||||
var file = window.disk_index[idx];
|
||||
var cat = file.category;
|
||||
var name = file.name, disk = file.disk;
|
||||
if (cat != oldcat) {
|
||||
$('<option />').val(cat).text(cat).appendTo('#category_select');
|
||||
option = document.createElement('option');
|
||||
option.value = cat;
|
||||
option.innerText = cat;
|
||||
document.querySelector('#category_select').append(option);
|
||||
|
||||
disk_categories[cat] = [];
|
||||
oldcat = cat;
|
||||
}
|
||||
@ -1049,7 +954,9 @@ $(function() {
|
||||
disk_sets[name].push(file);
|
||||
}
|
||||
}
|
||||
$('<option/>').text('Local Saves').appendTo('#category_select');
|
||||
option = document.createElement('option');
|
||||
option.innerText = 'Local Saves';
|
||||
document.querySelector('#category_select').append(option);
|
||||
|
||||
updateLocalStorage();
|
||||
initGamepad();
|
||||
@ -1061,12 +968,8 @@ $(function() {
|
||||
processHash(hash);
|
||||
}
|
||||
|
||||
if (navigator.userAgent.match(/(iPod|iPhone|iPad)/)) {
|
||||
$('select').removeAttr('multiple').css('height', 'auto');
|
||||
}
|
||||
|
||||
if (navigator.standalone) {
|
||||
$('body').addClass('standalone');
|
||||
document.body.classList.add('standalone');
|
||||
}
|
||||
|
||||
run();
|
||||
|
||||
34
js/ui/drive_lights.js
Normal file
34
js/ui/drive_lights.js
Normal file
@ -0,0 +1,34 @@
|
||||
export default function DriveLights()
|
||||
{
|
||||
return {
|
||||
driveLight: function(drive, on) {
|
||||
var disk = document.querySelector('#disk' + drive);
|
||||
disk.style.backgroundImage =
|
||||
on ? 'url(css/red-on-16.png)' :
|
||||
'url(css/red-off-16.png)';
|
||||
},
|
||||
dirty: function() {
|
||||
// document.querySelector('#disksave' + drive).disabled = !dirty;
|
||||
},
|
||||
label: function(drive, label) {
|
||||
if (label) {
|
||||
document.querySelector('#disklabel' + drive).innerText = label;
|
||||
}
|
||||
return document.querySelector('#disklabel' + drive).innerText;
|
||||
},
|
||||
getState: function() {
|
||||
return {
|
||||
disks: [
|
||||
this.label(1),
|
||||
this.label(2)
|
||||
]
|
||||
};
|
||||
},
|
||||
setState: function(state) {
|
||||
if (state && state.disks) {
|
||||
this.label(1, state.disks[0].label);
|
||||
this.label(2, state.disks[1].label);
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
@ -106,7 +106,8 @@ export function initGamepad(data) {
|
||||
gamepadMap[idx] = undefined;
|
||||
}
|
||||
var map = data || DEFAULT_GAMEPAD;
|
||||
$.each(map, function(key, val) {
|
||||
Object.keys(map).forEach(function(key) {
|
||||
var val = map[key];
|
||||
if (typeof val == 'string') {
|
||||
val = val.charCodeAt(0);
|
||||
} else {
|
||||
|
||||
@ -213,7 +213,7 @@ export default function KeyBoard(cpu, io, e) {
|
||||
} else if (code in keymap) {
|
||||
key = keymap[code][evt.shiftKey ? 2 : (evt.ctrlKey ? 1 : 0)];
|
||||
if (capslocked && key >= 0x61 && key <= 0x7A)
|
||||
key -= '\x20';
|
||||
key -= 0x20;
|
||||
} else {
|
||||
debug('Unhandled key = ' + toHex(code));
|
||||
}
|
||||
|
||||
@ -9,12 +9,15 @@
|
||||
* implied warranty.
|
||||
*/
|
||||
|
||||
export default function Printer(paper) {
|
||||
var _lineBuffer;
|
||||
export default function Printer(el) {
|
||||
var paper = document.querySelector(el);
|
||||
var _lineBuffer = '';
|
||||
var _line;
|
||||
|
||||
function newLine() {
|
||||
_line = $('<div>').addClass('line').text(_lineBuffer);
|
||||
_line = document.createElement('div');
|
||||
_line.classList.add('line');
|
||||
_line.innerText = _lineBuffer;
|
||||
paper.append(_line);
|
||||
_lineBuffer = '';
|
||||
}
|
||||
@ -29,7 +32,8 @@ export default function Printer(paper) {
|
||||
|
||||
if (c == '\r') {
|
||||
newLine();
|
||||
_lineBuffer = '';
|
||||
} else if (c == '\n') {
|
||||
// eat for now
|
||||
} else if (c == '\t') {
|
||||
_lineBuffer += ' ';
|
||||
} else if (c == 0x04) {
|
||||
@ -39,7 +43,7 @@ export default function Printer(paper) {
|
||||
_lineBuffer += c;
|
||||
}
|
||||
}
|
||||
_line.text(_lineBuffer);
|
||||
_line.innerText = _lineBuffer;
|
||||
},
|
||||
|
||||
clear: function() {
|
||||
@ -49,7 +53,7 @@ export default function Printer(paper) {
|
||||
},
|
||||
|
||||
hasPrintout: function() {
|
||||
return paper.text().length();
|
||||
return paper.text.length;
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
@ -12,6 +12,8 @@
|
||||
|
||||
import { debug } from '../util';
|
||||
|
||||
export const TAPE_TYPES = ['wav','aiff','aif','mp3','m4a'];
|
||||
|
||||
export default function Tape(io) {
|
||||
var AudioContext = window.AudioContext || window.webkitAudioContext;
|
||||
|
||||
|
||||
5
package-lock.json
generated
5
package-lock.json
generated
@ -3515,6 +3515,11 @@
|
||||
"to-regex": "^3.0.2"
|
||||
}
|
||||
},
|
||||
"micromodal": {
|
||||
"version": "0.3.2",
|
||||
"resolved": "https://registry.npmjs.org/micromodal/-/micromodal-0.3.2.tgz",
|
||||
"integrity": "sha512-xRON1OqD9G8FfI1qShYTtJZaN77x03QR2UnkpL7H17877lATNJoV8XHR+nrnc2FqgXqjFdaYJYidbfISecMlNQ=="
|
||||
},
|
||||
"miller-rabin": {
|
||||
"version": "4.0.1",
|
||||
"resolved": "https://registry.npmjs.org/miller-rabin/-/miller-rabin-4.0.1.tgz",
|
||||
|
||||
@ -24,5 +24,8 @@
|
||||
"webpack": "^4.29.6",
|
||||
"webpack-cli": "^3.2.3",
|
||||
"webpack-dev-server": "^3.2.1"
|
||||
},
|
||||
"dependencies": {
|
||||
"micromodal": "^0.3.2"
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user