neon443/neon443.github.io
1
0
Fork 0
mirror of https://github.com/neon443/neon443.github.io.git synced 2026-03-11 07:09:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

added emulator: n64

Browse Source 
updated hs to align from left
This commit is contained in:
neon443
2024-10-06 19:54:51 +01:00
parent 8c639a271c
commit 66e1a617c4
16 changed files with 3327 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
games/emulators/N64/assets/overlay.png Executable file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 199 B

BIN
games/emulators/N64/assets/res/arial.ttf Executable file
View File

Binary file not shown.

BIN
games/emulators/N64/assets/res/font.ttf Executable file
View File

Binary file not shown.

21
games/emulators/N64/assets/shader_frag.hlsl Executable file
View File

@@ -0,0 +1,21 @@
#version 300 es
precision highp float;
//the texture coordinate that came
//in from the vertex shader
in vec2 v_TexCoord;
//primary purpose of fragment shader is
//to spit out a color for every pixel
layout(location = 0) out vec4 color;
// uniform vec4 u_Color;
uniform sampler2D u_Texture;
//fragment shader gets called once per pixel
void main()
{
vec4 texColor = texture(u_Texture, v_TexCoord);
color = texColor;
}

20
games/emulators/N64/assets/shader_vert.hlsl Executable file
View File

@@ -0,0 +1,20 @@
#version 300 es
precision highp float;
//position and texture coordinates
//come in from the application as inputs
layout(location = 0) in vec4 position;
layout(location = 1) in vec2 texCoord;
//texture coordinate is just passthrough
//to the fragment shader
out vec2 v_TexCoord;
//vertex shader gets called once per vertex
void main()
{
//gl_Position is a built in property
gl_Position = position;
v_TexCoord = texCoord;
}

BIN
games/emulators/N64/github_logo.png Executable file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

995
games/emulators/N64/index.html Executable file
View File

@@ -0,0 +1,995 @@
<!DOCTYPE html>
<html>
<head>
<title>N64 Wasm</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="keywords" content="N64 Emulator, N64 JavaScript Emulator, WebAssembly, HTML5, Nintendo 64">
<meta charset="UTF-8">
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/rivets/0.9.6/rivets.bundled.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.min.css">
<script src="https://cdn.jsdelivr.net/npm/file-saver@2.0.2/dist/FileSaver.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/nipplejs/0.10.0/nipplejs.min.js"></script>
<style>
input[type="file"] {
display: none;
}
.table td,
.table th {
padding: 5px;
}
.regularTable td,
.regularTable th {
padding: 0;
vertical-align: top;
border-top: 0px;
}
.lightpurple {
background-color: rgb(189, 174, 173);
}
.darkpurple {
background-color: rgb(238, 21, 21);
background-color: rgb(199, 199, 230);
}
.buttonhold {
background-color: lightsalmon;
}
.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
color: #007bff;
}
</style>
</head>
<body>
<div id="maindiv" class="container text-center">
<h1>
N64 Wasm
</h1>
<div id="topPanel" style="display: none;">
<!-- BEFORE LOAD -->
<div rv-if="data.beforeEmulatorStarted">
<button id="btnPlayGame" class="btn btn-primary mt-4" onclick="myClass.loadRom();" rv-if="data.hasRoms"
rv-disabled="data.moduleInitializing">Play Game</button>
<button id="btnUploadRom" class="btn btn-primary mt-4" onclick="myApp.uploadBrowse()"
rv-disabled="data.moduleInitializing">Browse</button>
<button type="button" class="btn btn-primary mt-4" id="btnRemap" onclick="myApp.showRemapModal()">
Remap Buttons
</button>
<span rv-if="data.showLogin">
<button class="btn btn-primary mt-4" rv-if="data.loggedIn | ev '==false'"
onclick="myApp.loginModal()">Login</button>
<button class="btn btn-primary mt-4" rv-if="data.loggedIn | ev '==true'"
onclick="myApp.logout()">Logout</button>
</span>
<div class="form-check" style="margin-top: 13px;" rv-if="data.settings.SHOWADVANCED">
<label class="form-check-label" style="margin-right: 10px;">
<input type="checkbox" class="form-check-input" rv-checked="data.chkAdvanced" rv-disabled="data.moduleInitializing">
Advanced
</label>
</div>
<div class="card" style="width: 18rem;margin-left: auto;margin-right: auto;margin-top: 20px;margin-bottom: 31px;"
rv-if="data.chkAdvanced">
<div class="card-body">
<h5 class="card-title">Advanced</h5>
<h6 class="card-subtitle mb-2 text-muted">Options</h6>
<button id="btnUploadEep" class="btn btn-secondary mt-4" onclick="myApp.uploadEepBrowse()">
Import Save File (EEP)</button>
<div rv-if="data.eepName | ev_string '.length > 0'">
{ data.eepName }
</div>
<button id="btnUploadSra" class="btn btn-secondary mt-4" onclick="myApp.uploadSraBrowse()">
Import Save File (SRA)</button>
<div rv-if="data.sraName | ev_string '.length > 0'">
{ data.sraName }
</div>
<button id="btnUploadFla" class="btn btn-secondary mt-4" onclick="myApp.uploadFlaBrowse()">
Import Save File (FLA)</button>
<div rv-if="data.flaName | ev_string '.length > 0'">
{ data.flaName }
</div>
<!-- <a href="#" class="card-link">Card link</a>
<a href="#" class="card-link">Another link</a> -->
</div>
</div>
<input id="file-upload-eep" type="file" />
<input id="file-upload-sra" type="file" />
<input id="file-upload-fla" type="file" />
<input id="file-upload" type="file" />
<!-- ROM LIST -->
<div class="form-group mt-2 mb-4" rv-if="data.hasRoms" style="width: 300px;margin-left: auto; margin-right:auto;">
<select class="form-control" id="romselect">
<option rv-each-rom="data.romList" rv-value="rom.url">{rom.title}</option>
</select>
</div>
<!-- SAVE STATES -->
<div id="dbSaveStates" rv-if="data.loggedIn | ev '==true'">
<button id="btnLoadRomAndSaveState" class="btn btn-primary mt-2 mb-2" onclick="myApp.loadRomAndSavestate()"
rv-disabled="data.moduleInitializing">Load Savestate</button>
<div class="form-group mt-2 mb-4" style="width: 300px;margin-left: auto; margin-right:auto;">
<select class="form-control" id="savestateSelect">
<option rv-each-item="data.n64SaveStates" rv-value="item.Name">{item.Name}</option>
</select>
</div>
</div>
</div>
<!-- AFTER LOAD -->
<div rv-hide="data.beforeEmulatorStarted">
<button class="btn btn-primary mt-2 mb-2"
onclick="myApp.newRom()" >New Rom</button>
<div class="btn-group mt-2 mb-2" rv-if="data.settings.SHOWADVANCED">
<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Advanced
</button>
<div class="dropdown-menu">
<a class="dropdown-item" onclick="myApp.exportEep()" style="cursor: pointer;">Export Save (EEP)</a>
<a class="dropdown-item" onclick="myApp.exportSra()" style="cursor: pointer;">Export Save (SRA)</a>
<a class="dropdown-item" onclick="myApp.exportFla()" style="cursor: pointer;">Export Save (FLA)</a>
</div>
</div>
<div class="btn-group mt-2 mb-2" rv-if="data.settings.SHOWOPTIONS">
<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Options
</button>
<div class="dropdown-menu">
<a class="dropdown-item" onclick="myApp.reset()" style="cursor: pointer;">Reset</a>
</div>
</div>
<span rv-if="data.showDoubleSpeed">
<button class="btn btn-success mt-2 mb-2" rv-if="data.doubleSpeed | ev '==true'"
onclick="myApp.toggleDoubleSpeed()">2x Speed</button>
<button class="btn btn-primary mt-2 mb-2" rv-if="data.doubleSpeed | ev '==false'"
onclick="myApp.toggleDoubleSpeed()">2x Speed</button>
</span>
<button rv-if="data.loggedIn | ev '==true'" class="btn btn-primary mt-2 mb-2"
onclick="myApp.saveCloud()" >Save Cloud</button>
<button rv-if="data.loggedIn | ev '==true'" class="btn btn-primary mt-2 mb-2"
onclick="myApp.loadCloud()" rv-disabled="data.noCloudSave">Load Cloud</button>
<button rv-if="data.loggedIn | ev '==false'" class="btn btn-primary mt-2 mb-2"
onclick="myApp.saveStateLocal()" >Save State</button>
<button rv-if="data.loggedIn | ev '==false'" class="btn btn-primary mt-2 mb-2"
onclick="myApp.loadStateLocal()" rv-disabled="data.noLocalSave" >Load State</button>
<button class="btn btn-primary mt-2 mb-2" onclick="myApp.zoomOut()">Zoom Out</button>
<button class="btn btn-primary mt-2 mb-2" onclick="myApp.zoomIn()">Zoom In</button>
<button class="btn btn-primary mt-2 mb-2" onclick="myApp.fullscreen()" >Full Screen</button>
</div>
<div rv-if="data.iosShowWarning" class="mt-4">
<div class="alert alert-info" role="alert">
<b>NOTE: </b>On iOS 16 and above in order to improve the framerate you should disable the following: Settings -> Safari ->
Advanced -> Experimental Features -> GPU Process: WebGL. Then restart safari and it should take effect.
</div>
</div>
<div style="margin-top:40px;" rv-if="data.beforeEmulatorStarted">
<div id="dropArea" style="width: 150px; height: 150px; border: gray 1px solid;margin-left: auto;
color: darkgrey;margin-right: auto; border-style: dashed;">
<br>
<br>
Drag/Drop
<br>
Rom File
</div>
</div>
</div>
<div id="lblErrorOuter" style="display: none;">
<div rv-if="data.lblError | ev_string '.length > 0'"
class="alert alert-danger mt-4" id="lblError" role="alert"
rv-html="data.lblError">
</div>
</div>
<div id="mydiv" class="mt-4"></div>
</div>
<div id="middleDiv" class="text-center">
<!-- ID has to be canvas it's hardcoded in the EM generated .js -->
<div id="canvasDiv" style="display: none;">
<canvas id="canvas" style="width: 640px;"></canvas>
</div>
<div id="bottomPanel" rv-hide="data.beforeEmulatorStarted">
<!-- <div>{ data.audioSkipCount}</div> -->
</div>
<h6 class="card-title mt-4">
<a href="https://github.com/nbarkhina/n64wasm" target="_blank" style="color: black;">
View source on GitHub
<img src="github_logo.png" style="height: 25px; padding-bottom: 5px; padding-left: 10px;">
</a>
</h6>
</div>
<!-- Mobile UX -->
<div id="mobileButtons" style="display: none;text-align: center;background: white;
padding-top: 20px;padding-bottom: 20px;">
<div style="margin-bottom: 10px;">
<button class="btn btn-primary mt-2 mb-2" onclick="myApp.newRom()" >New Rom</button>
<button rv-if="data.loggedIn | ev '==true'" class="btn btn-primary mt-2 mb-2" onclick="myApp.saveCloud()" >Save Cloud</button>
<button rv-if="data.loggedIn | ev '==true'" class="btn btn-primary mt-2 mb-2" onclick="myApp.loadCloud()" rv-disabled="data.noCloudSave">Load Cloud</button>
<button rv-if="data.loggedIn | ev '==false'" class="btn btn-primary mt-2 mb-2" onclick="myApp.saveStateLocal()" >Save State</button>
<button rv-if="data.loggedIn | ev '==false'" class="btn btn-primary mt-2 mb-2" onclick="myApp.loadStateLocal()" rv-disabled="data.noLocalSave" >Load State</button>
</div>
<span rv-if="data.showDoubleSpeed">
<button class="btn btn-success mt-2 mb-2" rv-if="data.doubleSpeed | ev '==true'"
onclick="myApp.toggleDoubleSpeed()">2x Speed</button>
<button class="btn btn-primary mt-2 mb-2" rv-if="data.doubleSpeed | ev '==false'"
onclick="myApp.toggleDoubleSpeed()">2x Speed</button>
</span>
<button type="button" class="btn btn-primary" onclick="myApp.hideMobileMenu()">
Hide
</button>
</div>
<div id="mobileDiv" style="display: none;height: 100%;">
<div id="mobileCanvas">
</div>
<div id="mobileBottomPanel" style="font-size: 36px;height:100%;text-align: center!important;background: white;">
<table style="width: 100%;" cellpadding=0 cellspacing=0>
<tr>
<td style="border-right: 1px solid rgb(72,72,72);width:50%;">
<div id="mobileStart" class="lightpurple" rv-class-buttonhold="data.inputController.MobileStart">
Start
</div>
</td>
<td>
<div id="mobileSelect" class="lightpurple" rv-class-buttonhold="data.inputController.MobileSelect">
<span rv-if="data.useZasCMobile | ev '==false'">Z</span>
<span rv-if="data.useZasCMobile | ev '==true'">C (Hold)</span>
</div>
</td>
</tr>
<tr>
<td style="border-right: 1px solid rgb(72,72,72);">
<div id="mobileB" class="darkpurple" rv-class-buttonhold="data.inputController.MobileB">
B
</div>
</td>
<td>
<div id="mobileA" class="darkpurple" rv-class-buttonhold="data.inputController.MobileA">
A
</div>
</td>
</tr>
</table>
<!-- <div style="color: lightgray;height:100%;" id="divTouchSurface">
<div style="padding-top: 20px;height: 800px;" id="startDiv">
<< Swipe to Move>>
</div>
</div> -->
<div style="margin-left: auto;margin-right: auto;width: 100%;height: 800px;">
<div id="divTouchSurface" style="color: lightgray;position: absolute;width: 100%;height: 800px;">
<div style="padding-top: 20px;" id="startDiv" style="-webkit-touch-callout: none; /* iOS Safari */
-webkit-user-select: none; /* Safari */
-khtml-user-select: none; /* Konqueror HTML */
-moz-user-select: none; /* Old versions of Firefox */
-ms-user-select: none; /* Internet Explorer/Edge */
user-select: none; /* Non-prefixed version, currently
supported by Chrome, Edge, Opera and Firefox */">
Virtual Joystick
</div>
</div>
</div>
<div id="menuDiv"
style="opacity: 0.5; background-color: rgba(243,244,244,1);width: 70px;position: absolute; top:0px;left:170px;font-size: 14px;">
-MENU-
</div>
</div>
</div>
<!-- Login Modal -->
<div class="modal fade" id="loginModal" tabindex="-1" role="dialog" aria-labelledby="loginModalLabel"
aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="loginModalLabel">Login</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<div class="form-group">
<label>Password</label>
<input type="password" class="form-control" id="txtPassword" autocomplete="off"
rv-value="data.password" onkeydown="" placeholder="Enter Password">
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" onclick="myApp.loginSubmit()">Submit</button>
</div>
</div>
</div>
</div>
<!-- Keymapping Modal -->
<div class="modal fade" id="buttonsModal" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Remap Buttons</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body" id="modalMain" style="padding-bottom: 0;">
<ul class="nav nav-tabs" rv-hide="data.remapWait">
<li class="nav-item">
<a class="nav-link" rv-class-active="data.remapPlayer1" style="cursor: pointer;"
onclick="myApp.swapRemap('player1')">Player 1</a>
</li>
<li class="nav-item">
<a class="nav-link" rv-class-active="data.remapOptions" style="cursor: pointer;"
onclick="myApp.swapRemap('options')">Options</a>
</li>
<li class="nav-item">
<a class="nav-link" rv-class-active="data.remapGameshark" style="cursor: pointer;"
onclick="myApp.swapRemap('gameshark')">GameShark</a>
</li>
</ul>
<div rv-if="data.remapPlayer1">
<table class="table" rv-hide="data.remapWait">
<thead>
<tr>
<th scope="col">Button</th>
<th scope="col">Keyboard</th>
<th scope="col">Joypad</th>
<th scope="col">Remap</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">D-Up</th>
<td>
<input rv-value="data.remappings.Mapping_Up" type="text" class="form-control"
disabled>
</td>
<td>
<input rv-value="data.remappings.Joy_Mapping_Up" type="text" class="form-control"
disabled>
</td>
<td>
<table class="regularTable">
<tr>
<td>
<button type="button" onclick="myApp.btnRemapKey(1)"
class="btn btn-primary">Key</button>
</td>
<td>
<button type="button" onclick="myApp.btnRemapJoy(1)"
class="btn btn-primary ml-2">Joypad</button>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<th scope="row">D-Down</th>
<td>
<input rv-value="data.remappings.Mapping_Down" type="text" class="form-control"
disabled>
</td>
<td>
<input rv-value="data.remappings.Joy_Mapping_Down" type="text" class="form-control"
disabled>
</td>
<td>
<table class="regularTable">
<tr>
<td>
<button type="button" onclick="myApp.btnRemapKey(2)"
class="btn btn-primary">Key</button>
</td>
<td>
<button type="button" onclick="myApp.btnRemapJoy(2)"
class="btn btn-primary ml-2">Joypad</button>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<th scope="row">D-Left</th>
<td>
<input rv-value="data.remappings.Mapping_Left" type="text" class="form-control"
disabled>
</td>
<td>
<input rv-value="data.remappings.Joy_Mapping_Left" type="text" class="form-control"
disabled>
</td>
<td>
<table class="regularTable">
<tr>
<td>
<button type="button" onclick="myApp.btnRemapKey(3)"
class="btn btn-primary">Key</button>
</td>
<td>
<button type="button" onclick="myApp.btnRemapJoy(3)"
class="btn btn-primary ml-2">Joypad</button>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<th scope="row">D-Right</th>
<td>
<input rv-value="data.remappings.Mapping_Right" type="text" class="form-control"
disabled>
</td>
<td>
<input rv-value="data.remappings.Joy_Mapping_Right" type="text" class="form-control"
disabled>
</td>
<td>
<table class="regularTable">
<tr>
<td>
<button type="button" onclick="myApp.btnRemapKey(4)"
class="btn btn-primary">Key</button>
</td>
<td>
<button type="button" onclick="myApp.btnRemapJoy(4)"
class="btn btn-primary ml-2">Joypad</button>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<th scope="row">A</th>
<td>
<input rv-value="data.remappings.Mapping_Action_A" type="text" class="form-control"
disabled>
</td>
<td>
<input rv-value="data.remappings.Joy_Mapping_Action_A" type="text"
class="form-control" disabled>
</td>
<td>
<table class="regularTable">
<tr>
<td>
<button type="button" onclick="myApp.btnRemapKey(5)"
class="btn btn-primary">Key</button>
</td>
<td>
<button type="button" onclick="myApp.btnRemapJoy(5)"
class="btn btn-primary ml-2">Joypad</button>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<th scope="row">B</th>
<td>
<input rv-value="data.remappings.Mapping_Action_B" type="text" class="form-control"
disabled>
</td>
<td>
<input rv-value="data.remappings.Joy_Mapping_Action_B" type="text"
class="form-control" disabled>
</td>
<td>
<table class="regularTable">
<tr>
<td>
<button type="button" onclick="myApp.btnRemapKey(6)"
class="btn btn-primary">Key</button>
</td>
<td>
<button type="button" onclick="myApp.btnRemapJoy(6)"
class="btn btn-primary ml-2">Joypad</button>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<th scope="row">Start</th>
<td>
<input rv-value="data.remappings.Mapping_Action_Start" type="text"
class="form-control" disabled>
</td>
<td>
<input rv-value="data.remappings.Joy_Mapping_Action_Start" type="text"
class="form-control" disabled>
</td>
<td>
<table class="regularTable">
<tr>
<td>
<button type="button" onclick="myApp.btnRemapKey(8)"
class="btn btn-primary">Key</button>
</td>
<td>
<button type="button" onclick="myApp.btnRemapJoy(8)"
class="btn btn-primary ml-2">Joypad</button>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<th scope="row">Z</th>
<td>
<input rv-value="data.remappings.Mapping_Action_Z" type="text"
class="form-control" disabled>
</td>
<td>
<input rv-value="data.remappings.Joy_Mapping_Action_Z" type="text"
class="form-control" disabled>
</td>
<td>
<table class="regularTable">
<tr>
<td>
<button type="button" onclick="myApp.btnRemapKey(10)"
class="btn btn-primary">Key</button>
</td>
<td>
<button type="button" onclick="myApp.btnRemapJoy(10)"
class="btn btn-primary ml-2">Joypad</button>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<th scope="row">L</th>
<td>
<input rv-value="data.remappings.Mapping_Action_L" type="text"
class="form-control" disabled>
</td>
<td>
<input rv-value="data.remappings.Joy_Mapping_Action_L" type="text"
class="form-control" disabled>
</td>
<td>
<table class="regularTable">
<tr>
<td>
<button type="button" onclick="myApp.btnRemapKey(11)"
class="btn btn-primary">Key</button>
</td>
<td>
<button type="button" onclick="myApp.btnRemapJoy(11)"
class="btn btn-primary ml-2">Joypad</button>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<th scope="row">R</th>
<td>
<input rv-value="data.remappings.Mapping_Action_R" type="text"
class="form-control" disabled>
</td>
<td>
<input rv-value="data.remappings.Joy_Mapping_Action_R" type="text"
class="form-control" disabled>
</td>
<td>
<table class="regularTable">
<tr>
<td>
<button type="button" onclick="myApp.btnRemapKey(12)"
class="btn btn-primary">Key</button>
</td>
<td>
<button type="button" onclick="myApp.btnRemapJoy(12)"
class="btn btn-primary ml-2">Joypad</button>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<th scope="row">Menu</th>
<td>
<input rv-value="data.remappings.Mapping_Menu" type="text"
class="form-control" disabled>
</td>
<td>
<input rv-value="data.remappings.Joy_Mapping_Menu" type="text"
class="form-control" disabled>
</td>
<td>
<table class="regularTable">
<tr>
<td>
<button type="button" onclick="myApp.btnRemapKey(9)"
class="btn btn-primary">Key</button>
</td>
<td>
<button type="button" onclick="myApp.btnRemapJoy(9)"
class="btn btn-primary ml-2">Joypad</button>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<th scope="row">CUP</th>
<td>
<input rv-value="data.remappings.Mapping_Action_CUP" type="text"
class="form-control" disabled>
</td>
<td>
</td>
<td>
<table class="regularTable">
<tr>
<td>
<button type="button" onclick="myApp.btnRemapKey(13)"
class="btn btn-primary">Key</button>
</td>
<td>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<th scope="row">CDOWN</th>
<td>
<input rv-value="data.remappings.Mapping_Action_CDOWN" type="text"
class="form-control" disabled>
</td>
<td>
</td>
<td>
<table class="regularTable">
<tr>
<td>
<button type="button" onclick="myApp.btnRemapKey(14)"
class="btn btn-primary">Key</button>
</td>
<td>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<th scope="row">CLEFT</th>
<td>
<input rv-value="data.remappings.Mapping_Action_CLEFT" type="text"
class="form-control" disabled>
</td>
<td>
</td>
<td>
<table class="regularTable">
<tr>
<td>
<button type="button" onclick="myApp.btnRemapKey(15)"
class="btn btn-primary">Key</button>
</td>
<td>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<th scope="row">CRIGHT</th>
<td>
<input rv-value="data.remappings.Mapping_Action_CRIGHT" type="text"
class="form-control" disabled>
</td>
<td>
</td>
<td>
<table class="regularTable">
<tr>
<td>
<button type="button" onclick="myApp.btnRemapKey(16)"
class="btn btn-primary">Key</button>
</td>
<td>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<th scope="row">UP</th>
<td>
<input rv-value="data.remappings.Mapping_Action_Analog_Up" type="text"
class="form-control" disabled>
</td>
<td>
</td>
<td>
<table class="regularTable">
<tr>
<td>
<button type="button" onclick="myApp.btnRemapKey(17)"
class="btn btn-primary">Key</button>
</td>
<td>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<th scope="row">DOWN</th>
<td>
<input rv-value="data.remappings.Mapping_Action_Analog_Down" type="text"
class="form-control" disabled>
</td>
<td>
</td>
<td>
<table class="regularTable">
<tr>
<td>
<button type="button" onclick="myApp.btnRemapKey(18)"
class="btn btn-primary">Key</button>
</td>
<td>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<th scope="row">LEFT</th>
<td>
<input rv-value="data.remappings.Mapping_Action_Analog_Left" type="text"
class="form-control" disabled>
</td>
<td>
</td>
<td>
<table class="regularTable">
<tr>
<td>
<button type="button" onclick="myApp.btnRemapKey(19)"
class="btn btn-primary">Key</button>
</td>
<td>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<th scope="row">RIGHT</th>
<td>
<input rv-value="data.remappings.Mapping_Action_Analog_Right" type="text"
class="form-control" disabled>
</td>
<td>
</td>
<td>
<table class="regularTable">
<tr>
<td>
<button type="button" onclick="myApp.btnRemapKey(20)"
class="btn btn-primary">Key</button>
</td>
<td>
</td>
</tr>
</table>
</td>
</tr>
</tbody>
</table>
<div rv-if="data.remapWait">
<div class="mt-4 mb-4 text-center">
Please press a { data.remapMode }
<br>
<br>
{ data.inputController.Key_Last }
<br>
</div>
</div>
</div>
<div rv-if="data.remapOptions">
<div class="mt-4 mb-4">
<div>
<label class="form-check-label" style="margin-left: 26px;">
<input type="checkbox" class="form-check-input" rv-checked="data.disableAudioSyncTemp">
Vertical Sync (improves refresh rate)
</label>
</div>
<div class="mt-2">
<label class="form-check-label" style="margin-left: 26px;">
<input type="checkbox" class="form-check-input" rv-checked="data.forceAngryTemp">
Software Renderer (very slow but highly accurate)
</label>
</div>
<div class="mt-2">
<label class="form-check-label" style="margin-left: 26px;">
<input type="checkbox" class="form-check-input" rv-checked="data.showFPSTemp">
Show FPS
</label>
</div>
<div class="mt-2">
<label class="form-check-label" style="margin-left: 26px;">
<input type="checkbox" class="form-check-input" rv-checked="data.swapSticksTemp">
Swap Left and Right Sticks (good for goldeneye)
</label>
</div>
<div class="mt-2">
<label class="form-check-label" style="margin-left: 26px;">
<input type="checkbox" class="form-check-input" rv-checked="data.mouseModeTemp">
Mouse Controls (good for starcraft)
</label>
</div>
<div class="mt-2">
<label class="form-check-label" style="margin-left: 26px;">
<input type="checkbox" class="form-check-input" rv-checked="data.invert2PTemp">
Player 2 Invert Y-Axis
</label>
</div>
<div class="mt-2">
<label class="form-check-label" style="margin-left: 26px;">
<input type="checkbox" class="form-check-input" rv-checked="data.invert3PTemp">
Player 3 Invert Y-Axis
</label>
</div>
<div class="mt-2">
<label class="form-check-label" style="margin-left: 26px;">
<input type="checkbox" class="form-check-input" rv-checked="data.invert4PTemp">
Player 4 Invert Y-Axis
</label>
</div>
<div class="mt-2">
<table>
<tr>
<td>Mobile</td>
<td>
<div>
<select class="form-control" rv-value="data.settingMobileTemp" id="ddlMobile" style="margin-left: 16px;">
<option value="Auto">Auto Detect</option>
<option value="ForceMobile">Force Mobile</option>
<option value="ForceDesktop">Force Desktop</option>
</select>
</div>
</td>
</tr>
</table>
</div>
</div>
</div>
<div rv-if="data.remapGameshark">
<div class="mt-4 mb-4">
<table class="table" rv-hide="data.remapWait">
<thead>
<tr>
<th scope="col">Active</th>
<th scope="col">Name</th>
<th scope="col">Address</th>
<th scope="col">Value</th>
<th scope="col"></th>
</tr>
</thead>
<tbody>
<tr rv-each-cheat="data.cheats">
<th scope="row">
<label class="form-check-label" style="margin-left: 26px; margin-top: 5px;">
<input type="checkbox" class="form-check-input" rv-checked="cheat.active">
Active
</label>
</th>
<td>
<input rv-value="cheat.name" type="text" class="form-control" disabled>
</td>
<td>
<input rv-value="cheat.address" type="text" class="form-control" disabled>
</td>
<td>
<input rv-value="cheat.value" type="text" class="form-control" disabled>
</td>
<td style="text-align: center;">
<button type="button" class="btn btn-danger" rv-name="cheat.name" onclick="myApp.deleteCheat(this)">Delete</button>
</td>
</tr>
<tr>
<th scope="row">
</th>
<td>
<input rv-value="data.cheatName" type="text" class="form-control">
</td>
<td>
<input rv-value="data.cheatAddress" type="text" class="form-control">
</td>
<td>
<input rv-value="data.cheatValue" type="text" class="form-control">
</td>
<td style="text-align: center;">
<button type="button" class="btn btn-success" onclick="myApp.addCheat()">Add</button>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="modal-footer" style="padding-top: 0;" rv-hide="data.remapWait">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" onclick="myApp.restoreDefaultKeymappings()" class="btn btn-primary">Restore Defaults</button>
<button type="button" class="btn btn-primary" onclick="myApp.saveRemap()">Save changes</button>
</div>
</div>
</div>
</div>
<script src="settings.js"></script>
<script src="romlist.js"></script>
<script type="text/javascript">
var rando = Math.floor(Math.random() * Math.floor(100000));
var script = document.createElement('script');
script.src = 'script.js?v=' + rando;
document.getElementsByTagName('head')[0].appendChild(script);
</script>
</body>
</html>

641
games/emulators/N64/input_controller.js Executable file
View File

@@ -0,0 +1,641 @@
class GamePadState {
constructor(buttonNum, keyName) {
this.buttonDown = false;
this.buttonNum = -1;
this.buttonTimer = 0;
this.keyName = '';
this.buttonNum = buttonNum;
this.keyName = keyName;
}
}
class KeyMappings {
constructor() {
this.Mapping_Left = null;
this.Mapping_Right = null;
this.Mapping_Up = null;
this.Mapping_Down = null;
this.Mapping_Action_Start = null;
this.Mapping_Action_CUP = null;
this.Mapping_Action_CDOWN = null;
this.Mapping_Action_CLEFT = null;
this.Mapping_Action_CRIGHT = null;
this.Mapping_Action_Analog_Up = null;
this.Mapping_Action_Analog_Down = null;
this.Mapping_Action_Analog_Left = null;
this.Mapping_Action_Analog_Right = null;
this.Mapping_Action_Z = null;
this.Mapping_Action_L = null;
this.Mapping_Action_R = null;
this.Mapping_Action_B = null;
this.Mapping_Action_A = null;
this.Mapping_Menu = null;
this.Joy_Mapping_Left = null;
this.Joy_Mapping_Right = null;
this.Joy_Mapping_Up = null;
this.Joy_Mapping_Down = null;
this.Joy_Mapping_Action_Start = null;
this.Joy_Mapping_Action_Z = null;
this.Joy_Mapping_Action_L = null;
this.Joy_Mapping_Action_R = null;
this.Joy_Mapping_Action_B = null;
this.Joy_Mapping_Action_A = null;
this.Joy_Mapping_Menu = null;
this.Joy_Mapping_Action_CLEFT = null;
this.Joy_Mapping_Action_CRIGHT = null;
this.Joy_Mapping_Action_CUP = null;
this.Joy_Mapping_Action_CDOWN = null;
}
}
class InputController {
constructor() {
this.gamepadButtons = [];
this.DebugKeycodes = false;
//for remapping
this.Key_Last = '';
this.Joy_Last = null;
this.Remap_Check = false;
//controller 1
this.Key_Up = false;
this.Key_Down = false;
this.Key_Left = false;
this.Key_Right = false;
this.Key_Action_Start = false;
this.Key_Action_CUP = false;
this.Key_Action_CDOWN = false;
this.Key_Action_CLEFT = false;
this.Key_Action_CRIGHT = false;
this.Key_Action_Z = false;
this.Key_Action_L = false;
this.Key_Action_R = false;
this.Key_Action_B = false;
this.Key_Action_A = false;
this.Key_Menu = false;
this.VectorX = 0;
this.VectorY = 0;
//touch
this.touchX_Start = 0;
this.touchY_Start = 0;
this.touch_tap_counter = 0;
this.nippleDirection = 'none';
this.KeyMappings = this.defaultKeymappings();
document.onkeydown = this.keyDown.bind(this);
document.onkeyup = this.keyUp.bind(this);
this.setGamePadButtons();
}
setupMobileControls(touch_element_id)
{
if (touch_element_id)
{
// document.getElementById(touch_element_id).addEventListener( 'touchstart', this.touchStart.bind(this), false );
// document.getElementById(touch_element_id).addEventListener( 'touchend', this.touchEnd.bind(this), false );
// document.getElementById(touch_element_id).addEventListener( 'touchmove', this.touchMove.bind(this), false );
this.manager = nipplejs.create({
zone: document.getElementById(touch_element_id),
color: 'darkgray',
mode: "dynamic",
});
this.manager.on("move", (evt, data) => {
window["myApp"].rivetsData.hadNipple = true;
if (window["myApp"].rivetsData.useZasCMobile && this.Key_Action_Z) {
this.VectorX = 0
this.VectorY = 0;
if (data.force > 1) {
if (data.direction)
this.nippleDirection = data.direction.angle;
if (this.nippleDirection == 'left') this.Key_Action_CLEFT = true;
if (this.nippleDirection == 'right') this.Key_Action_CRIGHT = true;
if (this.nippleDirection == 'up') this.Key_Action_CUP = true;
if (this.nippleDirection == 'down') this.Key_Action_CDOWN = true;
}
else {
this.nippleDirection = 'none';
this.Key_Action_CLEFT = false;
this.Key_Action_CRIGHT = false;
this.Key_Action_CUP = false;
this.Key_Action_CDOWN = false;
}
}
else
{
this.VectorX = data.vector.x;
this.VectorY = data.vector.y;
}
})
this.manager.on("end", (evt, data) => {
this.nippleDirection = 'none';
this.Key_Left = false;
this.Key_Right = false;
this.Key_Up = false;
this.Key_Down = false;
this.VectorX = 0;
this.VectorY = 0;
})
//needed in conjuction with nippleJS otherwise iOS text selection will activate
document.getElementById(touch_element_id).addEventListener( 'touchstart', function(e){e.preventDefault();}, false );
document.getElementById(touch_element_id).addEventListener( 'touchend', function(e){e.preventDefault();}, false );
document.getElementById(touch_element_id).addEventListener( 'touchmove', function(e){e.preventDefault();}, false );
document.getElementById('mobileA').addEventListener( 'touchstart', this.mobilePressA.bind(this), false );
document.getElementById('mobileB').addEventListener( 'touchstart', this.mobilePressB.bind(this), false );
document.getElementById('mobileStart').addEventListener( 'touchstart', this.mobilePressStart.bind(this), false );
document.getElementById('mobileSelect').addEventListener( 'touchstart', this.mobilePressSelect.bind(this), false );
document.getElementById('mobileA').addEventListener( 'touchend', this.mobileReleaseA.bind(this), false );
document.getElementById('mobileB').addEventListener( 'touchend', this.mobileReleaseB.bind(this), false );
document.getElementById('mobileStart').addEventListener( 'touchend', this.mobileReleaseStart.bind(this), false );
document.getElementById('mobileSelect').addEventListener( 'touchend', this.mobileReleaseSelect.bind(this), false );
document.getElementById('mobileA').addEventListener( 'touchmove', function(e){e.preventDefault();}, false );
document.getElementById('mobileB').addEventListener( 'touchmove', function(e){e.preventDefault();}, false );
document.getElementById('mobileStart').addEventListener( 'touchmove', function(e){e.preventDefault();}, false );
document.getElementById('mobileSelect').addEventListener( 'touchmove', function(e){e.preventDefault();}, false );
//to hide and show loading panel
document.getElementById('menuDiv').addEventListener( 'touchstart', this.menuTouch.bind(this), false );
}
}
menuTouch(event){
$("#mobileButtons").show();
$('#menuDiv').hide();
}
mobilePressA(event){
event.preventDefault();
this.Key_Action_A = true;
this.MobileA = true;
}
mobilePressB(event){
event.preventDefault();
this.Key_Action_B = true;
this.MobileB = true;
}
mobilePressStart(event){
event.preventDefault();
this.Key_Action_Start = true;
this.MobileStart = true;
}
mobilePressSelect(event){
event.preventDefault();
this.Key_Action_Z = true;
this.MobileSelect = true;
}
mobileReleaseA(event){
event.preventDefault();
this.MobileA = false;
this.Key_Action_A = false;
this.MobileA_Counter=0;
}
mobileReleaseB(event){
event.preventDefault();
this.MobileB = false;
this.Key_Action_B = false;
this.MobileB_Counter=0;
}
mobileReleaseStart(event){
event.preventDefault();
this.MobileStart = false;
this.Key_Action_Start = false;
this.MobileStart_Counter=0;
}
mobileReleaseSelect(event){
event.preventDefault();
this.MobileSelect = false;
this.Key_Action_Z = false;
this.MobileSelect_Counter=0;
}
touchStart(event){
event.preventDefault();
let input_controller = this;
//prevent multi-touch from grabbing the wrong touch event
//there may be more than 2 touches so just loop until it's found
for(let i = 0;i<event.touches.length;i++)
{
let touch = event.touches[i];
if (touch.target["id"]=="divTouchSurface" || touch.target["id"]=="startDiv")
{
input_controller.touchX_Start = touch.clientX;
input_controller.touchY_Start = touch.clientY;
}
}
}
touchMove(event){
event.preventDefault();
let input_controller = this;
//prevent multi-touch from grabbing the wrong touch event
for(let i = 0;i<event.touches.length;i++)
{
let touch = event.touches[i];
if (touch.target["id"]=="divTouchSurface" || touch.target["id"]=="startDiv")
{
var amount_horizontal = touch.clientX-input_controller.touchX_Start;
var amount_vertical = touch.clientY-input_controller.touchY_Start;
if (amount_horizontal>10)
{
if (!input_controller.Key_Right)
{
input_controller.sendKeyDownEvent(input_controller.KeyMappings.Mapping_Right);
input_controller.Key_Right=true;
}
}
if (amount_horizontal<-10)
{
if (!input_controller.Key_Left)
{
input_controller.sendKeyDownEvent(input_controller.KeyMappings.Mapping_Left);
input_controller.Key_Left=true;
}
}
if (amount_vertical>10)
{
if (!input_controller.Key_Down)
{
input_controller.sendKeyDownEvent(input_controller.KeyMappings.Mapping_Down);
input_controller.Key_Down=true;
}
}
if (amount_vertical<-10)
{
if (!input_controller.Key_Up)
{
input_controller.sendKeyDownEvent(input_controller.KeyMappings.Mapping_Up);
input_controller.Key_Up=true;
}
}
}
}
}
touchEnd(event){
event.preventDefault();
event.stopPropagation();
let input_controller = this;
if (input_controller.Key_Left==false && input_controller.Key_Right==false
&& input_controller.Key_Down==false && input_controller.Key_Up==false)
input_controller.Touch_Tap=true;
if (input_controller.Key_Right)
{
input_controller.sendKeyUpEvent(input_controller.KeyMappings.Mapping_Right);
input_controller.Key_Right=false;
}
if (input_controller.Key_Left)
{
input_controller.sendKeyUpEvent(input_controller.KeyMappings.Mapping_Left);
input_controller.Key_Left=false;
}
if (input_controller.Key_Up)
{
input_controller.sendKeyUpEvent(input_controller.KeyMappings.Mapping_Up);
input_controller.Key_Up=false;
}
if (input_controller.Key_Down)
{
input_controller.sendKeyUpEvent(input_controller.KeyMappings.Mapping_Down);
input_controller.Key_Down=false;
}
}
defaultKeymappings() {
return {
Mapping_Left: 'b',
Mapping_Right: 'n',
Mapping_Up: 'y',
Mapping_Down: 'h',
Mapping_Action_A: 'd',
Mapping_Action_B: 's',
Mapping_Action_Start: 'Enter',
Mapping_Action_CUP: 'i',
Mapping_Action_CDOWN: 'k',
Mapping_Action_CLEFT: 'j',
Mapping_Action_CRIGHT: 'l',
Mapping_Action_Analog_Up: 'ArrowUp',
Mapping_Action_Analog_Down: 'ArrowDown',
Mapping_Action_Analog_Left: 'ArrowLeft',
Mapping_Action_Analog_Right: 'ArrowRight',
Mapping_Action_Z: 'a',
Mapping_Action_L: 'q',
Mapping_Action_R: 'e',
Mapping_Menu: '`',
Joy_Mapping_Left: 14,
Joy_Mapping_Right: 15,
Joy_Mapping_Down: 13,
Joy_Mapping_Up: 12,
Joy_Mapping_Action_A: 0,
Joy_Mapping_Action_B: 2,
Joy_Mapping_Action_Start: 9,
Joy_Mapping_Action_Z: 4,
Joy_Mapping_Action_L: 6,
Joy_Mapping_Action_R: 5,
Joy_Mapping_Menu: 11,
Joy_Mapping_Action_CLEFT: -1,
Joy_Mapping_Action_CRIGHT: -1,
Joy_Mapping_Action_CUP: -1,
Joy_Mapping_Action_CDOWN: -1,
};
}
setupGamePad() {
window.addEventListener("gamepadconnected", this.initGamePad.bind(this));
}
setGamePadButtons() {
this.gamepadButtons = [];
}
initGamePad(e) {
try {
if (e.gamepad.buttons.length > 0) {
// this.message = '<b>Gamepad Detected:</b><br>' + e.gamepad.id;
}
}
catch (_a) { }
console.log("Gamepad connected at index %d: %s. %d buttons, %d axes.", e.gamepad.index, e.gamepad.id, e.gamepad.buttons.length, e.gamepad.axes.length);
}
processGamepad() {
try {
var gamepads = navigator.getGamepads ? navigator.getGamepads() : (navigator.webkitGetGamepads ? navigator.webkitGetGamepads : []);
if (!gamepads)
return;
var gp = null;
for (let i = 0; i < gamepads.length; i++) {
if (gamepads[i] && gamepads[i].buttons.length > 0)
gp = gamepads[i];
}
if (gp) {
for (let i = 0; i < gp.buttons.length; i++) {
if (this.DebugKeycodes) {
if (gp.buttons[i].pressed)
console.log(i);
}
if (gp.buttons[i].pressed)
this.Joy_Last = i;
}
//process axes
if (this.Gamepad_Process_Axis) {
try {
let horiz_axis = gp.axes[0];
let vertical_axis = gp.axes[1];
if (horiz_axis < -.5) {
if (!this.Key_Left) {
this.sendKeyDownEvent(this.KeyMappings.Mapping_Left);
}
}
else {
if (this.Key_Left) {
this.sendKeyUpEvent(this.KeyMappings.Mapping_Left);
}
}
if (horiz_axis > .5) {
if (!this.Key_Right) {
this.sendKeyDownEvent(this.KeyMappings.Mapping_Right);
}
}
else {
if (this.Key_Right) {
this.sendKeyUpEvent(this.KeyMappings.Mapping_Right);
}
}
if (vertical_axis > .5) {
if (!this.Key_Down) {
this.sendKeyDownEvent(this.KeyMappings.Mapping_Down);
}
}
else {
if (this.Key_Down) {
this.sendKeyUpEvent(this.KeyMappings.Mapping_Down);
}
}
if (vertical_axis < -.5) {
if (!this.Key_Up) {
this.sendKeyDownEvent(this.KeyMappings.Mapping_Up);
}
}
else {
if (this.Key_Up) {
this.sendKeyUpEvent(this.KeyMappings.Mapping_Up);
}
}
}
catch (error) { }
}
}
}
catch (_a) { }
}
sendKeyDownEvent(key) {
let keyEvent = new KeyboardEvent('Gamepad Event Down', { key: key });
this.keyDown(keyEvent);
}
sendKeyUpEvent(key) {
let keyEvent = new KeyboardEvent('Gamepad Event Up', { key: key });
this.keyUp(keyEvent);
}
keyDown(event) {
let input_controller = this;
input_controller.Key_Last = event.key;
if (input_controller.DebugKeycodes)
console.log(event);
//handle certain keyboards that use Left instead of ArrowLeft
if (event.key == 'Left' && input_controller.KeyMappings.Mapping_Left == 'ArrowLeft')
event = new KeyboardEvent('', { key: 'ArrowLeft' });
if (event.key == 'Right' && input_controller.KeyMappings.Mapping_Right == 'ArrowRight')
event = new KeyboardEvent('', { key: 'ArrowRight' });
if (event.key == 'Up' && input_controller.KeyMappings.Mapping_Up == 'ArrowUp')
event = new KeyboardEvent('', { key: 'ArrowUp' });
if (event.key == 'Down' && input_controller.KeyMappings.Mapping_Down == 'ArrowDown')
event = new KeyboardEvent('', { key: 'ArrowDown' });
let arrowkey = false;
//player 1
if (event.key == input_controller.KeyMappings.Mapping_Down) {
input_controller.Key_Down = true;
arrowkey = true;
}
if (event.key == input_controller.KeyMappings.Mapping_Up) {
input_controller.Key_Up = true;
arrowkey = true;
}
if (event.key == input_controller.KeyMappings.Mapping_Left) {
input_controller.Key_Left = true;
arrowkey = true;
}
if (event.key == input_controller.KeyMappings.Mapping_Right) {
input_controller.Key_Right = true;
arrowkey = true;
}
if (event.key == input_controller.KeyMappings.Mapping_Action_Start) {
input_controller.Key_Action_Start = true;
}
if (event.key == input_controller.KeyMappings.Mapping_Action_CUP) {
input_controller.Key_Action_CUP = true;
}
if (event.key == input_controller.KeyMappings.Mapping_Action_CDOWN) {
input_controller.Key_Action_CDOWN = true;
}
if (event.key == input_controller.KeyMappings.Mapping_Action_CLEFT) {
input_controller.Key_Action_CLEFT = true;
}
if (event.key == input_controller.KeyMappings.Mapping_Action_CRIGHT) {
input_controller.Key_Action_CRIGHT = true;
}
if (event.key == input_controller.KeyMappings.Mapping_Action_B) {
input_controller.Key_Action_B = true;
}
if (event.key == input_controller.KeyMappings.Mapping_Action_Z) {
input_controller.Key_Action_Z = true;
}
if (event.key == input_controller.KeyMappings.Mapping_Action_L) {
input_controller.Key_Action_L = true;
}
if (event.key == input_controller.KeyMappings.Mapping_Action_R) {
input_controller.Key_Action_R = true;
}
if (event.key == input_controller.KeyMappings.Mapping_Action_A) {
input_controller.Key_Action_A = true;
}
if (event.key == input_controller.KeyMappings.Mapping_Menu) {
input_controller.Key_Menu = true;
}
}
keyUp(event) {
let input_controller = this;
//handle certain keyboards that use Left instead of ArrowLeft
if (event.key == 'Left' && input_controller.KeyMappings.Mapping_Left == 'ArrowLeft')
event = new KeyboardEvent('', { key: 'ArrowLeft' });
if (event.key == 'Right' && input_controller.KeyMappings.Mapping_Right == 'ArrowRight')
event = new KeyboardEvent('', { key: 'ArrowRight' });
if (event.key == 'Up' && input_controller.KeyMappings.Mapping_Up == 'ArrowUp')
event = new KeyboardEvent('', { key: 'ArrowUp' });
if (event.key == 'Down' && input_controller.KeyMappings.Mapping_Down == 'ArrowDown')
event = new KeyboardEvent('', { key: 'ArrowDown' });
//player 1
if (event.key == input_controller.KeyMappings.Mapping_Down) {
input_controller.Key_Down = false;
}
if (event.key == input_controller.KeyMappings.Mapping_Up) {
input_controller.Key_Up = false;
}
if (event.key == input_controller.KeyMappings.Mapping_Left) {
input_controller.Key_Left = false;
}
if (event.key == input_controller.KeyMappings.Mapping_Right) {
input_controller.Key_Right = false;
}
if (event.key == input_controller.KeyMappings.Mapping_Action_Start) {
input_controller.Key_Action_Start = false;
}
if (event.key == input_controller.KeyMappings.Mapping_Action_CUP) {
input_controller.Key_Action_CUP = false;
}
if (event.key == input_controller.KeyMappings.Mapping_Action_CDOWN) {
input_controller.Key_Action_CDOWN = false;
}
if (event.key == input_controller.KeyMappings.Mapping_Action_CLEFT) {
input_controller.Key_Action_CLEFT = false;
}
if (event.key == input_controller.KeyMappings.Mapping_Action_CRIGHT) {
input_controller.Key_Action_CRIGHT = false;
}
if (event.key == input_controller.KeyMappings.Mapping_Action_B) {
input_controller.Key_Action_B = false;
}
if (event.key == input_controller.KeyMappings.Mapping_Action_Z) {
input_controller.Key_Action_Z = false;
}
if (event.key == input_controller.KeyMappings.Mapping_Action_L) {
input_controller.Key_Action_L = false;
}
if (event.key == input_controller.KeyMappings.Mapping_Action_R) {
input_controller.Key_Action_R = false;
}
if (event.key == input_controller.KeyMappings.Mapping_Action_A) {
input_controller.Key_Action_A = false;
}
if (event.key == input_controller.KeyMappings.Mapping_Menu) {
input_controller.Key_Menu = false;
}
}
update() {
this.processGamepad();
//a hack - need to refactor
if (this.Remap_Check) {
if (this.Key_Last != '' || this.Joy_Last) {
window["myApp"].remapPressed();
this.Remap_Check = false;
}
}
}
updateMobileControls(){
let mobileString = '';
mobileString += '0'; //UP
mobileString += '0'; //DOWN
mobileString += '0'; //LEFT
mobileString += '0'; //RIGHT
if (this.Key_Action_A) mobileString += '1'; else mobileString += '0';
if (this.Key_Action_B) mobileString += '1'; else mobileString += '0';
if (this.Key_Action_Start) mobileString += '1'; else mobileString += '0';
if (this.Key_Action_Z && !window["myApp"].rivetsData.useZasCMobile) mobileString += '1'; else mobileString += '0';
mobileString += '0'; //L
mobileString += '0'; //R
if (this.Key_Action_CUP) mobileString += '1'; else mobileString += '0'; //CUP
if (this.Key_Action_CDOWN) mobileString += '1'; else mobileString += '0'; //CDOWN
if (this.Key_Action_CLEFT) mobileString += '1'; else mobileString += '0'; //CLEFT
if (this.Key_Action_CRIGHT) mobileString += '1'; else mobileString += '0'; //CRIGHT
window["myApp"].sendMobileControls(mobileString, this.VectorX.toString(), this.VectorY.toString());
}
}
window["myApp"].setupInputController();
var script = document.createElement('script');
script.src = 'n64wasm.js'
document.getElementsByTagName('head')[0].appendChild(script);

1
games/emulators/N64/n64wasm.js Executable file
View File

File diff suppressed because one or more lines are too long

BIN
games/emulators/N64/n64wasm.wasm Executable file
View File

Binary file not shown.

7
games/emulators/N64/romlist.js Executable file
View File

@@ -0,0 +1,7 @@
var ROMLIST = [
/*
{url:"roms/rom1.z64",title:"Game 1"},
{url:"roms/rom2.v64",title:"Game 2"},
{url:"roms/rom3.v64",title:"Game 3"},
*/
];

1618
games/emulators/N64/script.js Executable file
View File

File diff suppressed because it is too large Load Diff

5
games/emulators/N64/settings.js Executable file
View File

@@ -0,0 +1,5 @@
var N64WASMSETTINGS = {
CLOUDSAVEURL: "",
SHOWADVANCED: false, //set this to true to enable importing of save files (eep, sra, fla)
SHOWOPTIONS: false //set this to true to add options for reset and toggling fps
}

BIN
images/emulators/n64.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 124 KiB

13
index.html
View File

@@ -33,7 +33,6 @@
</b> </b>
</h2> </h2>
<div class="homescreen"> <div class="homescreen">
<!-- 16 app icons -->
<a href="https://neon443.github.io/eaglercraft152/" class="app"> <a href="https://neon443.github.io/eaglercraft152/" class="app">
<img src="./images/minecraft/1.5.png" alt="App Icon"> <img src="./images/minecraft/1.5.png" alt="App Icon">
<span class="label">Minecraft 1.5.2</span> <span class="label">Minecraft 1.5.2</span>
@@ -74,6 +73,17 @@
<img src="./images/sandboxels/icon.png" alt="App Icon"> <img src="./images/sandboxels/icon.png" alt="App Icon">
<span class="label">Sandboxels</span> <span class="label">Sandboxels</span>
</a> </a>
<a href="./games/run3/" class="app">
<img src="./images/run3/icon.png" alt="App Icon">
<span class="label">Run 3</span>
</a>
</div>
<h3>Emulators</h3>
<div class="homescreen">
<a href="./games/emulators/N64/" class="app">
<img src="./images/emulators/n64.png" alt="App Icon">
<span class="label">Nintendo 64</span>
</a>
</div> </div>
<h3><b>News</b></h3> <h3><b>News</b></h3>
<div class="indented"> <div class="indented">
@@ -82,6 +92,7 @@
</p> </p>
<h4>New Games</h4> <h4>New Games</h4>
<p class="indented"> <p class="indented">
06/10/2024 Nintendo 64 Emulator<br>
05/10/2024 Run 3<br> 05/10/2024 Run 3<br>
28/09/2024 Google Doodle Champion Island 28/09/2024 Google Doodle Champion Island
</p> </p>

15
style.css
View File

@@ -168,10 +168,10 @@ h5 {
.homescreen { .homescreen {
display: grid; display: grid;
grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); /* Responsive grid */ grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
gap: 20px; gap: 20px;
margin: 0px; margin-top: 10px;
justify-content: center; justify-items: start;
} }
.app { .app {
@@ -181,19 +181,19 @@ h5 {
align-items: center; align-items: center;
text-align: center; text-align: center;
text-decoration: none; text-decoration: none;
transition: 0.2s ease-in-out; transition: 0.1s ease-in-out;
} }
.app img { .app img {
margin-top: 5px; margin-top: 5px;
width: auto; width: 100px;
height: 100px; height: 100px;
border-radius: 10px; border-radius: 10px;
transition: transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); transition: 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
} }
.app:hover { .app:hover {
transform: scale(1.1); /* Grow effect */ transform: scale(1.1);
font-weight: 1000; font-weight: 1000;
font-size: large; font-size: large;
color: #ff6200; color: #ff6200;
@@ -207,7 +207,6 @@ h5 {
margin-bottom: 5px; margin-bottom: 5px;
} }
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
* { * {
color: #ddd; color: #ddd;