// 初期設定
	var ss_scroll_auto   = 1;           // 1:auto 2:manual
	var ss_scroll_type   = 1;           // 1:side   2:updown    3:fade
	var ss_scroll_speed  = 3500;        // speed
	var ss_scroll_target = 'ss_menu';   // menu_name（class.css）
	var ss_mode_panel    = 2;           // 1:display 2:none   <= panel
	var ss_mode_option   = 2;           // 1:display 2:none   <= option
	var ss_course        = 'left';      // left:right => left   right:left => right 


	start_content        = 1;
	content_amount       = 0;
	content_table        = [];
	link_table           = [];
	bao                  = {};

	content_width        = $E('.magArea_main').getStyle( 'width'  );
	content_height       = $E('.magArea_main').getStyle( 'height' );
	scroll_actually      = false;

// Scroll Config
scroll_config = {
	animation               : [],
	link                    : function(i){
		link_table[i].toggleClass('active');
	},
	content                 : function( num ){
		link_table[start_content].toggleClass('active'); start_content = num;
		scroll_config.link(start_content); start_content = num;
		ef  = new Fx.Scroll($('ss_overflown'),{duration: 1});
		( num !== 1 ) ? ef1 = new Fx.Style(content_table[num-1],'opacity') : ef1 = new Fx.Style(content_table[content_amount-1],'opacity');
		ef2 = new Fx.Style(content_table[num],'opacity');
		ef2.set(0);
		ef1.start(1,0);
		(function(){ef.toElement(content_table[num]);ef2.start(0,1);}).delay(500);
		(function(){ef1.set(1);}).delay(1000);
		scroll_config.link(num);
		link_table[num].toggleClass('active');
	},
	animation_1 : {
		content_display_first : 'block',
		content_display_rest  : 'block',
		content_float         : ss_course,

		next                  : function(){
			if( start_content == content_amount ){
				link_table[start_content].toggleClass('active'); start_content = 1;
				ef  = new Fx.Scroll($('ss_overflown'),{duration: 1});
				ef1 = new Fx.Style(content_table[content_amount],'opacity');
				ef2 = new Fx.Style(content_table[1],'opacity');
				ef2.set(0);
				ef1.start(1,0);
				(function(){ef.toElement(content_table[1]); ef2.start(0,1);}).delay(500);
				(function(){ef1.set(1);}).delay(1000);
				link_table[start_content].toggleClass('active');
			}
			else{
				link_table[start_content].toggleClass('active'); start_content++;
				new Fx.Scroll($('ss_overflown')).toElement(content_table[start_content]);
				link_table[start_content].toggleClass('active');
			}
		},
		prev                 : function(){
			if( start_content == 1 ){
				link_table[start_content].toggleClass('active'); start_content = content_amount;
				new Fx.Scroll($('ss_overflown')).toElement(content_table[content_amount]);
				link_table[start_content].toggleClass('active');
			}
			else{
				link_table[start_content].toggleClass('active'); start_content--;
				new Fx.Scroll($('ss_overflown')).toElement(content_table[start_content]);
				link_table[start_content].toggleClass('active');
			}
		}
	},
	animation_2 : {
		content_display_first : 'block',
		content_display_rest  : 'block',
		content_float         : '',

		next                  : function(){
			if( start_content == content_amount ){
				link_table[start_content].toggleClass('active'); start_content = 1;
				ef  = new Fx.Scroll($('ss_overflown'),{duration: 1});
				ef1 = new Fx.Style(content_table[content_amount],'opacity');
				ef2 = new Fx.Style(content_table[1],'opacity');
				ef2.set(0);
				ef1.start(1,0);
				(function(){ef.toElement(content_table[1]); ef2.start(0,1);}).delay(500);
				(function(){ef1.set(1);}).delay(1000);
				link_table[start_content].toggleClass('active');
			}
			else{
				link_table[start_content].toggleClass('active'); start_content++;
				new Fx.Scroll($('ss_overflown')).toElement(content_table[start_content] );
				link_table[start_content].toggleClass('active');
			}
		},
		prev                  : function(){
			if( start_content == 1 ){
				link_table[start_content].toggleClass('active'); start_content = content_amount;
				new Fx.Scroll($('ss_overflown')).toElement(content_table[content_amount] );
				link_table[start_content].toggleClass('active');
			}
			else{
				link_table[start_content].toggleClass('active'); start_content--;
				new Fx.Scroll($('ss_overflown')).toElement(content_table[start_content] );
				link_table[start_content].toggleClass('active');
			}
		}
	},
	animation_3 : {
		content_display_first : 'block',
		content_display_rest  : 'block',
		content_float         : ss_course,

		next                  : function(){
			if( start_content == content_amount ){
				scroll_config.link(start_content); start_content = 1;
				ef  = new Fx.Scroll($('ss_overflown'),{duration: 1});
				ef1 = new Fx.Style(content_table[content_amount],'opacity');
				ef2 = new Fx.Style(content_table[1],'opacity');
				ef2.set(0);
				ef1.start(1,0);
				(function(){ef.toElement(content_table[1]);ef2.start(0,1);}).delay(500);
				(function(){ef1.set(1);}).delay(1000);
				scroll_config.link(start_content);
			}
			else{
				scroll_config.link(start_content); start_content++;
				ef  = new Fx.Scroll($('ss_overflown'),{duration: 1});
				ef1 = new Fx.Style(content_table[start_content-1],'opacity');
				ef2 = new Fx.Style(content_table[start_content],'opacity');
				ef2.set(0);
				ef1.start(1,0);
				(function(){ef.toElement(content_table[start_content]);ef2.start(0,1);}).delay(500);
				(function(){ef1.set(1);}).delay(1000);
				scroll_config.link(start_content)
			}
		},
		prev                  : function(){
			if( start_content == 1 ){
				scroll_config.link(start_content); start_content = content_amount;
				ef  = new Fx.Scroll($('ss_overflown'),{duration: 1});
				ef1 = new Fx.Style(content_table[1],'opacity');
				ef2 = new Fx.Style(content_table[content_amount],'opacity');
				ef2.set(0);
				ef1.start(1,0);
				(function(){ef.toElement(content_table[content_amount]);ef2.start(0,1);}).delay(500);
				(function(){ef1.set(1);}).delay(1000);
				scroll_config.link(start_content);
			}
			else{
				scroll_config.link(start_content); start_content--;
				ef  = new Fx.Scroll($('ss_overflown'),{duration: 1});
				ef1 = new Fx.Style(content_table[start_content+1],'opacity');
				ef2 = new Fx.Style(content_table[start_content],'opacity');
				ef2.set(0);
				ef1.start(1,0);
				(function(){ef.toElement(content_table[start_content]);ef2.start(0,1);}).delay(500);
				(function(){ef1.set(1);}).delay(1000);
				scroll_config.link(start_content);
			}
		}
	}
}
scroll_config.animation = [scroll_config.animation_1, scroll_config.animation_2, scroll_config.animation_3];

// Initialize function
window.addEvent("load",function(){
	$E('.ss_options').setStyle('display','none');

	// generating base animation object
	bao = scroll_config.animation[ ss_scroll_type - 1 ];

	// prepare
	ss_prepare( bao.content_display_first, bao.content_display_rest, bao.content_float );

	// menu
	document.getElementsBySelector('.' + ss_scroll_target).each( function( element, index ){
		link_table[index+1] = element;
		link_table[index+1].addEvent( 'mouseover', function( event ){
			var event = new Event(event);
			event.preventDefault();
		});
		link_table[index+1].addEvent('mouseover', function(){
			scroll_config.content(index+1);
			pause();
		});
	});

	// panel
	code1 = '';
/*
	if(ss_mode_panel == 1){
		code1 += '<img src="' + images_path + 'btn_panel_previous.gif" alt="&laquo;" class="btn_panel_previous" /> <img src="' + images_path + 'btn_panel_next.gif" alt="&raquo;" class="btn_panel_next" /> <img src="' + images_path + 'btn_panel_play.gif" alt="play" class="btn_panel_play" /><img src="' + images_path + 'btn_panel_pause.gif" alt="pause" class="btn_panel_pause" /> ';
	}
	if(ss_mode_option == 1){
		code1 += '<img src="' + images_path + 'btn_option0.gif" alt="option" class="btn_option0" />';
	}
*/
	if(code1){
		$E('.ss_panel').setHTML(code1);
	}else{
		$E('.ss_panel').setStyle( 'display', 'none' );
	}
	if(ss_mode_panel == 1){
		$E('.btn_panel_next'    ).addEvent( 'click', function(){ bao.next(); pause(); });
		$E('.btn_panel_previous').addEvent( 'click', function(){ bao.prev(); pause(); });
		$E('.btn_panel_play'    ).addEvent( 'click', function(){ play();              });
		$E('.btn_panel_pause'   ).addEvent( 'click', function(){ pause();             });
	}
	if(ss_mode_option == 1){
		$E('.btn_option0'       ).addEvent( 'click', function(){ option();            });
	}

	// auto scroll
	if( ss_scroll_auto == 1 ){
		ss_timer = ( function(){ bao.next(); } ).periodical( ss_scroll_speed );
		if( ss_mode_panel == 1 ){
			$E('.btn_panel_play').setStyle( 'display', 'none' );
		}
		scroll_actually = true;
	}
	else{
		if( ss_mode_panel == 1 ){
			$E('.btn_panel_pause').setStyle( 'display', 'none' );
		}
		scroll_actually = false;
	}

	code2 = ' &nbsp; 表示パターン : ';
	for( i = 0; i < scroll_config.animation.length; i++ ){
		var baoo  = scroll_config.animation[i];
		code2    += '<img src="' + baoo.icon + '" class="btn_option0" alt="' + i + '" /> ';
	}
	$E('.ss_options').setHTML(code2);

	$$('.ss_options img').each(function( element ){
		var src = element.src;
		element.addEvent( 'mouseover',function(){ element.src = src.substr(0, ((src.length) -1) -3) + '-h.gif';});
		element.addEvent( 'mouseout', function(){ element.src = src.substr(0, ((src.length) -1) -3) + '.gif';  });
	});
	$$('.ss_panel img').each(function( element ){
		var src = element.src;
		element.addEvent( 'mouseover',function(){ element.src = src.substr(0, ((src.length) -1) -3) + '-h.gif';});
		element.addEvent( 'mouseout', function(){ element.src = src.substr(0, ((src.length) -1) -3) + '.gif';  });
	});
	$$('.ss_options img.btn_option0').each(function( element, index ){
		element.addEvent('click', function(){
			fcs_scroll = index;
			bao        = scroll_config.animation[index];
			ss_prepare( bao.content_display_first, bao.content_display_rest, bao.content_float );
			eff        = new Fx.Scroll($('ss_overflown'), {duration: 0} );
			eff.toElement( content_table[start_content] );
		});
	});
	link_table[start_content].toggleClass('active');
	$E('.magArea_main2').setStyle( 'width', content_amount * content_width.toInt() + 'px' );
});

function play(){
	if(scroll_actually === false){
		ss_timer        = ( function(){ bao.next(); }).periodical( ss_scroll_speed );
		scroll_actually = true;
		if(ss_mode_panel == 1) { 
			$E('.btn_panel_pause').setStyle( 'display', 'inline' );
			$E('.btn_panel_play' ).setStyle( 'display', 'none'   );
		}
	}
}

function pause(){
	$clear( ss_timer );
	scroll_actually = false;
	if(ss_mode_panel == 1) { 
		$E('.btn_panel_play' ).setStyle( 'display', 'inline' );
		$E('.btn_panel_pause').setStyle( 'display', 'none'   );
	}
}

function option(){
	var e1 = new Fx.Style( $E('.ss_options'), 'opacity' );
	if( $E('.ss_options').getStyle('display') == 'none' ){
		$E('.ss_options').setStyle( 'display', 'inline' );
		e1.set(0);
		e1.start(0,1);
	}
	else{
		e1.start(1,0);
		( function(){ $E('.ss_options').setStyle( 'display', 'none' ); }).delay(500);
	}
}

function ss_prepare( ssp_first, ssp_rest, ssp_float ){
	content_amount = 0;
	document.getElementsBySelector('.magArea').each(function(element){
		// set display
		if( content_amount == 0 ){
			content_table[content_amount+1] = element;
			element.setStyle( 'display', ssp_first );
		}
		else{
			content_table[content_amount+1] = element;
			element.setStyle( 'display', ssp_rest );
		}
		// set float
		element.setStyle( 'float', ssp_float );
		// count up
		content_amount++;
	});
}