function $(what){
    return document.getElementById(what);
  }

function getPicture(url, txt){
  $("showPic").src=url;
  if (arguments.length > 1)
  {
    $("showDesc").textContent=txt;
  }
  var pos = $("contentImgshow") && $("contentImgshow").offsetTop;
  window.scroll(window.scrollX, pos);
}
  
(function()
{
  
// Production steps of ECMA-262, Edition 5, 15.4.4.19  
  // Reference: http://es5.github.com/#x15.4.4.19  
  if (!Array.prototype.map) {  
    Array.prototype.map = function(callback, thisArg) {  
  
      var T, A, k;  
  
      if (this == null) {  
        throw new TypeError(" this is null or not defined");  
      }  
  
      // 1. Let O be the result of calling ToObject passing the |this| value as the argument.  
      var O = Object(this);  
  
      // 2. Let lenValue be the result of calling the Get internal method of O with the argument "length".  
      // 3. Let len be ToUint32(lenValue).  
      var len = O.length >>> 0;  
  
      // 4. If IsCallable(callback) is false, throw a TypeError exception.  
      // See: http://es5.github.com/#x9.11  
      if ({}.toString.call(callback) != "[object Function]") {  
        throw new TypeError(callback + " is not a function");  
      }  
  
      // 5. If thisArg was supplied, let T be thisArg; else let T be undefined.  
      if (thisArg) {  
        T = thisArg;  
      }  
  
      // 6. Let A be a new array created as if by the expression new Array(len) where Array is  
      // the standard built-in constructor with that name and len is the value of len.  
      A = new Array(len);  
  
      // 7. Let k be 0  
      k = 0;  
  
      // 8. Repeat, while k < len  
      while(k < len) {  
  
        var kValue, mappedValue;  
  
        // a. Let Pk be ToString(k).  
        //   This is implicit for LHS operands of the in operator  
        // b. Let kPresent be the result of calling the HasProperty internal method of O with argument Pk.  
        //   This step can be combined with c  
        // c. If kPresent is true, then  
        if (k in O) {  
  
          // i. Let kValue be the result of calling the Get internal method of O with argument Pk.  
          kValue = O[ k ];  
  
          // ii. Let mappedValue be the result of calling the Call internal method of callback  
          // with T as the this value and argument list containing kValue, k, and O.  
          mappedValue = callback.call(T, kValue, k, O);  
  
          // iii. Call the DefineOwnProperty internal method of A with arguments  
          // Pk, Property Descriptor {Value: mappedValue, Writable: true, Enumerable: true, Configurable: true},  
          // and false.  
  
          // In browsers that support Object.defineProperty, use the following:  
          // Object.defineProperty(A, Pk, { value: mappedValue, writable: true, enumerable: true, configurable: true });  
  
          // For best browser support, use the following:  
          A[ k ] = mappedValue;  
        }  
        // d. Increase k by 1.  
        k++;  
      }  
  
      // 9. return A  
      return A;  
    };
  }

  // pragmatism
  // click to next
  $("showPic") && $("showPic").addEventListener("click", function(){
    var rightThumbnails = $("rightThumbnails");
    var links = rightThumbnails.querySelectorAll(".fakelink");
    if(links.length > 0)
    {2
      links = Array.prototype.slice.call(links, 0);
      links = links.map(function(elem)
        {
          // onclick looks like getPicture('../bilder/praxis/wartebereich1-2.jpg')
          var onclick = elem.getAttribute("onclick");
          return onclick.split("'")[1];
        });
      var current = links.indexOf($("showPic").getAttribute("src"));
      var next = current + 1;
      if (!links[next])
      {
        next = 0;
      }
      $("showPic").src = links[next];
    }
  }, false);

  var full_anim = false;
  var anim_cont = document.getElementById("headgraphic");
  if (anim_cont)
    full_anim = true;
  else
    anim_cont = document.getElementById("head-graphic");

  var make_elem = function(x, y, className)
  {
    var b = document.createElement("b");
    b.className = "abs " + className;
    b.style.left = x * 190 + "px";
    b.style.top = y * 90 + "px";
    return anim_cont.appendChild(b);
  }

  var img_anim = function(anim)
  {
    var picture = pictures[anim.img];
    var elems = [];
    
    var count = 1;
    for (var y_ind = 0; y_ind < picture.size[1] ; y_ind++)
    {
      for (var x_ind = 0; x_ind < picture.size[0] ; x_ind++)
      {
        elems.push( make_elem(anim.pos[0]+x_ind, anim.pos[1]+y_ind, anim.img + count++ ));
      }
    }

    if (anim.animtype === "random")
      elems.sort(function(a, b){return !Math.round(Math.random())});

    var make_show_func = function(img)
    {
      return function(){ img.style.opacity = 0.7 + (Math.random()*0.3); };
    }

    var make_hide_func = function(img)
    {
      return function(){ img.style.opacity = 0; };
    }

    return {
      show: function()
      {
        for (var j = 0, img; img = elems[j]; j++)
        {
          setTimeout(make_show_func(img), (j * anim.delay) * 1000 );
        }
      },
      hide: function()
      {
        elems.reverse();
        for (var j = 0, img; img = elems[j]; j++)
          setTimeout(make_hide_func(img), (anim.keep_duration + (j * anim.delay)) * 1000 );
      }
    }
  }


  var pictures = {
    "strandkorb": {
      size: [1, 2]
    },
    "leuchtturmfr": {
      size: [1, 3]
    },
    "leuchtturm": {
      size: [1, 3]
    },
    "tree": {
      size: [2, 2]
    },
    "waves": {
      size: [2, 3]
    },
    logo: {
      size: [2, 1]
    },
    couple_one: {
      size: [1, 1]
    },
    couple_two: {
      size: [1, 1]
    },
    girl_blanket: {
      size: [1, 2]
    },
    girl_beach: {
      size: [1, 3]
    }
  }
  
  var all_anims_sequence = [
    {
      img: "leuchtturmfr",
      pos: [1, 0],
      delay: 0.4,
      animtype: "random",
      keep_duration: 4
    },
    {
      delay_before: 3.5,
      img: "logo",
      pos: [3, 2],
      delay: 0.4,
      animtype: "random",
      keep_duration: 4
    },
    {
      delay_before: 7,
      img: "waves",
      pos: [0, 0],
      delay: 0.4,
      animtype: "random",
      keep_duration: 4
    },
    {
      delay_before: 10.5,
      img: "strandkorb",
      pos: [3, 0],
      delay: 0.4,
      animtype: "random",
      keep_duration: 4
    },
    {
      delay_before: 14,
      img: "tree",
      pos: [2, 0],
      delay: 0.4,
      animtype: "random",
      keep_duration: 4
    },
    {
      delay_before: 17.5,
      img: "couple_one",
      pos: [0, 2],
      delay: 0.4,
      animtype: "random",
      keep_duration: 4
    },
    {
      delay_before: 21,
      img: "leuchtturm",
      pos: [4, 0],
      delay: 0.4,
      animtype: "random",
      keep_duration: 4
    },
    {
      delay_before: 24.5,
      img: "girl_blanket",
      pos: [1, 1],
      delay: 0.4,
      animtype: "random",
      keep_duration: 4
    },
    {
      delay_before: 28,
      img: "couple_two",
      pos: [0, 2],
      delay: 0.4,
      animtype: "random",
      keep_duration: 4
    },
    {
      delay_before: 31.5,
      img: "strandkorb",
      pos: [4, 1],
      delay: 0.4,
      animtype: "random",
      keep_duration: 4
    },
    {
      delay_before: 35,
      img: "logo",
      pos: [2, 2],
      delay: 0.4,
      animtype: "random",
      keep_duration: 4
    }
  ];

  var sequences = [
    [
      {
        img: "couple_one",
        pos: [4, 0],
        delay: 0.4,
        animtype: "random",
        keep_duration: 2
      },
      {
        delay_before: 1.5,
        img: "girl_blanket",
        pos: [0, 0],
        delay: 0.4,
        animtype: "random",
        keep_duration: 3
      },
      {
        delay_before: 3,
        img: "logo",
        pos: [2, 1],
        delay: 0.4,
        animtype: "random",
        keep_duration: 4
      }
    ],
    [
      {
        img: "strandkorb",
        pos: [4, 0],
        delay: 0.4,
        animtype: "random",
        keep_duration: 2
      },
      {
        delay_before: 1.5,
        img: "couple_two",
        pos: [1, 1],
        delay: 0.4,
        animtype: "random",
        keep_duration: 3
      },
      {
        delay_before: 3,
        img: "logo",
        pos: [1, 0],
        delay: 0.4,
        animtype: "random",
        keep_duration: 4
      }
    ],
    [
      {
        img: "strandkorb",
        pos: [0, 0],
        delay: 0.4,
        animtype: "random",
        keep_duration: 3
      },
      {
        delay_before: 2,
        img: "logo",
        pos: [3, 1],
        delay: 0.4,
        animtype: "random",
        keep_duration: 4
      }
    ]
  ];
  
  var anim_sequence = all_anims_sequence;
  if (!full_anim)
  {
    // all pages but "/" get smaller, shorter anims
    var seq_num = Math.round(Math.random() * (sequences.length - 1));
    anim_sequence = sequences[seq_num];
    // full-anim doesn't have the b elems for the background
    var colors = ["#cfeff3", "#e0f5f8", "#fff", "#fff", "#9fe8f3", "#eaf8fa"];
    for (var i = 0; i < 10; i++)
    {
      var e = document.createElement("b");
      color_num = Math.round(Math.random() * (colors.length - 1));
      e.style.backgroundColor = colors[color_num];
      anim_cont.appendChild(e);
    }
  }

  for (var i = 0, startAnim; startAnim = anim_sequence[i]; i++)
  {
    var anim = new img_anim(startAnim);
    setTimeout(anim.show, (startAnim.delay_before || 0) * 1000);
    if (i + 2 < anim_sequence.length) // keep the last 2 pictures on
    {
      setTimeout(anim.hide, ((startAnim.delay_before || 0) + startAnim.keep_duration) * 1000);
    }
  }

  // Returns the version of Internet Explorer or a -1
  // (indicating the use of another browser).
  function getIEVersion()
  {
    var rv = -1; // Return value assumes failure.
    if (navigator.appName == 'Microsoft Internet Explorer')
    {
      var ua = navigator.userAgent;
      var re = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
      if (re.exec(ua) != null)
        rv = parseFloat( RegExp.$1 );
    }
    return rv;
  }
  function checkVersion()
  {
    var msg = "You're not using Internet Explorer.";
    var ver = getIEVersion();

    if ( ver > -1 )
    {
      if ( ver >= 8.0 ) 
        msg = "You're using a recent copy of Internet Explorer."
      else
        msg = "You should upgrade your copy of Internet Explorer.";
    }
    alert( msg );
  }

  var ie_version = getIEVersion();
  if (ie_version == -1 || ie_version >= 10)
  {
    if (document && document.getElementsByClassName)
    {
      var js_elems = document.getElementsByClassName("js");
      for (var i = 0, elem; elem = js_elems[i]; i++) { 
        elem.style.display = "block";
      }
      var no_js_elems = document.getElementsByClassName("no-js");
      for (i = 0, elem; elem = no_js_elems[i]; i++) { 
        elem.style.display = "none";
      }
    }
    var hg = document.getElementById("head-graphic");
    if (hg)
    {
      hg.className = "hasJS";
    }
  }
  
  
})();