var ToolTip = Class.create();

ToolTip.prototype = {
  initialize: function() {
    this.options = { xdist: 10, ydist: 10 };
    this.element = null;

    this.tooltip = Builder.node('div', {className: 'tooltip box', style: 'display: none;'}, [
    	Builder.node('div', {className:'bh'}, [
        Builder.node('div', {className:'bh1'}, [
          Builder.node('div', {className:'bh2'}, [
            Builder.node('div', {className:'bh3'}, [
              Builder.node('span'),
            ]),
          ]),
        ]),
			]),

      Builder.node('div', {className:'bc'}, [
        Builder.node('div', {className:'bc1'}, [
          Builder.node('div', {className:'bc2'}, [
            Builder.node('div', {className:'bc3'}, [
              this.inner = Builder.node('div', {className:'bc-content'}),
            ]),
          ]),
        ]),
			]),

    	Builder.node('div', {className:'bf'}, [
        Builder.node('div', {className:'bf1'}, [
          Builder.node('div', {className:'bf2'}, [
            Builder.node('div', {className:'bf3'}),
          ]),
        ]),
			]),
		]);

		document.body.insertBefore(this.tooltip, document.body.childNodes[0]);
		Element.extend(this.tooltip);
  },
	
  attach: function(element, title, content, width) {
		Event.observe(element, 'mouseover', this.show.bindAsEventListener(this, title, content, width));
		Event.observe(element, 'mouseout',  this.hide.bindAsEventListener(this));
    Event.observe(element, 'mousemove', this.move.bindAsEventListener(this));
  },
	
  detach: function(element) {
		element.stopObserving('mouseover');
		element.stopObserving('mouseout');
    element.stopObserving('mousemove');
  },

  refresh: function() {
    if (!this.element) return;
    this.element.simulate('mouseover');
  },

	show: function(event, title, content, width) {
    var element = Event.element(event);
    title = typeof(title) == 'function' ? title() : title;
    content = typeof(content) == 'function' ? content() : content;
    if (title) content = '<span class="title">' + title + '</span>' + content;

    if (!content) {
      content = element.getAttribute('title');
      if (content) {
        element.removeAttribute('title');
        element._title = content;
      }
      
      if (!content) {
        width = 0;
        content = '<div style="background: transparent url(\'' + RELATIVE_WCF_DIR + 'icon/tooltipLoading.gif\') no-repeat scroll left center; padding-left: 20px"><span style="color: #ff9900; font-weight: bold">Daten werden geladen</span><br/><span style="color: #555">Bitte warten</span></div>';
      }
    }
    
    this.element = element;
    this.inner.innerHTML = content;
    this.tooltip.style.width = (width ? width : this.tooltip.getWidth() + 1) + 'px';
    this.tooltip.show();
    this.move(event);
	},

	hide: function(event) {
    var element = Event.element(event);
    if (element._title) element.setAttribute('title', element._title);

    this.element = null;
    this.tooltip.style.width = 'auto';
		this.tooltip.hide();
	},

	move: function(event) {
    var xpos = Event.pointerX(event);
		var ypos = Event.pointerY(event);
    var offset = document.viewport.getScrollOffsets();
    var width = this.tooltip.getWidth();
    var height = this.tooltip.getHeight();
    
		if(xpos + width >= offset.left + Element.getWidth(document.body) - this.options.xdist * 2 - 5) {
			xpos = xpos - width - this.options.xdist * 2 + 5;
		}

		if(ypos + height >= offset.top + Element.getHeight(document.body) - this.options.ydist * 2 - 5) {
			ypos = ypos - height - this.options.ydist * 2 + 5;
		}
    
    if (!xpos || !ypos) return;
    this.tooltip.style.left = xpos + this.options.xdist + 5 + 'px';
    this.tooltip.style.top  = ypos + this.options.ydist + 5 + 'px';
	}
}

var ToolTips = null;

onloadEvents.push(function() {
  ToolTips = new ToolTip();

  $$('#iconBar a').each(function (input) {
      ToolTips.attach(input);
  });
  
  $$('blockquote.quoteBox div.quoteHeader a').each(function(element) {
    element.observe('click', function(event) {
      var element = Event.element(event).up('blockquote');
      var cite = element.readAttribute('cite');
      var url = cite.split("#");
      if (url.length == 2 && $(url[1])) {
        Effect.ScrollTo(url[1]);
        Event.stop(event);
      }

    });
  });

  $$('a').each(function(element) {
    if (element.href.indexOf('#top') >= 0) {
      element.observe('click', function(event) {
        Effect.ScrollTo('top');
        Event.stop(event);
      });
    }
  });
  /*
  window.setTimeout(function() {
    $('advert-skyscraper').appendAd('skyscraper.html');
    $('advert-leaderboard').appendAd('leaderboard.html');
  }, 200);
  */
});

/**
* Event.simulate(@element, eventName[, options]) -> Element
*
* - @element: element to fire event on
* - eventName: name of event to fire (only MouseEvents and HTMLEvents interfaces are supported)
* - options: optional object to fine-tune event properties - pointerX, pointerY, ctrlKey, etc.
*
* $('foo').simulate('click'); // => fires "click" event on an element with id=foo
*
**/
(function(){
  var eventMatchers = {
    'HTMLEvents': /^(?:load|unload|abort|error|select|change|submit|reset|focus|blur|resize|scroll)$/,
    'MouseEvents': /^(?:click|mouse(?:down|up|over|move|out))$/
  }
  var defaultOptions = {
    pointerX: 0,
    pointerY: 0,
    button: 0,
    ctrlKey: false,
    altKey: false,
    shiftKey: false,
    metaKey: false,
    bubbles: true,
    cancelable: true
  }

  Event.simulate = function(element, eventName) {
    var options = Object.extend(defaultOptions, arguments[2] || { });
    var oEvent, eventType = null;

    element = $(element);

    for (var name in eventMatchers) {
      if (eventMatchers[name].test(eventName)) { eventType = name; break; }
    }

    if (!eventType)
      throw new SyntaxError('Only HTMLEvents and MouseEvents interfaces are supported');

    if (document.createEvent) {
      oEvent = document.createEvent(eventType);
      if (eventType == 'HTMLEvents') {
        oEvent.initEvent(eventName, options.bubbles, options.cancelable);
      }
      else {
        oEvent.initMouseEvent(eventName, options.bubbles, options.cancelable, document.defaultView,
          options.button, options.pointerX, options.pointerY, options.pointerX, options.pointerY,
          options.ctrlKey, options.altKey, options.shiftKey, options.metaKey, options.button, element);
      }
      element.dispatchEvent(oEvent);
    }
    else {
      options.clientX = options.pointerX;
      options.clientY = options.pointerY;
      oEvent = Object.extend(document.createEventObject(), options);
      element.fireEvent('on' + eventName, oEvent);
    }
    return element;
  }

  Element.addMethods({ simulate: Event.simulate });
})();

(function(){
  Element.addMethods({
    appendAd: function(element, url) {
      element = $(element);
      element.appendChild(new Element('iframe', { frameborder: 0, src: url }));
      return element;
    }
  });
})();