/************************************************
 * Handles all information about the current card
 * that is being created.  Actually some of it is
 * just stored on the DOM itself via the various
 * text areas, etc.
 ************************************************/
 
var CurrentCard = new function() {
	var categoryIndex;  // Index in category
	var cardIndex;		// Index in database
	
	var category = null;
	var categoryCount;
	var cardGrammar;
	
	var that = this;   // So that private functions can access "this"

	this.getCategory = function() {
		return category;
	}
	
	/**
	 * Set's the current card to the first in the specified category.
	 */
	this.setCategory = function(c) {
		category = c;

		if (!category) {
			this.clearCard();		
		}
		else {
			categoryIndex = 1;
			cardIndex = -1;
			categoryCount = 0;
			updateCurrentCard(0);

			// Now that we've set the current category.	
			Grammar.loadCategoryGrammar();
			View.creator.display();
		}
	}
	
	this.newCard = function() {
		this.clearCard();
		categoryIndex = categoryCount + 1;
		cardIndex = -1;
		updateCardInfo();
		this.showNewCardCover(true);
	}
	
	this.clearCard = function() {
		unmarkEditted();
		this.showNewCardCover(false);
		
		var cCard = document.getElementById('chineseCard');
		cCard.value = "";
		
		var pCard = document.getElementById('pinyinCard');
		pCard.value = "";
		
		var eCard = document.getElementById('englishCard');
		eCard.value = "";
		
		var cSpan = document.getElementById('cardImages');
		Utils.DOM.clearChildren(cSpan);
		
		displayCardGrammar(null);
	}
	
	this.showNewCardCover = function(show) {
		var eCard = document.getElementById('englishCard');
		var pCard = document.getElementById('pinyinCard');
		var cCard = document.getElementById('chineseCard');
		var covered = (show) ? "covered" : "uncovered";
		
		if (show) {
			eCard.value = "English\n(click to type...)";	
			eCard.onclick = function() { CurrentCard.showNewCardCover(false); };
			pCard.value = "Pin1yin1\n(...or try Definition Search)";
			pCard.onclick = function() { CurrentCard.showNewCardCover(false); };
			cCard.value = "Chinese\n(...or use a Chinese IME)";
			cCard.onclick = function() { CurrentCard.showNewCardCover(false); };
		}
		else {
			if (eCard.className == "covered") {
				eCard.value = "";	
				eCard.onclick = null;
				pCard.value = "";
				pCard.onclick = null;
				cCard.value = "";
				cCard.onclick = null;
			}
		}
		
		eCard.className = covered;
		pCard.className = covered;
		cCard.className = covered;
	}
		
	this.deleteCard = function() {
		if (cardIndex != -1) {
			var deleteRequest = Utils.AJAX.createRequest();
			var url = Utils.AJAX.makeRequestURL('cardservlet', 'card', cardIndex, 'delete', true, 'uid', User.getCurrentUser());
			postEvent('EDIT_CARD_DELETE', cardIndex);
			deleteRequest.open('GET', url, false);
			deleteRequest.send(null);
			if (deleteRequest.readyState == 4) {
				if (deleteRequest.status == 200) {
					doDelete();
				}
			}
		}
	}
	
	this.firstCard = function() {
		categoryIndex = 1;
		updateCurrentCard(0);
	}
	
	this.lastCard = function() {
		categoryIndex = categoryCount;
		updateCurrentCard(0);
	}
	
	this.nextCard = function() {
		updateCurrentCard(1);
	}
	
	this.prevCard = function() {
		updateCurrentCard(-1);
	}
	
	this.markEditted = function() {
		var saveButton = document.getElementById('saveButton');
		saveButton.value = "*Save Card*";
		return true;
	}
	
	this.saveCard = function() {
		if (!category) {
			alert("You must first create a category");
		}
		else {
			message = getCurrentCardXML();
			var saveRequest = Utils.AJAX.createRequest();
			var url = Utils.AJAX.makeRequestURL('cardservlet', 'card', cardIndex, 
															   'category', category, 
															   'uid', User.getCurrentUser(), 
															   'index', categoryIndex);
			saveRequest.open('POST', url, true);
			saveRequest.setRequestHeader("Content-Type", "text/xml");
			saveRequest.send(message);
			saveRequest.onreadystatechange = function () {
				if (saveRequest.readyState == 4) {
					if (saveRequest.status == 200) {
						if (cardIndex == -1) {
							categoryIndex++;
							categoryCount++;
							updateCardInfo();
							CurrentCard.newCard();
							postPageView("/chinesecards/createcard.event");
						}
						unmarkEditted();
					}
				}
			}

			postEvent('EDIT_CARD_SAVE', cardIndex);
		}
	}



	/***********/
	/* private */
	/***********/
	
	function updateCardInfo() {
		var span = document.getElementById('cardInfo');
		var categoryText = "Category: " + category + " ";
		var countText = "(" + categoryIndex + " of " + categoryCount + ")";
		var node = document.createTextNode(categoryText + countText);
		Utils.DOM.clearChildren(span);
		span.appendChild(node);
	}
	
	// Takes a XML card node and displays it
	function displayCardNode(cardNode) {
		that.clearCard();
		categoryIndex = parseInt(cardNode.getAttribute("index"));
		cardIndex = parseInt(cardNode.getAttribute("cardIndex"));
		categoryCount = parseInt(cardNode.getAttribute("categoryCount"));
		
		updateCardInfo(categoryCount);
	
		var chineseNode = cardNode.getElementsByTagName('chinese')[0];
		var pinyinNode = cardNode.getElementsByTagName('pinyin')[0];
		var englishNode = cardNode.getElementsByTagName('english')[0];
		var grammarNode = cardNode.getElementsByTagName('grammar')[0];
		
		var chineseCard = document.getElementById('chineseCard');
		var pinyinCard = document.getElementById('pinyinCard');
		var englishCard = document.getElementById('englishCard');
		
		if (chineseNode.childNodes[0]) {
			chineseCard.value = chineseNode.childNodes[0].data;
		}
		
		if (pinyinNode.childNodes[0]) {
			pinyinCard.value = pinyinNode.childNodes[0].data;
		}
	
		if (englishNode.childNodes[0]) {
			englishCard.value = englishNode.childNodes[0].data;
		}
		
		var grammarString = null;
		if (grammarNode) {
			grammarString = grammarNode.childNodes[0].data;
		}
		
		displayCardGrammar(grammarString);
		
		var imageNodes = cardNode.getElementsByTagName('image');
		var ip = new ImagePreloader(addImage);
		ip.preload(imageNodes);
	}
	
	function getCurrentCardXML() {
		var xmlDoc = Utils.XML.newDocument();
		
		var cCard = document.getElementById('chineseCard');
		var pCard = document.getElementById('pinyinCard');
		var eCard = document.getElementById('englishCard');
	
		var root = xmlDoc.createElement("card");
		root.setAttribute("chinese", cCard.value);
		root.setAttribute("pinyin", pCard.value);
		root.setAttribute("english", eCard.value);
	
		if (cardGrammar && cardGrammar != "") {
			var grammarE = xmlDoc.createElement("grammar");
			var dataE = xmlDoc.createCDATASection(cardGrammar);
			grammarE.appendChild(dataE);
			root.appendChild(grammarE);
		}
			
		xmlDoc.appendChild(root);
		
		var cSpan = document.getElementById('cardImages');
		var images = cSpan.getElementsByTagName('IMG');
	
		for (var i = 0; i < images.length; i++) {
			if (images[i].imageNode != null) {
				var imageNode = images[i].imageNode;
	
				// Safari wants me to copy it!
				var newImageNode = xmlDoc.createElement("image");
				newImageNode.setAttribute("height", imageNode.getAttribute("height"));
				newImageNode.setAttribute("width", imageNode.getAttribute("width"));
				newImageNode.setAttribute("src", imageNode.getAttribute("src"));
				root.appendChild(newImageNode);
			}
		}
		
		//alert(Utils.XML.toString(root));
		return xmlDoc;
	}
	
	function doDelete() {
		that.clearCard();

		if (categoryCount > 0) {
			categoryCount--;
		}
			
		if (categoryCount == 0) {
				cardIndex = -1;
		}
			
		if (categoryIndex > categoryCount && categoryIndex > 1) {
			categoryIndex = categoryCount;
		}
		
		updateCurrentCard(0);
	}
		
	function updateCurrentCard(offset) {
		var index = categoryIndex + offset;
		var url = Utils.AJAX.makeRequestURL('cardservlet', 'category', category, 'index', index, 'uid', User.getCurrentUser());
		var cardRequest = Utils.AJAX.createRequest();
		cardRequest.open('GET', url, false);
		cardRequest.send(null);
	
		if (cardRequest.readyState == 4) {
			if (cardRequest.status == 200) {
				var xmldoc = cardRequest.responseXML;
				var cardNode = xmldoc.getElementsByTagName('card')[0];
				if (cardNode) {
					displayCardNode(cardNode);
				}
				else if (categoryCount == 0) {
					/* The case where the category is empty */
					that.clearCard();
					updateCardInfo();
				}
			}
		}
	}
	
	function popupRuleEditor() {
		var grammarPrompt = "Enter the right-hand-side of JSGF statement.\n"
		grammarPrompt += "You may use rules defined in the category's grammar.\n\n";
		grammarPrompt += "Example: [<small>] [<blue>] <circle>";
	
		var grammarString = '';
		if (cardGrammar) {
			grammarString = cardGrammar;
		}
		
		result = window.prompt(grammarPrompt, grammarString);
		
		if (result != null) {
			markEditted();
			displayCardGrammar(result);
		}
	}

	function displayCardGrammar(grammarString) {
		cardGrammar = grammarString;
	
		if (Grammar.getUseGrammars()) {
			var grammarE = document.getElementById('cardgrammar');
			Utils.DOM.clearChildren(grammarE);
			
			var grammarIcon = document.createElement('img');
			grammarIcon.onclick = popupRuleEditor;
			grammarIcon.src='images/jsgficon.png';
			grammarE.appendChild(grammarIcon);
		
			if (grammarString) {
				var grammarString = grammarString.substring(0,20) + "...";
				var grammarT = document.createTextNode(grammarString);
				grammarE.appendChild(grammarT);
			}
		}
	}
	
	function unmarkEditted() {
		var saveButton = document.getElementById('saveButton');
		saveButton.value = "Save Card";
	}
}