// set hidden divs first of all

jQuery(function($j) {

 	// Visuals list - visual type filter show
 	bindVisualTypeFilter();
 	
 	// New tags for admins
 	bindAddNewLinks();

	// Only do this on "add new" page
	if (init_clean_tags) {
		
		addNewMultiProperty('source_type', 1, source_type_options, '', false, 'source_type_inputs', false, false);
			
	}

	// Text boxes for admins
	bindEditTextBoxes();
	
	// Hide/show links for visual groups
	bindVisualTypeHideShow();

	// Hide/show links for tag support, i.e. show/hide warnings and howtos
	bindTagNoteHideShow();

	// Show links for user experience levels help
	bindExperienceLevelShow();

	$j('.click_info').html('Click for full size');

});


function bindExperienceLevelShow() {

	if ($j('.rating_help_link') != null) {
 	 	// display link
 	 	$j('.ratings_help_link').html('<a href="" onclick="return false;">Help with ratings</a>');
 	 	
 	 	// show help when link clicked
 	 	$j('.ratings_help_link a').bind('click', function() {
 	 	
 	 		if ($j('#ratings_help').is(':hidden')) {
 	 			$j('#ratings_help').slideDown();
 	 			$j('.ratings_help_link a').html('Close help');
 	 		} else {
 	 			$j('#ratings_help').slideUp();
 	 			$j('.ratings_help_link a').html('Help with ratings');
 	 		}
 	 	

 	 		return false;
 	 	});
 	 	
 	 	// hide help when close link clicked
 	 	$j('.ratings_help_close_link a').bind('click', function() {
 	 		$j('#ratings_help').hide();
 	 		$j('.ratings_help_link').fadeIn();
 	 		return false;
 	 	});
 	 	
	}
	
}




function bindTagNoteHideShow() {

	if ($j('.show_note') != null) {

		$j('.show_note').bind('click', function() {

			// need to work out which note box this link hooks up to
			var link_id = $j(this).attr('id');

			// now strip off "show_" from start of id
			link_id = link_id.substring(5);

			// if already shown, slide back up
			if (! $j('#' + link_id).is(':hidden')) {
				$j('#' + link_id).slideUp();
			} else {
				// otherwise, hide others and slide down
				$j('#' + link_id).slideDown();
			}


		});
	}
	
}

function bindVisualTypeHideShow() {
	
	if ($j('.group_header_link') != null) {
	    
		// add links
		$j('.group_header_link').html(' (<a href="" onclick="return false;" class="group_header_hide">Hide these</a>)');
		// activate links
		$j('.group_header_hide').bind('click', function() {
			if ($j(this).parent().parent().next().is(':hidden')) {
				// show examples
				$j(this).parent().parent().next().show();
				// change text
				$j(this).html('Hide these');
			} else {
				// hide examples
				$j(this).parent().parent().next().hide();
				// change text
				$j(this).html('Show these');
			}
		});

	}
	
}

function bindVisualTypeFilter() {

	if ($j('.visual_type_filter') != null) {
		
		$j('.visual_type_filter').html(
			'<span class="select_info_header mode_list_header">' +
			// '<a href="" onclick="return false" id="show_visual_type_filter_link" class="show_hide_visual_types mode_list_header">Filter by visual type</a>' +
			'Filter by visual type:' +
			'</span>' +
			$j('.visual_type_filter').html()
			);

		$j('.visual_type_filter_more').html(
			'<a href="" onclick="return false" id="show_visual_type_filter_link_more" class="show_hide_visual_types">Show all...</a>'
			);

		// Toggle visual types
		// $j('#show_visual_type_filter_link').bind('click', function() {
		$j('.show_hide_visual_types').bind('click', function() {

			// var subtag_list = $j(this).parent().parent().parent().next('.subtag_list');
			var subtag_list = $j('.subtag_list');

			if (subtag_list.is(':hidden')) {
				subtag_list.slideDown('normal');	
				// $j(this).html('Hide visual type list');
				$j('#show_visual_type_filter_link_more').html('Hide list...');
			} else {
				subtag_list.slideUp('normal');	
				// $j(this).html('Filter by visual type');
				$j('#show_visual_type_filter_link_more').html('Show all...');
			}
			return false;
		});
		
	}
}


function bindHelpLinks() {

	if ($j('.js_help_link_theme') != null) {
	
		$j('.js_help_link_theme').html('<a href="" onclick="return false">[?]</a>');
		$j('.js_help_link_question').html('<a href="" onclick="return false">[?]</a>');

		$j('.js_help_link_theme a').bind('click', function() {
			$j('.js_help_theme').fadeIn('fast');
			return false;
		});
		$j('.js_help_link_theme a').bind('mouseout', function() {
			setTimeout("$j('.js_help_theme').fadeOut('normal')", 3000 );
			return false;
		});

		$j('.js_help_link_question a').bind('click', function() {
			$j('.js_help_question').fadeIn('fast');
			return false;
		});
		$j('.js_help_link_question a').bind('mouseout', function() {
			setTimeout("$j('.js_help_question').fadeOut('normal')", 3000 );
			return false;
		});

	}
}

function bindTopNavMenus() {

	// Hide all menus on clicking the body
	$j('body').bind('click', function() {
		
		$j('.top_tags_dd').slideUp('normal');
		$j('.delicious_dd').slideUp('normal');
		$j('.browse_dd').slideUp('normal');
		$j('.js_help').fadeOut('fast');
		
	});


	// Top-nav menus
	
	$j('#link_top_tags_dd').bind('click', function() {

		if (! $j('.browse_dd').is(':hidden')) {
			$j('.browse_dd').slideUp('normal');
		}

		if (! $j('.delicious_dd').is(':hidden')) {
			$j('.delicious_dd').slideUp('normal');
		}
		

		$j('.top_tags_dd').slideToggle('normal');
		return false;
	});

	$j('#link_browse_dd').bind('click', function() {

		if (! $j('.top_tags_dd').is(':hidden')) {
			$j('.top_tags_dd').slideUp('normal');
		}	
	
		if (! $j('.delicious_dd').is(':hidden')) {
			$j('.delicious_dd').slideUp('normal');
		}
		
		
		$j('.browse_dd').slideToggle('normal');
		return false;
	});
	
	$j('#link_delicious_dd').bind('click', function() {
		if (! $j('.top_tags_dd').is(':hidden')) {
			$j('.top_tags_dd').slideUp('normal');
		}	

		if (! $j('.browse_dd').is(':hidden')) {
			$j('.browse_dd').slideUp('normal');
		}
		
		
		$j('.delicious_dd').slideToggle('normal');
		return false;
	});

}	


function bindChooserMap() {
	$j('#theme_chooser_select').bind('change', updateQuestionList);
}

function updateQuestionList() {
	
	$j('#question_chooser_select').empty();
	var theme_id = $j('#theme_chooser_select').val();

	for (var i = 0; i < themeJsonObject['themes'].length; i++) {

		theme = themeJsonObject['themes'][i];
		
		// check for selected theme
		if (theme_id == '' || theme['name'] == theme_id) {
		
			var dropdownList = document.getElementById("question_chooser_select");

			// loop through questions, add to dropdown
			for (var q = 0; q < theme['questions'].length; q++) {
			
				var question = theme['questions'][q];
	
				var link_html = '<a href="index_new.php?question=' + question['id'] +
				                '" class="hide_menu" onClick="setSelected(\'question\', ' + question['id'] + ', \'' + question['name'] + '\'); return false"' +
				                ' title="Select this question">';


				var option = new Option(question['name'], question['name']);
				if ($.browser.msie) {
					dropdownList.add(option);
				} else {
					dropdownList.add(option, null);
				}
			}

		}
		
	}
	
	return false;

}



var next_tag_dd_id = 100;
var next_user_dd_id = 200;
var next_geography_dd_id = 300;
var next_theme_dd_id = 400;
var next_question_dd_id = 500;
var next_visual_type_dd_id = 500;
var next_data_type_dd_id = 600;

function bindAddNewLinks() {
	
	if ($j('#link_add_new_tag') != null) {
		$j('#link_add_new_tag').bind('click', function() {

			addNewMultiProperty('tag', next_tag_dd_id, tag_options, '', false, 'tag_inputs', true, false);
			next_tag_dd_id++;
			return false;

		});
	}
	
	/* On click, append new user field */
	if ($j('#link_add_new_user') != null) {
		$j('#link_add_new_user').bind('click', function() {

			addNewMultiProperty('user', next_user_dd_id, user_options, '', false, 'user_inputs', true, false);
			next_user_dd_id++;
			return false;

		});
	}
	
	/* On click, append new geography field */
	if ($j('#link_add_new_geography') != null) {
		$j('#link_add_new_geography').bind('click', function() {

			addNewMultiProperty('geography', next_geography_dd_id, geography_options, '', false, 'geography_inputs', true, false);
			next_geography_dd_id++;
			return false;

		});
	}
	
	/* On click, append new theme field */
	if ($j('#link_add_new_theme') != null) {
		$j('#link_add_new_theme').bind('click', function() {

			addNewMultiProperty('theme', next_theme_dd_id, theme_options, '', false, 'theme_inputs', true, true);
			next_theme_dd_id++;
			return false;

		});
	}
	
	/* On click, append new question field */
	if ($j('#link_add_new_question') != null) {
		$j('#link_add_new_question').bind('click', function() {

			addNewMultiProperty('question', next_question_dd_id, question_options, '', false, 'question_inputs', true, true);
			next_question_dd_id++;
			return false;

		});
	}
	
	/* On click, append new visual type field */
	if ($j('#link_add_new_visual_type') != null) {
		$j('#link_add_new_visual_type').bind('click', function() {

			addNewMultiProperty('visual_type', next_visual_type_dd_id, visual_type_options, '', false, 'visual_type_inputs', true, false);
			next_visual_type_dd_id++;
			return false;

		});
	}
	
	/* On click, append new data type field */
	if ($j('#link_add_new_data_type') != null) {
		$j('#link_add_new_data_type').bind('click', function() {

			addNewMultiProperty('data_type', next_data_type_dd_id, data_type_options, '', false, 'data_type_inputs', true, false);
			next_data_type_dd_id++;
			return false;

		});
	}
	
}

var last_text_value = null;

function bindEditTextBoxes() {
	
	if ($j('.edit_text_box') != null) {
		$j('.edit_text_box').bind('focus', function() {

			$j(this).removeClass('updated_text_box');
			$j(this).addClass('active_text_box');

			last_text_value = $j(this).val();	

		});

		$j('.edit_text_box').bind('blur', function() {

			$j(this).removeClass('active_text_box');
			if ($j(this).val() != last_text_value) {
				$j(this).addClass('updated_text_box');
			} else {
			}

		});
	
	}
	
}

/*
 * Appends a new tag dropdown chooser/editor into the target_element_id element.
 */
function addNewMultiProperty(base_type, id, options_list, selected_id, exists_is_selected, target_element_id, allow_remove, expanded) {

	var div_class = base_type +'_mp_instance';
	if (expanded) div_class += ' expanded';
	var div_id = base_type +'_mp_instance_'+ id;

	var select_name = base_type +'_list_' + id;
	var select_class = base_type +'_list';

	var radio_name = base_type + '_new_' + id;
	var radio_exists_id = base_type +'_exists_'+ id;
	var radio_new_id = base_type +'_new_'+ id;
	var radio_class = base_type +'_radio';
	var radio_exists_class = base_type +'_exists_radio';
	var radio_new_class = base_type +'_new_radio';

	var freetext_name = base_type +'_freetext_'+ id;
	var freetext_class = base_type +'_freetext';
	
	var reset_id = base_type +'_reset_'+ id;
	var reset_class = base_type +'_reset';
	
	var remove_id = base_type +'_remove_'+ id;
	var remove_class = base_type +'_remove';
	
	var new_dd = '<div class="' + div_class + ' mp_instance" id="' + div_id + '">';
	
	if (! expanded) {
		// if normal view, place select before radio button
		new_dd += '<select id="' + select_name + '" name="' + select_name + '" class="mp_select ' + select_class + '"></select>';
	}
	new_dd += '<input type="radio" name="' + radio_name + '" id="' + radio_exists_id + '" class="mp_radio ' + radio_class + ' ' + radio_exists_class + '" value="0" ';
	if (exists_is_selected) {
		new_dd += 'checked="checked" ';
	}
	new_dd += '/>';
	if (expanded) {
		// if expanded view, place select after radio button
		new_dd += '<select id="' + select_name + '" name="' + select_name + '" class="mp_select ' + select_class + '"></select>';
	}

	new_dd += '<input type="radio" name="' + radio_name + '" id="' + radio_new_id + '" class="mp_radio ' + radio_class + ' ' + radio_new_class + '" value="1" ';
	if (! exists_is_selected) {
		new_dd += 'checked="checked" ';
	}
	new_dd += '/>';
	
	new_dd += '<input type="text" name="' + freetext_name + '" id="' + freetext_name + '" class="mp_freetext ' + freetext_class + '" />';
	// new_dd += '<a href="" id="'+ reset_id +'" class="mp_reset ' + reset_class + '" title="clear text">x</a>';
	if (allow_remove) {
		new_dd += '<a href="" id="' + remove_id + '" class="mp_remove ' + remove_class + '" title="remove">-</a>';
	}
	
	new_dd += '</div>';

	$j('#' + target_element_id).append(new_dd);

	// now populate it with options

	populateDropDown(select_name, options_list, selected_id, null);

	// work out which to grey out first
	if (exists_is_selected) {
		highlightOneNotOther(select_name, freetext_name);
	} else {
		highlightOneNotOther(freetext_name, select_name);
	}

	// and bind updates to freetext
	bindTextSearch(freetext_name, select_name, options_list, radio_new_id);
	bindSelectRadio(select_name, freetext_name, radio_exists_id);
	bindRadioClickHighlight(radio_exists_id, radio_new_id, select_name, freetext_name);
	bindTextClear(reset_id, freetext_name, select_name, options_list);
	if (allow_remove) {
		bindRemove(remove_id, div_id);
	}

	return false;
		
}


function bindTextSearch(freetext_id, dropdown_id, options_list, radio_id) {

	/* On text change, update dropdown */
	$j('#'+ freetext_id).bind('keyup', function() {

		populateDropDown(dropdown_id, options_list, null, $j(this).val());
		
		// oh, and change radio selection
		$j('#'+ radio_id).attr("checked", "checked");
		
		highlightOneNotOther(freetext_id, dropdown_id);
		
		return false;
		
	});

}


function bindRadioClickHighlight(radio_exists_id, radio_new_id, select_id, freetext_id) {

	/* On radio_exists click, highlight select and fade freetext */
	$j('#' + radio_exists_id).bind('click', function() {
		highlightOneNotOther(select_id, freetext_id);
	});
	
	/* On radio_new click, highlight freetext and fade select */
	$j('#' + radio_new_id).bind('click', function() {
		highlightOneNotOther(freetext_id, select_id);
	});

}


function highlightOneNotOther(highlight_id, fade_id) {
	$j('#' + highlight_id).css({'background-color' : '#ffffff'});
	$j('#' + fade_id).css({'background-color' : '#eeeeee'});
}

function bindSelectRadio(dropdown_id, freetext_id, radio_id) {
	
	/* On select change, choose existing user */
	$j('#'+ dropdown_id).bind('change', function() {
		
		$j('#'+ radio_id).attr("checked", "checked");

		highlightOneNotOther(dropdown_id, freetext_id);
		
		return false;
		
	});
		
}

function bindTextClear(clear_id, freetext_id, dropdown_id, options_list) {

	$j('#'+ clear_id).bind('click', function() {
	
		$j('#'+ freetext_id).val('');
		populateDropDown(dropdown_id, options_list, null, null);
		
		return false;
		
	});	
	
}

function bindRemove(remove_id, div_id) {

	$j('#'+ remove_id).bind('click', function() {
		$j('#'+ div_id).remove();
	
		return false;
	});

}




function populateDropDown(dropdown_name, dropdown_items, select_id, filter) {

	var dd = document.getElementById(dropdown_name);
	if (dd != null) {
		
		// clear current list
		$j('#'+dropdown_name).empty();
		
		// populate using list passed in/filter
		var dd_items = dropdown_items['options']

		// do case-insensitive filtering
		if (filter != null) {
			filter = filter.toLowerCase();
		}

		for (item_n = 0; item_n < dd_items.length; item_n++) {
		
			var item = dd_items[item_n];
			
			if (filter == null || item['text'].toLowerCase().indexOf(filter) > -1) {

				var def_selected = (select_id != '' && item['value'] == select_id) ? true : false;

				var option = new Option(item['text'] + '  (' + item['count'] + ')', item['text'], def_selected, def_selected);
				
				if ($j.browser.msie) {
					dd.add(option);
				} else {
					dd.add(option, null);
				}
			}
			
		}

	}
	
}


