// ??:? Javascript ? CSS ????(Footnote)??
// ??:CodeBit.cn ( http://www.CodeBit.cn )

var footNotes = function(){};

footNotes.prototype = {

	footNoteClassName : "footnote",	// ??? className
	footNoteTagName : "span",	// ??????
	footNoteBackLink : " [back]",	// ????

	format : function(contentID, footnoteID)
	{
		if (!document.getElementById) return false;

		var content = document.getElementById(contentID);
		var footnote = document.getElementById(footnoteID);

		var spans = content.getElementsByTagName(this.footNoteTagName);

		var noteArr = [];
		var note = 0;
		
		var elContent;

		var len = spans.length;
		for (i=0; i<len; i++)
		{


			if (spans[i].className == this.footNoteClassName)
			{
							note ++;
							// ??????
				elContent = spans[i].innerHTML;

				noteArr.push(elContent);

				// ???????????
				var newEle = document.createElement( "a" );
				newEle.href = '#ftn_' + footnoteID + '_' + note;
				newEle.title = "show footnote";
				newEle.id = 'ftnlink_'+footnoteID+'_' + note;
				
				newEle.innerHTML = note;
				
				// ??????
				while (spans[i].childNodes.length)
				{
					spans[i].removeChild( spans[i].firstChild );
				}
				
				spans[i].appendChild( newEle );
			}
		}

		// ??????
		var ul = this.__buildNoteList(noteArr, footnoteID);

		footnote.appendChild(ul);

	},

	__buildNoteList : function(notes, noteID) 
	{
		if(!notes || notes.length < 1) return;
		
		var ul = document.createElement('ul');

		ul.className = this.footNoteClassName;

		var li;

		var len = notes.length + 1;
		for(i=1; i<len; i++)
		{
			li = document.createElement('li');
			li.id = "ftn_"+noteID+"_"+i;

			li.innerHTML = notes[i-1];

			// ????????
			var link = document.createElement("a");
			link.href = "#ftnlink_" + noteID + "_" + i;

			link.innerHTML = this.footNoteBackLink;

			li.appendChild( link );

			ul.appendChild( li );
		}

		return ul;
	}
};