/*
	Slimbox (Extended Version 1.3.1.2, 2007-06-07)
	by Peter Klein
	-	Added localization of text values
	-	Support for setting different opacitylevel
	-	Support for changing IFRAME scrolling parameter
	-	Added TYPO3 specific Print & Save options.
	-	Fixed problems with page reload in Print & Save function.
	-	Fixed SWFObject incompability.
	-	Added option to disable numbers.

	Slimbox (Extended Version 1.3.1, 2007-02-21)
	by Yukio Arita (http://homepage.mac.com/yukikun/software/slimbox_ex/)
	- 	Support to show external content using iframe.
	- 	Support to set content size. You can add width/height parameters
		in rev attribute of the anchor url.
		ex1) <a href="image.jpg" rev="width=50%, height=50%" rel="lightbox"><img src="image_thumb.jpg" alt="image"></a>
		ex2) <a href="text.html" rev="width=500, height=300" rel="lightbox">some text here</a>
	- 	Some rendering problem with IE6 is fixed. Now you can use Slimbox in
		valid XHTML document with XML prolog.
	- Of course, license is same as original.

	Based on:
	Slimbox v1.3 - The ultimate lightweight Lightbox clone
	by Christophe Beyls (http://www.digitalia.be) - MIT-style license.
	Inspired by the original Lightbox v2 by Lokesh Dhakar.
	enhanced by Georg Ringer with the ecard function
*/
var rgecardconfig="1-de";
var Lightbox = {
	init: function(options){
		this.options = Object.extend({
			resizeDuration: 400,
			resizeTransition: Fx.Transitions.sineInOut,
			initialWidth: 250,
			initialHeight: 250,
			animateCaption: true,
			showNumbers: true,
			defaultIframeWidth : 500,
			defaultIframeHeight: 300,
			opacity: 0.8,
			opacityDuration: 500,
			iframeScrolling: 'auto',
			enablePrintButton: 0,
			enableSaveButton: 0,
			llPage: 'Page',
			llOf: 'of',
			psScriptPath: ''
		}, options || {});

		// IE 6 - XML prolog problem
		if(window.ie6 && document.compatMode=="BackCompat"){
			this.options.animateCaption = false;
		}

		this.form32 = '<div class="rgecard-formheader">Versende dieses Bild als E-Card</div>' +
		 '<form action="index.php?eID=tx_rgecard_pi1" id="rgecardform">' +
			'<fieldset>' +
  			'<legend>Absender</legend>' +
				'<div class="row">' +
	    		'<label for="sendername">Name</label>' +
	    		'<input type="text" id="sendername" name="sendername"/>' +
	  		'</div>' +
  			'<div class="row">' +
   	 			'<label for="senderemail">E-Mail</label>' +
    			'<input type="text" id="senderemail" name="senderemail"/>' +
  			'</div>' +
			'</fieldset>' +
			'<fieldset>' +
	  		'<legend>Empf&auml;nger</legend>' +
  			'<div class="row">' +
    			'<label for="recname">Name</label>' +
    			'<input type="text" id="recname" name="recname"/>' +
				'</div>' +
  			'<div class="row">' +
    			'<label for="recemail">E-Mail</label>' +
    			'<input type="text" id="recemail" name="recemail"/>' +
  			'</div>' +
			'</fieldset>' +
			'<fieldset>' +
 			  '<legend>Nachricht</legend>' +
 			  '<div class="row"><textarea id="nachricht" cols="50" rows="5" name="nachricht"></textarea></div>' +
			'</fieldset> ' +
			'<input class="hidden" id="rgecardimg" type="hidden" value="" name="image" />' +
			'<input class="hidden" id="rgecardurl" type="hidden" value="" name="url" />' +
			'<input class="hidden" id="rgecardconfig" type="hidden" value="" name="rgecardconfig" />' +
			'<div class="row">' +
			  '<div id="log_res"></div>' +
		'</div>' +
		'<div class="row"><input type="submit" class="submit" value="Abschicken" name="absenden"/></div>' +
		'<div class="clearer"> </div>' +
	'</form>';

		this.anchors = [];
		$each(document.links, function(el){
			if (el.rel && el.rel.test(/^lightbox/i)){
				el.onclick = this.click.pass(el, this);
				this.anchors.push(el);
			}
		}, this);
		this.eventKeyDown = this.keyboardListener.bindAsEventListener(this);
		this.eventPosition = this.position.bind(this);

		/*	Build float panel
			<div id="lbOverlay"></div>
			<div id="lbCenter">
				<div id="lbCanvas">
					<a id="lbPrevLink"></a>
					<a id="lbNextLink"></a>
					<!-- img or iframe element is inserted here -->
				</div>
			</div>
			<div id="lbBottomContainer">
				<div id="lbBottom">
					<a id="lbCloseLink"></a>
					<div id="lbCaption"></div>
					<div id="lbNumber"></div>
					<div style="clear:both;"></div>
				</div>
			</div>
		*/

		var ifrealod = $('lbBottomContainer') ? true : false;
		if (ifrealod) {
			$('lbBottomContainer').remove();
			$('lbOverlay').remove();
			$('lbCenter').remove();
		}
		this.overlay = new Element('div').setProperty('id', 'lbOverlay').injectInside(document.body);
		this.center = new Element('div').setProperty('id', 'lbCenter').setStyles({width: this.options.initialWidth+'px', height: this.options.initialHeight+'px', marginLeft: '-'+(this.options.initialWidth/2)+'px', display: 'none'}).injectInside(document.body);
		this.canvas = new Element('div').setProperty('id', 'lbCanvas').injectInside(this.center);
		this.prevLink = new Element('a').setProperties({id: 'lbPrevLink', href: '#'}).setStyle('display', 'none').injectInside(this.canvas);
		this.nextLink = this.prevLink.clone().setProperty('id', 'lbNextLink').injectInside(this.canvas);
		this.prevLink.onclick = this.previous.bind(this);
		this.nextLink.onclick = this.next.bind(this);
		this.bottomContainer = new Element('div').setProperty('id', 'lbBottomContainer').setStyle('display', 'none').injectInside(document.body);
		this.bottom = new Element('div').setProperty('id', 'lbBottom_card').injectInside(this.bottomContainer);


		new Element('a').setProperties({id: 'lbCloseLink_card', href: '#'}).injectInside(this.bottom).onclick = this.overlay.onclick = this.close.bind(this);

		if (this.options.enablePrintButton && this.options.psScriptPath) {
			new Element('a').setProperties({
				id: 'lbPrintLink',
				href: '#'
			}).injectInside(this.bottom).onclick = this.printOrSave.bind(this, 'print');
		}
		if (this.options.enableSaveButton && this.options.psScriptPath) {
			new Element('a').setProperties({
				id: 'lbSaveLink',
				href: '#'
			}).injectInside(this.bottom).onclick = this.printOrSave.bind(this, 'save');
		}

    /* ringerge.org */
		//new Element('div').setProperties({id: 'lbTipLink'}).injectInside(this.bottom).onclick = this.sendEcard.bind(this,'1');

		this.ecardNest = new Element('div').setProperties({id: 'ecardNest'}).injectInside(this.canvas);
		this.ecard = new Element('div').setProperties({id: 'ecard', 'style':'display:none;height:0px;'}).injectInside(this.ecardNest);
		//      this.ecardSlide = new Fx.Slide('ecard');
		this.ecardSlide = new Fx.Styles('ecard', {duration:400, wait:false});
	//  this.eform = new Element('form').setProperties({action: '#', id:'ecardform'}).injectInside(this.ecard);
	//  		new Element('input').setProperties({id: 'sender', name:'sender'}).injectInside(this.eform);
	//  		new Element('input').setProperties({id: 'reciever', name:'reciever'}).injectInside(this.eform);


    this.ecard.setHTML(this.form32);

    /* ringerge.org */
		this.caption = new Element('div').setProperty('id', 'lbCaption').injectInside(this.bottom);
		this.number = new Element('div').setProperty('id', 'lbNumber').injectInside(this.bottom);
		new Element('div').setStyle('clear', 'both').injectInside(this.bottom);

/*
    // get the form for the ecard
    new Ajax('index.php?eID=tx_rgecard_pi1&getForm=1&config='+rgecardconfig, {
      method: 'get',
      onComplete: function(response) {
      this.form32 = response;
      }.bind(this)
    }).request();
*/

		/* Build effects */
		var nextEffect = this.nextEffect.bind(this);

		this.fx = {
			overlay: this.overlay.effect('opacity', {duration: this.options.opacityDuration}).hide(),
			resizeCenter: this.center.effects({duration: this.options.resizeDuration, transition: this.options.resizeTransition, onComplete: nextEffect}),
			image: this.canvas.effect('opacity', {duration: this.options.opacityDuration, onComplete: nextEffect}),
			bottom: this.bottomContainer.effect('height', {duration: 400, onComplete: nextEffect})
		};

		this.preloadPrev = new Image();
		this.preloadNext = new Image();
	},
	sendEcard: function(mode) {
    if (mode===0) {
      $("ecard").setStyle('height','0px');
      $("ecard").setStyle('display','none');

    } else {

      $('rgecardimg').setProperty('value',this.items[this.activeItem][0]);
      $('rgecardurl').setProperty('value',window.location.href);
      $('nachricht').setProperty('value',this.items[this.activeItem][1]);
      $('rgecardconfig').setProperty('value',rgecardconfig);

      $('rgecardform').addEvent('submit', function(e) {
      	new Event(e).stop();

      	/**
      	 * This empties the log and shows the spinning indicator
      	 */
      	var log = $('log_res').empty().addClass('ajax-loading');

      	/**
      	 * send takes care of encoding and returns the Ajax instance.
      	 * onComplete removes the spinner from the log.
      	 */
      	this.send({
      		update: log,
      		onComplete: function(response) {
      		  log.removeClass('ajax-loading');
            // error
            if (response.contains('error')) {
          //  alert("nein");
            } else {
            //  alert("ja");
            }

      		}

      	}).request();
      });
       /*
       String.extend({ domify: function(){ return new Element('span').setHTML(this).getFirst();} });
       response.domify().hasClass('error')
       */


      if ($("ecard").getStyle('height').toInt() === 0 ) {
        $('log_res').empty();
        $("ecard").setStyle('display','block');
       		this.ecardSlide.start({
    	       'height': '360px'
          }).chain(function(){

          });
      } else {
        this.ecardSlide.start({
          'height': '360px'

        }).chain(function(){
        $("ecard").setStyle('display','block');
          });

      }
    }




  },
	click: function(link){
		if (link.rel.length == 8) {
			return this.show(link.href, link.title, link.rev);
		}

		var j, itemNumber, items = [];
		this.anchors.each(function(el){
			if (el.rel == link.rel){
				for (j = 0; j < items.length; j++) {
					if (items[j][0] == el.href && items[j][2] == el.rev) {
						break;
					}
				}
				if (j == items.length){
					items.push([el.href, el.title, el.rev]);
					if (el.href == link.href && el.rev == link.rev) {
						itemNumber = j;
					}
				}
			}
		}, this);
		return this.open(items, itemNumber);
	},

	show: function(url, title, rev){
		return this.open([[url, title, rev]], 0);
	},

	open: function(items, itemNumber){
		this.items = items;
		this.position();
		this.setup(true);
		var wh = (window.getHeight() === 0) ? window.getScrollHeight() : window.getHeight();
		var st = document.body.scrollTop  || document.documentElement.scrollTop;
		this.top = st + (wh / 15);
		this.center.setStyles({top: this.top+'px', display: ''});
		this.fx.overlay.start(this.options.opacity);
		return this.changeItem(itemNumber);
	},

	position: function(){
		//IE6 - XML prolog problem.
		var ww = (window.getWidth() === 0) ? window.getScrollWidth()-22 : window.getWidth();
		var wh = (window.getHeight() === 0) ? window.getScrollHeight() : window.getHeight();
		var st = document.body.scrollTop  || document.documentElement.scrollTop;
		this.overlay.setStyles({top: st+'px', height: wh+'px', width:ww+'px'});
	},
/*
	setup: function(open){
		var elements = $A(document.getElementsByTagName('object'));
		if (window.ie) elements.extend(document.getElementsByTagName('select'));
		elements.each(function(el){ el.style.visibility = open ? 'hidden' : ''; });
		var fn = open ? 'addEvent' : 'removeEvent';
		window[fn]('scroll', this.eventPosition)[fn]('resize', this.eventPosition);
		document[fn]('keydown', this.eventKeyDown);
		this.step = 0;
	},
*/
	setup: function(open){
		var elements = $A(document.getElementsByTagName('object'));
		elements.extend(document.getElementsByTagName(window.ie ? 'select' : 'embed'));
		elements.each(function(el){
			if (open) {
				el.lbBackupStyle = el.style.visibility;
			}
			el.style.visibility = open ? 'hidden' : el.lbBackupStyle;
		});
		var fn = open ? 'addEvent' : 'removeEvent';
		window[fn]('scroll', this.eventPosition)[fn]('resize', this.eventPosition);
		document[fn]('keydown', this.eventKeyDown);
		this.step = 0;
	},

	keyboardListener: function(event){
		switch (event.keyCode){
			case 27: this.close(); break;
//			case 37: this.previous(); break;
//			case 39: this.next();
		}

	},

	previous: function(){
    return this.changeItem(this.activeItem-1);
	},

	next: function(){
		return this.changeItem(this.activeItem+1);
	},

	changeItem: function(itemNumber){
		if (this.step || (itemNumber < 0) || (itemNumber >= this.items.length)) {
			return false;
		}
    this.sendEcard(0);
    this.step = 1;
		this.activeItem = itemNumber;

		this.bottomContainer.style.display = this.prevLink.style.display = this.nextLink.style.display = 'none';
		this.fx.image.hide();
		this.center.className = 'lbLoading';

		// discard previous content by clicking
		this.removeCurrentItem();

		// check item type
		var url = this.items[this.activeItem][0];
		var rev = this.items[this.activeItem][2];

		var re_imageURL = /\.(jpe?g|png|gif|bmp)/i;
		if( url.match(re_imageURL) ) {
			this.preload = new Image();	// JavaScript native Object
			this.preload.datatype = 'image';
			this.preload.w = this.matchOrDefault(rev, new RegExp("width=(\\d+%?)", "i"), -1); //-1 if use original size.
			this.preload.h = this.matchOrDefault(rev, new RegExp("height=(\\d+%?)", "i"), -1);
			this.preload.onload = this.nextEffect.bind(this);
			this.preload.src = url;
		}else{
			this.preload = {};	// JavaScript native Object
			this.preload.datatype = 'iframe';
			this.preload.w =  this.matchOrDefault(rev, new RegExp("width=(\\d+)", "i"), this.options.defaultIframeWidth);
			this.preload.h = this.matchOrDefault(rev, new RegExp("height=(\\d+)", "i"), this.options.defaultIframeHeight);
			this.preload.src = url;
			this.nextEffect(); //asynchronous loading
		}

		return false;
	},

	nextEffect: function(){
		switch (this.step++){
		case 1:
			this.center.className = '';

			// create HTML element
			if( this.preload.datatype == 'image' ) {
				var ws = (this.preload.w == -1) ? this.preload.width.toString() : this.preload.w.toString();
				var hs = (this.preload.h == -1) ? this.preload.height.toString() : this.preload.h.toString();
				var q;
				this.p_width = ( q = ws.match(/(\d+)%/) ) ? q[1] * this.preload.width * 0.01 : ws;
				this.p_height = ( q = hs.match(/(\d+)%/) ) ? q[1] * this.preload.height * 0.01 : hs;
				new Element('img').setProperties({id: 'lbImage', src:this.preload.src, width:this.p_width, height:this.p_height}).injectInside(this.canvas);
				this.nextLink.style.right = '';
			}else{
				this.p_width = this.preload.w;
				this.p_height = this.preload.h;
				// Safari would not update iframe content that has static id.
				this.iframeId = "lbFrame_"+new Date().getTime();
				new Element('iframe').setProperties({id: this.iframeId, width: this.p_width, height: this.p_height, frameBorder:0, scrolling:this.options.iframeScrolling, src:this.preload.src}).injectInside(this.canvas);
				this.nextLink.style.right = '25px';
			}
			this.canvas.style.width = this.bottom.style.width = this.p_width+'px';
			this.canvas.style.height = this.prevLink.style.height = this.nextLink.style.height = this.p_height+'px';

			this.caption.setHTML(this.items[this.activeItem][1] || '');
			this.number.setHTML( (!this.options.showNumbers || (this.items == 1)) ? '' : this.options.llPage + ' ' + (this.activeItem+1) + ' ' + this.options.llOf + ' ' + this.items.length );

			if (this.activeItem) {
				this.preloadPrev.src = this.items[this.activeItem - 1][0];
			}
			if (this.activeItem != (this.items.length - 1)) {
				this.preloadNext.src = this.items[this.activeItem + 1][0];
			}
			if (this.center.clientHeight != this.canvas.offsetHeight){
				var oh = (this.p_height == this.canvas.clientHeight) ? this.canvas.offsetHeight : eval(this.p_height)+18; // fix for ie
				this.fx.resizeCenter.start({height: oh});
				break;
			}

			this.step++;
		case 2:
			if (this.center.clientWidth != this.canvas.offsetWidth){
				var ow = (this.p_width == this.canvas.clientWidth) ? this.canvas.offsetWidth : eval(this.p_width)+18; // fix for ie
				this.fx.resizeCenter.start({width: ow, marginLeft: -ow/2});
				break;
			}
			this.step++;
		case 3:
			this.bottomContainer.setStyles({top: (this.top + this.center.clientHeight)+'px', height:'0px', marginLeft: this.center.style.marginLeft, width:this.center.style.width, display: ''});
			this.fx.image.start(1);
			break;
		case 4:
			if (this.options.animateCaption){
				// This is not smooth animation in IE 6 with XML prolog.
				// If your site is XHTML strict with XML prolog, disable this option.
				this.fx.bottom.start(0,this.bottom.offsetHeight+10).chain(function(){
				// executes immediately after completion of above effect
					this.sendEcard(1);
				}.bind(this));

				break;
			}
			this.bottomContainer.style.height = (this.bottom.offsetHeight+10)+'px';
		case 5:
			if (this.activeItem){
				this.prevLink.style.display = '';
			}
			if (this.activeItem != (this.items.length - 1)){
				this.nextLink.style.display = '';
			}
			this.step = 0;
		}
	},

	close: function(){
		if (this.step < 0) {
			return;
		}
		this.sendEcard(0);
		this.step = -1;
		this.removeCurrentItem();	// discard content
		for (var f in this.fx) {
			this.fx[f].stop();
		}
		this.center.style.display = this.bottomContainer.style.display = 'none';
		this.fx.overlay.chain(this.setup.pass(false, this)).start(0);
		return false;
	},

	printOrSave: function(mode){
		if (this.options.psScriptPath) {
			var myRef = window.open(this.options.psScriptPath+'?mode='+mode+'&image='+this.items[this.activeItem][0],'printsave', 'left=0,top=0,width='+(parseInt(this.canvas.style.width, 10))+',height='+ (parseInt(this.canvas.style.height, 10)) +',toolbar=0,resizable=1');
			return false; // needed to prevent the calling page to reload
		}
		return true;
	},



	removeCurrentItem: function(){
		if (this.preload){
			if( this.preload.datatype == 'image' ) {
				$('lbImage').remove();
				this.preload.onload = Class.empty;
			}else{
				$(this.iframeId).remove();
			}
			this.preload = null;
		}
	},

	matchOrDefault: function(str, re, val){
		var hasQuery = str.match(re);
		return hasQuery ? hasQuery[1] : val;
	}

};

//window.addEvent('domready', Lightbox.init.bind(Lightbox));