6502/8bitworkshop
1
0
Fork 0
mirror of https://github.com/sehugg/8bitworkshop.git synced 2024-06-03 04:29:33 +00:00
Code Issues Projects Releases Wiki Activity

added welcome splash dialog

Browse Source
This commit is contained in:
Steven Hugg 2017-04-19 20:55:13 -04:00
parent 1ca9d50801
commit 29117e7cb6
8 changed files with 69 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
images/arcadegames.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 149 KiB

BIN
images/atarivcs.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 65 KiB

62
index.html
View File

@ -184,23 +184,6 @@ canvas.pixelated {
image-rendering: pixelated; /* Awesome future-browsers */ image-rendering: pixelated; /* Awesome future-browsers */
-ms-interpolation-mode: nearest-neighbor; /* IE */ -ms-interpolation-mode: nearest-neighbor; /* IE */
} }
div.bitmap_editor {
position: fixed;
left: 2%;
width: 46%;
top: 10%;
bottom: 10%;
background-color: #333;
border-color: #fff;
border-style: ridge;
border-radius: 16px;
color: #66ff66;
white-space: pre;
padding: 20px;
z-index: 9;
font-family: "Andale Mono", "Menlo", "Lucida Console", monospace;
font-size: 12pt;
}
</style> </style>
</head> </head>
<body> <body>
@ -290,12 +273,38 @@ div.bitmap_editor {
Making Games For The Atari 2600</a> Making Games For The Atari 2600</a>
</div> </div>
<div class="bitmap_editor" style="display:none"> <div id="welcomeModal" class="modal fade">
PC: $<span id="bitmap_editor_pc">0000</span> <div class="modal-dialog modal-lg" role="document">
X: <span id="bitmap_editor_x">0</span> <div class="modal-content">
Y: <span id="bitmap_editor_y">0</span> <div class="modal-header">
Dest: $<span id="bitmap_editor_dest">0000/0</span> <h3 class="modal-title">Welcome to 8bitworkshop!</h3>
<canvas width="32" height="32" id="bitmap_editor_canvas"/> <button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<p>What would you like to start programming?</p>
<div class="container-fluid">
<div class="row">
<div class="col-md-6">
<img data-dismiss="modal" class="img-responsive" data-platform="vcs" src="images/atarivcs.jpg" alt="Atari 2600 four-switch wood veneer version, dating from 1980-1982 (photo by Evan Amos)"/>
</div>
<div class="col-md-6">
<img data-dismiss="modal" class="img-responsive" data-platform="vicdual" src="images/arcadegames.jpg" alt="Galaxian arcade system board (photo by Dennis van Zuijlekom, CC BY-SA 2.0)"/>
</div>
</div>
<div class="row">
<div class="col-md-3 col-md-offset-2">
<button type="button" class="btn btn-secondary" data-platform="vcs" data-dismiss="modal">Atari VCS</button>
</div>
<div class="col-md-3 col-md-offset-2">
<button type="button" class="btn btn-secondary" data-platform="vicdual" data-dismiss="modal">Arcade Games</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div> </div>
<script src="jquery/jquery-2.2.3.min.js"></script> <script src="jquery/jquery-2.2.3.min.js"></script>
@ -326,11 +335,11 @@ Dest: $<span id="bitmap_editor_dest">0000/0</span>
<script src="tss/js/tss/MasterChannel.js"></script> <script src="tss/js/tss/MasterChannel.js"></script>
<script src="tss/js/tss/AudioLooper.js"></script> <script src="tss/js/tss/AudioLooper.js"></script>
<script src="tss/js/Log.js"></script> <script src="tss/js/Log.js"></script>
<!--
<script src="local/williams/defender.js"></script> <script src="local/williams/defender.js"></script>
<script src="local/williams/robotron.js"></script> <script src="local/williams/robotron.js"></script>
<script src="local/atarivec/gravitar/gravitar.js"></script> <script src="local/atarivec/gravitar/gravitar.js"></script>
-->
<script src="FileSaver.js/FileSaver.min.js"></script> <script src="FileSaver.js/FileSaver.min.js"></script>
<script src="octokat.js/dist/octokat.js"></script> <script src="octokat.js/dist/octokat.js"></script>
@ -340,10 +349,9 @@ Dest: $<span id="bitmap_editor_dest">0000/0</span>
<script src="src/util.js"></script> <script src="src/util.js"></script>
<script src="src/disasm.js"></script> <script src="src/disasm.js"></script>
<script src="src/ui.js"></script> <script src="src/ui.js"></script>
<script src="src/audio/votrax.js"></script> <!-- <script src="src/audio/votrax.js"></script> -->
<script> <script>
showWelcomeMessage();
startUI(true); startUI(true);
</script> </script>

8
presets/vicdual/soundtest.c
View File

@ -30,12 +30,6 @@ __asm
; set up stack pointer, interrupt flag ; set up stack pointer, interrupt flag
LD SP,#0xE800 LD SP,#0xE800
DI DI
; copy initialized data
LD BC, #l__INITIALIZER
LD A, B
LD DE, #s__INITIALIZED
LD HL, #s__INITIALIZER
LDIR
__endasm; __endasm;
main(); main();
} }
@ -176,7 +170,7 @@ void ay8910test() {
} }
void main() { void main() {
palette = 2; palette = 0;
memcpy(tileram, font8x8, sizeof(font8x8)); memcpy(tileram, font8x8, sizeof(font8x8));
memset(cellram, CHAR(' '), sizeof(cellram)); memset(cellram, CHAR(' '), sizeof(cellram));
draw_box(0,0,27,31,BOX_CHARS); draw_box(0,0,27,31,BOX_CHARS);

3
src/emu.js
View File

@ -401,6 +401,7 @@ var Base6502Platform = function() {
if (fn.endsWith(".s")) return "ca65"; if (fn.endsWith(".s")) return "ca65";
return "dasm"; return "dasm";
} }
this.getDefaultExtension = function() { return ".a"; };
} }
function dumpRAM(ram, ramofs, ramlen) { function dumpRAM(ram, ramofs, ramlen) {
@ -588,6 +589,7 @@ var BaseZ80Platform = function() {
if (fn.endsWith(".s")) return "sdasz80"; if (fn.endsWith(".s")) return "sdasz80";
return "z80asm"; return "z80asm";
} }
this.getDefaultExtension = function() { return ".c"; };
// TODO // TODO
//this.getOpcodeMetadata = function() { } //this.getOpcodeMetadata = function() { }
} }
@ -646,6 +648,7 @@ var Base6809Platform = function() {
// TODO: don't create new CPU // TODO: don't create new CPU
return new CPU6809().disasm(read(pc), read(pc+1), read(pc+2), read(pc+3), read(pc+4), pc); return new CPU6809().disasm(read(pc), read(pc+1), read(pc+2), read(pc+3), read(pc+4), pc);
} }
this.getDefaultExtension = function() { return ".asm"; };
//this.getOpcodeMetadata = function() { } //this.getOpcodeMetadata = function() { }
} }

1
src/platform/vcs.js
View File

@ -123,6 +123,7 @@ var VCSPlatform = function() {
this.getToolForFilename = function(fn) { this.getToolForFilename = function(fn) {
return "dasm"; return "dasm";
} }
this.getDefaultExtension = function() { return ".a"; };
}; };
PLATFORMS['vcs'] = VCSPlatform; PLATFORMS['vcs'] = VCSPlatform;

2
src/platform/vicdual.js
View File

@ -64,7 +64,7 @@ var VicDualPlatform = function(mainElement) {
for (var xx=0; xx<32; xx++) { for (var xx=0; xx<32; xx++) {
var code = ram.mem[vramofs+xx]; var code = ram.mem[vramofs+xx];
var data = ram.mem[0x800 + (code<<3) + yy]; var data = ram.mem[0x800 + (code<<3) + yy];
var col = (code>>5) + (palbank<<4); var col = (code>>5) + (palbank<<3);
var color1 = palette[(colorprom[col] >> 1) & 7]; var color1 = palette[(colorprom[col] >> 1) & 7];
var color2 = palette[(colorprom[col] >> 5) & 7]; var color2 = palette[(colorprom[col] >> 5) & 7];
for (var i=0; i<8; i++) { for (var i=0; i<8; i++) {

36
src/ui.js
View File

@ -249,7 +249,7 @@ function _createNewFile(e) {
var filename = prompt("Create New File", "newfile.a"); var filename = prompt("Create New File", "newfile.a");
if (filename && filename.length) { if (filename && filename.length) {
if (filename.indexOf(".") < 0) { if (filename.indexOf(".") < 0) {
filename += ".a"; filename += platform.getDefaultExtension();
} }
qs['file'] = "local/" + filename; qs['file'] = "local/" + filename;
gotoNewLocation(); gotoNewLocation();
@ -1038,9 +1038,27 @@ function setupDebugControls(){
} }
function showWelcomeMessage() { function showWelcomeMessage() {
if (!localStorage.getItem("8bitworkshop.hello")) if (!localStorage.getItem("8bitworkshop.splash")) {
{ // OH BOOTSTRAP YOU ARE SO AWESOME A+++++
// https://stackoverflow.com/questions/28270333/how-do-i-know-which-button-is-click-when-bootstrap-modal-closes
// https://github.com/jschr/bootstrap-modal/issues/224
var whichPlatform;
$('#welcomeModal button').on('click', function(event) {
whichPlatform = $(event.target).data('platform');
});
$('#welcomeModal img').on('click', function(event) {
whichPlatform = $(event.target).data('platform');
});
$('#welcomeModal').on('hidden.bs.modal', function (event) {
localStorage.setItem('8bitworkshop.splash', true);
if (whichPlatform && whichPlatform != qs['platform']) {
window.location = "?platform=" + whichPlatform;
}
}).modal('show');
}
else if (!localStorage.getItem("8bitworkshop.hello")) {
// Instance the tour // Instance the tour
var is_vcs = platform_id == 'vcs';
var tour = new Tour({ var tour = new Tour({
autoscroll:false, autoscroll:false,
//storage:false, //storage:false,
@ -1048,13 +1066,14 @@ function showWelcomeMessage() {
{ {
element: "#editor", element: "#editor",
title: "Welcome to 8bitworkshop!", title: "Welcome to 8bitworkshop!",
content: "Type your 6502 code on the left side, and it'll be assembled in real-time. All changes are saved to browser local storage.", content: is_vcs ? "Type your 6502 assembly code into the editor, and it'll be assembled in real-time. All changes are saved to browser local storage."
: "Type your C source code into the editor, and it'll be compiled in real-time. All changes are saved to browser local storage."
}, },
{ {
element: "#emulator", element: "#emulator",
placement: 'left', placement: 'left',
title: "Atari VCS Emulator", title: "Emulator",
content: "This is an emulator for the Atari VCS/2600. We'll load your assembled code into the emulator whenever you make changes.", content: "This is an emulator for the \"" + platform_id + "\" platform. We'll load your compiled code into the emulator whenever you make changes."
}, },
{ {
element: "#preset_select", element: "#preset_select",
@ -1065,12 +1084,12 @@ function showWelcomeMessage() {
element: "#debug_bar", element: "#debug_bar",
placement: 'bottom', placement: 'bottom',
title: "Debug Tools", title: "Debug Tools",
content: "Use these buttons to set breakpoints, single step through code, pause/resume, and perform timing analysis." content: "Use these buttons to set breakpoints, single step through code, pause/resume, and use debugging tools."
}, },
{ {
element: "#dropdownMenuButton", element: "#dropdownMenuButton",
title: "Main Menu", title: "Main Menu",
content: "Click the menu to create new files and share your work with others." content: "Click the menu to switch between platforms, create new files, or share your work with others."
}, },
]}); ]});
tour.init(); tour.init();
@ -1109,6 +1128,7 @@ function startPlatform() {
platform = new PLATFORMS[platform_id]($("#emulator")[0]); platform = new PLATFORMS[platform_id]($("#emulator")[0]);
PRESETS = platform.getPresets(); PRESETS = platform.getPresets();
if (qs['file']) { if (qs['file']) {
showWelcomeMessage();
// start platform and load file // start platform and load file
preloadWorker(qs['file']); preloadWorker(qs['file']);
setupDebugControls(); setupDebugControls();