mirror of
https://github.com/danog/system-bus-radio.git
synced 2024-12-04 17:27:49 +01:00
Merge branch 'master' of https://github.com/quanyang/system-bus-radio into quanyang-master
* 'master' of https://github.com/quanyang/system-bus-radio: vanillaJS port
This commit is contained in:
William Entriken
commit
e4d393b57c
24
js_version/airgap.html
Normal file
24
js_version/airgap.html
Normal file
@ -0,0 +1,24 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||||
|
<title>System Bus Radio</title>
|
||||||
|
<meta name="description" content="Simulator for MIPS">
|
||||||
|
<link rel="stylesheet" href="main.css">
|
||||||
|
<script src="./airgap.js"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="header">
|
||||||
|
System Bus Radio
|
||||||
|
</div>
|
||||||
|
<div class="content">
|
||||||
|
</br>
|
||||||
|
<input type="button" value="Play Song" onclick="start()"></br></br>
|
||||||
|
<textarea id="logs" style="width:70%;min-height:300px">Tested with Chrome at 1560Khz
|
||||||
|
</textarea>
|
||||||
|
<div style="font-size:14px">Ported by Yeo Quan Yang. Credits to the original author William Entriken @https://github.com/fulldecent</div><br/>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
87
js_version/airgap.js
Normal file
87
js_version/airgap.js
Normal file
@ -0,0 +1,87 @@
|
|||||||
|
//Credits to https://github.com/fulldecent/system-bus-radio
|
||||||
|
//As well as Jordan Harband for the nodejs simd library
|
||||||
|
//Tested to be working on Chrome at 1560khz
|
||||||
|
|
||||||
|
var _i32x4 = new Int32Array(4);
|
||||||
|
Int32x4 = function(x, y, z, w) {
|
||||||
|
if (!(this instanceof Int32x4)) {
|
||||||
|
return new Int32x4(x, y, z, w);
|
||||||
|
}
|
||||||
|
|
||||||
|
this.x_ = x|0;
|
||||||
|
this.y_ = y|0;
|
||||||
|
this.z_ = z|0;
|
||||||
|
this.w_ = w|0;
|
||||||
|
}
|
||||||
|
|
||||||
|
Int32x4store = function(tarray, index, value) {
|
||||||
|
var bpe = tarray.BYTES_PER_ELEMENT;
|
||||||
|
_i32x4[0] = value.x_;
|
||||||
|
_i32x4[1] = value.y_;
|
||||||
|
_i32x4[2] = value.z_;
|
||||||
|
_i32x4[3] = value.w_;
|
||||||
|
var array = bpe == 1 ? _i8x16 :
|
||||||
|
bpe == 2 ? _i16x8 :
|
||||||
|
bpe == 4 ? (tarray instanceof Float32Array ? _f32x4 : _i32x4) :
|
||||||
|
_f64x2;
|
||||||
|
var n = 16 / bpe;
|
||||||
|
for (var i = 0; i < n; ++i)
|
||||||
|
tarray[index + i] = array[i];
|
||||||
|
return value;
|
||||||
|
}
|
||||||
|
|
||||||
|
function now() {
|
||||||
|
return performance.now()*1000000;
|
||||||
|
}
|
||||||
|
|
||||||
|
var tarray = new Int32Array(4);
|
||||||
|
var zero = Int32x4(0,0,0,0);
|
||||||
|
var one = Int32x4(-1,-1,-1,-1);
|
||||||
|
var NSEC_PER_SEC = 1000000000;
|
||||||
|
|
||||||
|
function square_am_signal(time,freq) {
|
||||||
|
document.getElementById('logs').value += "Playing / "+time+" seconds / "+freq+"Hz\n";
|
||||||
|
var period = NSEC_PER_SEC/freq;
|
||||||
|
var start = now();
|
||||||
|
var end = now()+time*NSEC_PER_SEC;
|
||||||
|
while (now() < end) {
|
||||||
|
var mid = start+period/2;
|
||||||
|
var reset = start+period;
|
||||||
|
while (now()<mid) {
|
||||||
|
Int32x4store(tarray, 0, one);
|
||||||
|
Int32x4store(tarray, 0, zero);
|
||||||
|
}
|
||||||
|
while(now() < reset){
|
||||||
|
}
|
||||||
|
start = reset
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function start() {
|
||||||
|
square_am_signal(0.400, 2673);
|
||||||
|
square_am_signal(0.400, 2349);
|
||||||
|
square_am_signal(0.400, 2093);
|
||||||
|
square_am_signal(0.400, 2349);
|
||||||
|
square_am_signal(0.400, 2673);
|
||||||
|
square_am_signal(0.400, 2673);
|
||||||
|
square_am_signal(0.790, 2673);
|
||||||
|
square_am_signal(0.400, 2349);
|
||||||
|
square_am_signal(0.400, 2349);
|
||||||
|
square_am_signal(0.790, 2349);
|
||||||
|
square_am_signal(0.400, 2673);
|
||||||
|
square_am_signal(0.400, 3136);
|
||||||
|
square_am_signal(0.790, 3136);
|
||||||
|
square_am_signal(0.400, 2673);
|
||||||
|
square_am_signal(0.400, 2349);
|
||||||
|
square_am_signal(0.400, 2093);
|
||||||
|
square_am_signal(0.400, 2349);
|
||||||
|
square_am_signal(0.400, 2673);
|
||||||
|
square_am_signal(0.400, 2673);
|
||||||
|
square_am_signal(0.400, 2673);
|
||||||
|
square_am_signal(0.400, 2673);
|
||||||
|
square_am_signal(0.400, 2349);
|
||||||
|
square_am_signal(0.400, 2349);
|
||||||
|
square_am_signal(0.400, 2673);
|
||||||
|
square_am_signal(0.400, 2349);
|
||||||
|
square_am_signal(0.790, 2093);
|
||||||
|
}
|
||||||
100
js_version/main.css
Normal file
100
js_version/main.css
Normal file
@ -0,0 +1,100 @@
|
|||||||
|
body {
|
||||||
|
background-color: #3498db;
|
||||||
|
font-family: Futura,Helvetica, "Century Gothic";
|
||||||
|
text-shadow: 1px 1px 0px black;
|
||||||
|
margin:0px;
|
||||||
|
padding:0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.todo {
|
||||||
|
font-size:12px;
|
||||||
|
}
|
||||||
|
.header {
|
||||||
|
color: white;
|
||||||
|
font-size: 50px;
|
||||||
|
padding-top:20px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
text-align: center;
|
||||||
|
margin:auto;
|
||||||
|
width:80%;
|
||||||
|
font-size:12px;
|
||||||
|
color:white;
|
||||||
|
}
|
||||||
|
#instructionBlock,.data {
|
||||||
|
font-size:12px !important;
|
||||||
|
}
|
||||||
|
.data td {
|
||||||
|
border:1px solid black;
|
||||||
|
border-bottom:0px;
|
||||||
|
border-right:0px;
|
||||||
|
}
|
||||||
|
.data td:last-child {
|
||||||
|
border-right:1px solid black;
|
||||||
|
}
|
||||||
|
.data tr:last-child td{
|
||||||
|
border-bottom:1px solid black;
|
||||||
|
}
|
||||||
|
|
||||||
|
a.button, input.button {
|
||||||
|
cursor: pointer;
|
||||||
|
font-family:Futura,Century Gothic;
|
||||||
|
background: #44c650;
|
||||||
|
border: 0px;
|
||||||
|
padding: 5px 80px;
|
||||||
|
font-weight:bold;
|
||||||
|
text-transform:uppercase;
|
||||||
|
color: white;
|
||||||
|
font-size: 15px;
|
||||||
|
text-shadow: 1px 1px 0px #222;
|
||||||
|
box-shadow: 3px 3px 0px #006633;
|
||||||
|
-webkit-transition: background-color 0.15s ease-in-out;
|
||||||
|
-moz-transition: background-color 0.15s ease-in-out;
|
||||||
|
-o-transition: background-color 0.15s ease-in-out;
|
||||||
|
transition: background-color 0.15s ease-in-out;
|
||||||
|
}
|
||||||
|
a.button {
|
||||||
|
display: inline-block;
|
||||||
|
text-decoration: none;
|
||||||
|
padding: 6px 12px 6px 12px;
|
||||||
|
}
|
||||||
|
input.button {
|
||||||
|
//font-size:15px!important;
|
||||||
|
padding: 5px 20px;
|
||||||
|
}
|
||||||
|
a.button:active, input.button:active {
|
||||||
|
position:relative;
|
||||||
|
top:1px;
|
||||||
|
}
|
||||||
|
a.button:hover, input.button:hover {
|
||||||
|
background: #00b200;
|
||||||
|
color:white;
|
||||||
|
text-shadow: 1px 1px 0px #222;
|
||||||
|
position:relative;
|
||||||
|
cursor:pointer;
|
||||||
|
cursor:hand;
|
||||||
|
}
|
||||||
|
input[type="text"],input[type="password"],textarea, select {
|
||||||
|
margin-left:0px;
|
||||||
|
background-color: #F7f7f7;
|
||||||
|
border: 1px solid black;
|
||||||
|
padding: 5px;
|
||||||
|
color:#444;
|
||||||
|
-webkit-transition: border-color 0.2s ease-in-out;
|
||||||
|
-moz-transition: border-color 0.2s ease-in-out;
|
||||||
|
-o-transition: border-color 0.2s ease-in-out;
|
||||||
|
transition: border-color 0.2s ease-in-out;
|
||||||
|
}
|
||||||
|
input[type="text"]:hover ,input[type="password"]:hover,textarea:hover,select:hover {
|
||||||
|
// border :1px solid pink;
|
||||||
|
box-shadow: 0px 0px 9px black;
|
||||||
|
}
|
||||||
|
input[type="text"]:focus ,input[type="password"]:focus,textarea:focus,select:focus {
|
||||||
|
border :1px solid #CB4242;
|
||||||
|
box-shadow: 0px 0px 9px #cb4242;
|
||||||
|
}
|
||||||
|
input, textarea, keygen, select, button, isindex {
|
||||||
|
outline:none;
|
||||||
|
resize: none;
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue
Block a user