//Pre loads the audio files
const hooterSound = new Audio('/racetime/static/sounds/hooter.mp3');
const tenSecBeeper = new Audio('/racetime/static/sounds/9beeps9seconds.mp3');
hooterSound.load();
tenSecBeeper.load();

// reset the tool
function reset(){
	if (confirm("This will clear all entries and close your session.\nIt cannot be un-done.")) {
		window.location.reload(true);
	  } else {
		return false
	  }  
}
//Submit the form to users.
function processForm(){
	if (document.getElementById("raceNameInput").value == "") {return};
	if (document.getElementById("ood").value == "") {return};
	if (document.getElementById("crew1").value == "") {return};
	
	if (navigator.onLine == true){};
	var xhr = new XMLHttpRequest();
	var url = '/racetime';
	xhr.open("POST", url, true);
	xhr.setRequestHeader("Content-Type", "application/JSON");
	xhr.onerror = function(){
		console.log("error");
		alert("Your results were not transmitted. \n\
Please check your internet connection and try again.\n\n\
If this problem persists please save them manually using the \"Download results as CSV file\" button.");
		return false;
	}
	xhr.onreadystatechange = function () {
		if (this.readyState == 4 && this.status == 200) {
			alert("Your results were sent successfully.");
			return true;
		}
	};
	
	var inputs = document.getElementsByTagName("input");
	var notes = document.getElementById("OodNotesTextArea").value;

	var payload = [{}];
	for(i=0;i<inputs.length;i++){
		payload.push({label: inputs[i].name, url: inputs[i].value});		
	};
	payload.push({label: "0,OOD Notes", url: notes});			
	xhr.send(JSON.stringify(payload));

};

function makeJson(form){
	const formData = new FormData(form);
	const data = {};
	formData.forEach((value, key) => (data[key] = value));
	console.log(data);
	return data;
};
// make the CSV file locally
function makeCSV(){
	var csv = [];
	var csvFile;
    var downloadLink;
	var startTime = document.getElementById("raceStartTime").value;
	var raceName = document.getElementById("raceNameInput").value;
	var notes = document.getElementById("OodNotesTextArea").value;
	var OOD = document.getElementById("ood").value;
	var Crew1 = document.getElementById("crew1").value;
	var Crew2 = document.getElementById("crew2").value;

	csv.push(["Race Name",raceName,"","","",""+"\r\n"]);
	csv.push(["OOD",OOD,"","","",""+"\r\n"]);
	csv.push(["Crew 1",Crew1,"","","",""+"\r\n"]);
	csv.push(["Crew 2",Crew2,"","","",""+"\r\n"]);
	csv.push(["Race Satrted at",startTime,"","","",""+"\r\n"]);
	csv.push(["Division","Boat Class","Yardstick","Sail Number","Helm Name","finish Time","elapsed Time","Corrected Time"+"\r\n"]);

	var entries = document.getElementsByTagName("tr");
	for(a=1;a<entries.length;a++){
		csv.push([
		document.getElementById("Division"+a).value,
		document.getElementById("BoatClass"+a).value,
		document.getElementById("yardStick"+a).value,
		document.getElementById("SailNumber"+a).value,
		document.getElementById("HelmName"+a).value,
		document.getElementById("finishTime"+a).value,
		document.getElementById("elapsedTime"+a).value,
		document.getElementById("correctedTime"+a).value+"\r\n"
		]);
	};
	csv.push(["Notes",notes,"","","",""+"\r\n"]);

	var name = document.getElementById("raceNameInput").value;
	if(name == ''){name = "race"}
	var filename = name + ".csv";
   
    //define the file type to text/csv
    csvFile = new Blob([csv], {type: 'text/csv'});
    downloadLink = document.createElement("a");
    downloadLink.download = filename;
    downloadLink.href = window.URL.createObjectURL(csvFile);
    downloadLink.style.display = "block";
	// document.body.appendChild(downloadLink);
    document.getElementById("resultDownLoadLink").innerHTML = downloadLink;
    downloadLink.click();
	rank();
};


//Toggle the steps in buttons
function toggleSteps(){
	var b = document.getElementById('stepToggleButton');
	var el = document.getElementsByClassName('instruction');
	console.log(b.innerHTML)
	if(b.innerHTML == "Show Steps"){
		toggleDiv("instruction",true);
		b.innerHTML = "Hide Steps";
	} else {
		toggleDiv("instruction",false);
		b.innerHTML = "Show Steps";
	};
};

//Toggle the instructions
toggleDiv("instruction",false);
function ToggleInstructions(){
	var t = document.getElementById('instructions');
	if (t.style.display == 'none') {
		document.getElementById('instructions').setAttribute('style', 'display: block');
		document.getElementById('instructionToggleButton').innerHTML = "Hide Instructions";
		toggleDiv("instruction",true);

	} else {
		document.getElementById('instructions').setAttribute('style', 'display: none');
		document.getElementById('instructionToggleButton').innerHTML = "Show Instructions";
		document.getElementById('stepToggleButton').innerHTML = "Hide Steps";
	};
}

//get the start type
function getRadioValue(){
	var x = document.getElementsByName('sequenceTime');
	for(i = 0; i < x.length; i++) {
		if(x[i].checked){
			document.getElementById("chosenSequence").value = x[i].value;
		};
	};
	var t = document.getElementById("chosenSequence");
	var b = document.getElementById("startSequenceButton");
	if (t.value == "0,0,0,-1"){b.innerHTML='<span class="instruction">Step 6: </span>Start Race';} else {b.innerHTML='<span class="instruction">Step 6: </span>Begin Sequence';};
};

//change seconds to HH:MM:SS
function secondsToHms(d) {
	d = Number(d);
	var h = Math.floor(d / 3600);
	var m = Math.floor(d % 3600 / 60);
	var s = Math.floor(d % 3600 % 60);
	return addZero(h)+":"+addZero(m)+":"+addZero(s); 
};

//plays the horn
function horn(){
	hooterSound.play();
};

function pauseHorn() { 
	hooterSound.pause(); 
};

//ads a leading zero for time formats
function addZero(t) {
	if (t < 10) {t = "0" + t}
	return t;
};

//turn classes on or off for visibility.
//"x" is the class name, "y is the state - true is on, false is off
function toggleDiv(x,y){
	var toggleClassDivs = document.getElementsByClassName(x); //toggleClassDivs is an array
	for(var i = 0; i < toggleClassDivs.length; i++){
		if(y == true){
			// toggleClassDivs[i].style.visibility = "visible";
			toggleClassDivs[i].style.display = "inline-block";
		} else {
			// toggleClassDivs[i].style.visibility = "collapse";
			toggleClassDivs[i].style.display = "none";
		};
	};
};

//kill a div with display: none
function displayClass(x,y,z){
	var timeDivs = document.getElementsByClassName(x);
	for(var i = 0; i < timeDivs.length; i++){
		var t = document.getElementById(timeDivs[i].id);
		if(t === null) {
			console.log("Value is null");
		} else {
			if(y == true){
				t.setAttribute('style', 'display: '+z+';');
			};
			if(y==false){
				t.setAttribute('style', 'display: none;');
			};
		};
	};
};

//print the results
function doPrint(){
toggleDiv("metaDeets",true);
document.getElementById("instructions").setAttribute('style', 'display: None');
document.getElementById("flagContainer").setAttribute('style', 'display: None;');
document.getElementById("mainContainer").setAttribute('style', 'width: 100vw; margin-left: 0;');
window.print();
};

function newEntry(){
	//the table
	var noOfRow = document.getElementById("entrants").rows.length;
	//the row
	var element = document.getElementById("entrant");
	var newElement = '\
	<tr>\
	<td id="Entry'+noOfRow+'">\
		<span class="metaDeets">\
			<!--<div>Entry Number</div>--><input name="'+noOfRow+',entryNumber'+noOfRow+'" value='+noOfRow+' type="hidden" readonly></input>\
		</span>\
		<div class="competitorDetailsPane" id="competitorDetailsPane'+noOfRow+'">\
			<span class="metaDeets"><div>Division</div><input name="'+noOfRow+',Division" id="Division'+noOfRow+'" type="text"></input></span>\
			<span class="racingDeets"><div>Boat Class</div><input name="'+noOfRow+',BoatClass" id="BoatClass'+noOfRow+'" type="text"></input></span>\
			<span class="metaDeets"><div>Boat Yardstick</div><input name="'+noOfRow+',yardStick" id="yardStick'+noOfRow+'" type="text"></input></span>\
			<span class="racingDeets"><div>Sail Number</div><input name="'+noOfRow+',SailNumber" id="SailNumber'+noOfRow+'" type="text"></input></span>\
			<span class="racingDeets"><div>Helm Name</div><input name="'+noOfRow+',HelmName" id="HelmName'+noOfRow+'" type="text"></input></span>\
			<span id="finishTimeButton'+noOfRow+'"  class="finishButton"><span style="display:block; height: 2em;"><button type="button" id="finishTime,Button,'+noOfRow+'" onclick="finish(this.id);"><span class="instruction">Step 7: </span>Finish</button></span></span></span>\
		</div>\
		<div id="finishTimeDeetsTypeA_No'+noOfRow+'" class="finishTimeDeetsTypeA" style="max-height: 0; transform:translateX(-100vw);">\
			<div class="finishTimeDeetsTypeB">\
				<span id="finishTimeLabel'+noOfRow+'">Finish Time</span>\
				<span id="finishTimeDisplay'+noOfRow+'"><input readonly name="'+noOfRow+',finishTime" id="finishTime'+noOfRow+'" value="--:--:--"></span>\
			</div>\
			<div class="finishTimeDeetsTypeB">\
				<span id="elapsedTimeLabel'+noOfRow+'">Elapsed Time</span>\
				<span id="elapsedTimeDisplay'+noOfRow+'"><input readonly name="'+noOfRow+',elapsedTime" id="elapsedTime'+noOfRow+'" value="--:--:--"></span>\
				<input hidden type="number" name="'+noOfRow+',elapsedSeconds" id="elapsedSeconds'+noOfRow+'" value="">\
			</div>\
			<div class="finishTimeDeetsTypeB">\
				<div id="correctedTimeLabel'+noOfRow+'">Corrected Time</div>\
				<div>\
					<span id="recalcCorrectedTimeButton'+noOfRow+'"><span style="display:block; height: 2em;"><button type="button" id="recalcCorrected,Button,'+noOfRow+'" onclick="calcCorrected(this.id);"><span class="instruction">Step 7(b): </span>Re-calc CT</button></span></span></span>\
					<span id="correctedTimeDisplay'+noOfRow+'"><input readonly name="'+noOfRow+',correctedTime" id="correctedTime'+noOfRow+'" value="--:--:--"></span>\
					<input hidden type="number" name="'+noOfRow+',correctedTimeSeconds" id="correctedTimeSeconds'+noOfRow+'" value="">\
					</div>\
			</div>\
		</div>\
	</td></tr>';
	element.insertAdjacentHTML( 'afterend', newElement );		
};

// Records a start time
function recordStartTime(){
	const d = new Date();
	let startTime = d.toLocaleTimeString();
	document.getElementById("raceStartTime").value = startTime;
};

//records a lap split
function split(id){
	console.log(id);
	const d = new Date();
	//let time = d.getTime();
	let time = d.toLocaleTimeString();
	var e = id.split(",")
	console.log(e)
	var targetID = e[0]+e[2]
	console.log(targetID)
	document.getElementById(targetID).value = time;

	console.log(time,id);
	
};

//records a finish time
function finish(id){
	const d = new Date();
	let time = d.toLocaleTimeString();

	var e = id.split(",");
	var targetID = e[0]+e[2];

	var start = document.getElementById("raceStartTime").value;
	var elapsed = document.getElementById("raceTimer").innerHTML;
	var elapsedSeconds = document.getElementById("raceTimerSeconds").value;
	
	document.getElementById(targetID).value = time;
	document.getElementById("elapsedTime"+e[2]).value = elapsed;
	document.getElementById("elapsedSeconds"+e[2]).value = elapsedSeconds;
	// document.getElementById("finishTimeDeets"+e[2]).setAttribute('style', "display: inline-block;");
	document.getElementById("finishTime,Button,"+e[2]).innerHTML = "Re-Take";
	horn();
	calcCorrected(id);
	document.getElementById("finishTimeDeetsTypeA_No"+e[2]).setAttribute('style', "");
	document.getElementById("competitorDetailsPane"+e[2]).setAttribute('style', "transform: translateY(0);");
};

//calculates the corected time
function calcCorrected(x){
	var targetIDnumber = x.split(",")[2];
	var elapsedSeconds = document.getElementById("elapsedSeconds"+targetIDnumber).value;
	var yardStick = document.getElementById("yardStick"+targetIDnumber).value;
	var correctedTimeSeconds = Math.floor((((elapsedSeconds*100)*1000)/yardStick)/1000);//*1000 for miliseconds in the time module
	document.getElementById("correctedTimeSeconds"+targetIDnumber).value = correctedTimeSeconds;
	document.getElementById("correctedTime"+targetIDnumber).value = secondsToTime(correctedTimeSeconds);
}

//rank the finished competitors
function rank(){
	var results = {};
	var entries = document.getElementsByTagName("td");
	var ranking = [];

	for(var i = 0; i < entries.length-1; i++){
		var dict = {};
		if (Math.abs(document.getElementById("correctedTimeSeconds"+(i+1)).value) > 0){
			ranking.push(Math.abs(document.getElementById("correctedTimeSeconds"+(i+1)).value));
			results[Math.abs(document.getElementById("correctedTimeSeconds"+(i+1)).value)] = document.getElementById("HelmName"+(i+1)).value;
		};
	};
	ranking.sort(function(a, b){return a-b});
	console.log(ranking);
	var resultsWindow = window.open("", "Corrected Time preliinary results", "width=1024,height=768");
	resultsWindow.document.write('<html lang="en"><head></head><body><div id="content"></div></body></html>');
	// resultsWindow.document.getElementById('content').innerHTML = "";
	var html = "<table><tbody>";
	for(var i = 0; i < ranking.length; i++){
		console.log(i+1, results[ranking[i]], secondsToTime(ranking[i]));
		html += ("<tr><td>"+(i+1)+"</td><td>"+results[ranking[i]]+"</td><td>"+secondsToTime(ranking[i])+"</td></tr>");
	};
	console.log(html);
	console.log(ranking.length);
	if(ranking.length == 0){
		html += "<tr>There are no valid yardstick results to display.</tr>";
	};
	html += '</table></tbody><button type="button" onclick="window.close();">Close the preliminary results window.</button>';
	resultsWindow.document.getElementById('content').innerHTML = html;
};

//turn seconds into a time format
function secondsToTime(sec) { 
	 var seconds = parseInt(sec, 10); // don't forget the second param
	 var hours   = Math.floor(seconds / 3600);
	 var minutes = Math.floor((seconds - (hours * 3600)) / 60);
	 seconds = seconds - (hours * 3600) - (minutes * 60);

	 if (hours   < 10) {hours   = "0"+hours;}
	 if (minutes < 10) {minutes = "0"+minutes;}
	 if (seconds < 10) {seconds = "0"+seconds;}
	 var time    = hours+':'+minutes+':'+seconds;
	 return time;
 }


//locks the entry list and displays the start/stop/lap/finish functions
function raceView(){
	document.getElementById("startStopControls").setAttribute('style', 'display: block');
	document.getElementById("lateEntriesControl").setAttribute('style', 'display: block');
	toggleDiv("inRaceControls",true);
	toggleDiv("metaDeets",false);
	document.getElementById("downLoadControls").setAttribute('style', 'display: none');
	document.getElementById("crew").setAttribute('style', 'display: None');
	document.getElementById("raceName").setAttribute('style', 'display: None');
	// document.getElementById("downLoadControls").setAttribute('style', 'display: block');
};

//resets the start and finish times and buttons
function doReset(){
	if (confirm("Pressing OK to clear the finish time details or cancel to retain them.")){
		hideFinishtimeDeets();
	}
	document.getElementById("startStopControls").setAttribute('style', 'display: block');
	document.getElementById("raceViewButton").innerHTML = "Enter Race View";
	toggleDiv("inRaceControls",true);
	toggleDiv("metaDeets",true);
	document.getElementById("startSequenceButton").disabled = false;
	document.getElementById("startTimer").innerHTML = '--:--:--';
	var toggleClassDivs = document.getElementsByClassName("inRaceControls");
	for(var i = 0; i < toggleClassDivs.length; i++){
		toggleClassDivs[i].disabled = false;
	};
	var timeDivs = document.getElementsByClassName("finishTimeDeets");
	for(var i = 0; i < timeDivs.length; i++){
		document.getElementById("finishTime"+(i+1)).value="";
		document.getElementById("elapsedTime"+(i+1)).value="";
	// };
	// var timeDivs = document.getElementsByClassName("finishTimeDeets");
	// for(var i = 0; i < timeDivs.length; i++){
		var d = document.getElementById(timeDivs[i].id);
		var b = document.getElementById('finishTime,Button,'+(i+1));
		
		if(b === null) {
			console.log("Value is null");
		} else {
			b.innerHTML = "Finish";
			d.setAttribute('style', 'display: none;');
		};
	};
	resetFinishButtons();
	// var finButtons = document.getElementsByClassName("finishButton");
	// for(var i = 0; i < finButtons.length; i++){
	// 	var t = document.getElementById(finButtons[i].id);
	// 	if(t === null) {
	// 		console.log("Value is null");
	// 	} else {
	// 		t.setAttribute('style', 'display: inline-block;');
	// 	};
	// };

	document.getElementById("flag1").setAttribute('style', 'transform: translateX(-25vw);');
	document.getElementById("flag2").setAttribute('style', 'transform: translateX(-25vw);');
	document.getElementById("flagContainer").setAttribute('style', 'display: none;');
	document.getElementById("mainContainer").setAttribute('style', 'width: 100%; margin-left: 0;');
};

// resets the finish buttons to say "Finish"
function resetFinishButtons (){
	var timeDivs = document.getElementsByClassName("finishTimeDeetsTypeA");
	for(var i = 0; i < timeDivs.length; i++){
		var d = document.getElementById(timeDivs[i].id);
		var b = document.getElementById('finishTime,Button,'+(i+1));
		
		if(b === null) {
			console.log("Value is null");
		} else {
			b.innerHTML = "Finish";
			// d.setAttribute('style', 'display: none;');
		};
	};

};

//event listeners
document.getElementById('raceNameInput').onchange = function() {
	document.title = document.getElementById('raceNameInput').value;
};

//stops the timer
function stopTimer(){
	var sessionID = document.getElementById("RaceID").value;
	uploadStartTime(sessionID, "null");
	document.getElementById("downLoadControls").setAttribute('style', 'display: block');
	document.getElementById("raceName").setAttribute('style', 'display: block');
	document.getElementById("crew").setAttribute('style', 'display: block; ');
	document.getElementById("raceViewButton").innerHTML = "Enter Race View";
	document.getElementById("lateEntriesControl").setAttribute('style', 'display: none;');
	toggleDiv("metaDeets",true);
	try {window.clearInterval(timeoutID);} catch(e) {};
	document.getElementById("signal").innerHTML = "Get Ready...";
	document.getElementById("raceTimer").innerHTML = "--:--:--";
	document.getElementById("startSequenceButton").disabled = false;
	document.getElementById("reset").disabled = false;
	document.getElementById("sequenceTimeSelector").setAttribute('style', 'visibility: visible');
	document.getElementById("flag1").setAttribute('style', 'transform: translateX(-25vw);');
	document.getElementById("flag2").setAttribute('style', 'transform: translateX(-25vw);');

	var finButtons = document.getElementsByClassName("finishButton");
	for(var i = 0; i < finButtons.length; i++){
		console.log(i);
		var et = document.getElementById('elapsedTime'+(i+1)).value;
		var ft = document.getElementById('finishTime'+(i+1)).value;
		var t = document.getElementById('finishTimeDeetsTypeA_No'+(i+1));
		if(ft == null||ft == ""||ft == "--:--:--"||ft== "DNF") {
			document.getElementById('finishTime'+(i+1)).value = "DNF";
			document.getElementById('elapsedTime'+(i+1)).value = "DNF";
			document.getElementById('correctedTime'+(i+1)).value = "DNF";
		};
		t.setAttribute('style', '');
	};
};

//hides the finish time details pane
function hideFinishtimeDeets(){
	var t = document.getElementsByClassName("finishTimeDeetsTypeA");
	for(i=0;i<t.length;i++){
		document.getElementById("finishTimeDeetsTypeA_No"+(i+1)).setAttribute('style', 'max-height: 0; transform:translateX(-100vw);');
		document.getElementById("competitorDetailsPane"+(i+1)).setAttribute('style', "transform: translateY(25%);");
	};
};

//starts the sequence & race
function doStart(signals){
	if (navigator.onLine != true){
		alert("You do not appear to be connected tp the internet.\nIf you wish to use a session (e.g to synchronise a start boat with this race) please check your connection.");
	};

	hooterSound.play();
	hooterSound.pause();
	tenSecBeeper.play();
	tenSecBeeper.pause();
	hideFinishtimeDeets();

	var sequence = [];
	var signals = signals.split(',');
	for(let i=0; i<=signals.length; i++) {
		sequence[i] = Number(signals[i]);
	};

	resetFinishButtons();
	document.getElementById("downLoadControls").setAttribute('style', 'display: none;');
	document.getElementById("lateEntriesControl").setAttribute('style', 'display: block;');
	document.getElementById("raceViewButton").innerHTML = "Refresh Race View";
	toggleDiv("finishTimeDeets",false);
	toggleDiv("metaDeets",false);
	document.getElementById("startSequenceButton").disabled = true;
	document.getElementById("sequenceTimeSelector").setAttribute('style', 'visibility: hidden');
	document.getElementById("flagContainer").setAttribute('style', 'display: block;');
	document.getElementById("mainContainer").setAttribute('style', 'width: 80vw; margin-left: 17vw; ');
	document.getElementById("reset").disabled = true;
	var sequenceStart = new Date().getTime()+(1*60*1000);
	var startHooter = !document.getElementById("soundHooterInSquence").checked;
	var ClassPennantUpHorn = startHooter;
	var PreparatorySignalUpHorn = startHooter;
	var PreparatorySignalDownHorn = startHooter;
	var startHorn = startHooter;
	var trainingBeeps = false;
	var startRecorded = false;

	var now = new Date().getTime();
	var firstSignal=(now+(sequence[3]+1)*60*1000);

	var sessionID = document.getElementById("RaceID").value;
	uploadStartTime(sessionID, firstSignal);
	var offset = 2000;

	this.timeoutID = window.setInterval(function(sequenceStart,signals) {		
		now = new Date().getTime();		
		var getReadyTime=	(sequenceStart	-(1)*60*1000);
		var sequenceStart=	(sequenceStart	+((sequence[3]+0)*60*1000) );
		var prepUp = 		(sequenceStart 	+((sequence[2]+0)*60*1000) );
		var prepDown = 		(sequenceStart	+((sequence[1]+0)*60*1000) );
		var classDownStart=	(sequenceStart	+((sequence[0]+0)*60*1000) );

		var countDown = new Date(classDownStart - now);
		var elapsedSeconds = (new Date(now - classDownStart).getTime())/1000;
		
		console.log(now);
		console.log(countDown);
		console.log(elapsedSeconds);


		if (countDown > 0){			
			let m = addZero(countDown.getMinutes());
			let s = addZero(countDown.getSeconds());
			document.getElementById("startTimer").innerHTML = m+":"+s;
		};
		
		if (elapsedSeconds > 0){
			var elapsed = secondsToHms(elapsedSeconds);
			document.getElementById("raceTimer").innerHTML = elapsed;
			document.getElementById("raceTimerSeconds").value = elapsedSeconds;
		};

			// console.log(now);
			// console.log(now,sequenceStart,now-sequenceStart);
			// console.log(now,prepUp,now-prepUp);
			// console.log(now,prepDown,now-prepDown);
			// console.log(now,classDownStart,now-classDownStart);
	
		if ((now > getReadyTime)&&(now < sequenceStart)){
			document.getElementById("signal").innerHTML = "Get Ready...";
			console.log("ready time");
		};
				
		if ((now > sequenceStart-offset)&&(now < prepUp)){
			document.getElementById("signal").innerHTML = "Class pennant up";
			document.getElementById("flag1").setAttribute('style', 'transform: translateX(0vw);');
			if (ClassPennantUpHorn == false){
				hooterSound.play();
				ClassPennantUpHorn = true;
			};
			console.log("Class pennant up");
		};
	
		if ((now > prepUp-offset)&&(now < prepDown)){
			document.getElementById("signal").innerHTML = "Preparatory signal up";
			document.getElementById("flag2").setAttribute('style', 'transform: translateX(0vw);');
			if (PreparatorySignalUpHorn == false){
				hooterSound.play();
				PreparatorySignalUpHorn = true;
			};

			console.log("Preparatory signal up",sequenceStart-(sequenceStart+signals[1]*60*1000));
		};
		
		console.log(document.getElementById("trainingBeeps").checked);
		if (document.getElementById("trainingBeeps").checked == true){
			if ((now >= (classDownStart - 10000))&&(now < classDownStart)){
				if (trainingBeeps == false){
					tenSecBeeper.play();
					trainingBeeps = true;
				};
				console.log("Play training beeps.");
			};
		};

		if ((now > prepDown-offset)&&(now < classDownStart)){
			document.getElementById("signal").innerHTML = "Preparatory signal Down";
			document.getElementById("flag2").setAttribute('style', 'transform: translateX(-25vw);');
			if (PreparatorySignalDownHorn == false){
				hooterSound.play();
				PreparatorySignalDownHorn = true;
			};
			console.log("Preparatory signal Down",sequenceStart-(sequenceStart+signals[2]*60*1000));
		};

		if (now > classDownStart-offset){
			document.getElementById("signal").innerHTML = "Class pennant down (Race has started)";
			document.getElementById("flag1").setAttribute('style', 'transform: translateX(-25vw);');
			document.getElementById("flagContainer").setAttribute('style', 'display: none;');
			document.getElementById("mainContainer").setAttribute('style', 'margin-left: 0; width: 100vw;');
			console.log("Class pennant down",sequenceStart-(sequenceStart+signals[3]*60*1000));
			if (startHorn == false){
				hooterSound.play();
				startHorn = true;
				
			};
			if (startRecorded == false){
				recordStartTime();
				startRecorded = true;
			};
			console.log("Class pennant down",sequenceStart-(sequenceStart+signals[3]*60*1000));
		};
	}
	, 1000,sequenceStart,signals);
};

//sends the sequence start time to the server for syncing with the flags on the boat
function uploadStartTime(sessionID,CountDownStart){
	var sequenceType = document.getElementById("chosenSequence").value;
	var beeps = document.getElementById("trainingBeeps").checked;
	var xhr = new XMLHttpRequest();
	var url = '/racetime/sessiondeets/sessionNumber?action=write&sessionID='+sessionID+'&sequenceStartAt='+CountDownStart+'&sequenceType='+sequenceType+'&beeps='+beeps;
	xhr.open("GET", url, true);
	xhr.onreadystatechange = function () {
	if (this.readyState == 4 && this.status == 200) {
		  console.log(this.responseText);
		  document.getElementById("sessionInitiateButton").setAttribute("style","display:none;");
		  document.getElementById("sessionInfoLabel").setAttribute("style","display:block;");

	};
  };
  xhr.send();
};