add remote inject input ui changes

components/mobile-plugins/android-plugin/org.wso2.carbon.device.mgt.mobile.android.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.android.device-view/public/js/remote-session.js

@@ -15,12 +15,11 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-
 var rs_websocket;
 var rs_WebSocketURL;
 var shellMessageField = document.getElementById('shell-command');
 var shellResponseField = document.getElementById('shell-response');
-
+var canRemotelyControl = true;
 WebSocket.prototype.set_opened = function() {
     this._opened = true;
 };
@@ -37,6 +36,7 @@ var remoteSessionWebSocketOnOpen = function () {
 };
 
 var remoteSessionWebSocketOnMessage = function(message) {
+
     $('#lbl-remote-session-status').text('Server Connected...');
     $('#remote-session-operations').removeClass('hidden');
     $('#loading-remote-session').addClass('hidden');
@@ -84,33 +84,19 @@ var remoteSessionWebSocketOnMessage = function (message) {
                 var shellResponse = $("#shell-response");
                 shellResponse.val(json.operationResponse);
             }
+        } else if (json.code == "REMOTE_INPUT") {
+            canRemotelyControl = false;
         } else {
-    console.log("Message type not supported.");
+            console.log("Message type not supported." + JSON.stringify(json));
         }
     }
 };
 
 var remoteSessionWebSocketOnClose = function(e) {
-    $('#btn-connect-device').removeClass('hidden');
-    $('#remote-session-operations').addClass('hidden');
-    $('#btn-close-remote-session').addClass('hidden');
-    $('#loading-screen').addClass('hidden');
-    $('#btn-stop-screen').addClass('hidden');
-    $('#btn-start-screen').removeClass('hidden');
-    if (rs_websocket.get_opened()) {
-        noty({text: 'Connection lost with Remote Session server!!', type: 'error'});
-    }
     location.reload();
-
 };
 
 var remoteSessionWebSocketOnError = function(err) {
-    //if (!rs_websocket.get_opened()) return;
-    $('#btn-connect-device').removeClass('hidden');
-    $('#remote-session-operations').addClass('hidden');
-    $('#btn-close-remote-session').addClass('hidden');
-    noty({text: 'Something went wrong when trying to connect to <b>' + rs_WebSocketURL + '<b/>', type: 'error'});
-    rs_websocket.close();
     location.reload();
 };
 
@@ -127,13 +113,16 @@ $("#btn-close-remote-session").click(function() {
     // Close the WebSocket.
     rs_websocket.close();
     rs_websocket.set_closed();
+    var canvas = document.getElementById("canvas");
+    var ctx = canvas.getContext('2d');
+    ctx.clearRect(0, 0, canvas.width, canvas.height);
     $('#btn-connect-device').removeClass('hidden');
     $('#remote-session-operations').addClass('hidden');
     $('#btn-close-remote-session').addClass('hidden');
     $('#loading-screen').addClass('hidden');
     $('#btn-stop-screen').addClass('hidden');
     $('#btn-start-screen').removeClass('hidden');
-    location.reload();
+    //location.reload();
 });
 
 $("#btn-refresh-logCat").click(function() {
@@ -173,7 +162,10 @@ function initializeRemoteSession() {
         $('#lbl-remote-session-status').text('Waiting on device to connect...');
 
     } else {
-        noty({text: 'Remote Session endpoint connection Failed!', type: 'error'});
+        noty({
+            text: 'Remote Session endpoint connection Failed!',
+            type: 'error'
+        });
         $('#btn-connect-device').removeClass('hidden');
         $('#loading-remote-session').addClass('hidden');
     }
@@ -200,14 +192,18 @@ $("#shell-command").keyup(function(event){
 
 $("#btn-start-screen").click(function() {
 
-
+    canRemotelyControl = true;
     $('#loading-screen').removeClass('hidden');
     $('#btn-start-screen').addClass('hidden');
     $('#remote-control-pannel').removeClass('hidden');
     $('#btn-stop-screen').removeClass('hidden');
     var message = new Object();
+    var input = new Object();
+    input.action = "start";
+    input.height = 768;
+    input.width = 1024;
     message.code = "REMOTE_SCREEN";
-   message.payload  =  "start";
+    message.payload = JSON.stringify(input);
     // Send the message through the WebSocket.
     rs_websocket.send(JSON.stringify(message));
 });
@@ -215,6 +211,7 @@ $("#btn-start-screen").click(function() {
 
 $("#btn-stop-screen").click(function() {
 
+    canRemotelyControl = false;
     var canvas = document.getElementById("canvas");
     var ctx = canvas.getContext('2d');
     ctx.clearRect(0, 0, canvas.width, canvas.height);
@@ -222,40 +219,80 @@ $("#btn-stop-screen").click(function() {
     $('#remote-control-pannel').addClass('hidden');
     $('#btn-stop-screen').addClass('hidden');
     $('#btn-start-screen').removeClass('hidden');
-	context.clearRect(0, 0, canvas.width, canvas.height);
     var message = new Object();
+    var input = new Object();
+    input.action = "stop";
     message.code = "REMOTE_SCREEN";
-   message.payload  =  "stop";
+    message.payload = JSON.stringify(input);
     // Send the message through the WebSocket.
     rs_websocket.send(JSON.stringify(message));
 });
 
 
 $(function() {
+    var lastDuration = 0;
+    var minDuration = 50;
+    var durationDiff = 0;
+    var status = "ready";
+    var bounds, x, y;
     //Enable swiping...
     $("#canvas").swipe({
-        //Generic swipe handler for all directions
+        swipeStatus: function(event, phase, direction, distance, duration, fingers, fingerData, currentDirection) {
-        swipe: function(event, direction, distance, duration, fingerCount, fingerData) {
+
-             switch (direction) {
+            if (canRemotelyControl) {
-                case "right":
+                bounds = event.target.getBoundingClientRect();
-                    $("#canvas")[0].getContext('2d').fillText("You swiped x:" + event.pageX + " y: " + event.pageY + " RIGHT", 10, 90)
+                x = event.clientX - bounds.left;
-                    break;
+                y = event.clientY - bounds.top;
-                case "left":
+                durationDiff = duration - lastDuration;
-                    $("#canvas")[0].getContext('2d').fillText("You swiped x:" + event.pageX + " y: " + event.pageY + " LEFT", 10, 90)
+                if (x < 0 || y < 0 || status == "blocked") {
-                    break;
+                    return;
-                case "up":
+                }
-                    $("#canvas")[0].getContext('2d').fillText("You swiped x:" + event.pageX + " y: " + event.pageY + " UP", 10, 90)
+                var inputMessage = new Object();
-                    break;
+                var input = new Object();
-                case "down":
+                input.x = x / bounds.width;
-                    $("#canvas")[0].getContext('2d').fillText("You swiped x:" + event.pageX + " y: " + event.pageY + " DOWN", 10, 90)
+                input.y = y / bounds.height;
-                    break;
+                input.duration = durationDiff;
-                default:
+                inputMessage.code = "REMOTE_INPUT";
-                    $("#canvas")[0].getContext('2d').fillText("You swiped x:" + event.pageX + " y: " + event.pageY, 10, 90)
+
-                    break;
+                if (status == "ready" && phase == "start") {
+                    input.action = "down";
+                    inputMessage.payload = JSON.stringify(input);
+                    rs_websocket.send(JSON.stringify(inputMessage));
+                    status = "unblocked";
+                } else if (status == "unblocked") {
+                    if (phase == "move") {
+                        if (durationDiff < minDuration) {
+                            return;
+                        } else {
+                            input.action = "move";
+                            inputMessage.payload = JSON.stringify(input);
+                            rs_websocket.send(JSON.stringify(inputMessage));
+                            lastDuration = duration;
+                        }
+                    } else {
+                        input.action = "up";
+                        lastDuration = 0;
+                        status = "blocked";
+                        if (durationDiff < minDuration) {
+                            setTimeout(function() {
+                                inputMessage.payload = JSON.stringify(input);
+                                rs_websocket.send(JSON.stringify(inputMessage));
+                                status = "ready";
+                            }, minDuration);
+                        } else {
+                            inputMessage.payload = JSON.stringify(input);
+                            rs_websocket.send(JSON.stringify(inputMessage));
+                            status = "ready";
+                        }
                     }
-        },
 
-        //Default is 75px, set to 0 for demo so any distance triggers swipe
+                }
-        threshold: 0
+
-    });
+            }
+
+        },
+        threshold: 200,
+        maxTimeThreshold: 5000,
+        fingers: 'all'
     });
+});;