dojo.require("dijit.layout.BorderContainer");
dojo.require("dijit.layout.ContentPane");
dojo.require("dijit.form.Slider");
dojo.require("dijit.form.CheckBox");
dojo.require("dijit.form.TextBox");
dojo.require("dijit.form.NumberTextBox");
dojo.require("dijit.form.Button");
dojo.require("dijit.MenuBar");
dojo.require("dijit.PopupMenuBarItem");
dojo.require("dijit.Menu");
dojo.require("dijit.MenuItem");
dojo.require("dijit.PopupMenuItem");
dojo.require("dijit.form.Form");

// TODO 3 : this is for testing purposes - delete in production
function isPCDev() { return location.hostname==="10.10.25.57" || location.hostname==="127.0.0.1"; }
function isPCDevFixedInit() { return isPCDev() && browser()==="Firefox"; }

function hostname() { return isPCDev() ? "10.10.25.15" : location.hostname; }
function browser() { 
	return	navigator.userAgent.indexOf("MSIE")>=0 ? "MSIE" : 
			(navigator.userAgent.indexOf("Firefox")>=0 ? "Firefox" : "rest"); 
}

function getInternetExplorerVersion()
// Returns the version of Internet Explorer or a -1
// (indicating the use of another browser).
{
  var rv = -1; // Return value assumes failure.
  if (navigator.appName == 'Microsoft Internet Explorer')
  {
    var ua = navigator.userAgent;
    var re  = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
    if (re.exec(ua) != null)
      rv = parseFloat( RegExp.$1 );
  }
  return rv;
}

function onParametersChange() { onParametersChange2(); }

function backString(fullString, subString) {
	if(fullString.lastIndexOf(subString)===-1) {
		return null;
	} else {
		return fullString.substring(fullString.lastIndexOf(subString)+1, fullString.length);
	}
}

function getCameraParam(name) {
	if (isPCDevFixedInit()) {
		return "3";
	} else {
		var xmlhttp = new XMLHttpRequest();
		var url = /*"http://" + hostname() +*/ "/get?" + name + "&id=" + (new Date()).getTime() + "&ver=http/1.1"; 

		try {
			xmlhttp.open('GET', url, false);
			xmlhttp.send(null);
			var value = backString(xmlhttp.responseText,'=');
			return value===null ? null : decodeURIComponent(value);		
		} catch (e) {
			return null;
		}
	}	
}

function setCameraParam(name, value) {
	if (!isPCDevFixedInit()) {
		var xmlhttp = new XMLHttpRequest();
//		var url = /*"http://" + hostname() +*/ "/set?" + name + "=" + encodeURIComponent(value) + "&id=" + (new Date()).getTime();
		var url = /*"http://" + hostname() +*/ "/set?" + name + "=" + value + "&id=" + (new Date()).getTime();
				
		try {
			xmlhttp.open('GET', url, false);
			xmlhttp.send(null);
			var value = backString(xmlhttp.responseText,'=');
			return value===null ? null : decodeURIComponent(value);					
		} catch (e) {
			// do nothing
		}
		
		av.savedParams(name==="params");
	}
}	

// avoid; use getCameraParam() whenever possible
function getCameraRegister(page, reg) {
	if (isPCDevFixedInit()) {
		return "3";	
	} else {
		var xmlhttp = new XMLHttpRequest();
		var url = /*"http://" + hostname() +*/ "/getreg?page=" + page + "&reg=" + reg + "&id=" + (new Date()).getTime() + "&ver=http/1.1"; 
		
		try {
			xmlhttp.open('GET', url, false);
			xmlhttp.send(null);
			var value = backString(xmlhttp.responseText,'=');
			return value===null ? 0 : Number(value);		
		} catch (e) {
			return null;
		}
	}	
}

//avoid; use setCameraParam() whenever possible
function setCameraRegister(page, reg, value) {
	if (!isPCDevFixedInit()) {
		var xmlhttp = new XMLHttpRequest();
		var url = /*"http://" + hostname() +*/ "/setreg?page=" + page + "&reg=" + reg + "&val=" + value + "&id=" + (new Date()).getTime();
		
		try {
			xmlhttp.open('GET', url, false);
			xmlhttp.send(null);
		} catch (e) {
			// do nothing
		}
		
		av.savedParams(false);
	}
}	

function slowdown() {
	var time = (new Date).getTime();
	while (time === (new Date).getTime()) { ; }
}

var av = {
	// 264Quality : { param: "qp", arg: "quality"  },  not set correctly as of 02/28 because of bug
	documentTitle : function() { return "Arecont Vision Camera"; },
	saved : true,
	savedParams : function(b) {
		if (b !== this.saved) {
		//	document.title = (b ? this.documentTitle() : "<not saved!> " + this.documentTitle());
			this.saved = b;
		}
	},
	
	registerControlDependency : function(control, dependsOn) {
		if (dependsOn !== null) {
			dependsOn.listeners.push(control);
			if (!dependsOn.checked || dependsOn.disabled) {
				control.set('disabled', true);
			}
			
			if (control.hasOwnProperty('associatedControl') && control.associatedControl !== null) {
				av.registerControlDependency(control.associatedControl, dependsOn);
			}
		}
	},
	
	pwdStrAdmin	: "setPwd admin",
	pwdStrViewer: "setPwd viewer",
	
	setPassword : function(strOnClick, aval) {
		var name, p0, p1;
		
		function setPwd(name, v0, v1) {
			if(typeof v0 !== 'string' || typeof v1 !== 'string') {
				alert('Fill in the password and confirm!');	
			} else if (v0 !== v1) {
				alert('The password and its confirmation must be identical!  Try again.');				
			} //else if (v0 !== encodeURIComponent(v0)) {
			//	alert('The password contains dangerous symbols!  Try again.');				
			//} 
			else if (v0 === 'empty') {
				alert('Press Erase to erase the password.');				
			} else {
				var i;
				for (i=0; i<v0.length; i++)
				{  
		  if(v0.charAt(i) == '#' || v0.charAt(i) == '%' || v0.charAt(i) == '&' || v0.charAt(i) == '`' || v0.charAt(i) == '"' || v0.charAt(i) == '\'' || v0.charAt(i) == '<' || v0.charAt(i) == '>' || v0.charAt(i) == ' ')					{
						document.title = 'pword:' + v0 + ' ' + 'i=' + v0.charAt(i) + ' ' + v0.length + ' ' + i;
						break;
					}
				}
				if (i < v0.length) alert('The password may contain illegal symbols, such as # % & ` \" \' < >, etc!  Try again.');
				else 
				{
					p1 = setCameraParam(name, v0);

					if (v0.toLowerCase() != p1) 
					{
						alert('The password setup failed! Your current password is:' + p1);
					}
					else if (name === "admin")  setTimeout("location.reload(true);",1000);
					else alert('The viewer password is set successfully!');
				}
			}
		}

		if 	(strOnClick === this.pwdStrAdmin) {
			name = "admin";
		} else if	(strOnClick === this.pwdStrViewer) {
			name = "viewer";
		} else {
			return; // should not be possible
		}
		
		if (aval === null) {
			setCameraParam(name, "empty");
			// TODO 1: empty visible values ...
			if (strOnClick === this.pwdStrAdmin) 
			{
				dijit.byId("textbox"+"admin password").setValue("");
				dijit.byId("textbox"+"confirmation1").setValue("");
			}
			else
			{
				dijit.byId("textbox"+"viewer password").setValue("");
				dijit.byId("textbox"+"confirmation2").setValue("");			
			}
			
		} else {
			setPwd(name, aval[0].getValue(), aval[1].getValue());
		}
	}
};

var avutil = {
	//_date : new Date(),
	getTime : function () { return (new Date()).getTime(); }, 

	createNamed : function (element, name) {
		var el = document.createElement(element);
		el.id = name;
		return el;
	},
	
	createAppend : function (container, element, name) {
		if (typeof container === 'string') {
			container = document.getElementById(container);
		}
		
		if (typeof element === 'string') {
			element = document.createElement(element);
		}
		
		if (typeof name === 'string') {
			element.id = name;
		}
		
		container.appendChild(element);
		return element;
	},
	
	insertText : function (container, text) {
		if (typeof container === 'string') {
			container = document.getElementById(container);
		}
		
		var newtext=document.createTextNode(text);
		container.appendChild(newtext);		
		return newtext;
	},
	
	remove : function (id) {
		var element = document.getElementById(id);
		element.parentNode.removeChild(element);
	},

	ipValidator : function (ipaddr) {
		var re = /^\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}$/,
			i;
		if (re.test(ipaddr)) {
			var parts = ipaddr.split(".");
			for (i=0; i<parts.length; i++) {
				if (parseInt(parts[i], 10) > 255) { 
					return false; 
				}
			}
			return true;
		} else {
			return false;
		}
	},
	
	// set value between margins
	limit : function(value, margin1, margin2) {
		var low = Math.min(margin1, margin2),
			high = Math.max(margin1, margin2);
		
		return Math.max(Math.min(value, high), low);
	}
};

function divisible(value, divisor, direction) {
	if (typeof direction === 'undefined' || direction === 0) {
		return Math.round(value/divisor)*divisor;
	} else if (direction == 1) {
		return Math.ceil(value/divisor)*divisor;		
	} else if (direction == -1) {
		return Math.floor(value/divisor)*divisor;		
	}
}

//get dimensions of the sensor
function getSensorDims() {
	var dims = {};
	
	dims.left = Number(getCameraParam("sensorleft"));
	dims.top = Number(getCameraParam("sensortop"));
	dims.width = Number(getCameraParam("sensorwidth"));
	dims.height = Number(getCameraParam("sensorheight"));
	
	if (typeof dims.left === 'number' && typeof dims.top === 'number' && typeof dims.width === 'number' && typeof dims.height === 'number') {
		return dims;
	}
}

function getMaxSensorDims() {
	var dims = {};
	
	dims.left = 0;
	dims.top = 0;
	dims.width = Number(getCameraParam("maxsensorwidth"));
	dims.height = Number(getCameraParam("maxsensorheight"));
	
	if (typeof dims.width === 'number' && typeof dims.height === 'number') {
		return dims;
	} else {
		return getSensorDims();
	}
}

function checkDims(img) {
//	var dimsSensor = getSensorDims(),
//	limitMsg = "",
	proceed = true;
	
/*	if (dimsSensor && (img.left<dimsSensor.left || img.top<dimsSensor.top || img.right>dimsSensor.left+dimsSensor.width || img.bottom>dimsSensor.top+dimsSensor.height)) {
		//limitMsg = (dimsSensor.left==0 && dimsSensor.top==0 ? "" : "  The sensor is probably cropped to less than its size.");
		proceed = confirm("You are trying to set image size outside of the sensor logical boundaries, which are (" +
				dimsSensor.left + ", " + 
				dimsSensor.top + ", " + 
				dimsSensor.width + ", " + 
				dimsSensor.height + ")" +
				" in the order (left, top, width, height)." + limitMsg + "\n\n Would you like to proceed?");
	}
*/
	return (proceed == true);
}

function checkImgSize() { 
	var imgLTRB = {};
	
	imgLTRB.left = image.left.getValue();
	imgLTRB.top = image.top.getValue();
	imgLTRB.right = image.right.getValue();
	imgLTRB.bottom = image.bottom.getValue();
	
	return checkDims(imgLTRB);
}

// disable element with the label and dependent elements
function disableVisual(control, val) {
	var i;
	control.associatedControl && control.associatedControl.set('disabled', val);
	control.set('disabled', val);
	if (control.listeners && control.listeners.length) {
		for (i=0; i<control.listeners.length; i++) {
			control.listeners[i] && disableVisual(control.listeners[i], val);
		}
	}
}

// Do not try to select these controls by name, because the names are given based on the visual names
function createCheckbox(visname, param, on, off, dependsOn, instantUpdate, decor) {
	var initval = (typeof param === 'function') ? param('get') : getCameraParam(param),
		leading = document.getElementById('leading_region'),
		disablement = false;
		
	if (initval === null) {
		// this camera does not support this parameter
		initval = '';
		disablement = true;
	}
	
	// create the DOM elements
	var space = document.createElement('prelabel');
	space.innerHTML = '<br />' + ((decor && decor.pre) ? decor.pre : '');
    leading.appendChild(space);
    
	var input = avutil.createNamed('input', "checkBox" + visname);
    leading.appendChild(input);
	
    var label = document.createElement('label');
    label.htmlFor = input.id;
    label.value = label.innerHTML = '&nbsp;' + visname;
    leading.appendChild(label);
    
    leading.appendChild(document.createElement('br'));
        
	// create the dijit object
    var checkBox = new dijit.form.CheckBox({
        name: "checkBox",
        value: initval ,
        // TODO 1: check why ==
        checked: (initval==on),   
        param : param,
        listeners: [],
		onChange: function(val) {
			var i;

			this.value = val?on:off;  
		    if (instantUpdate) {
		    	this.onChange2();
		    } 
    
			for (i=0; i<this.listeners.length; i++) {
				disableVisual(this.listeners[i], !this.checked);
			}
		}
    },
    "checkBox" + visname);
    
    // TODO 1: why is this necessary (otherwise aradio[0].value === 'on')?
    checkBox.value = initval;  
    
    disablement && disableVisual(checkBox, true);
    
	function setToCamera() {
		if (typeof param === 'function') {
			param('set', this.value);			
		} else {
			setCameraParam(param, this.value);
		}
		
		onParametersChange();				
	}
	
	if (instantUpdate) {
		checkBox.onChange2 = setToCamera;
	} else {
		checkBox.onSet = setToCamera;
		checkBox.getValue = function() { return this.value; };
	}
	
    av.registerControlDependency(checkBox, dependsOn);
    
    return checkBox;
}

// param is:
//	for camera parameters - string
//	for other - function to call 
function createRadioSet(visname, param, aval, dependsOn, instantUpdate, decor) {
	var initval = (typeof param === 'function') ? param('get') : getCameraParam(param),
		leading = document.getElementById('leading_region'),
		aradio = [],
		disablement = false,
		leadBr = (decor && decor.noLeadBr ? "" : "<br />"),
		i;
				
	if (!(decor && decor.noLegend))
	{
		if (initval === null) {
			// this camera does not support this parameter
			initval = '';
			disablement = true;
		}

		// create DOM element with the title
		var div = document.createElement('span');
			div.innerHTML = leadBr + '<br /> ' + visname + ' <br /><br />';
		leading.appendChild(div);
	}
	
	for (i=0; i<aval.length; i++) {
		// create the DOM elements
		var input = avutil.createNamed('input', "radio" + visname + i);
        leading.appendChild(input);
		
        var label = document.createElement('label');
        label.htmlFor = input.id;
        label.value = label.innerHTML = '&nbsp;' + aval[i][1];
        leading.appendChild(label);
        
        leading.appendChild(document.createElement('br'));

		// create the dijit object
        aradio[i] = new dijit.form.RadioButton({
            name: visname,
            value: aval[i][0],
            checked: (initval===aval[i][0]),
            param : param,
            listeners: [],
			onChange: function(val) {
				var i;

			    if (instantUpdate && val===true) {
			    	this.onChange2i();
			    } 

				for (i = 0; i < this.listeners.length; i++) {
					disableVisual(this.listeners[i], !this.checked);
				}
			}
		}, input.id);
        
        // TODO 1: why is this necessary (otherwise aradio[0].value === 'on')?
        aradio[i].value = aval[i][0];       

        disablement && disableVisual(aradio[i], true);
        
    	if (instantUpdate) {
    		aradio[i].onChange2i = setToCamera;
    	}
    	
	    av.registerControlDependency(aradio[i], dependsOn);
	}        
	
	function setToCamera() {
		if (typeof param === 'function') {
			param('set', this.value);			
		} else {
			setCameraParam(param, this.value);
		}
		
		onParametersChange();				
	}
	
	if (!instantUpdate) {
		aradio.onSet = function() {
			var tmp = new Object();
			tmp.value = this.getValue();
			setToCamera.apply(tmp);
		}
		
		aradio.getValue = function() { 
			var i;
			for (i=0; i<this.length; i++) {
				if (this[i].checked) {
					return this[i].value;
				}
			}
			return null;
		}
	}	
	
	return aradio;
}

// important: if the parameter, received from camera, is outside range, it is set to the range by this control
function createTextBox(visname, minval, maxval, validator, param, containingElement, dependsOn, instantUpdate, decor) {
	var initval = (typeof param === 'function') ? param('get') : getCameraParam(param),
		div = containingElement,
		space = "",
		leading = null,
		textbox = null,
		disablement = false,
		nameExtension = (typeof div === 'number' ? String(div) : "");
	
	if (initval === null) {
		// this camera does not support this parameter
		initval = '';
		disablement = true;
	}
	
	// create containing element; typeof div === 'number' is used to distinguish between elements with the same name
	if (div===null || typeof div === 'number') {
		space = '<br />' + ((decor && decor.pre) ? decor.pre : '');
		leading = document.getElementById('leading_region');
		div = document.createElement('div');
		leading.appendChild(div);
	}
		
	// TODO 1: make spacing so that left/right/top/bottom for images are aligned
	// TODO 1: alignment in passwords and some other boxes
	// create DOM element 
	div.innerHTML += space + '<span "style: height: 1.5em; font-size: 150%; color:black">' + visname +':&nbsp;&nbsp;</span>';
	div.innerHTML += (decor && decor.rtspLinkData) ? "<br />" : "";
	
	div.appendChild(avutil.createNamed('input', "textbox" + visname + nameExtension));	
	
	// create the dijit object
	if (typeof minval === 'number' && typeof maxval === 'number') {
		textbox = new dijit.form.NumberTextBox({
			name: "textbox",
			value: parseInt(initval,10),
	        constraints: {
				min: minval,
				max: maxval,
                pattern: "#####"
	        },
	        style: "width:55px",
	        param : param
		},
		"textbox" + visname + nameExtension);	
	} else {
		textbox = new dijit.form.TextBox({
			name: "textbox",
			value: initval,
	        style: (decor && decor.rtspLinkData) ? "width: 270px; font-style: italic; font-size: 75%;" : "width: 130px;",
	        maxLength: (decor && decor.maxLength) ? decor.maxLength : 255,
	        type : (decor && decor.password) ? "password" : "input",
	        param : param
		},
		"textbox" + visname + nameExtension);	
	}

    disablement && disableVisual(textbox, true);       
    
	function validate(that) {
		if ( (that instanceof dijit.form.NumberTextBox) && !isNaN(that.value) )
		{
			if (that.value<that.constraints.min) that.setValue(that.constraints.min);
			if (that.value>that.constraints.max) that.setValue(that.constraints.max);
		}
		var numTest = !(that instanceof dijit.form.NumberTextBox) || (!isNaN(that.value) && that.constraints.min<=that.value && that.value<=that.constraints.max);
		return numTest && (validator==null || validator(that.value));
	}
	
	function setToCamera() {
		// TODO 1: delete leading & trailing white spaces from the value
		if (validate(this)) {
			if (typeof param === 'function') {
				param('set', this.value);			
			} else {
				setCameraParam(param, this.value);
			}
			onParametersChange();				
		} else {
			alert(visname + " has invalid value!");
    	}
	}
	
	if (instantUpdate) {
		textbox.onBlur = setToCamera;
		//textbox.onKeyPress = function () { (evt.keyCode === 13) && setToCamera(); };
	} else {
		textbox.onSet = setToCamera;
		textbox.getValue = function() { return validate(this) ? this.value : null; };
	}
	
    av.registerControlDependency(textbox, dependsOn);
    
	return textbox;
}

//important: if the parameter, received from camera, is outside range, it is set to the range by this control
function createSlider(visname, minval, maxval, param, mincamera, maxcamera, dependsOn, instantUpdate, decor) {
	var initval = (typeof param === 'function') ? param('get') : getCameraParam(param),
		disablement = false,
		leading = document.getElementById('leading_region');
						
	var tickRatio = (maxval - minval + 1) / (maxcamera - mincamera + 1);
	var midVal = (maxval + minval)/2;
	var midCamera = (maxcamera + mincamera)/2-0.01;
	var noMap = (minval===mincamera && maxval===maxcamera);
	
	function val2camera(val){
		if (noMap) {
			return val;
		} else if (val === minval) {
			return mincamera;
		} else if (val === maxval) {
			return maxcamera;
		} else {
			var step = (val-midVal)/tickRatio;
			var r = Math.round(Math.round(step)+midCamera);
			return avutil.limit(r, maxcamera, mincamera);
		}
	}			
	function camera2val(camera){
		if (mincamera <= maxcamera)
		{
			if (camera <= mincamera) {
				return minval;
			} else if (camera >= maxcamera) {
				return maxval;
			}
		}
		else
		{
			if (camera >= mincamera) {
				return minval;
			} else if (camera <= maxcamera) {
				return maxval;
			}
		}
		
		if (noMap) {
			return camera;
		} else {
			var step = minval + (camera - mincamera)*(maxval - minval)/(maxcamera - mincamera) - 0.01;
			var r = Math.round(step);
			return avutil.limit(r, maxval, minval);
		}
	}			

	if (initval === null) {
		// this camera does not support this parameter
		initval = String(minval<0 ? 0 : minval);
		disablement = true;
	}
		
	// create DOM element 
	var div = document.createElement('div');
	//div.innerHTML += '<br /><span "style: height: 1.5em; font-size: 150%;">' + visname +':&nbsp;&nbsp;</span>';
	div.innerHTML += '<br /><span>' + visname +':&nbsp;&nbsp;</span>';
	//div.innerHTML += '<input id="textbox' + visname + '">';
	div.appendChild(avutil.createNamed('input', "textbox" + visname));
	div.appendChild(document.createElement('br'));
		var sldiv = avutil.createNamed('div', 'slider' + visname);
		sldiv.appendChild(avutil.createNamed('span', "hrule" + visname));
		sldiv.appendChild(avutil.createNamed('span', "hruleLabels" + visname));
	div.appendChild(sldiv);
		
	leading.appendChild(div);

	// create the dijit object
    var slider = new dijit.form.HorizontalSlider({
        name: "slider",
        value: Number(camera2val(initval)),
        minimum: minval,
        maximum: maxval,
        discreteValues: Math.min(Math.abs(maxcamera-mincamera)+1, maxval-minval+1),
        intermediateChanges: true,
        style: (decor && decor.sliderWidth ? "width:" + decor.sliderWidth + ";" : "width:270px;"),
        _mouseWheeled: function(evt) {},
        onChange: function(value) {
			this.primaryControl.set('value', camera2val(val2camera(Math.round(this.value))));
            if (instantUpdate) {
            	this.primaryControl.onChange2();
            }
        }
    },
    "slider" + visname);
    		
    var hrule = new dijit.form.HorizontalRule({
		count: Math.min(11,  Math.abs(maxcamera - mincamera) + 1),
		style: "height: 5px;"
    },
    "hrule" + visname);
    
    var newArray, rightEnd;
    rightEnd = (decor && decor.rend && typeof decor.rend === 'string') ? String(maxval-1) + "&nbsp;&nbsp;&nbsp;&nbsp;" + decor.rend : maxval;
    if (maxcamera-mincamera === 3) {
		newArray = [minval, Math.round((maxval+minval)/3), Math.round((maxval+minval)*2/3), maxval];
    } else {
		newArray = [minval, Math.round((minval+maxval)/2-0.01), rightEnd];
    }
    
    var hrulelabels = new dijit.form.HorizontalRuleLabels({
		style: "height: 1em; font-size: 75%;",
		labels: newArray 
	},
    "hruleLabels" + visname);
    
	var textbox = new dijit.form.NumberTextBox({
		name: "textbox",
		value: Number(camera2val(initval)),
        constraints: {
			min: minval,
			max: maxval
        },
        style: "width:35px;",
        param : param,
        onChange: function() {
        	// currently it is in use only for fps
            if (decor && decor.rend && typeof decor.rend === 'string' && (this.value===maxval || this.value===decor.rend)) {
            	this.set('disabled', true);
				this.set('displayedValue', decor.rend); 
            } else if (decor && decor.rend && typeof decor.rend === 'string' && minval<=this.value &&this.value<maxval) {
            	this.set('disabled', false);
				this.set('displayedValue', this.value);            	
            }
        }, 
		onKeyPress : function (evt) { 
			// when the user presses Enter in the field
			var val;
			if (evt.keyCode === 13) {
				val = parseInt(this.get('value'), 10);
				if (typeof val === 'number') {
					this.value = val;
					this.onBlur();
				}
			}
		},
        onBlur: function() {
            if (validateEither(this)) {
				this.set('value', camera2val(val2camera(Math.round(this.value))));
				this.associatedControl.set('value', this.value);
            }
        } 
	},
	"textbox" + visname);

	textbox.associatedControl = slider;
    slider.primaryControl = textbox;
    
    //disablement && (textbox.set('disabled', true), slider.set('disabled', true));
    disablement && disableVisual(textbox, true);
    textbox.onChange();
    
	function validateEither(that) {
		return	!isNaN(that.value) && 
				(that.constraints ? that.constraints.min : that.minimum)<=that.value && 
				that.value<=(that.constraints ? that.constraints.max : that.maximum);
	}
	
	function setToCamera() {				
		if (validateEither(this.associatedControl)) {
			if (typeof param === 'function') {
				param('set', val2camera(this.associatedControl.value));			
			} else {
				setCameraParam(param, val2camera(this.associatedControl.value));
			}
			onParametersChange();				
		} else {
			alert(visname + " has invalid value!");
    	}
	}
	
	if (instantUpdate) {
		textbox.onChange2 = setToCamera;
	} else {
		textbox.onSet = setToCamera;
		textbox.getValue = function() { return validateEither(this.associatedControl) ? val2camera(this.associatedControl.value) : null; };
	}
	
	av.registerControlDependency(textbox, dependsOn);
    			
    return textbox;
}

function createButton(visname, strOnClick, aval, decor) {
	var leading = document.getElementById('leading_region'),
		//centerPlain = (decor && decor.left ? "" : "<center>"),
		button;
		
	if (typeof decor === 'object' && decor.pre==='br') {
		avutil.createAppend(leading, decor.pre);
	}
	
	// create the DOM elements
	avutil.insertText(leading, " ");    
	avutil.createAppend(leading, 'button', "button" + visname);    
	avutil.insertText(leading, " ");    
	
	if (typeof strOnClick === 'function') {
		button = new dijit.form.Button({
	        label: visname,
	        id: visname + '-' + strOnClick.toString().length,
	        onClick: strOnClick
	    },
	    "button" + visname);
	} else if (strOnClick.substring(0, 7) === "setPwd "){
		// setting password
		button = new dijit.form.Button({
	        label: visname,
	        id: visname + '-' + strOnClick.substring(7),
	        onClick: function() { av.setPassword(strOnClick, aval); }
	    },
	    "button" + visname);
	} else {
		button = new dijit.form.Button({
	        label: visname,
	        id: visname + '-' + strOnClick +'-'+ aval.length +'-'+ aval.join().length,
	        onClick: function() {
	        	var i, save, onclickset = strOnClick;
	        		
	        	if (strOnClick === 'onSetVideo' && checkImgSize()) {
	        		applyVideo();
	        		onclickset = 'onSet';
	        		// continue as usual
	        	} else if(strOnClick === 'onSetVideo') {
	        		document.title = 'onSetVideo empty';
	        		return;
	        	}
	        	
			else if(strOnClick === 'onSetSave') {
	        		onclickset = 'onSet';
	        		save = 'true';
			}
			
				for (i=0; i<aval.length; i++) {
					if (typeof aval[i] === 'object') {
						aval[i][onclickset] ();
					} else if (typeof aval[i] === 'function') {
						aval[i]();
					}
				}
			if (save === 'true')
				setCameraParam('params', 'save');
	        }
	    },
	    "button" + visname);
	}

	if (typeof decor === 'object' && decor.suf==='br') {
		avutil.createAppend(leading, decor.suf);
	}
	
	return button;
}

function createText(text, isTitle, id, decor) {
	var leading = document.getElementById('leading_region'),
		div = document.createElement('div'),
		leadBr = (decor && decor.noLeadBr ? "" : "<br />"),
		postBr =  (decor && decor.noPostBr ? "" : "<br />"),
		centerPlain = (decor && decor.left ? "" : "<center>");
	
	id && (div.id = id);
	
	if (isTitle === true) {
		div.innerHTML += (leadBr +'<br /><center><font size="+2">' + text + '</font><br /><br />');
	} else if (decor && decor.rtspLinkData===true) {
		div.innerHTML += (leadBr + '<i>' + text + '</i>' + postBr);
	} else if (decor && decor.fontSmaller===true) {
		div.innerHTML += (leadBr + '<font size="-2">' + text + '</font>' + postBr);
	} else {
		div.innerHTML += (leadBr + centerPlain + text +  postBr);
	}
	
	leading.appendChild(div);
	
	return div;
}
  

function accessFull() {
	 var reply = getCameraParam("viewer");
	 return reply !== "Access denied!";
}

function upgrade(F) {		
	function fwloader() {
		document.getElementById('PostForm').submit();
		alert("The firmware was upgraded. Please wait about 2 minutes while the camera is rebooting and refresh this web page.");
	}

	if(!accessFull()) {
		alert("Access denied!");
		return;
	}

	if (F.UpgradeFile.value == '')	{
		alert('Please select a file to upgrade !');
		return false;
	}

	clearInterval(image.irisTimeout);
	imageRemove();
	setTimeout(fwloader, 2000);
}

function createUpgradeForm() {
	var leading = document.getElementById('leading_region'),
		formString = "<br /> <br /> <br />" +
			"<form action='fwupdate' name='PostForm' id='PostForm' method=POST enctype=multipart/form-data>" +
			"	&nbsp;	Firmware Upgrade:<br /><br />" +
			"	<input type=FILE name='UpgradeFile'> <br /><br />" +
			"	<input type=button style='color: #FF0000' name='Upgrade' value='Upgrade' onClick='upgrade(this.form)'>" +
			"</form>",
		div = avutil.createAppend(leading, 'div');

	div.innerHTML += formString;
}

function upload(F) {		
	function uploader() {
		document.getElementById('SpeakerForm').submit();
		alert("The file was uploaded. Please wait about 2 minutes while the camera is rebooting and refresh this web page.");
	}

	if (F.SpeakerFile.value == '')	{
		alert('Please select a file to upload !');
		return false;
	}

	//imageRemove();
	setTimeout(uploader, 2000);
}

function createSpeakerForm() {
	var leading = document.getElementById('leading_region'),
		formString = "<br /> <br /> <br />" +
			"<form action='g711' name='SpeakerForm' id='SpeakerForm' method=POST enctype=multipart/form-data>" +
			"	&nbsp;	Speaker File Upload:<br /><br />" +
			"	<input type=FILE name='SpeakerFile'> <br /><br />" +
			"	<input type=button style='color: #FF0000' name='Upload' value='Upload' onClick='upload(this.form)'>" +
			"</form>",
		div = avutil.createAppend(leading, 'div');

	div.innerHTML += formString;
}


// <div 	text-align: center>