// Modals
function open_modal(height, width, top, left) {
	show_underlay();
	var scroll_top = ($.browser.msie) ? document.documentElement.scrollTop : pageYOffset;
	if(top != null){
		$('#modal-window').css('top',parseInt(scroll_top + top) + 'px');
	}else{
		$('#modal-window').css('top',parseInt(scroll_top + 75) + 'px');
	}
	
	if(left != null){
		$('#modal-window').css('left',parseInt(left) + 'px');
	}else{
		$('#modal-window').css('left','33%');
	}
	
	if (height != null) {
		$('#modal-window').css('height',height);
	}
	if(width != null) {
		$('#modal-window').css('width',width);
	}
	show_modal();
}

function close_modal() {
	hide_underlay();
	$('#modal-window').removeClass();
	hide_modal();
}

function show_modal() {
	$('#modal-window').css('display','block');
}

function hide_modal() {
	$('#modal-window_bg').css('display','none');
	$('#modal-window').css('display','none');
}

function show_underlay() {
	$('#modal-underlay').css('display','block');
	
	var scrollHeight;
	if ($.browser.msie) {
		scrollHeight = Math.max(document.documentElement.offsetHeight, document.documentElement.scrollHeight);
	} else {
		scrollHeight = document.documentElement.scrollHeight;
	}
	
	// Safari?
	// if (document.childNodes && !document.all && !navigator.taintEnabled){ scrollHeight = document.body.scrollHeight;}

	$('#modal-underlay').css('height', scrollHeight + 'px');
}

function hide_underlay() {
	$('#modal-underlay').css('display','none');
}

function open_dialog(height) {
	var scroll = (window.ie) ? document.documentElement.scrollTop : pageYOffset;
	$('#modal-dialog').css('top',parseInt(scroll + 200) + 'px');
	if (height != null) {
		$('#modal-dialog').css('height',height);
	}

	$('#modal-dialog').css('display','block');
}

function close_dialog() {
	$('#modal-dialog').css('display','none');
}

function confirm_dialog(title,message,callback) {
	$('#modal-dialog h3').text(title);
	var html = '<div class="center">' + message + '</div><br/>';
	html += '<div class="center"><a href="javascript:void(0)" id="confirm_btn" onclick="close_dialog();close_modal();" class="btn">OK</a></div>';

	$('#modal-dialog div.modal-body').html(html);

	close_modal();
	show_underlay();
	open_dialog('100px',false);
	if (callback != null) {
		$('confirm_btn').addEvent('click',callback);
	}
}


//Modal Instances
function open_login(destination, username, error) {
	close_modal();
	name = unescape(name);
	$('#modal-window_bg').css('display','block');
	$('#modal-window').addClass('login_modal');
	$('#modal-window h3').html("Log in");

	var html = '<form action="/Login" method="POST">';
	html += '<div class="error">';
	if(error != null) {
		html += error;
	}
	html += '</div>';
	html += '<fieldset><label for="username">Username</label><input type="text" name="username" value="';
	html += (username != null)?username:'';
	html += '" /></fieldset>';
	html += '<fieldset><label for="password">Password</label><input type="password" name="password" /><div class="subtxt"><a target="_blank" href="https://meetings.idealliance.org/eseries/source/Library/FindPword.cfm?section=unknown&activesection=home&start=1">Forgot Password?</a></div></fieldset>';
	html += '<fieldset><input type="hidden" name="destination" value="'
	html += (destination != null)?destination:'/';
	html += '" /><input type="submit" value="" class="login_btn" /></fieldset>';
	html += '</form>';
	html += '<div class="register_link">Not Registered? <a href="#" onclick="register(); close_modal();">Register Now</a></div>';
	$('#modal-window div.modal-body').html(html);
	
	open_modal('245px', '230px', 60, 685);
	show_underlay();
}

function open_email(destination, subject, to, from, message, error) {
	close_modal();
	$('#modal-window').addClass('email_modal');
	$('#modal-window h3').html("<div class='text'>E-mail to a Friend</div><a href='javascript:void(0)' onclick='close_modal()'><div class='email_close' /></a>");

	var html = '<form id="emailForm" action="/referPage" method="POST">';
	
	html += '<div class="error">';
	if(error != null) {
		html += error;
	}
	html += '</div>';
	html += '<fieldset class="emailTo">';
	html += '<label for="emailTo">To:</label><span id="to_error"></span>';
	html += '<input id="emailTo" name="emailTo" value="';
	html += (to)?to:'Enter e-mail address of recipient';
	html += '" onfocus="clearInput(this)" onblur="clearInput(this)" />';
    html += '<p class="instruction">Multiple addresses may be entered but must be seperated with a comma</p>';
    html += '</fieldset>';
    html += '<fieldset class="emailFrom">';
    html += '<label for="emailFrom">From:</label><span id="from_error"></span>';
    html += '<input id="emailFrom" name="emailFrom" value="';
	html += (from)?from:'Enter your e-mail address';
	html += '" onfocus="clearInput(this)" onblur="clearInput(this)" />';
    html += '</fieldset>';
    html += '<fieldset class="emailSubject">';
    html += '<label for="displaySubject">Subject:</label>';
    html += '<input name="displaySubject" id="displaySubject" disabled="disabled" value="';
	html += (subject)?subject:'IDEAlliance: Referral';
	html += '" />';
	html += '<input type="hidden" id="emailSubject" name="emailSubject" value="'
	html += (subject)?subject:'IDEAlliance: Referral';
	html += '" />';
    html += '</fieldset>';
    html += '<fieldset class="emailMessage">';
    html += '<label for="emailMessage">Message:</label>';
    html += '<textarea  cols="30" rows="4" id="emailMessage" name="emailMessage" onfocus="clearInput(this)" onblur="clearInput(this)">'
	html += (message)?message:'I found this information on IDEAlliance interesting and decided to share it with you!';
	html += '</textarea>';
    html += '</fieldset>';		
    html += '<input type="hidden" name="destination" value="'
	html += (destination != null)?destination:'/';
	html += '" />';
	html += '<div class="buttonWrap">';
	html += '<a class="btn-gray" href="javascript:void(0)" onclick="close_modal()">Close</a>';
	html += '<a class="btn-blue" href="javascript:void(0)" onclick="$(\'#emailForm\').submit();">E-mail</a>';
    html += '</div>';
    html += '</form>';

	$('#modal-window div.modal-body').html(html);

	open_modal('472px', '400px', 175, 525);
	show_underlay();
}

function open_single_compose(to_id,to) {
	close_modal();
	to = unescape(to);
	$('#modal-window').addClass('mc_modal');
	$('#modal-window').addClass('compose_modal');
	
	var html = '<div class="outer"><div class="inner"><div class="mc_fields">';
	html += '<form id="send_msg" method="post" enctype="multipart/form-data" action="/communities/send_msg">';
	html += '<input type="hidden" name="to_id" id="to_id" value="' + to_id + '" />';
	html += '<input type="hidden" name="return_to" id="return_to" value="' + window.location + '" />';
	html += '<fieldset><label>To:</label> <span class="mc_names">' + to + '</span></fieldset>';
	html += '<fieldset><label for="subject">Subject: </label><input type="text" name="subject" id="subject" /></fieldset>';
	html += '<fieldset><textarea name="body" id="body"></textarea></fieldset>';
	html += '<div class="attachments">Attachments: <a href="javascript:void(0)" onclick="add_attachment()">Add an Attachment</a></div>';
	html += '<div class="buttons"><a href="javascript:void(0)" class="btn-gray close" onclick="close_modal()">Close</a> <a href="javascript:void(0)" class="btn-blue send" onclick="$(\'#send_msg\').submit()">Send</a></div>';
	html += '</form>';
	html += '</div></div></div>';

	$('#modal-window .modal-head').html('<div class="mc_close"><img src="/static/images/mc_modal_close.gif" alt="Close" onclick="close_modal()"/></div>');
	$('#modal-window .modal-body').html(html);
	open_modal('415px');
}

function open_multi_compose() {
	var ids = $("td.checkbox input:checkbox[checked]");
	var id_vals = [];
	for (var i = 0; i < ids.length; i++) {
		id_vals.push(ids[i].value);
	}
	var names = ids.next('input:hidden');
	var name_vals = [];
	for (var j = 0; j < names.length; j++) {
		name_vals.push(names[j].value);
	}
	if (id_vals.length) {
		close_modal();
		$('#modal-window').addClass('mc_modal');
		$('#modal-window').addClass('compose_modal');

		var html = '<div class="outer"><div class="inner"><div class="mc_fields">';
		html += '<form id="send_msg" method="post" enctype="multipart/form-data" action="/communities/send_msg">';
		html += '<input type="hidden" name="to_id" id="to_id" value="' + id_vals.join(',') + '" />';
		html += '<input type="hidden" name="return_to" id="return_to" value="' + window.location + '" />';
		html += '<fieldset><label>To:</label> <span class="mc_names">' + name_vals.join('; ') + '</span></fieldset>';
		html += '<fieldset><label for="subject">Subject: </label><input type="text" name="subject" id="subject" /></fieldset>';
		html += '<fieldset><textarea name="body" id="body"></textarea></fieldset>';
		html += '<div class="attachments">Attachments: <a href="javascript:void(0)" onclick="add_attachment()">Add an Attachment</a></div>';
		html += '<div class="buttons"><a href="javascript:void(0)" class="btn-gray close" onclick="close_modal()">Close</a> <a href="javascript:void(0)" class="btn-blue send" onclick="$(\'#send_msg\').submit()">Send</a></div>';
		html += '</form>';
		html += '</div></div></div>';

		$('#modal-window .modal-head').html('<div class="mc_close"><img src="/static/images/mc_modal_close.gif" alt="Close" onclick="close_modal()"/></div>');
		$('#modal-window .modal-body').html(html);
		open_modal('415px');
	}
}

function open_reply(id) {
	var to_id = $('#message_id').val();
	var to = unescape($('#from_name').val());
	close_modal();

	$('#modal-window').addClass('mc_modal');
	$('#modal-window').addClass('compose_modal');

	var html = '<div class="outer"><div class="inner"><div class="mc_fields">';
	html += '<form id="send_msg" method="post" enctype="multipart/form-data" action="/communities/send_msg">';
	html += '<input type="hidden" name="to_id" id="to_id" value="' + to_id + '" />';
	html += '<input type="hidden" name="return_to" id="return_to" value="' + window.location + '" />';
	html += '<fieldset><label>To:</label> <span class="mc_names">' + to + '</span></fieldset>';
	html += '<fieldset><label for="subject">Subject: </label><input type="text" name="subject" id="subject" /></fieldset>';
	html += '<fieldset><textarea name="body" id="body"></textarea></fieldset>';
	html += '<div class="attachments">Attachments: <a href="javascript:void(0)" onclick="add_attachment()">Add an Attachment</a></div>';
	html += '<div class="buttons"><a href="javascript:void(0)" class="btn-gray close" onclick="$(\'#message_' + id + '\').click()">Close</a> <a href="javascript:void(0)" class="btn-blue send" onclick="$(\'#send_msg\').submit()">Send</a></div>';
	html += '</form>';
	html += '</div></div></div>';

	$('#modal-window .modal-head').html('<div class="mc_close"><img src="/static/images/mc_modal_close.gif" alt="Close" onclick="close_modal()"/></div>');
	$('#modal-window .modal-body').html(html);
	open_modal('415px');

}

function open_multi_delete(type) {
	var ids = $("td.checkbox input:checkbox[checked]");
	var id_vals = [];
	for (var i = 0; i < ids.length; i++) {
		id_vals.push(ids[i].value);
	}

	close_modal();
	$('#modal-window').addClass('mc_modal');
	$('#modal-window').addClass('delete_modal');
	
	var html = '<div class="outer"><div class="inner"><div class="mc_fields">';
	html += '<form id="delete_msg" method="post" action="/communities/delete_msg">';
	html += '<input type="hidden" name="msg_id" id="type" value="' + id_vals.join(',') + '" />';
	html += '<input type="hidden" name="type" id="type" value="' + type + '" />';
	html += '<input type="hidden" name="return_to" id="return_to" value="' + window.location + '" />';
	html += '<h4>Delete Your Message(s)</h4>';
	html += '<p>Are you sure you want to delete the selected messages?</p>';
	html += '<div class="buttons"><a href="javascript:void(0)" class="btn-gray no" onclick="close_modal()">No</a> <a href="javascript:void(0)" class="btn-blue yes" onclick="$(\'#delete_msg\').submit()">Yes</a></div>';
	html += '</form>';
	html += '</div></div></div>';
	
	$('#modal-window .modal-head').html('<div class="mc_close"><img src="/static/images/mc_modal_close.gif" alt="Close" onclick="close_modal()"/></div>');
	$('#modal-window .modal-body').html(html);
	open_modal('130px');
}

function open_single_delete(type) {
	var id = $('#message_id').val();
	close_modal();
	$('#modal-window').addClass('mc_modal');
	$('#modal-window').addClass('delete_modal');
	
	var html = '<div class="outer"><div class="inner"><div class="mc_fields">';
	html += '<form id="delete_msg" method="post" action="/communities/delete_msg">';
	html += '<input type="hidden" name="msg_id" id="type" value="' + id + '" />';
	html += '<input type="hidden" name="type" id="type" value="' + type + '" />';
	html += '<input type="hidden" name="return_to" id="return_to" value="' + window.location + '" />';
	html += '<h4>Delete This Message</h4>';
	html += '<p>Are you sure you want to delete this message?</p>';
	html += '<div class="buttons"><a href="javascript:void(0)" class="btn-gray no" onclick="$(\'#message_' + id + '\').click()">No</a> <a href="javascript:void(0)" class="btn-blue yes" onclick="$(\'#delete_msg\').submit()">Yes</a></div>';
	html += '</form>';
	html += '</div></div></div>';

	$('#modal-window .modal-head').html('<div class="mc_close"><img src="/static/images/mc_modal_close.gif" alt="Close" onclick="close_modal()"/></div>');
	$('#modal-window .modal-body').html(html);
	open_modal('130px');
}

function open_read(message_id,from_id,from_name,date_sent,subject,body,attachments,type) {
	close_modal();

	var message_row = document.getElementById("messagerow_"+message_id);
	if(message_row && hasClass(message_row, 'new')){
		mark_as_read(message_id);
	}
	
	$('#modal-window').addClass('mc_modal');
	$('#modal-window').addClass('read_modal');
	var attachment_links = [];
	if (attachments != null) {
		for (var i = 0; i < attachments.length; i++) {
			attachment_links.push('<a href="' + attachments[i].url + '">' + unescape(attachments[i].filename) + '</a>');
		}
	}

	var html = '<div class="outer"><div class="inner"><div class="mc_fields">';
	html += '<input type="hidden" id="message_id" value="' + message_id + '" />';
	html += '<input type="hidden" id="from_id" value="' + from_id + '" />';
	html += '<input type="hidden" id="from_name" value="' + from_name + '" />';
	html += '<fieldset><label>From:</label> <span class="mc_names">' + unescape(from_name) + '</span></fieldset>';
	html += '<fieldset><label>Sent:</label> <span">' + unescape(date_sent) + '</span></fieldset>';
	html += '<fieldset><label>Subject: </label> <span>' + unescape(subject) + '</span></fieldset>';
	html += '<fieldset"><textarea readonly id="body">' + unescape(body) + '</textarea></fieldset>';
	html += '<div class="attachments">Attachments: ' + (attachment_links.length ? attachment_links.join(',') : 'None') + '</div>';
	html += '<div class="buttons"><div class="buttons-left"><a href="javascript:void(0)" class="btn-gray close" onclick="close_modal()">Close</a></div><div class="buttons-right"><a href="javascript:void(0)" class="btn-blue reply" onclick="open_reply(\'' + message_id + '\')">Reply</a><a href="javascript:void(0)" class="btn-blue delete" onclick="open_single_delete(\'' + type + '\')">Delete</a></div></div>';
	html += '</div></div></div>';

	$('#modal-window .modal-head').html('<div class="mc_close"><img src="/static/images/mc_modal_close.gif" alt="Close" onclick="close_modal()"/></div>');
	$('#modal-window .modal-body').html(html);
	open_modal('415px');
}

function open_upload_modal(committee_name,url) {
	close_modal();
	committee_name = unescape(committee_name);
	$('#modal-window').addClass('upload_modal');
	
	var html = '<div class="outer"><div class="inner"><div class="upload_fields">';
	html += '<form id="upload_doc" method="post" enctype="multipart/form-data" action="' + url + '">';

	html += '<div class="upload-group upload-first">';
	html += '<p>To upload a document, please follow these directions:</p>';
	html += '<div class="upload-item"><label for="document">Select a Document</label><div class="upload-field"><input type="file" name="document" id="document" /></div></div>';
	html +=	'<div class="upload-item"><label for="doc_title">Enter Document Title</label><p>Enter a title which is easily identifiable by community members</p><div class="upload-field"><input type="text" name="doc_title" id="doc_title" /></div></div>';
	html += '<div class="upload-item"><label for="doc_desc">Enter Document Description</label><p>Enter a thorough description of the document and its subject matter.</p><div class="upload-field"><textarea name="doc_desc" id="doc_desc"></textarea></div></div>';
	html +=	'<div class="upload-item"><label for="doc_author">Enter Author Name</label><p>Enter the first and last name of the document author.</p><div class="upload-field"><input type="text" name="doc_author" id="doc_author" /></div></div>';
	html += '<div class="upload-buttons upload-buttons-two"><a href="javascript:void(0)" class="btn-blue" onclick="upload_goto(this,\'second\')">Continue</a> <a href="javascript:void(0)" class="btn-gray close" onclick="close_modal()">Cancel</a></div>';
	html += '</div>';

	html += '<div class="upload-group upload-second">';
	html += '<h4>Select Document Characteristics</h4>';
	html += '<p>These features will help community members locate the documents.  Select all that apply.</p>';
	html += '<div class="upload-facets">';
	for (var i in facet_info) {
		var facet_group = facet_info[i];
		html += '<div class="upload-facets-col">';
		html += '<h4>' + facet_group.title + '</h4>';
		for (var j in facet_group.facets) {
			var facet = facet_group.facets[j];
			html += '<div><input class="cb facet_cb" type="checkbox" name="facets" id="' + j + '" value="' + j + '" /> <label for="' + j + '">' + facet + '</label></div>';
		}
		html += '</div>';
	}
	html += '</div>';
	html += '<div class="upload-forums">';
	html += '<h4>Create a Discussion Topic (Optional)</h4>';
	html += '<p>Each document may have an associated discussion created. If you are interested in creating an exclusive forum topic for community members to comment and discuss this document, please select the checkbox below.</p>';
	html += '<div class="upload-forums-cb"><input class="cb" type="checkbox" name="add_topic" id="add_topic" value="true" onclick="upload_toggle_forum()" /> <label for="add_topic">Create a Discussion Forum</label></div>';
	html += '<div class="upload-forum-info">';
	html += '<div class="upload-forum-section">';
	html += '<h4>Forum Topic</h4>';
	html += '<p>The forum topic should reflect the document subject matter or initiate a response about the document (i.e, answer a question, gather feedback).</p>';
	html += '<div class="upload-field"><input type="text" name="upload_topic" id="upload_topic" /></div>';
	html += '</div>';
	html += '<div class="upload-forum-section">';
	html += '<h4>Forum Location</h4>';
	html += '<p>Select the discussion forum in which your forum topic will reside.</p>';
	html += '<div class="upload-field"><select name="upload_forum" id="upload_forum">';
	html += '<option value="">Select a Discussion Forum</option>';
	for (var k in forum_info) {
		html += '<option value="' + k + '">' + forum_info[k] + '</option>';
	}
	html += '</select></div>';
	html += '</div></div></div>';
	html += '<div class="upload-buttons upload-buttons-three"> <a href="javascript:void(0)" class="btn-gray" onclick="upload_goto(this,\'first\')">Back</a> <a href="javascript:void(0)" class="btn-blue" onclick="upload_goto(this,\'third\')">Continue</a> <a href="javascript:void(0)" class="btn-gray close" onclick="close_modal()">Cancel</a></div>';
	html += '</div>';

	html += '<div class="upload-group upload-third">';
	html += '<h4>Document Details</h4>';
	html += '<p>Please review the document details. If any information needs to be modified, select \'Back\'. If all information is accurate, select \'Continue\' to confirm.</p>';
	html += '<div class="upload-item">';
	html += '<div class="upload-review-item"><strong>Document Title</strong> <span id="doc_title_val">None</span></div>';
	html += '<div class="upload-review-item"><strong>Author</strong> <span id="doc_author_val">None</span></div>';
	html += '<div class="upload-review-item-spaced"><strong>Document File</strong> <span id="document_val">None</span></div>';
	html += '<div class="upload-review-item-spaced"><strong>Description</strong> <span id="doc_desc_val">None</span></div>';
	html += '<div class="upload-review-item-spaced"><strong>Characteristics</strong> <span id="char_val">None</span></div>';
	html += '<div class="upload-review-item-spaced"><strong>Discussion Topic</strong> <span id="disc_val">None</span></div>';
	html += '</div>';
	html += '<p class="error hidden"></p>';
	html += '<div class="upload-buttons upload-buttons-three"> <a href="javascript:void(0)" class="btn-gray" onclick="upload_goto(this,\'second\')">Back</a> <a href="javascript:void(0)" class="btn-blue" id="upload_button" onclick="$(\'#upload_doc\').submit()">Continue</a> <a href="javascript:void(0)" class="btn-gray close" onclick="close_modal()">Cancel</a></div>';
	html += '</div>';


	html += '</form>';
	html += '</div></div></div>';

	$('#modal-window .modal-head').html('<div class="upload_text">' + committee_name + ' Committee Upload Tool</div><div class="upload_close"><img src="/static/images/mc_modal_close.gif" alt="Close" onclick="close_modal()"/></div>');
	$('#modal-window .modal-body').html(html);
	open_modal('515px',null,20);

}

// Utility

function add_attachment() {
	var random = new Date().valueOf();
	var att = $('div.compose_modal .attachments');
	att.append('<div id="att_holder_' + random +'"><input type="file" name="attachment_' + random + '" /> <img src="/static/images/mc_modal_close.gif" alt="Remove" onclick="delete_attachment(\'' + random + '\')"/></div>');
}

function delete_attachment(id) {
	$('#att_holder_' + id).remove();
}

function upload_goto(button,page) {
	if (page == 'third') {
		validate_upload_form();
	}


	$(button).parents('div.upload-group').hide();
	$('div.upload-' + page).show();
}

function upload_toggle_forum() {
	if ($('#add_topic').attr('checked')) {
		$('div.upload-forum-info').show();
	} else {
		$('div.upload-forum-info').hide();
	}
}

function validate_upload_form() {
	var file = $('#document').val();
	var title = $('#doc_title').val();
	var desc = $('#doc_desc').val();
	var author = $('#doc_author').val();
	var facets = $('input.facet_cb:checked').next('label');
	var characteristics = [];
	for (var i = 0; i < facets.length; i++) { characteristics.push(facets[i].innerHTML); }
	var add_topic = $('#add_topic').attr('checked');
	var upload_topic = $('#upload_topic').val();
	var upload_forum = $('#upload_forum').val();


	var valid = true;
	var error_fields = [];
	if (file == '') {
		valid = false;
		error_fields.push('Document');
	} else {
		$('#document_val').text(file.match(/([^\/\\]+)$/g)[0]);
	}

	if (title == '') {
		valid = false;
		error_fields.push('Document Title');
	} else {
		$('#doc_title_val').text(title);
	}
	if (desc == '') {
		valid = false;
		error_fields.push('Document Description');
	} else {
		$('#doc_desc_val').text(desc);
	}
	if (author == '') {
		valid = false;
		error_fields.push('Author Name');
	} else {
		$('#doc_author_val').text(author);
	}
	if (characteristics.length == 0 && facets.length > 0) {
		valid = false;
		error_fields.push('Document Characteristics');
	} else {
		$('#char_val').text(characteristics.join(', '));
	}
	if (add_topic) {
		if (upload_topic == '') {
			valid = false;
			error_fields.push('Forum Topic');
		} else {
			$('#disc_val').text('Created');
		}
		if (upload_forum == '') {
			valid = false;
			error_fields.push('Forum');
		} else {
			$('#disc_val').text('Created');
		}
	} else {
		$('#disc_val').text('Not Being Created');
	}

	if (valid) {
		$('div.upload-third p.error').hide();
		$('#upload_button').show();
	} else {
		$('#upload_button').hide();
		var error_msg = 'The following fields must be filled out before uploading your Document: ' + error_fields.join(', ') + '.  Please use the \'Back\' button to go back and make changes';
		$('div.upload-third p.error').text(error_msg).show();
	}
}
