/*
===============================================================
CommentPress Javascript
===============================================================
ORIGINAL AUTHOR	: Eddie Tejeda
AUTHOR			: Christian Wach <needle@haystack.co.uk>
LAST MODIFIED	: 16/07/2009
DEPENDENCIES	: jquery.js
---------------------------------------------------------------
NOTES

This script is included when the CommentPress theme is NOT active

---------------------------------------------------------------
*/



// When the page is ready
$(document).ready( function() {

	/*
	------------------------------------------------------------------
	First, we need to check for the existence of #respond, because
	unless we have a comment form, there's not much point doing anything
	
	// init respond exists
	var respond_exists = false;
	
	// quietly check for the existence of #respond
	$('#respond').each( function(i) {

		// we've got one
		respond_exists = true;

	});
	
	// unless we have a comment form, there's not much point going any further
	if ( respond_exists ) {
	
	------------------------------------------------------------------
	*/
	
	
	
	
	
		// set scroll offset for page elements
		var scrollOffset = 5;
		
		// set context
		$.set_context( 'external' );
	
	
	
	
	
	
		/** 
		 * @description: Kubrick uses #page to centre the page - let's override it and place it to the left
		 * This is quite a nice way to do this, as it doesn't throw an error if #page doesn't exist
		 * @todo: 
		 *
		 */
		$('#page').each( function(i) {
	
			// set page to left
			$(this).css( 'margin-left', '20px' );
		
		});
	
	
	
	
	
	
		/*
		==================================================================
		DOM Manipulation
		==================================================================
		
		We want to recreate the comments section as a floating block...
		
		==================================================================
		*/
		
		// create accordion container
		$("body").append('<div id="accordion"></div>');
		
	
	
	
		
		
		/*
		------------------------------------------------------------------
		First, build comments with no signature, which are comments on the
		page as a whole.
		------------------------------------------------------------------
		*/
		
		// create "Whole Page" comment container
		$("#accordion").append(
		
			'<div id="comment-block-">'+
				'<h6 class="comment_block"><a id="comment-" href="#">Whole Page (' + comment_counts[0] + ')</a></h6>'+
				'<div id="comment-group-wrapper-" style="height: 100% !important; padding: 5px !important;">'+
					'<ol class="subcommentlist" id="comment-group-">'+
					'</ol>'+
				'</div>'+
			'</div>'
			
		);		
	
		// loop through array as written into page
		for ( var j in top_level_comments ) {
		
			// do we have a signature?
			if( top_level_comments[j] == '' ) {
			
				// add that comment and its children to the accordion
				$('#comment-group-').append( $('#comment-' + j) );
			
			}
			
		}
		
		// remove the respond div from the visible flow of the page
		$('#respond').appendTo('#comment-group-');
	
		// add hidden input with text signature as value (initially empty)
		$('#respond form').append( 
		
			'<input type="hidden" id="text_signature" name="text_signature" value="" />'
			
		);
		
	
	
	
	
	
		/*
		------------------------------------------------------------------
		Build comment blocks for paragraphs
		------------------------------------------------------------------
		
		Eddie's notes:
		
		This is not the most efficient way to do this, but it works all right. 
		we go through each paragraph and see which of the comment signatures, 
		found in top_level_comments, matches and we put that comment in 
		the right place.
		
		------------------------------------------------------------------
		*/
	
		$('.commenticon').each( function(i) {
			
			// paragraphs start with index of 1
			var paragraph = i + 1;
			
			// create the paragraph comment block
			$("#accordion").append(
			
				'<div id="comment-block-' + paragraph + '">'+
					'<h6><a class="comment_block" id="comment-'+ text_signatures[i] + '" href="#">'+
						'Paragraph '+ paragraph +' (' + comment_counts[paragraph] + ')'+
					'</a></h6>'+
					'<div  id="comment-group-wrapper-'+ text_signatures[i] + '" style="height: 100% !important; padding: 5px !important;">'+
						'<ol class="subcommentlist" id="comment-group-'+ text_signatures[i] +'">'+
						'</ol>'+
					'</div>'+
				'</div>'
				
			);
			
	
	
	
			// run through top level comments...
			for ( var j in top_level_comments ) {
			
				// get percentage of string similarity between signature and comment icon ID
				var percent_similar = $.similar_string( 
				
					top_level_comments[j], 
					$(this).attr('id') 
					
				);
				
				// is it above 90% confidence?
				if( percent_similar > 90 ) {
				
					// add that comment and its children to the accordion
					$('#comment-group-'+ text_signatures[i]).append( $('#comment-' + j) );
				
				}
				
			}
			
		});
	
		
		
	
	
	
		/*
		------------------------------------------------------------------
		Finish up...
		------------------------------------------------------------------
		*/
	
		// if there are no comments...
		if( !$('#comments').length ) {
			
			// create a comment div anyway
			$('body').append("<div id='comments'></div>");
			
		}
	
	
	
		// init params
		var user_buttons = '';
		var resizable = '';
	
		// get params
		if( allow_users_to_iconize != 0 ){ user_buttons += 'i,'; }
		if( allow_users_to_minimize != 0 ){ user_buttons += 'm';	}
		if( allow_users_to_resize != 0 ){ resizable = 'resizable '; }
	
	
	
		// wrap the existing comment elements with our new html, which will be the floating box
		$('#comments, .commentlist').wrapAll(
		
			'<div id="commentbox" class="container ' + resizable + default_skin + '"  buttons="' + user_buttons + '">'+
				'<div id="commentwindow">'+
				'</div>'+
			'</div>'
		);
		
		// attach our generated html to the page body
		$('#commentbox').appendTo('body');
		
		// define basic commentbox
		$('#commentbox').html(
			
			'<table cellpadding="0" cellspacing="0" class="containerTable">'+"\n"+
				'<tr class="top">'+"\n"+
					'<td class="no">&nbsp;</td>'+"\n"+
					'<td class="n"><span id="commentboxtitle"></span></td>'+"\n"+
					'<td class="ne">&nbsp;</td>'+"\n"+
				'</tr>'+"\n"+
				'<tr unselectable="on" class="middle">'+"\n"+
					'<td class="o">&nbsp;</td>'+"\n"+
					'<td class="c" id="comment_contents"></td>'+"\n"+
					'<td class="e">&nbsp;</td>'+"\n"+
				'</tr>'+"\n"+
				'<tr class="bottom">'+"\n"+
					'<td class="so">&nbsp;</td>'+"\n"+
					'<td class="s"></td>'+"\n"+
					'<td class="se">&nbsp;</td>'+"\n"+
				'</tr>'+"\n"+
			'</table>'+"\n\n"
		);
		
		// append accordion container to comment contents
		$("#accordion").appendTo("#comment_contents");
	
	
	
		// load comment box position
		$.load_position(
		
			default_top_position,
			default_left_position,
			allow_users_to_save_position
	
		);
		
	
	
		// load comment box size
		$.load_size( 
		
			default_height,
			default_width, 
			allow_users_to_resize
	
		);
		
	
	
		// define accordion behaviour
		$("#accordion").accordion({
		
			header: "h6",
			active: false,
			autoheight: false,
			alwaysOpen: false,
			animated: false,
			collapsible: true
			
		});
	
		// do not activate any content
		//$('#accordion').accordion( 'activate', -1 );
		
		
		
		// set height of textarea
		$("textarea").attr('rows', 10);
		
	
	
		// build the comment area
		$(".container").buildContainers();
		
	
	
		// reset scrollable pane to (0,0)
		$('div.containerBody').scrollTo( 0 );
		
		// reset the screen to (0,0)
		$.scrollTo( 0 ); 
	
	
	
		// if there is an anchor, scroll to it, nicely.
		var url = document.location.toString();
		
		// do we have a comment permalink?
		if ( url.match('#comment-' ) ) {
		
			// get comment ID
			var comment_id = url.split('#comment-')[1];
			
			// get text signature
			var text_signature = all_approved_comments[comment_id];
			
			//alert(sig);
	
			// get text block
			var textblock = $("#textblock-" + text_signature);
	
			// highlight it
			$.highlight_text( textblock );
			
			// scroll body to top of textblock with no delay
			$.scrollTo( textblock.position().top - scrollOffset, 0 );
			
			// get accordion block
			var accordion_block = text_signatures.indexOf(text_signature) + 1;
	
			// move the respond div
			$.move_comment_form( text_signature );
			
			// open accordion
			$('#accordion').accordion(
			
				// open the corresponding section
				'activate', accordion_block
				
			);
			
			// Scroll initially if there's a hash (#something) in the url 
			$.localScroll.hash({
				target: '.containerBody', // Could be a selector or a jQuery object too.
				duration: 0
			});
			
		}
	
	
	
	
	
	
	
		/*
		==================================================================
		Events
		==================================================================
		*/
	
		/** 
		 * @description: clicking on the little comment icon by the main text
		 * @todo: 
		 *
		 */
		$(".commenticon").click( function(e) {
	
			// get the text signature for this icon
			var text_signature = $(this).attr('id');
	
			// get text block
			var textblock = $("#textblock-" + text_signature);
	
			// highlight
			$.unhighlight_text();
			$.highlight_text( textblock );
			
			// scroll
			$.scrollTo( textblock.position().top - scrollOffset, 1000 );
			
			// get active section
			var active = $('#accordion').accordion('option', 'active');
			
	
	
			// if it's not our section
			if ( active != ($(".commenticon").index(this) + 1) ) {
	
				// move the respond div
				$.move_comment_form( text_signature );
		
				// set accordion params
				$('#accordion').accordion(
				
					// set the section corresponding to this icon as active
					'option', 'active', ($(".commenticon").index(this) + 1)
					
				);
			
				// open accordion
				$('#accordion').accordion(
				
					// open the section corresponding to this icon
					'activate', ($(".commenticon").index(this) + 1)
					
				);
			
			}
	
		});
	
	
	
		/** 
		 * @description: clicking on the accordion header
		 * @todo: 
		 *
		 */
		$(".comment_block").click( function(e) {
	
			// clear highlight
			$.unhighlight_text();
	
	
	
			// get active section
			var active = $('#accordion').accordion('option', 'active');
			
			// if it's our section
			if ( active == $('.comment_block').index(this) ) {
	
				// set accordion active to false
				var active_section = false;
				
			} else {
			
				// set accordion active to this
				var active_section = $('.comment_block').index(this);
				
			}
		
			// set accordion params
			$('#accordion').accordion(
			
				// set the section corresponding to this icon as active
				'option', 'active', active_section
				
			);
			
	
	
			// if this is the accordion header...
			if( $('.comment_block').index(this) == 0) {
	
				// selecting "whole page"
				$.scrollTo( $('.post').position().top - scrollOffset, 1000);
				
				// set empty text sig
				var text_signature = '';
	
			} else {
	
				// get text signature
				var text_signature = $(this).attr('id').substring(8);
				
				// get text block
				var textblock = $("#textblock-" + text_signature);
				
				// only highlight if opening a paragraph section
				if ( active_section !== false ) {
	
					// highlight text
					$.highlight_text( textblock );
				
				}
				
				// scroll
				$.scrollTo( textblock.position().top - scrollOffset, 1000 );
				
			}
	
	
	
			// move the respond div
			$.move_comment_form( text_signature );
			//addComment.moveFormToPara( active_section, text_signature );
			
		});
	
	
	
		/** 
		 * @description: disable browser default behaviour when clicking on a comment permalink
		 * @todo: 
		 *
		 */
		$(".comment-meta a").click( function(e) {
		
			// if there is an anchor, scroll to it, nicely.
			var url = this.href.toString();
			
			// do we have a comment permalink?
			if ( url.match('#comment-' ) ) {
			
				// get comment ID
				var comment_id = url.split('#comment-')[1];
				
				// scroll to comment nicely
				$('.containerBody').scrollTo( $('#comment-' + comment_id), {duration: 1000} );
				
			}
		
			// --<
			return false;
	
		});
	
	
	
		/** 
		 * @description: clicking a random area in the screen
		 * @todo: 
		 *
		 */
		$(window).click( function(event) {
			
			var target = event.target;
	
			if( $(target).attr('id') == 'wrapper' || $(target).attr('class') == 'textblock') {
				$.unhighlight_text();
			}		
			
		});
	
	
	
		// enable focus on click
		$('input, textarea').click( function(e) {
			$(this).focus();
		});
	
	
		
		// are we allowing dragging?
		if( allow_users_to_drag != 0 ) {
			
			// show special cursor
			$('.top').css( 'cursor', 'move' );
		
			// make box draggable
			$('#commentbox').draggable({
			
				// what can be dragged?
				handle: '.top',
				
				// what happens on stop
				stop: function() {
				
					// if users can save position...
					if( allow_users_to_save_position != 0 ) {
					
						// save it
						$.save_position(); 
						
					}
					
				}
				
			});
			
		}
	
		
	
		// are we allowing resizing?
		if( allow_users_to_resize != 0 ) {
		
			// bind the stop event
			$('#commentbox').bind('resizestop', function( event, ui ) {
			
				// save size
				$.save_size(); 
				
			});
			
		}
		
		
		
	
	//} // end check for comment form


	

});