﻿/**
 * Copyright(c) 2010- Japan Electronic Industrial Arts.co.ltd. All Rights Reserved.
 * http://www.jeia.co.jp/
 * 
 * scrollarea for EC-CUBE
 * coetoiro
 * http://www.coetoiro.jp/
 * 
 * @author	Japan Electronic Industrial Arts Co. Ltd.
 * @version	jQueryRevision: 1.00 2011/05/05 jQuery
 * @use		Using jquery.js.
 */

/*-------------------------------------------------------------
 * ScrollArea Class
 */
function ScrollArea( _list, _prev, _next ) {
	this.s_list = ( typeof _list != 'undefined' ) ? _list : '';
	this.s_prev = ( typeof _prev != 'undefined' ) ? _prev : '';
	this.s_next = ( typeof _next != 'undefined' ) ? _next : '';
	this.$list = null;
	this.$scroll = null;
	this.$prev = null;
	this.$next = null;
	this.winReady = false;
	this.animating = false;
	this.pos = 0;
	this.view = 0;
	this.showcase = [];
	this.timers = [];
	
	var o = this;
	$(window).one( 'load', function() {
		o.winReady = true;
	});
	
	return this;
}

ScrollArea.prototype.showSpan = 250;
ScrollArea.prototype.fadeTime = 400;


/**
 * init
 */
ScrollArea.prototype.init = function() {
	this.$list = jQuery( this.s_list );
	this.$prev = jQuery( this.s_prev );
	this.$next = jQuery( this.s_next );
	
	this.$scroll = this.$list.children( '.scroll' ).eq(0);
	
	if ( ! this.s_list.length || ! this.$list.length
	|| ! this.s_prev.length || ! this.$prev.length
	|| ! this.s_next.length || ! this.$next.length
	|| ! this.$scroll.length ) {
		return;
	}
	
	var o = this;
	
	this.$scroll.css({
		'position': 'relative'
	}).children().each( function() {
		jQuery(this).css({
			'position': 'absolute'
		}).hide();
	});
	
	this.waitImages();
};

/**
 * waitImages
 */
ScrollArea.prototype.waitImages = function() {
	var complete = true;
	var o = this;
	
	this.$scroll.find( 'img' ).each( function() {
		if ( ! this.complete ) {
			complete = false;
		}
	});
	
	if ( ! this.winReady ) {
		complete = false;
	}
	
	if ( complete ) {
		this.start();
	}
	else {
		setTimeout( function() {
			o.waitImages();
		}, 100 );
	}
};

/**
 * start
 */
ScrollArea.prototype.start = function() {
	var o = this;
	
	jQuery(window).bind( 'resize', function( _e ) {
		o.resize();
		return false;
	});
	
	this.resize();
};

/**
 * resize
 */
ScrollArea.prototype.resize = function() {
	this.cancelAll();
	
	this.pos = 0;
	
	var left = 0;
	var max = this.$list.width();
	var i = this.pos;
	var $items = this.$scroll.children().hide();
	var $item;
	
	this.showcase = new Array();
	
	while ( $item = $items.eq( i ++ ) ) {
		left +=
			$item.width() +
			parseInt( $item.css( 'marginLeft' ), 10 ) +
			parseInt( $item.css( 'borderLeftWidth' ), 10 );
		
		if ( left < max ) {
			this.showcase.push(
				$item.css({
					'left': ( left - $item.width() ) + 'px'
				})
			);
			left +=
				parseInt( $item.css( 'marginRight' ), 10 ) +
				parseInt( $item.css( 'borderRightWidth' ), 10 );
		}
		else {
			break;
		}
	}
	
	this.view = this.showcase.length;
	
	var o = this;
	
	if ( this.showcase.length < $items.length ) {
		this.$prev.find('a').css({
			'opacity': 1,
			'cursor': 'pointer'
		}).unbind( 'click' ).bind( 'click', function( _e ) {
			return o.onClickPrev( this, _e );
		}).attr( 'title', '前の商品を見る' );
		
		this.$next.find('a').css({
			'opacity': 1,
			'cursor': 'pointer'
		}).unbind( 'click' ).bind( 'click', function( _e ) {
			return o.onClickNext( this, _e );
		}).attr( 'title', '次の商品を見る' );
	}
	else {
		this.$prev.find('a').css({
			'opacity': 0.5,
			'cursor': 'default'
		}).unbind( 'click' ).
		attr( 'title', '' );
		
		this.$next.find('a').css({
			'opacity': 0.5,
			'cursor': 'default'
		}).unbind( 'click' ).
		attr( 'title', '' );
	}
	
	this.show();
};

/**
 * onClickPrev
 */
ScrollArea.prototype.onClickPrev = function( _target, _e ) {
	this.cancelAll();
	
	this.pos -= this.view;
	
	var left = 0;
	var $items = this.$scroll.children().hide();
	var $item;
	
	if ( this.pos < 0 ) {
		this.pos = $items.length - $items.length % this.view;
	}
	
	this.showcase = new Array();
	
	for ( i = 0; i < this.view; i ++ ) {
		$item = $items.eq( this.pos + i );
		
		left +=
			$item.width() +
			parseInt( $item.css( 'marginLeft' ), 10 ) +
			parseInt( $item.css( 'borderLeftWidth' ), 10 );
		
		this.showcase.push(
			$item.css({
				'left': ( left - $item.width() ) + 'px'
			})
		);
		left +=
			parseInt( $item.css( 'marginRight' ), 10 ) +
			parseInt( $item.css( 'borderRightWidth' ), 10 );
	}
	
	this.show();
	
	return false;
};

/**
 * onClickNext
 */
ScrollArea.prototype.onClickNext = function( _target, _e ) {
	this.cancelAll();
	
	this.pos += this.view;
	
	var left = 0;
	var $items = this.$scroll.children().hide();
	var $item;
	
	if ( this.pos >= $items.length ) {
		this.pos = 0;
	}
	
	this.showcase = new Array();
	
	for ( i = 0; i < this.view; i ++ ) {
		$item = $items.eq( this.pos + i );
		
		left +=
			$item.width() +
			parseInt( $item.css( 'marginLeft' ), 10 ) +
			parseInt( $item.css( 'borderLeftWidth' ), 10 );
		
		this.showcase.push(
			$item.css({
				'left': ( left - $item.width() ) + 'px'
			})
		);
		left +=
			parseInt( $item.css( 'marginRight' ), 10 ) +
			parseInt( $item.css( 'borderRightWidth' ), 10 );
	}
	
	this.show();
	
	return false;
};

/**
 * cancelAll
 */
ScrollArea.prototype.cancelAll = function() {
	var i, len = this.timers.length;
	
	for ( i = 0; i < len; i ++ ) {
		clearTimeout( this.timers[ i ] );
	}
	this.timers = new Array();
	
	len = this.showcase.length;
	
	for ( i = 0; i < len; i ++ ) {
		this.showcase[ i ].stop();
	}
};

/**
 * show
 */
ScrollArea.prototype.show = function( _num ) {
	var num = ( typeof _num != 'undefined' ) ? _num : 0;
	var $item = this.showcase[ num ];
	var o = this;
	
	if ( $item ) {
		this.timers.push( 
			setTimeout( function() {
				$item.stop().fadeIn( o.fadeTime, function() {
					jQuery(this).css({
						'opacity': 1
					});
				} );
			}, this.showSpan * num )
		);
		this.show( num + 1 );
	}
};



