autumn/CMDR_Console
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Initial (overdue) commit

Browse Source 
TODO:
- enable dynamic loading of button labels and actions
This commit is contained in:
Autumn Naber
2020-08-27 17:21:17 -07:00
parent 6e83bfb9c5
commit c5b61eee0a
42 changed files with 2739 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

113
CMDRConsole/static/CMDRConsole.css Normal file
View File

@@ -0,0 +1,113 @@
.header-grid {
display: grid;
grid-template-columns: repeat(5, 1fr);
grid-gap: 3px;
height: 8%;
width: 100%;
grid-auto-flow: row;
margin-bottom: 1%;
}
.header-button {
align-self: stretch;
background-color: #210c0c;
border: 1px solid #ff7200;
color: #ff7200;
font-weight: bold;
height: 100%;
width: 100%;
font-size: large;
font-weight: bold;
}
.button-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-template-rows: repeat(4, 1fr);
grid-gap: 3px;
height: 90%;
width: 100%;
grid-auto-flow: row;
}
.grid-button {
text-align: center;
align-self: stretch;
background-color: #210c0c;
border: 1px solid #ff7200;
color: #ff7200;
font-weight: bold;
font-size: x-large;
height: 100%;
width: 100%;
}
.key-container {
display: grid;
grid-template-columns: repeat(59, 1fr);
grid-template-rows: repeat(5, 1fr);
grid-gap: 3px;
height: 50%;
width: 100%;
grid-auto-flow: row;
}
.track-container {
height: 40%;
width: 100%;
}
.track-button {
align-self: stretch;
background-color: #210c0c;
border: 1px solid #ff7200;
color: #ff7200;
height: 100%;
width: 100%;
}
.grid-key {
text-align: center;
align-self: stretch;
grid-column-end: span 4;
background-color: #210c0c;
border: 1px solid #ff7200;
color: #ff7200;
font-weight: bold;
height: 100%;
width: 100%;
font-size: large;
font-weight: bold;
}
.grid-key-empty {
text-align: center;
align-self: stretch;
grid-column-end: span 4;
height: 100%;
width: 100%;
background: #0c0c0c;
border: 0px;
visibility: hidden;
}
.grid-key:active {
background-color: #ff7200;
color: #210c0c;
}
body, .content, .container {
height: 100%;
width: 100%;
background: #0c0c0c;
}
body, html {
height: 100%;
width: 100%;
overflow-x: hidden;
overflow-y: hidden;
margin:0;
padding:0;
position: fixed;
}

74
CMDRConsole/static/CMDRConsole.js Normal file
View File

@@ -0,0 +1,74 @@
var x;
var y;
var timer;
var scale = 1.0;
var lastFired = new Date().getTime();
function touchStartEventHandler(e) {
x = e.touches[0].clientX;
y = e.touches[0].clientY;
}
function touchMoveEventHandler(e) {
clearTimeout(timer);
var now = new Date().getTime();
if (now < lastFired + 200) {
timer = setTimeout(function() {
touchMoveEventHandler(e);
}, lastFired - now + 100);
return;
}
var new_x = e.touches[0].clientX;
var new_y = e.touches[0].clientY;
var d_x = (new_x - x) / scale;
var d_y = (new_y - y) / scale;
x = new_x;
y = new_y;
var request = new XMLHttpRequest();
request.open("POST", "/mouse_move", true);
request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
console.log("dx=" + d_x + "&dy=" + d_y);
request.send("dx=" + d_x + "&dy=" + d_y);
lastFired = now;
e.stopPropagation();
e.preventDefault();
}
function tapEventHandler(e) {
var request = new XMLHttpRequest();
request.open("POST", "/mouse_tap", true);
request.send();
}
function keyEventHandler(e) {
e.preventDefault();
var clickedButton = e.target;
var command = clickedButton.innerHTML ;
var request = new XMLHttpRequest();
request.open("POST", "/button_press", true);
request.send(command);
}
addEventListener("DOMContentLoaded", function() {
// Set grid and key buttons to send to server without refresh
var buttons = document.querySelectorAll(".grid-button, .grid-key");
for (var ii=0, ll=buttons.length; ii<ll; ii++) {
var btn = buttons[ii];
btn.addEventListener("click", keyEventHandler);
}
var trackpad = document.querySelector(".track-button");
if (trackpad != null) {
trackpad.addEventListener("touchstart", touchStartEventHandler, true);
trackpad.addEventListener("touchmove", touchMoveEventHandler, true);
trackpad.addEventListener("click", tapEventHandler, true);
}
}, true);