var MouseInfo = {
	position: {x:0,y:0},
	last: {x:0,y:0}
};

var MoveDrag = new Klasse({

  dragger: null,
  container: null,
  against: null,
  bounds: {},
  dragging: false,
  startPos: 0,
  mouseStart: 0,
  dragStart: 0,
  frameMax: 0,

  initialize: function (d, c, a)
  {
    this.dragger = d;
    this.container = c;
    this.against = a;

    this.update();
    
    this.dragger.addEvent('mousedown', this.mouseDown.bind(this));
    this.dragger.addEvent('mouseup', this.mouseUp.bind(this));
    this.container.addEvent('mousemove', this.drag.bind(this));
  },

  reset: function ()
  {
    this.bounds = {};
    this.dragging = false;
    this.startPos = 0;
    this.mouseStart = 0;
    this.dragStart = 0;
    this.frameMax = 0;
    this.dragger.style.top = '0px';
this.update();
  },

  update: function ()
  {
    this.needScroll();

    this.bounds = {
      x: 0,
      y: 0,
      x2: 0,
      y2: this.container.offsetHeight - this.dragger.offsetHeight
    };

  },

  needScroll: function ()
  {
    this.frameMax = this.against.document.body.scrollHeight - this.container.offsetHeight - 20;
    if (this.frameMax > 0) {
      $moo('slider').style.visibility = 'visible';
      $moo('slider').parentNode.style.visibility = 'visible';
    } else {
      $moo('slider').style.visibility = 'hidden';
      $moo('slider').parentNode.style.visibility = 'hidden';
    }
  },

  mouseDown: function (ev)
  {
    this.dragging = true;
    this.mouseStart = ev.page.y;
    this.dragStart = this.dragger.offsetTop;
  },

  mouseUp: function ()
  {
    this.dragging = false;
  },

  drag: function (ev)
  {

    if (this.dragging) {
      var c = ev.page.y;
      moved = c - this.mouseStart;
      var shouldMove = this.dragStart + moved;

      if (shouldMove > 277) shouldMove = 277;
      if (shouldMove < 0) shouldMove = 0;

      this.dragger.style.top = shouldMove + 'px';

      var procent = (shouldMove/277) * 100;
      var toMove = procent * ( this.frameMax / 100 );

      this.against.scrollTo(0, toMove);
    }
  }

});

var Scrollpane = new Klasse({

  scrollUp: null,
  scrollDown: null,
  scrollDrag: null,
  scrollDragContainer: null,
  iframe: null,
  iframe2: null,
  frameMax: 0,
  scrollMax: 0,
  md: null,
  isScrolling: false,

  initialize: function ()
  {
    /*$moo("mainContent").onload = function(){
      scrollPane.update();
    }*/
    new IFrame($moo("mainContent"), {
      events: {
        load: this.update.bind(this)
      }
    });

    this.update();

    /* THE FOLLOWING IS OUTSIDE THE UPDATE METHOD, CAUSE WE DONT WANT TO SET A LOT OF THINGS */

    this.scrollUp.addEvent('click', this.scrollUpFN.bind(this));
    this.scrollDown.addEvent('click', this.scrollDownFN.bind(this));
  },

	moveDragger: function ()
	{
    this.isScrolling = false;

    var moved = this.iframe2.document.body.scrollTop;
    var p = this.frameMax / 100;
    var rest = this.frameMax - moved;

    var procent = ( moved / this.frameMax ) * 100;
    var toMove = procent * ( this.scrollMax / 100 );
    if (toMove < 2) {
      toMove = 0;
    }
    this.scrollDrag.style.top = toMove +  'px';
	},

  onWheel: function (ev)
  {
    if (this.isScrolling) {
      return;
    } else {
      this.isScrolling = true;
    }
    var d = 0;
    if (!ev) ev = window.event;

    if (ev.wheelDelta) {
      d = ev.wheelDelta;
    } else if (ev.detail) {
      d = -ev.detail;
    }

		if (d < 0) {
			this.scrollDownFN();
		} else if (d > 0) {
			this.scrollUpFN();
		}
  },

  scrollUpFN: function ()
  {
    var pos = this.iframe.getScroll();
    var from = this.iframe2.document.body.scrollTop;
    var to = (from - 250 );
    if (to < 1) {
      to = 0;
    }

    var t = new Fx.Tween($moo('fake'), {
      onUpdate: function(ev){
        this.iframe2.scrollTo(0, $(ev).offsetWidth);
      }.bind(this),
      onComplete: this.moveDragger.bind(this)
    });
    t.start('width', from + 'px', to + 'px');
  },

  scrollDownFN: function ()
  {
    var pos = this.iframe.getScroll();
    var from = this.iframe2.document.body.scrollTop;
    var to = (250+from );

    var t = new Fx.Tween($moo('fake'), {
      onUpdate: function(ev){
        this.iframe2.scrollTo(0, $(ev).offsetWidth);
      }.bind(this),
      onComplete: this.moveDragger.bind(this)
    });
    t.start('width', from + 'px', to + 'px');
  },

  reset: function ()
  {
    this.md.reset();
  },

  update: function ()
  {
    this.scrollUp = $moo('upButton');
    this.scrollDown = $moo('downButton');
    this.iframe = $moo('mainContent');
    this.iframe2 = mainContent;
    this.scrollDrag = $moo('dragger');
    this.scrollDragContainer = $moo('draggerContainer');

    if (this.md == null) {
      this.md = new MoveDrag(this.scrollDrag, this.scrollDragContainer, this.iframe2);
    } else {
      this.md.update();
    }

    if (this.iframe2.addEventListener && Browser.Engine.name != 'webkit') {
      this.iframe2.addEventListener('DOMMouseScroll', this.onWheel.bind(this), false);
    } else if (this.iframe2.attachEvent) {
      this.iframe2.document.body.attachEvent('onmousewheel', this.onWheel.bind(this));
    } else {
      this.iframe2.document.body.onmousewheel = this.onWheel.bind(this);
    }
//this.iframe2.document.body.onmousewheel = this.onWheel.bind(this);

    this.frameMax = this.iframe2.document.body.scrollHeight - this.scrollDragContainer.offsetHeight - 20;
    this.scrollMax = this.scrollDragContainer.offsetHeight - this.scrollDrag.offsetHeight;
  }
  
});

var scrollPane;
window.addEvent('load', function(){
	scrollPane = new Scrollpane();
});