$(document).ready(function(){
  //Limit number of past txH2O issues shown
  $("div#issues").each(function() {
    var num = 5;
    if (window.innerWidth <= 550)
        num = 2;
    else if (window.innerWidth <= 768)
        num = 4;
    
    var ul  = $("ul", this);
    if (ul.children("li").size() < num) return;
    
    var hiddenElements = ul.children("li:gt(" + (num - 1) + ")", this).hide();
    
    var showCaption = "More issues of txH<sub>2</sub>O...";
    ul.append(
        $("<li class='toggler'>" + showCaption + "</li>").toggle(
          function() {
            hiddenElements.slideDown();
            $(this).html("Hide...");
          },
          function() {
            hiddenElements.slideUp();
            $(this).html(showCaption);
          }
        )
    );
  });
  
  //Colorbox
  $("a[rel='gallery'],.colorbox").colorbox({ maxHeight: "90%", maxWidth: "100%" });
  $(".specialist").colorbox({ iframe: true, width: "800px", height: "60%", maxWidth: "100%" });
  $(".issuu").colorbox({ iframe: true, width: "950px", height: "650px", maxWidth: "100%" });
  $(".colorboxframe").colorbox({ iframe: true, width: "750px", height: "80%", maxWidth: "100%" });
  $(".jwvideo").colorbox({ iframe: true, width: "695px", height: "570px", maxWidth: "100%" });
  $("a[rel='roundtablevideo']").colorbox({ iframe: true, width: "770px", height: "565px", maxWidth: "100%" });
  $("a[rel='youtube']").colorbox({ iframe: true, width: "695px", height: "475px", maxWidth: "100%" });
  $("a[rel='flickrvideo']").colorbox({ iframe: true, width: "690px", height: "560px", maxWidth: "100%" });
  $(".coordinator").colorbox({ iframe: true, width: "500px", height: "50%", maxWidth: "100%" });
  $(".aside-box").colorbox({ inline:true, href:"#aside-box", width: "650px", height: "60%", maxWidth: "100%" });
  $(".aside-box-2").colorbox({ inline:true, href:"#aside-box-2", width: "650px", height: "60%", maxWidth: "100%" });
  $("a[rel='flickr'],a.flickrphoto").colorbox({ 
    title: function() {
      var url = $(this).attr('href');
      var photoID = url.split("/")[4].split("_")[0];
      
      return '<a href="http://flickr.com/photo.gne?id='+ photoID +'" target="_blank" class="flickr">View this photo on Flickr</a>';
    },
    maxHeight: "90%", 
    maxWidth: "90%" });
});