MOARDAMMIT.COM :: THE BACK BUTTON

Phew, I finished doing all this stuff around midnight and couldn’t take the time to write this entire post out. So here I’ll go over what’s new and what I did.

Alright so the voting system from the last post I made on facebook has changed for the better. When I first made it I didn’t consider the math involved in going from an upvote to a downvote. I’ve essentially removed the neutral option with this fix, but now you can change your vote from +1 to -1 and not just +1 to 0 or -1 to 0. A minor fix, but some people enjoy being able to change their vote from positive to negative. You can access the voting options by pressing up or down arrow or using the menu in the top left.

So with the new voting system in place there another thing this brings into play. AJAX. If you don’t know what AJAX is then you won’t understand much of this paragraph. Anyway, with the new loading method implemented on the site you’ll notice that your page doesn’t actually reload or refresh. The URL changes, but I’ll get into that later. The actual loading of the SWF’s is no longer done by page refresh, but an AJAX call that goes and get’s the SWF name. With this it returns and fades out the current SWF and fades in the fader then it proceeds to load the newly found SWF and fade it back in. Creating a nice transition in the process. With this new method allows for faster transitions between SWF’s you can press the left arrow without having to “wait” to go get the new page, it’ll automatically keep calculating. The only other difference is the glitch prevention that happens when you hold down the randomize button or left/right arrows. It’s not what happens serverside, but clientside it fails to stop fading in the video. I’ll work on a more permanent fix to this problem, but for now I just put on a limiter.

So now with the AJAX loading on the main site my admin panel was feeling lonely, so I worked on it for a while and managed to get everything to also be done through it so it’s nice and smooth. It’s also even more faster than before. So a big bonus for me! Now with this new way of loading the pages it doesn’t actually refresh the page, normally this would be an issue and I would have to use hashtags or hashbangs to keep a linkable state. Except now with HTML 5 there is a thing called push and pop states, or history states. You push the state, and when it pops(changes) you call a function. So when you load a SWF this push function is called which pushes the new URL to the address bar of your browser so you can link the current video. From this it also pushes the state to the history. So when you press the back or forward button you call a popstate event, which I’ve rewritten to change the SWF. So now the back and forward buttons work!

Although with all these new features I’ve broke the site for IE, so until I make a site that works specifically for IE it’ll have to only display SWF’s. Sorry IE users! So anyway, the more I work on this site the more I learn, and at the same time I’m created a fun site to visit. When the site gets farther down the line I’ll be able to share my source code with comments about how/why I did certain things. Right now however I feel that the site isn’t the best as it could be, plus there are snippets of admin-only code which I’m still testing.

So look forward to more updates! I’ll probably tackle the IE problem next. In the meantime check out my ~facebook~ and ~twitter~ for more updates

Related Articles