$(function(){

  $('a[rel=external]').click(function (event) {
    //open links with rel="external" in a new window
    event.preventDefault();
    var oWin = window.open(event.target.getAttribute('href'), '_blank');
    oWin.focus();
  });
  
  $('div#teilnahmebedingungen').hide();
  accordionInit();
  modalInit();

  // Bind the url change event.
  $(window).hashchange(function () {
    var hashValue = location.hash;
    if(hashValue !== "#teilnahmebedingungen") {
      accordionToggle(hashValue);
    } else {
      modalOverlay(hashValue);
    }
  });
  // Trigger the event on page load
  $(window).hashchange();

  parallaxe();

});


function parallaxe() {
  var layers = $('#parallaxe_items').children().not('.static');
  var range = $('#parallaxe').width();
  var pointOfRest = range/2;

  layers.each(function () {
    var obj = $(this);
    var objName = obj.attr('id');
    var initPos = parseInt(obj.css('left'), 0);
    var direction = obj.hasClass('with') ? 'with' : 'against';
    var dosage = '0.'+obj.attr('class').replace(/\D*/g, '');

    obj.data("properties", { initPos: initPos, dosage: dosage, direction: direction});
  });

  $('#container').mousemove(function (e) {
    var move = e.pageX + 416;
    var mouseY = e.pageY;
    var offset = $('#parallaxe').offset();
    var offsetLeft = offset.left;
    var localX = e.pageX - offsetLeft;
    var dampen = 1;

    if(mouseY > 370) {
      var localY = mouseY - 370 - 500;
      dampen = (localY / -500);

      if (dampen < 0) {
        dampen = 0;
      }
    }

    layers.each(function (index, element) {
      var obj = $(this);
      var initPos = obj.data("properties").initPos;
      var dosage = obj.data("properties").dosage * dampen;

      var distance = (localX - pointOfRest) * dosage;
      var pos;

      if(obj.data("properties").direction === "with") {
        pos = initPos + distance;
      } else {
        pos = initPos - distance;
      }

      obj.css({ left: pos });
    });
  });
}


function accordionInit() {
  //set up accordion
  $('div.accordion div.fold, img.more').toggle();

  //add underscore to anchor elements, 
  //to prevent the browser-own jump to anchors
  $('div.accordion div.item').each(function () {
    var el = $(this);
    var id = el.attr('id');
    el.attr('id',  id + '_');
  });

  //set the hash to the original 
  $('div.accordion img.more').click(function(event) {    
    var icon = $(this);
    var a = icon.parent().attr('id').replace('_', '');

    if (icon.parent().hasClass('active')) {
      a = a + '_closed';
    }

    location.hash = a;
  });
}

function accordionToggle(anchor) {
  var a = anchor + '_',
      interval,
      anchorOffset = $(a).offset();
      scrollElement = scrollableElement('html', 'body');

  try {
    piwikTracker.setCustomVariable (1, 'Klapper auf '+window.location.pathname, a.slice(1,-1), scope = "page");
    piwikTracker.setCustomUrl(window.location.pathname+'/'+window.location.hash.substr(1));
    piwikTracker.trackPageView();
  } catch( err ) {}

  //set back the former active accordion item
  $('div.accordion div.active').removeClass('active')
      .find('div.fold').slideUp(200)
      .next('img.more').attr('src', 'img/more.png');

  //scroll to the new active item and expand its content
  if(anchorOffset !== null) {
    $(scrollElement).animate({
      scrollTop: anchorOffset.top
    }, 700, function() {
      //show the new active accordion item
      $(a).closest('.item')
          .addClass('active')
          .find('div.fold').slideDown(300)
          .next('img.more').attr('src', 'img/less.png');
    });
  }
}

// use the first element that is "scrollable"
function scrollableElement(els) {
  for (var i = 0, argLength = arguments.length; i <argLength; i++) {
    var el = arguments[i],
        $scrollElement = $(el);
    if ($scrollElement.scrollTop()> 0) {
      return el;
    } else {
      $scrollElement.scrollTop(1);
      var isScrollable = $scrollElement.scrollTop()> 0;
      $scrollElement.scrollTop(0);
      if (isScrollable) {
        return el;
      }
    }
  }
  return [];
}

function modalInit() {
  var link = $('a.mlink');
  var modalData = $('div.modal');
  
  link.show();
  modalData.hide();

  link.live('click', function (event) {
    var modal = $(this).attr('href');

    event.preventDefault();
    modalOverlay(modal);
  });
}

function modalOverlay(element) {

  try {
    piwikTracker.setCustomVariable (1, 'Overlay auf '+window.location.pathname, element.slice(1), scope = "page");
    piwikTracker.setCustomUrl(window.location.pathname+'/'+element.slice(1));  
    piwikTracker.trackPageView();
  } catch( err ) {}

  $(element).modal({
    closeHTML: "<a href='#'>schließen</a>",
    overlayClose: true,
    onOpen: function (dialog) {
      dialog.overlay.fadeIn('fast', function () {
        dialog.data.hide();
        dialog.container.fadeIn('slow', function () {
          dialog.data.show();
        });
      });
    },
    onShow: function (dialog) {
      if(dialog.data.attr('id') === 'pruefung') {
        modalSwitchContent();
      }
    }
  });
}

function modalSwitchContent() {
  $('#chancen-risiken').hide();
  $('#eignung').show();
  $('#pruefung a.mlink').click(function (event) {
    event.preventDefault();
    $('#chancen-risiken, #eignung').hide();
    var el = $(this).attr('href');
    $(el).show();
  });
}