// add load events
addLoadEvent(toggleComment);
addLoadEvent(commentPreview);


// this function creates a link to toggle the size of the comment textarea

function toggleComment(){
	
	// if browser doesn't support this method, return false
	if(!document.getElementById) return false;
	
	// create the anchor content and element
	var linkText = document.createTextNode('Make textarea bigger');
	var toggleLink = document.createElement('a');
	toggleLink.href = 'javascript:void(null)';
	toggleLink.appendChild(linkText);
	
	//create a paragraph element for the anchor to live in
	var linkPara = document.createElement('p');
	linkPara.setAttribute('id','toggle');
	linkPara.appendChild(toggleLink);
	
	// Get a reference to the comment input and it's parent fieldset
	var commentArea = document.getElementById('text');
	var commentFieldset = commentArea.parentNode.parentNode;
	
	//place the paragraph element at the end of the comment fieldset
	commentFieldset.appendChild(linkPara);
	
	// set the callback function
	toggleLink.onclick = function(){
		var theText = this.firstChild;
		var newText;
		var commentField = document.getElementById('text');
		
		if(theText.nodeValue == 'Make textarea bigger'){
			// make the height of the comment input bigger
			//commentField.setAttribute('class','bigComment');
			commentField.style.height = '300px';
			
			// I was origionally setting the nodevalue of the anchor text.
			// however the size of the node wasn't changing, so I figured I'd have to
			// use the replace child method instead
			newText = document.createTextNode('Make textarea smaller');
			this.replaceChild(newText,theText);
			
		} else {
			// return the comment input to it's default html size
			// rather than directly changing the size, it would probably be better
			//to change the class. Thus seporating the display from the logic
			//commentField.setAttribute('class','smallComment');
			commentField.style.height = '100px';
			newText = document.createTextNode('Make textarea bigger');
			this.replaceChild(newText,theText);
			
		}

	}
		
}

/*
   This function is from Jeff Minard - http://www.creatimation.net/
    adapted from code by Stuart Langridge at http://www.kryogenix.org/
 */
 
function superTextile(s) {
    var r = s;
    // quick tags first
    qtags = [['\\*', 'strong'],
             ['\\?\\?', 'cite'],
             ['\\+', 'ins'],  //fixed
             ['~', 'sub'],   
             ['\\^', 'sup'], // me
             ['@', 'code']];
    for (var i=0;i<qtags.length;i++) {
        ttag = qtags[i][0]; htag = qtags[i][1];
        re = new RegExp(ttag+'\\b(.+?)\\b'+ttag,'g');
        r = r.replace(re,'<'+htag+'>'+'$1'+'</'+htag+'>');
    }
    // underscores count as part of a word, so do them separately
    re = new RegExp('\\b_(.+?)_\\b','g');
    r = r.replace(re,'<em>$1</em>');
	
	//jeff: so do dashes
    re = new RegExp('[\s\n]-(.+?)-[\s\n]','g');
    r = r.replace(re,'<del>$1</del>');

    // links
    re = new RegExp('"\\b(.+?)\\(\\b(.+?)\\b\\)":([^\\s]+)','g');
    r = r.replace(re,'<a href="$3" title="$2">$1</a>');
    re = new RegExp('"\\b(.+?)\\b":([^\\s]+)','g');
    r = r.replace(re,'<a href="$2">$1</a>');

    // images
    re = new RegExp('!\\b(.+?)\\(\\b(.+?)\\b\\)!','g');
    r = r.replace(re,'<img src="$1" alt="$2">');
    re = new RegExp('!\\b(.+?)\\b!','g');
    r = r.replace(re,'<img src="$1">');
    
    // block level formatting
	
		// Jeff's hack to show single line breaks as they should.
		// insert breaks - but you get some....stupid ones
	    re = new RegExp('(.*)\n([^#\*\n].*)','g');
	    r = r.replace(re,'$1<br />$2');
		// remove the stupid breaks.
	    re = new RegExp('\n<br />','g');
	    r = r.replace(re,'\n');
	
    lines = r.split('\n');
    nr = '';
    for (var i=0;i<lines.length;i++) {
        line = lines[i].replace(/\s*$/,'');
        changed = 0;
        if (line.search(/^\s*bq\.\s+/) != -1) { line = line.replace(/^\s*bq\.\s+/,'\t<blockquote>')+'</blockquote>'; changed = 1; }
		
		// jeff adds h#.
        if (line.search(/^\s*h[1-6]\.\s+/) != -1) { 
	    	re = new RegExp('h([1-6])\.(.+)','g');
	    	line = line.replace(re,'<h$1>$2</h$1>');
			changed = 1; 
		}
		
		if (line.search(/^\s*\*\s+/) != -1) { line = line.replace(/^\s*\*\s+/,'\t<liu>') + '</liu>'; changed = 1; } // * for bullet list; make up an liu tag to be fixed later
        if (line.search(/^\s*#\s+/) != -1) { line = line.replace(/^\s*#\s+/,'\t<lio>') + '</lio>'; changed = 1; } // # for numeric list; make up an lio tag to be fixed later
        if (!changed && (line.replace(/\s/g,'').length > 0)) line = '<p>'+line+'</p>';
        lines[i] = line + '\n';
    }
	
    // Second pass to do lists
    inlist = 0; 
	listtype = '';
    for (var i=0;i<lines.length;i++) {
        line = lines[i];
        if (inlist && listtype == 'ul' && !line.match(/^\t<liu/)) { line = '</ul>\n' + line; inlist = 0; }
        if (inlist && listtype == 'ol' && !line.match(/^\t<lio/)) { line = '</ol>\n' + line; inlist = 0; }
        if (!inlist && line.match(/^\t<liu/)) { line = '<ul>' + line; inlist = 1; listtype = 'ul'; }
        if (!inlist && line.match(/^\t<lio/)) { line = '<ol>' + line; inlist = 1; listtype = 'ol'; }
        lines[i] = line;
    }

    r = lines.join('\n');
	// jeff added : will correctly replace <li(o|u)> AND </li(o|u)>
    r = r.replace(/li[o|u]>/g,'li>');

    return r;
}



// comment preview

function commentPreview(){

	// if browser doesn't support this method, return false
	if(!document.getElementById) return false;
	

	//create the headline and content
	var headlineText = document.createTextNode('Comment Preview');
	var commentHeadline = document.createElement('h2');
	commentHeadline.appendChild(headlineText);
	
	// create textDisplay div
	var textDisplay = document.createElement('div');
	textDisplay.setAttribute('id','textDisplay');
	
	//create name para
	var nameDisplay = document.createElement('span');
	nameDisplay.setAttribute('id','nameDisplay');
	var namePara = document.createElement('p');
	namePara.appendChild(nameDisplay);
	namePara.setAttribute('id','namePara');
	
	var nameText = document.createTextNode('Posted by ');
	namePara.insertBefore(nameText,nameDisplay);
	
	// create a div to store them all in
	var commentPreview = document.createElement('div');
	commentPreview.setAttribute('id','commentPreview');

	// attach content to new comment preview div
	commentPreview.appendChild(commentHeadline);
	commentPreview.appendChild(textDisplay);
	commentPreview.appendChild(namePara);
	
	
	// Get a reference to the comment input and it's parent fieldset
	var commentArea = document.getElementById('text');
	var commentFieldset = commentArea.parentNode.parentNode;
	
	commentFieldset.parentNode.insertBefore(commentPreview,commentFieldset.nextSibling);

	
	// attach content to commentPreview div
	/*commentFieldset.appendChild(commentHeadline);
	commentFieldset.appendChild(textDisplay);
	commentFieldset.appendChild(namePara);*/
	
	// get reference to comment textArea
	var commentArea = document.getElementById('text');
	
	// set callback function
	commentArea.onkeyup = function(){
		var commentString = this.value;
		commentString = superTextile(commentString);
		document.getElementById('textDisplay').innerHTML = commentString;
    	
	}
	
	// get referrence for name input
	var nameInput = document.getElementById('author');
	
	
	// set callback function
	nameInput.onkeyup = function(){
		var nameString = this.value;
		document.getElementById('nameDisplay').innerHTML = nameString;
	}
	
}