/*  use ViewDom class for DOM compliant browsers */
function ViewDom(model,controller,error,snapShotObj,main,txt){
this._txt=txt;
this._main = main;
this._error = error;
this._abstractview = new AbstractView(this,model,controller);
this._snapShotObj = snapShotObj;
this._validator = new Validator(this._abstractview,this._error);		
this._secondRoundPlacement = [0,3,2,1,4,7,6,5,8,11,10,9,12,15,14,13];
this._countryArray=this._txt.t;			
// initialise the styles for the results table (you can't dynamically change styles if they've been set in a stylesheet !)
//window.setStyles("#cccccc","#ffffff","#000000",this._numberOfColumnsOfResults,this._numberOfColumnsInResultsTable);
//this.aqquire();
}
ViewDom.prototype.aqquire = function(fm,preloading){
this.fm = fm;
var id = this.fm.formID;
this._snapShotObj.newSnapShot(this.fm);
//this.modifyStyles();
var c = 1;
for(var d=0;d<this.fm.numDays;d++){
	var x = 0;
	while(document.getElementById("i"+id+"_itemNameLeft"+d+"_"+x) != null){
		this._snapShotObj[id].i_itemLeft[c] = document.getElementById("i"+id+"_itemLeft"+d+"_"+x+"").value;
		this._snapShotObj[id].i_itemNameLeft[c] = document.getElementById("i"+id+"_itemNameLeft"+d+"_"+x+"").innerHTML;
		this._snapShotObj[id].i_itemRight[c] = document.getElementById("i"+id+"_itemRight"+d+"_"+x+"").value;
		this._snapShotObj[id].i_itemNameRight[c] = document.getElementById("i"+id+"_itemNameRight"+d+"_"+x+"").innerHTML;
		this._snapShotObj[id].i_itemLeftMirror[c] = document.getElementById("i"+id+"_itemLeft"+d+"_"+x+"mirror").innerHTML;
		this._snapShotObj[id].i_itemRightMirror[c] = document.getElementById("i"+id+"_itemRight"+d+"_"+x+"mirror").innerHTML;
		for(var i=0;i<=this._countryArray.length;i++){
			if(document.getElementById("i"+id+"_itemNameLeft"+d+"_"+x+"").innerHTML == this._countryArray[i]){
				this._snapShotObj[id].i_itemNameLeft[c]=this._countryArray[(i+1)]
				}
			if(document.getElementById("i"+id+"_itemNameRight"+d+"_"+x+"").innerHTML == this._countryArray[i]){
				this._snapShotObj[id].i_itemNameRight[c]=this._countryArray[(i+1)]
				}
			}
		x++;
		c++;
	}
}
var numberOfColumnsOfResults = 2;
for(var i=1;i<=this.fm.numRowResults;i++){
	for(var j=1;j<=this.fm.numColResults;j++){
		this._snapShotObj[id].o_tablerow[i][j] = document.getElementById("o"+id+"_a"+i+""+j).innerHTML;
		this._snapShotObj[id].o_tablerowMirror[i][j] = document.getElementById("o"+id+"_a"+i+""+j+"mirror").innerHTML;
		}
	}
// delay the sending of the data using setTimeout() (notice the use of 'window' object with setTimeout()  )	
//delaySend = setInterval("delayIt(obj)",1200)
if(this._main._loading){this._snapShotObj.call = "loader";}else{this._snapShotObj.call = "user";}
if(preloading==1&&fm.name=="i8"){this._main._loading=false;}
window.obj = this;
var delaySend = setTimeout("delayIt(obj)",100);
}
function delayIt(obj){
obj.send();
}
ViewDom.prototype.reset = function(){
this._abstractview.reset(this._snapShotObj);
}
ViewDom.prototype.update = function(updateObj){
this.decodeUpdateObj(updateObj);
}
ViewDom.prototype.send = function(){
this._validator.process(this._snapShotObj)
}
ViewDom.prototype.decodeUpdateObj = function(updateObj){
var id = this.fm.formID;
var grpStr ="";
var item1,item2;
for(var i=1;i<=this.fm.numRowResults;i++){
	for(var j=1;j<=this.fm.numColResults;j++){
		document.getElementById("o"+id+"_a"+i+""+j).innerHTML = updateObj[id].o_tablerow[i][j];
		document.getElementById("o"+id+"_a"+i+""+j+"mirror").innerHTML = updateObj[id].o_tablerow[i][j];	
		}
	}
var x=1;
var completed = 0;
for(var d=0;d<this.fm.numDays;d++){
	var y = 0;
	while(document.getElementById("i"+id+"_itemLeft"+d+"_"+y+"mirror") != null){
	if(updateObj[id].i_itemLeft[x]=="")item1 = "-|";else item1 = updateObj[id].i_itemLeft[x];
	if(updateObj[id].i_itemRight[x]=="" )item2 = "-|";else item2 = updateObj[id].i_itemRight[x];
	if(item1.length==1)item1 = "0"+item1;
	if(item2.length==1)item2 = "0"+item2;
	grpStr+=item1+""+item2;
	if(updateObj[id].i_itemLeft[x]){completed++;}
		document.getElementById("i"+id+"_itemLeft"+d+"_"+y+"mirror").innerHTML = updateObj[id].i_itemLeft[x];
		document.getElementById("i"+id+"_itemRight"+d+"_"+y+"mirror").innerHTML = updateObj[id].i_itemRight[x];
		y++;
		x++;
		}
	}
// always set the koArray elements we're dealing with to their equivalent originalKOArray value. 
// ...this allows for a user entering all the values, then going back and leaving some blank...	
this._main._koArray[this._secondRoundPlacement[(id*2)-2]] = this._main._originalKOArray[this._secondRoundPlacement[(id*2)-2]];
this._main._koArray[this._secondRoundPlacement[(id*2)-1]] = this._main._originalKOArray[this._secondRoundPlacement[(id*2)-1]];
//this._main._koArray[(id*2)-2] = this._main._originalKOArray[(id*2)-2];
//this._main._koArray[(id*2)-1] = this._main._originalKOArray[(id*2)-1];
this._main.createKO();
// if all teams have played, the first two teams can be added to this._koArray...
if(completed==this.fm.fixtureRows){
	//this._main._koArray[(id*2)-2] = updateObj[id].o_tablerow[1][1];
	//this._main._koArray[(id*2)-1] = updateObj[id].o_tablerow[2][1];
	this._main._koArray[this._secondRoundPlacement[(id*2)-2]] = this.getAbbr(updateObj[id].o_tablerow[1][1]);
	this._main._koArray[this._secondRoundPlacement[(id*2)-1]] = this.getAbbr(updateObj[id].o_tablerow[2][1]);
	this._main.createKO();
	}
this._main._outpt.saveGrp(grpStr,id);
// allow Update to be clicked again...
this._main.enable();
}
ViewDom.prototype.getAbbr = function(name){
for(var i=0;i<=this._countryArray.length;i++){if(name==this._countryArray[i]){return this._countryArray[(i-1)]}}
}
// show the user that the table has been updated by changing styles
ViewDom.prototype.modifyStyles = function(){
var change = setTimeout("setStyles('#330000');",100);//1600);
var change = setTimeout("setStyles('#663333');",200);
var change = setTimeout("setStyles('#996666');",300);
var change = setTimeout("setStyles('#cc9999');",400);
var change = setTimeout("setStyles('#ffcccc');",500);
var change = setTimeout("setStyles('#ffffff');",600);
}
// I wanted 'setStyles' to be a method belonging to the ViewDOM class.
// It can't be, however, because it must be called from setTimeout()
function setStyles(col1){
var id = this.fm.formID;
	for(var i=1;i<=this.fm.numRowResults;i++){
		for(var k=1;k<=this.fm.numColResults;k++){
			this_row = document.getElementById("o"+id+"_a"+i+k);
			this_row.style.color = col1;
		}
	}
}
ViewDom.prototype.showHide=function(){
document.getElementById('ko_container').style.display = "block";
document.getElementById('loader').style.display = "none";
}