// JavaScript Document for Mike Behnke, Homework 5, INP271 

var pm = {
	
	//define variables used in more than one function within object
	typeChoices : null, bordChoices : null,	connChoices : null, 
	theFont : null,	theBorder : null,	theConnect : null, 
	tclen : null, bclen : null,	cclen : null,
	menu : null, minputs : null,	minputslen : null, pmbutp : null,
	vdotstring : null, gdotstring : null, cdotstring : null,
	curValue : null,
	
	init : function () {
		if (!document.createElement && !document.getElementById) {return;}
		pm.menu = pm.getObj('menu');
		pm.minputs = pm.menu.getElementsByTagName('input');
		pm.minputslen = pm.minputs.length;
		pm.pmbutp = pm.getObj('pmbutp');
		pm.createDotStrings();
		pm.createPMbutton();
		pm.watchChoices();
		for (var i=0;i<pm.minputslen;i++) {
			pm.addEvent(pm.minputs[i], 'focus', pm.watchInputsOn);
			pm.addEvent(pm.minputs[i], 'blur', pm.watchInputsOff);
		}
		var theForm = pm.getObj('choices');
		pm.addEvent(theForm, 'submit', pm.validateInput);		
	},
	
	watchInputsOn : function () {
		pm.curValue = this.value;
		if (this.value == 'Name of your restaurant'||this.value == 'Name of this menu section'||this.value == 'Name of this menu item'||this.value == 'Price') {		
			this.value = '';
		}
	},
	
	watchInputsOff : function () {
		if (this.value == '') {this.value = pm.curValue;}
	},
	
	makeCookies : function () {
		pm.createCookie('font',pm.theFont);
		pm.createCookie('border',pm.theBorder);
		pm.createCookie('connector',pm.theConnect);
		for (var i=0;i<pm.minputslen;i++) {
			pm.createCookie(pm.minputs[i].name,pm.minputs[i].value);
		}
	},
	
	openWindow : function () {
		pm.makeCookies();
		window.open('hw5pmenu.html','_blank','top=10,left=10,width=760,height=550,scrollbars=1,resizable=1');
	},	
	
	//validate then open new window
	validateInput : function (e) {
	  var priceInputs = pm.getElementsByClass('price',null,'input');
	  var pilen = priceInputs.length;
		var warning = '';
		for (var i=0;i<pilen;i++) {
			var pivalue = priceInputs[i].value;
			if(pivalue != pivalue.match(/^\d+|Price$/)) {
				warning = 'For a more realistic menu, please use whole numbers in the prices you have entered.';
			}			
		}
		if (warning != '') {
			alert(warning);
			pm.stopDefault(e);
		} 
		else {
			pm.openWindow();
			//default form action stopped due to no server side script 
			pm.stopDefault(e);
		}
	},
	
	checkChoices : function () {
		for (var i=0;i<pm.tclen;i++) {
		  if (pm.typeChoices[i].checked) {pm.theFont = pm.typeChoices[i].value;}
		}
		for (i=0;i<pm.bclen;i++) {
		  if (pm.bordChoices[i].checked) {pm.theBorder = pm.bordChoices[i].value;}
		}
		for (i=0;i<pm.cclen;i++) {
			if (pm.connChoices[i].checked) {pm.theConnect = pm.connChoices[i].value;}
		}
		if (pm.theFont && pm.theBorder && pm.theConnect) { 
			pm.menu.className = pm.theFont + ' ' + pm.theBorder;
			switch (pm.theFont) {
					case 'tv' : var dotstring = pm.vdotstring; break;
					case 'tg' : var dotstring = pm.gdotstring; break;
					case 'tc' : var dotstring = pm.cdotstring; break;
					default :  var dotstring = pm.vdotstring; break;
				}
				var dots = pm.menu.getElementsByTagName('span');
				var numspans = dots.length;
				for (i=0;i<numspans;i++) {
					if (dots[i].hasChildNodes()) {
						dots[i].firstChild.data = dotstring;
					}
					else {
						dots[i].appendChild(document.createTextNode(dotstring));
					}
					if (pm.theConnect == 'ws') {dots[i].className = 'hidevis';}
					else {dots[i].className = '';}
				}
			pm.pmbutp.className = '';
			} 
			else { pm.menu.className = pm.pmbutp.className = 'hidescreen';}
	},
	
	watchChoices : function () {
		pm.typeChoices = document.getElementsByName('typeface');
		pm.bordChoices = document.getElementsByName('border');
		pm.connChoices = document.getElementsByName('connector');
		pm.tclen = pm.typeChoices.length;
		pm.bclen = pm.bordChoices.length;
		pm.cclen = pm.connChoices.length;
		for (var i=0; i<pm.tclen; i++) {
			pm.addEvent(pm.typeChoices[i], 'click', pm.checkChoices);
		}
		for (i=0; i<pm.bclen; i++) {
			pm.addEvent(pm.bordChoices[i], 'click', pm.checkChoices);
		}
		for (var i=0; i<pm.cclen; i++) {
			pm.addEvent(pm.connChoices[i], 'click', pm.checkChoices);
		}
	},
	
	// create dotstrings once and reuse as needed 
	// by reassiging variable during event handling
	createDotStrings : function () {
		pm.vdotstring = pm.gdotstring = pm.cdotstring = '.';
		for (var i=0;i<97;i++) {pm.vdotstring += '.';}
		for (i=0;i<104;i++) {pm.gdotstring += '.';}
		for (i=0;i<139;i++) {pm.cdotstring += '.';}			
	},
	
	createPMbutton : function () {
		var pmb = document.createElement('li');
		pmb.className = 'current';
		pmb.appendChild(document.createTextNode('Preview a Menu'));
		var mainnav = pm.getObj('mainnav');
		var cam = pm.getObj('cam');
		mainnav.insertBefore(pmb, cam);
	},
	
	createCookie : function (name,value,expiration,path,domain,secure) {
  	var data = name + "=" + escape(value);
  	if (expiration) { data += "; expires=" + expiration.toGMTString(); }
  	if (path) { data += "; path=" + path; }
  	if (domain) { data += "; domain=" + domain; }
  	if (secure) { data += "; secure"; }
  	document.cookie = data;
	},
	
	// improve performance by reducing object lookups 
	getObj : function(idvalue) {
		return document.getElementById(idvalue);
	},	
	
	getElementsByClass : function (searchClass,node,tag) {

    // this array will hold the nodes that have the desired class
    var classElements = [];

    // if we did not pass the node parameter, assume document
    if (node == null) {node = document;}

    // if we did not pass the tag parameter, grab every node
    if (tag == null) {tag = '*';}

    // gather all the element nodes to look through; by default is everything in document
    var els = node.getElementsByTagName(tag);

    // to improve loop performance, determine the length ahead of time
    var elsLen = els.length;

    // establish the pattern to search for within className
    var pattern = new RegExp("(^|\s)"+searchClass+"(\s|$)");

    // look through all the class properties to see if there is a match
    // the j variable is the counter variable that increments each time a
    // match is found and becomes the next item in classElements
    for (var i = 0, j = 0; i < elsLen; i++) {
        if (pattern.test(els[i].className)) {
           classElements[j] = els[i];
           j++;
        }
    }

    // send back the array of elements to whatever variable called this function
    return classElements;

	},
	
	stopDefault : function(e) {
    if (!e) {e = window.event;}
    if (!e.preventDefault) {
    	e.preventDefault = function() { this.returnValue = false; }
    }
    e.preventDefault();
    return false;
	},
	
	// associate nodes with events and functions
  addEvent : function(obj, type, func) {
       if (obj.addEventListener) {obj.addEventListener(type, func, false);}
       else if (obj.attachEvent) {
           obj["e" + type + func] = func;
           obj[type + func] = function() {obj["e" + type + func] (window.event);}
           obj.attachEvent("on" + type, obj[type + func]);
       }
       else {obj["on" + type] = func;}
   }  	
}

pm.addEvent(window,'load',pm.init);
