Team:NRP-UEA-Norwich/CSS/MAIN

var web; $(document).ready(function(){ web = { defaults: { "url": "home", "pagesDir": "pages", "contentWrapper": $("#contentWrapper"), "pageLoaded": false },

initialize: function(){

var $this = this;

//check if url isnt empty checkUrl = this.getPath(true); if(checkUrl.length > 0) this.defaults.url = checkUrl;

// load the page this.loadPage(this.defaults.url);

this.defaults.pageLoaded = true;

//timeline close open event $(document).on("click", ".close_timeline_event", function(){ $this.timelineResetPosition(); $this.timelineCloseEvents(null);

sideOpen = "none"; });

//select list item from protocols page $(document).on("click", ".protocols_list li", function(){ $("#protocols_sub_list_main > li").hide(); $("#protocols_sub_list_main > li").eq($(".protocols_list li").index(this)).show();

$(".protocols_list li").removeClass("active"); $(this).addClass("active");

});

//image pop up close $(document).on("click", "#closeImage, #showImageBG", function(){ $("#showImageBG, #showImage").hide(); });

//image pop up show image $(document).on("click", ".showFullSizeImage", function(){ $("#showImage img").attr("src", this.getAttribute("src")); $("#showImageBG, #showImage").show(); });

//timeline show selected event var sideOpen = "none"; $(document).on("click", ".timeline_event_header", function(e){ if($(e.target).is(".close_timeline_event")) return;

selected = $(this).attr("data-side");

if(sideOpen != selected && sideOpen != "none") $this.timelineResetPosition();

$this.timelineCloseEvents(this);

sideOpen = selected;

$(this) .addClass("active") .animate({ width: 640 }, function(){ height = $(".timeline_event_container", this).css("height", "auto").height();

$(".timeline_event_container", this) .css({ height: 0, visibility: "visible" }) .animate({ height: height });

});

$(".timeline_vline") .addClass("active") .animate({ margin: 0, left: sideOpen == "right" ? 300 : 700 }); });

$(document).on("click", ".teamShowMore", function(){ offset = !$(this).hasClass("active") ? $("#teamSection").offset().left : "-"+ + $("#teamSection").width()+"px";

$("#teamSupervisors") .show() .css("margin-top", "-"+($("#teamSupervisors").height() / 2)+"px") .animate({right: offset}, {duration:800, easing:"easeInOutCubic"});

$(this).toggleClass("active"); });

$(document).on("click", "a", function(e){ if($(this).hasClass("directFile")) return true;

e.preventDefault();

url = this.getAttribute("href");

//empty url if(url == "#" || url.length == 0) return;

web.defaults.url = this.getAttribute("href");

window.history.pushState({path: web.defaults.url}, "", web.defaults.url);

$this.loadPage(web.defaults.url); });

$(window).bind('popstate', function() { if(window.history.state == null) web.defaults.url = ""; else web.defaults.url = window.history.state.path;

$this.loadPage(web.defaults.url); }); },

getPath: function(string){ url = window.location.pathname; url = url.split("/"); url = url.slice(1, 100);

if(string === true) return url.join("/"); else return url; },

timelineCloseEvents: function(exclude){ $.each($(".timeline_event_container"), function(){

if(exclude == $(this).parents(".timeline_event_header")[0]) return;

$(this).animate({ height: 0 }, function(){ $(this).css("visibility", "hidden");

$(this).parents(".timeline_event_header").animate({ width: 150 }, function(){ $(this).removeClass("active") }); }); }); },

timelineResetPosition: function(){ console.log("test") $(".timeline_vline") .addClass("active") .animate({ margin: "-2px", left: "50%" }); },

resetPageTransition: function(el){ $(el) .removeClass("pageTransitionAnimate") .css({ top: 0, left: 0 }) .animate({ height: 0 }, 400, "easeOutQuint"); },

animatePageTransition: function(){ var $this = this;

$(".pageTransition").addClass("pageTransitionAnimate");

$("#block1").animate( { height: $(window).width() + "px" }, 700, "easeInQuad", function(){ $this.resetPageTransition(this); } );

$("#block2").animate( { height: $(window).width() + "px" }, 1000, "easeInQuad", function(){ $this.resetPageTransition(this); } ); },

resize: function(){ width = window.innerWidth; height = window.innerHeight;

//resize only current page elements /*if(this.defaults.url == "home"){ $(".instagramBlock").css({ width: width / Math.ceil(width / $(".instagramBlock").width()) }); }*/

if(this.defaults.url == "team"){ $(".teamShowMore").css("right", $("#teamSection").offset().left / 2); } },

/*renderHomePage: function(){ var prefix = "media/images/instagram/"; var instagramImages = [];

for(var i=1; i<=20; i++){ // imagePath = prefix + i + ".jpg"; imagePath = prefix+"2.jpg";

$("#interactImages").append('\

\

<img src="'+imagePath+'" />\

'

); } },*/

loadPage: function(url){ //dont animate page transition if website was just loaded/reloaded if(this.defaults.pageLoaded !== false) this.animatePageTransition();

var $this = this;

if(url.length == 0){ url = this.getPath(false); url = url.join("/"); }

url = url.replace(/\/$/, "");

$.ajax({ "url": "/"+this.defaults.pagesDir+"/"+url+".html", "dataType": "html", success: function(response){ setTimeout(function(){ $this.defaults.contentWrapper.html(response);

if($this.defaults.url == "project"){ var lastChild = 2;

//global temperature slider $("#tempSlider").slider({ min: 2, max: 5, slide: function(event, ui){ var child = ui.value;

$("#globalTemp .timeSeriesImage:nth-child("+lastChild+")").removeClass("currentSeriesImage"); $("#globalTemp .timeSeriesImage:nth-child("+child+")").addClass("currentSeriesImage"); var year = $("#globalTemp .timeSeriesImage:nth-child("+child+")").attr("title");

//idk why but it goes undefined so we gotta do an extra check if(child == 2){ year = "1884"; }

$("#tempHeader > #rightCol").text(year); lastChild = child; } }); }

//$this.renderHomePage(); $this.resize(); }, 500); }, error: function(jqXHR){ alert("Error page could not be loaded!"); console.log(jqXHR); } }); } };

web.initialize();

$(document).on("click", "#videoPlayImg", function(){ $("#bannerVideo").css('opacity', 1).animate( { opacity: 0 }, 400).animate( { opacity: 1 }, 500); $("#videoOverlay").fadeOut("slow"); $("#stopVideoButton").css("visibility","visible").fadeIn("slow");

setTimeout(function(){ document.getElementById("bannerVideo").play(); }, 600); });

$(document).on("click", "#stopVideoButton", function(){ document.getElementById("bannerVideo").pause(); $("#videoOverlay").fadeIn("slow"); $("#stopVideoButton").fadeOut("slow"); });

$(document).on("click", "#introPlayVideoButton", function(){ $('body, html').animate({ scrollTop: $("#bannerVideo").offset().top }, 600); $("#videoPlayImg").trigger("click"); });

//play the global temp gallery var playing = 0; var timer;

function playGlobalTempGallery(){ var element = $("#globalTemp").find(".currentSeriesImage"); var childNum = $(".timeSeriesImage").index(element)+2;

timer = setTimeout(function(){

if(childNum < 5){ $("#globalTemp .timeSeriesImage:nth-child("+childNum+")").removeClass("currentSeriesImage"); $("#globalTemp .timeSeriesImage:nth-child("+(++childNum)+")").addClass("currentSeriesImage"); $("#tempSlider").slider("value",$("#tempSlider").slider("value")+1); console.log("hug");

var year = $("#globalTemp .timeSeriesImage:nth-child("+childNum+")").attr("title"); $("#tempHeader > #rightCol").text(year);

playGlobalTempGallery(); }else{ clearTimeout(timer);

setTimeout(function(){ $("#globalTemp .timeSeriesImage:nth-child("+childNum+")").removeClass("currentSeriesImage"); $("#globalTemp .timeSeriesImage:nth-child(2)").addClass("currentSeriesImage"); $("#tempSlider").slider("value",2); playing = 0; $("#playTemp").css("background-image","url(media/images/playTemp.png)"); $("#tempHeader > #rightCol").text("1884"); },1000); }

}, 500) }

$(document).on("click", "#playTemp", function(){ if(playing == 0){ playing = 1; $("#playTemp").css("background-image","url(media/images/pauseTemp.png)"); playGlobalTempGallery(); }else{ clearTimeout(timer); playing = 0; $("#playTemp").css("background-image","url(media/images/playTemp.png)"); } }); });