Blog
A game created in JavaScript for your entertainment. Containing retro style glowing graphics - assuming you're using anything better than evil IE8, otherwise you don't get the pretty glows and nice rounded corners. This is an update of the last JavaScript Game I made - I said I'd update it at some point, and here it is. Runs much smoother, although visually I preferred the lighter background looking back, but that's just an easy CSS change.
The idea is to guide the ball through the holes to reach the bottom. The arrow keys, mouse, or a touch screen can be used to control the ball. It technically works on phones as it's not Flash based and widths are set as percentages, but it depends on your screen resolution and graphics provider as to how well it will work.
It heavily uses the jQuery animate tool, as well as the jQuery Rotate plugin, and took around 3 hours to make. The rows are generated randomly with PHP, so the difficulty can also vary slightly between refreshes. A difficulty trigger is activated when the ball reaches the bottom of the screen - when this happens, it speeds everything up as it assumes it has been going too slowly for the player until this point.
High scores are kept locally and per session, but in future it would easily be possible to have them saved in a database. Try it for yourself, it demonstrates itself better than I can explain in words!
A quick app to read RSS feeds from external sources and display them on the page. Three sample feeds are included as demos, along with the ability to add a fourth (which isn't saved).
When clicked, links are expanded to reveal the additional content contained in the feed, as well as a link to the original article. Any images in the feed are displayed directly in the page with styling to prevent them taking over the screen.
Click here to useA web-based "instant" messaging system - not quite instant because there's a 1.5 second delay while checking for data, since browsers don't have push facilities to be told to retrieve data from the server.
This app requires registration, and from there you can add friends to talk to (assuming they're already registered). An upload function is available to share photos and files, which are then displayed in the page, as well as recent messages. The option to view the past week or day's worth of chat with one particular friend is available, along with email notifications.
It works by sending a request to the server to detect whether an update to a chat has been posted. If it has, the data is then retrieved and instantly animated into the chat window. It's really much more clever than I can put into words - give it a try!
Click here to useDecided it was time to update again. It's built with a PHP framework with a MySQL database and jQuery. In the webapps section, there are several things to play with, some of which are enhanced by registering, and so there is a log and registration function added.
The design is built in a way that it should scale down nicely to mobile phone screens without the need for a separate site. Widths become percentage in the CSS based below a certain threshold, and a little jQuery animation helps the style along, but it isn't necessary to enable JavaScript - it only adds to it.
Clicking on a video will play in the browser if the screen width is high enough for it to safely assume the page is being viewed from a PC. If not, the video will be linked to as a normal file, so the device can play the video in whatever player it likes. I didn't want to go down the route of PHP or JavaScript browser detection, and rather keep everything nice all on one page without thousands of if statements. Also, click on images in the blog section, they whiz about before your eyes.
Not a lot more to say really, just have a look around. It'll probably change next week when I'm bored of it again anyway.
Feel free to experiment with any of the apps.
http://adamgleeson.co.uk/webapps
Tags
- php reel web development !animation animation javascript character XML fall website dragon web head explode mysql development ott maps chat evil jQuery mental case jquery MySQL fota canada mclaren feedreader 2011 !webapps june 2011 physics demo game stuff assassins creed f1 !character portfolio sentinel amazing css rss !animation run unnecessarily extravagant 11 second club soldier jump cycle looks like the guy from the crystal maze Mobile development matrix dance climb lip sync the box Interface 3D highlights webapp PHP wtf update orange trailer motorsports bounce calendar mask xml idiot balls site july 2011 robot silverstone webapps fight superhero work in progress design tasks
Archive
- April 2012 [1]
- March 2012 [2]
- September 2011 [6]
- July 2011 [6]
- June 2011 [5]
- May 2011 [4]
- April 2011 [7]
- March 2011 [1]
- January 2011 [7]
- December 2010 [2]
- November 2010 [4]
- October 2010 [12]
- September 2010 [7]
- August 2010 [1]
- July 2010 [5]
- June 2010 [4]
- May 2010 [3]
- April 2010 [6]
- March 2010 [6]
- February 2010 [5]
- January 2010 [1]
- October 2009 [2]
- September 2009 [5]
- August 2009 [4]
- July 2009 [6]
- June 2009 [4]
- May 2009 [2]
- April 2009 [6]
- March 2009 [3]
- February 2009 [4]
- January 2009 [4]
- December 2008 [4]
- November 2008 [1]
- October 2008 [5]
- September 2008 [2]
- July 2008 [1]
