// Place your application-specific JavaScript functions and classes here
// This file is automatically included by javascript_include_tag :defaults

	// adds a new DIV element to the div with id of divName.
	// Places contents inside new div, and increments the divCount element by one.
function addAnswer(divName, divCount, canDelete){
	var insertDiv = document.getElementById(divName);
	var newdiv = document.createElement('div');
	var count = parseInt(document.getElementById(divCount).value) + 1;
	var newdivname = divName + '_' + count; 
	newdiv.setAttribute('id',newdivname,0);
	//newdiv.setAttribute('className', 'newitembox',0);
	//newdiv.setAttribute('class', 'newitembox',0);
	newdiv.innerHTML = '<input type="radio" name="answer_selected" value="' + count + '" /> <input type="text" name="' + divName + '[' + count + '][text] size=25 />';
	if(canDelete == 'canDelete'){
		newdiv.innerHTML += ' <span class="xDelete"><a href="#" onclick="removeElement(\'' + divName + '\', \'' + newdivname + '\');" />x</a></span>';
	}
	insertDiv.appendChild(newdiv);	
	document.getElementById(divCount).value = count;
}

function addCategory(divName, divCount, canDelete){
	var insertDiv = document.getElementById(divName);
	var newdiv = document.createElement('div');
	var count = parseInt(document.getElementById(divCount).value) + 1;
	var newdivname = divName + '_' + count; 
	newdiv.setAttribute('id',newdivname,0);
	newdiv.setAttribute('class','item');
	newdiv.innerHTML = '<input type="text" name="' + divName + '[' + count + '][name] size=25 />';
	if(canDelete == 'canDelete'){
		newdiv.innerHTML += ' <span class="xDelete"><a href="#" onclick="removeElement(\'' + divName + '\', \'' + newdivname + '\');" />x</a></span>';
	}
	insertDiv.appendChild(newdiv);	
	document.getElementById(divCount).value = count;
}

function addQuiz(){
	var count = parseInt(document.getElementById('addedQuizzes').value) + 1;
	var tbl = document.getElementById('quizTable');
	var lastRow = tbl.rows.length;
	var row = tbl.insertRow(lastRow);
	var cellTitle = row.insertCell(0);
	cellTitle.innerHTML = '<input name="quiz[' + count + '][title]" size="15" type="text" />';
	//cellTitle.setAttribute('class') = 'title';
	//cellTitle.setAttribute('className') = 'title';  // IE hack
	var cellManage = row.insertCell(1)
	cellManage.innerHTML = '';
	var cellActive = row.insertCell(2);
	cellActive.innerHTML = '<input checked="checked" name="quiz[' + count + '][active]" type="checkbox" value="1" /><input name="quiz[' + count + '][active]" type="hidden" value="0" />';
	var cellDelete = row.insertCell(3);
	cellDelete.innerHTML = '<input name="quiz[' + count + '][delete_me]" type="checkbox" value="1" /><input name="quiz[' + count + '][delete_me]" type="hidden" value="0" />';
	document.getElementById('addedQuizzes').value = count;
}

function addLevelAJAX(){
	lc = document.getElementById('levelCount');
	if(lc){
		lc.value = parseInt(lc.value) + 1;
		new Ajax.Request('/level/add_level?count=' + lc.value, {asynchronous:true, evalScripts:true});
	}
}

function addLevel(divName, divCount, canDelete){
	var insertDiv = document.getElementById(divName);
	var newdiv = document.createElement('div');
	var count = parseInt(document.getElementById(divCount).value) + 1;
	var addedLevels = parseInt(document.getElementById('addedLevels').value);
	var startPoints = parseInt(document.getElementById('maxPoints').value);
	var pointChange = parseInt(document.getElementById('pointChange').value);
	var deletedElement = parseInt(document.getElementById('deletedElement').value);
	if(addedLevels > 1 && deletedElement != 1){
		var olderName = 'levelPoints_' + (count - 2);
		var oldName = 'levelPoints_' + (count - 1);
		startPoints = parseInt(document.getElementById(oldName).value);
		var oldPoints = parseInt(document.getElementById(olderName).value);
		if(startPoints > oldPoints){
			pointChange = (startPoints - oldPoints);
			document.getElementById('pointChange').value = pointChange;
		}
	}
	startPoints = startPoints + pointChange;
	var newdivname = divName + '_' + count; 
	newdiv.setAttribute('id',newdivname,0);
	newdiv.setAttribute('class','item');
	newdiv.innerHTML = 'Points: <input type="text" id="levelPoints_' + count + '" name="level[' + count + '][points]" size="10" value="' + startPoints + '" /> Title: <input type="text" name="' + divName + '[' + count + '][title] size=25 />';
	if(canDelete == 'canDelete'){
		newdiv.innerHTML += ' <span class="xDelete"><a href="#" onclick="removeLevel(\'' + divName + '\', \'' + newdivname + '\');" />x</a></span>';
	}
	insertDiv.appendChild(newdiv);	
	document.getElementById(divCount).value = count;
	addedLevels += 1;
	document.getElementById('addedLevels').value = addedLevels;
	document.getElementById('maxPoints').value = startPoints;	
}

//Same as removeElement, but removes a level instead
function removeLevel(parentElementId, elementId){
	var parent = document.getElementById(parentElementId);
  	var removeElement = document.getElementById(elementId);
  	parent.removeChild(removeElement);
	document.getElementById('deletedElement').value = 1;
}

	// will remove any DOM element, when provided its parent element
function removeElement(parentElementId, elementId){
	var parent = document.getElementById(parentElementId);
  	var removeElement = document.getElementById(elementId);
  	parent.removeChild(removeElement);
}

var timerID = 0;
var tStart  = null;
function UpdateTimer() {
	if(timerID) {
      clearTimeout(timerID);
      clockID  = 0;
   }
   if(!tStart)
      tStart   = new Date();

   var   tDate = new Date();
   var   tDiff = tDate.getTime() - tStart.getTime();
   tDate.setTime(tDiff);
   document.getElementById('timer').value = "" 
                                   + tDate.getMinutes() + ":" 
                                   + tDate.getSeconds();
   timerID = setTimeout("UpdateTimer()", 1000);
}

function StartTimer() {
   tStart   = new Date();
   document.getElementById('timer').value = "00:00";
   timerID  = setTimeout("UpdateTimer()", 1000);
}

	// for selecting all or none of the checkboxes with a specific name
function checkBoxes(elementName, method)
{
    var checkboxes = document.getElementsByName(elementName);
    for(i=0; i < checkboxes.length; i++)
    {
        checkboxes[i].checked = method;
    }
}

function getIdsOfCheckboxes(checkboxes_name){
	var checkboxes = document.getElementsByName(checkboxes_name);
	ids = [];
	string = '';
	for(i=0; i < checkboxes.length; i++)
    {
        if(checkboxes[i].checked){
			ids.push(checkboxes[i].value);
		}
    }
	if(ids.length > 0){
		for(i=0; i < ids.length; i++){
			string += ids[i];
			if(i < (ids.length - 1)){
				string += ',';
			}
		}
	}
	return string
}

	// to grab all checkboxes that are selected and show the matching questions
	// this is such a specific action, I just created an individual function
function searchQuestions(quiz_id){
	var search_input = document.getElementById('search_string');
	string = getIdsOfCheckboxes('category');
	string = quiz_id + '|' + string + '|' + search_input.value;
	new Ajax.Updater('question_search_results', '/quiz/search_questions', {asynchronous:true, evalScripts:true, parameters:{form_data: string}});
}

	// process checkboxes to add or remove from a quiz
function processQuestions(action, checkboxes_name, quiz_id){
	string = getIdsOfCheckboxes(checkboxes_name);
	new Ajax.Updater('questions_in_quiz', '/quiz/process_questions', {asynchronous:true, evalScripts:true, parameters:{perform_action: action, question_ids: string, quiz_id: quiz_id}});
}

	// round a number to a specific number of decimal places
function roundNumber(num, decimal_places) {
	var result = Math.round(num*Math.pow(10,decimal_places))/Math.pow(10,decimal_places);
	return result;
}

// globally accessible timer object
var timer;
var timer_interval_id = '';
var countdown_timer;

	// countdown timer that operates on a specific div element
	// seconds_per_point is in seconds
	// run_when_finished can be any function that will be run when the countdown is done
function startCountdownTimer(count_from, count_to, seconds_per_point, variable_name, run_when_finished, delay_in_milliseconds){
	timerDiv = document.getElementById(variable_name + '_div');
	if (timerDiv){
		// SET UP TIMER AND WRITE DIVS to PAGE
		timerDiv.innerHTML = '<div id="' + variable_name + '_timer" class="' + variable_name + '">' + count_from + '</div><input type="hidden" id="' + variable_name + '_elapsed" name="' + variable_name + '_elapsed" value="0"><input type="hidden" id="' + variable_name + '" name="' + variable_name + '" value="'+ count_from +'">';
		if (timer_interval_id == '') {
			timer = new countdownTimer();
			timer.initializeTimer(count_from, count_to, seconds_per_point, variable_name, run_when_finished);
			if(delay_in_milliseconds != ''){ // delays timer so it starts in delay_in_milliseconds 
				setTimeout("timer.startTimer()", parseInt(delay_in_milliseconds));
			}else{
				timer.startTimer();
			}
		}
	}
}

function countdownTimer(){
	var progress_bar = '', count_from = 0, count_to = 0, seconds_per_point = 0, increment = 0, variable_name = '', count_at = 0, run_when_finished = '', timerDisplay = '', timerHiddenInput = '', count_direction = '', timeoutID = '', finished = false, point_distance = 0, timerBarValue = 0, last_increment_at = 0, elapsed = 0;
	
	function updateTimer(){
		// make sure timer exists
		if(timer == ''){
			if(timer_interval_id){	// somehow timer is still going, so clear interval again
				clearInterval(timer_interval_id);
			}
		}else{
			timer.incrementTimer();
		}
	}
	
	this.startTimer = function(){
		this.updateTimerValues(count_from);
		timer_interval_id = setInterval(updateTimer, seconds_per_point * 1000);
		if (!is_ie()) {
			//progress_bar.setProgress(0);
			//progress_bar.start();
			//progress_bar.setProgress(0);
		}
	}
	
	this.setProgress = function(value){
		progress_bar.setStyle({width: roundNumber(value,4) + '%'});
	}
	
	this.incrementTimer = function(){
		now = new Date();
	//	if((now - last_increment_at) >= (seconds_per_point * 1000)){ // only increment if the last increment was
	//		last_increment_at = new Date();
			this.getCurrentTime();
			if(count_direction == 'up'){
				count_at += 1;
				if(count_at > count_to){
					// finish
					finished = true;
					this.stopTimer(finished);
				}else{
					this.updateTimerValues(count_at);
				}
			}else{
				count_at -= 1;
				if(count_at < count_to){
					// finish
					finished = true;
					this.stopTimer(finished);
				}else{
					this.updateTimerValues(count_at);
				}
			}
	//	}
	}
	
	this.stopTimer = function(finished){
		clearInterval(timer_interval_id);
		timer_interval_id = '';
		if(run_when_finished != '' && finished == true){
			eval(run_when_finished);
			run_when_finished = ''; // stop it from running more than once
		}
	}
	
	this.initializeTimer = function(acount_from, acount_to, aseconds_per_point, avariable_name, arun_when_finished){
		variable_name = avariable_name;
		count_from = parseInt(acount_from);
		count_to = parseInt(acount_to);
		seconds_per_point = aseconds_per_point;
		increment = 1;  // for every update of the timer, this value is added or subtracted from the timer
		count_at = parseInt(count_from);
		if(arun_when_finished != ''){
			run_when_finished = arun_when_finished;
		}
		if(count_from > count_to){ count_direction = 'down'; }else{ count_direction = 'up'; }
		timerDisplay = $(variable_name + '_timer');
		timerHiddenInput = $(variable_name);
		timerElapsedHiddenInput = $(variable_name + '_elapsed');
		// PROGRESS BAR -- counts in steps out of a hundred, from 1 to 100
		// min (width in pixels)
		// max (width in pixels)
		// interval (time in secs bewteen stepping), 
		// step (default step amount when start is called)
		// classNames (hash of class names that are added and removed to container depending on state, ex: {active: 'progress_bar_active', inactive: 'progress_bar_inactive'}
		point_distance = Math.abs(count_from - count_to) // we have to normalize the point distance to a 1 to 100 scale
		step_calc = (100 / point_distance);
		progress_bar = $('progress_bar_background');
	}
	
	this.getCurrentTime = function(){
		count_at = parseInt(timerHiddenInput.value);
	}
	
	this.elapsedTime = function(){
		if(count_direction == 'up'){
			return roundNumber((count_at / seconds_per_point),6);
		}else{
			return roundNumber(((count_from - count_at) * seconds_per_point),6);
		}
	}
	
	this.updateTimerValues = function(time){
		time = parseInt(time);
		elapsed = this.elapsedTime();
		timerElapsedHiddenInput.value = this.elapsedTime();
		timerHiddenInput.value = time;
		timerDisplay.innerHTML = roundNumber(time,2); // round the display of time to an integer
		this.setProgress(time);
	}
}

function is_ie(){
	if (navigator.appName == 'Microsoft Internet Explorer') {
		return true;
	}
	else {
		return false;
	}
}

function forceIncorrectAnswer(question_id, timer_id){
	new Ajax.Request('/quizzer/incorrect_answer?question_id=' + question_id, {asynchronous:true, evalScripts:true});
}

function generateAnswerOnclick(question_id, answer_id, timer_id, answer_class, redirect_to_pause){
	time_elapsed = document.getElementById(timer_id + '_elapsed').value;
	stopTimer();
	quiz_pause = '';
	if(redirect_to_pause == 'redirect_to_pause'){
		quiz_pause = '&quiz_pause=true';
	}
	new Ajax.Request('/quizzer/answer_question?answer_id=' + answer_id +'&question_id=' + question_id +'&time_elapsed=' + time_elapsed + '' + quiz_pause, {asynchronous:true, evalScripts:true, onComplete:function(){ Element.hide('loading_results');}});
	answer = document.getElementById('answer_' + answer_id);
	if(answer && answer_class){
		answer.setAttribute('class', 'answer_click ' + answer_class);
		answer.setAttribute('className', 'answer_click ' + answer_class);
	}
	Element.show('loading_results'); // show loading message
	clearLinkOnclick('answer_' + answer_id);
}

function stopTimer(){
	if (timer != '') {
		timer.stopTimer();
		timer = '';
	}
}

function clearLinkOnclick(link_id){
	link = document.getElementById(link_id);
	if(link){
		link.setAttribute('onclick', '');
	}
}

function preloadMedia(){
	new Ajax.Request('/quizzer/preload_media', {asynchronous:true, evalScripts:true, onComplete:function(request){ if(request.responseText != 'finished_loading'){ preloadMedia(); } }});
}

function safariPreloadMedia(sess_id){
	var linkurl = '/quizzer/preload_media/' + sess_id;
	new Ajax.Request(linkurl, {asynchronous:true, evalScripts:true});
}

function observeFieldWithLimits(field_name, prefix_with, action){
	new Form.Element.Observer(field_name, 1.0, function(element, value) {  if(value.length > 2 || value.length == 0){  Element.show('spinner'); new Ajax.Request(action, {asynchronous:true, evalScripts:true, onComplete:function(request){Element.hide('spinner');}, parameters: prefix_with + '=' + value});}});
}

// hide a dom element without throwing a warning if it doesn't exist
function hideAllVisibleMedia(makeSureMediaExists){
	element = document.getElementById('visible_media');
	/*
	if(makeSureMediaExists != ''){ // this is the next piece of media to display -- make sure it is there before we hide everything
		nextMedia = document.getElementById(makeSureMediaExists);
		if(nextMedia){ // it exists, so go ahead and remove visible media
			if (element) {
				new Element.remove('visible_media');
			}
		}
	}else{
	*/
		if (element) {
			new Element.remove('visible_media');
		}
	//}
	
}

function showIdWithNoWarning(element_id){
	showElement = document.getElementById(element_id);
	if(showElement){
		new Element.show(showElement);
	}
}

function showMediaIdWithNoWarning(element_id){
	hideAllVisibleMedia(); // make sure all media is hidden before showing another
	showElement = document.getElementById(element_id);
	if(showElement){
		new Element.show(showElement);
		showElement.setAttribute('id', 'visible_media');
		showElement.setAttribute('title', element_id)
	}
}

function onEndCrop(coords, dimensions) {
   mediaCoords = $('media_crop_details');
   if(mediaCoords){
   	mediaCoords.innerHTML = '<input type="hidden" name="x1" value="' + coords.x1 + '"><input type="hidden" name="y1" value="' + coords.y1 + '"><input type="hidden" name="new_width" value="' + dimensions.width + '"><input type="hidden" name="new_height" value="' + dimensions.height + '">';
	if((dimensions.width < 250 || dimensions.height < 187) && dimensions.width > 5 && dimensions.height > 5){
		//alert('Please make the crop box bigger (or upload a higher resolution image)');
	}
   }
 }
 
 function Get_Cookie( name ) {
	var start = document.cookie.indexOf( name + "=" );
	var len = start + name.length + 1;
	if ( ( !start ) && ( name != document.cookie.substring( 0, name.length ) ) )
	{
		return null;
	}
	if ( start == -1 ) return null;
	var end = document.cookie.indexOf( ";", len );
	if ( end == -1 ) end = document.cookie.length;
	return unescape( document.cookie.substring( len, end ) );
}

function useCheat(id, question_id, timer_name){
	time_elapsed = document.getElementById(timer_name + '_elapsed').value;
	new Ajax.Request('/quizzer/use_cheat?id=' + id + '&question_id=' + question_id + '&time_elapsed=' + time_elapsed, {asynchronous:true, evalScripts:true});
}

function changeImgSrc(id, new_url){
	img = document.getElementById(id);
	if(img){
		img.setAttribute('src', new_url)
	}
}

function openInNewWindow(url, width, height){
	window.open(url,'mywindow','width=' + width + ',height=' + height + ',toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,copyhistory=no,resizable=yes')
}

function redirectOutsideIframe(url){
	if(url != ''){
		top.location = url;
	}
}

function toggle_visibility(id) {
	var e = document.getElementById(id);
    if(e.style.display == 'block')
        e.style.display = 'none';
	else
        e.style.display = 'block';
}

function removeElement(element_id){
	var e = document.getElementById(element_id);
	if(e){
		Element.remove(e);
	}
}

function changeTableClass(user_id){
	var div_id = "user_row_" + user_id;
	var e = $(div_id);
	if(!e)
		return true;
	e.childElements().each(function(ce){
		if(ce.hasClassName('row2')){
			ce.removeClassName('row2');
			ce.addClassName('row3');
		}
	});
}

// checks to see if the variable name is unique
function translationVarUnique(field_id, translation_id, language_id){
	variable_name = $(field_id).value;
	if (variable_name) {
		if (variable_name.length > 3) {
			new Ajax.Request('/translation/translation_var_check', {
				asynchronous: true,
				evalScripts: true,
				params: '&id=' + translation_id + '&language_id=' + language_id
			});
		}
	}
}

	// returns a string 
function checkPasswordStrength(password_field_id, message_div_id, longer_msg){
	if(!longer_msg)
		longer_msg = 'please make it longer';
	pass = $(password_field_id).value
	ret = ''
	if (pass.length < 3) {
		ret = '<img src="/images/icon_wrong_sml.gif" alt="" /> ' + longer_msg;
	}
    $(message_div_id).innerHTML = ret;
	return true;
}


function checkForChallengeParams(){
	url_params = window.location.href.toQueryParams();
	if(url_params['c_id'] != '' && url_params['c_id'] != undefined){
		// redirect to challenge login
		action = 'start_challenge'
		if(url_params['e'].include('decline')){
			action = 'decline_challenge'
		}
		redirect_to = '/quizzer/' + action + '/' + url_params['c_id'] + '?c_id=' + url_params['c_id'];
		if(url_params['u_id'] != undefined && url_params['e'] != undefined){
			redirect_to += '&u_id=' + url_params['u_id'] + '&e=' + url_params['e']
		}
		window.location = 'http://' + window.location.hostname + redirect_to;
	}
}

function cookieMonster(){
	if(testCookies()){
		checkForChallengeParams();
	} else {
		RedBox.showInline('cookie_monster');
	}
}

function testCookies() {
	var ret;
	var exp = new Date(); 
	exp.setTime(exp.getTime() + 1800000); 
	// first write a test cookie 
	setCookie("cookies", "cookies", exp, false, false, false); 
	if (document.cookie.indexOf('cookies') != -1) { 
		ret = true;
	} 
	else { 
		ret = false; 
	} 
	// now delete the test cookie 
	exp = new Date(); 
	exp.setTime(exp.getTime() - 1800000); 
	setCookie("cookies", "cookies", exp, false, false, false);
	return ret;
}
	
function setCookie(name, value, expires, path, domain, secure) { 
	var curCookie = name + "=" + escape(value) + 
	((expires) ? "; expires=" + expires.toGMTString() : "") + 
	((path) ? "; path=" + path : "") + 
	((domain) ? "; domain=" + domain : "") + 
	((secure) ? "; secure" : ""); 
	document.cookie = curCookie; 
}

	// returns a true count of the string length, with spaces included, and normalizing for windows browsers
function stringLengthWithSpaces(str){
	// "\r" (ex: on mac) counts for one char, "\n" (ex: on Firefox) counts for one char and with this little script, "\r\n" (ex: on IE) also counts for one char. 
	// also replace spaces with character x so we get the correct length
	return str.replace(/\r\n/g,'x').length;
}

function updateCharCount(div_id, char_count_field, max_chars, truncate, characters_text){
	if(!characters_text)
		characters_text = 'characters remaining';
	num_chars = stringLengthWithSpaces($(div_id).value);
	if (num_chars > max_chars) {
		$(char_count_field).addClassName('error');
		$(char_count_field).innerHTML = Math.abs(max_chars - num_chars).toString() + ' characters too many!';
		//TODO: uncomment this after we have fixed all old questions with long extended answers
		// truncate any extra characters
		if(truncate == true){
			$(div_id).value = $(div_id).value.substring(0, max_chars);
		}
	}else{
		$(char_count_field).removeClassName('error');
		$(char_count_field).innerHTML = Math.abs(max_chars - num_chars).toString() + ' ' + characters_text;
	}
}

function theChosenOne(button_id){
	//Clear out existing classes
	$$('.campaign_button_profile').each(function(e){
		e.removeClassName('chosen');
	});
	e_id = 'button_image_' + button_id;
	$(e_id).addClassName('chosen');
}

//All of the check boxes of the given class will be checked
function mirrorSelection(master_element){
	master_element = $(master_element);
	class_name = $w(master_element.className)[0];
	checked = master_element.checked;
    $$('.' + class_name).each(function(s) { s.checked = checked; });
}

//All of the check boxes of the given class will be checked
function mirrorChoice(master_element){
	master_element = $(master_element);
	class_name = $w(master_element.className)[0];
	my_val = master_element.value;
    $$('.' + class_name).each(function(s) { s.value = my_val; });
}

function showHideQuestionComments(action){
	if(action == 'show'){ // show comments on a question
		$('comments_wrapper').show();
		$('question_wrapper').hide();
		$('tab_comments').removeClassName('tab_off');
		$('tab_question').addClassName('tab_off');
	}else if(action == 'hide'){ // hide comments
		$('comments_wrapper').hide();
		$('question_wrapper').show();
		$('tab_comments').addClassName('tab_off');
		$('tab_question').removeClassName('tab_off');
	}
}

function showHideQuizCommentsLeaderboard(action){
	if(action == 'comments'){ // show comments on a question
		$('comments_wrapper').show();
		$('quiz_wrapper').hide();
		$('leaderboard_wrapper').hide();
		$('tab_quiz').addClassName('tab_off');
		$('tab_leaderboard').addClassName('tab_off');
		$('tab_comments').removeClassName('tab_off');
	}else if(action == 'quiz'){ // hide comments
		$('quiz_wrapper').show();
		$('comments_wrapper').hide();
		$('leaderboard_wrapper').hide();
		$('tab_comments').addClassName('tab_off');
		$('tab_leaderboard').addClassName('tab_off');
		$('tab_quiz').removeClassName('tab_off');
	}else if(action == 'leaderboard'){ // hide comments
		$('comments_wrapper').hide();
		$('quiz_wrapper').hide();
		$('leaderboard_wrapper').show();
		$('tab_comments').addClassName('tab_off');
		$('tab_quiz').addClassName('tab_off');
		$('tab_leaderboard').removeClassName('tab_off');
	}
}

	// returns play url with unique id added as uuid variable
function playURLWithUniqueId(){
	url = '/quizzer/play';
	if(Device.available){
		url += '?uuid=' + Device.uuid.gsub('-', '').escapeHTML();
	}
	return url;
}