/*


*/
var showAll =true;
var pageSise =10;
var goodsItems = new Array();
/**
 name             - название изделия - заголовок для описания товара
 title			  - название - заголовок для картинок
 availabile       - true/false в наличие/продано
 price			  - цена - строкой
 description      - описание товара
 smallPhoto		  - маленькая картинка в описании товара
 bigPhoto 		  - большая картинка для увеличенного просмотра
 handicraft		  - true/false -рисовать ли значек - используются бусины ручной работы
 additionalPhotos - дополнительные фотографии - массив строк
 additionalName   - текст перед дополнительными фотографиями - по умолчанию 'Еще фото:'
					этот текст показывается только если есть дополнительные фотографии
  пример
  new GoodsItem("Заговор1", "Дикие полоски - браслет", true, "= 500р", "Бусины из полимерной глины ручной работы, каменные бусины, фурнитура.","braslets/sm_P1060563.jpg" ,"braslets/P1060563.jpg", true, ["braslets/P1060541.jpg" ,"braslets/P1060542.jpg"], null )
  результат html будет такой
  <tr style="padding-bottom: 20px;">
	<td align="center" valign="top" width="150"><a target="_blank" href="braslets/P1060563.jpg"><img alt="Дикие полоски - браслет" title="Дикие полоски - браслет" src="braslets/sm_P1060563.jpg" border="0" height="150" width="200"></a></td>
	<td><span class="head2">Заговор1</span><br><span class="txt3"><b>__________<br>в наличии<br>= 500р</b></span><br><br>Бусины из полимерной глины ручной работы, каменные бусины, фурнитура.<br><br>Еще фото:&nbsp;<strong><a target="_blank" href="braslets/P1060541.jpg">1</a>&nbsp;<a target="_blank" href="braslets/P1060542.jpg">2</a>&nbsp;</strong><br><br><strong><img title="в этом изделии использовались бусины ручной работы" alt="в этом изделии использовались бусины ручной работы" src="img/hm-bead.gif" height="14" width="22"></strong></td>
  </tr>
*/
function GoodsItem(name, title, availabile, price, description, smallPhoto, bigPhoto, handicraft  ,additionalPhotos, additionalName){
	this.name = name;
	this.title = title;
	this.availabile = availabile;
	this.price = price;
	this.description = description;
	this.smallPhoto =smallPhoto ; 
	this.bigPhoto = bigPhoto ;
    this.handicraft = handicraft ;
	this.additionalPhotos = additionalPhotos;
	this.additionalName = additionalName;
}
/**
create HTML control for goods
*/
GoodsItem.prototype.createControl = function( ){
	var aThis = this;
	var trElem = new Element("tr");
//	trElem.style.paddingBottom="20px";
	var imgTD = new Element("td", {width:"150" ,align:"center" , valign:"top"});
	imgTD.style.paddingBottom="20px";
	trElem.update(imgTD ) ;
	var imgLink = new Element("a", {href:this.bigPhoto, target:"_blank"}).update(
		new Element("img" ,{src:this.smallPhoto ,border:"0" ,title :this.title  ,alt:this.title /*,width:"200" ,height:"150"*/})
	);
	imgLink.onclick = function (ev) {
	                ev = ev || window.event;
                    ev.returnValue = false;
                    aThis.viewModalImage(ev);
					return false;
					};
	imgTD.update(imgLink );
	
	var dataTD = new Element("td");
	dataTD.style.paddingBottom="20px";
	trElem.insert({'bottom':dataTD  }) ;
	var sp = new Element("span");
	sp.className = "head2";
	dataTD.update(sp.update(this.name)); 
	dataTD.insert({"bottom":new Element("br")}); 
	var sp1 = new Element("span").update("<b>__________<br>"+(this.availabile? "в наличии" :"продано")+"<br>"+ (this.price ? this.price :"")+"</b>");
	sp1.className = this.availabile ? "txt3" : "txt5";
	dataTD.insert({"bottom":sp1});
	dataTD.insert({"bottom":new Element("br")});
	dataTD.insert({"bottom":new Element("br")});
	dataTD.insert({"bottom":this.description +"<br><br>"});
	if  (this.additionalPhotos && this.additionalPhotos.length){
		dataTD.insert({"bottom":( this.additionalName ?this.additionalName : "Еще фото:")+"&nbsp;"});
		var dataStrong = new Element("strong");
		dataStrong.update("") ;
		this.additionalPhotos.each(function(elem ,indx){
			var adLink = new Element("a", {href:elem, target:"_blank"}).update((indx+1)+"");
			adLink.onclick = function (ev) {
	                ev = ev || window.event;
                    ev.returnValue = false;
                    aThis.viewModalImage(ev ,indx+1);
					return false;
					};
			dataStrong.insert({"bottom":adLink });
			dataStrong.insert({"bottom":"&nbsp;"});
		});
		dataTD.insert({"bottom":dataStrong});
		dataTD.insert({"bottom":"<br><br>"});
	}
	if (this.handicraft ){
		dataTD.insert({"bottom":new Element("strong").update(
			new Element("img" ,{src:"img/hm-bead.gif",width:"22", height:"14" ,alt:"в этом изделии использовались бусины ручной работы",title:"в этом изделии использовались бусины ручной работы"})
		)});

	}
	return trElem;
}

GoodsItem.prototype.viewModalImage = function(oEvent,ind){
    if (!oEvent)
        oEvent = window.event;
    var sUrl = (!ind || !this.additionalPhotos  || !this.additionalPhotos[ind -1] ) ? this.bigPhoto:this.additionalPhotos[ind -1] ;
    var oTarget = oEvent.target || oEvent.srcElement;
    if (oTarget){
		var  oThis = this;
		showInlineImage(null ,oThis.title);
		var oImage = new Image();
		oImage.onload = function(){
			showInlineImage(oImage ,oThis.title);
		};
		oImage.onerror = function(){
			showInlineImage("Извините, картинки нет..." ,oThis.title);
		};
		oImage.onabort = function(){
			showInlineImage("Загрузка Изображения прервана", oThis.title);
		};
		oImage.src = sUrl;
    }
}
var itu;
function showInlineImage(sobj,sTitle){

		var dvEl = new Element("div");
		var iwidth =200;
		var iheight = 100;
		if (Modalbox && Modalbox.MBwindow){
			Modalbox.MBwindow.style.display = "none";
			Modalbox.MBframe.style.bottom = 0;
		}
		var showTU = 150;
		clearTimeout(itu);
		if (sobj == null){
			dvEl = new Element("div", {id: "MB_wait"})
			dvEl.update(Modalbox.options.loadingString) ;
			iwidth =300;
			iheight = 180;
		}else if (typeof sobj == "string"){
			sobj = "<span class=\"nopics\">"+sobj+"</span>";
			dvEl.update(sobj);
		}else{
			var img = new Element("img");
			img.src = sobj.src; 
			if (sobj.width)
				iwidth = sobj.width; 
			if (sobj.height)
				iheight = sobj.height; 
			dvEl.update(new Element("center").update(img));
			iwidth += 36;
			iheight +=36 +20;
			//dvEl.style.width = ( iwidth +10)+"px";
			//dvEl.style.height = ( iheight +10)+"px";
		}
        itu = setTimeout( function(){Modalbox.show(dvEl, {width: iwidth, height:iheight,title:sTitle }); } ,showTU);
}


function writeStatus(){
	var divEl = $("view_status_element");
	 var aEl = new Element("a", {title: (showAll ? "Спрятать проданные" : "Показать проданные"), href: "#"}).update(
		new Element("img" ,{src:(showAll ? "img/s_h.gif" : "img/s_s.gif"), width:84, height: 47, border: 0})
	);
	aEl.onclick = function(ev){ev = ev || window.event; ev.returnValue= false; changeStatus();return false;}
	divEl.update(aEl) ;
}
function changeStatus(){
	showAll = !showAll;
	writeStatus();
	showPage(0);
}
function writeNav(pCount ,pageNum){
	var divEl = $("nav_element");
	divEl.update("") ;
    if (pCount > 1){
        for (var i = 0; i < pCount; i++) {
            var imgelem = new Element("img", {id: "nel_"+i,src:(i == pageNum ? "img/bull_on.gif" : "img/bull.gif"), width:25, height: 17, border: 0});
            var elem;
            if (i == pageNum){
                elem = imgelem;
            }else {
                elem = new Element("a", {title: "page " + (i + 1) , href: "#"});
                elem.update(imgelem);
                elem.onclick = function (ev ){
                    ev = ev || window.event;
                    ev.returnValue = false;
                    var oTarget = ev.target || ev.srcElement;
                    showPage(parseInt(oTarget.id.substr(4) ));
                    return false;
                }
            }
            divEl.insert({'bottom':elem});
<!--            divEl.insert({'bottom':"&nbsp;&nbsp;&nbsp;"}); -->
        }
    }
}
function navClickHandle(ev,pageNum){
    ev = ev || window.event;
    ev.returnValue = false;
    showPage(pageNum);
    return false;
}

function getPageCount(){
    var elCount = 0 ;
    goodsItems.each(function(elem ,indx){
        if (showAll || elem.availabile)
            elCount++;

    });
    elCount  = elCount +pageSise -1;
    var pageCount =   elCount  / pageSise ;
    pageCount = parseInt(""+pageCount );
    return pageCount; 
}
function showPage(pageNum){
	var pCount = getPageCount();
	if (pageNum > pCount)
		pageNum = 0;
	// write  nav page
	writeNav(pCount ,pageNum);
	// write  goods
	var startIndx =  pageNum * pageSise;
	var currentIndex = -1;
	var divEl = $("goods_element");
	var tableEl = new Element("table", {width:"100%" ,border:"0" ,cellspacing:"0" ,cellpadding:"10"});
	var tbodyEl= new Element("tbody");
	tableEl.update(tbodyEl);
	divEl.update(tableEl) ;

	goodsItems.each(function(elem ,indx){
		if (showAll || elem.availabile){
			currentIndex ++;
			if (currentIndex >=startIndx && currentIndex <startIndx+pageSise){
				            tbodyEl.insert({'bottom':elem.createControl()});
			}
		}
	});
		
}