// ==========================
// = Related Content Widget =
// ==========================
$(function () {
  var $loader = $('<div id="loader"><img src="/de_DE/images/ajax-loader.gif" /></div>').hide().appendTo('#relatedContent');
  $('body').ajaxStart(function () {
    $('#loader').show();
  }).ajaxStop(function () {
    $('#loader').hide();
  })

  var basePath = "/relatedWidgetOutput?";
  var $relatednav = $('#relatedNav a').live('click', relatedNav);

  function relatedNav(e) {
    var $tgt = $(e.target);
    var url = basePath + $tgt.attr('id');
    //console.log("relatedNav:", url);
    //swap nav
    $tgt.siblings('a').removeClass('active').end().addClass('active')
    //get content
    $('#frontBox').fadeOut(400,function () {
      getContent(url)
    })
    
  }

  function getContent(url) {
    //console.log("getContent", url);

    $.ajax({
      url: url,
      success: function (data) {
        //console.log("ajaxSuccess",data);
        $('#frontBox').html(data).fadeIn(400);
      }
    })

  }

  $('#relatedNav a:first').trigger('click');

});