function CollectionViewer( stage, thumbs, overImgs, viewImgs, sceneObj, thumbBtnObj, thumbBtnSrc, viewerBtnObj, viewerBtnSrc, textSelectorObj, baseDir ) {

	this.stage    = stage;
	this.thumbs   = thumbs;
	this.overImgs = overImgs;
	this.viewImgs = viewImgs;
	this.sceneObj = sceneObj;
	this.thumbBtnObj  = thumbBtnObj;
	this.thumbBtnSrc  = thumbBtnSrc;
	this.viewerBtnObj = viewerBtnObj;
	this.viewerBtnSrc = viewerBtnSrc;
	this.currentScene = null;
	this.textSelectorObj = textSelectorObj;
	this.baseDir = baseDir;
	this.textSelector = new Array( );
	this.sceneNum = this.sceneObj.length;
	this.ISS = new ImageSlideShow( this.stage, this.thumbs, this.overImgs, this.viewImgs, null, this.baseDir );
	this.thumbButton  = new RollOverItems( this.thumbBtnObj, this.thumbBtnSrc, this.baseDir );
	this.viewerButton = new RollOverItems( this.viewerBtnObj, this.viewerBtnSrc, this.baseDir );
	var myCVObj = this;

	this.thumbButton.getItem( 0 ).onclick = function( ) {
		myCVObj.prevScene( );
		myCVObj.setSceneImage( );
	};
	this.thumbButton.getItem( 1 ).onclick = function( ) {
		myCVObj.nextScene( );
		myCVObj.setSceneImage( );
	};
	this.viewerButton.getItem( 0 ).onclick = function( ) {
		myCVObj.prevImage( );
	};
	this.viewerButton.getItem( 1 ).onclick = function( ) {
		myCVObj.nextImage( );
	};

	for( var i = 0; i < this.sceneNum; i++ ) {
		this.textSelector[ i ] = document.getElementById( this.textSelectorObj[ i ] );
		this.textSelector[ i ].myID = i;

		this.textSelector[ i ].onmouseover = function( ) {
			if( this.myID != myCVObj.currentScene ) this.style.backgroundColor = '#CCC';
		};

		this.textSelector[ i ].onmouseout = function( ) {
			if( this.myID != myCVObj.currentScene ) this.style.backgroundColor = 'transparent';
		};

		this.textSelector[ i ].onclick = function( ) {
			myCVObj.textSwapScene( this.myID );
		};
	};
}

CollectionViewer.prototype.prevScene = function( ) {
	this.currentScene--;
	if( this.currentScene < 0 ) {
		this.currentScene = this.sceneNum - 1;
	}
	this.swapScene( this.currentScene );
	this.clearTextSwap( );
};

CollectionViewer.prototype.nextScene = function( ) {
	this.currentScene++;
	if( this.currentScene >= this.sceneNum ) {
		this.currentScene = 0;
	}
	this.swapScene( this.currentScene );
	this.clearTextSwap( );
};

CollectionViewer.prototype.swapScene = function( sceneID ) {
	for( var i = 0; i < this.sceneNum; i++ ) {
		document.getElementById( this.sceneObj[ i ] ).style.display = ( i == sceneID ? 'block' : 'none' );
	}
};

CollectionViewer.prototype.setSceneImage = function( ) {
	var showImg = this.currentScene * ( this.ISS.getMaxImage( ) / this.sceneNum );
	this.ISS.setCurrentImage( showImg );
};

CollectionViewer.prototype.prevImage = function( ) {
	var nowImgID  = this.ISS.getCurrentImage( );
	var maxImgID  = this.ISS.getMaxImage( ) - 1;
	var nextImgID = ( nowImgID <= 0 ) ? maxImgID : nowImgID - 1;
	this.ISS.setCurrentImage( nextImgID );

	if( nextImgID % 5 == 4 ) this.prevScene( );
};

CollectionViewer.prototype.nextImage = function( ) {
	var nowImgID  = this.ISS.getCurrentImage( );
	var maxImgID  = this.ISS.getMaxImage( ) - 1;
	var nextImgID = ( nowImgID >= maxImgID ) ? 0 : nowImgID + 1;
	this.ISS.setCurrentImage( nextImgID );

	if( nextImgID % 5 == 0 ) this.nextScene( );
};

CollectionViewer.prototype.textSwapScene = function( myID ) {
	this.currentScene = myID;
	this.swapScene( myID );
	this.setSceneImage( );
	this.clearTextSwap( );
};

CollectionViewer.prototype.clearTextSwap = function( ) {
	for( var k = 0; k < this.sceneNum; k++ ) {
		this.textSelector[ k ].style.color = ( this.currentScene != k ) ? '#999' : '#000';
		this.textSelector[ k ].style.backgroundColor = ( this.currentScene != k ) ? 'transparent' : '#CCC';
	}
};

CollectionViewer.prototype.clearTextSwap = function( tgtID ) {
	for( var k = 0; k < this.sceneNum; k++ ) {
		this.textSelector[ k ].style.color = ( this.currentScene != k ) ? '#999' : '#000';
		this.textSelector[ k ].style.backgroundColor = ( this.currentScene != k ) ? 'transparent' : '#CCC';
	}
};

CollectionViewer.prototype.init = function( ) {

	for( var i = 0; i < SCRIPTABLESTYLE.length; i++ ) {
		classes = String(document.getElementById(SCRIPTABLESTYLE[ i ]).className);
		if(classes.indexOf('script-disabled') != -1) {
			newClasses = classes.replace(/script\-disabled/, 'script-enabled');
		}
		else {
			newClasses = classes + (classes.length != 0 ? ' ' : '') + 'script-enabled';
		}
		document.getElementById(SCRIPTABLESTYLE[ i ]).className = newClasses;
	}
	for( var i = 1; i < this.sceneNum; i++ ) {
		document.getElementById( this.sceneObj[ i ] ).style.display = 'none';
	}
	this.currentScene = 0;
	this.setSceneImage( );
	this.clearTextSwap( );

};





var CL_THUMBS  = new Array(
"CL0101", "CL0102", "CL0103", "CL0104", "CL0105",
"CL0201", "CL0202", "CL0203", "CL0204", "CL0205",
"CL0301", "CL0302", "CL0303", "CL0304", "CL0305",
"CL0401", "CL0402", "CL0403", "CL0404", "CL0405",
"CL0501", "CL0502", "CL0503", "CL0504", "CL0505" );

var CL_OVRIMGS = new Array(
"images/thumb/sc01_01_thumb_ovr.gif",
"images/thumb/sc01_02_thumb_ovr.gif",
"images/thumb/sc01_03_thumb_ovr.gif",
"images/thumb/sc01_04_thumb_ovr.gif",
"images/thumb/sc01_05_thumb_ovr.gif",
"images/thumb/sc02_01_thumb_ovr.gif",
"images/thumb/sc02_02_thumb_ovr.gif",
"images/thumb/sc02_03_thumb_ovr.gif",
"images/thumb/sc02_04_thumb_ovr.gif",
"images/thumb/sc02_05_thumb_ovr.gif",
"images/thumb/sc03_01_thumb_ovr.gif",
"images/thumb/sc03_02_thumb_ovr.gif",
"images/thumb/sc03_03_thumb_ovr.gif",
"images/thumb/sc03_04_thumb_ovr.gif",
"images/thumb/sc03_05_thumb_ovr.gif",
"images/thumb/sc04_01_thumb_ovr.gif",
"images/thumb/sc04_02_thumb_ovr.gif",
"images/thumb/sc04_03_thumb_ovr.gif",
"images/thumb/sc04_04_thumb_ovr.gif",
"images/thumb/sc04_05_thumb_ovr.gif",
"images/thumb/sc05_01_thumb_ovr.gif",
"images/thumb/sc05_02_thumb_ovr.gif",
"images/thumb/sc05_03_thumb_ovr.gif",
"images/thumb/sc05_04_thumb_ovr.gif",
"images/thumb/sc05_05_thumb_ovr.gif" );

var CL_VIWIMGS = new Array(
"images/large/sc01_01.jpg",
"images/large/sc01_02.jpg",
"images/large/sc01_03.jpg",
"images/large/sc01_04.jpg",
"images/large/sc01_05.jpg",
"images/large/sc02_01.jpg",
"images/large/sc02_02.jpg",
"images/large/sc02_03.jpg",
"images/large/sc02_04.jpg",
"images/large/sc02_05.jpg",
"images/large/sc03_01.jpg",
"images/large/sc03_02.jpg",
"images/large/sc03_03.jpg",
"images/large/sc03_04.jpg",
"images/large/sc03_05.jpg",
"images/large/sc04_01.jpg",
"images/large/sc04_02.jpg",
"images/large/sc04_03.jpg",
"images/large/sc04_04.jpg",
"images/large/sc04_05.jpg",
"images/large/sc05_01.jpg",
"images/large/sc05_02.jpg",
"images/large/sc05_03.jpg",
"images/large/sc05_04.jpg",
"images/large/sc05_05.jpg" );

var CL_SCENES = new Array(
"collection-thumb01",
"collection-thumb02",
"collection-thumb03",
"collection-thumb04",
"collection-thumb05" );

var CL_THUMBTN_OBJ = new Array( "THUMBBACK", "THUMBNEXT" );
var CL_THUMBTN_SRC = new Array( "images/thumb_back_ovr.gif", "images/thumb_next_ovr.gif" );
var CL_VIEWBTN_OBJ = new Array( "VIEWBACK", "VIEWNEXT" );
var CL_VIEWBTN_SRC = new Array( "images/viewer_back_ovr.gif", "images/viewer_next_ovr.gif" );
var CL_TXTSELECTOR = new Array( "ST1", "ST2", "ST3", "ST4", "ST5" );

var THUMBBTN_SRC = new String( );
THUMBBTN_SRC += '<ul id="thumb-button" class="wrapper">';
THUMBBTN_SRC += '<li class="button-back"><img src="images/thumb_back_off.gif" width="8" height="42" id="THUMBBACK" alt="Show previous scene" /></li>';
THUMBBTN_SRC += '<li class="button-next"><img src="images/thumb_next_off.gif" width="8" height="42" id="THUMBNEXT" alt="Show next scene" /></li>';
THUMBBTN_SRC += '</ul>';

var STAGE_SRC =  new String( );
STAGE_SRC += '<div id="collection-viewer">';
STAGE_SRC += '<div id="collection-image"><img src="images/large/sc01_01.jpg" width="217" height="326" id="VIEWERIMG" alt="" /></div>';
STAGE_SRC += '<ul id="viewer-button" class="wrapper">';
STAGE_SRC += '<li class="float-left"><img src="images/viewer_back_off.gif" width="59" height="19" id="VIEWBACK" alt="Show previous image" /></li>';
STAGE_SRC += '<li class="float-right"><img src="images/viewer_next_off.gif" width="59" height="19" id="VIEWNEXT" alt="Show next image" /></li>';
STAGE_SRC += '</ul>';
STAGE_SRC += '</div><!-- /collectionViewer -->';

var TSELECT_SRC =  new String( );
TSELECT_SRC += '<div id="scene-selector">';
TSELECT_SRC += '<p>|&nbsp;<span id="ST1">1</span>&nbsp;|&nbsp;<span id="ST2">2</span>&nbsp;|&nbsp;<span id="ST3">3</span>&nbsp;|&nbsp;<span id="ST4">4</span>&nbsp;|&nbsp;<span id="ST5">5</span>&nbsp;|&nbsp</p>';
TSELECT_SRC += '</div><!-- /sceneSelector -->';

var SCRIPTABLESTYLE = new Array( "collection-thumb", "collection-heading", "collection-viewer", "thumb-button" );