/* Фотогалерея, версия 1.1.  Разработчик Вадим Дунаев, http://dunaevv1.narod.ru 
  Гарантия: as is
  Лицензия: free
*/

pG=[]; // глобальная переменная для хранения параметров и данных фотогалереи
 
photogallery=function(images, left, top, width, height, countlenta, isshadow, comments){
/* Фотогалерея
   Параметры:
   images - массив адресов файлов с картинками;
   left, top - координаты (числа) верхнего левого угла фотогалереи
               (по умолчанию 0);
   width, height - ширина и высота (числа) области экспозиции выбранной картинки
                   (по умолчанию 320, 240);
   countlenta - количество миниатюр, одновременно видимых на ленте;
                если null (не указан), то выбирается минимум из 5 и количества всех картинок;
                если 0, то лента с миниатюрами не отображается;
   isshadow - затемнение фона; если указан, то фон затемняется, иначе - нет.

   Примеры вызова:
     photogallery(images);
     photogallery(images, 100, 200, 640, 400);
*/
if(!images||images.length==0) return alert("Фотогалерея: не указаны графические изображения");
var xid=("pg"+Math.random()*100000000).substr(0,6); // уникальный префикс для id элементов
pG[xid]=[]; // массив параметров галереи с идентификатором xid
pG[xid].images=images;

/* Значения id с префиксом xid ********************************/
pG[xid].darkbackground="darkbackground";
pG[xid].photogallery=xid+"photogallery";
pG[xid].imgbox=xid+"imgbox";
pG[xid].picture=xid+"picture";
pG[xid].control=xid+"control";
pG[xid].thumbbox=xid+"thumbbox";
pG[xid].lenta=xid+"lenta";
pG[xid].buttons=xid+"buttons";
pG[xid].minus=xid+"minus";
pG[xid].plus=xid+"plus";
pG[xid].original=xid+"original";
pG[xid].fit=xid+"fit";
pG[xid].first=xid+"first";
pG[xid].prev=xid+"prev";
pG[xid].next=xid+"next";
pG[xid].last=xid+"last";
pG[xid].slideshow=xid+"slideshow";
pG[xid].shadow=xid+"shadow";
pG[xid].counter=xid+"counter";
pG[xid].thumb=xid+"thumb";
pG[xid].comments=comments;

/**************************************************************/
var i;
pG[xid].imgObj=[];  /* массив объектов картинок */
for(i=0;i<pG[xid].images.length;i++){
  pG[xid].imgObj[i]=new Image();
  pG[xid].imgObj[i].src=pG[xid].images[i];  // загружаем картинки в память
}

/* Если элемент для затемнения фона отсутствует, то создаем его: */
var htmlstr=document.getElementById("darkbackground")? '':'<div id="darkbackground" class="darkbackground"></div>';
/* Формируем строку с HTML-кодом и записываем ее в документ*/
document.write(
  htmlstr,
  '<div id="'+pG[xid].photogallery+'" class="photogallery">',
  '<div id="'+pG[xid].imgbox+'" class="imgbox">',
  '<img id="'+pG[xid].picture+'" class="picture" src="" alt="" style="z-index:1000"/></div>',
  '<div id="'+pG[xid].control+'" class="control">',
  '<div id="'+pG[xid].thumbbox+'" class="thumbbox">',
  '<div id="'+pG[xid].lenta+'" class="lenta" style="left:0">',
  '</div></div>',
  '<div id="'+pG[xid].buttons+'" class="buttons">',
  '<input id="'+pG[xid].minus+'" type="button" value=" - " title="Уменьшить"/>',
  '<input id="'+pG[xid].plus+'" type="button" value=" + " title="Увеличить"/>',
  '<input id="'+pG[xid].original+'" type="button" value="1:1" title="Оригинальный размер"/>',
  '<input id="'+pG[xid].fit+'" type="button" value="[<>]" title="Вписать"/>',
  '<input id="'+pG[xid].first+'" type="button" value="|&lt;" title="В начало"/>',
  '<input id="'+pG[xid].prev+'" type="button" value="&lt;" title="Предыдущее"/> ',
  '<input id="'+pG[xid].next+'" type="button" value="&gt;" title="Следующее" />',
  '<input id="'+pG[xid].last+'" type="button" value="&gt;|" title="В конец" />',
  '<input id="'+pG[xid].slideshow+'" type="button" value="play" class="play" title="Слайдшоу" onclick="slideshow(\''+xid+'\')"/>',
  '<input id="'+pG[xid].shadow+'" type="button" class="shadow" value=&#177; onclick="shadow(\''+xid+'\')"/>',
  '<input id="'+pG[xid].counter+'" class="counter" type="button" value="Счетчик изображений" disabled="disabled"/>',
  '</div></div></div>'
);
 
/* Параметры ******************************************************/
pG[xid].maxWidth=(!width)? 320:width;    // ширина области экспозиции
pG[xid].maxHeight=(!height)? 240:height; // высота области экспозиции
pG[xid].countlenta=(countlenta==null)? Math.min(5,pG[xid].images.length):countlenta;// количество видимых миниатюр
if(countlenta==0) document.getElementById(pG[xid].thumbbox).style.display='none'; // не показывать ленту
pG[xid].widththumb=52; // ширина миниатюры 
pG[xid].duration=1000  // длительность экспозиции при слайдшоу в миллисекундах
pG[xid].curpicture=0;  // индекс текущей картинки
// не изменяйте следующие параметры:
pG[xid].top=top;
pG[xid].left=left;
pG[xid].slideInterval=null; 

/* Позиционирование галереи *****************************************************************/
document.getElementById(pG[xid].photogallery).style.left=((!left)? 0:left)+"px";
document.getElementById(pG[xid].photogallery).style.top=((!top)? 0:top)+"px";
document.getElementById(pG[xid].thumbbox).style.width=(pG[xid].widththumb+2)*pG[xid].countlenta-4+"px";
document.getElementById(pG[xid].lenta).style.width=(pG[xid].widththumb+2)*pG[xid].images.length+"px";
document.getElementById(pG[xid].imgbox).style.width=pG[xid].maxWidth+"px";    
document.getElementById(pG[xid].control).style.top=(pG[xid].maxHeight+12)+"px";

/* Затемнение фона ********************************************/
document.getElementById(pG[xid].darkbackground).style.width=
    document.width? document.width+"px": screen.availWidth+"px";
document.getElementById(pG[xid].darkbackground).style.height=
     document.height? document.height+"px": 2*screen.availWidth+"px";
document.getElementById(pG[xid].shadow).title="Затемнение фона вкл./выкл."
if (document.getElementById("darkbackground")){
  if (isshadow) { // если указан параметр
    document.getElementById(pG[xid].darkbackground).style.display="block";
  } else {
    document.getElementById(pG[xid].darkbackground).style.display="none";
  }
}

/******************************************************************/
htmlstr="";
for(i=0;i<pG[xid].imgObj.length;i++){      // формируем строку с HTML-кодом миниатюр
  htmlstr+="<img id='"+pG[xid].thumb+i+"' class='thumbnails' src='"+pG[xid].images[i]+"'/>";
}
document.getElementById(pG[xid].lenta).innerHTML=htmlstr;  // отображаем миниатюры
htmlstr=null;

/* Назначаем обработчики щелчков *******************************/
document.getElementById(pG[xid].first).onclick=function(){goto(0)}    // показ первой картинки
document.getElementById(pG[xid].prev).onclick=function(){goto(-1)}    // показ предыдущей картинки
document.getElementById(pG[xid].next).onclick=function(){goto(1)};    // показ следующей картинки
document.getElementById(pG[xid].last).onclick=function(){goto(null)}  // показ последней картинки
document.getElementById(pG[xid].fit).onclick=function(){showpicture(null,xid)}// вписать в область экспозиции
document.getElementById(pG[xid].minus).onclick=function(){zoom(-1)};  // уменьшение
document.getElementById(pG[xid].plus).onclick=function(){zoom(1)};    // увеличение
document.getElementById(pG[xid].original).onclick=function(){zoom(0)};// оригинальный размер
for (var i=0;i<pG[xid].imgObj.length;i++){  // обработчики щелчков на миниатюрах
   eval("document.getElementById('"+pG[xid].thumb+i+"').onclick=function(){showpicture("+i+",'"+xid+"')}");
}
document.getElementById(pG[xid].picture).onclick=function(){ // щелчок на области эксаозиции
  document.getElementById(pG[xid].picture).style.zIndex=document.getElementById(pG[xid].picture).style.zIndex==1000? 1001:1000
}
document.getElementById(pG[xid].original).onmouseover=function(){  // подсказка для кнопки "1:1" при наведении на обл. экспозиции
  document.getElementById(pG[xid].original).title=
    "Оригинальные размеры: "+pG[xid].imgObj[pG[xid].curpicture].width+"x"+pG[xid].imgObj[pG[xid].curpicture].height;
}
/* Обработчики для перемещения ********************************/
document.body.onmousedown=dragstart; // начало перемещения
document.body.onmousemove=drag;      // перемещение
document.body.onmouseup=dragend;     // конец перемещения
id_el=null;

/***************************************************************/
document.getElementById(pG[xid].thumb+(pG[xid].images.length-1)).onload=function(){ //при загрузке последней картинки
        for(i=0;i<pG[xid].imgObj.length;i++){ // подсказки для миниатр
           document.getElementById(pG[xid].thumb+i).title=
              pG[xid].imgObj[i].width+"x"+pG[xid].imgObj[i].height;
        }
        document.getElementById(pG[xid].fit).title=
           "Вписать в область экспозиции: "+pG[xid].maxWidth+"x"+pG[xid].maxHeight; // подсказка для кнопки "[()]"
        showpicture(pG[xid].curpicture, xid);      // показываем картинку в области экспозиции
}
  
/* Функции управления внутри photogallery() *****************************/

function goto(target){ // переход к картинке 
  if(target==null) {   // к последней
    pG[xid].curpicture=pG[xid].images.length-1;
    document.getElementById(pG[xid].lenta).style.left=
        (-pG[xid].widththumb*(pG[xid].images.length-pG[xid].countlenta ))+"px";
  }else{
    if(target==0){     // к первой
      document.getElementById(pG[xid].lenta).style.left="0";
      pG[xid].curpicture=0;
    }else{             // к предыдущей или следующей
      if (pG[xid].curpicture+target==-1||pG[xid].curpicture+target==pG[xid].images.length) return;
      document.getElementById(pG[xid].lenta).style.left=
          ((parseInt(document.getElementById(pG[xid].lenta).style.left)-target*pG[xid].widththumb))+"px";
      pG[xid].curpicture=pG[xid].curpicture+target;
    }
  }
  showpicture(pG[xid].curpicture,xid) // показать картинку
}

function zoom(mod){ // уменьшение, увеличение, оригинальный размер
  var worig=pG[xid].imgObj[pG[xid].curpicture].width;
  var horig=pG[xid].imgObj[pG[xid].curpicture].height;
  var k=0.1  // на какую часть увеличить или уменьшить
  if(mod==0) document.getElementById(pG[xid].picture).style.width=worig+"px";
  else {
      document.getElementById(pG[xid].picture).style.width=
          parseInt(document.getElementById(pG[xid].picture).style.width)*(1+k*mod)+"px"
  }
  document.getElementById(pG[xid].imgbox).style.width=document.getElementById(pG[xid].picture).style.width;
}
 
} // конец photogallery()

/* Вспомогателные функции **********************************************/
function showpicture(i, xid){ // показ картинки в области экспозиции
if (i==null) i=pG[xid].curpicture;
  var size=scale(pG[xid].imgObj[i].width,pG[xid].imgObj[i].height,xid); // масштабируем
  document.getElementById(pG[xid].picture).src=pG[xid].imgObj[i].src; // показываем картинку
  document.getElementById(pG[xid].picture).style.width=size+"px";
  document.getElementById(pG[xid].imgbox).style.width=size+"px";
  document.getElementById(pG[xid].picture).src=eval('pG[xid].imgObj['+i+'].src');
  if(pG[xid].comments&&pG[xid].comments[i]) {
      document.getElementById(pG[xid].picture).title=pG[xid].comments[i]
  }
  pG[xid].curpicture=i;
  document.getElementById(pG[xid].counter).value=(i+1)+"/"+pG[xid].imgObj.length; // изменяем значение счетчика
}

function scale(w,h,xid){  // масштабировать, чтобы вписать в область экспозиции (вызывается из showpicture())
  var k=w/h;
  if ((w>pG[xid].maxWidth)||(h>pG[xid].maxHeight)) {
    w=pG[xid].maxWidth; h=(w/k);
    if (h>pG[xid].maxHeight) {
      h=pG[xid].maxHeight;
      w=(h*k);
    }
  }
  while(h<=pG[xid].maxHeight&&w<=pG[xid].maxWidth){
      w=w+1; h=w/k;
      if(h>=pG[xid].maxHeight||w>=pG[xid].maxWidth) {w=w-1;h=w/k;break}
  }
  return w
}

function shadow(xid){ // затемнить/убрать затемнение фона
  if (document.getElementById("darkbackground").style.display=="none"){
    document.getElementById(pG[xid].shadow).title="Убрать затемнение фона";
    document.getElementById("darkbackground").style.display="block"
  } else {
    document.getElementById(pG[xid].shadow).title="Затемнить фон";
    document.getElementById("darkbackground").style.display="none";
  }
}
 
function slideshow(xid){ // Слайдшоу
 if(!pG[xid].slideInterval) {
    pG[xid].slideInterval=setInterval("slide('"+xid+"')",pG[xid].duration);
    document.getElementById(pG[xid].slideshow).value="||";
  } else {
    clearInterval(pG[xid].slideInterval);
    pG[xid].slideInterval=null;
    document.getElementById(pG[xid].slideshow).value="play";
  }
}

function slide(xid){  // периодически вызывается из slideshow()
    pG[xid].curpicture=pG[xid].curpicture+1;
    if(pG[xid].curpicture>=pG[xid].images.length) pG[xid].curpicture=0;
    showpicture(pG[xid].curpicture,xid)
}

/* Функции для перемещения ************************************************/
function dragstart(evt){    // начало перемещения элемента
  var e;
  if (window.event) e=event.srcElement    // для IE
  else e=evt.target; // для других браузеров
  id_el=e.id;    // id перетаскиваемого элемента
  if (id_el&&document.getElementById(id_el)&&(document.getElementById(id_el).className=="picture")){
    /* вид указателя мыши: */
    document.getElementById(id_el).style.cursor = 'move'; 
  }
  return false
}

function drag(event){    // перемещение элемента
  if (!id_el) return false;
  if (document.getElementById(id_el)&&
     (document.getElementById(id_el).className=="picture")){
    var evt;
    /* для межбраузерной совместимости: */
    evt=(event)? event: window.event;
    //if (event) evt=event
    //else evt=window.event;
    var xid=id_el.substr(0,id_el.indexOf("picture"));
    /* изменяем координаты элемента */
    document.getElementById(id_el).style.top=(evt.clientY-20-pG[xid].top)+"px";
    document.getElementById(id_el).style.left=(evt.clientX-20-pG[xid].left)+"px";
  }
  return false
}

function dragend(){       // конец перемещения элемента
  if (id_el&&document.getElementById(id_el)&&
     (document.getElementById(id_el).className=="picture")){
    document.getElementById(id_el).style.cursor ="auto";
    id_el=null;
  }
  return false
}