var currentDragElement   = "";

function transformationHandler(Content, AreaWidth, AreaHeight, fct, imageObj) {

  var self = this;

  _zoomed             = false;
  _moveOn             = false;
  _moveDown           = false;
  _timer              = 0;
  _fct                = fct;
  _zoomFactor         = 1;
  _imageObj           = imageObj;

  this.Content        = Content;
  this.Desktop        = $('Photobook');
  this.ContentWidth   = 0;
  this.ContentHeight  = 0;
  this.AreaWidth      = parseFloat(AreaWidth);
  this.AreaHeight     = parseFloat(AreaHeight);
  this.startXmouse    = 0;
  this.startYmouse    = 0;
  this.startXlayer    = 0;
  this.startYlayer    = 0;
  this.mouseX         = 0;
  this.mouseY         = 0;

  this.getMousePos = function(moveEvent) {
    self.mouseX =(window.event)? window.event.x : moveEvent.pageX;
    self.mouseY =(window.event)? window.event.y : moveEvent.pageY;
  }

  moveLayer = function() {

    if(_moveOn) {

      var leftOffset     = self.mouseX - self.startXmouse + self.ContentWidth   + self.startXlayer;
      var bottomOffset   = self.mouseY - self.startYmouse + self.ContentHeight + self.startYlayer;
      var rightOffset   = self.mouseX - self.startXmouse + self.startXlayer;
      var topOffset     = self.mouseY - self.startYmouse + self.startYlayer;
      var _X            = self.startXlayer + self.mouseX - self.startXmouse;
      var _Y            = self.startYlayer + self.mouseY - self.startYmouse;

      if((leftOffset) <= self.AreaWidth) {
        _X = self.AreaWidth - self.ContentWidth;
      }
      if((rightOffset) >= 0) {
        _X = 0;
      }
      if((bottomOffset) <= self.AreaHeight) {
        _Y = self.AreaHeight - self.ContentHeight;
      }
      if((topOffset) >= 0) {
        _Y = 0;
      }
      self.Content.style.left  = _X + 'px';
      self.Content.style.top  = _Y + 'px';

    }
    _timer = setTimeout("moveLayer()",40);
  }

  this.startMove = function(downEvent) {

    eventObj = (window.event)?  window.event.srcElement : downEvent.target;

    if(eventObj && self.Content) {

      self.startXmouse         = (window.event)? window.event.x : downEvent.pageX;
      self.startYmouse         = (window.event)? window.event.y : downEvent.pageY;
      self.mouseX             = (window.event)? window.event.x : downEvent.pageX;
      self.mouseY             = (window.event)? window.event.y : downEvent.pageY;
      self.startXlayer         = parseInt(self.Content.style.left);
      self.startYlayer         = parseInt(self.Content.style.top);
      self.ContentWidth       = parseInt(self.Content.width);
      self.ContentHeight       = parseInt(self.Content.height);

      _moveOn                  = true;
      _mouseDown              = true;
      unset_content_position   = true;

      return false;
    }
  }

  fitImageToBox = function() {

    var boxRatio = self.AreaWidth / self.AreaHeight;
    var imgRatio = _imageObj.ratioOrig;

    if(_imageObj.Alpha == 90 || _imageObj.Alpha == -90 || _imageObj.Alpha == 270 || _imageObj.Alpha == -270) {
      imgRatio = 1 / imgRatio;
    }

    if (boxRatio < imgRatio) {
    // fitHeight
    var fitWidth = self.AreaHeight * imgRatio;
    var fitHeight = self.AreaHeight;
    }
    else {
    // fitHeight
    var fitWidth = self.AreaWidth;
    var fitHeight = (self.AreaWidth / imgRatio);

    }

    Element.setStyle(self.Content, { height: fitHeight + 'px'});
    Element.setStyle(self.Content, { width: fitWidth  + 'px'});

    if((parseInt(self.Content.style.left) + fitWidth) < self.AreaWidth) {
      var offsetX = parseFloat(Element.getStyle(self.Content, "left").replace(/px/, ''));
      var newOffsetX = checkContentXInside(offsetX, fitWidth);
      Element.setStyle(self.Content, { left: newOffsetX.toFixed(4) + "px"});
    }
    if((parseInt(self.Content.style.top) + fitHeight) < self.AreaHeight) {
      var offsetY = parseFloat(Element.getStyle(self.Content, "top").replace(/px/, ''));
      var newOffsetY = checkContentYInside(offsetY, fitHeight);
      Element.setStyle(self.Content, { top: newOffsetY.toFixed(4) + "px"});
    }
  }

  checkContentXInside = function(_X, newWidth) {
    // flush the Image with LeftBorder
    if(_X >= 0) {
      _X = 0;
    }
    // flush the Image with RightBorder
    if(((_X + newWidth) <= self.AreaWidth) && _X < 0) {
      _X -= ((newWidth + _X) - self.AreaWidth);
    }
    return _X
  }

  checkContentYInside = function(_Y, newHeight) {
    // flush the Image with TopBorder
    if(_Y >= 0) {
      _Y = 0;
    }
    // flush the Image with BottomBorder
    if(((_Y + newHeight) <= self.AreaHeight) && _Y < 0) {
      _Y -= ((newHeight + _Y) - self.AreaHeight);
    }
    return _Y
  }

  /**
   * Zoom-Funktion zum Heran- oder Wegzoomen eines ContentObjects
   *
   * Wird via setTimeout in Intervallen aufgerufen, um kontinuierlich
   * aber unterbrechbar zu funktionieren.
   *
   */
  zoomLayer = function(oneZoom) {

    _zoomed = false;

    /**
     * Zur Zoom-Berechnung nötige Werte bereitstellen
     */
    var leftOffset   = parseFloat(self.Content.style.left);
    var topOffset   = parseFloat(self.Content.style.top);
    var oldWidth    = parseFloat(self.Content.style.width);
    var oldHeight    = parseFloat(self.Content.style.height);

    /**
     * Die neuen Ausmaße sind ganz einfach die alten Werte mal ZoomFaktor
     *
     * Der ZoomFaktor wird von außen gesetzt (z.B. "1.1" für heranzoomen, "0.9" für wegzoomen)
     */
    var newWidth    = project.roundValue((oldWidth * _zoomFactor), 8);
    var newHeight    = project.roundValue((oldHeight * _zoomFactor), 8);

    /**
     * Wenn herausgezoomt wird (ZoomFaktor < 1), dann nicht weiter herauszoomen, als Vollbild
     */
    if((_zoomFactor < 1)) {

      /**
       * Wäre die neue Breite bzw. Höhe kleiner als die Box?
       */
      if((newWidth < self.AreaWidth) || (newHeight < self.AreaHeight)) {

        // fit Image to BoxSize
        fitImageToBox();

        // stop zooming!
        clearTimeout(_timer);

        return;
      }
    }

    /**
     * Zoom-Vorgang fortsetzen?
     */
    if(_moveOn || oneZoom) {

      _zoomed = true;

      /**
       * Neue Breite/Höhe setzen
       */

      Element.setStyle(self.Content, { width: newWidth + 'px'});
      Element.setStyle(self.Content, { height: newHeight + 'px'});

      /**
       * Neue Bildoffsets berechnen
       *
       * neuerOffset = (alterOffset       // ist negativer Wert
       *             + 1/2BoxGröße)       // Box
       *             * ZoomFaktor
       *             +
       */
      var oldImageOffsetX = parseFloat(Element.getStyle(self.Content, "left").replace(/px/, ''));
      var oldImageOffsetY = parseFloat(Element.getStyle(self.Content, "top").replace(/px/, ''));
      oldImageOffsetX    -= self.AreaWidth * 0.5;
      oldImageOffsetY    -= self.AreaHeight * 0.5;
      var newImageOffsetX = (oldImageOffsetX * _zoomFactor) + (self.AreaWidth * 0.5);
      var newImageOffsetY = (oldImageOffsetY * _zoomFactor) + (self.AreaHeight * 0.5);

      if((_zoomFactor < 1)) {
        newImageOffsetX = checkContentXInside(newImageOffsetX, newWidth);
        newImageOffsetY = checkContentYInside(newImageOffsetY, newHeight);
      }

      Element.setStyle(self.Content, { left: newImageOffsetX + "px"});
      Element.setStyle(self.Content, { top: newImageOffsetY + "px"});

      /**
       * Quality check (resolution)
       */
      if(!_imageObj.checkMaxScale(newWidth) && (_zoomFactor > 1)) {

        // stop zooming!
        clearTimeout(_timer);

        _imageObj.quality = "bad";
        project.checkQuality(self.Content.parentNode, _imageObj.CB);

        return;
      }

    }
    _timer = setTimeout("zoomLayer()",40);
  }

  this.startZoom = function(downEvent) {

    eventObj = (window.event)?  window.event.srcElement : downEvent.target;

    if(eventObj && self.Content) {

      self.Content.style.width   = self.Content.width   + 'px';
      self.Content.style.height = self.Content.height + 'px';

      _moveOn                  = true;
      _mouseDown              = true;
      unset_content_position   = true;

      return false;
    }
  }

  if (navigator.appVersion.match(/\bMSIE\b/)) {

    // hold up the downfocus from dragelement in IE
    Content.onmouseout   = function() {
                            if(currentDragElement == Content && _mouseDown == true) {
                              _moveOn = true;
                            }
                          };
    Content.onmouseover = function() {
                            if(currentDragElement == Content && _mouseDown == true) {
                              _moveOn = true;
                            }
                          };
  }

  this.Desktop.onmousemove = self.getMousePos;
  this.Desktop.onmouseup = function() {
    _moveOn = false;
    clearTimeout(_timer);
    _mouseDown = false;
    // zoom by click
    if(_fct == "plus" && _zoomed == false && _moveOn == false) {
       zoomLayer(true);
       _zoomed = false;
    }
  };

  this.Desktop.ondragstart = function() {
    return false
  };

  switch (_fct) {

    case "position":
      this.Desktop.onmousedown = self.startMove;
      moveLayer();
      break;

    case "plus":
      _zoomFactor = 1.1;
      this.Desktop.onmousedown = self.startZoom;
      zoomLayer();
      break;

    case "minus":
      _zoomFactor = 0.9;
      this.Desktop.onmousedown = self.startZoom;
      zoomLayer();
      break;
  }

}