var FF_CAROUSELPANEL_SELECTERS = ['A01'];

if (!window.fujifilm){ var fujifilm = {}; }

(function(fujifilm){
	var $ = jQuery;
	/*
	 * FFCarouselPanel
	 */
	fujifilm.CarouselPanel = FFCarouselPanel;
	function FFCarouselPanel( jQueryObj, id ){
		this._body = jQueryObj;
		this._id = id;
	}

	FFCarouselPanel.prototype = {
		_page : 1,
		_isTween : false,
		_dispUnitsNum: 5,
		_tweenTime : 300,
		_isActive: false,
		
		/*
		 * 
		 */
		setUp: function(){
			this._viewPort = this._body.find('div.carouselViewPort').eq(0);
			this._unitGroup = this._viewPort.find('div.carouselUnitGroup').eq(0);
			this._units = this._unitGroup.find('div.carouselUnit' + this._id);

			if ( !this._units.length || !this._unitGroup.length || !this._units.length ) return;

			var viewPostParetWidth = this._viewPort.parent().width();
			this._scrollWidth = viewPostParetWidth - 20;
			
			if (this._body.width() < 900) {
				this._dispUnitsNum = 4;
				this._scrollWidth = viewPostParetWidth - 15;
			}

			this._pageMax = Math.ceil(this._units.length / this._dispUnitsNum);
			
			if ( this._units.length > this._dispUnitsNum ) {
				this._isActive = true;
				if ( !this._body.find('.categoryTitleA01').length ) {
					$('div.bgImageUnit', this._body).css({
						'padding-top': '31px',
						'padding-bottom': '20px'
					})
				}
				this._viewPort
					.width(this._scrollWidth)
					.css({
						'overflow' : 'hidden'
					});
				this._unitGroup.width(10000000);
				var switchPanel = this._switchPanel = new fujifilm.CarouselPanelSwitchBlock( this );
				switchPanel.setUp(this._viewPort, this._pageMax);
				switchPanel.update(this._page);
				
				var indicator = this._indicator = new fujifilm.CarouselPosIndicator(this, this._pageMax);
				indicator.update(this._page);
				
				if( $.browser.msie ) {
					this._tweenTime = 500;
				}
			}
			
		},
		
		/*
		 * 
		 */
		slide: function ( toPage ) {
			toPage = Math.min(toPage, this._pageMax);
			toPage = Math.max(toPage, 0);
			if ( toPage > this._page ) this.slideRight(toPage-this._page);
			else this.slideLeft(this._page - toPage);
		},
		
		/*
		 * 
		 */
		slideRight: function( n ){
			if ( this._isTween ) return;
			
			if ( !n ) n = 1;
			var self = this;
			this._isTween = true;
			
			var toLeft = this._scrollWidth * n;
			this._unitGroup.animate( {
				left : "-=" + toLeft + 'px'
			}, this._tweenTime, "swing", function(){
				self._isTween = false;
			} );

			this._page = this._page + n;
			this._switchPanel.update(this._page);
			this._indicator.update(this._page);
		},
		
		/*
		 * 
		 */
		slideLeft: function( n ){
			if ( this._isTween ) return;
			
			if ( !n ) n = 1;
			var self = this;
			this._isTween = true;
			
			var toLeft = this._scrollWidth * n;
			
			this._unitGroup.animate( {
				left : "+="+toLeft + 'px'
			}, this._tweenTime, "swing", function(){
				self._isTween = false;
			} );
			this._page = this._page - n;
			this._switchPanel.update(this._page);
			this._indicator.update(this._page);
		}
	};

	/*
	 * FFCarouselPanelSwitchBlock
	 */
	fujifilm.CarouselPanelSwitchBlock = FFCarouselPanelSwitchBlock;
	function FFCarouselPanelSwitchBlock( parentObj ){
		this._parent = parentObj;
	}

	FFCarouselPanelSwitchBlock.prototype = {
		/*
		 * 
		 */
		setUp: function( previousObj, pageMax ){
			this._panel = $('<div />').addClass('itemSwitch').append('<ul />');
			this._nextBtn = new fujifilm.CarouselPanelSwitchNextBtn();
			this._prevBtn = new fujifilm.CarouselPanelSwitchPrevBtn();
			this._pageMax = pageMax;
			
			$('<li />').append(this._prevBtn.getContent()).appendTo($('ul',this._panel) );
			$('<li />').append(this._nextBtn.getContent()).appendTo($('ul',this._panel) );
			this._panel.insertBefore(previousObj);

			this._nextBtn.bindOnClick("slideRight", this._parent);
			this._prevBtn.bindOnClick("slideLeft", this._parent);
		},
		
		/*
		 * 
		 */
		update: function ( curPage ) {
			if (curPage == 1) {
				this._nextBtn.unSetStay();
				this._prevBtn.setStay();
			}
			else if (curPage == this._pageMax) {
				this._nextBtn.setStay();
				this._prevBtn.unSetStay();
			}
			else {
				this._nextBtn.unSetStay();
				this._prevBtn.unSetStay();
			}
		}
	};

	/*
	 * FFCarouselPanelSwitchBtn
	 */
	fujifilm.CarouselPanelSwitchBtn = FFCarouselPanelSwitchBtn;
	function FFCarouselPanelSwitchBtn(){

	}

	FFCarouselPanelSwitchBtn.prototype = {
		_content: null,
		_btnEnable: true,

		_init: function(){
			var self = this;
			this._content.click(function(){
				return self._clickFunc();
			});
			this._content.hover(function(){
				self._onRollOver();
			}, function(){
				self._onRollOut();
			});
		},
		
		
		bindOnClick: function ( func, thisObj ) {
			this.onClick = function(){
				thisObj[func]();
			};
		},

		_clickFunc: function ()  {
			if ( !this._btnEnable ) return;
			if ( this.onClick ) this.onClick();
			return false;
		},

		_onRollOver: function () {
			if ( !this._btnEnable ) return;
			var $img = this._content.find('img');
			var set = $img.attr('src').replace('_01.gif', '_01_o.gif');
			$img.attr('src', set);
		},

		_onRollOut: function () {
			if ( !this._btnEnable ) return;
			this._setNormalImg();
		},

		setStay: function () {
			if (!this._btnEnable) return;
			this._btnEnable = false;
			this._setNormalImg();
			this._unSetBtnFuncs();
			this._content.fadeTo(100, 0.5 );
		},

		unSetStay: function () {
			if (this._btnEnable) return;
			this._btnEnable = true;
			this._setBtnFuncs();
			this._content.fadeTo(100, 1 );
		},

		_setBtnFuncs : function () {
			if ( !this._content || !this._btnEnable) return;
			if ( !$('a', this._content).length ) this._content.find('img').wrap('<a href="#"></a>');
		},

		_unSetBtnFuncs : function () {
			if ( !this._content ) return;
			if ( $('a', this._content).length ) this._content.find('a').replaceWith($('a', this._content).html());
		},
		
		_setNormalImg: function () {
			var $img = this._content.find('img')
			var set = $img.attr('src').replace('_01_o.gif', '_01.gif');
			$img.attr('src',set);
		},

		getContent: function(){
			return this._content;
		}
	};

	/*
	 * FFCarouselPanelSwitchNextBtn
	 */
	fujifilm.CarouselPanelSwitchNextBtn = FFCarouselPanelSwitchNextBtn;
	function FFCarouselPanelSwitchNextBtn () {
		this._content = $('<span />').html('<a href="#"><img src="/img/shared/carouselpanel/carousel_btn_next_01.gif" alt="to next" width="21" height="19" /></a>');
		this._init();
	}
	FFCarouselPanelSwitchNextBtn.prototype = new fujifilm.CarouselPanelSwitchBtn();

	/*
	 * FFCarouselPanelSwitchPrevBtn
	 */
	fujifilm.CarouselPanelSwitchPrevBtn = FFCarouselPanelSwitchPrevBtn;
	function FFCarouselPanelSwitchPrevBtn () {
		this._content = $('<span />').html('<a href="#"><img src="/img/shared/carouselpanel/carousel_btn_prev_01.gif" alt="to back" width="21" height="19" /></a>');
		this._init();
	}
	FFCarouselPanelSwitchPrevBtn.prototype = new fujifilm.CarouselPanelSwitchBtn();



	/*
	 * FFCarouselPosIndicator
	 */
	fujifilm.CarouselPosIndicator = FFCarouselPosIndicator;
	function FFCarouselPosIndicator ( parentObj, pageMax ) {
		this._parent = parentObj;
		this._pageMax = pageMax;
		this._init(parentObj._body);
	}

	FFCarouselPosIndicator.prototype = {
		_init : function ( appendObj ) {
			this._body = $('<div />').addClass('posIndicator');
			var icn = $('<span />').addClass('icn').html('<a href="#"><img src="/img/shared/carouselpanel/icon_position_01.gif" alt="" width="12" height="12" /></a>');
			
			var parent = this._parent;
			for (var i = 0; i < this._pageMax; i++) {
				var tmp = icn.clone();
				this._body.append(tmp);
				tmp.attr('page', i+1);
				tmp.click(function(){
					if ( $(this).find('img').attr('src').indexOf('_s.gif') > 0 ) return;
					parent["slide"]($(this).attr('page'));
					return false;
				});
				tmp.hover(function(){
					var aImg = $(this).find('a img');
					if ( !aImg.length ) return;
					var src = aImg.attr('src').replace(/_01\.gif/, '_01_o.gif');
					aImg.attr('src',src);
				},function(){
					var aImg = $(this).find('a img');
					if ( !aImg.length ) return;
					var src = aImg.attr('src').replace(/_01_o\.gif/, '_01.gif');
					aImg.attr('src', src)
				});
			}
			
			appendObj.append(this._body);
			
			x = ( appendObj.width() - this._body.width() ) / 2;
			this._body.css('left', x+'px');
		},
		
		update: function( curPage ){
			curPage = Math.max(curPage, 1);
			curPage = Math.min(curPage,this._pageMax);
			
			var pre = this._body.find( 'span.icn img[src*=icon_position_01_s.gif]' );
			if ( pre.length ) {
				var preChSrc = pre.attr('src').replace(/_01_s\.gif/, '_01.gif');
				pre.attr('src', preChSrc);
				pre.wrap('<a href=""></a>');
			}

			var target = this._body.find( 'span.icn img' ).eq(parseInt(curPage-1));
			var chSrc = target.attr('src').replace(/_01(_o){0,1}\.gif/, '_01_s.gif');
			target.attr('src', chSrc);
			
			target.parent().replaceWith( target.parent().html() );
		}
	};
})(fujifilm);

if (typeof jQuery == "function") {
	jQuery(function($){
		var carouselIsExist = false;
		for (var i = 0; i < FF_CAROUSELPANEL_SELECTERS.length; i++) {
			var targetClass = "div.carouselPanel" + FF_CAROUSELPANEL_SELECTERS[i];
			$(targetClass).each(function(){
				var cp = new fujifilm.CarouselPanel( $(this), FF_CAROUSELPANEL_SELECTERS[i] );
				cp.setUp();
				if ( cp._isActive ) carouselIsExist = true;
			});
		}
		if ( carouselIsExist ) {
			(new Image()).src = '/img/shared/carouselpanel/icon_position_01_s.gif';
			(new Image()).src = '/img/shared/carouselpanel/icon_position_01_o.gif';
			(new Image()).src = '/img/shared/carouselpanel/carousel_btn_next_01_o.gif';
			(new Image()).src = '/img/shared/carouselpanel/carousel_btn_prev_01_o.gif';
		}
	});
}