Score Flashing

// ==UserScript==
// @name Score Flashing
// @include http://*.koalabeast.com:*
// @include http://*.jukejuice.com:*
// @version 0.1
// ==/UserScript==


var redScore = 0,
	blueScore = 0,
	firstRun = 1,
	FlashDuration = 150;


// add div overlay element to webpage
var overlay = '<div class="overlay"></div>'
$('body').find('#sound').after(overlay);

// set up CSS for blue red and transparent overlays
var transparentOverlay = {
	height:"100%",
	width:"100%",
	position:"fixed",
	left:0,
	top:0,
	background:"rgba(0,0,0,0)"
}

var blueOverlay = {
	height:"100%",
	width:"100%",
	position:"fixed",
	left:0,
	top:0,
	background:"rgba(0,0,200,0.5)"
}

var redOverlay = {
	height:"100%",
	width:"100%",
	position:"fixed",
	left:0,
	top:0,
	background:"rgba(200,0,0,0.5)"
}

tagpro.socket.on("score", function(message) {

    console.log(message)
    if (firstRun) {
        redScore = message['r']
        blueScore = message['b']
        firstRun = 0

    } else {
        if (!(redScore == message['r'])) {
            flashColor('r')
            redScore = message['r']
        } else if (!(blueScore == message['b'])){
            flashColor('b')
            blueScore = message['b']
        }
    }
});


// change overlay to either blue or red depending on who scored
function flashColor(c) {

    if (c == 'r') {
        css = redOverlay
    } else {
    	css = blueOverlay
    }
    $('.overlay').css(css)

    setTimeout(function(){flashOff()}, FlashDuration);
}

// revert overlay to transparent
function flashOff() {
	$('.overlay').css(transparentOverlay)
}