/* Author: James Stone
*/

var iPad = navigator.userAgent.match(/iPad/i) != null;
oldTempChosenBox=tempChosenBox=-1;

checkCountdown=0;

sarcasticCaptionsA=[-1];
sarcasticCaptionsA[1]="An image of something to portray new beginnings, perhaps a chick hatching, but that could be too 'eastery'";
sarcasticCaptionsA[2]="An image of a site photoshopped onto an iMac grabbed off the Apple site";
sarcasticCaptionsA[3]="A map of the area, that doesn't quite show enough of the surrounding area, and is missing some roads as that wouldn't look designed enough";
sarcasticCaptionsA[4]="A photograph of James as a child / baby";
sarcasticCaptionsA[5]="An image of the visuals supplied for a website, but not the design they actually went with";
sarcasticCaptionsA[6]="A photograph of a screen of code taken at a jaunty angle";
sarcasticCaptionsA[7]="A photograph of a carrier pigeon";
sarcasticCaptionsA[8]="A office with a blurred person showing how busy we are";
sarcasticCaptionsA[9]="A photograph of an under construction sign";
sarcasticCaptionsA[10]="Another thumbnail of the site which doesn't help show how the site actually works";

sarcasticCaptionsB=[-1];
sarcasticCaptionsB[1]="A thumbnail of a website that is too small to be useful";
sarcasticCaptionsB[2]="A man in an office laughing while on the phone";
sarcasticCaptionsB[3]="An empty meeting room with mid century furniture";
sarcasticCaptionsB[4]="A photograph taken of a website on a monitor at a jaunty angle";
sarcasticCaptionsB[5]="An image of the visuals supplied for a website, but not the design they actually went with";
sarcasticCaptionsB[6]="";
sarcasticCaptionsB[7]="A photograph of a rusty old sign with some type on it";
sarcasticCaptionsB[8]="A office with a blurred person showing how busy we are";
sarcasticCaptionsB[9]="A photograph of a staff member as a child or baby";
sarcasticCaptionsB[10]="Another thumbnail of the site which doesn't help show how the site actually works";


windowWidth=0;
windowHeight=0;

maxForC = 600;

keepCount=0;
maxCount=10;

columnWidths =  [-1, 0,0,0];
columnHeights =  [-1, 0,0,0];
textHeights  =[-1, 100,2,3,4,5,6,7,8,9];
//115
boxLineHeights = [-1, 85, 60,60,85,85,85,60,85,85];
textAlign  =[-1, "B", "B", "B", "T", "T", "B", "B", "T", "B"];
textColumnCount  =[-1, "2", "1", "2", "2", "1", "2", "1", "2", "1"];
imageColumnCount  =[-1, "1", "1", "2", "1", "1", "1", "1", "1", "1"];

chosenX=0;
chosenY=0;
oldChosenBox=chosenBox=0;

xMouse=10;
yMouse=10;

boxX=0;
boxY=0;

leftA = leftB= 0;
topA = topB= 0;

crosshairOffset=-10;

if (iPad){
scaleUpSpeed=10;
scaleDownSpeed=10;
}else{
scaleUpSpeed=30;
scaleDownSpeed=30;
}

function shortcutTo(whereTo){
//alert (whereTo);
oldChosenBox=-1;
chosenBox=whereTo;
checkCountdown=100;
calcSection(chosenBox);

}

function adjustTextBoxes(){

//for (n=1; n<10; n++){
$('#paragraph'+ chosenBox + 'A').css('width', (openWindowWidth/2)-40);
$('#paragraph'+ chosenBox + 'B').css('width', (openWindowWidth/2)-40);
$('#paragraph'+ chosenBox + 'C').css('width', openWindowWidth-60);

divider = (openWindowWidth/2);

textHeights[chosenBox]=$('#paragraph'+ chosenBox + 'A').height();

if ($('#paragraph'+ chosenBox + 'B').height()>textHeights[chosenBox]){
textHeights[chosenBox]=$('#paragraph'+ chosenBox + 'B').height();
}

// IF WE'RE GOING FOR THE SINGLE COLUMN //
if (openWindowWidth<maxForC || textColumnCount[chosenBox]=="1"){
textHeights[chosenBox]=$('#paragraph'+ chosenBox + 'C').height();
} else {
$('#paragraph' + chosenBox+  'B').css('left', divider-21);
}

$('#paragraph' + chosenBox+  'Holder').css('height', textHeights[chosenBox]);

//}
}

function getWindowSize(){
//  $('#mti_wfs_colophon').hide();
windowWidth = $(window).width();
windowHeight = $(window).height()-20;

openWindowWidth = (windowWidth/1.5);
closedWindowWidth  = (windowWidth/6.0);

adjustTextBoxes();

openWindowHeight = (windowHeight/1.5);
closedWindowHeight  = (windowHeight/6.0);

levelWidth = (windowWidth/3.0);
levelHeight = (windowHeight/3.0);

//WE MIGHT REMOVE THIS AS IT IS LEVELLING THE SIZES
//OF THE ITEMS WHEN IT MAY BE BETTER IF IT TARGETS THE
//ALREADY OPEN SECTION

//columnWidths =  [-1,levelWidth,levelWidth,levelWidth];
//columnHeights =  [-1,levelHeight,levelHeight,levelHeight];
}

function calcSection(forceSection){


if (forceSection<0){

if (xMouse>0){
   if (xMouse < leftA){ chosenX=1} else if (xMouse <leftB){ chosenX=2 } else {chosenX=3}
   }
   
   if (yMouse>0){
   if (yMouse < topA){ chosenY=1} else if (yMouse <topB){ chosenY=2 } else {chosenY=3}
   }
   
      tempChosenBox = chosenX+ ((chosenY-1)*3);
      
      if (oldTempChosenBox==tempChosenBox){
      keepCount++;
      if (keepCount>=maxCount){
      chosenBox = tempChosenBox;
      }
      }else{
      keepCount=0;
      }
      
 }else {
 chosenBox = forceSection;
 }    
      
oldTempChosenBox=tempChosenBox;
      

}

function updatePositions(){

    leftA =(columnWidths[1]);
    leftB =(columnWidths[1]+columnWidths[2]);
      
      topA =(columnHeights[1]);
      topB =(columnHeights[1]+columnHeights[2]);
     
     
     boxWidth = (columnWidths[chosenX]);
     boxHeight = (columnHeights[chosenY]);
     
     
     if (chosenX==1){ boxX=0; } 
     if (chosenX==2){ boxX=leftA; } 
     if (chosenX==3){ boxX=leftB; } 
       
     if (chosenY==1){ boxY=0; } 
     if (chosenY==2){ boxY=topA; } 
     if (chosenY==3){ boxY=topB; } 
               
       if (chosenX>0 && keepCount>=maxCount){

      $('#placeHolderA').css('left', -10000);
  $('#placeHolderB').css('left', -10000);

      $('#theBoxLine').css('left', boxX+10);
      $('#theBoxLine').css('top', boxY+boxLineHeights[chosenBox]);
      $('#theBoxLine').css('width' , boxWidth-20);
      
      $('#paragraph'+ chosenBox +  'Holder').css('left', boxX+30);      
      
      if (textAlign[chosenBox]=="B"){

$('#paragraph' + chosenBox + 'Holder').css('top', boxY + boxHeight - textHeights[chosenBox]-30);
      
      }else {

$('#paragraph' + chosenBox + 'Holder').css('top', boxY + boxLineHeights[chosenBox]+15);
      
      }
      

            
      $('#theBox').css('left', boxX+10);
         
      $('#theBox').css('top', boxY+10);
      $('#theBox').css('width' , boxWidth-30);
     
      $('#theBox').css('height' , boxHeight-30);
      
      
      
        if (textAlign[chosenBox]=="B"){
      placeHolderXA= boxX+30;

      placeHolderY= boxY+20+boxLineHeights[chosenBox];
      
      placeHolderHeight= boxHeight-boxLineHeights[chosenBox]- textHeights[chosenBox] -30-30- (25);
      
       
       if (placeHolderHeight>50){
       
       $('#placeHolderA').css('top', placeHolderY);
       
       $('#placeHolderA').css('height', placeHolderHeight);      
       $('#placeHolderB').css('height', placeHolderHeight);      
       
       
       //divider = (openWindowWidth/2);
       
       
       placeHolderWidth=((boxWidth-60)/2)-(30);
       
       
       if (imageColumnCount[chosenBox]=="1" || openWindowWidth<maxForC){
       placeHolderWidth=boxWidth-60-20;
       }
       
       
       
       
        $('#placeHolderA').css('width', placeHolderWidth);      
       $('#placeHolderB').css('width', placeHolderWidth);
       
       
       $('#placeHolderB').css('top', placeHolderY);
      
       $('#placeHolderA').css('left', placeHolderXA);
       $('#placeHolderB').css('left', placeHolderXA+placeHolderWidth+40);
       
       }
       
       
       
       
           } 
            
            
      $('#paragraph'+ chosenBox +  'Holder').css('width', boxWidth-60);      

      $('#tl').css('left', leftA +crosshairOffset);
      $('#tr').css('left', leftB +crosshairOffset);
      
      $('#bl').css('left', leftA + crosshairOffset);
      $('#br').css('left', leftB +crosshairOffset);
      
      
      $('#tl').css('top', topA + crosshairOffset);
      $('#tr').css('top', topA + crosshairOffset);
      
      $('#bl').css('top', topB + crosshairOffset);
      $('#br').css('top', topB +crosshairOffset);
      
      
$('#section2').css('left' , leftA);
$('#section5').css('left' , leftA);
$('#section8').css('left' , leftA);

$('#section3').css('left' , leftB);
$('#section6').css('left' , leftB);
$('#section9').css('left' , leftB);

$('#section4').css('top' , topA);
$('#section5').css('top' , topA);
$('#section6').css('top' , topA);

$('#section7').css('top' , topB);
$('#section8').css('top' , topB);
$('#section9').css('top' , topB);

$('#section2B').css('left' , leftA);
$('#section5B').css('left' , leftA);
$('#section8B').css('left' , leftA);

$('#section3B').css('left' , leftB);
$('#section6B').css('left' , leftB);
$('#section9B').css('left' , leftB);

$('#section4B').css('top' , topA);
$('#section5B').css('top' , topA);
$('#section6B').css('top' , topA);

$('#section7B').css('top' , topB);
$('#section8B').css('top' , topB);
$('#section9B').css('top' , topB);

}

if (chosenBox != oldChosenBox){
$('#placeHolderA').hide();
$('#placeHolderB').hide();

$('#placeHolderA').fadeIn();


if (imageColumnCount[chosenBox]=="2" && openWindowWidth>maxForC){
$('#placeHolderB').fadeIn();
}


startDiv="<div style='width:150px; bottom:0px;'>";
endDiv ="</div>";

adjustTextBoxes();

randomNumber=1+ Math.floor(Math.random()*10);
$('#placeholderInsideA').html(startDiv + sarcasticCaptionsA[chosenBox] + endDiv);

randomNumberB=1+ Math.floor(Math.random()*10);

while (randomNumber==randomNumberB){
randomNumberB=1+ Math.floor(Math.random()*10);
}

$('#placeholderInsideB').html(startDiv + sarcasticCaptionsB[chosenBox] + endDiv);

//  $('#paragraph'+ oldChosenBox +  'A').css('left', -100000);
//  $('#paragraph'+ oldChosenBox +  'B').css('left', -100000);
        
for (n=1; n<=9; n++){
if (n==chosenBox){
$('#section' + n).hide();
$('#section' + n + "B").show();

if (openWindowWidth<=maxForC || textColumnCount[chosenBox]=="1" ){
$('#paragraph' + n + "A").hide();
$('#paragraph' + n + "B").hide();
$('#paragraph' + n + "C").fadeIn();
}else {
$('#paragraph' + n + "A").fadeIn();
$('#paragraph' + n + "B").fadeIn();
$('#paragraph' + n + "C").hide();
}



$('#paragraph' + n + "Holder").show();

}else {
$('#section' + n).show();
$('#section' + n + "B").stop().hide();




$('#paragraph' + n + "A").hide();
$('#paragraph' + n + "B").hide();
$('#paragraph' + n + "C").hide();


$('#paragraph' + n + "Holder").css('left' , -100000);

}
}


if (chosenBox<=0){ crosshairArray = [0,0,0,0]; }
if (chosenBox==1){ crosshairArray = [0,1,1,1]; }
if (chosenBox==2){ crosshairArray = [0,0,1,1]; }
if (chosenBox==3){ crosshairArray = [1,0,1,1]; }
if (chosenBox==4){ crosshairArray = [0,1,0,1]; }
if (chosenBox==5){ crosshairArray = [0,0,0,0]; }
if (chosenBox==6){ crosshairArray = [1,0,1,0]; }
if (chosenBox==7){ crosshairArray = [1,1,0,1]; }
if (chosenBox==8){ crosshairArray = [1,1,0,0]; }
if (chosenBox==9){ crosshairArray = [1,1,1,0]; }

if (crosshairArray[0]==1){ $('#tl').show(); } else { $('#tl').hide();  }
if (crosshairArray[1]==1){ $('#tr').show(); } else { $('#tr').hide();  }
if (crosshairArray[2]==1){ $('#bl').show(); } else { $('#bl').hide();  }
if (crosshairArray[3]==1){ $('#br').show(); } else { $('#br').hide();  }



}

oldChosenBox=chosenBox;



}

$(window).resize(function() {
oldChosenBox=-1;
getWindowSize();
updatePositions();
});





  $(document).ready(function() {
  var iPad = navigator.userAgent.match(/iPad/i) != null;
var iPhone = navigator.userAgent.match(/iPhone/i) != null;

if (iPad || iPhone){
  document.addEventListener('touchstart', function(e) {
   // e.preventDefault();
    var touch = e.touches[0];
    xMouse=(touch.pageX) 
    yMouse=(touch.pageY);
    calcSection(-1);  
}, false);
  }



  setInterval(function() {
 

 
 windowWidth = $(window).width();
windowHeight = $(window).height()-20;

checkCountdown--;

if (checkCountdown<0){
 calcSection(-1);
}


 
  if (xMouse>0){
  
  
 for (n=1; n<=2; n++){ 
  
  if (chosenX==n){ 
  columnWidths[n]+= ((openWindowWidth-columnWidths[n])/scaleUpSpeed);
   } else {
  columnWidths[n]+= ((closedWindowWidth-columnWidths[n])/scaleDownSpeed);   
   }
   
  if (chosenY==n){ 
  columnHeights[n]+= ((openWindowHeight-columnHeights[n])/scaleUpSpeed);
   } else {
  columnHeights[n]+= ((closedWindowHeight-columnHeights[n])/scaleDownSpeed);   
   }
 }

 if (chosenX==3){
   columnWidths[3]= ((windowWidth-columnWidths[1]-columnWidths[2]));
 }else {
   columnWidths[3]+= ((closedWindowWidth-columnWidths[3])/scaleDownSpeed);   
 }
 
 if (chosenY==3){
   columnHeights[3]= ((windowHeight-columnHeights[1]-columnHeights[2]));
 }else {
   columnHeights[3]+= ((closedWindowHeight-columnHeights[3])/scaleDownSpeed);   
 }
 
   
  }
    updatePositions();  
 //  $('#status').html(xMouse +', '+ yMouse + '<br>' + windowWidth +'x'+ windowHeight+ '<br>chosenX=' + chosenX +' chosenY='+ chosenY + '<br>chosenBox=' + chosenBox);
  //  $('#status').html(xMouse +', '+ yMouse + '<br>' + windowWidth +'x'+ windowHeight);
}, 10);
  
  getWindowSize();
  updatePositions();
  
  //get the position of the mouse//
   $(document).mousemove(function(e){
  
  xMouse = e.pageX;
  yMouse = e.pageY;
      

      
   }); 
})