mouseover on clicks will show client data
[realtime-mouse-tracking.git] / src / js / c.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
var host = "http://node.dev.webstyler.ro/";
 
/*function loadJs(i,s,o,g,c){
    a=s.createElement(o);m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m);
    a.onload=function(){
        c();
    }
}
loadJs(window,document,'script',host + 'socket.io-client/socket.io.js', function(){NRTT()});*/
 
function NRTT() {
    var connected = false;
 
    var mouseAction = {enabled: true, interval:500};
    var clickAction = {enabled : true};
 
    var viewportwidth;
    var viewportheight;
 
    // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
 
    if (typeof window.innerWidth != 'undefined')
    {
      viewportwidth = window.innerWidth,
      viewportheight = window.innerHeight
    }
 
    // IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
 
    else if (typeof document.documentElement != 'undefined'
     && typeof document.documentElement.clientWidth !=
     'undefined' && document.documentElement.clientWidth != 0)
    {
       viewportwidth = document.documentElement.clientWidth,
       viewportheight = document.documentElement.clientHeight
    }
 
    // older versions of IE
 
    else
    {
       viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
       viewportheight = document.getElementsByTagName('body')[0].clientHeight
    }
 
    var cursorX, cursorY;
    document.onmousemove = function(e){
        cursorX = e.pageX;
        cursorY = e.pageY;
    }
    document.onclick = function(e){
        if (connected && clickAction.enabled) {
            var x = - viewportwidth/2 + e.pageX;
            cSocket.emit('t:click', {x:x, y:e.pageY});
        }
    }
    var cSocket = io(host);
    var color = null;
    if(typeof(Storage) !== "undefined") {
        color = localStorage.getItem('tcolor');
    }
    cSocket.emit('t:connect', {w:viewportwidth, h:viewportheight, color:color});
    cSocket.on('t:connected', function(msg){
        connected = true;
        if(typeof(Storage) !== "undefined") {
            if (msg.color) {
                localStorage.setItem("tcolor", msg.color);
            }
        }
    });
    cSocket.on('disconnect', function(){
        connected = false;
    });
    cSocket.on('t:changemm', function(msg){
        mouseAction = msg;
    });
 
    cSocket.on('t:changec', function(msg){
        clickAction = msg;
    });
 
    setInterval(function(){
        if (connected && mouseAction.enabled) {
            var x = - viewportwidth/2 + cursorX;
            cSocket.emit('t:mousemove', {x:x, y:cursorY});
        }
    }, mouseAction.interval);
}
NRTT();
comments