/*
   * "Knihovna" pro zobrazovani nahledu obrazku po kliknuti mysi na ne -
   * vyrazne inspirovanoz systemem: http://vikjavev.no/highslide/
   * Pouziti - pro fungovani je potreba obrazek zanorit do tagu <a> a pridat atribut rel='popup'
   * <a href="vetsi-obrazek.jpg" rel="popup">
   *   <img src="nahledovy-obrazek.jpg">
   * </a>
   */

  //Lze nastavit par veci...
  var relName = 'popup';
  var loadingImagePath = 'designimages/loading.gif'; //obrazek loadovani
  var close0ImagePath = 'designimages/close0.gif'; //obrazky zavirani
  var close1ImagePath = 'designimages/close1.gif';
  //definice css ramecku kolem resizovaneho obrazku
  borderAround = 'solid black 2px';


  //zajisteni moznosti pouzivani getElementById v IE
  if((!document.getElementById) && document.all){
    document.getElementById = document.all;
    //document.getElementById = function(id){return document.all[id];};
  }

  /**
   * Osetreni standardniho chovani OnLoad metody na dokumentu
   * Prida funkci posluchace onload nad dokumentem
   *
   * @parametr Function fce  nazev fce, ktera bude obsluhovat onload udalost
   * @return true
   */
  function addLoadDocumentListener(fce) {
      //onload je na objektu window
      if(window.addEventListener) {
          window.addEventListener('load',fce,false);
      }
      //onload je na objektu document
      else if(document.addEventListener) {
          document.addEventListener('load',fce,false);
      }
      //IE a jeji nestandardni attachevent
      else if(window.attachEvent) {
          window.attachEvent('onload',fce);
      }
      return true;
  }

  /** 
   * Funkce pro zadefinovani posluchace udalosti - Mozilla ma addEventListener a IE
   * ma (asi) attachEvent - tak to sjednotime
   *
   * @param Element element  objekt DOM elementu, na kterem ma posluchac poslouchat
   * @param Function fce  fce, ktera se ma zaregistrovat k posluchaci
   * @param String type  nazev udalosti, ke kteremu ma byt posluchac asociovan (napr. click)
   *   type se zadava bez 'on', tzn. pouze click a ne onclick
   * @return true;
   */
  function addListener(element, fce, type) {
    //nemame ani jednu funkci
    if (!element.addEventListener && !element.attachEvent) 
        return false;
    //standardni model
    if (element.addEventListener) 
        element.addEventListener(type,fce,false); //false je neco kolem protekani
    //IE model
    else if (element.attachEvent) {
        element.attachEvent('on' + type,fce); 
    }
    return true;
  }

  /**
   * Fce uvolni posluchace na elementu
   * 
   * @param Element element  objekt DOM elementu, na kterem posluchac posloucha
   * @param Function fce  fce, ktera se ma odregistrovat
   * @param String type  nazev udalosti bez 'on'u ktere ma byt posluchac zrusen
   * @return true;
   */
  function removeListener(element,fce,type) {
    if(element.removeEventListener) {
      element.removeEventListener(type,fce,false);
    } else if(element.detachEvent) {
      element.detachEvent('on'+type,fce);
    }
  }

  /**
   * Dalsi obezlicky (nejen) pro IE:
   * Zakaz protekani akce dokumentem:
    if( e.stopPropagation ) { e.stopPropagation(); }
    e.cancelBubble = true;
   *
   * Zakaz standardni akce elementu
   if( e.preventDefault ) { e.preventDefault(); }
   e.returnValue = false;
   *
   * Napr. pro onmouseover, abychom vedeli z jakeho prvku mys prechazi
   var relTarget = e.relatedTarget ? e.relatedTarget : e.fromElement;
   *
   * Zjisteni ktery prvek vyvolal udalost - tedy od ktereho prvku udalost pochazi
   * Bohuzel v IE asi nejde zjistit, ktery prvek prave provadi svou proceduru zachyceni
   * lze zjisit, kdo vyvolal, ale ne kdo provadi
   var theTarget = e.target ? e.target : e.srcElement;
   if( theTarget && ( theTarget.nodeType == 3 || theTarget.nodeType == 4 ) ) {
      theTarget = theTarget.parentNode;
   }
   *
   * Kdyz potrebuju pri pousteni funkce timeout nastavit funkci, ktera ma byt spoustena dalsi parametr
   setTimeout(function() {blinkingBackground(what,pomcolor,count);}, 350);
  **/

  /**
   * Znaky klaves, jake tak asi jsou :)
    277 var op = null;
    278 switch (e.keyCode) {
    279 case 34: // Page Down
    280 case 39: // Arrow right
    281 case 40: // Arrow down
    282 op = 1;
    283 break;
    284 case 33: // Page Up
    285 case 37: // Arrow left
    286 case 38: // Arrow up
    287 op = -1;
    288 break;
    289 case 27: // Escape
    290 case 13: // Enter
    291 op = 0;
    292 }

*/
  
//-------------------------------------------------------------------------------------------------
//Vlastni funkce a nastaveni Popup obrazku
  //nahrani obrazku do cache prohlizece
  var pomLoading = new Image();
  pomLoading.src = loadingImagePath;
  var pomClose0 = new Image();
  pomClose0.src = close0ImagePath;
  var pomClose1 = new Image();
  pomClose1.src = close1ImagePath;
  //z-index, co si myslim, ze je maximalni :)
  var defZIndex = 100;
  var defZIndexMax = 111;
  //definuje, zda pri prechazeni na dalsi obrazek, pokud tento byl
  //v dokumentu posledni, zda prejdeme na prvni obrazek z dokumentu
  var loopingImages = true;
  //globalni promenna, kde budou ulozeny vsechny obrazky, ktere se daji na strance
  //prochazet = maji atribut rel nastaveny na relName (resp vsechny tagy <A>)
  //viz. findAllRel
  var popupImages = new Array();
  //pointer na aktualni prvek v poli popupImages
  var popupImagesPointer = -1;
  //pole vytvorenych obrazku = prvku na strance a ukazatel na aktualni
  var createdElements = new Array();
  var currentCreatedElement = -1;
  //abychom mohli pouzivat drag&drop, musime specifikovat globalni promennou,
  //kde bude ulozeno - naspecifikujeme si novy objekt
  function dragAndDropElementClass() {
      this.element = null;
      this.mousePos = {x:-1, y:-1};
      this.startPos = {x:-1, y:-1};
  }
  dragAndDropElement = new dragAndDropElementClass();
  //posluchac kliku v dokumentu
  addListener(document, showImage, 'click');
  //posluchac onload dokumentu
  addLoadDocumentListener(findAllRel);

  /**
   * Funkce zajistujici zobrazeni popupu - je to posluchac udalosti nad dokumentem
   * pokud dojde k tomu, ze zachyti udalost kliku, zjisti, zda je urcena pro nej (=nadrazeny
   * prvek ma atribut "rel" a pak se pokusi zvetsit fotku, kterou v tomto
   * elementu najde
   *
   * @param Event e  udalost dokumentu onclick
   * @param return boolean
   */
  function showImage(e) {
      //kontrola praveho tlacitka
      if(e.button && e.button > 1)
          return false;
      //urcime si, ktery prvek vyvolal akci a pujdeme vzhuru po jeho rodicich
      //abychom zjistili, zda nejaky z nich je prvek s atributem "rel" a hodnotou
      //"popup" abychom ho mohli nazvetsovat
      var theTarget = e.target ? e.target : e.srcElement;
      if( theTarget && ( theTarget.nodeType == 3 || theTarget.nodeType == 4 ) ) 
        theTarget = theTarget.parentNode; //osetreni, abychom se nedotazovali na textovy element

      var currentNode = theTarget;
      while(currentNode.parentNode != null) {
          if(currentNode.getAttribute('rel') == relName ) {
              var pomHref = currentNode.getAttribute('href');
              break;
          }
          currentNode = currentNode.parentNode;
      }

      //osetrime pripadny neuspech
      if(currentNode.parentNode == null) {
          return true;
      } else {
          //pri uspechu zastavime protekani udalosti a zrusime defaultni akci prvku
          if( e.stopPropagation ) { e.stopPropagation(); }
          e.cancelBubble = true;

          if( e.preventDefault ) { e.preventDefault(); }
          e.returnValue = false;
      }
      
      //najdeme element currentNode v poli popupImages
      findElementInPopupImagesArray(currentNode);

      //vytvoreni elementu ktery se bude zobrazovat a 
      //vlozeni do nej obrazku nahravani - vkladame do showingElement novy prvek obrazku
      var showingElement = document.createElement('div');
      var imageLoading = addLoadingImage(showingElement, 'into');
      imageLoading.style.top = '0px';
      imageLoading.style.left = '0px';
      showingElement.setAttribute("name","showing");
      showingElement.name = "showing";
      showingElement.style.position = "absolute";
      showingElement.style.borderStyle = 'none';
      //novy element nechame zobrazit nad vsechny, ktere jsou prekryvany
      showingElement.style.zIndex = defZIndexMax;
      for(var i=0; i<createdElements.length; i++) 
          createdElements[i].style.zIndex = defZIndex;

      //v prvku currentNode najdeme prvni element, ktery je obrazkem
      var imageToResize = currentNode.firstChild;
      while(imageToResize != null) {
          if(imageToResize.nodeType != 3 && imageToResize.nodeType != 4 &&
                  imageToResize.tagName.toLowerCase() == 'img') {
              break;
          }
          imageToResize = imageToResize.nextSibling;
      }
      //nemame obrazek = koncime
      if(imageToResize == null) { //img se vubec v tagu nevyskytuje 
        alert(currentNode.tagName);
          return true;
      }

      //nasli jsme obrazek, nastavime novemu elementu jeho velikost
      showingElement.style.width = imageToResize.width+'px';
      showingElement.style.height = imageToResize.height+'px';

      //fixme ??  - border tu nastavujeme primo jako promennou a mozna by bylo lepsi
      //to nechat nastavovat pres css styly externe
      showingElement.style.border = borderAround;

      //zjistime, kde na strance je currentNode
      var currentNodePosition = getPositionOfElement(imageToResize);
      //nastavime elementu jeho top a left - abychom s temito udaji pote mohli dale pracovat
      showingElement.style.left = currentNodePosition.x+'px';
      showingElement.style.top = currentNodePosition.y+'px';
      showingElement.left = currentNodePosition.x;
      showingElement.top = currentNodePosition.y;
      
      //element, ktery vytvarime vlozime do dokumentu - vlozime primo na zacatek
      //protoze ma abs pozici, a my ji chceme urcovat vzhledem k dokumentu
      //je-li totiz vkladany objekt potomkem objektu s position 'relative' ci 'absolute'
      //vztahuje si od nich souradnice
      //currentNode.parentNode.insertBefore(showingElement, currentNode);
      document.getElementsByTagName('body')[0].appendChild(showingElement); //BASTL!!!!!!
      //vlozime element do pole vytvorenych prvku
      createdElements.push(showingElement);
      currentCreatedElement = createdElements.length - 1;

      //DEBUG
      /*
      alert(imageLoading.offsetTop);
      return true; */

      //zjistime co za obrazek je treba zobrazit a nahrajeme ho do pameti
      var pomImage = new Image();
      addListener(pomImage, 
         function(e) {imageDownloaded(e, pomImage, imageLoading);} ,'load') 
      pomImage.src = pomHref;
  }

  /**
   * Fce je volana pote, co je nahran do cache pameti prohlizece obrazek "newImage"
   * Tato fce nahraje do pozice elementu imageElement obrazek newImage
   *
   * @param Event e  udalost, jez vyvolala tuto fci
   * @param Image newImage  objekt obrazku
   * @param Element imageElement  objekt html elemtntu <img>
   * @return false
   */
  function imageDownloaded(e, newImage, imageElement) {
      //alert(imageElement.parentNode.offsetTop);
      //odstranime posluchace
      removeListener(newImage, 
            function(e) {imageDownloaded(e, newImage, imageElement);},'load');
      //nastavime zakladni velikost obrazku na velikost nadrazeneho prvku
      imageElement.style.width = imageElement.parentNode.style.width;
      imageElement.style.height= imageElement.parentNode.style.height;
      //nahrani zaviraciho krizku
      var controlingElements = document.createElement('div');
      var imageClosing = document.createElement('img');
      imageClosing.src = close0ImagePath;
      imageClosing.style.borderStyle = 'none';
      imageClosing.style.width = imageClosing.width+'px';
      imageClosing.style.height = imageClosing.height+'px';
      controlingElements.appendChild(imageClosing);
      controlingElements.style.position = 'absolute';
      controlingElements.style.width = '100%';
      controlingElements.style.textAlign= 'right';
      controlingElements.style.top = '0';
      controlingElements.style.right = '0';
      controlingElements.style.zIndex = imageElement.style.zIndex+1;
      //posluchaci pro zobrazeni krizku zavirani
      imageClosing.onmouseover = function() 
                                        {imageClosing.src=close1ImagePath;};
      imageClosing.onmouseout = function() 
                                        {imageClosing.src=close0ImagePath;};
      //posluchac pro uzavreni zvetsene fotky
      addListener(imageElement, 
              function(e){handleClick(e, imageElement.parentNode);}, 'click');
      addListener(controlingElements,
              function(e){handleClick(e, imageElement.parentNode);}, 'click');
      //posluchac pro draganddrop :)
      addListener(imageElement,
              function(e){handleDragAndDrop(e, imageElement.parentNode);}, 'mousedown');
      //posluchac pro prechod na dalsi fotku - poslouchame klavesnici
      addListener(document, 
              function(e){handleNextImage(e, imageElement);}, 'keydown');

      imageElement.parentNode.appendChild(controlingElements);
      imageElement.style.position = 'static';
      imageElement.src = newImage.src;
      //na zaver pomalu zacneme obrazek zvetsovat do jeho spravne velikosti
      imageResizing(imageElement, imageElement.width, newImage.width, imageElement.height, newImage.height);
      return false;
  }

  /**
   * Fce zajisti postupne zvetsovani obrazku
   *
   * @param Element image  element image (jako rodice ma <a> element)
   */
  function imageResizing(image, startWidth, realWidth, startHeight, realHeight) {
    var stepw = Math.ceil((realWidth-startWidth)/5);
    var steph = Math.ceil((realHeight-startHeight)/5);
    if(image.width + stepw >= realWidth) {
        var neww = realWidth;
        var newh = realHeight;
        image.style.width = neww+'px';
        image.style.height = newh+'px';
        image.parentNode.style.width = neww+'px';
        image.parentNode.style.height = newh+'px';
        //document.getElementById('popisek').innerHTML += '<br>';
    } else {
        var neww = image.width + stepw;
        var newh = image.height + steph;

        image.style.width = neww+'px'; 
        image.style.height = newh+'px';
        image.parentNode.style.width = neww+'px';
        image.parentNode.style.height = newh+'px';
        //image.parentNode.left -= Math.ceil(stepw/2);
        //image.parentNode.top -= Math.ceil(steph/2);

        setTimeout(
           function() {imageResizing(image, startWidth, realWidth, startHeight, realHeight);}, 20);
    }

    var availscreen = screenInfo();
    if(image.parentNode.left < 0)
      image.parentNode.left = 0;
    if(image.parentNode.top < 0)
      image.parentNode.top = 0;
    if(image.parentNode.left + neww > availscreen.width)
      image.parentNode.left = availscreen.width - neww;
    if(image.parentNode.top + newh > availscreen.height)
      image.parentNode.top = availscreen.height - newh;
    
    /* //DEBUG
    document.getElementById('popisek').innerHTML += 
    'left parent+width:'+(image.parentNode.left+neww)+', avail:'+availscreen.width+
    ' '+image.parentNode.left+'  '+neww+'<br>';
    */
    image.parentNode.style.top = image.parentNode.top+'px';
    image.parentNode.style.left = image.parentNode.left+'px';
  }

  /**
   * Fce zjisti, na jake souradnici x a y je umisten element
   * predpoklada se moznost offsetLeft a offsetRight vlastnosti elementu
   * code from: http://www.quirksmode.org/js/findpos.html
   *
   * @param Element element  element, jehoz pozice se zjistuje
   * @return {x,y}  dvojice x a y souradnic
   */
  function getPositionOfElement(element) {
      var element;
      var curleft = curtop = 0;
      if (element.offsetParent) {
        do {
          curleft += element.offsetLeft;
          curtop += element.offsetTop;
        } while (element = element.offsetParent);
      }
      //document.getElementById('popisek').innerHTML += 'el:'+element.tagName+', x:'+xx+', y:'+yy+'<br>';
      return {x:curleft,y:curtop};
  }

  /**
   * Fce vyzjistuje informace o obrazovce - tzn. jak velke je okno browseru
   * a jak se da scrolovat
   *
   * return {sirka, vyska, scroll leva, scroll dolu}
   */
  function screenInfo()	{
        //zjisteni informaci o obrazovce
        var w, h , sl, st;
        if(window.innerWidth) { //mozilla apod.
            w = window.innerWidth;
            h = window.innerHeight;
            sl = window.pageXOffset;
            st = window.pageYOffset;
        } else { //ie
            var ie = document.compatMode && document.compatMode != "BackCompat" 
              ? document.documentElement : document.body;
            w = ie.clientWidth;
            h = ie.clientHeight;
            st = ie.scrollTop;
            sl = ie.scrollLeft;
        } 
        
        return {width:w, height:h, scrollLeft:sl, scrollTop:st};
  }

  /**
   * Fce jez zarizuje reakci na klik na obrazek
   * bud ho zavre nebo ho prevede do popredi = zjisti, zda je obrazek prekryvan
   *
   * @param Event e  udalost klik mysi
   * @param Element element, ktery je vuci kliku hlidan
   * @return false
   */
  function handleClick(e, element) {
      //pokud drag&dropujeme, zde nic nedelame
      if(dragAndDropElement.element != null) {
          dragAndDropElement.element = null;
          return false;
      }
      //kontrola praveho tlacitka
      if(e.button && e.button > 1)
          return false;
      
      //zjistime, zda je element aktivni, pokud ne, zaktivnime ho
      if(element.style.zIndex != defZIndexMax) {
              var pomw = element.style.borderWidth;
              var pomc = element.style.borderColor;
              var poms = element.style.borderStyle;
              element.style.borderStyle = 'solid';
              element.style.borderWidth = '3';
              element.style.borderColor = 'red';
              for(var i=0; i<createdElements.length; i++) {
                createdElements[i].style.zIndex = defZIndex;
                if(createdElements[i] == element) {
                    element.style.zIndex = defZIndexMax;
                    currentCreatedElement = i;
                }
              }
              setTimeout(
                      function() {element.style.borderWidth = pomw;
                      element.style.borderColor = pomc;
                      element.style.borderStyle = poms;}
                      , 150);
      } else {
          //zrusime prvek
          element.parentNode.removeChild(element);
          for(var i=0;i<createdElements.length;i++) {
              if(createdElements[i] == element) {
                  createdElements.splice(i,1);       
                  //nastavime jiny na aktualni
                  currentCreatedElement = createdElements.length - 1;
                  if(currentCreatedElement>=0)
                      createdElements[currentCreatedElement].style.zIndex = defZIndexMax;
                  break;
              }
          }
      }
      
      //zastavime protekani a zrusime defaultni akci
      if( e.stopPropagation ) { e.stopPropagation(); }
      e.cancelBubble = true;
      if( e.preventDefault ) { e.preventDefault(); }
      e.returnValue = false;
      return false;
  }


  /**
   * Fce ceka na udalost onkeydown, zjisti, ktera klavesa byla zmacknuta
   * byla-li zmacknuta klavesa leve ci prave sipky, pokusi se nahrat a zmenit obrazek
   * na dalsi v poradi na strance
   *
   * @param Event e  udalost stisku klavesy
   * @param Element targetImage  element obrazku <img>, ktery ma byt zmenen v src
   * @return boolean;
   */
  function handleNextImage(e, targetImage) {
      //zjistime, zda jsme aktualni prvek - zda se mame menit
      if(createdElements[currentCreatedElement] != targetImage.parentNode)
          return false;
      if(popupImagesPointer == -1)
          return false;
      //zachytime udalost klavesnice
      var op = 0;
      switch (e.keyCode) {
          case 34: // Page Down
          case 39: // Arrow right
          case 40: // Arrow down
              op = 1;
          break;
          case 33: // Page Up
          case 37: // Arrow left
          case 38: // Arrow up
              op = -1;
          break;
      }

      if(op == 0)
          return false;
      //next image
      if(op == 1) {
          if(popupImagesPointer+1<popupImages.length)
              popupImagesPointer++;
          else if(popupImagesPointer+1 >= popupImages.length && loopingImages == true)
              popupImagesPointer = 0;
      }
      //previous image
      if(op == -1) {
          if(popupImagesPointer > 0)
              popupImagesPointer--;
          else if(popupImagesPointer == 0 && loopingImages)
              popupImagesPointer = popupImages.length-1;
      }

      //vytvorime loadovaci obrazek
      var pomLoading = addLoadingImage(targetImage, 'before');
      //nacteni obrazku do pameti
      var pomimg = new Image();
      //posluchac, ktery zameni fotky!!
      addListener(pomimg, 
         function(e) {
           //odstranime obrazek loadovani
           pomLoading.parentNode.removeChild(pomLoading);
           //nastavime velikost obrazku a rodice coby zastresovaciho prvku
          /* targetImage.style.width = pomimg.width+'px';
           targetImage.style.height = pomimg.height+'px';
           targetImage.parentNode.style.width = pomimg.width+'px';
           targetImage.parentNode.style.height = pomimg.height+'px';*/
           imageResizing(targetImage, targetImage.width, pomimg.width, targetImage.height, pomimg.height);
           targetImage.src = pomimg.src;
         } 
         ,'load');
        //WARNING - spolehame na to, ze v popupImages jsou ulozeny
        //pouze elementy tagu odkazu, tedy <a> !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
        pomimg.src = popupImages[popupImagesPointer].href;
      return true;
  }

  /**
   * Fce zjistuje pozici mysi
   *
   * @param Event e  udalost mysi
   * @return {x,y}  vraci dvojici urcujici pozici mysi
   */
  function getMousePosition(e) {
      if(e.pageX) {
          return {x:e.pageX, y:e.pageY};
      } else {
          return {x:e.clientX, y:e.clientY}
      }
  }


 /**
   * Fce zpusobi, ze se element bude dat presouvat pomoci mysi
   * v mozille totiz neni udalost ondrag definovana, tudiz ji musime
   * simulovat
   *
   * @param Event e  mousedown udalost
   * @param Element element  element, ktery se ma presouvat
   * @return boolean
   */
  function handleDragAndDrop(e, element) {
      //zastavime protekani udalosti a zrusime defaultni akci prvku
      if( e.stopPropagation ) { e.stopPropagation(); }
      e.cancelBubble = true;
      if( e.preventDefault ) { e.preventDefault(); }
      e.returnValue = false;

      dragAndDropElement.element = element;
      dragAndDropElement.mousePos = getMousePosition(e); 
      dragAndDropElement.startPos = {x:element.left, y:element.top};
      if(dragAndDropElement.mousePos.x == false)
          return false;
      //DEBUG
      //alert(dragAndDropElement.mousePos.x+'\n element a jeho x:'+
      //dragAndDropElement.element.left+' element a jeho stylex:'+element.style.left);

      //nadefinujeme posluchace pro onmousemove a onmouseup
      addListener(document, handleDragMouseMove, 'mousemove');
      addListener(document, handleDragMouseUp, 'mouseup');

      return false;
  }


  /**
   * Fce uvolni posluchace pro presun a mysi
   *
   * @param Event e  udalost posunu mysi - pocitame, ze je definovana nad
   *   elementem dragAndDropElement
   * @return true
   */
  function handleDragMouseMove(e) {
      //zjistime novou pozici mysi
      var newPos = getMousePosition(e);

      //nastavime pozice (primo pres style.top to nelze delat
      //protoze tam je ulozen retezec s 'px' a ne jen cislo
      dragAndDropElement.element.top = 
          dragAndDropElement.element.top+
          newPos.y-dragAndDropElement.mousePos.y; 
      dragAndDropElement.element.left = 
          dragAndDropElement.element.left+
          newPos.x-dragAndDropElement.mousePos.x; 
      
      //presuneme prvek
      dragAndDropElement.element.style.left = dragAndDropElement.element.left+'px';
      dragAndDropElement.element.style.top = dragAndDropElement.element.top+'px';
      //DEBUG
      //document.getElementById('popisek').innerHTML = 'X:'+newPos.x+', Y:'+newPos.y;

      dragAndDropElement.mousePos = newPos;
      return false;
  }

  /**
   * Fce uvolni posluchace pro presun a mysi
   *
   * @param Event e  udalost spusteni mysi - pocitame, ze je definovana nad
   *   elementem dragAndDropElement
   * @return true
   */
  function handleDragMouseUp(e) {
      removeListener(document, handleDragMouseUp, 'mouseup');
      removeListener(document, handleDragMouseMove, 'mousemove');
      //pokud jsme se nikam nepohli, predame rizeni do handleClick
      //tam se kontroluje, zda jsme pred klikem neposouvali
      if(dragAndDropElement.startPos.x == dragAndDropElement.element.left &&
              dragAndDropElement.startPos.y == dragAndDropElement.element.top)
          dragAndDropElement.element = null;
      dragAndDropElement.mousePos = {x:-1, y:-1};

      return false;
  }

  /**
   * Fce vezme vsechny elementy <a> s atributem 'rel' a jeho hodnotou 
   * definovanou promenou relName a vlozi je do globalniho pole
   * popupImages
   *
   * @return boolean
   */
  function findAllRel() {
      var allA = document.getElementsByTagName('a');
      var i = 0;
      for(i=0;i<allA.length;i++) {
          if(allA[i].getAttribute('rel') == relName){
            popupImages.push(allA[i]);
          }
      }
      if(popupImages.length==0) {
          popupImagesPointer = -1;
          return false;
      }
      popupImagesPointer = 0;
      return true;
  }

  /**
   * Fce projde globalni pole popupImages a zjisti, zda se v nem vyskytuje
   * element elem, pokud ano, nastavi pointer popupImagesPointer na hodnotu
   * tohoto prvku v poli, jinak nastavi -1
   *
   * @param Element elem  element, ktery je hledan
   * @return boolen
   */
  function findElementInPopupImagesArray(elem) {
      var i=0;
      for(i=0;i<popupImages.length;i++) {
          if(popupImages[i] == elem) {
              popupImagesPointer = i;
              return true;
          }
      }
      popupImagesPointer = -1;
      return false;
  }

  /**
   * Fce prida k obrazku loadovaci obrazek
   *
   * @param Element toWhatElement  ke kteremu elementu ma byt obrazek pridan
   * @param string where 'before'/'into'  urcuje kam bude element loadingImage
   *   vlozen - zda pred prvek toWhatElement nebo do prvku toWhatElement
   * @return Element  odkaz na pridany element obrazku
   */
  function addLoadingImage(toWhatElement, where) {
      var imageLoading = document.createElement('img');
      imageLoading.src = loadingImagePath;
      imageLoading.style.borderStyle = 'none';
      imageLoading.style.position = 'absolute';
      imageLoading.style.zIndex = toWhatElement.style.zIndex+1;
      if(where == 'before') 
          toWhatElement.parentNode.insertBefore(imageLoading, toWhatElement);
      else
          toWhatElement.appendChild(imageLoading);
      return imageLoading;
  }
   
/*
    //zmena obrazku
    function changeImg(obr) {
      var ret = obr.src;
      var suffix = ret.substring(ret.length-4, ret.length);
      if(ret.indexOf("-fial")!=-1) {
        ret = ret.substring(0,ret.length-9);
        ret = ret + suffix; 
      } else {
        ret = ret.substring(0,ret.length-4);
        ret = ret + "-fial" + suffix; 
      }
      obr.src = ret;
    }
*/