From a7ee36c4a9e0aada84fc0364fc640956c2bb0ff8 Mon Sep 17 00:00:00 2001
From: Laurel Williams <laurel.m.williams@gmail.com>
Date: Thu, 15 Mar 2018 01:58:30 -0400
Subject: [PATCH] Add built-in mobile keyboard functionality
---
public/client.html | 5 ++++-
public/js/client.js | 25 +++++++++++++++++++++++++
public/style/main.css | 5 +++++
server.js | 34 +++++++++++++++++++++++++++++++++-
4 files changed, 67 insertions(+), 2 deletions(-)
diff --git a/public/client.html b/public/client.html
index 51f8e1e..27835cd 100755
--- a/public/client.html
+++ b/public/client.html
@@ -23,10 +23,13 @@
</div>
<div class="swiper-container">
- <div class="swiper-wrapper">
+ <div class="swiper-wrapper">
<div class = "keyboard swiper-slide" id="keyboard"> </div>
<div class = "numpad swiper-slide" id="numpad"> </div>
<div class = "hotkeys swiper-slide" id="hotkeys"> </div>
+ <div class = "textfield swiper-slide" id="textfieldcontainer">
+ <textarea class= "textfield" id="textfield" type="text" placeholder="Type here and press enter to send to desktop"></textarea>
+ </div>
<div class="swiper-slide">
<div class="swiper-container-inner">
<div class="swiper-wrapper" id="custom-container">
diff --git a/public/js/client.js b/public/js/client.js
index be9e02b..4c6d4a1 100755
--- a/public/js/client.js
+++ b/public/js/client.js
@@ -108,6 +108,31 @@ var emitUrl = function(str) {
}
};
+var emitText = function(text) {
+ if (move === false){
+ console.log(text);
+ socket.emit('text', text);
+ }
+};
+
+$( "#textfield" ).keydown(function(event) {
+ if (event.key === 'Enter') { // enter
+ emitText(document.getElementById('textfield').value);
+ event.preventDefault();
+ if (document.getElementById('textfield').value === '') {
+ socket.emit('functionality', 'enter');
+ }
+
+ document.getElementById('textfield').value = '';
+ }
+ else if (event.key === 'Backspace' && document.getElementById('textfield').value === "") { // backspace
+ socket.emit('functionality', 'backspace');
+ }
+ else if (event.key.startsWith('Arrow') && document.getElementById('textfield').value === "") { // arrow keys
+ socket.emit('functionality', event.key);
+ }
+});
+
//Purpose: Uses interact.js library to enable keys to move around
interact('.draggable').draggable({
snap: {
diff --git a/public/style/main.css b/public/style/main.css
index 410ea32..887a580 100755
--- a/public/style/main.css
+++ b/public/style/main.css
@@ -203,6 +203,11 @@ mark {
background-color: grey;
float: left;
}
+#textfield{
+ height: 100%;
+ width: 100%;
+ font-size: 30px;
+}
.wrapper{
height: 100%;
width: 100%;
diff --git a/server.js b/server.js
index b189d7b..f0cdae6 100755
--- a/server.js
+++ b/server.js
@@ -123,9 +123,41 @@ io.on('connection', function(socket) {
robot.keyTap('backspace');
}
else{
- robot.typeString(str)
+ robot.typeString(str);
}
});
+
+ socket.on('functionality', function(type) {
+ console.log(type);
+ switch (type) {
+ case 'backspace':
+ robot.keyTap('backspace');
+ break;
+ case 'enter':
+ robot.keyTap('enter');
+ break;
+ case 'ArrowUp':
+ robot.keyTap('up');
+ break;
+ case 'ArrowDown':
+ robot.keyTap('down');
+ break;
+ case 'ArrowLeft':
+ robot.keyTap('left');
+ break;
+ case 'ArrowRight':
+ robot.keyTap('right');
+ break;
+ }
+ });
+
+ socket.on('text', function(text) {
+ console.log('Typing ' + text);
+ if (text === ' ') {
+ robot.keyTap('space');
+ }
+ robot.typeString(text);
+ });
socket.on('saveKey', function(key) {
var file = fs.readFileSync("configuration.json")
--
GitLab