/*Sotecma */ 
/* On connait la racine du document images. On cherche juste a definir la taille à utiliser
 On a trois tailles 
  1 - Petit ~640px
  2 - Moyen ~1024px
  3 - Grand ~1600px

*/

delimiter		= ',' ;

array_img_sizes 	= new Array ;
array_img_sizes[1] 	= '640' ;
array_img_sizes[2] 	= '1024' ;
array_img_sizes[3] 	= '1600' ;

isNS4 = (document.layers) ? 1 : 0;
isIE4 = (document.all) ? 1 : 0;
isW3C = (document.getElementById && !document.all) ? 1 : 0;

// Drag
var ImgID='main_picture'
var ImgContainer='preview_scroller'
ImgTitle 			= new Array ;
ImgTitle['en-CA'] = 'Click and Drag!' ;
ImgTitle['fr-CA'] = 'Cliquez et déplacez!' ;

function CallOnload()
	{
	// Trigget setheight when main picture load...
	document.getElementById('main_picture').onload = function () { setHeight() ; }

	swap_img_size();
	}

function swap_img_size() 
	{
	img_swap_tmp = new Image ;
	img_swap_tmp  = img_root_dir + img_prefix_name + '-' + img_id + '-' + array_img_sizes[getInputValue(document.form_main.elements['img_full_size'],delimiter)] + '.jpg' ;
	//alert(img_swap_tmp) ;
	document.getElementById('main_picture').src = img_swap_tmp ;
	}

function setHeight()
	{
	var myWidth 		= 0 ;
	var myHeight 		= 0 ;
	var myHeightmin 	= 400 ;
	var heightSum 		= 0 ;

	ElementId 	= new Array ;
	ElementId[1] = 'visio_header' ;
	ElementId[2] = 'visio_col2_h2_1' ;
	ElementId[3] = 'visio_col2_h2_2' ;
	ElementId[4] = 'visio_col2_caption' ;

	if(isW3C){

		for(var i=1;i<ElementId.length;i++) {
			if(document.getElementById(ElementId[i]))
				{
				heightSum += parseInt(document.getElementById(ElementId[i]).offsetHeight) 
				heightSum += parseInt(document.defaultView.getComputedStyle(document.getElementById(ElementId[i]),"").getPropertyValue('margin-top').replace('px' , '')) 
				heightSum += parseInt(document.defaultView.getComputedStyle(document.getElementById(ElementId[i]),"").getPropertyValue('margin-bottom').replace('px' , '')) ; 
				}
			}

		heightSum += parseInt(document.defaultView.getComputedStyle(document.getElementById('preview_scroller'),"").getPropertyValue('margin-top').replace('px' , '')) 
		heightSum += parseInt(document.defaultView.getComputedStyle(document.getElementById('preview_scroller'),"").getPropertyValue('margin-bottom').replace('px' , '')) ; 

		}

	else if(isIE4) 
		{
		
		for(var i=1;i< ElementId.length;i++) {
			if(document.getElementById(ElementId[i])) if(parseInt(document.getElementById(ElementId[i]).offsetHeight)) 									heightSum += parseInt(document.getElementById(ElementId[i]).offsetHeight) ;
			if(document.getElementById(ElementId[i])) if(parseInt(document.getElementById(ElementId[i]).currentStyle.marginTop.replace('px' , ''))) 		heightSum += parseInt(document.getElementById(ElementId[i]).currentStyle.marginTop.replace('px' , '')) ;
			if(document.getElementById(ElementId[i])) if(parseInt(document.getElementById(ElementId[i]).currentStyle.marginBottom.replace('px' , ''))) 	heightSum += parseInt(document.getElementById(ElementId[i]).currentStyle.marginBottom.replace('px' , '')) ;
			}
			
		heightSum += parseInt(document.getElementById('preview_scroller').currentStyle.marginTop.replace('px' , '')) ;
		heightSum += parseInt(document.getElementById('preview_scroller').currentStyle.marginBottom.replace('px' , '')) ; 
		
		}

		
	if(typeof( window.innerWidth ) == 'number' ) {
		//Non-IE
		myWidth = window.innerWidth;
		myHeight = window.innerHeight ;}
	else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
		//IE 6+ in 'standards compliant mode'
		myWidth = document.documentElement.clientWidth;
		myHeight = document.documentElement.clientHeight ;}
	else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
		//IE 4 compatible
		myWidth = document.body.clientWidth;
		myHeight = document.body.clientHeight ; }


    var myHeightNew = myHeight - heightSum - 30 ;

	if(document.getElementById('main_picture').height < myHeightNew)
		{
		myHeightNew = document.getElementById('main_picture').height ;
		}

	if(myHeightNew < myHeightmin)
		{
		myHeightNew = myHeightmin ;
		}

	//if(timeoutMode == true)
	setTimeout("document.getElementById('preview_scroller').style.height = " +  myHeightNew  + " + 'px'", 100) ;
	
	


		//	alert(document.getElementById('visio_container').offsetWidth + '>' + visio_container_limit) ;		
		if((document.getElementById('visio_container').offsetWidth < visio_container_limit ) || ( myWidth < visio_container_limit ))
			{
			//alertmsg  = 'fixed ' + '-' +document.getElementById('visio_container').offsetWidth + ' - ' + myWidth + ' - ' + visio_container_limit ;	
			document.getElementById('visio_container').style.width =  visio_container_limit + 'px' ;

			}
		else
			{
			//alertmsg = 'fluid ' + '-' +document.getElementById('visio_container').offsetWidth + ' - ' + myWidth + ' - ' + visio_container_limit ;		
			document.getElementById('visio_container').style.width =  'auto' ;
			}

		myWidthNew = document.getElementById('visio_container').offsetWidth  - (
	
			  parseInt(document.getElementById('visio_col1').offsetWidth)
			+ parseInt(document.getElementById('visio_col3').offsetWidth)
			+ 20
		//	+ 30
			) ;
			
		if(isIE4) /* maudit browser */
			{	
			//if(timeoutMode == true)	
			setTimeout("document.getElementById('preview_scroller').style.width = " + myWidthNew  + " + 'px'" , 0) ;
			// On store la valeur pour le dragging
			/* alert( alertmsg + ' | ' + myWidthNew + ' | ' + document.getElementById('visio_container').offsetWidth + ' | ' + parseInt(document.getElementById('visio_col1').offsetWidth) + ' | ' + parseInt(document.getElementById('visio_col3').offsetWidth)) ; */
			}

	// var pour click and drag		
	document.getElementById('main_picture_SizeY').value =  myHeightNew ;
	document.getElementById('main_picture_SizeX').value =  myWidthNew  ;
	centerImg() ;
 	setGUI() ;
	}

if (window.addEventListener) {
	window.addEventListener("resize",setHeight,false) ; }		
else if(window.attachEvent){
	window.attachEvent("onresize",setHeight); }
else{
	onresize=document.getElementById('visio_container').setHeight ; }


////////////////////////////////////////////////////////////////////
//                            Drag Image!                         //
////////////////////////////////////////////////////////////////////
//Generic Drag Script- © Dynamic Drive (www.dynamicdrive.com)
//For full source code and terms of usage,
//visit http://www.dynamicdrive.com

var ie=document.all
var ns6=document.getElementById&&!document.all

var dragapproved=false
var z,x,y

var moveToTmpX=0
var moveToTmpY=0
var rangeX=0
var rangeY=0

function centerImg()
	{
	if(document.getElementById(ImgID).height < document.getElementById('main_picture_SizeY').value) document.getElementById(ImgID).style.top = ((document.getElementById('main_picture_SizeY').value - document.getElementById(ImgID).height) / 2) + 'px'
	if(document.getElementById(ImgID).width < document.getElementById('main_picture_SizeX').value) document.getElementById(ImgID).style.left = ((document.getElementById('main_picture_SizeX').value - document.getElementById(ImgID).width) / 2) + 'px'

	if(document.getElementById(ImgID).height >= document.getElementById('main_picture_SizeY').value) document.getElementById(ImgID).style.top = 0 + 'px' ;
	if(document.getElementById(ImgID).width >= document.getElementById('main_picture_SizeX').value) document.getElementById(ImgID).style.left = 0 + 'px' ;
	}


	
function move(e){

if (dragapproved){



// On débute par vérifier si la taille en X et Y de l'image est > à la zone d'affichage disponible
// Y (top)

	moveToTmpY=ns6? temp2+e.clientY-y : temp2+event.clientY-y	
	rangeY = document.getElementById('main_picture_SizeY').value - document.getElementById(ImgID).height
	if(moveToTmpY <= 0 && moveToTmpY >= rangeY)
		{
		z.style.top=moveToTmpY + 'px' ;
		}

// X (left)

	// On limite les coordonnes a un range qui empeche la creation de zones blanches
	//(taille zone d'affichage - taill img si l'image est plus grande que la zone d'affiche... autrement on desactive le drag)
	moveToTmpX=ns6? temp1+e.clientX-x: temp1+event.clientX-x
	rangeX = document.getElementById('main_picture_SizeX').value - document.getElementById(ImgID).width
	if(moveToTmpX <= 0 && moveToTmpX >= rangeX) 
		{
		z.style.left=moveToTmpX + 'px' ;
		}

// Debug
//document.getElementById('pos').value = document.getElementById(ImgID).style.cursor + '|' + document.getElementById('main_picture_SizeY').value + 'x' + document.getElementById('main_picture_SizeX').value + '|' + moveToTmpX + '(' + z.style.left + '),' + moveToTmpY +  '(' + z.style.top + ')|' + rangeX + ',' + rangeY + '|' + document.getElementById(ImgID).width + ',' + document.getElementById(ImgID).height  + '|' + document.getElementById('main_picture_SizeX').value + ',' + document.getElementById('main_picture_SizeY').value

//alert(document.getElementById('pos').value)

// <input id="pos" name="hello" type="text" size="150">

setGUI() ;
return false
}
}

function setGUI()
	{
	if((document.getElementById(ImgID).width > document.getElementById('main_picture_SizeX').value || document.getElementById(ImgID).height > document.getElementById('main_picture_SizeY').value))
		{
		document.getElementById(ImgID).style.cursor = 'pointer' ;
		document.getElementById(ImgID).title = ImgTitle[img_lang] ;
		}
	else
		{
		document.getElementById(ImgID).style.cursor = 'default' ;
		document.getElementById(ImgID).title = '' ;
		}
	}


function drags(e){

if (!ie&&!ns6)
return
var firedobj=ns6? e.target : event.srcElement
var topelement=ns6? "HTML" : "BODY"

while (firedobj.tagName!=topelement&&firedobj.className!="drag"){
firedobj=ns6? firedobj.parentNode : firedobj.parentElement
}

if (firedobj.className=="drag"){


dragapproved=true
z=firedobj
temp1=parseInt(z.style.left+0)
temp2=parseInt(z.style.top+0)
x=ns6? e.clientX: event.clientX
y=ns6? e.clientY: event.clientY
document.onmousemove=move
return false
}
}
document.onmousedown=drags
document.onmouseup=new Function("dragapproved=false")

function incrementZoom(direction)
	{
	var incrementMin = 1 ;
	var incrementMax = 3 ;
	var nextZoomValue = parseInt(getInputValue(document.form_main.elements['img_full_size'],delimiter)) + direction ;
	
	if(nextZoomValue >= incrementMin && nextZoomValue <= incrementMax)
		{
		setInputValue(document.form_main.elements['img_full_size'],nextZoomValue) ;
		swap_img_size() ;
		}
	}




/*http://www.mattkruse.com/javascript/validations/source.html*/

///////////// RADIO ////////////////
//-------------------------------------------------------------------
// isArray(obj)
// Returns true if the object is an array, else false
//-------------------------------------------------------------------
function isArray(obj){return(typeof(obj.length)=="undefined")?false:true;}


//-------------------------------------------------------------------
// setInputValue(obj,value)
//   Set the value of any form field. In cases where no matching value
//   is available (select, radio, etc) then no option will be selected
//   (Doesn't support input types: button,file,password,reset,submit)
//-------------------------------------------------------------------
function setInputValue(obj,value) {
	var use_default=(arguments.length>1)?arguments[1]:false;
	if(isArray(obj)&&(typeof(obj.type)=="undefined")){
		for(var i=0;i<obj.length;i++){setSingleInputValue(obj[i],value);}
		}
	else{setSingleInputValue(obj,value);}
	}
//-------------------------------------------------------------------
// setSingleInputValue(input_object,value)
//   Utility function used by others
//-------------------------------------------------------------------
function setSingleInputValue(obj,value) {
	switch(obj.type){
		case 'radio': case 'checkbox': if(obj.value==value){obj.checked=true;return true;}else{obj.checked=false;return false;}
		case 'text': case 'hidden': case 'textarea': case 'password': obj.value=value;return true;
		case 'select-one': case 'select-multiple': 
			var o=obj.options;
			for(var i=0;i<o.length;i++){
				if(o[i].value==value){o[i].selected=true;}
				else{o[i].selected=false;}
				}
			return true;
		}
	alert("FATAL ERROR: Field type "+obj.type+" is not supported for this function");
	return false;
	}
	

function selectByValue (select, value) {
	for (var i = 0; i < select.options.length; i++) {
		if (select.options[i].value == value) {
		select.options[i].selected = true;
		break;}
		}
	}



//-------------------------------------------------------------------
// getInputValue(input_object[,delimiter])
//   Get the value of any form input field
//   Multiple-select fields are returned as comma-separated values, or
//   delmited by the optional second argument
//   (Doesn't support input types: button,file,reset,submit)
//-------------------------------------------------------------------
function getInputValue(obj,delimiter) {
	var use_default=(arguments.length>2)?arguments[2]:false;
	if (isArray(obj) && (typeof(obj.type)=="undefined")) {
		var values=new Array();
		for(var i=0;i<obj.length;i++){
			var v=getSingleInputValue(obj[i],use_default,delimiter);
			if(v!=null){values[values.length]=v;}
			}
		return commifyArray(values,delimiter);
		}
	return getSingleInputValue(obj,use_default,delimiter);
	}
	

//-------------------------------------------------------------------
// getSingleInputValue(input_object,use_default,delimiter)
//   Utility function used by others
//-------------------------------------------------------------------
function getSingleInputValue(obj,use_default,delimiter) {
	switch(obj.type){
		case 'radio': case 'checkbox': return(((use_default)?obj.defaultChecked:obj.checked)?obj.value:null);
		case 'text': case 'hidden': case 'textarea': return(use_default)?obj.defaultValue:obj.value;
		case 'password': return((use_default)?null:obj.value);
		case 'select-one':
			if (obj.options==null) { return null; }
			if(use_default){
				var o=obj.options;
				for(var i=0;i<o.length;i++){if(o[i].defaultSelected){return o[i].value;}}
				return o[0].value;
				}
			if (obj.selectedIndex<0){return null;}
			return(obj.options.length>0)?obj.options[obj.selectedIndex].value:null;
		case 'select-multiple': 
			if (obj.options==null) { return null; }
			var values=new Array();
			for(var i=0;i<obj.options.length;i++) {
				if((use_default&&obj.options[i].defaultSelected)||(!use_default&&obj.options[i].selected)) {
					values[values.length]=obj.options[i].value;
					}
				}
			return (values.length==0)?null:commifyArray(values,delimiter);
		}
	alert("FATAL ERROR: Field type "+obj.type+" is not supported for this function");
	return null;
	}

//-------------------------------------------------------------------
// commifyArray(array[,delimiter])
//   Take an array of values and turn it into a comma-separated string
//   Pass an optional second argument to specify a delimiter other than
//   comma.
//-------------------------------------------------------------------
function commifyArray(obj,delimiter){
	if (typeof(delimiter)=="undefined" || delimiter==null) {
		delimiter = ",";
		}
	var s="";
	if(obj==null||obj.length<=0){return s;}
	for(var i=0;i<obj.length;i++){
		s=s+((s=="")?"":delimiter)+obj[i].toString();
		}
	return s;
	}