GazeTK

/*

 * Copyright 2015 Thies Pfeiffer and Dimitri Heil

 * Blinker is distributed under the terms of the GNU General Public License

 * 

 * This file is part of Blinker.

 * 

 * Blinker is free software: you can redistribute it and/or modify

 * it under the terms of the GNU General Public License as published by

 * the Free Software Foundation, either version 3 of the License, or

 * (at your option) any later version.

 * 

 * Blinker is distributed in the hope that it will be useful,

 * but WITHOUT ANY WARRANTY; without even the implied warranty of

 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the

 * GNU General Public License for more details.

 * 

 * You should have received a copy of the GNU General Public License

 * along with Blinker. If not, see <http://www.gnu.org/licenses/>.

 */

window.onerror = function myErrorHandler(errorMsg, url, lineNumber) {

  console.log("error at line"+lineNumber);

  return true;

}

$("body").prepend("<div id='cross'>X</div>");

$("body").prepend("<div id='whiteout'></div>");

$("body").prepend("<div id='status'></div>");

$("body").prepend("<div id='gazeeventdiv'>X:"+(window.outerHeight - window.innerHeight)+"_"+window.screenX+"_Y:"+window.screenY+"</div>");

//$("body").prepend("<div id='calibrationImageDiv'><img src='" + self.options.pngUrl + "' /></div>");

var firstMessageReceived = false;

var cross = document.getElementById("cross");

var calibrationTimer = "null";

var calibrationRunning = false;

var eyeTrackerIsCalibrated = "notSet";

var pushMode = "notSet";

//cross.style.position = "absolute";

cross.style.zIndex = "16777271";

//cross.style.zIndex = "0";

/*var onGazeOver = document.createEventObject();

onGazeOver.eventType = "ongazeover";

var onGazeOut = document.createEventObject();

onGazeOut.eventType = "ongazeout";*/

$( "#gazeeventdiv" ).css("position","absolute");

$( "#gazeeventdiv" ).css("left","300px");

$( "#gazeeventdiv" ).css("top","300px");

$( "#gazeeventdiv" ).css("height","200px");

$( "#gazeeventdiv" ).css("width","200px");

$( "#gazeeventdiv" ).css("zIndex",100000);

$( "#gazeeventdiv" ).css("backgroundColor","green");

$( "#whiteout" ).css("backgroundColor","#FFFFFF");

$( "#whiteout" ).css("width","100%");

$( "#whiteout" ).css("height","100%");

$( "#whiteout" ).css("zIndex",16777270);

$( "#whiteout" ).css("visibility","hidden");

$( "#whiteout" ).css("position","fixed");

$( "#whiteout" ).css("left","0px");

$( "#whiteout" ).css("top","0px");

var yOffsetOfWindow = window.outerHeight - window.innerHeight;

var xOffsetOfWindow = window.outerWidth - window.innerWidth;

var gazeOver = new Event('gazeOver');

var gazeOut = new Event('gazeOut');

var multiplier = 1;

var ged = document.getElementById("gazeeventdiv");

ged.addEventListener('gazeOver', function(e){

        ged.style.backgroundColor = "yellow";

//window.fullScreen = false;

}, false);

ged.addEventListener('gazeOut',  function(e){

        ged.style.backgroundColor = "red";

        //startCalibration();

        //console.log("WIDTH:"+window.innerWidth+"|HEIGHT:"+window.innerHeight);

        //window.fullScreen = true;

        //var calib_1_x = (32 + xOffsetOfWindow + window.screenX - window.pageXOffset) * multiplier; 

        //var calib_1_y = (32 + yOffsetOfWindow + window.screenY - window.pageYOffset) * multiplier; 

        //console.log("calibration point Y: "+calib_1_y);

        //sendMessageToTracker("hi trackerdoodle.");

}, false);

var gazeInformation = {

                        "x":0,

                        "y":0,

                        "previousX":0,

                        "previousY":0,

                        "isFixation":false,

                        "currentElementBelow":null,

                        "lastElementBelow":null,

                        };

self.port.on("calibrationImage", function(imgurl){

$("body").prepend("<img id='calibrationImage' src='" + imgurl + "' />");

$( "#calibrationImage" ).css("position","absolute");

$( "#calibrationImage" ).css("zIndex",16777271);

  /*var img = document.createElement("img");

  img.src = imgurl;

  document.body.appendChild(img);*/

});

self.port.on("Multiplier", function(message) {        

        try {

                multiplier = parseFloat(message);

        } catch (e){

                console.log("Multiplier could not be read - will be set to 1");

                multiplier = "1";

        }

        console.log("Mult is: "+multiplier);

});

self.port.on("initializeEyeTracker", function(message){

        initializeEyeTracker();

});

var recalibrationArray = new Array();

var recalibrationCounter = 1;

var calibrationPointNumber = 1;

self.port.on("eyeTrackerData", function(message) {

        var messages; 

        //split messages if they are packed into one

        if (message.search(/}\n{/) > -1){

                messages = message.split(/\n/);

                for (var v = 0;v < messages.length; v++){

                        //only parse messages when the string is longer then 5

                        if (messages[v].length > 5){

                                parseMessage(messages[v]);

                        }

                }

        } else {

                parseMessage(message);

        }

});

function parseMessage(message){

try {

    eyeTrackingData = JSON.parse(message);

        if (eyeTrackingData.category == "tracker"){        

                //console.log("is tracker");

                if (eyeTrackingData.hasOwnProperty("values")){

                        if (eyeTrackerIsCalibrated != "true"){

                                if ((eyeTrackingData.values.iscalibrated == false)) {

                                        console.log("eyetracker is not calibrated");

                                        eyeTrackerIsCalibrated = false;        

                                        if ((!calibrationRunning)&&(!eyeTrackerIsCalibrated)){

                                                startCalibration();

                                        }                                

                                }

                        }

                        if (calibrationRunning){

                if (eyeTrackingData.values.hasOwnProperty("frame")){

                        if ((eyeTrackingData.values.frame.lefteye.psize == 0)||(eyeTrackingData.values.frame.righteye.psize == 0)){

                                        $( "#calibrationImage" ).css("visibility","hidden");

                                        window.clearTimeout(calibrationTimer);

                                        startCalibrationPointTimer();

                                } else {

                                        $( "#calibrationImage" ).css("visibility","visible");

                                }

                        }

                }

                }

        if (eyeTrackerIsCalibrated){

        avg = eyeTrackingData.values.frame.avg;

        raw = eyeTrackingData.values.frame.raw;

        //console.log("AVG"+avg.x);

        //console.log("RAW"+raw.x);

        var x = avg.x;

        var y = avg.y;

        //var position = avg.x+"_"+avg.y;

        var xOffset = parseFloat(parseFloat(x)/multiplier) + parseFloat(window.pageXOffset) - parseFloat(window.screenX) - parseFloat(xOffsetOfWindow);

        var yOffset = parseFloat(parseFloat(y)/multiplier) + parseFloat(window.pageYOffset) - parseFloat(window.screenY) - parseFloat(yOffsetOfWindow);            

        gazePosition(xOffset,yOffset);        

        }

        } else if (eyeTrackingData.category == "calibration"){

                console.log(message);

                if ((eyeTrackingData.request == "start") && (eyeTrackingData.statuscode == 200)){

                                calibrationPointNumber = 0;

                                sendCalibrationPoint(calibrationPointNumber);

                                calibrationPointNumber++;

                }

                if ((eyeTrackingData.request == "pointstart") && (eyeTrackingData.statuscode == 200)){

                                startCalibrationPointTimer();

                }

                if ((eyeTrackingData.request == "pointend") && (eyeTrackingData.statuscode == 200)){

                        console.log("got pointend response 200");

                        console.log("calibrationPointCounter: "+calibrationPointNumber);

                                if ((calibrationPointNumber == 9)&&(eyeTrackingData.hasOwnProperty('values'))){

                                        //calibrationRunning = false;

                                        var calibPoints = eyeTrackingData.values.calibresult.calibpoints;

                                        for (var c = 0; c<9;c++){

                                                console.log("Point "+ c +" state : "+calibPoints[c].state);

                                                if (calibPoints[c].state != "2"){

                                                        console.log("calib point "+c+" was bad putting into recalibrationArray.");

                                                        recalibrationArray.push(c);                        

                                                        //recalibrationCounter++;

                                                        //sendCalibrationPoint(c);

                                                        //startCalibrationPointTimer();

                                                }

                                        }                                        

                                        console.log("result is: "+eyeTrackingData.values.calibresult.result);

                                        if (eyeTrackingData.values.calibresult.result == false){

                                                console.log("bad_data restarting calibration");

                                                console.log(recalibrationArray.length+" points have to be recalibrated ");

                                                for (var r=0;r<recalibrationArray.length;r++){

                                                        console.log("sending Point for recalibration: "+recalibrationArray[r]);

                                                        sendCalibrationPoint(recalibrationArray[r]);

                                                        recalibrationArray.splice(r,1);

                                                        //console.log(recalibrationArray[r].x +"|" +recalibrationArray[r].y);

                                                }

                                        } else {

                                                console.log("Eyetracker was successfully calibrated");

                                        }

                                } else if (calibrationPointNumber < 9){                                

                                sendCalibrationPoint(calibrationPointNumber);

                                calibrationPointNumber++;

                                //startCalibrationPointTimer();

                                }

                }

        }

        }catch(e){

                console.log("error at line:"+e.lineNumber);

        console.log("error:"+e);

                console.log("error at message:"+message);

    }

}

function sendMessageToTracker(message){

self.port.emit("sendToTracker",message);

}

function initializeEyeTracker(){

        sendMessageToTracker('{"category": "tracker","request": "get","values": ["push", "iscalibrated" ]}');

        sendMessageToTracker('{"category": "tracker","request": "set","values": {"push": true,"version": 1}}');

}

function gazePosition(x,y){

        gazeInformation.previousX = gazeInformation.x;

        gazeInformation.previousY = gazeInformation.y;

        gazeInformation.x = x;

        gazeInformation.y = y;

    cross.style.left = x+"px";

    cross.style.top  = y+"px";

        document.getElementById("status").innerHTML = x +"|"+y;

        var elementBelow = document.elementFromPoint(x,y);

        if (elementBelow != null){

                //console.log("elementBelow is: "+ elementBelow.id);

                if (gazeInformation.lastElementBelow != null){

                //console.log("lastElementBelow is: "+ gazeInformation.lastElementBelow.id);

                }

                if (gazeInformation.lastElementBelow != elementBelow){

                        gazeInformation.lastElementBelow = gazeInformation.elementBelow;

                        if (gazeInformation.lastElementBelow != null){                        

                                var gazeLastElem = gazeInformation.lastElementBelow;

                                //gazeLastElem

                                if (document.getElementById(gazeLastElem.id) != null){

                                        document.getElementById(gazeLastElem.id).dispatchEvent(gazeOut);

                                }

                                //$(gazeLastElem).trigger('gazeOut');

                        }

                                gazeInformation.elementBelow = elementBelow;                                        

                                var gazeElemCurrent = gazeInformation.elementBelow;

                                if (document.getElementById(gazeElemCurrent.id) != null){

                                        document.getElementById(gazeElemCurrent.id).dispatchEvent(gazeOver);

                                }

                } 

        }

}

function startCalibration(){

        endRunningCalibration();

        calibrationRunning = true;

        $( "#whiteout" ).css("visibility","visible");

        console.log("startCalibration");

        sendCalibrationRequest(9);

}

function endRunningCalibration(){

        sendMessageToTracker('{"category": "calibration","request" : "abort"}');

}

//CALIBRATIONS

var calibrationArray = new Array();

//32 is half of calibrationImage

calibrationArray[0] = {x:32,y:32} //topleft

calibrationArray[1] = {x:32,y:window.outerHeight/2} //midleft

calibrationArray[2] = {x:32,y:window.outerHeight-32} //bottomleft

calibrationArray[3] = {x:window.outerWidth/2,y:32} //midtop

calibrationArray[4] = {x:window.outerWidth/2,y:window.outerHeight/2} //center

calibrationArray[5] = {x:window.outerWidth/2,y:window.outerHeight-32} //midbottom

calibrationArray[6] = {x:window.outerWidth-32,y:32} //topright

calibrationArray[7] = {x:window.outerWidth-32,y:window.outerHeight/2} //midright

calibrationArray[8] = {x:window.outerWidth-32,y:window.outerHeight-32} //bottomright

var calibrationStartSuccessful = false;

//socket: the socket to send the calibration request to

//points: number of calibration points

function sendCalibrationRequest(points){

        console.log("send calibration request to tracker");

        sendMessageToTracker("{\"category\":\"calibration\",\"request\":\"start\",\"values\":{\"pointcount\": "+points+"}}");

}

//pointX/Y: the calibrationpoint coordinates

function sendCalibrationPoint(number){

$( "#calibrationImage" ).css("left",(calibrationArray[number].x - 32)+"px");

$( "#calibrationImage" ).css("top", (calibrationArray[number].y - 32)+"px");

        console.log("Sending Calibration Point: "+number+" -- "+calibrationArray[number].x+"|"+calibrationArray[number].y);

        console.log("message:" + "{'category':'calibration','request':'pointstart','values':{'x': "+calibrationArray[number].x+",'y':"+calibrationArray[number].y+"}}");

        sendMessageToTracker("{\"category\":\"calibration\",\"request\":\"pointstart\",\"values\":{\"x\": "+calibrationArray[number].x+",\"y\":"+calibrationArray[number].y+"}}");

        //startCalibrationPointTimer();

        //socket.write("{'category':'calibration','request':'pointstart','values':{'x': "+pointX+",'y':"+pointY+"}}");

}

function sendCalibrationPointend(){

        console.log("Sending Calibration Pointend.");

        sendMessageToTracker("{\"category\":\"calibration\",\"request\":\"pointend\"}");

}

function startCalibrationPointTimer(){

        console.log("Started PointCounter.");

        calibrationTimer = setTimeout(function() { sendCalibrationPointend(); }, 1000);

}