Ex-Perry-Mental Documentation

As noted, this is very much an experimental page that I've been using to test out javascript. Really because I've no idea how javascript works, so I thought I'd take a look and see what I could do with it.

There is a high probability that you may encounter an error message depending on whether you get onto this page just after I've made updates to it or whether I've spent time testing it. Please do, however, let me know if you find any errors as I would like to fix them. Also note that I've only tested in Firefox and IE, so if you use something else there's more of a chance you may encounter an error - sorry. And if you use an old version of Firefox or IE, you may have problems - again, sorry. If you let me know of any problems though, I will look into them.

All this said, what is the purpose of the page. Well, I'm not sure. There's excessive use of the random function to make things flash or move around. There's also some attempt to make as much of it interactive as seems reasonable.

To take each box separately. The first box allows you to choose a song and play it. If you don't like old punk then tough. Next you can hide the logo and view code runners. Hiding the logo should be fairly obvious. The code runners are simply some of the random numbers changing. This was originally created to help me debug so I could figure out where code was breaking down, but I thought I'd make it an interactive part of the page. The page really runs on cycles of up to 4 seconds. So a random amount of time up to 4 seconds (uses fractions of seconds) passes before something happens - either a new target color is established or a new position for something to move to. The program calculates where it is (by way of position or current color) and then how many cycles it has to move to the target. To use an example, color is established using red, green and blue. The amount of red, green and blue is determined by a number between 0 and 255. White is rgb(255, 255, 255). Black is rgb(0, 0, 0). Red would be rgb(255, 0, 0) you get the picture. So, lets say we are currently at rgb(100, 100, 100) and we then set a target of rgb(150, 150, 150) then each color needs to move a total of 50. if there were 10 cycles between the start and finish time, you would see the colors rgb(105, 105, 105) then rgb(110, 110, 110) etc. etc. Each object sets its own cycle time independently, so the color changing is independent of the logo moving for example.

Adding background color allows you to select various patterns that will appear on the background. The numbers in the drop down box should make sense. The letters are simply v=vertical, h=horizontal, c=checked, w=white and d=dance.

Panel color allows you to fix the panel color as grey or to allow it to rotate.

Frames per second allows you to specify how many frames per second the page displays. A lower number will make the page appear more jumpy. A standard TV works at about 30 fps for what it's worth. Basically, that means that movement should be fairly smooth at 30 fps. If you followed the discussion above about the cycle time, the frames per second plays a lot into that calculation. Say the random number hits 2 seconds for an event to go through. At 30 fps, there will be 60 cycles within those 2 seconds - so you would see an image move through 60 points or something display 60 colors. If the fps is set to 1, then there will only be 2 updates - hence the lower the number, the more jumpy the page will appear. Now, the one thing I will say is that if you put the background on EBR and it appears to slow down the higher you set the fps, this is due to the speed of your machine. The EBR background has a fixed change speed of 3 seconds rather than a random time. It simply multiplies the fps by 3 to set the time.

Text functions - the center box allows you to put text on the screen. This then creates mutliple options in the center box and the boxes below and to the left. You can change the shape of the text, make it spin round, make it follow the mouse, speed up, slow down and a heap more. Basically, choose some text, click place to put it on screen, then start to click the options to see what it does. Some of the effects you can get are pretty cool.