//the slide tape control
//..................................................>>
//init the slide tape
function init_slide_tape(id, obj_name, img_format, on_view_click_handler, css_slide, css_slide_arrow)
{
	//self reference
	this.self_ref = document.getElementById(id).rows.item(0);
	//runtime object name information
	this.name = obj_name;
	//current position of the slide tape
	this.pos  = 0;
	//number of the slides
	this.slnum = 0;
	//image format
	this.format = img_format;
	//project folder path
	this.prjFolder = '';
	//the length of the slide tape without left and right direction buttons
	this.length = this.self_ref.cells.length - 2;
	//set new info about
	this.setInfo = setSlideTapeInfo;
	//set new handler for direct controls
	this.onDirectClck = onViewDirectClck;
	//set new handler for preview controls
	this.onClck = on_view_click_handler;
	
	//slide CSS style's class
	this.slide_style = css_slide;
	//slide_arrow CSS style's class
	this.slide_arrow_style = css_slide_arrow;
}
//-------------------------------------------------->
//set the new state of the slide tape
function setSlideTapeInfo(pFolder, dpos, snum, format)
{
	//innerHTML of element of the slide tape
	var newPageHTML = "&nbsp;";
	//----------------------------------------------------
	//show/hide slide bar direction controls
	//-------------------------------------->
	//left direction control
	var left_dir = this.self_ref.cells.item(0);
	if(dpos == 0) left_dir.innerHTML = '&nbsp;';
	else          left_dir.innerHTML = '<img align=\"absmiddle\" id=\"sld_left\" class=\"' + this.slide_arrow_style + '\" src=\"frontoffice-styles/images/slarr.png\" alt=\"\" onClick=\"' + this.name + '.onDirectClck(\'sld_left\')\">';
	//-------------------------------------->
	//right direction control
	var right_dir = this.self_ref.cells.item(this.self_ref.cells.length - 1);
	if((dpos + this.length) >= snum) right_dir.innerHTML = '&nbsp;';
	else                             right_dir.innerHTML = '<img align=\"absmiddle\" id=\"sld_right\" class=\"' + this.slide_arrow_style + '\" src=\"frontoffice-styles/images/srarr.png\" alt=\"\" onClick=\"' + this.name + '.onDirectClck(\'sld_right\')\">';
	//----------------------------------------------------
	//work with slide tape
	//without left and right direction buttons
	for(var i = 1; i < (this.length + 1); i++)
	{
		//if project defined
		if(pFolder != "undef")
		{
			//number of the current slide
			var nslide = i + dpos;
			newPageHTML = '<img align=\"absmiddle\" id=\"slide_';
			if(nslide < 10) newPageHTML += '0';
			newPageHTML += nslide;
			newPageHTML += '\" class=\"' + this.slide_style + '\" src=\"' + pFolder + '/';
			if(nslide < 10) newPageHTML += '0';
			newPageHTML += nslide;
			newPageHTML += '.' + this.format + '\" alt=\"\" onClick=\"' + this.name + '.onClck(\'slide_';
			if(nslide < 10) newPageHTML += '0';
			newPageHTML += nslide;
			newPageHTML += '\')\">';
		}
		else
			newPageHTML = '&nbsp;';
		//..................................................
		//approximative conclusion
		//<img align="absmiddle" id="slide_01" class="slide" src="img/serv/metal/01.png" alt="�����" onClick="onViewClck('slide_01')">;
		if(i > snum) this.self_ref.cells.item(i).innerHTML = '&nbsp;';
		else         this.self_ref.cells.item(i).innerHTML = newPageHTML;
	}
	//----------------------------------------------------
	//save the new current position of the slide tape
	this.pos   = dpos;
	//save the new number of the slides
	this.slnum = snum;
	//save the new project folder path
	this.prjFolder = pFolder;
}

function onViewDirectClck(id)
{
	switch(id)
	{
		case "sld_left":
		  if(this.pos > 0) this.pos--;
		  break;
		  
		case "sld_right":
			if(this.pos < (this.slnum - this.length)) this.pos++;
		  break;
		
		default:
	}
	//----------------------------------------------------
	//set the new state of the slide tape
	this.setInfo(this.prjFolder, this.pos, this.slnum);
}

//click event over one of slide on slide tape
function onViewClck(id)
{
	var slide_img = document.getElementById(id);
	var full_img  = document.getElementById("full_img");
	//----------------------------------------------------
	full_img.src = slide_img.src;
}
//------------------------------------------------------
//end of the slide tape control
//......................................................>>