Skip to content

V2 #2

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
DerGenaue wants to merge 3 commits into
base: master
Choose a base branch
from
Open

V2 #2

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
6560445
Tutor Remote Protocol v2
DerGenaue Dec 19, 2015
81f6487
Improved Tons of stuff
DerGenaue Dec 22, 2015
5f3e72b
C# Client now works with Mono on MAC
DerGenaue Dec 24, 2015
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file added C#Client/TutorRemoteClient.exe
View file
Open in desktop
Binary file not shown.
295 changes: 16 additions & 279 deletions JS/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,294 +4,31 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0">
<title>TutorRemote</title>
<style type="text/css">
h1 {
text-align: center;
}

div.floatEnd {
clear: both;
}
div#content {
margin: 2%;
margin-top: 2em;
}

div#conState, div#token {
box-sizing: border-box;
margin: 0 2%;
padding: .3em .6em;

text-align: center;
border: 1px solid #888;
border-radius: .3em;

-webkit-transition: border-color .2s;
transition: border-color .2s;
}
div#conState {
float: left;
width: 40%;
}
div#token {
float: right;
width: 40%;
background-color: #eee;
}
div#token #tokenField {
display: inline-block;
padding: 0 .5em;
text-align: center;
background-color: #fafafa;
}

div#conState.connect {
background-color: #ffa;
}
div#conState.ready {
background-color: #afa;
}
div#conState.error {
background-color: #faa;
}
div#conState.closed {
background-color: #aaa;
}
div#conState.send {
border-color: #ff0;
-webkit-transition: border-color 0s;
transition: border-color 0s;
}

button#sendText {
display: block;
margin: 0 auto;
padding: .5em 2em;
}
textarea#textinput {
box-sizing: border-box;
width: 100%;
}
input#keyboardFetcher {
box-sizing: border-box;
width: 100%;
}
</style>




<script type="text/javascript">
var keyboard = "asdf";
var socket;
var conState;

function sendKey(event, down){
if(event.target.id != "textinput") {
if(event.keyIdentifier == undefined){
//try to work around firefox not having keyIdentifier
if(event.key.length == 1){
if(event.key == " ") event.keyIdentifier = "Space";
else{
var char = event.key.toUpperCase().charCodeAt(0).toString(16);
event.keyIdentifier = ("U+" + "0".repeat(4-char.length) + char).toUpperCase();
}
}
else{
switch(event.key){
case "Backspace": event.keyIdentifier = "U+0008"; break;
case "Delete": event.keyIdentifier = "U+007F"; break;
case "Escape": event.keyIdentifier = "U+001B"; break;
default: event.keyIdentifier = event.key.replace("Arrow",""); break;
}
}
}
//prevent browser interpretation of the keypresses in some cases
event.preventDefault();
send((down ? "char: " : "CHAR: ") + getKeyIdentifier(event));
}
}
function setUp(){
conState = document.getElementById("conState");

if(getCookie("keyboard") != "") [].slice.call(document.getElementsByName("source")).filter(function(e){return e.value == getCookie("keyboard")})[0].click();
socket = new WebSocket("ws://tutorremote.madge.me:9160/", "tutorremote");
socket.onopen = function (event) {
socket.send("INPUTINIT");
conState.className = "ready";
conState.innerHTML = "Connected! Just start typing";
};
socket.onerror = function (error) {
conState.className = "error";
conState.innerHTML = "Error... Connection failed";
};
socket.onclose = function (event) {
conState.className = "closed";
conState.innerHTML = "Connection closed";
};
socket.onmessage = function (event) {
var ctrl = event.data.split(": ")
switch(ctrl[0]){
case "TOKN": updateToken(ctrl[1]); break;
default: break;
}
console.log(event.data);
};
}
function updateKeyboard(event){
keyboard = event.target.value;
setCookie("keyboard", keyboard, 365)
}
function close(){
socket.close();
console.log("end");
}
function updateToken(token){
document.getElementById("tokenField").innerHTML = token;
}
function sendText(){
send("TEXT: " + document.getElementById("textinput").value);
document.getElementById("textinput").value = "";
}
function sendReset(){
send("RESETMOD");
}
function send(msg){
socket.send(msg);
conState.className += " send";
window.setTimeout(function(){conState.className = conState.className.replace(/ send/g, '');}, 10);
}
function getKeyIdentifier(event){
//console.log(event);
if(keyboard == "ansi"){
if (event.shiftKey) {
switch (event.keyIdentifier) {
case "U+0021": return "U+0031"; break;
case "U+0040": return "U+0032"; break;
case "U+0023": return "U+0033"; break;
case "U+0024": return "U+0034"; break;
case "U+0025": return "U+0035"; break;
case "U+005E": return "U+0036"; break;
case "U+0026": return "U+0037"; break;
case "U+002A": return "U+0038"; break;
case "U+0028": return "U+0039"; break;
case "U+0029": return "U+0030"; break;
case "U+005F": return "U+002D"; break;
case "U+002B": return "U+003D"; break;
case "U+007B": return "U+005B"; break;
case "U+007D": return "U+005D"; break;
case "U+003A": return "U+003B"; break;
case "U+0022": return "U+0027"; break;
case "U+007C": return "U+005C"; break;
case "U+007E": return "U+0060"; break;
case "U+003C": return "U+002C"; break;
case "U+003E": return "U+002E"; break;
case "U+003F": return "U+002F"; break;
default: return event.keyIdentifier;
}
}
else { return event.keyIdentifier; }
}
if(keyboard == "german"){
if (event.shiftKey) {
switch (event.keyIdentifier) {
case "U+0021": return "U+0031"; break;
case "U+0022": return "U+0032"; break;
case "U+00A7": return "U+0033"; break;
case "U+0024": return "U+0034"; break;
case "U+0025": return "U+0035"; break;
case "U+0026": return "U+0036"; break;
case "U+002F": return "U+0037"; break;
case "U+0028": return "U+0038"; break;
case "U+0029": return "U+0039"; break;
case "U+003D": return "U+0030"; break;
case "U+003F": return "U+002D"; break;
case "U+002B": return "U+003D"; break;
case "U+005A": return "U+0059"; break;
case "U+0059": return "U+005A"; break;
case "U+00DC": return "U+005B"; break;
case "U+002A": return "U+005D"; break;
case "U+00D6": return "U+003B"; break;
case "U+00C4": return "U+0027"; break;
case "U+0027": return "U+005C"; break;
case "U+003E": return "U+0060"; break;
case "U+003B": return "U+002C"; break;
case "U+003A": return "U+002E"; break;
case "U+005F": return "U+002F"; break;
case "Unidentified": switch (event.which) {
case 187: return "U+003D";
default: return event.keyIdentifier;
} break;
default: return event.keyIdentifier;
}
}
/*else{
switch (event.keyIdentifier) {
//case "U+00DF": return "U+002D"; break;
case "U+005A": return "U+0059"; break;
case "U+0059": return "U+005A"; break;
case "U+003C": return "U+0060"; break;
case "U+002D": return "U+002F"; break;
case "U+00FC": return "U+005B"; break;
case "U+002B": return "U+005D"; break;
case "U+00F6": return "U+003B"; break;
case "U+00E4": return "U+0027"; break;
case "U+0023": return "U+005C"; break;
case "Unidentified": switch (event.which) {
case 187: return "U+003D";
default: return event.keyIdentifier;
} break;
default: return event.keyIdentifier;
}
}*/
}
else {
return event.keyIdentifier;
}
}
function setCookie(cname, cvalue, exdays) {
var d = new Date();
d.setTime(d.getTime() + (exdays*24*60*60*1000));
var expires = "expires="+d.toUTCString();
document.cookie = cname + "=" + cvalue + "; " + expires;
}
function getCookie(cname) {
var name = cname + "=";
var ca = document.cookie.split(';');
for(var i=0; i<ca.length; i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1);
if (c.indexOf(name) == 0) return c.substring(name.length, c.length);
}
return "";
}

window.onload = setUp;
window.onunload = close;
</script>





<link rel="stylesheet" href="style.css" 7>
<script type="text/javascript" src="remote.js"></script>
</head>
<body onkeydown="sendKey(event, true)" onkeyup="sendKey(event, false)" >
<body onkeypress="sendKey(event)" onkeydown="sendCombo(event)" >
<h1>TutorRemote</h1>
<div id="top">
<div id="conState" class="connect">Connecting...</div>
<div id="output" onclick="testToken()">Output Token: <input id="outputT" type="text" placeholder="TOKEN" onkeyup="testToken()"></input></div>
<div id="token">Your Token is: <span id="tokenField">undefined</span></div>
<div id="conState" class="connect" onclick="requestActivation()">Connecting...</div>
<div class="floatEnd"></div>
</div>
<div id="content">
<input id="keyboardFetcher" type="text" value="Get the keyboard."></input>
<input id="keyboardFetcher" type="text" placeholder="Type here" oninput="sendFallback()"></input>
<h3>Send Text</h3>
<textarea id="textinput" rows="4"></textarea>
<button id="sendText" type="button" onclick="sendText()">Send!</button>
<h3>Input Keyboard Layout</h3>
<input type="radio" name="source" value="disable" checked onchange="updateKeyboard(event)"> Disable mapping<br>
<input type="radio" name="source" value="ansi" onchange="updateKeyboard(event)"> Ansi<br>
<input type="radio" name="source" value="german" onchange="updateKeyboard(event)"> German<br><br><br><br>
<button type="button" onclick="sendReset()">Reset Modifier Keys</button>
<div id="lowerC">
<button id="bksp" type="button" onclick="sendBksp()">&#9003;</button>
<div id="cursor">
<button id="up" type="button" onclick="sendCursor(1)">&#9650;</button>
<button id="left" type="button" onclick="sendCursor(0)">&#9664;</button>
<button id="right" type="button" onclick="sendCursor(2)">&#9654;</button>
<button id="down" type="button" onclick="sendCursor(3)">&#9660;</button>
</div>
<button id="sendText" type="button" onclick="sendText()">Send!</button>
</div>
</div>
</body>
</html>
Loading