(function($) {

    $.fn.claroslider = function(method) {

				var clarosliderState = {};

        var methods = {

            init : function(options) {
                this.claroslider.settings = $.extend({}, this.claroslider.defaults, options);

								return this.each(function() {
                    var $el = $(this), el = this;      
										
										// Slider initialisieren
										sliderState = {
												slider: $el,
												viewport: $('.window'),
												slides: $('.frame',$el),
												current: -1
										};
										helpers.setState(sliderState)

										// Run Slider
										methods.preLoadWaiter();
										
								});

            },

						preLoadWaiter: function() {
							helpers.log('Preload-Check');
							helpers.getState().slides.each(function(){ loaded = helpers.getSlide(this).image.complete; });
							if (loaded) {
								helpers.log('Preload-Check: all images are loaded');
								methods.onLoaded();
								return;
							} 
							// preLoadWaiter erneut in 100 Msec aufrufen
							setTimeout(function(){methods.preLoadWaiter();},100);
						},

            onLoaded: function(options) {
							// Store image sizes for resizing
							sliderState = helpers.getState();
							
							sliderState.slides.each(function(){ 
								slide = helpers.getSlide(this);
								slide.$frame.show();

								// Calculate Minimal-Ratio 
								ratio = Math.max(
									 sliderState.viewport.width() / slide.image.width,
									 sliderState.viewport.height() / slide.image.height
								);

								slide.$image.data('originalCss', {
										width: slide.image.width, 
										heigth: slide.image.height,
										ratio: ratio
								});
								
								slide.$frame.hide();
							});
							methods.next();
						},
						
						next: function() {
							sliderState = helpers.getState();
							sliderState.current = ++sliderState.current % sliderState.slides.length;
							helpers.setState(sliderState);
							helpers.log('Current slide '+ sliderState.current);
							sliderState.slider.claroslider('run');
						},

            run: function() {
							
							slide = helpers.getCurrentSlide();
							helpers.log(slide);
							helpers.fadeIn(slide.$h1);
							helpers.fadeIn(slide.$h2);
							helpers.movePicture(slide);
							helpers.fadeOut(slide.$h1);
							helpers.fadeOut(slide.$h2);

						},


        }


        var helpers = {

				log: function(msg) {
							//if (console) console.log(msg);
						},

						getSlide: function(el) {
							var $el = $(el);
							var name = $el.attr('id');
							return {
								$h1: $('#'+name+'-headline'),
							  $h2: $('#'+name+'-subheadline'),
								$image: $('img',$el),
								image: $('img',$el)[0],
								$frame: $el,
							}
						},

						getCurrentSlide: function() {
							return helpers.getSlide(helpers.getState().slides[helpers.getState().current]);
						},
						
						getState: function() {
							return $(document).data('claroSliderState');
						},

						setState: function(data) {
							$(document).data('claroSliderState',data);
						},

            fadeIn: function (el) {
            	el.fadeIn(el.claroslider.settings.textFadein);
						},
            fadeOut: function (el) {
            	el.delay(el.claroslider.settings.textDuration).fadeOut(el.claroslider.settings.textFadeout);
            },

            movePicture: function (slide) {
							
							settings = slide.$image.claroslider.settings;
							// Reset original image-sizes
							sizes = slide.$image.data('originalCss');
							slide.$image.css({
            		width: sizes.width*1.2+'px',
//            		height: sizes.height*1.2+'px'
            	});
							helpers.log (sizes.ratio);
							// Animations
							slide
								.$image
									.animate({
											width: sizes.width * sizes.ratio + 'px',
//											height: sizes.height + 'px',
										}, 
										settings.imgAnimateDuration,
										'linear'
										
									 );

							slide
								.$frame
									.fadeIn(settings.imgFadein)
									.delay(settings.imgDuration)
									.fadeOut(
											settings.imgFadeout,
											function() {methods.next();}
										);							
            }
            
        }

        if (methods[method]) {
            return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
        } else if (typeof method === 'object' || !method) {
            return methods.init.apply(this, arguments);
        } else {
            $.error( 'Method "' +  method + '" does not exist in claroslider plugin!');
        }

    }

    $.fn.claroslider.defaults = {
        textFadein: 1000,
        textDuration: 8000,
        textFadeout: 1000,
				imgFadein: 1000,
				imgDuration: 8000,
				imgFadeout: 1000,
				imgAnimateDuration: 10000,
		}

    $.fn.claroslider.settings = {}

})(jQuery);


$(document).ready(function() {
	
	$('.slider').claroslider('init');
	
});