/* 
// Document: WLL Wall Animation Class
// Author: Tom Belknap
// Description: provides active content on pages to prevent page refreshes when commenting
//     This version creates a OOP class from which our functions can be pulled.
// Date: December 18th, 2009
// Requires: Scriptaculous libraries V1.8.3
*/ 


// Class declaration:
function wllWall_class() {
	this.pageVars = getUrlVars();
}

wllWall_class.prototype.wllWA_Comment = function(post, url) {
	var target = document.getElementById('wall'+post);
	
	// Do we already have a comment field? If so, bypass it:
	var testform = document.getElementById('wallcommform');
	if(testform == null) {
		// Are we in Chromium or some other browser that works properly?
		var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1;
		// Build form elements
		var form = document.createElement('FORM');
		form.setAttribute('method', 'post');
		form.setAttribute('action', window.location.href);
		form.setAttribute('name', 'wallcommform');
		form.setAttribute('id', 'wallcommform');
		if(!is_chrome) {
			form.setAttribute('style', 'display:none');
		}
		// processcom hidden field
		var processcom = document.createElement('INPUT');
		processcom.setAttribute('type', 'hidden');
		processcom.setAttribute('value', '1');
		processcom.setAttribute('name', 'processcom');
		// WallID hidden field
		var WallID = document.createElement('INPUT');
		WallID.setAttribute('type', 'hidden');
		WallID.setAttribute('value', post);
		WallID.setAttribute('name', 'WallID');
		// myaccountcommentformfield div
		var myaccountcommentformfield = document.createElement('DIV');
		myaccountcommentformfield.setAttribute('id', 'myaccountcommentformfield');
		// WallCommentText textarea form element
		var WallCommentText = document.createElement('TEXTAREA');
		WallCommentText.setAttribute('name', 'WallCommentText');
		WallCommentText.setAttribute('id', 'WallCommentText');
		WallCommentText.setAttribute('class', 'comment');
		WallCommentText.setAttribute('cols', '45');
		WallCommentText.setAttribute('rows', '3');
		WallCommentText.setAttribute('style', 'color: #aaa;');
		WallCommentText.innerHTML = 'Respond to this!';
			// Error checking and character counting events
			addEvent(WallCommentText, 'blur', function() { wll.dTextOnBlur(this); });
			addEvent(WallCommentText, 'focus', function() { wll.dTextOnFocus(this); });
			addEvent(WallCommentText, 'keyup', function() { wll.limitText(this, document.getElementById('commCount'), 500); });
		// Wrapper div for submit and cancel buttons
		var myaccountcenterrightbutton = document.createElement('DIV');
		myaccountcenterrightbutton.setAttribute('id', 'myaccountcenterrightbutton');
		// Character Counting Div and Input:
		var charCount = document.createElement('DIV');
		charCount.setAttribute('id', 'commentcount');
		charCount.setAttribute('class', 'countdown');
		var commCount = document.createElement('INPUT');
		commCount.setAttribute('readonly', 'readonly');
		commCount.setAttribute('type', 'text');
		commCount.setAttribute('name', 'commCount');
		commCount.setAttribute('id', 'commCount');
		commCount.setAttribute('size', '2');
		commCount.setAttribute('value', '500');
		charCount.innerHTML = '500 character limit - <input readonly type="text" name="commCount" id="commCount" size="2" value="500">characters left.';
		// Submit button
		var submitb = document.createElement('INPUT');
		submitb.setAttribute('type', 'button');
		submitb.setAttribute('value', 'Comment');
		addEvent(submitb, 'click', function() { wll.checkComment(document.getElementById('WallCommentText')) });
		// Cancel button: destroys form if poster changes mind
		var cancelb = document.createElement('INPUT');
		cancelb.setAttribute('type', 'button');
		cancelb.setAttribute('name', 'Cancel');
		cancelb.setAttribute('value', 'Cancel');
		// Add the hideComment() function to the cancel button:
		addEvent(cancelb, 'click', function() { wll.hideComment(); });
		var spacer = document.createElement('DIV');
		spacer.setAttribute('style','display: inline; width: 10px;');
		spacer.innerHTML = '&nbsp;';
		/* Add an achor to the form to push the window down:
		var anch = document.createElement('A');
		anch.setAttribute('name', 'commform'+post);
		anch.setAttribute('id', 'commform'+post); */
		
		// Tuck 'em in, say goodnight:
		myaccountcenterrightbutton.appendChild(cancelb);
		myaccountcenterrightbutton.appendChild(spacer);
		myaccountcenterrightbutton.appendChild(submitb);
		myaccountcommentformfield.appendChild(WallCommentText);
		myaccountcommentformfield.appendChild(myaccountcenterrightbutton);
		myaccountcommentformfield.appendChild(charCount);
		form.appendChild(processcom);
		form.appendChild(WallID);
		form.appendChild(myaccountcommentformfield);
		
		// Finally, the target div:
		target.appendChild(form);
		//window.location = '#commform'+post;
		// Scriptaculous effects to animate the form (Effect.appear)
		//     and scroll to the comment form
		if(!is_chrome) {
			Effect.Appear('wallcommform', { duration: 1.2 });
		}
		Effect.ScrollTo('w'+post, { duration: 1.2, offset: -10 });
	}
}


wllWall_class.prototype.hideComment = function() {
	Effect.Fade('wallcommform', { duration: 1.2, afterFinish:wll.destroyComment });
	//var comment = document.getElementById('wallcommform');
	//elm.removeChild(comment);
}

wllWall_class.prototype.destroyComment = function() {
	//Effect.Fade('wallcommform', { duration: 3.0, afterFinish: destroyComment(elm) });
	var comment = document.getElementById('wallcommform');
	var parent = comment.parentNode;
	parent.removeChild(comment);
}

wllWall_class.prototype.toggleComment = function(post, url) {
	var comment = document.getElementById('wallcommform');
	if(comment == null) {
		wll.wllWA_Comment(post, url); 
	} else {
		wll.hideComment();
	}
}


// revealSpan allows text to be hidden with only a small sample visible.
wllWall_class.prototype.revealSpan = function(span) {
	if (span.style.display != 'inline') {
		span.style.display = 'inline';
		btn = document.getElementById('reveal' + span.id);
		btn.innerHTML = '&laquo;&nbsp;less';
	} else {
		span.style.display = 'none';
		btn = document.getElementById('reveal' + span.id);
		btn.innerHTML = '&raquo;&nbsp;more';
	}
}



/*//////////////////////////////////////////////////////////////////////
//                                                                    //
//  onFocus/onBlur functions for comment and wall post fields.        //
//      Provide the ability to add default text to a textarea and     //
//      have that text disappear when the user clicks in the form.    //
//                                                                    //
//////////////////////////////////////////////////////////////////////*/

wllWall_class.prototype.dTextOnBlur = function(field) {
	var wallDefault = 'Ask a question, post a comment or just share your thoughts...';
	var commDefault = 'Respond to this!';
	var custservDefault = 'Ask customer service a question...';
	var value = field.value;
	if ((value == '') || (value == wallDefault) || (value == commDefault) || (value == custservDefault)) {
		var fieldClass = field.getAttribute('class');
		if (fieldClass == 'comment') {
			field.value = commDefault;
		} else if (fieldClass == 'custserv') {
			field.value = custservDefault;
		} else {
			field.value = wallDefault;
		}
		/*(fieldClass == 'comment') ? field.value = commDefault : field.value = wallDefault; */
	}
	field.style.color = '#aaaaaa';
}

wllWall_class.prototype.dTextOnFocus = function(field) {
	var wallDefault = 'Ask a question, post a comment or just share your thoughts...';
	var commDefault = 'Respond to this!';
	var custservDefault = 'Ask customer service a question...';
	var value = field.value;
	if ((value == wallDefault) || (value == commDefault) || (value == custservDefault)) {
		field.value = '';
	}
	field.style.color = '#222222';
}


wllWall_class.prototype.limitText = function(limitField, limitCount, limitNum) {
	if (limitField.value.length > limitNum) {
		limitField.value = limitField.value.substring(0, limitNum);
	} else {
		limitCount.value = limitNum - limitField.value.length;
	}
}

wllWall_class.prototype.checkPost = function(field) {
	var val = field.value;
	// There is either nothing to post or else default text in the form
	if((typeof(val) == 'undefined') || (val == 'Ask a question, post a comment or just share your thoughts...')) {
		Effect.Pulsate(field.id, { pulses:2, duration:1.0 });
	} else {
		document.wallpostform.submit();
	}
}

wllWall_class.prototype.checkComment = function(field) {
	var val = field.value;
	// There is either nothing to post or else default text in the form
	if((typeof(val) == 'undefined') || (val == 'Respond to this!test')) {
		Effect.Pulsate(field.id, { pulses:2, duration:1.0 });
	} else {
		document.wallcommform.submit();
	}
}

// Animate news sections: reveal the full article
// revealSpan allows text to be hidden with only a small sample visible.
function revealSpan(span) {
	if (span.style.display != 'inline') {
		span.style.display = 'inline';
		btn = document.getElementById('reveal' + span.id);
		btn.innerHTML = '&laquo;&nbsp;less';
	} else {
		span.style.display = 'none';
		btn = document.getElementById('reveal' + span.id);
		btn.innerHTML = '&raquo;&nbsp;more';
	}
}

/*//////////////////////////////////////////////////////////////////
//                                                                //
// Utility functions: non-object functions for general use:       //
//                                                                //
//////////////////////////////////////////////////////////////////*/

// addEvent: allows for unobtrusive JS.  Can be called to insert functions onto page where required.
if (typeof(addEvent) != 'function') {
	function addEvent(elm, evType, fn, useCapture) {
	    elm["on"+evType]=fn;return;
	}
}

// getUrlVars grabs variables from the GET and returns them as an associative array
if (typeof(getUrlVars) != 'function') {
	function getUrlVars(){
	var vars = [], hash;
	var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
		for(var i = 0; i < hashes.length; i++){
			hash = hashes[i].split('=');
			vars.push(hash[0]);
			vars[hash[0]] = hash[1];
		}
	return vars;
	}
}

// getElementsByClassName: extends and unifies this poorly-implemented function
document.getElementsByClassName = function(clsName){
	var retVal = new Array();
	var elements = document.getElementsByTagName("*");
	for(var i = 0;i < elements.length;i++){
		if(elements[i].className.indexOf(" ") >= 0){
			var classes = elements[i].className.split(" ");
			for(var j = 0;j < classes.length;j++){
				if(classes[j] == clsName)
					retVal.push(elements[i]);
			}
		}
		else if(elements[i].className == clsName)
			retVal.push(elements[i]);
	}
	return retVal;
}



// Bootstrap function to launch a new instance of the Wall Animation class
function wll_wall_anim_bootstrap() {
	wll = new wllWall_class();
/*	var postSubmit = document.getElementById('postSubmit');
	addEvent(postSubmit, 'click', function() { wll.checkPost(document.getElementById('newpost')); });
	var newpost = document.getElementById('newpost');
	addEvent(newpost, 'blur', function() { wll.dTextOnBlur(this); });
	addEvent(newpost, 'focus', function() { wll.dTextOnFocus(this); });
	addEvent(newpost, 'keyup', function() { wll.limitText(this, document.getElementById('countdown'), 500); }); */
}



addEvent(document, 'load', wll_wall_anim_bootstrap());