var Preview = Class.extend({// JavaScript Docu
	construct:function() {
		this.preview=null;
		this.previewCont=null;
		var date=new Date();
		this.startDate=convertDatetoString(date);

		this.demoMode=false;
		this.patternName=null;
		this.pattern=new Array();
		this.patternElements=patternElements //Pattern Elements generated in config/localisation.php
		this.patternElementNames=patternElementNames; //Pattern Elements generated in config/localisation.php
		this.patternColors=new Array();
		this.startDay="s";
		this.month=0;
		this.previewQuery=null;
		this.email=null;
		this.companyName=null;
		this.parent=null;
		this.parentForm=null;
		this.monthsArray=monthDescripArray; //Pattern Elements generated in config/localisation.php
		this.daysArray=weekAbbrArray2; //Pattern Elements generated in config/localisation.php
		this.holidaysArray=null;
		this.patternId=null
		this.userId=null;
		this.country=null;
		this.patternQuery=null;
		this.shiftsId=new Array();
		this.shiftsNames=new Array();

		this.holidaysArray=new Array();
		this.stateHolidays=null;
		this.personalHolidays=null;

		this.curDate=new Date();
		this.callback=null;
		},

	setStartDate: function(startDate) {
		this.startDate=startDate;
	},

	setParent: function(par) {
		this.parent=par;

	},

	parseShifts: function(shifts) {
		var splitShifts=shifts.split(",,");
		for(var i=0; i < splitShifts.length;i++) {
			var shiftArray=	splitShifts[i].split(",");
		}
	},

	parseMonths:function(months) {
		this.monthsArray=new Array();
		var splitMonths=months.split(",");
		for(var i=0; i < splitMonths.length;i++) {
			this.monthsArray.push(splitMonths[i]);
		}
	},

	parseDays:function(days) {
		this.daysArray=new Array();
		var splitDays=days.split(",");
		for(var i=0; i < splitDays.length;i++) {
			this.daysArray.push(splitDays[i]);
		}
	},

	parseStateHolidays:function(holidays) {
		this.stateHolidays=holidays;
	},

	parseHolidays:function(holidays)  {
		this.personalHolidays=holidays;
	},

	setPattern:function(pattern,name) {
		this.pattern=pattern;
		this.patternName=name;
	},

	getPattern:function(patternId)
	{
		this.patternQuery=new WebEngine();
		var query=createXmlElement("getShiftPatternByCompanyId");
		query.setAttribute("pattern",patternId);
		this.patternId=patternId;
		this.patternQuery.handleXML=delegate(this,this.patternLoaded);
		this.patternQuery.postRequest(query,"Loading User Pattern");
	},

	patternLoaded:function()
	{
		if(this.patternQuery.responseXML.selectSingleNode("//getShiftPatternByCompanyIdResponse")) {
			this.pattern=this.patternQuery.responseXML.selectSingleNode("//getShiftPatternByCompanyIdResponse").getAttribute("pattern").split("");
			this.patternName=this.patternQuery.responseXML.selectSingleNode("//getShiftPatternByCompanyIdResponse").getAttribute("name");
			this.generatePreview(true);
		}
	},

	patternSelected: function()
	{
		var sel=document.getElementById("existingPattern").value;
		if(sel=="null") {
			this.patternId=null;
			this.patternName="New Pattern";
			this.pattern=new Array("X","X","X","X","X","X","X","X");
			this.generatePreview(true);
		}else{
			this.getPattern(sel);
		}
	},

	generatePreviewForm:function(td) {
		if(this.demoMode==false) {
			this.formObject=new FormObject(this,td);
			if(this.pattern.length > 0 ) {
				this.formObject.form.submit="Generate MobileRota";
			}else{
				this.formObject.form.submit="false";
			}

			this.formObject.form.method="POST";
			this.formObject.form.close=false;
			//this.formObject.form.action=delegate(this,this.submitPreviewForm);

			var fieldset=this.formObject.form.addFieldset("User","Shift Pattern Wizard : Step 1","As you make your selections you will see our phone screen change; this is how it will look on your mobile once downloaded.<br /><br /><a href='javascript:launchShiftHelp();'>Click Here For Instructions</a>");
		//if(this.shiftsNames.length > 1) {
			var item=this.formObject.form.addItem(fieldset);
			item.parent=fieldset;
			item.id="existingPattern";
			item.type="select";
			item.label="Existing Shifts";

			item.value=this.patternId;

			item.jsfunction=delegate(this,this.patternSelected);
			item.optVal=this.shiftsId.join();
			item.optDisp=this.shiftsNames.join();
			item.required=true;
		//}
			var item=this.formObject.form.addItem(fieldset);
			item.parent=fieldset;
			item.id="patternName";
			item.type="text";
			item.description="Give your pattern a name - e.g. D-Shift or Blue Watch etc";
			item.label="Shift Pattern Name";
			item.value=this.patternName;
			item.required=true;
			if(this.patternId!=null) {
				item.disabled=true;
			}

			var item=this.formObject.form.addItem(fieldset);
			item.parent=fieldset;
			item.id="startDate";
			item.description="Click on the calendar and choose a start date for your pattern";
			item.type="date";
			item.label="Shift Pattern Start Date";
			item.value=this.startDate;
			item.jsfunction=delegate(this,this.createPattern);
			item.required=true;

			var item=this.formObject.form.addItem(fieldset);
			item.parent=fieldset;
			item.id="patternLength";
			item.type="number";
			item.label="Length Of Pattern";
			item.description="Select length of pattern - e.g. 4 on 4 off - equals pattern length of 8";
			item.value=this.pattern.length;
			item.required=true;
			if(this.patternId!=null) {
				item.disabled=true;
			}

			var item=this.formObject.form.addItem(fieldset);
			item.parent=fieldset;
			item.id="startDay";
			item.type="select";
			item.label="Week Start";
			item.description="Select a start day for your calendar week - Either Sunday or Monday";
			item.value=this.startDay;
			item.optVal=new Array("1","2").join();
			item.optDisp=new Array("Sunday","Monday").join();
			item.jsfunction=delegate(this,this.createPattern);
			item.required=true;
			var item=this.formObject.form.addItem(fieldset);
			item.parent=fieldset;
			item.type="button";
			item.label="Length Of Pattern";
			item.jsfunction=delegate(this,this.createPattern);
			if(this.pattern.length > 0) {
				item.value="Update Pattern";
			}else{
				item.value="Create Pattern";
			}

			if(this.pattern.length > 0 ) {
				var fieldset2=this.formObject.form.addFieldset("Pattern","Shift Pattern Wizard : Step 2","Once you are completely satisfied with the accuracy and appearance of your MobileRota then click on Approve Pattern.<br /> Your Shift Rota will then be sent directly to your Mobile Phone!");
				for(var i=0; i < this.pattern.length;i++) {
					var item=this.formObject.form.addItem(fieldset2);
						item.parent=fieldset2;
						item.id="pattern"+i;
						item.type="colorSelect";
						item.description="Select the option that applies to Day "+(i+1)+" of your Shift. e.g. Day, Evening or Night etc";
						item.label="Day "+(i+1);
						item.value=this.pattern[i];
						item.color=this.pattern[i];
						item.jsfunction=delegate(this,this.addToPattern,i,item);
						item.optVal=this.patternElements.join();
						item.optDisp=this.patternElementNames.join();
						if(this.patternId!=null) {
							item.disabled=true;
						}
					}
					var item=this.formObject.form.addItem(fieldset2);
					item.parent=fieldset2;
					item.type="button";
					item.label="Length Of Pattern";
					item.jsfunction=delegate(this,this.sendPattern);

					item.value="Approve Pattern";
				}
				this.formObject.drawForm();
				this.formObject.showForm();
			}
	},

	generateShiftPanel:function(arg1) {
		var td2=document.createElement("td");
			td2.style.paddingTop="10px";
			td2.className="shiftPanel";
			td2.width="100%";
			td2.style.textAlign="center";
			var table2=document.createElement("table");
			table2.style.margin="auto";

			var tbod2=document.createElement("tbody");
			var tr2=document.createElement("tr");

			var td=document.createElement("td");
			td.style.paddingLeft="10px";
			td.style.paddingRight="10px";

			td.width="50";
			td.innerHTML="<a href='#' style='display:block;padding-top:255px;'><img src='images/design/left.gif' alt='Previous Month'/></a>";
			td.onclick=delegate(this,this.previewLeft);
			tr2.appendChild(td);

			this.preview=document.createElement("td");
			this.preview.style.paddingLeft="12px";
			this.preview.style.paddingRight="20px";
			this.preview.style.paddingTop="40px";
			this.preview.style.width="160px";
			this.preview.style.backgroundImage="url('images/design/phone.jpg')";
			this.preview.style.backgroundRepeat="no-repeat";
			this.preview.style.paddingBottom="240px";

			tr2.appendChild(this.preview);

			var td=document.createElement("td");
			td.width="50";

			td.innerHTML="<a href='#' style='display:block;padding-top:255px;padding-left:5px;'><img src='images/design/right.gif' alt='Next Month'/></a>";
			td.onclick=delegate(this,this.previewRight);
			tr2.appendChild(td);
			var td=document.createElement("td");
			td.appendChild(this.generateKey());
			tr2.appendChild(td);
			tbod2.appendChild(tr2);
			table2.appendChild(tbod2);
			td2.appendChild(table2);
			return td2;
	},

	generateKey:function() {
		var keyDiv=document.createElement("div");
		keyDiv.style.padding="2px";
		keyDiv.style.width="130px";
		keyDiv.style.border="outset 1px #666666";
		keyDiv.style.backgroundColor="#FFFFFF";
		for(var k=0; k < this.patternElements.length;k++) {
			if(this.patternElements[k]=="X" ) {

			}else{
				var tabo=document.createElement("table");
				tabo.width="100%";
				tabo.border="0";
				var tbodo=document.createElement("tbody");
				var tro=document.createElement("tr");
				var tdo=document.createElement("td");
				tdo.width="20";
				var col=document.createElement("img");
				col.className="Shift"+ this.patternElements[k];
				col.id=this.patternElements[k]+"Color";
				col.style.width="20px";
				col.style.height="20px";
				col.src="images/icons/color.gif";
				var a=document.createElement("a");
				if(this.demoMode != true) {
					a.href="#";
				}else{
					a.href="#";
				}
				a.appendChild(col);
				tdo.appendChild(a);
				tro.appendChild(tdo);
				var tdo=document.createElement("td");
				tdo.align="left";
				tdo.innerHTML=this.patternElementNames[k];
				tro.appendChild(tdo);
				tbodo.appendChild(tro);
				tabo.appendChild(tbodo);
				keyDiv.appendChild(tabo);
			}
		}
		return keyDiv;
	},

	generatePreview:function(arg1) {
		this.refDate=null;
		this.previewCont=document.createElement("div");
		var d1=getScreenSize();
		var offsetX=parseInt(d1.w)/2-450;
		this.previewCont.style.left=offsetX+"px";
		this.previewCont.style.top="100px";

		var table=document.createElement("table");
		table.width="100%";
		table.cellPadding="0";
		table.cellSpacing="0";
		table.style.margin="auto";
		table.style.width="100%";
		var tbod=document.createElement("tbody");
		var tr=document.createElement("tr");
		if(arg1 !=false) {
			var td=document.createElement("td");
			td.style.backgroundColor="#E7E7E7";
			var contDiv=document.createElement("div");
			contDiv.style.width="377px";
			this.generatePreviewForm(contDiv);
			td.appendChild(contDiv);
			tr.appendChild(td);
		}

		if(this.pattern.length > 0 ) {
			tr.appendChild(this.generateShiftPanel(arg1));
		}

		tbod.appendChild(tr);
		table.appendChild(tbod);

		this.previewCont.appendChild(table);

		this.generatePhonePreview();
	},


	generatePhonePreview:function() {
		if(this.pattern.length >0 ) {
			this.previewQuery=new WebEngine();
			var wuery=createXmlElement("generatePreview");
			wuery.setAttribute("startDate",reFormatDate(this.startDate));
			wuery.setAttribute("curDay",this.curDate.getDate());
			wuery.setAttribute("curMonth",this.curDate.getMonth()+1);
			wuery.setAttribute("curYear",this.curDate.getFullYear());
			wuery.setAttribute("pattern",this.pattern.join(""));
			if(this.userId !=null) {
				wuery.setAttribute("userId",this.userId);
			}
			wuery.setAttribute("patternName",this.patternName);
			wuery.setAttribute("startDay",this.startDay);
			if(this.stateHolidays !=null) {
				wuery.setAttribute("stateHolidays",this.stateHolidays);
			}
			if(this.personalHolidays !=null) {
				wuery.setAttribute("personalHolidays",this.personalHolidays);
			}
			this.previewQuery.handleXML=delegate(this,this.parsePreviewResult,this.previewQuery);
			this.previewQuery.postRequest(wuery,"Loading User Information");
			hideMask();
		}
	},

	submitPreviewForm:function() {

	},

	createPattern:function() {
		this.patternName=document.getElementById("patternName").value;
		this.startDate=document.getElementById("startDate").value;
		this.startDay=document.getElementById("startDay").value;

		var length=parseInt(document.getElementById("patternLength").value);
		if(this.patternName !="" && length !=0 && this.startDate !="") {
		var newPattern=new Array();
			for(var i=0; i < length ;i++) {
				if(this.pattern[i]) {
					newPattern.push(this.pattern[i]);
				}else{
					newPattern.push("X");
				}
			}
			this.pattern=newPattern;
			this.generatePreview(true);
		}else{
			return;
		}
	},

	sendPattern:function() {
		this.patternName=document.getElementById("patternName").value;
		this.startDate=document.getElementById("startDate").value;
		this.startDay=document.getElementById("startDay").value;
		var length=parseInt(document.getElementById("patternLength").value);
		var patternStr="";
		var colorStr="";
		if(this.patternName !="" && length !=0 && this.startDate !="") {
			var newPattern=new Array();
			for(var i=0; i < length ;i++) {
				if(this.pattern[i]) {
					patternStr+=this.pattern[i];
				}else{
					patternStr+="X";
				}
			}
		}
		var colorStr="";
		for(var i=1; i < this.patternElements.length;i++) {
			if(this.patternElements[i]=="H") {
				colorStr+=this.patternElements[i]+","+this.patternElementNames[i]+",4CA154,"+rotaColors[this.patternElements[i]].replace("#","");
			}else{
				colorStr+=this.patternElements[i]+","+this.patternElementNames[i]+","+rotaColors[this.patternElements[i]].replace("#","")+",";
			}
			if(i < this.patternElements.length-1) {
				colorStr+=",";
			}
		}
		this.patternQuery=new WebEngine();
		var query=createXmlElement("addUserPattern");
		query.setAttribute("pattern",patternStr);
		query.setAttribute("patternName",this.patternName);
		query.setAttribute("companyName",this.companyName);
		query.setAttribute("startDay",this.startDay);
		query.setAttribute("activationDate",getNowDate());
		query.setAttribute("colorsArray",colorStr);
		if(this.startDay=="1") {
			query.setAttribute("dayNames",weekAbbrArray2);
		}else{
			query.setAttribute("dayNames",weekAbbrArray);
		}
		query.setAttribute("monthNames",this.monthsArray.join());
		query.setAttribute("userId",this.userId);
		query.setAttribute("startDate",this.startDate);
		this.patternQuery.handleXML=delegate(this,this.patternAdded);
		this.patternQuery.postRequest(query,"Loading User Information");
	},

	patternAdded:function() {
		if(this.patternQuery.responseXML.selectSingleNode("//addUserPatternResponse")) {
			if(this.patternQuery.responseXML.selectSingleNode("//addUserPatternResponse").getAttribute("action")=="thankyou") {
				this.parentForm.patternConfirmed=1;
				this.parentForm.shiftPatternSubmitted();
			}
		}
		if(this.callback !=null) {
			this.callback();
		}
	},

	addToPattern:function(num,item) {
		this.pattern[num]=document.getElementById(item.id).value;
		this.createPattern();
		this.generatePhonePreview();
	},

	previewLeft:function() {
		this.curDate.setMonth(this.curDate.getMonth()-1);
		this.generatePhonePreview();
	},

	previewRight:function() {
		this.curDate.setMonth(this.curDate.getMonth()+1);
		this.generatePhonePreview();
	},

	parsePreviewResult: function(object) {

		if(this.parent.childNodes[0]!=this.previewCont) {
			this.parent.innerHTML="";
		}
		this.previewQuery=object;
		this.parent.appendChild(this.previewCont);
		var prev=this.previewQuery.responseXML.getElementsByTagName("preview");
		this.preview.innerHTML=prev[0].firstChild.nodeValue;
			for(var i=0; i < this.patternElements.length;i++) {

				var nodes=getElementsByClassName("Shift"+this.patternElements[i]);
				for(var n=0;n < nodes.length;n++) {

					nodes[n].style.backgroundColor=rotaColors[this.patternElements[i]];
				}
			}
		this.previewCont.style.display="block";
		this.redrawColors();
	},

	redrawColors:function() {
		var rows=document.getElementById("monthBody").childNodes;
		for(var i=0; i < rows.length;i++) {
			var cells=document.getElementById("monthBody").childNodes[i].childNodes;
			for(var c=0; c < cells.length;c++) {
				var bg=cells[c].style.backgroundColor;
				if(bg.indexOf("#")==-1) {
					var col=rgbConvert(bg);
				}else{
					var col=bg.replace("#","").toUpperCase();
				}
				if(col !=null) {
					if(calculate(col,onText) > calculate(col,offText)) {
						cells[c].style.color="#FFFFFF";
					}
				}
			}
			/*End For Loop*/
		}
		/*End For Loop*/
	}
});