/***************************************************************
*  Copyright notice
*
*  (c) 2008 Peter Klein (peter@umloud.dk)
*  All rights reserved
*
*  This script is part of the TYPO3 project. The TYPO3 project is
*  free software; you can redistribute it and/or modify
*  it under the terms of the GNU General Public License as published by
*  the Free Software Foundation; either version 2 of the License, or
*  (at your option) any later version.
*
*  The GNU General Public License can be found at
*  http://www.gnu.org/copyleft/gpl.html.
*  A copy is found in the textfile GPL.txt and important notices to the license
*  from the author is found in LICENSE.txt distributed with these scripts.
*
*
*  This script is distributed in the hope that it will be useful,
*  but WITHOUT ANY WARRANTY; without even the implied warranty of
*  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
*  GNU General Public License for more details.
*
*  This copyright notice MUST APPEAR in all copies of the script!
***************************************************************/

var slimboxMagnify = new Class({
	options: {
		magnifyImg: 'magnify.jpg',					// Magnify icon image
		magnifyImgWidth: 20,						// Width of Magnify icon image
		magnifyImgHeight: 20,						// Height of Magnify icon image
		magnifyImgMargin: 5,						// Margin for Magnify icon image
		magnifyTitle: 'Hier klicken!',	// Text for title attribute when hovering over magnifyicon
		magnifyPersistant: 1,						// Should Magnify icon image always be visible?
		fxDuration: 400,							// Duration of transition
		fxTransition: Fx.Transitions.Quad.easeInOut	// Transition for opacity
	},
	initialize: function(element, options) {
		this.element = $E('img',element); 	// Image Element
		this.setOptions(options);
		this.slimboxMagnify();
	},
	slimboxMagnify: function() {
		this.dims = this.element.getCoordinates();
		if (this.dims.width<this.options.magnifyImgWidth+this.options.magnifyImgMargin*2 || this.dims.height<this.options.magnifyImgHeight+this.options.magnifyImgMargin*2) return;
		this.wrapper = new Element('div').setProperty('title',this.options.magnifyTitle).setStyles({
			position: 'absolute',
			cursor: 'pointer',
			opacity: this.options.magnifyPersistant,
			background: 'transparent url('+this.options.magnifyImg+') no-repeat scroll 0% 0%',
			width: this.options.magnifyImgWidth,
			height: this.options.magnifyImgHeight,
			top: this.dims.top + this.options.magnifyImgMargin,
			left: this.dims.left + this.options.magnifyImgMargin
		}).injectAfter(this.element);
		if (this.options.magnifyPersistant) return;
		this.wrapper.fx = this.element.fx = new Fx.Styles(this.wrapper, {duration:this.options.fxDuration, transition: this.options.fxTransition, wait:false});
		this.wrapper.addEvent('mouseenter', function(){
			this.fx.start({opacity: [1]});
		}).addEvent('mouseleave', function(){
			this.fx.start({opacity: [0]});
		});
		this.element.addEvent('mouseenter', function(){
			this.fx.start({opacity: [1]});
		}).addEvent('mouseleave', function(){
			this.fx.start({opacity: [0]});
		});
	}
});
slimboxMagnify.implement(new Options);