/*
 *     :::::::::::::::::::::::::::::::::
 * 
 *     slideMAGIC
 *     created by Dominik Schickerm�ller
 * 
 *     ---------------------------------
 * 
 *     version 1.2
 *     last update: 02.03.2011
 * 
 *     :::::::::::::::::::::::::::::::::
 *     
 *     1.1 : Stop AutoSliding on UserInteraction
 *     1.2 : BLENDSMOOTH
 * 
 *     :::::::::::::::::::::::::::::::::
 * 
 */



function s_SlideMagic (ID_Suffix) {
  
  var _ID_SM           = "SS_"            +ID_Suffix;
  var _ID_Overlay       = "SS_Overlay_"        +ID_Suffix;
  var _ID_ContentVisible    = "SS_ContentVisible_"    +ID_Suffix;
  var _ID_ContentContainer  = "SS_ContentContainer_"  +ID_Suffix;
  var _ID_Buttons        = "SS_Buttons_"        +ID_Suffix;
  var _ID_ButtonsVisible    = "SS_ButtonsNavVisible_"  +ID_Suffix;
  var _ID_ButtonsNav      = "SS_ButtonsNav_"      +ID_Suffix;
  var _ID_ButtonsCtrl      = "SS_ButtonsControl_"    +ID_Suffix;
  
  var _ID_ButtonNext      = "SS_ButtonNext_"      +ID_Suffix;
  var _ID_ButtonPrev      = "SS_ButtonPrev_"      +ID_Suffix;
  var _ID_ButtonPause      = "SS_ButtonPause_"      +ID_Suffix;
  var _ID_ButtonPlay      = "SS_ButtonPlay_"      +ID_Suffix;
  
  var _CLASS_Button_Active  = "SS_ButtonActive_"    +ID_Suffix;

  var _LBL_Slide        = "SS_Slide_"        +ID_Suffix + "_";
  var _LBL_Button        = "SS_Button_"        +ID_Suffix + "_";
  
  var _DEF_Button_Prev    = "prev";
  var _DEF_Button_Next    = "next";
  var _DEF_Button_Play    = "play";
  var _DEF_Button_Pause    = "pause";
  
  
  // Parameters
  var _speed_SlideChange;
  var _speed_Effect;
  var _vis_Nav;
  var _vis_Prev;
  var _vis_Next;
  var _vis_Play;
  var _vis_Pause;
  var _autoSlide;
  
  // Control variables
  var _self = this;
  var _controller;
  var _effectAnimation;
  var _effectButton;
  var _nSlides;
      
  
  this.init = function () {  
    
    //default values
    _speed_SlideChange   = 2500;
    _speed_Effect     = 1500;
    
    _effectAnimation = null;        
        _effectButton = null;
        _autoSlide = true;
    
    
    var o;
    
    // slide magic
    o = document.getElementById(_ID_SM);
        o.style.position = "relative";
        o.style.overflow = "visible"; 
        
    // content container
        o = document.getElementById(_ID_ContentVisible);
        o.style.overflow = "hidden";
        o.style.position = "relative";

    // slides
        _nSlides = _self.nSlides(); 
        for(var i = 1; i <= _nSlides; i++){    
            o = document.getElementById(_LBL_Slide + i);
            o.style.display  = "none";
            o.style.position  = "absolute";
            o.style.left      = "0px";
            o.style.right     = "0px";
            o.style.zIndex    = "1";            
        }
        
        _vis_Nav = true;
    _vis_Prev = true;
    _vis_Next = true;
    _vis_Play = true;
    _vis_Pause = true;        
        
  }
  
  this.run = function () {     
    // set default animation effect
        if(_effectAnimation == null) _effectAnimation = new s_Effect_BLEND(_speed_Effect);        
        
    initButtons(_effectButton, _effectAnimation);
    _controller = new s_Controller(this, _speed_SlideChange, _effectAnimation, _nSlides, _LBL_Slide, _autoSlide);
    _controller.run();
  }
  
  function initButtons (effectButton, effectAnimation) {
    
    // [0] = navButtons
    // [1] = prevButton
    // [2] = nextButton
    // [3] = pauseButton
    // [4] = playButton
    var useButtons = effectAnimation.getButtonUsage();
    
    var o = document.getElementById(_ID_Buttons);
        o.style.zIndex = "4";
        
        if(useButtons[0] && _vis_Nav && _nSlides > 1){
          o = document.getElementById(_ID_ButtonsNav);
          o.style.display = "block";

          for(var i = 1; i <= _nSlides; i++){ 
            o = document.getElementById(_LBL_Button + i); 
                o.childNodes[0].onclick = (function (p1) {return function () { jump(p1); userInteraction(); return false;};})(i);                
          }
          
          if(effectButton != null){
            var nav = document.getElementById(_ID_ButtonsNav); 
            var vis = document.getElementById(_ID_ButtonsVisible);
              
            effectButton.manipulateNav(vis, nav, _LBL_Button, _nSlides);            
          } 
        }        
        if(useButtons[1] && _vis_Prev && _nSlides > 1){
          o = document.getElementById(_ID_ButtonPrev);
          o.style.display = "block";
          o.childNodes[0].innerHTML = _DEF_Button_Prev;
          if(effectButton == null){
            o.childNodes[0].onclick = (function (p1) {return function () { jump(p1); userInteraction(); return false;};})(-1);
          }else{
            effectButton.manipulatePrev(o.childNodes[0]);
          }
        }
        if(useButtons[2] && _vis_Next && _nSlides > 1){ 
          o = document.getElementById(_ID_ButtonNext);
          o.style.display = "block";
          o.childNodes[0].innerHTML = _DEF_Button_Next;
          if(effectButton == null){ 
            o.childNodes[0].onclick = (function (p1) {return function () { jump(p1); userInteraction(); return false;};})(0);
          }else{
            effectButton.manipulateNext(o.childNodes[0]);
          }
        }
        if(useButtons[3] && _vis_Pause && _nSlides > 1){
          o = document.getElementById(_ID_ButtonPause);
          o.style.display = "block";
          o.childNodes[0].innerHTML = _DEF_Button_Pause;
          o.childNodes[0].onclick = (function (p1) {return function () { setControl(p1); return false;};})(false);
        }
        if(useButtons[4] && _vis_Play && _nSlides > 1){
          o = document.getElementById(_ID_ButtonPlay);
          o.style.display = "block";
          o.childNodes[0].innerHTML = _DEF_Button_Play;
          o.childNodes[0].onclick = (function (p1) {return function () { setControl(p1); return false;};})(true);
        }        
        
        
        
  }
  
  function userInteraction(){
    _controller.userInteraction();
  }
  
  function jump(slide){
    if(slide == -1)     _controller.jumpToPrev();
    else if(slide == 0)    _controller.jumpToNext();
    else          _controller.jumpTo(slide);
  }
  
  function setControl(c){
    if(c) _controller.run();
    else _controller.pause();
  }
    
  this.setActiveButton = function (curPos, nextPos){
    var cur = document.getElementById(_LBL_Button+curPos);
    var next = document.getElementById(_LBL_Button+nextPos);
    
    var stdClass = next.className;
    var newClass = stdClass + " " + _CLASS_Button_Active;
    
    cur.className = stdClass;
    next.className = newClass;
  }
    
  this.nSlides = function () {
        for(var i = 1;;i++){
            var obj = document.getElementById(_LBL_Slide + i);
            if(obj == null) return i-1;
        }
    }
  
  this.setSpeed = function (slideChangeSpeed, slideEffectSpeed){
    if(slideChangeSpeed != null) _speed_SlideChange = slideChangeSpeed;
    if(slideEffectSpeed != null){
      _speed_Effect = slideEffectSpeed;
    }
    
  } 
  
  this.setEffect = function (effectDesc){ 
    if(effectDesc == "BLEND")       _effectAnimation = new s_Effect_BLEND(_speed_Effect);
    if(effectDesc == "BLENDSMOOTH")   _effectAnimation = new s_Effect_BLENDSMOOTH(_speed_Effect); 
    else if(effectDesc == "FLASH")    _effectAnimation = new s_Effect_FLASH(_speed_Effect, document.getElementById(_ID_Overlay), "#FFFFFF");
    else if(effectDesc == "SLIDE")     _effectAnimation = new s_Effect_SLIDE(_speed_Effect, _nSlides, _LBL_Slide, document.getElementById(_ID_ContentVisible), document.getElementById(_ID_ContentContainer));
    else if(effectDesc == "SLIDEDECK")   _effectAnimation = new s_Effect_SLIDEDECK(_speed_Effect, _nSlides, _LBL_Slide, _LBL_Button, document.getElementById(_ID_ContentVisible), document.getElementById(_ID_ContentContainer), document.getElementById(_ID_SM));
  }
  
  this.setLabels = function (prev, next, play, pause){
    if(prev != null) _DEF_Button_Prev = prev;
    if(next != null) _DEF_Button_Next = next;
    if(play != null) _DEF_Button_Play = play;
    if(pause != null) _DEF_Button_Pause = pause;
  }
  
  this.setButtonAction = function (actionDesc, p1) {
    if(actionDesc == "MOVE") _effectButton = new s_EffectButton_HOVER(p1);
  }
  
  this.setButtonVisibility = function (nav, prev, next, play, pause) { 
    _vis_Nav = nav;
    _vis_Prev = prev;
    _vis_Next = next;
    _vis_Play = play;
    _vis_Pause = pause;
  }
  
  this.setStopOnInteraction = function () {
    _autoSlide = false;
  }
  
  _self.init();
  
}


function s_Controller (slidemagic, speed, effect, nSlides, lbl_Slide, autoSlide) {
  
  // Parameters
  var _slideSpeed = speed;
  var _effect = effect;
  var _nSlides = nSlides;
  var _lbl_Slide = lbl_Slide;
  var _sm = slidemagic;
  var _autoSlide = autoSlide;
  var _userInteraction;
  
  // Control variables  
  var _self = this;
  var _slide;
  var _timeout;
  var _curPos;
  var _nextPos;
  var _pause;
  
  this.init = function () {
    _slide = false;
    _timeout = null;
    _curPos = 1;
    _nextPos = 1;
    _pause = true;
    _userInteraction = false;
  }  
  this.run = function () { 
    if(!_pause) return;
    _slide = true;
    _pause = false;
    _self.control();
  }  
  this.pause = function () {
    if(_pause) return;
    _slide = false;    
    _pause = true;
    if(_timeout != null) clearTimeout(_timeout);
  }  
  this.control = function () { 
    if(!_slide) return;
    if(!_autoSlide && _userInteraction) { _userInteraction = false; return;}
    
    _sm.setActiveButton(_curPos, _nextPos);
    _self.slide(); 
    
    if(_nSlides > 1)
    _timeout = setTimeout( (function (p0) { return function () { p0.control();  };  })(_self), _slideSpeed);        
  }  
  this.slide = function () {     
    var cur = document.getElementById(_lbl_Slide + _curPos);
    var next = document.getElementById(_lbl_Slide + _nextPos);
    
    _effect.render(cur, next);
    
    _curPos = _nextPos;
    _nextPos++;
    if(_nextPos > _nSlides) _nextPos = 1;          
  }
  this.jumpTo = function (slidePos){
    _self.pause();
    _nextPos = slidePos;  
    _userInteraction = false;
    _self.run();
  }
  this.jumpToNext = function () {
    _self.jumpTo(_nextPos);
  }
  this.jumpToPrev = function () {
    var newPos = _curPos-1;
    if(newPos == 0) newPos = _nSlides;
    _self.jumpTo(newPos);
  }
  this.userInteraction = function () {
    _userInteraction = true;
  }
  
  _self.init();
  
}


function s_EffectButton_HOVER (nVisButtons){ 
  
  var _self = this;
  var _nVisButtons = nVisButtons;
  var _stopMoving = false;  
  var _timeout = null;
  var _objNav;
  var _nSlides;
  var _tools = new s_Tools();
  var _speed = 15;
  var _timeoutMove;
  
  
  this.manipulateNav = function (objVis, objNav, lbl_button, nSlides){ 
    
    objVis.style.overflow = "hidden";
    objVis.style.position = "relative";    
    objNav.style.position = "relative";
    
    var o;
    for(var i = 1; i <= nSlides; i++){ 
      o = document.getElementById(lbl_button + i);
      o.style.position = "absolute";
      o.style.left = (i-1) * (o.offsetWidth) + "px";
    }  
    
    objVis.style.width = (_nVisButtons * (o.offsetWidth)) + "px";
    objVis.style.height = (o.offsetHeight) + "px";
    
    objNav.style.width = (o.offsetWidth * nSlides) + "px";
    objNav.style.height = (o.offsetHeight) + "px";
    objNav.style.left = "0px";
    objNav.style.top = "0px";
    
    _objNav = objNav;
    _nSlides = nSlides;
    
  }
  
  this.manipulatePrev = function (obj){    
    obj.onclick = function () { return false; }
    obj.onmouseover = function () { _stopMoving = false; mouseIn(1) }
    obj.onmouseout = function () { mouseOut() }
  }
  
  this.manipulateNext = function (obj){
    obj.onclick = function () { return false; }
    obj.onmouseover = function () { _stopMoving = false; mouseIn(-1); }
    obj.onmouseout = function () { mouseOut(); }
  }
  
  
  function mouseIn(dir){
    if(_stopMoving) return;
    moveController(dir);
  }
  
  function mouseOut(){
    _stopMoving = true;
    if(_timeoutMove != null) clearTimeout(_timeoutMove);
  }
  
  function moveController(dir){
    if(_stopMoving) return;
    move(dir);
    _timeoutMove = setTimeout( (function (p0) { return function () { moveController(p0); };  })(dir), _speed);
  }
  
  function move(dir){
    
    // dir < 0 = -->
    // dir > 0 = <--
    
    var minLeft = - (_objNav.offsetWidth / _nSlides * (_nSlides-_nVisButtons));
    var maxLeft = 0;
  
    var curLeft = _tools.getLeftAndTop(_objNav)[0];
    var newLeft = curLeft;
    
    if( (dir<0) && (curLeft > minLeft) )    newLeft = curLeft-1;    
    else if( (dir>0) && (curLeft < maxLeft) )  newLeft = curLeft+1;
    
    _tools.changePosition(newLeft,null,_objNav);
    
  }
  
}


function s_Effect_BLEND (speed) {
  
  var _self = this;
  var _speed = speed;
    
  this.render = function (cur, next) {
    cur.style.zIndex = "1";
    next.style.zIndex = "2"; 
    var tools = new s_Tools ();
    tools.fade(cur, next, 0, 100, _speed); 
  }
  
  this.getButtonUsage = function () {
    return new Array(true, true, true, true, true);
  }

}

function s_Effect_BLENDSMOOTH (speed) {
  
  var _self = this;
  var _speed = speed;
    
  this.render = function (cur, next) {
    cur.style.zIndex = "1";
    next.style.zIndex = "2"; 
    var tools = new s_Tools ();
    tools.fadeSmooth(cur, next, _speed); 
  }
  
  this.getButtonUsage = function () {
    return new Array(true, true, true, true, true);
  }

}


function s_Effect_FLASH (speed, overlay, color) {
  
  var _self = this;
  var _speed = speed;
  var _overlay = overlay;
  var _color = color;
  
  this.init = function () { 
    _overlay.style.position  = "absolute";
    _overlay.style.left      = "0px";
    _overlay.style.right     = "0px";
    _overlay.style.display   = "block";
    _overlay.style.zIndex    = "3";    
    _overlay.style.background = _color;
  }
    
  this.render = function (cur, next) {     
    var tools = new s_Tools();    
    tools.changeOpacity(100, _overlay);
    tools.changeOpacity(0, cur);
    tools.changeOpacity(100, next);
    tools.fade(null,_overlay, 100, 0, _speed);    
  }
    
  this.getButtonUsage = function () {
    return new Array(true, true, true, true, true);
  }
  
  _self.init();

}


function s_Effect_SLIDE (speed, nSlides, lbl_slide, objVisibleArea, objSlideContainer) { 
  
  var _self = this;
  var _speed = speed;
  var _nSlides = nSlides;
  var _visArea = objVisibleArea;
  var _container = objSlideContainer;
  var _lbl = lbl_slide;
  
  this.init = function () {    
    _container.style.position = "absolute";
    _container.style.left = "0px";
    _container.style.top = "0px";
    _container.style.width = _visArea.offsetWidth * _nSlides;
    _container.style.height = _visArea.offsetHeight;
        
    for(var i = 1; i <= _nSlides; i++){    
            o = document.getElementById(_lbl + i);
            o.style.display  = "block";            
            var left = (i-1) * (o.offsetWidth);
            o.style.left = left + "px"; 
        }
    
  }
  
  this.render = function (cur, next){
    var tools = new s_Tools();
    
    var pos = (cur.id).lastIndexOf("_")+1;
    var curPos = (cur.id).substr(pos);
    
    pos = (next.id).lastIndexOf("_")+1;
    var nextPos = (next.id).substr(pos);
    
    tools.slide(curPos, nextPos, _visArea, _container, _speed);
  }
  
  this.getButtonUsage = function () {
    return new Array(true, true, true, true, true);
  }
  
  _self.init();
  
}



function s_Effect_SLIDEDECK (speed, nSlides, lbl_slide, lbl_button, objVisibleArea, objSlideContainer, objSM) { 
  
  var _self = this;
  var _speed = speed;
  var _nSlides = nSlides;
  var _visArea = objVisibleArea;
  var _container = objSlideContainer;
  var _sm = objSM;
  var _lbl_content = lbl_slide;
  var _lbl_nav = lbl_button;
  
  var _widthNav;
  var _widthCont;
  
  var _timeout;
  var _decks;
  
  
  this.init = function () {    
    
    var nav;
    var cont;
    _decks = new Array();
    
    for(var i = 1; i <= _nSlides; i++){
        
      nav = document.getElementById(_lbl_nav + i);
      cont = document.getElementById(_lbl_content + i);
      
      _decks.push(new Array(nav,cont));
      
      nav.style.position = "absolute";
      nav.style.overflow = "hidden";
      nav.style.zIndex = i;
      cont.style.position = "absolute";      
      cont.style.overflow = "hidden";
      cont.style.zIndex = i;

      
      cont.style.display = "block";
      nav.style.display = "block";
      
      if(i == 1){
        
        
        _widthCont = cont.offsetWidth;
        _widthNav = nav.offsetWidth;

        nav.style.left = (nav.offsetWidth * (i-1)) + (cont.offsetWidth * (i-1)) + "px"; 
        cont.style.left = (nav.offsetWidth * (i)) + (cont.offsetWidth * (i-1)) + "px";
                
      }else{
        
        nav.style.left = _widthCont + (nav.offsetWidth * (i-1)) + "px";                
        cont.style.left = _widthCont + (nav.offsetWidth * i) + "px";

      }
      
      

        }
    
    var newAreaWidth = (_nSlides * _widthNav) + _widthCont + "px";    
    _sm.style.width = newAreaWidth;
    _visArea.style.width = newAreaWidth;    
    
  }
  
  this.render = function (cur, next){    
    if(cur.id != next.id){
      
      if(_timeout != null) clearTimeout(_timeout);      
      _self.controller(next);
      
    }
  }
  
  this.getButtonUsage = function () {
    return new Array(true, true, true, true, true);
  }
  
  this.controller = function (next){
    
    var tools = new s_Tools();
    var decks = new Array();
    
    var pos = (next.id).lastIndexOf("_")+1;
    var slideNr = (next.id).substr(pos);
    
    var curLeft = tools.getLeftAndTop(next)[0];
    var openLeft = (slideNr)*_widthNav;
    
    
    var dir;
    if(curLeft == openLeft){      
      dir = 1; 
      for(var i = parseInt(slideNr)+1; i <= _nSlides; i++){
        decks.push(_decks[i-1]);
      }
      
    }else{      
      dir = 0;
      for(var i = 1; i <= slideNr; i++){        
        var cLeft = tools.getLeftAndTop(_decks[i-1][0])[0];
        var eLeft = (i-1)*_widthNav;
        if(cLeft != eLeft) decks.push(_decks[i-1])
      }
    }
    
        
    var o = decks[0][1];
    pos = (o.id).lastIndexOf("_")+1;
    firstSlideNr = (o.id).substr(pos);
    
    _self.moveDecks(decks, dir, firstSlideNr);
    
  }
  
  this.moveDecks = function (decks, dir, firstSlideNr){
  
    var nSteps = 100;    
    var tools = new s_Tools();
    var memory = new Array();
    
    
    for(var i = 0; i < decks.length; i++){
      var startNavLeft = tools.getLeftAndTop(decks[i][0])[0];
      
      var endNavLeft = (firstSlideNr-1 + i)*_widthNav;
      if(dir == 1) endNavLeft += _widthCont;
      
      //3. parameter saved value of distance moved
      memory.push(new Array(startNavLeft, endNavLeft, 0));      
    }
    
    
    var limitation = 1;
    
    for(var step = 1; step <= nSteps; step++){
      
      for(var i = 0; i < decks.length; i++){
        
        var stepWidth = Math.abs(memory[i][1] - memory[i][0]) / nSteps;

        var distanceMoved = memory[i][2];
        
        var newLeft;
        if(dir == 1)  newLeft = memory[i][0] + distanceMoved + stepWidth;          
        else      newLeft = memory[i][0] - distanceMoved - stepWidth;
          
        memory[i][2] += stepWidth;
        
        
        
        // slow down at the end
        var progress = step / nSteps;          
        if(progress >= 0.85)  limitation += 0.01;

        var quantityRegulator = 1 + (decks.length * 0.05);
        
        
        
        var movingSpeed = step * ((_speed/nSteps) / quantityRegulator) * limitation;
        
        _timeout = setTimeout( (function (p0,p1,p2,p3) { return function () { 
          
          p0.changePosition(p1,null,p3[0]);  
          p0.changePosition(p1+p2,null,p3[1]);
          
        };  })(tools, newLeft, _widthNav, decks[i]), movingSpeed);
      
        
      }      
      
    }
  
  }
  
  _self.init();
  
}


function s_Tools () {
  
  var _self = this;
    
  this.changeOpacity = function (opacity, obj){ 
    if(obj == null) return;
    
    //obj.style.opacity = (opacity / 100);
        //obj.style.filter = "alpha(opacity="+opacity+")";
 if ( opacity==100) obj.style.filter = "none";
        
        if(opacity == 0) obj.style.display = "none";
        else obj.style.display = "block";
  }
  
  this.fade = function(cur, next, startOpacity, endOpacity, fadingSpeed){  
    if(startOpacity == endOpacity) return;
    
    var fadeOut = (startOpacity > endOpacity);    
    var stepOpacity = (fadeOut) ? (startOpacity-endOpacity)/100 : (endOpacity-startOpacity)/100;
    
    for(var i = 1; i <= 100; i++){
      var newOpacity = (fadeOut) ? startOpacity-(i*stepOpacity) : startOpacity+(i*stepOpacity) ;
      
      setTimeout( (function (p0,p1,p2) { return function () { p0.changeOpacity(p1,p2); };  })(_self, newOpacity, next), i*fadingSpeed/100);
      
      if(i == 100 && cur != null && cur.id != next.id){
        var opc = (fadeOut) ? 100 : 0;
        setTimeout( (function (p0,p1,p2) { return function () { p0.changeOpacity(p1,p2); };  })(_self, opc, cur), (i+1)*fadingSpeed/100);        
      }
    }    
  }
  
  this.fadeSmooth = function(cur, next, fadingSpeed){  
    
    //fade out cur
    if(cur.id != next.id){
    
      for(var i = 1; i <= 100; i++){
        var newOpacity = 100-i;
        setTimeout( (function (p0,p1,p2) { return function () { p0.changeOpacity(p1,p2); };  })(_self, newOpacity, cur), i*fadingSpeed/2/100);
      }
      
    
    }
    //fade in next
    for(var i = 1; i <= 100; i++){
      setTimeout( (function (p0,p1,p2) { return function () { p0.changeOpacity(p1,p2); };  })(_self, i, next), (100+i)*fadingSpeed/2/100);
    }
    
  }
  
  
  this.slide = function (curPos, nextPos, objVisibleArea, objSlideContainer, slidingSpeed) { 
    
    var cCurLeft = parseInt(_self.getLeftAndTop(objSlideContainer));
    var cNextLeft = (nextPos-1) * -objVisibleArea.offsetWidth;
    
    var diff = cNextLeft - cCurLeft;
    
    var stepWidth = diff / 100;
    
    for(i = 1; i <= 100; i++){      
      var newLeft = cCurLeft + (i * stepWidth);
      setTimeout( (function (p0,p1,p2) { return function () { p0.changePosition(p1,null,p2); };  })(_self, newLeft, objSlideContainer), i*slidingSpeed/100);
    }
      
  }
    
  this.changePosition = function (left, top, obj){ 
    if(obj == null) return;
        if(top != null) obj.style.top = top + "px";
        if(left != null) obj.style.left = left + "px";        
  }
  
  this.getLeftAndTop = function (obj){
    var left = obj.style.left; 
    left = parseInt(left.substr(0,left.length-2));
    
    var top = obj.style.top; 
    top = parseInt(top.substr(0,top.length-2));
    
    return new Array(left, top);
  }  
  
}