$(window).load(function () {

  $('#loader').fadeOut(800);
  $('html').removeClass('no-js');
});

$(document).ready(function(){

  $(".caption").fadeTo(0, 0);



  function slide() {

    // $('img:last', '#imageslider').fadeOut(1000, function() {
    //   var node = $(this).detach();
    //   $('#imageslider').prepend(node);
    //   $('img:first', '#imageslider').fadeIn(0);
    //   $('img:last', '#imageslider').css({left: '0px'});
    // });
    //
    $('img:last', '#imageslider').animate({left: '-100px', opacity: 0}, 700, function() {
      var node = $(this).detach();
      $('#imageslider').prepend(node);
      //$('img:first', '#imageslider').fadeIn(0);
      $('img:first', '#imageslider').css({left: '0px', opacity: 1});
    });

    // $('img:last', '#imageslider').animate({left: '-400px'}, 400, function() {
    //   $('img:last', '#imageslider')
    //   var node = $(this).detach();
    //   $('#imageslider').prepend(node);
    //   $('img:first', '#imageslider').fadeIn(0);
    // });

    autoSlide();

  }
  function autoSlide () {
    var t = setTimeout(function(){
                     slide();
                   }, 4500);
  }
  autoSlide();


  // // SLIDER ************************
  //   // config
  //   var frameWidth = 531;
  //
  //   var posLeft;
  //   var posTrim;
  //   var newPos;
  //   var imagecount = $("#imageslider").find('img').length;
  //   var innerWidth = imagecount * frameWidth;
  //   $("#imageslider").css({width: innerWidth + "px"});
  //
  //   // function scrollRight () {
  //   //   slide('right');
  //   //   stopAuto = true;
  //   // }
  //   // function scrollLeft () {
  //   //   slide('left');
  //   //   stopAuto = true;
  //   // }
  //
  //
  //   function slide (direction) {
  //
  //     posLeft = $('#imageslider').css('left');
  //     posTrim = posLeft.substr(0,(posLeft.length - 2));
  //     if (direction === 'right') {
  //       newPos = Math.floor(posTrim-frameWidth);
  //       if (Math.abs(newPos) > innerWidth-frameWidth) {
  //         newPos = 0;
  //         //$('#imageslider').css({left: newPos + "px"});
  //         autoScroll();
  //       } else {
  //         $('#imageslider').animate({
  //           left: newPos + "px"
  //         }, 750);
  //       }
  //     } else {
  //       newPos = Math.floor((posTrim*1)+frameWidth);
  //       if (newPos > 0) {
  //         newPos = (innerWidth-frameWidth) * -1;
  //       }
  //       $('#imageslider').animate({
  //         left: newPos + "px"
  //       }, 750);
  //     }
  //     autoScroll();
  //   }
  //
  //
  //   function autoScroll () {
  //     var t = setTimeout(function(){
  //                      slide('right');
  //                    }, 2000);
  //   }
  //   autoScroll();



  // $("#slider").css({height: "351px"});
  //
  //                   var $panels = $('#slider .scrollContainer > div');
  //                   var $container = $('#slider .scrollContainer');
  //
  //                   // if false, we'll float all the panels left and fix the width
  //                   // of the container
  //                   var horizontal = true;
  //
  //                   // float the panels left if we're going horizontal
  //                   if (horizontal) {
  //                     $panels.css({
  //                       'float' : 'left',
  //                       'position' : 'relative' // IE fix to ensure overflow is hidden
  //                     });
  //
  //                     // calculate a new width for the container (so it holds all panels)
  //                     $container.css('width', $panels[0].offsetWidth * $panels.length);
  //                   }
  //
  //                   // collect the scroll object, at the same time apply the hidden overflow
  //                   // to remove the default scrollbars that will appear
  //                   var $scroll = $('#slider .scroll').css('overflow', 'hidden');
  //                   $scroll.attr({scrollTop:0,scrollLeft:0});
  //
  //                   // handle nav selection
  //                   function selectNav() {
  //                     $(this)
  //                       .parents('ul')
  //                         .find('a')
  //                           .removeClass('selected')
  //                         .end()
  //                       .end()
  //                       .addClass('selected');
  //
  //                     var os = $(this).offset();
  //                     $("#subnavbg").css({display: "none"}); //temp disabled bg anim (changed: block to none)
  //                     $("#subnavbg").animate({
  //                       left: os.left
  //                     }, 300 );
  //                   }
  //
  //                   $('.sub').find('a').click(selectNav);
  //
  //
  //                   // go find the navigation link that has this target and select the nav
  //                   function trigger(data) {
  //                     var el = $('.sub').find('a[href$="' + data.id + '"]').get(0);
  //                     //window.location = '#'+data.id;
  //                     selectNav.call(el);
  //                   }
  //
  //                   if (window.location.hash) {
  //                     trigger({ id : window.location.hash.substr(1) });
  //
  //                   } else {
  //                     //$('ul.sub a:first').click();
  //                   }
  //
  //                   // offset is used to move to *exactly* the right place, since I'm using
  //                   // padding on my example, I need to subtract the amount of padding to
  //                   // the offset.  Try removing this to get a good idea of the effect
  //                   var offset = parseInt((horizontal ?
  //                     $container.css('paddingTop') :
  //                     $container.css('paddingLeft'))
  //                     || 0) * -1;
  //
  //
  //                   var scrollOptions = {
  //                     target: $scroll, // the element that has the overflow
  //
  //                     // can be a selector which will be relative to the target
  //                     items: $panels,
  //
  //                     navigation: '.sub a',
  //
  //                     // allow the scroll effect to run both directions
  //                     axis: 'xy',
  //
  //                     onAfter: trigger, // our final callback
  //
  //                     offset: offset,
  //
  //                     // duration of the sliding effect
  //                     duration: 300,
  //
  //                     // easing - can be used with the easing plugin:
  //                     // http://gsgd.co.uk/sandbox/jquery/easing/
  //                     easing: 'swing'
  //                   };
  //
  //                   // apply serialScroll to the slider - we chose this plugin because it
  //                   // supports// the indexed next and previous scroll along with hooking
  //                   // in to our navigation.
  //                   $('#slider').serialScroll(scrollOptions);
  //
  //                   // now apply localScroll to hook any other arbitrary links to trigger
  //                   // the effect
  //                   $.localScroll(scrollOptions);
  //
  //                   // finally, if the URL has a hash, move the slider in to position,
  //                   // setting the duration to 1 because I don't want it to scroll in the
  //                   // very first page load.  We don't always need this, but it ensures
  //                   // the positioning is absolutely spot on when the pages loads.
  //                   scrollOptions.duration = 1;
  //                   $.localScroll.hash(scrollOptions);
  //
  //
  //
  //
//  jQuery.each(jQuery.browser, function(i) {
//    if($.browser.msie){
//      $("#navigation").css({display: "none"});
//      $("#claim").css({display: "none"});
//    }else{
//      $("#navigation").css({display: "none"}).fadeTo(0, 0);
//      $("#claim").css({display: "none"}).fadeTo(0, 0);
//    }
//  });

  // PROJECT THUMBS
  // $(".project .project_content").hide();
  //   function openProject() {
  //     $(this).children(".project_content").show(250);
  //     $(".project_hover").hide();
  //     $(".projectthumb").hide();
  //     $(".project .preview").hide();
  //     $(".kat_buttons").hide(250);
  //     $(this).unbind("click", openProject);
  //   }
  // $(".project").bind("click", openProject);

  // var imageWidth;
  // var currentWidth;
  // var posLeft;
  // var posTrim;
  // var newPos;
  function slideImages() {
    // $(".next_button").unbind("click", slideImages);
    // currentWidth = $(this).parent().parent().find(".images_slider").children("img").width();
    // posLeft = $(this).parent().parent().find(".images_slider").css("left");
    // posTrim = parseInt(posLeft.substr(0,(posLeft.length - 2)), 10);
    // imageWidth = $(this).parent().parent().width();
    // newPos = posTrim-imageWidth + "px";
    // if (currentWidth - (Math.abs(posTrim)) < (imageWidth * 2))  {
    //   newPos = "0px";
    // }
    // $(this).parent().parent().find(".images_slider").animate({
    //   left: newPos
    // }, 350 , function () {
    //   $(".next_button").bind("click", slideImages);
    // });
    $(".project .next_button").unbind("click", slideImages);
    $('img:last', '#image_slider').animate({left: '-50px', opacity: 0}, 700, function() {
      var node = $('img:last', '#image_slider').detach();
      $('#image_slider').prepend(node);
      //$('img:first', '#imageslider').fadeIn(0);
      $('img:first', '#image_slider').css({left: '0px', opacity: 1});
      $(".project .next_button").bind("click", slideImages);
    });
  }

  $(".project .next_button").bind("click", slideImages);

  function hideNextButton () {
    var checkedImageWidth;
    var frameWidth;
    checkedImageWidth = $(this).find("img.wide").width();
    frameWidth = $(this).find(".frame").width();
    if (checkedImageWidth >= frameWidth*2) {
      $(this).find(".next_button").show();
      $(this).find(".next_button").bind("click", slideImages);
    } else {
      $(this).find(".next_button").hide();
    }
  }

  // function closeDetail(dnode) {
  //     $(".project .close_button").parent().parent().parent().parent().hide(250, function () {
  //       $(this).parent().bind("click", openProject);
  //       $(".kat_buttons").show(250);
  //       $(".project_hover").show();
  //       $(".projectthumb").show();
  //       $(".project .preview").show();
  //     });
  //   }
  // $(".sub li a, .project .close_button").bind("click", closeDetail);

  $(".project_hover").bind("mouseenter", function () {
    $(this).fadeTo(250, 0);
  }).bind("mouseleave", function () {
    $(this).fadeTo(100, 1);
  });

  // JOURNAL

  $(".olderjournalitems").hide();

  var visible = [];
  function hideitems() {
    $("#journal").children(".journalitem").each(function(i){
      if (i > 3) {
        $(this).hide();
      } else {
        visible.push(i);
      }
      if (i == 4) {
        $(".olderjournalitems").show();
      }
    });
  }

  hideitems();

  function olderitems() {
    var olditem;
    var newitem;
    var itemnum = visible.length;
    for (var n = 0; n < itemnum; n++) {
      olditem = $("#journal").children(".journalitem")[visible[0]];
      olditem.style.display = "none";
      visible.push(visible.shift()+4);
      if ($("#journal").children(".journalitem")[visible[3]]) {
        newitem = $("#journal").children(".journalitem")[visible[3]];
        newitem.style.display = "block";
        $(".newerjournalitems").show();
      } else {
        $(".olderjournalitems").hide();
      }
    }
  }
  $(".olderjournalitems").click(olderitems);

  function neweritems() {
    var olditem;
    var newitem;
    var itemnum = visible.length;
    for (var n = 0; n < itemnum; n++) {
      if ($("#journal").children(".journalitem")[visible[0]]) {
        olditem = $("#journal").children(".journalitem")[visible[0]];
        olditem.style.display = "none";
      }
      visible.push(visible.shift()-4);
      if ($("#journal").children(".journalitem")[visible[3]]) {
        newitem = $("#journal").children(".journalitem")[visible[3]];
        newitem.style.display = "block";
        $(".olderjournalitems").show();
      }
      if (visible[0] == 0) {
        $(".newerjournalitems").hide();
      }
    }
  }
  $(".newerjournalitems").click(neweritems);

  //$(".journalitemlong").hide();
  // $(".readmore").click(function () {
  //   $(".journalitemshort").hide();
  //   $(".navigateitems").hide();
  //   $(".closejournalitem").show();
  //   $(this).parents(".journalitemshort").next().show(450, hideNextButton);
  // });
  // $(".closejournalitem").click( function () {
  //   $(".journalitemshort").show();
  //   $(".navigateitems").show();
  //   $(".closejournalitem").hide();
  //   $(this).parents(".journalitemlong").hide();
  // });


  // KUNDEN LOGOS

  $(".caption").bind("mouseenter", function () {
    $(this).fadeTo(250, 1);
  }).bind("mouseleave", function () {
    $(this).fadeTo(100, 0);
  });

  // LINKS
  function scrolllinksup () {
    $(".linknavibuttonup").unbind("click", scrolllinksup);
    scrolllinks("up");
  }
  function scrolllinksdown () {
    $(".linknavibuttondown").unbind("click", scrolllinksdown);
    scrolllinks("down");
  }
  var topOffset;
  var linkPosTrim;
  var boxHeight;
  var tempTopOffset;
  function scrolllinks (dir) {
    topOffset = $("#linksbox").css("top");
    linkPosTrim = parseInt(topOffset.substr(0,(topOffset.length - 2)), 10);
    boxHeight = $("#linksbox").height();

    if (dir === "down") {
      linkPosTrim -= 315;
      $("#linksbox").animate({top: linkPosTrim + "px"}, 450, function () {
        tempTopOffset = $("#linksbox").css("top");
        linkPosTrim = parseInt(tempTopOffset.substr(0,(tempTopOffset.length - 2)), 10);

        if (linkPosTrim + $("#linksbox").height() < 351) {
          $(".linknavibuttondown").hide();
        } else {
          $(".linknavibuttondown").bind("click", scrolllinksdown);
        }
      });
      $(".linknavibuttonup").show().bind("click", scrolllinksup);
    } else if (dir === "up") {
      linkPosTrim += 315;
      $("#linksbox").animate({top: linkPosTrim + "px"}, 450, function () {
        $(".linknavibuttondown").show().bind("click", scrolllinksdown);
        tempTopOffset = $("#linksbox").css("top");
        linkPosTrim = parseInt(tempTopOffset.substr(0,(tempTopOffset.length - 2)), 10);
        if (linkPosTrim >= 0) {
          $(".linknavibuttonup").hide();
        } else {
          $(".linknavibuttonup").bind("click", scrolllinksup);
        }

      });

    }
  }

  if ($("#linksbox")) {
    boxHeight = $("#linksbox").height();
    if (boxHeight > 351)  {
      $(".linknavibuttondown").show();
    }
    $(".linknavibuttonup").bind("click", scrolllinksup);
    $(".linknavibuttondown").bind("click", scrolllinksdown);
    // rollover
    $("#linksbox .linkitem").bind("mouseenter", function () {
      $(this).find(".linkbutton").css({display: "block"});
      $(this).find(".linktext").css({background: "#3faddf", color: "#fff"});
    }).bind("mouseleave", function () {
      $(this).find(".linkbutton").css({display: "none"});
      $(this).find(".linktext").css({background: "#fff", color: "#000"});
    });
    // link
    var itemUrl;
    $("#linksbox .linkitem").bind("click", function () {
      itemUrl = $(this).find("a").attr("href");
      $(this).find("a").removeAttr("href");
      window.open(itemUrl);
      //$(this).attr("onclick");
    });
  }




  //
});


// this is called from within the flash movie
function showelement(target) {
  jQuery.each(jQuery.browser, function(i) {
    if($.browser.msie){
      $("#"+target).css({display: "block"});
    }else{
      $("#"+target).css({display: "block"}).fadeTo(800, 1);
    }
  });
}

function hideelement(target) {
  jQuery.each(jQuery.browser, function(i) {
    if($.browser.msie){
      $("#"+target).css({display: "none"});
    }else{
      $("#"+target).css({display: "none"}).fadeTo(0, 0);
    }
  });
}