/*
    MANUAL


    CHAPTER I: EXPLAINING ELEMENT POSITIONING

    All elements in the page can be positioned and sized to your needs.
    An element is positioned and sized according to several dimensions:

    1: IS THE ELEMENT RESIZABLE?
    This is set by the variables:
    - resizeHor: is it possible to resize the element's width?
    - resizeVert: is it possible to resize the element's height?
    Possible values are:
    - 'resizable'
    - 'fixed'
    NB: these values must always be between quotation marks.

    2: THE ALIGNMENT OF THE ELEMENT
    This is set by the variables:
    - alignHor: align the element's left or right side to the window
    - alignVert: align the element's top or bottom side to the window
    Possible values for the horizontal alignment are:
    - 'left'
    - 'right'
    Possible values for the vertical alignment are:
    - 'top'
    - 'bottom'
    NB: these values must always be between quotation marks.

    3: THE WIDTH AND/OR HEIGHT OF THE ELEMENT
    These are set by the variables:
    - theWidth: the width of the element if the element is not resizable
    - theHeight: the height of the element if the element is not resizable
    Possible values for the size of the element are:
    - any number for the size in pixels
    - 'resizable'

    4: THE DISTANCE FROM THE SIDES OF THE WINDOW
    These are set by the variables:
    - theLeft: the size to the left of the element
    - theRight: the size to the right of the element
    - theTop: the size above the element
    - theBottom: the size below the element
    Possible values are:
    - any number for the size in pixels
    - 'resizable'


    CHAPTER II: ADDING YOUR OWN ELEMENTS

    A: adding an element in the planner.html:
        1. add the following lines:
  <div id="divName" style="POSITION:absolute">
   <iframe id="iframeName" src="blue.html" style="WIDTH:100%; HEIGHT:100%" frameborder="0" scrolling="auto"></iframe>
  </div>
        2. change the "Name"-part in the division and iframe ID, but keep the prefix "div" and " iframe"
        3. change the source for the iframe

    B: adding an element in this javascript file:
        1. change the value of the variable nbDiv to the total number of elements in planner.html
        2. copy the following block to one line before "// END PAGE ELEMENTS"

   tempPageElements = new Array(10);
   tempName = '3d';
   tempPageElements['resizeHor'] = 'resizable';
   tempPageElements['resizeVert'] = 'resizable';
   tempPageElements['alignHor'] = 'left';
   tempPageElements['alignVert'] = 'top';
   tempPageElements['theWidth'] = 'resizable';
   tempPageElements['theHeight'] = 'resizable';
   tempPageElements['theLeft'] = 50;
   tempPageElements['theRight'] = 200;
   tempPageElements['theTop'] = 25;
   tempPageElements['theBottom'] = 100;
   names[count] = tempName;
   pageElements[count] = tempPageElements;
   count++;

        3. change the value of tempName in this new block to the same name as used in adding the element to the planner.html ("Name")
        4. change the values of tempPageElements['propertyName'] in the new block to the desired values (see chapter I)

*/


// set the total number of divisons in the page
   var nbDiv = 8;

// START SYSTEM SETTINGS (Do not alter these lines!)
   var names = new Array(nbDiv);
   var pageElements = new Array(nbDiv);
   for( i=0; i<nbDiv; i++ ) { pageElements[i] = new Array(10) }
   var count = 0, tempName, tempPageElements
// END SYSTEM SETTINGS

// set page elements
   tempPageElements = new Array(10);
   tempName = '3d';
   tempPageElements['resizeHor'] = 'resizable';
   tempPageElements['resizeVert'] = 'resizable';
   tempPageElements['alignHor'] = 'left';
   tempPageElements['alignVert'] = 'top';
   tempPageElements['theWidth'] = 'resizable';
   tempPageElements['theHeight'] = 'resizable';
   tempPageElements['theLeft'] = 152;
   tempPageElements['theRight'] = 191;
   tempPageElements['theTop'] = 121;
   tempPageElements['theBottom'] = 92;
   names[count] = tempName;
   pageElements[count] = tempPageElements;
   count++;

   tempPageElements = new Array(10);
   tempName = 'Library';
   tempPageElements['resizeHor'] = 'resizable';
   tempPageElements['resizeVert'] = 'fixed';
   tempPageElements['alignHor'] = 'left';
   tempPageElements['alignVert'] = 'bottom';
   tempPageElements['theWidth'] = 'resizable';
   tempPageElements['theHeight'] = 90;
   tempPageElements['theLeft'] = 152;
   tempPageElements['theRight'] = 191;
   tempPageElements['theTop'] = '';
   tempPageElements['theBottom'] = 0;
   names[count] = tempName;
   pageElements[count] = tempPageElements;
   count++;

   tempPageElements = new Array(10);
   tempName = 'Control';
   tempPageElements['resizeHor'] = 'fixed';
   tempPageElements['resizeVert'] = 'resizable';
   tempPageElements['alignHor'] = 'right';
   tempPageElements['alignVert'] = 'top';
   tempPageElements['theWidth'] = 190;
   tempPageElements['theHeight'] = 'resizable';
   tempPageElements['theLeft'] = '';
   tempPageElements['theRight'] = 0;
   tempPageElements['theTop'] = 121;
   tempPageElements['theBottom'] = 91;
   names[count] = tempName;
   pageElements[count] = tempPageElements;
   count++;

   tempPageElements = new Array(10);
   tempName = 'Selector';
   tempPageElements['resizeHor'] = 'fixed';
   tempPageElements['resizeVert'] = 'fixed';
   tempPageElements['alignHor'] = 'left';
   tempPageElements['alignVert'] = 'bottom';
   tempPageElements['theWidth'] = 150;
   tempPageElements['theHeight'] = 150;
   tempPageElements['theLeft'] = 1;
   tempPageElements['theRight'] = '';
   tempPageElements['theTop'] = '';
   tempPageElements['theBottom'] = 1;
   names[count] = tempName;
   pageElements[count] = tempPageElements;
   count++;

   tempPageElements = new Array(10);
   tempName = 'MenuMain';
   tempPageElements['resizeHor'] = 'resizable';
   tempPageElements['resizeVert'] = 'fixed';
   tempPageElements['alignHor'] = 'left';
   tempPageElements['alignVert'] = 'top';
   tempPageElements['theWidth'] = 'resizable';
   tempPageElements['theHeight'] = 40;
   tempPageElements['theLeft'] = 152;
   tempPageElements['theRight'] = 191;
   tempPageElements['theTop'] = 80;
   tempPageElements['theBottom'] = '120';
   names[count] = tempName;
   pageElements[count] = tempPageElements;
   count++;

   tempPageElements = new Array(10);
   tempName = 'MenuNavigate';
   tempPageElements['resizeHor'] = 'fixed';
   tempPageElements['resizeVert'] = 'fixed';
   tempPageElements['alignHor'] = 'left';
   tempPageElements['alignVert'] = 'top';
   tempPageElements['theWidth'] = 150;
   tempPageElements['theHeight'] = 155;
   tempPageElements['theLeft'] = 1;
   tempPageElements['theRight'] = '';
   tempPageElements['theTop'] = 121;
   tempPageElements['theBottom'] = ''; //was 92
   names[count] = tempName;
   pageElements[count] = tempPageElements;
   count++;

  tempPageElements = new Array(10);
   tempName = 'MenuObject';
   tempPageElements['resizeHor'] = 'fixed';
   tempPageElements['resizeVert'] = 'fixed';
   tempPageElements['alignHor'] = 'right';
   tempPageElements['alignVert'] = 'bottom';
   tempPageElements['theWidth'] = 190;
   tempPageElements['theHeight'] = 80;
   tempPageElements['theLeft'] = '';
   tempPageElements['theRight'] = 0;
   tempPageElements['theTop'] = '';
   tempPageElements['theBottom'] = 10;
   names[count] = tempName;
   pageElements[count] = tempPageElements;
   count++;

   tempPageElements = new Array(10);
   tempName = 'Disclaimer';
   tempPageElements['resizeHor'] = 'fixed';
   tempPageElements['resizeVert'] = 'fixed';
   tempPageElements['alignHor'] = 'right';
   tempPageElements['alignVert'] = 'bottom';
   tempPageElements['theWidth'] = 190;
   tempPageElements['theHeight'] = 10;
   tempPageElements['theLeft'] = '';
   tempPageElements['theRight'] = '0';
   tempPageElements['theTop'] = '';
   tempPageElements['theBottom'] = '0';
   names[count] = tempName;
   pageElements[count] = tempPageElements;
   count++;

// START SYSTEM SETTINGS (Do not alter these lines!)
// resizes all the resizable elements in the page
   function ResizeElements()
   {
    for ( i=0 ; i<pageElements.length; i++ )
    {
     objectToResize = document.getElementById( 'div' + names[i] );
     if ( pageElements[i].alignHor == 'left' ) { objectToResize.style.left = pageElements[i].theLeft } else { objectToResize.style.right = pageElements[i].theRight }
     if ( pageElements[i].alignVert == 'top' ) { objectToResize.style.top = pageElements[i].theTop } else { objectToResize.style.bottom = pageElements[i].theBottom }
     if ( pageElements[i].resizeHor == 'fixed' ) { objectToResize.style.width = pageElements[i].theWidth } else { objectToResize.style.width = bodyPage.clientWidth - pageElements[i].theLeft - pageElements[i].theRight }
     if ( pageElements[i].resizeVert == 'fixed' ) { objectToResize.style.height = pageElements[i].theHeight } else { objectToResize.style.height = bodyPage.clientHeight - pageElements[i].theTop - pageElements[i].theBottom }
    }
   }
// END SYSTEM SETTINGS