diff --git a/public/client.html b/public/client.html index 51f8e1e4a9be8ae23a29296e9a3a54418b4b3d3b..27835cdffcbe5e455f5959eb5c0bb87497feb08c 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 be9e02b7b89c2536dce254517bc9acdac44dfb03..4c6d4a13cc609abe8129265f1f61e227f1a04769 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 410ea324dc9642f3eb1dcd54bd93116970f737e7..887a5807966b7eec0f01a3a00d1b2e90badafe65 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 b189d7b3f0b6bd17f40de3a017238f88612f3306..f0cdae6ccb0a555ea3ad2031e9c27c744a9474e4 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")