majtymit/index.html

## index.html
<html>
    <head>
        <script src="javascripts/faye-browser-min.js"></script>
        <script src="javascripts/private_pub.js"></script>
        <script src="javascripts/sha1.js"></script>
        <script src="javascripts/jquery-2.1.4.min.js"></script>
    </head>
     <body>
        <script>
	    // change server_ip to the public IP of counter
	    server_ip = "http://192.168.1.3"

            // structure of action log jsons
            //[{"date":"12.10.2015","time":"15:48","branch":"Topolcany TopGame","station":"Kajot","digits":"0799","prize":"500","is_on_current_branch":true},
            // {"date":"13.10.2015","time":"13:24","branch":"Topolcany TopGame","station":"Synot","digits":"6491","prize":"30","is_on_current_branch":true}]

            // is_on_current_branch: describes if lot happens on current branch or on some other branch in city.
            // if true then run lotting animation otherwise just add to items

	    // it is possible to price be 0, in that case it is considered as Ticket - "Žreb"


            // this section is for screen initialization
            $(document).ready(function(){

                // ajax call is made to get last x action logs, which should be displayed
                // possible parameters:
                //  - count: how many action logs are returned. If not specified than default is 3
                //  - order: how are these records ordered, allowed values are "newest_last" or "newest_first", if not specified than "newest_last"
                $.ajax({
                    url: server_ip + ':3000/external_monitor/get_last_lots',
                    data: {count: 3, order: "newest_last" },
                    dataType: 'jsonp',
                    success: function(json){
                        if (json != null){
                            $.each(json, function () {
                                // this action logs should be just displayed
				                // all of them have is_on_current_branch set to false

                                $(".items").first().append( "<div class='item'>Date:" + this.date + " " + this.time + " Branch:" + this.branch +
                                        " Station:" + this.station + " Digits:" + this.digits + " Price:" + this.prize + " On current branch?:"  + this.is_on_current_branch + "</div>" );
                            });

                        }
                    }
                });

                // ajax call is made to get the top ticket users, which should be displayed
                // possible parameters:
                //  - count: how many records are returned. If not specified then default is 3
                //  - order: how are these records ordered, allowed values are "desc" or "asc", if not specified than "desc"
                $.ajax({
                    url: server_ip + ':3000/external_monitor/get_top_ticket_users',
                    data: {count: 3, order: "desc" },
                    dataType: 'jsonp',
                    success: function(json){
                        if (json != null){
                            $.each(json, function () {
                                $(".ticket_winners").append("<div class='ticket_winner'>Nickname: " + this.nickname + " Count:" + this.count );
                            });

                        }
                    },
                });
            });

            // this section connect to faye server and subscribe to certain channel (technology websockets: http://faye.jcoglan.com/)
            // each external monitor is listening for new published messages on this channel

            // connecting to faye server on certain channels
            var server = server_ip + ":9292/faye";

            PrivatePub.sign({"server": server, "channel": "/external_monitor/action_logs"}); // don't change the channel!
            PrivatePub.sign({"server": server, "channel": "/external_monitor/top_ticket_winners"}); // don't change the channel!

            // !!!!!!! MAJOR CHANGE TO PREVIOUS VERSION !!!

            // REMOVE overide PrivatePub#handleResponse
            // Use these subscriptions below instead!
            // These will add custom js function that will handle pushed message to channels in a custom way since there are now two channels on one page

            PrivatePub.subscribe("/external_monitor/action_logs", function(message){

                if (message.action_logs != null){

                    var action_logs = JSON.parse(message.action_logs);

                    // there can be more than one action log published to the channel (for example several lots each on different branches in city)
                    // the action log publish to channel are order in "newest_last"
                    // so if several new action lots are returned first one is the oldest and last one the newest
                    // job that check new lots on server is run each 5 seconds

                    if (action_logs != null){
                        $.each(action_logs, function () {

                            // if new action logs are present do something with them based on is_on_current_branch variable
                            // if is_on_current_branch is true hide all items and run animation
                            // else just add them to items

                            $(".items").first().append( "<div class='item'>Date:" + this.date + " " + this.time + " Branch:" + this.branch +
                                            " Station:" + this.station + " Digits:" + this.digits + " Price:" + this.prize + " On current branch?:"  + this.is_on_current_branch + "</div>" );
                        });
                    }
                }
            });


            PrivatePub.subscribe("/external_monitor/top_ticket_winners", function(message){
                console.log(message);
                 if (message.top_ticket_winners != null){

                    var top_ticket_winners = JSON.parse(message.top_ticket_winners);

                    // there are always 3 records in this message
                    // the top ticket users are always pushed to channel in "desc" order so the user with the most tickets is first in hash
                    // time between two message is 60 seconds

                    // Format of json messages
                    // [{"nickname":"hracA","count":9},{"nickname":"hracB","count":2},{"nickname":"hracC","count":3}]


                    if (top_ticket_winners != null){

                        // Remove previous ticket users or hide them
                        $('div.ticket_winner').each(function(){
                            this.remove();
                        });

                        // add new
                        $.each(top_ticket_winners, function () {
                            $(".ticket_winners").first().append("<div class='ticket_winner'>Nickname: " + this.nickname + " Count:" + this.count);
                        });
                    }
                }
            });


        // in case of reboot or application restart first thing that is published to the channel during server initialization are 3 last action logs
        // these action lots have variable is_on_current_branch set to false

        // api for testing external_monitor (replace address with counter public ip address)
	    // url: http://<public_ip>:3000/external_monitor/add_test_action_log
        // this will not create action log in database it will only publish test data to channel "/external_monitor/action_logs"

	    // additional params:
            //  - date: if blank than current date
            //  - time: if blank than current time
            //  - branch: if blank than random from ["Senátor Topoľčany", "Topolcany TopGame", "Cézar", "Planet Šaľa"]
    	    //  - station: if blank than random from ["Kajot", "Synot", "Merkur", "Apollo", "Ruleta", "eGaming"]
     	    //  - digits: if blank than random 4-digits number
    	    //  - prize if blank than random number <= 100
            //  - is_on_current_branch: if blank than random from [true, false]
            //  - times: how many action logs will be created at once, if blank default is 1


 	    // Examples

	    // http://<public_ip>:3000/external_monitor/add_test_action_log?station="Kajot"&is_on_current_branch=true will created record with station "Kajot" which should be fire lotting animation

	    // http://<public_ip>:3000/external_monitor/add_test_action_log?is_on_current_branch=false will created record which should be added normally

            // http://<public_ip>:3000/external_monitor/add_test_action_log?times=5&price=50&branch="Cézar" will create 5 action logs, all with price 50 and branch "Cezar" and other attributes will be random
        </script>
        <h1>Zrebovania</h1>

        <!-- this section .items holds all items -->
	<!-- look at implementation of css and javascript at http://<public_id>:3000/external_monitor  -->

        <main class="content">
            <section class="items"</section>
        </main>
        <br/>
        <main>
            <section class="ticket_winners"</section>
        </main>
    </body>
</html>
	<html>
	<head>
	<script src="javascripts/faye-browser-min.js"></script>
	<script src="javascripts/private_pub.js"></script>
	<script src="javascripts/sha1.js"></script>
	<script src="javascripts/jquery-2.1.4.min.js"></script>
	</head>
	<body>
	<script>
	// change server_ip to the public IP of counter
	server_ip = "http://192.168.1.3"

	// structure of action log jsons
	//[{"date":"12.10.2015","time":"15:48","branch":"Topolcany TopGame","station":"Kajot","digits":"0799","prize":"500","is_on_current_branch":true},
	// {"date":"13.10.2015","time":"13:24","branch":"Topolcany TopGame","station":"Synot","digits":"6491","prize":"30","is_on_current_branch":true}]

	// is_on_current_branch: describes if lot happens on current branch or on some other branch in city.
	// if true then run lotting animation otherwise just add to items

	// it is possible to price be 0, in that case it is considered as Ticket - "Žreb"


	// this section is for screen initialization
	$(document).ready(function(){

	// ajax call is made to get last x action logs, which should be displayed
	// possible parameters:
	// - count: how many action logs are returned. If not specified than default is 3
	// - order: how are these records ordered, allowed values are "newest_last" or "newest_first", if not specified than "newest_last"
	$.ajax({
	url: server_ip + ':3000/external_monitor/get_last_lots',
	data: {count: 3, order: "newest_last" },
	dataType: 'jsonp',
	success: function(json){
	if (json != null){
	$.each(json, function () {
	// this action logs should be just displayed
	// all of them have is_on_current_branch set to false

	$(".items").first().append( "<div class='item'>Date:" + this.date + " " + this.time + " Branch:" + this.branch +
	" Station:" + this.station + " Digits:" + this.digits + " Price:" + this.prize + " On current branch?:" + this.is_on_current_branch + "</div>" );
	});

	}
	}
	});

	// ajax call is made to get the top ticket users, which should be displayed
	// possible parameters:
	// - count: how many records are returned. If not specified then default is 3
	// - order: how are these records ordered, allowed values are "desc" or "asc", if not specified than "desc"
	$.ajax({
	url: server_ip + ':3000/external_monitor/get_top_ticket_users',
	data: {count: 3, order: "desc" },
	dataType: 'jsonp',
	success: function(json){
	if (json != null){
	$.each(json, function () {
	$(".ticket_winners").append("<div class='ticket_winner'>Nickname: " + this.nickname + " Count:" + this.count );
	});

	}
	},
	});
	});

	// this section connect to faye server and subscribe to certain channel (technology websockets: http://faye.jcoglan.com/)
	// each external monitor is listening for new published messages on this channel

	// connecting to faye server on certain channels
	var server = server_ip + ":9292/faye";

	PrivatePub.sign({"server": server, "channel": "/external_monitor/action_logs"}); // don't change the channel!
	PrivatePub.sign({"server": server, "channel": "/external_monitor/top_ticket_winners"}); // don't change the channel!

	// !!!!!!! MAJOR CHANGE TO PREVIOUS VERSION !!!

	// REMOVE overide PrivatePub#handleResponse
	// Use these subscriptions below instead!
	// These will add custom js function that will handle pushed message to channels in a custom way since there are now two channels on one page

	PrivatePub.subscribe("/external_monitor/action_logs", function(message){

	if (message.action_logs != null){

	var action_logs = JSON.parse(message.action_logs);

	// there can be more than one action log published to the channel (for example several lots each on different branches in city)
	// the action log publish to channel are order in "newest_last"
	// so if several new action lots are returned first one is the oldest and last one the newest
	// job that check new lots on server is run each 5 seconds

	if (action_logs != null){
	$.each(action_logs, function () {

	// if new action logs are present do something with them based on is_on_current_branch variable
	// if is_on_current_branch is true hide all items and run animation
	// else just add them to items

	$(".items").first().append( "<div class='item'>Date:" + this.date + " " + this.time + " Branch:" + this.branch +
	" Station:" + this.station + " Digits:" + this.digits + " Price:" + this.prize + " On current branch?:" + this.is_on_current_branch + "</div>" );
	});
	}
	}
	});


	PrivatePub.subscribe("/external_monitor/top_ticket_winners", function(message){
	console.log(message);
	if (message.top_ticket_winners != null){

	var top_ticket_winners = JSON.parse(message.top_ticket_winners);

	// there are always 3 records in this message
	// the top ticket users are always pushed to channel in "desc" order so the user with the most tickets is first in hash
	// time between two message is 60 seconds

	// Format of json messages
	// [{"nickname":"hracA","count":9},{"nickname":"hracB","count":2},{"nickname":"hracC","count":3}]


	if (top_ticket_winners != null){

	// Remove previous ticket users or hide them
	$('div.ticket_winner').each(function(){
	this.remove();
	});

	// add new
	$.each(top_ticket_winners, function () {
	$(".ticket_winners").first().append("<div class='ticket_winner'>Nickname: " + this.nickname + " Count:" + this.count);
	});
	}
	}
	});



	// in case of reboot or application restart first thing that is published to the channel during server initialization are 3 last action logs
	// these action lots have variable is_on_current_branch set to false

	// api for testing external_monitor (replace address with counter public ip address)
	// url: http://<public_ip>:3000/external_monitor/add_test_action_log
	// this will not create action log in database it will only publish test data to channel "/external_monitor/action_logs"

	// additional params:
	// - date: if blank than current date
	// - time: if blank than current time
	// - branch: if blank than random from ["Senátor Topoľčany", "Topolcany TopGame", "Cézar", "Planet Šaľa"]
	// - station: if blank than random from ["Kajot", "Synot", "Merkur", "Apollo", "Ruleta", "eGaming"]
	// - digits: if blank than random 4-digits number
	// - prize if blank than random number <= 100
	// - is_on_current_branch: if blank than random from [true, false]
	// - times: how many action logs will be created at once, if blank default is 1


	// Examples

	// http://<public_ip>:3000/external_monitor/add_test_action_log?station="Kajot"&is_on_current_branch=true will created record with station "Kajot" which should be fire lotting animation

	// http://<public_ip>:3000/external_monitor/add_test_action_log?is_on_current_branch=false will created record which should be added normally

	// http://<public_ip>:3000/external_monitor/add_test_action_log?times=5&price=50&branch="Cézar" will create 5 action logs, all with price 50 and branch "Cezar" and other attributes will be random
	</script>
	<h1>Zrebovania</h1>

	<!-- this section .items holds all items -->
	<!-- look at implementation of css and javascript at http://<public_id>:3000/external_monitor -->

	<main class="content">
	<section class="items"</section>
	</main>
	<br/>
	<main>
	<section class="ticket_winners"</section>
	</main>
	</body>
	</html>