/**
* Create/Read/Delete Cookies - based on code from PPK
* http://www.quirksmode.org/js/cookies.html
*/
var COOKIE = function() {

  return {

    /*
    * @param  {String}  name   The cookie name
    * @param  {String}  value  The value to store
    * @param  {Integer} days   The number of days to store the value
    */
    create: function(name, value, days) {
      if (days) {
        var date = new Date();
        date.setTime(date.getTime()+(days*24*60*60*1000));
        var expires = "; expires="+date.toGMTString();
      }
      else var expires = "";
      document.cookie = name+"="+value+expires+"; path=/";
    },

    /*
    * @param  {String}  name   The cookie name
    */
    read: function(name) {
      var nameEQ = name + "=";
      var ca = document.cookie.split(';');
      for(var i=0;i < ca.length;i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1,c.length);
        if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
      }
      return null;
    },

    /*
    * @param  {String}  name   The cookie name
    */
    erase: function(name) {
      COOKIE.create(name,"",-1);
    }

  };

}(); // end COOKIE

/*globals YAHOO Raphael */
var WOLFSBURG = function() {

  var $E  = YAHOO.util.Event;
  var $D  = YAHOO.util.Dom;
  var $A  = YAHOO.util.Anim;
  var $S  = YAHOO.util.Scroll;
  var $   = YAHOO.util.Dom.get;

  var isScrolled = false;
  var videos = [];

  var speed = 0.5,    // Speed of animations in Archive (in seconds)
      positions = [], // References to each visible <LI>
      els = [],       // HTMLCollection of <LI>'s in Archive
      imgs = [],      // HTMLCollection of <IMG>'s in Archive
      years = {};     // Index of first entry in each year of the Archive

  // Image animation configuration for Archive
  var imgConfigs = {
    0: { width: {to: 800}, height: {to: 567}, opacity: { to: 0.00} },
    1: { width: {to: 480}, height: {to: 340}, opacity: { to: 1.00} },
    2: { width: {to: 390}, height: {to: 276}, opacity: { to: 0.50} },
    3: { width: {to: 325}, height: {to: 230}, opacity: { to: 0.30} },
    4: { width: {to: 230}, height: {to: 163}, opacity: { to: 0.20} },
    5: { width: {to: 145}, height: {to: 103}, opacity: { to: 0.15} },
    6: { width: {to:  73}, height: {to:  52}, opacity: { to: 0.10} },
    7: { width: {to:   4}, height: {to:   3}, opacity: { to: 0.00} }
  };

  // Special <LI> animation configuration for Archive
  var specialConfigs = {
    'pos0FadeIn': { opacity: {from: 0, to: 1} },
    'pos0FadeOut': { opacity: {to: 0} }
  };

  // <LI> animation configuration for Archive
  var liConfigs = {
    0: { width: {to: 800}, height: {to: 567}, zIndex: {to:  80}, left: {to: -120}, top: {to:   0} },
    1: { width: {to: 480}, height: {to: 340}, zIndex: {to:  70}, left: {to:    0}, top: {to:   0} },
    2: { width: {to: 390}, height: {to: 276}, zIndex: {to:  60}, left: {to:   42}, top: {to:  -8} },
    3: { width: {to: 325}, height: {to: 230}, zIndex: {to:  50}, left: {to:   78}, top: {to: -16} },
    4: { width: {to: 230}, height: {to: 163}, zIndex: {to:  40}, left: {to:  120}, top: {to: -24} },
    5: { width: {to: 145}, height: {to: 103}, zIndex: {to:  30}, left: {to:  163}, top: {to: -32} },
    6: { width: {to:  73}, height: {to:  52}, zIndex: {to:  20}, left: {to:  198}, top: {to: -40} },
    7: { width: {to:   4}, height: {to:   3}, zIndex: {to:  10}, left: {to:  200}, top: {to: -48} }
  };

  return {

    index: [],        // List of all archive records - loaded in activateArchive()

    animCount: 0,     // Number of elements being animated
    wait: null,       // The "waiting" spinner object (loading Archive images)
    waitingFor: null, // Id of element to jumpTo() after loading is completed

    loading: false,   // Are we loading images?
    loadCount: 0,     // Count of images being loaded

    /**
    * Creates an animated "loading" spinner centered over the specified holder
    * Source: http://raphaeljs.com/spin-spin-spin.html
    */
    spinner: function(holderid, colour, offsetX, offsetY, R1, R2, count, stroke_width) {
      var region = $D.getRegion(holderid);
      var sectorsCount = count || 12,
        color = colour || "#000",
        width = stroke_width || 3,
        r1 = Math.min(R1, R2) || 10,
        r2 = Math.max(R1, R2) || 20,
        cx = r2 + width,
        cy = r2 + width,
        sectors = [],
        opacity = [],
        beta = 2 * Math.PI / sectorsCount,
        pathParams = {stroke: color, "stroke-width": width, "stroke-linecap": "round"};
      var x = offsetX || region.width/2-(r2*2+width), 
          y = offsetY || region.height/2-(r2*2+width);
      var r = new Raphael(holderid, region.width, region.height);
      Raphael.getColor.reset();
      for (var i = 0; i < sectorsCount; i++) {
        var alpha = beta * i - Math.PI / 2,
          cos = Math.cos(alpha),
          sin = Math.sin(alpha);
        opacity[i] = 1 / sectorsCount * i;
        sectors[i] = r.path([["M", (cx + r1 * cos)+x, (cy + r1 * sin)+y], ["L", (cx + r2 * cos)+x, (cy + r2 * sin)+y]]).attr(pathParams);
        if (color == "rainbow") {
          sectors[i].attr("stroke", Raphael.getColor());
        }
      }
      var tick;
      (function ticker() {
        opacity.unshift(opacity.pop());
        for (var i = 0; i < sectorsCount; i++) {
          sectors[i].attr("opacity", opacity[i]);
        }
        r.safari();
        tick = setTimeout(ticker, 1000 / sectorsCount);
      })();
      return function () {
        clearTimeout(tick);
        if(r) {
          r.remove();
        }
      };
    }, // end spinner()

    /**
    * Adjust the speed of the archive animations
    * @param  int  The speed in seconds
    */
    setSpeed: function(s) {
      speed = s;
    },

    /**
    * Preload the next [five] images in the archive
    * @param  int  The number of images to load
    */
    preLoad: function() {

      if(WOLFSBURG.loadCount > 0) {
        return;
      }

      var last = $D.getLastChild('resultset'),
          toLoad = [],
          count = 6,
          complete = function(e) { 
            WOLFSBURG.loadCount--; 
            els = $('resultset').getElementsByTagName('li');
            if(WOLFSBURG.loadCount === 0 && WOLFSBURG.wait) {
              $D.setStyle($('spin'), 'zIndex', 0);
              WOLFSBURG.wait();
              WOLFSBURG.wait = null;
              if(WOLFSBURG.waitingFor) {
                var next = $D.getElementsByClassName(WOLFSBURG.waitingFor, 'li', 'resultset');
                if(next.length) {
                  return WOLFSBURG.jumpTo(next[0]);
                }
              }
            }
          },
          li, a, img;

      if(arguments.length) {
        count = arguments[0];
      }

      if(last) {
        for (var i = 0; i < WOLFSBURG.index.length; i++) {
          if(last.id == 'exhibition-'+WOLFSBURG.index[i].id) {
            WOLFSBURG.loading = true;
            for (var j = 1; j <= count; j++) {
              if(WOLFSBURG.index[i+j]) {
                li = document.createElement('li');
                a = document.createElement('a');
                img = new Image();
                $E.on(img, 'load', complete);
                li.id = 'exhibition-'+WOLFSBURG.index[i+j].id;
                $D.addClass(li, WOLFSBURG.index[i+j].start_date.slice(0,4));
                $D.setStyle(li, 'zIndex', 0);
                $D.setStyle(li, 'display', 'none');
                a.href = WOLFSBURG.index[i+j].url;
                img.src = WOLFSBURG.index[i+j].image;
                WOLFSBURG.loadCount++;
                a.appendChild(img);
                li.appendChild(a);
                $('resultset').appendChild(li);
              }
            }
            break;
          }
        }
      }
    },

    /**
    * Adjust archive display to viewport size
    */
    resize: function() {
      var r = $D.getClientRegion();
      if($D.hasClass(document.body, 'archive-active')) {
        $D.setStyle(['mask', 'content'], 'width', r.width+'px');
        $D.setStyle(['mask', 'content'], 'height', r.height+'px');
        $D.setStyle('resultset', 'left', (r.width/2-220)+'px');
        $D.setStyle('resultset', 'top', (r.height/2-150)+'px');
      } else if($('mask')) {
        $D.setStyle('mask', 'width', r.width+'px');
        $D.setStyle('mask', 'height', $D.getDocumentHeight()+'px');
        $D.setStyle('stage', 'left', (r.width/2-220)+'px');
        $D.setStyle('stage', 'top', (r.height/2-150)+'px');
      }
    },

    /**
    * Animate all els so that the passed el is topmost
    * @param  HTMLLiElement  The <li> to "scroll" to
    */
    jumpTo: function(el) {
      if(WOLFSBURG.animCount > 0) {
        return;
      }
      WOLFSBURG.preLoad();
      var animPlus = function(e) { WOLFSBURG.animCount++; },
          animMinus = function(e) { WOLFSBURG.animCount--; },
          adjustBG = function(e) { 
            if($D.getStyle(this.getEl(), 'zIndex') > 70) { 
              $D.setStyle(this.getEl(), 'backgroundColor', 'transparent'); 
            } else {
              $D.setStyle(this.getEl(), 'backgroundColor', '#000'); 
            }
          },
          show = function(e) { $D.setStyle(this.getEl(), 'display', 'block'); },
          hide = function(e) { $D.setStyle(this.getEl(), 'display', 'none'); },
          region = $D.getClientRegion(),
          position = 0,
          liAnims = [],
          fadeAnims = [],
          imgAnims = [],
          ease = null;
      for (var i = 0; i < els.length; i++) {
        if(els[i] == el) {
          position++;
          liAnims[i] = new YAHOO.util.Motion(els[i], liConfigs[position], speed, ease);
          if($D.getStyle(els[i], 'zIndex') >= '80') {
            fadeAnims[i] = new YAHOO.util.Anim(els[i], specialConfigs.pos0FadeIn, speed, ease);
          }
          liAnims[i].onStart.subscribe(show);
          imgAnims[i] = new YAHOO.util.Motion(els[i].getElementsByTagName('img')[0], imgConfigs[position], speed, ease);
          positions[position] = els[i];
          position++;
          $D.removeClass($('timeline').getElementsByTagName('li'), 'selected');
          $D.addClass($('goto-'+els[i].className).parentNode, 'selected');
        } else if(position === 0) { //  && $D.getStyle(els[i], 'display') == 'block'
          liAnims[i] = new YAHOO.util.Motion(els[i], liConfigs[0], speed, ease);
          fadeAnims[i] = new YAHOO.util.Anim(els[i], specialConfigs.pos0FadeOut, speed, ease);
          imgAnims[i] = new YAHOO.util.Motion(els[i].getElementsByTagName('img')[0], imgConfigs[0], speed, ease);
          liAnims[i].onComplete.subscribe(hide);
          // liAnims[i].onComplete.subscribe(adjustBG);
        } else if(liConfigs[position]) {
          positions[position] = els[i];
          if($D.getStyle(els[i], 'zIndex') >= '80') {
            $D.setStyle(els[i], 'zIndex', 80-position);
            fadeAnims[i] = new YAHOO.util.Anim(els[i], specialConfigs.pos0FadeIn, (speed/position).toFixed(2), ease);
          } else if($D.getStyle(els[i], 'zIndex') <= '10') {
            $D.setStyle(els[i], 'zIndex', 20-position);
          }
          liAnims[i] = new YAHOO.util.Motion(els[i], liConfigs[position], speed, ease);
          liAnims[i].onStart.subscribe(show);
          imgAnims[i] = new YAHOO.util.Motion(els[i].getElementsByTagName('img')[0], imgConfigs[position], speed, ease);
          position++;
        } else { //  && $D.getStyle(els[i], 'display') == 'block'
          liAnims[i] = new YAHOO.util.Motion(els[i], liConfigs[7], speed, ease);
          imgAnims[i] = new YAHOO.util.Motion(els[i].getElementsByTagName('img')[0], imgConfigs[7], speed, ease);
          liAnims[i].onComplete.subscribe(hide);
        }
        if(liAnims[i]) {
          liAnims[i].onStart.subscribe(adjustBG);
          liAnims[i].onComplete.subscribe(adjustBG);
          liAnims[i].onStart.subscribe(animPlus);
          imgAnims[i].onStart.subscribe(animPlus);
          liAnims[i].onComplete.subscribe(animMinus);
          imgAnims[i].onComplete.subscribe(animMinus);
          liAnims[i].animate();
          if(fadeAnims[i]) {
            fadeAnims[i].animate();
          }
          imgAnims[i].animate();
        }

      }

    },

    /**
    * Setup the archive system
    * 
    * Load the full index with XMLHTTPRequest, setup event handlers and
    * animate the visible images to the "Time Machine" interface
    */
    activateArchive: function() {

      // Parse the archive data
      var handleSuccess = function(o){
        try {
          WOLFSBURG.index = YAHOO.lang.JSON.parse(o.responseText);
          for(var i in WOLFSBURG.index) {
            if(!years[WOLFSBURG.index[i].start_date.slice(0,4)]) {
              years[WOLFSBURG.index[i].start_date.slice(0,4)] = 'exhibition-'+WOLFSBURG.index[i].id;
            }
          }
        }
        catch (x) {
          // console.log(x);
          // alert("JSON Parse failed!");
          // return;
        }
      };

      // Lookup the complete archive
      var request = YAHOO.util.Connect.asyncRequest('GET', '/ausstellungen/archiv/?json', { 
        success:handleSuccess }); 

      // Setup events to move to specific entries
      $E.on(document, 'keydown', function(e) {
        if(e.keyCode == 38 || e.keyCode == 40) {
          $E.stopEvent(e);
        }
        for (var i = 0; i < els.length; i++) {
          if(els[i] == positions[1] && e.keyCode == 38 && els[i+1]) {
            return WOLFSBURG.jumpTo(els[i+1]);
          } else if(els[i] == positions[1] && e.keyCode == 40 && els[i-1]) {
            return WOLFSBURG.jumpTo(els[i-1]);
          }
        }
      });

      $E.on(['step-back', 'step-forward'], 'click', function(e) {
        $E.stopEvent(e);
        for (var i = 0; i < els.length; i++) {
          if(els[i] == positions[1] && this.id == 'step-forward' && els[i+1]) {
            return WOLFSBURG.jumpTo(els[i+1]);
          } else if(els[i] == positions[1] && this.id == 'step-back' && els[i-1]) {
            return WOLFSBURG.jumpTo(els[i-1]);
          }
        }
      });

      $E.on('timeline', 'click', function(e) {
        $E.stopEvent(e);
        var year = $E.getTarget(e).id.slice(5);
        $D.setStyle(els, 'opacity', 1);
        if($(years[year])) {
          return WOLFSBURG.jumpTo($(years[year]));
        } else {
          WOLFSBURG.wait = WOLFSBURG.spinner($('spin'));
          WOLFSBURG.waitingFor = year;
          $D.setStyle($('spin'), 'zIndex', 90);
          WOLFSBURG.preLoad(WOLFSBURG.index.length);
        }
      });

      $E.on('resultset', 'click', function(e) {
        $E.stopEvent(e);
        if(positions[1]) {
          window.location = positions[1].getElementsByTagName('a')[0].href;
        }
      });

      els = $('resultset').getElementsByTagName('li');

      var region = $D.getClientRegion();
      var z = 50;
      var center = 0;
      var wrap = $('wrapper');

      // Create and activate mask
      var mask = document.createElement('div');
      mask.id = 'mask';
      $D.setStyle(mask, 'zIndex', 10);
      $D.setStyle(mask, 'position', 'absolute');
      $D.setStyle(mask, 'backgroundColor', '#000');
      $D.setStyle(mask, 'opacity', 0);
      $D.setStyle(mask, 'width', region.width+'px');
      $D.setStyle(mask, 'height', $D.getDocumentHeight()+'px');
      $D.setXY(mask, [0,0]);
      wrap.appendChild(mask);

      var spin = document.createElement('div');
      spin.id = 'spin';
      $D.setStyle(spin, 'zIndex', 0);
      $D.setStyle(spin, 'position', 'absolute');
      $D.setStyle(spin, 'width', region.width+'px');
      $D.setStyle(spin, 'height', region.height+'px');
      $D.setXY(spin, [0,0]);
      wrap.appendChild(spin);

      var bg = new YAHOO.util.Anim(mask, { opacity: { to: 1 }}, 0.25);
      bg.onStart.subscribe(function() {
        var bd = document.body;
        if(YAHOO.env.ua.ie || YAHOO.env.ua.gecko) {
          bd = document.documentElement;
        }
        if(bd.scrollTop > 0 || bd.scrollLeft > 0) {
          var scrollAnim = new YAHOO.util.Scroll(bd, {
            scroll: { to: [0, 0] }
          }, 0.5, YAHOO.util.Easing.easeBoth);
          scrollAnim.animate();
        }
      });
      bg.onComplete.subscribe(function() {
        var spread = function() { WOLFSBURG.jumpTo(els[0]); },
            anims = [],
            xys = [];
        for (var i = 0; i < els.length; i++) {
          xys[i] = $D.getXY(els[i]);
        }
        $D.setStyle('content', 'margin', 0);
        $D.setStyle('content', 'width', region.width+'px');
        $D.setStyle('content', 'height', region.height+'px');
        $D.setStyle('resultset', 'width', '480px');
        $D.setStyle('resultset', 'height', '340px');
        $D.setStyle('resultset', 'left', region.width/2-240+'px');
        $D.setStyle('resultset', 'top', region.height/2-150+'px');
        $D.addClass(document.body, 'archive-active');
        $D.setStyle(els, 'display', 'block'); // some els are display: none
        // Set image positions and animate them to the center
        for (i = 0; i < els.length; i++) {
          $D.setStyle(els[i], 'zIndex', 100-(i*10));
          anims[i] = new YAHOO.util.Motion(els[i], {
            points: { 
              from: xys[i],
              to: [(region.width/2-240), (region.height/2-170)] 
            }
          }, 0.7, YAHOO.util.Easing.easeBoth);
          if(i+1 == els.length) {
            anims[i].onComplete.subscribe(spread);
          }
          anims[i].animate();
        }

      });
      bg.animate();

      // Determine current position of each image
      var xys = [];
      var anims = [];
      for (var i = 0; i < els.length; i++) {
        xys[i] = $D.getXY(els[i]);
      }

      // Shift the resultset to the front
      $D.setStyle('content', 'zIndex', 11);

      $E.on(window, 'resize', WOLFSBURG.resize);

      return;

    },

    /**
    * Scroll the page to the passed position
    * @param  int  The Page X position
    * @param  int  The Page Y position
    */
    animate: function(x,y) {

      var motionAnim = new YAHOO.util.Motion($('content'), {
        points: { to: [x,y] }
      }, 0.7, YAHOO.util.Easing.easeBoth);

      var bd = document.body;

      if(YAHOO.env.ua.ie || YAHOO.env.ua.gecko) {
        bd = document.documentElement;
      }

      if(bd.scrollTop > 0 || bd.scrollLeft > 0) {
        var scrollAnim = new YAHOO.util.Scroll(bd, {
          scroll: { to: [0, 0] }
        }, 0.5, YAHOO.util.Easing.easeBoth);
        scrollAnim.onComplete.subscribe(function() {
          motionAnim.animate();
        });
        scrollAnim.animate();
      } else {
        motionAnim.animate();
      }

    },

    /**
    * Setup and/or display a lightbox with the Impressions images
    */
    impressions: function() {

      var r = $D.getClientRegion();

      if(!$('mask')) {
        var mask = document.createElement('div'),
            stage = document.createElement('div'),
            head = document.createElement('h2'),
            close = document.createElement('div'),
            caption = document.createElement('p'),
            img = new Image,
            next = document.createElement('div'),
            prev = document.createElement('div');

        mask.id = 'mask';
        stage.id = 'stage';
        img.id = 'stage-image';
        next.id = 'next';
        prev.id = 'prev';
        close.id = 'close';
        caption.id = 'caption';

        $D.setXY(mask, [0,0]);
        $('wrapper').appendChild(mask);

        head.appendChild(document.createTextNode('Impressionen'));
        close.appendChild(document.createTextNode('Fenster schließen'));
        next.appendChild(document.createTextNode('nächstes Bild'));
        prev.appendChild(document.createTextNode('vorheriges Bild'));

        $E.on(['prev', 'next'], 'click', function(e) {
          $E.stopEvent(e);
          var imgs = $('impressions').getElementsByTagName('img'),
              spans, n;
          for (var i = 0; i < imgs.length; i++) {
            if(imgs[i].src.replace('.1.', '.2.') == img.src) {
              if(this.id == 'next') {
                n = i+1;
              } else {
                n = i-1;
              }
              if(imgs[n]) {
                var newImage = new Image();
                $E.on(newImage, 'load', function(e) {
                  img.src = this.full.src;
                  var spans = this.thumb.parentNode.getElementsByTagName('span');
                  if(spans.length) {
                    caption.innerHTML = spans[0].innerHTML;
                  } else {
                    caption.innerHTML = '';
                  }
                }, {'thumb': imgs[n], 'full': newImage}, true);
                newImage.src = imgs[n].src.replace('.1.', '.2.');
              }
              break;
            }
          };
        });

        $E.on('close', 'click', function(e) {
          $E.stopEvent(e);
          var bg = new YAHOO.util.Anim([mask, stage], { opacity: { to: 0 }}, 0.25);
          bg.onComplete.subscribe(function(e) {
            $D.setStyle([mask, stage], 'display', 'none');
          });
          bg.animate();
        });

        $E.on(img, 'load', function(e) {
          if(WOLFSBURG.wait) {
            WOLFSBURG.wait();
            WOLFSBURG.wait = null;
          }
        });

      } else {
        mask = $('mask');
        stage = $('stage');
        img = $('stage-image');
        next = $('next');
        prev = $('prev');
        close = $('close');
        caption = $('caption');
      }

      $D.setStyle(mask, 'width', r.width+'px');
      $D.setStyle(mask, 'height', $D.getDocumentHeight()+'px');

      var bg = new YAHOO.util.Anim(mask, { opacity: { from: 0, to: 0.4 }}, 0.25);
      bg.onStart.subscribe(function(e) {
        $D.setStyle([mask, stage], 'display', 'block');
        $D.setStyle($D.getChildren(stage), 'display', 'none');
        $D.setStyle(stage, 'opacity', 1);
        $D.setStyle(stage, 'width', 1+'px');
        $D.setStyle(stage, 'height', 1+'px');
        $D.setStyle(stage, 'borderWidth', 0);
        $D.setStyle(stage, 'left', r.width/2+'px');
        $D.setStyle(stage, 'top', r.height/2+'px');

        var bd = document.body;

        if(YAHOO.env.ua.ie || YAHOO.env.ua.gecko) {
          bd = document.documentElement;
        }

        if(bd.scrollTop > 0 || bd.scrollLeft > 0) {
          var scrollAnim = new YAHOO.util.Scroll(bd, {
            scroll: { to: [0, 0] }
          }, 0.5, YAHOO.util.Easing.easeBoth);
          scrollAnim.animate();
        }

      });
      bg.onComplete.subscribe(function(e) {
        var stageOpen = new YAHOO.util.Anim(stage, { 
            width: { from: 1, to: 500 }, 
            height: { from: 1, to: 475 }, 
            borderWidth: { from: 0, to: 20, unit: 'px' }, 
            top: { from: r.height/2, to: r.height/2-238 },
            left: { from: r.width/2, to: r.width/2-250 }
        }, 0.25);
        stageOpen.onStart.subscribe(function(e) {
          if(!$D.getFirstChild(stage)) {
            $('wrapper').appendChild(stage);
          }
        });
        stageOpen.onComplete.subscribe(function(e) {
          if(!$D.getFirstChild(stage)) {
            stage.appendChild(head);
            stage.appendChild(close);
            stage.appendChild(img);
            stage.appendChild(next);
            stage.appendChild(prev);
            stage.appendChild(caption);
          } else {
            $D.setStyle($D.getChildren(stage), 'display', 'block');
            img.src = null;
          }
          // WOLFSBURG.wait = WOLFSBURG.spinner(stage);
          var imgs = $('impressions').getElementsByTagName('img'),
              spans = imgs[0].parentNode.getElementsByTagName('span');
          if(imgs.length == 1) {
            $D.setStyle([next, prev], 'opacity', 0);
          }
          img.src = $('impressions').getElementsByTagName('img')[0].src.replace('.1.', '.2.');
          if(spans) {
            caption.innerHTML = spans[0].innerHTML;
          }
        });
        stageOpen.animate();
      });
      bg.animate();

    },

    /**
    * Scroll the page to the top of the section requested
    * @param  MouseClickEvent  The click Event from the primary navigation
    */
    scrollTo: function(e) {

      $E.stopEvent(e);

      if(this.parentNode.parentNode == $('primary')) {
        if(this.href == window.location.href) {
          if(document.getElementById('blog-clone') && document.getElementById('press-clone')) {
            return WOLFSBURG.animate(-960, 20);
          } else if(document.getElementById('blog-clone') || document.getElementById('press-clone')) {
            return WOLFSBURG.animate(-480, 20);
          } else {
            return WOLFSBURG.animate(480, 20);
          }
        } else {
          window.location = this.href;
        }
        return;
      }

      var id = this.href.slice(this.href.indexOf('#')+1);
      var divs = $D.getChildren($('content'));
      var pos = 0;

      if(id == 'impressions') {
        WOLFSBURG.impressions();
      } else if(document.getElementById(id) || document.getElementById(id+'-clone')) {

        if(!document.getElementById(id)) {
          id = id+'-clone';
        }

        for (var i = 0; i < divs.length; i++) {
          if(divs[i].id == id) {
            pos = i*480;
          }
        }
        return WOLFSBURG.animate(480-pos, 20);
      } else {
        window.location = this.href;
      }
      

    },

    /**
    * Initialize the page elements and events
    */
    init: function() {

      $D.addClass(document.body, 'js-active');

      $D.setStyle('content', 'position', 'absolute');
      $D.setStyle('content', 'zIndex', 0);
      $D.setStyle('header', 'zIndex', 10);

      // $E.on(window, 'scroll', function(e) {
      //   if(!$D.hasClass(document.body, 'open')) {
      //     isScrolled = true;
      //     $D.addClass(document.body, 'open');
      //   }
      // });

      $E.onAvailable('title', function(e) {
        var len = $('secondary').getElementsByTagName('li')
        $D.setStyle(this, 'cursor', 'pointer');
        $D.setStyle('address', 'overflow', 'hidden');
        if($('calendar') && $D.hasClass(document.body, 'closed')) {
          $D.setStyle('calendar', 'top', (150+(13*len.length))+'px');
        } else {
          $D.setStyle('calendar', 'top', (350+(13*len.length))+'px');
        }

        $E.on(this.getElementsByTagName('h1'), 'click', function(e) {
          var el = 'news',
              closedTop = 290,
              openTop = 490;
          if($('calendar')) {
            el = 'calendar';
            closedTop = 150+(13*len.length);
            openTop = 350+(13*len.length);
          }
          if($D.hasClass(document.body, 'closed')) {
            var open = new YAHOO.util.Anim('address', { height: { from: 0, to: 200 }}, 0.25, YAHOO.util.Easing.easeBoth);
            open.onComplete.subscribe(function(e) {
              $D.removeClass(document.body, 'closed');
              COOKIE.create('closed', 'no');
            });
            var open2 = new YAHOO.util.Anim(el, { top: { to: openTop }}, 0.25, YAHOO.util.Easing.easeBoth);
            open2.animate();
            open.animate();
          } else {
            var close = new YAHOO.util.Anim('address', { height: { from: 200, to: 0 }}, 0.25, YAHOO.util.Easing.easeBoth);
            close.onComplete.subscribe(function(e) {
              $D.addClass(document.body, 'closed');
              COOKIE.create('closed', 'yes');
            });
            var close2 = new YAHOO.util.Anim(el, { top: { to: closedTop }}, 0.25, YAHOO.util.Easing.easeBoth);
            close2.animate();
            close.animate();
          }
        });
      });

      $E.onAvailable('primary', function(e) {
        if(YAHOO.env.ua.ie < 8 && YAHOO.env.ua.ie > 5) {
          var passed = $D.getElementsByClassName('passed', 'li', this),
              trail = $D.getElementsByClassName('trail', 'li', this);
          for (var i=0; i < passed.length; i++) {
            passed[i].innerHTML = '‹‹ '+passed[i].innerHTML+' /';
          };
          for (i = 0; i < trail.length; i++) {
            if(!$D.hasClass(trail[i], 'passed')) {
              trail[i].innerHTML = trail[i].innerHTML+' /';
            }
          };
        }
      });

      $E.onAvailable('content', function(e) {
        var links = this.getElementsByTagName('a'),
            videos = [];
        for (var i = 0; i < links.length; i++) {
          if(links[i].href.indexOf('vimeo') > 0 || links[i].href.indexOf('youtube') > 0) {
            videos.push(links[i]);
          }
        }
        if(videos.length) {
          for (i = 0; i < videos.length; i++) {
            if(videos[i].href.indexOf('vimeo') > 0) {
              var url = 'http://www.vimeo.com/api/oembed.json?url=' + encodeURIComponent(videos[i].href) + '&callback=inlineVimeoVideo&width=440';
              var js = document.createElement('script');
              js.setAttribute('type', 'text/javascript');
              js.setAttribute('src', url);
              document.getElementsByTagName('head').item(0).appendChild(js);
            } else {
              var iframe = document.createElement('iframe');
              iframe.width = 440;
              iframe.height = 296;
              iframe.frameborder = 0;
              $D.setStyle(iframe, 'border', 'none');
              var match = videos[i].href.match(/youtube.com\/.*v=([a-zA-Z0-9\-\_]+)/);
              iframe.src = 'http://www.youtube.com/embed/'+match[1];
              $D.insertBefore(iframe, videos[i]);
              videos[i].parentNode.removeChild(videos[i]);
            }
          }
        }
      });


      $E.onAvailable('archive', function(e) {
        if(!YAHOO.env.ua.ie || YAHOO.env.ua.ie > 6) {
          $E.on(this, 'click', function(e) {
            $E.stopEvent(e);
            WOLFSBURG.activateArchive();
          });
        }
      });

      if(!$D.hasClass($('wrapper'), 'no-scroll')) {
        $E.on($('secondary').getElementsByTagName('a'), 'click', WOLFSBURG.scrollTo);
        $E.on($('primary').getElementsByTagName('a'), 'click', WOLFSBURG.scrollTo);
        $E.on($('content').getElementsByTagName('a'), 'click', function(e) {
          if(this.href.indexOf('#')) {
            WOLFSBURG.scrollTo.apply(this, arguments);
          }
        });
        $E.onAvailable('calendar', function(e) {
          $E.onContentReady(function(e) {
            $E.on(this.getElementsByTagName('a'), 'click', WOLFSBURG.scrollTo);
            var cr = $D.getRegion(this),
                hr = $D.getRegion('header'),
                mr = $D.getRegion('menu'),
                tr = $D.getRegion('content');
            if(tr.height <= hr.height+mr.height+cr.height+200) {
              $D.setStyle('content', 'height', [hr.height+mr.height+cr.height+800]+'px');
            }
          });
        });
      }

      if($('blog')) {
        var blog = $('blog');
        var blogClone = $('blog').cloneNode(true);
        blog.parentNode.removeChild(blog);
        blogClone.id = 'blog-clone';
        var commentForms = $D.getElementsByClassName('comment-form', 'form', blogClone);
        var formToggles = $D.getElementsByClassName('form-toggle', 'div', blogClone);
        $D.setStyle(commentForms, 'display', 'none');
        $E.on(formToggles, 'click', function(e) {
          $D.setStyle($D.getNextSibling(this), 'display', 'block');
          $D.setStyle(this, 'display', 'none');
        });
      }

      $E.onAvailable('newsletter', function(e) {
        $E.on(this, 'click', function(e) {
           $E.stopEvent(e);
           var sTarget  = 'NewsLetter';
           var sOptions = 'width=325, height=325, left=50, top=50, toolbar=no';
           window.open(this.href, sTarget, sOptions);
        });
      });

      $E.onAvailable('impressions', function(e) {
        var r = $D.getRegion('content');
        $D.setStyle(this, 'display', 'none');
        $D.setStyle($('content'), 'width', [r.width-480]+'px');
      });

      if($('press')) {
        var press = $('press');
        var pressClone = $('press').cloneNode(true);
        press.parentNode.removeChild(press);
        $D.setAttribute(pressClone, 'id', 'press-clone');
        pressClone.id = 'press-clone';
      }

      if(blogClone || pressClone) {
        var div = document.createElement('div');
        div.id = 'spacer';
        $D.addClass(div, 'article');
        $D.addClass(div, 'empty');
        $D.insertBefore(div, $('text'));
        if(pressClone) {
          $D.insertBefore(pressClone, div);
        }
        if(blogClone && pressClone) {
          $D.insertBefore(blogClone, pressClone);
          $D.setXY($('content'), [-960,20]);
        } else if(blogClone || pressClone) {
          $D.insertBefore(blogClone, div);
          $D.setXY($('content'), [-480,20]);
        }
      }

    }

  };
}();

YAHOO.util.Event.onDOMReady(WOLFSBURG.init);
