Fire, Film and Tech

More improvements to Arcc.cc, particularly the content loading on square and hexagon.

I used jquery to hide all the content first

$(document).ready(function(){
$('#video0, #video1, #video2').fadeTo(0,0)
$('#video, #video1, #video2').hide();

Then once the selection on the navbar is clicked (#intro0), hide the other content that may be active(#video1, #video2) and fade in the content.

$('#intro0').click(function(){
$('#video1,#video2').hide();
$('#video0').fadeTo("slow", 1);

Once the navigation has been clicked, bind to the 'ended' event, and when the even triggers fade out and return to frame 0. (this is not present in hexagon, as there is no end. The hover functions work all the time after the navigation has been clicked)

$("#video0").bind("ended", function() {
$('#video0').fadeTo("slow", 0);
this.currentTime = 0;

Hover functions: when the ended event has triggered enable hovering over the content so that it can be played again.

$('#video0').hover(function(){
$('#video0').fadeTo("slow", 1);},
function(){
$('#video0').fadeTo("slow", 0);}
);
});
});

This code is then just copied over with different entries, to hide the other content and show the correct content.

The only problem I have found with this code is that when the video has ended, and the hover function is run, if the video is restarted more than twice and ended, the hovering gets increasingly longer response times. I think i can fix this by stopping the hover function on ended before restarting it. I don't know how to do this yet, and the bug is low priority.

I was helped with this code with direction from Christopher Fulham, and actual jQuery help from <insert classmates name who I have shamefully forgotten here>.