(function($){  
 $.fn.binaryClock = function() {  
    return this.each(function() {  
    	for(i=8;i>=1;i/=2){
    		if (i == 8) {
    			$(this).append("<div id=\"hour1-8\" class=\"nodot\">&nbsp;</div>\n");
    		} else if (i == 4) {
    			$(this).append("<div id=\"hour1-4\" class=\"nodot\">&nbsp;</div>\n");
    		} else {
    			$(this).append("<div id=\"hour1-" + i + "\" class=\"dot\">&nbsp;</div>\n");    				
    		}
			$(this).append("<div id=\"hour2-" + i + "\" class=\"dot\">&nbsp;</div>\n");
			if (i == 8) {
				$(this).append("<div id=\"mins1-8\" class=\"nodot\">&nbsp;</div>\n");
			} else {
				$(this).append("<div id=\"mins1-" + i + "\" class=\"dot\">&nbsp;</div>\n");	
			}
			$(this).append("<div id=\"mins2-" + i + "\" class=\"dot\">&nbsp;</div>\n");
			if (i == 8) {
				$(this).append("<div id=\"secs1-8\" class=\"nodot\">&nbsp;</div>\n");
			} else {
				$(this).append("<div id=\"secs1-" + i + "\" class=\"dot\">&nbsp;</div>\n");	
			}
			$(this).append("<div id=\"secs2-" + i + "\" class=\"dot\">&nbsp;</div>\n");
    	}
    	setInterval(updateClock, 1000);
    });
    function updateClock() {
		var currentTime = new Date();
		var hour1 = String(currentTime.getHours()).charAt(0);
		var hour2 = String(currentTime.getHours()).charAt(1);
		if (hour2 == "") {
			hour2 = hour1;
			hour1 = 0;
		}
		var mins1 = String(currentTime.getMinutes()).charAt(0);
		var mins2 = String(currentTime.getMinutes()).charAt(1);
		if (mins2 == "") {
			mins2 = mins1;
			mins1 = 0;
		}
		var secs1 = String(currentTime.getSeconds()).charAt(0);
		var secs2 = String(currentTime.getSeconds()).charAt(1);
		if (secs2 == "") {
			secs2 = secs1;
			secs1 = 0;
		}
		for (i = 2; i >= 1; i /= 2){
			if ((hour1 & i) == i){
				$("div#hour1-" + i).css("background", "url('res/bc-on.png') no-repeat center center");
			} else {
				$("div#hour1-" + i).css("background", "url('res/bc-off.png') no-repeat center center");
			}
		}
		for (i = 8; i >= 1; i /= 2){
			if ((hour2 & i) == i){
				$("div#hour2-" + i).css("background", "url('res/bc-on.png') no-repeat center center");
			} else {
				$("div#hour2-" + i).css("background", "url('res/bc-off.png') no-repeat center center");
			}
		}
		for (i = 4; i >= 1; i /= 2){
			if ((mins1 & i) == i){
				$("div#mins1-" + i).css("background", "url('res/bc-on.png') no-repeat center center");
			} else {
				$("div#mins1-" + i).css("background", "url('res/bc-off.png') no-repeat center center");
			}
		}
		for (i = 8; i >= 1; i /= 2){
			if ((mins2 & i) == i){
				$("div#mins2-" + i).css("background", "url('res/bc-on.png') no-repeat center center");
			} else {
				$("div#mins2-" + i).css("background", "url('res/bc-off.png') no-repeat center center");
			}
		}
		for (i = 4; i >= 1; i /= 2){
			if ((secs1 & i) == i){
				$("div#secs1-" + i).css("background", "url('res/bc-on.png') no-repeat center center");
			} else {
				$("div#secs1-" + i).css("background", "url('res/bc-off.png') no-repeat center center");
			}
		}
		for (i = 8; i >= 1; i /= 2){
			if ((secs2 & i) == i){
				$("div#secs2-" + i).css("background", "url('res/bc-on.png') no-repeat center center");
			} else {
				$("div#secs2-" + i).css("background", "url('res/bc-off.png') no-repeat center center");
			}
		}
	}
	
    
    
 };  
})(jQuery);