var movingSize = 598;
      var containerWidth = 898;
      var left = 0;
      var startingPos = 0;
      var movingNow = false;
      var bikeCount = 8;
      var actualPictureId = 1;
      var active = 'active';
      var loaderPath = './pages/loader.html';
      
      document.onkeydown = keyHit;
      
      function keyHit(evt) 
      {
    		var ltA = 37;
    		var rtA = 39;
    		
    		var thisKey = (evt) ? evt.which : window.event.keyCode;
    		
    		if (thisKey == ltA) 
        {
    		  slideRight();          
        }
        if (thisKey == rtA)
        {
          slideLeft();
        }
      }
      function bodyLoadIndex()
      { 
        var center = document.getElementById('center-container');
        var main = document.getElementById('right-main');
        var loader = document.getElementById('loader');
        
        var path = "./pages/properties" + actualPictureId + ".html";
        main.innerHTML = getHtmlFile(path);
                
        loader.style.display = "none";
        center.style.display = "block";
        setRightPosition();
                 
        var menuItem = "m" + actualPictureId;
        var menuLink = document.getElementById(menuItem);
        menuLink.className = (active);
        
        var menuTopItem = "s" + actualPictureId;
        var menuTopLink = document.getElementById(menuTopItem);
        menuTopLink.className = (active);
      }
      
      function bodyLoad()
      { 
        var center = document.getElementById('center-container');
        var loader = document.getElementById('loader');
        
        loader.style.display = "none";
        center.style.display = "block";
        
        setRightPosition();
        
        /*var menuItem = "m" + actualPictureId;
        var menuLink = document.getElementById(menuItem);
        menuLink.className = (active);
        
        var menuTopItem = "s" + actualPictureId;
        var menuTopLink = document.getElementById(menuTopItem);
        menuTopLink.className = (active);*/
      }
      
      
      function setRightPosition()
      {
        var slider = document.getElementById('moving');
        slider.style.width = movingSize * bikeCount + 'px';
                
        left = containerWidth/2 - movingSize/2;
        startingPos = left;
        
        movingNow = true;
        
        var tw = new Tween(slider.style,'left',Tween.regularEaseOut,0,left,1,'px');
        tw.onMotionFinished = function()
        {
          movingNow = false;
        };
        tw.start();        
      }
      
      function slideLeft()
      {
        if (!movingNow && actualPictureId != bikeCount)
        {
          movingNow = true;
          var slider = document.getElementById('moving');
          var main = document.getElementById('right-main');
          
          var oldX = left;
          var newX = oldX-movingSize;
          
          //alert(oldX + " " + newX);
          
          var tw = new Tween(slider.style,'left',Tween.strongEaseInOut,oldX,newX,0.8,'px');
          tw.onMotionFinished = function()
          {
            var menuItemA = "m" + actualPictureId;
            var menuLinkA = document.getElementById(menuItemA);
            menuLinkA.className = "";
            
            var menuTopItemA = "s" + actualPictureId;
            var menuTopLinkA = document.getElementById(menuTopItemA);
            menuTopLinkA.className = "";
          
            left = newX;
            movingNow = false;
            actualPictureId++; 
            var path = "./pages/properties" + actualPictureId + ".html";
            main.innerHTML = getHtmlFile(path);
            
            var menuItem = "m" + actualPictureId;
            var menuLink = document.getElementById(menuItem);
            menuLink.className = (active);
            
            var menuTopItem = "s" + actualPictureId;
            var menuTopLink = document.getElementById(menuTopItem);
            menuTopLink.className = (active);
          };
          
          /*tw.onMotionStarted = function ()
          {
              main.innerHTML = getHtmlFile(loaderPath);
          };*/
          
          tw.start();
        }
      }
      
      function slideRight()
      {
        if (!movingNow && actualPictureId != 1)
        {
          movingNow = true;
          var slider = document.getElementById('moving');
          var main = document.getElementById('right-main');
          
          var oldX = left;
          var newX = oldX+movingSize;
          
          //alert(oldX + " " + newX);
          
          var tw = new Tween(slider.style,'left',Tween.strongEaseInOut,oldX,newX,0.8,'px');
          tw.onMotionFinished = function()
          {
            var menuItemA = "m" + actualPictureId;
            var menuLinkA = document.getElementById(menuItemA);
            menuLinkA.className = "";
            
            var menuTopItemA = "s" + actualPictureId;
            var menuTopLinkA = document.getElementById(menuTopItemA);
            menuTopLinkA.className = "";
            
            left = newX;
            movingNow = false;
            actualPictureId--;
            var path = "./pages/properties" + actualPictureId + ".html";
            main.innerHTML = getHtmlFile(path);
            
            var menuItem = "m" + actualPictureId;
            var menuLink = document.getElementById(menuItem);
            menuLink.className = (active);
            
            var menuTopItem = "s" + actualPictureId;
            var menuTopLink = document.getElementById(menuTopItem);
            menuTopLink.className = (active);
          };
          
          /*tw.onMotionStarted = function ()
          {
              main.innerHTML = getHtmlFile(loaderPath);
          };*/
          
          tw.start();
        }
      }
      
      function slideToPosition(destination)
      {
        if (!movingNow && destination <= bikeCount && destination >=0)
        {
          
          movingNow = true;
          var slider = document.getElementById('moving');
          var main = document.getElementById('right-main');
          
          var oldX = left;
          var newX;
          
          if (actualPictureId == destination)
          {
            movingNow = false;
            
            var path = "./pages/properties" + destination + ".html";
            var inHtml = getHtmlFile(path);
            
            if (document.getElementById('right-main').innerHTML != inHtml)
            {
              document.getElementById('right-main').innerHTML = inHtml;
            }
            
            return;
          }
          else if (destination > actualPictureId)
          {
            newX = oldX - ((destination - actualPictureId) * movingSize);  
          }
          
          else if (destination < actualPictureId)
          {
            newX = oldX + ((actualPictureId - destination) * movingSize);  
          }
          
          //alert(oldX + " " + newX);  
          var speed = 1;
          var tw = new Tween(slider.style,'left',Tween.strongEaseInOut,oldX,newX,speed,'px');
          tw.onMotionFinished = function()
          {
            var menuItemA = "m" + actualPictureId;
            var menuLinkA = document.getElementById(menuItemA);
            menuLinkA.className = "";
            
            var menuTopItemA = "s" + actualPictureId;
            var menuTopLinkA = document.getElementById(menuTopItemA);
            menuTopLinkA.className = "";
            
            left = newX;
            movingNow = false;
            actualPictureId = destination; 
            var path = "./pages/properties" + destination + ".html";
            main.innerHTML = getHtmlFile(path);
            
            var menuItem = "m" + actualPictureId;
            var menuLink = document.getElementById(menuItem);
            menuLink.className = (active);
            
            var menuTopItem = "s" + actualPictureId;
            var menuTopLink = document.getElementById(menuTopItem);
            menuTopLink.className = (active);            
          };
          
          /*tw.onMotionStarted = function ()
          {
              main.innerHTML = getHtmlFile(loaderPath);
          };*/
          
          tw.start();
        }
        
      }
      
      function getHtmlFile(src)
      {
        if (typeof XMLHttpRequest != 'undefined') 
        {
           var data = new XMLHttpRequest();
           data.open('GET', src, false);
           data.send(null);
           return data.responseText;
        }
      }