Blog
This application is all about managing tasks. To begin with, click the 'create new task list' at the bottom. This then opens a panel in which the list can be named, and items inserted into it.
If logged in, changes are saved automatically so when you revisit the page, your previous settings remain, including the name and state of each task.
An interactive motorsport calendar. It contains events for 2011, and displays the status of each event - whether past, present or future - and highlights this in the interface.
For F1 events, there's also the option to view an archive of races from the BBC website's Classic F1 series.
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 use
A 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 use
Decided 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
I was going to add a screenshot of the old one for comparison, but Google have hastily cached the new site. Oh well, it's gone forever now.
Now to get round to adding more content....
My entry into the 11 Second Club competition finished 23rd. A little disappointed with my final position, but it was close, a few more votes my way and I would have been much higher. Judging by the winner (which was excellent), I think I should have gone for a more cartoony feel and gone further into disregarding the laws of physics than I did in order to get more votes!
It also features a photo gallery, with the Fancybox jQuery plugin, and includes PHP image manipulation to automatically generate the required thumbnails.
Visit the site here: http://www.leeanneroundtheworld.co.uk
A calendar created in PHP to allow users to add events and appointments easily. Once signed in, clicking on a day will bring up an interface (see image below) to allow an item to be added to that day. Options become available to repeat the event every year, as in a birthday for example, or to make the event visible in the public timeline for everyone to see. The default setting is to not have events publicly visible unless you choose to make it so, and this is why I decided to require users to sign in first, rather than having a free-for-all option as with the chat.
View Calendar
I've made the calendar replace the F1 calendar in the main navigation bar, but you can still view the F1 calendar from the link at the bottom of the page.
The idea is that you move the ball through the gates before the screen closes in on you. Been done many times before, but I wanted to see if I could do it using JavaScript rather than the usual way of creating web browser based games - by using Flash.
Because there's no 'on collision' event that I'm aware of (although I have just discovered gameQuery, which may have helped me, but I haven't looked into it yet), I had to simulate collisions. Each row is the same height and the random row lengths pre-processed by the server and therefore accessible by the JavaScript. This meant that I could calculate an x and a y coordinate of the holes - and so if the ball's current position matches a hole, it starts the drop animation to the next level, and moves on to the next hole.
For motion, it's mostly performed using the animate() jQuery command. To be able to apply separate vertical and horizontal motion to the ball, the image for the ball was placed inside a 'playerX' div, which in turn was placed inside a 'playerY' div. This meant that I could apply a drop animation without losing the horizontal momentum already gathered. Initially, it didn't play well as it stopped its horizontal motion on a fall, which wasn't very smooth.
A detection function to test if the ball is on top of a hole runs every 50 milliseconds, so producing a frame rate of 20fps depending on browser (although the game scroll and player motion should be smoother than this as they're not tied to the hole detection function). Within this function however, I added a jQueryRotate plugin, which was very useful. Depending on whether the ball is moving left or right, it updates the rotation value every 50 milliseconds.
Finally, a scoring system was added along with the ability to post high scores. There are many ways of cheating to log an impossible score, but I wasn't overly concerned about this as it wasn't the main principle of the task.
Anyway, have a play.
For my final (for now) web app I've made recently, I've added an instant chat section to the site, but with image and video uploads integrated within the chat. I could spend hours talking about it, but it's probably best explained in action - feel free to try it out and ask me any questions. I've left a few explanation messages on there for you to read.
Chat here.
The image is how it'll look in the middle of next year, once a few races have taken place. It checks the current date and adjusts the styling depending on whether each race is a future race, a past race or a current race. All events listed are two- or three-day weekend events, so there's a good chance that if you look at the page on a weekend in 2011, there'll be at least one form of motorsport on.
External links to past races are displayed to highlights of past races hosted on the BBC website, as well as to iPlayer if it detects that an F1 race was shown within the last seven days, and so the race will be available on iPlayer. Once a race has completed, a results link appears that takes you to the official F1 website, assuming they don't adjust their link formats in the meantime.
Have a look.
I've just created a feed reader in PHP and Javascript to quickly view favourite sites. It's also possible once signed in to manage your own feeds so that only you can view them, and also to not see the default ones I have added.
On the feed, you get the usual title and links sections so when you click it takes you to the article. When hovering over the feed, you also get the option to expand the feed list to view older articles (assuming the RSS feed goes longer than 10 articles), or to view the article itself - if the article is included in the description tags on the RSS feed, which is the standard. As it relies on other people's sites being done in the same way, little sections don't work, but I've added some exceptions to help work around those. It's set up so that if a website is down where the feed is hosted, it will skip that one and continue, rather than breaking the whole page.
My main reason for creating it is that I couldn't find a reader that worked exactly how I wanted - so I decided it was easier to make my own. The closest I have found to a reader I want is Newsrack for the iPhone, which I like, although when you're sat at a PC, it's pretty pointless looking at your phone.
Next step will be to improve the speed (Firefox Beta 7 helps a little for this), as it gets a bit clunky at times. The code also needs tidying up as I've been tweaking and refining. As it's only me working on it so haven't felt the need to clean up or comment my scripts like I normally would. I may change the styling slightly for an iPhone version, although the app I mentioned does a good job already I probably won't bother, unless it unexpectedly becomes amazingly popular. Loading icons would be handy too, so you know it's trying to do something (or the internet has broken).
Update: Loading icons have now been added. Also included a sidebar to add favourite links that you can return to later - works when signed in and not, so you can either have a personalised set of bookmarks, or a public set that anyone can use. Added a history too, to keep track of which sites have been updated since you last visited the page. Optimised the loading and animation a little, but it still needs the code tidying up further, It's getting there!
Handily, the loading is done with jQuery, so you only load the page once and everything animates within the page whenever you click on something.
Have a play here.
I've been working on this extension to my website for the last few days, and it's ready to be viewed and played around with. It's an online version of Blackjack, created with PHP, Javascript and MySQL, and can be played as single or multiplayer - to test out the multiplayer, just open another browser window and be another player. The aim is to get a hand as close to 21 without going over, and to beat the dealer (not the other players - each individual player just plays against the dealer).
Aces count as one or eleven, whichever is better for you - this is taken account of in the game and adds the higher value as long as it won't make you go over 21. A 2 is worth 2, 3 worth 3, etc, and face cards are worth ten.
It requires cookies and obviously Javascript to be enabled. The Javascript is the main workings of the game, calling a PHP function to check the SQL database when updates have been made, then refreshing section of the screen in an Ajax style way, allowing other sections (such as the chat) to continue independently without interruption. An auto kick function is added, so that if any player leaves without clicking the leave button, the game doesn't just cripple to an indefinite halt - players can then return when they're back.
One of the most difficult challenges was working out how to accommodate new players, and also those that leave without destroying the game. I decided to add a value to the database when a new player joins, and have them wait until the next deal, then update them into the game. A player leaving caused more problems, but I resolved this by first adding the timer so they have to leave if they don't actually click the leave button, then if they do click to leave, it takes the player's cards with them. Initially, it meant that a leaving player transferred their cards onto the next player, which would be a bit harsh if they were a bad hand. So this player is still 'in' the game even after leaving, even though their cards and score aren't visible, a message is noted that a player has left, and they are then removed at the next round.
I then added a chat function, since the server was already calling a PHP script every couple of seconds, it may as well check the file size of the saved chat, then update if it's larger. A javascript function to then force the div to automatically scroll to the bottom (and so the updated messages) is also called when loading new data. The line required, for anyone that may find this useful (it took me quite a bit of Googling, hopefully you'll fare better), was:
Where chat_div is your div ID.
It doesn't include all of the rules of Blackjack just yet - but enough to form a functioning game. Features such as splitting a hand, betting and keeping track of high scores will come in the future.
Try it out, and let me know what you think, and if you find any errors. I'm aware of quite a few ways to cheat, but I left some of the ways I thought of in there as they were handy debuggers - I'll remove them when I come to finish everything off.
www.adamgleeson.co.uk/blackjack
Adblock Plus
Adverts in general annoy me (if I want something, I'd research a type of product then buy the best one, not one that was shoved in my face), but adverts on the internet annoy me in particular. My internet connection is shockingly bad, so every kB saved is a bonus, plus Flash adverts are the spawn of Satan, especially when my PC is rendering an animation in the background.
Grab and Drag
Excellent for my Asus T91 touch screen tablet netbook. Makes scrolling similar to the iPhone or a PDF, grabbing the screen to scroll. Although my netbook doesn't work as well as the iPhone since it's a capacitive screen (and not a particularly good one at that). But it's still better than the iPad - it's running Windows 7. So I can really push the processor to its absolute limits and have IM and a web browser open at the same time. Even Flash. Sometimes applications side by side. Good lord.
Adblock Plus: Element Hiding Helper
An extension for Adblock - pressing ctrl+shift+k allows any element to be added to the block list. Handy for sections that the Adblock subscriptions fail to block on sites I regularly visit, but more usefully it highlights each div or block, making debugging easier to get things pixel perfect. There are probably many other plugins that will do this just as well, such as Web Developer.... but keeping the extensions down help with the startup time, I guess.
Auto Pager
Automatically appends the next page of search results or forums so as you're scrolling it'll be loading the next page, and you can just keep scrolling down forever without having to click 'next'. Very handy.
Glasser
Extends the Windows 7/Vista aero theme into Firefox to make it pretty.
HTML Validator
Helps find errors to make sure pages are following W3C standards. Although judging by the amount of errors Google have on their pages yet the site still display perfectly fine, I wonder what the point of W3C actually is. Although following standards does help greatly for cross browser compatibility.
Yet Another Smooth Scrolling
I love that Firefox has smooth scrolling in its options by default, but while playing with Chrome extensions (maybe that's another post some day), I discovered the Chrome version of Yet Another Smooth Scrolling and noted that it was a Firefox port, so I promptly added it to Firefox too. Makes scrolling.... smoother. With options. And a wobble when you reach the top or bottom of a page, like the iPhone.
As you may have guessed, Firefox is my browser of choice. Chrome is quickly catching up though - the main features lacking in Chrome for now are the RSS reader integrated as well as Firefox and for the adblock plugin to work as well as its Firefox counterpart. And the ability to change default colour and decoration of links - I don't like them underlined unless the designer has decided they should be underlined. Once (if) that happens, I'll probably jump over to Chrome, it's faster, both on startup and page rendering. By then though, Firefox may well have pulled something out of its sleeve too.
And there you have it. I'm not sure why I did this either... probably so I can quickly grab the links for when I next reinstall my OS or buy a new PC. Next post: my bookmarks and saved passwords.
This post is now out of date, but I've kept it in for future reference.
I've just created a few style sheets and tidied things up a little, one day this site will be finished. Maybe.
The script I used can be found here, along with instructions so not a great deal for me to talk about really.
The important thing to remember is that you don't need to define each style within the secondary stylesheets - they just act as additions to the base CSS and override anything found in there, which means the additional stylesheets can be smaller in size, which helps with the more instantaneous switch. Also very handy that it creates a cookie to remember settings that can obviously then be accessed in PHP, it's pretty much got everything sorted.
Choose from 3 colours of one theme (because I was lazy and just Photoshop hue changed a few graphics), and an orange carbon theme. Might make more, but the concept is kind of done now so not sure I'll feel the need to.
I've now redesigned my portfolio page, and as a result there's no space for this little feature, so I'm going to write about it instead and give the example.
It's a handy way of having extra interaction on the web page, by allowing a nice little animation every time a link is clicked. I was using a jQuery plugin to load content dynamically, and it gave me the idea that because the rest of the page outside of the target div is static, it would be good to have a small animation. So each time the page swapped from one section to another, this little guy pressed the button.
The Javascript used is pretty much the same as that found at Permadi. Just copy that code and stick it in some 'script' tags:
function getFlashMovieObject(movieName)
{
if (window.document[movieName])
{
return window.document[movieName];
}
if (navigator.appName.indexOf("Microsoft Internet")==-1)
{
if (document.embeds && document.embeds[movieName])
return document.embeds[movieName];
}
else // if (navigator.appName.indexOf("Microsoft Internet")!=-1)
{
return document.getElementById(movieName);
}
This allows the browser to communicate with Flash. Next, it needs to be told what to tell Flash once the command is given. In my case, my Flash file was looping between frames 60 and 111, once the initial part of the animation (lasting 60 frames) had finished, so I wanted a 'gotoAndPlay(112) command:
function PlayFlashMovie()
{
var flashMovie=getFlashMovieObject("robot");
flashMovie.GotoFrame(112);
flashMovie.Play();
}
Note that I have called the Flash file 'robot', and this needs to be defined above. To display the
AC_FL_RunContent( "codebase","http://download.macromedia.com /pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0","width","312","height","250","src","flash/robot","wmode","opaque", "allowfullscreen","true", "quality","high", "pluginspage","http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash","movie","flash/robot", "swliveconnect","true", "name","robot" );
This method of displaying Flash is probably quite out of date, but it works and doesn't produce errors as far as I know.
Finally, add a button, just a standard 'a' link and include the onClick action:
And that's it! Your Flash movie should now gotoAndPlay frame 112. You just have to be careful to design your animation so that if someone goes crazy and keeps clicking, it still looks OK. And if it's in a loop as mine is, that it doesn't matter from which frame of the animation it jumps from. You should add in an extra bit to the Flash telling it to trigger a certain animation once it reaches the happy frame though. Now if only Flash worked on Apple devices...
Credit for the code goes to Permadi.com.
Click me!
This post is now out of date, but I've kept it in for future reference.
Added what I have so far of the template website, allowing Mr Random with no web experience to create his own website.
Many things still to add, including image backgrounds (will most likely be disabled in demo), custom stylesheets and sample settings to choose from.
All features that are visible at the moment are working, however it needs a colour picker - at the moment you have to put in either the basic colour in words (eg 'black'), or the hex colour coding, which Mr Random obviously won't know.
Feel free to have a play around.
www.adamgleeson.co.uk/template
Just about finished my motorsports calendar. I've added options for links, mostly aimed at the BBC website, which have highlights of previous races, but no logical way of finding them, so this should keep them all together. I opened the ability to post links to anyone, but left them invisible until I approve them, so the page doesn't get abused by dirty spammers.
Other than adding links, the whole thing is automated, after the initial entering into the database of the various events. This also means it's very easy to include another series I may decide to watch, or if one is requested by anyone. The calendar counts down to the next event, and automatically produces iPlayer links when available, and removes them after 7 days, when they are deleted.
It needs tidying up, especially on the style front, both visually and code (I added inline styles rather than using up the main stylesheet, when I should have really added a unique stylesheet for it but realised too late as I expanded it), but for now it does its job.
I've been playing with the delights of HTML5, and added videos to hopefully replace Flash. Not that I had a problem with Flash, but YouTube/Google are doing it, so that means everyone else has to because they're obviously correct - Google wins at the internet.
But the immediate advantages are the performance and quality, and it just feels nicer that it's embedded better into the page, although it has broken W3C complicances... for now.
The problem is that not all browsers support HTML5 - yes, you again, Internet Explorer. I hate you so much and never miss an opportunity to tell everyone how irritating you are. But even then, the browsers that do support HTML5 don't all support the same filetypes. Webkit (Chrome/Safari) play nice MP4/M4V file types, which means they play well on the iPhone and support an image to display that invites you to click to play.
Screenshot of the iPhone version of my site displaying the graphic that predictably leads to the video when tapped.
Firefox has done an IE and done things differently by not supporting MP4/M4V, and supporting OGG/OGV instead. The quality of the Firefox video is slightly inferior since I've had to put the video through two lots of compression (AVI > M4V > OGG), but hopefully in a future update Firefox will support MP4s so everything can be uniform. Or a good OGG converter appears - my attempts at finding one have resulted in me discovering SUPER, which does a good enough job at the actual converting, but takes far longer to start up than it does to convert. And I have to put an M4V through rather than the original AVI, because it adds a random green bar to the bottom of AVIs. Incidentally, I'm using Handbrake for the M4Vs.
The videos then fall back to Flash in Internet Explorer (playing the MP4 file rather than FLV to save another convert and upload). I doubt IE will support HTML5 this decade, so I guess Flash will be around a while yet. Not that that's a bad thing - Flash is great. But not so good for video, even though it has been the standard for so long.
I plan on creating a custom interface for the videos but for now I've allowed the default browser interface to be displayed, with a simple 'play' graphic over the top.
I've created an iPhone version of the website, mostly to take advantage of the automatic rotation after seeing an article on Engage Interactive. If you're using an iPhone or an iPod Touch, you should be sent there as soon as you visit my site. If you don't have an Apple product, you can view the site here, although it'll not make much sense since it doesn't know which direction you're facing to be able to display the appropriate content.
So instead, here are some screenshots - taken with the phone's built in screen capture, by pressing the home and power buttons simultaneously.
The home page:
Phone rotated to the left:
Phone rotated to the right:
After touching a video, it will play in the iPhone's default player, although for blog content videos, as they are uploaded in FLV format (as opposed to M4V that I used for the dedicated video page), they won't play [although I've now gone through and converted some of the videos and added links when visiting on the iPhone page]. When the video has finished or you click done, it then throws you back to the page you came from.
I'm going to continue working on things like the missing videos, and allow comments to be added to blog posts (not that I get - or expect - many comments; it's just for my own concepts more than anything else) to make it as close as I can to the main site, and allow devices without accelerometers to be able to use it too.
One thing I really like is that if it looks correct on one iPhone, it'll look correct on them all. Saves a lot of time testing and then fixing all the issues Internet Explorer inevitably brings up, which also means it doesn't matter so much about complying to W3C standards (assuming they matter to you). And Safari supports CSS3 styling, so easy shadows and rounded corners without having to use graphics, which obviously helps with speeding up the download of pages on poor connections.
Finished updating the site. Split content into technical and design to be able to include web design work as well as 3D and more graphical projects, to demonstrate more of my skills. Even if one person may not be necessarily interested in the other half of the site, it allows me to show that I can do more than I was previously showing.
Also included a jQuery tab system to quickly slide between tabs within sections. The background and main video as well as many of the graphics and buttons have been altered too, to give a cleaner look.
It was made in After Effects and demonstrates some of my animated work, and was a silly idea to have it loop on the home page because I've just spent the last 15 minutes watching it repeatedly.
Almost every website I have created has also required a content management system of some sort to enable the client to update their website without needing to go through me for a small update, which allows the site to be standalone until a major update or refresh is desired.
I expanded from this to also build a completely custom website package, which allows clients to control not only the content, but also the layout. Colours, background images, fonts and text alignments are all examples of what can be quickly and easily modified on each page. Pages and tabs can also be created, so the system can be used to create two totally independent-looking websites using the same base code.
For a group project on my postgraduate degree, programmers had to work with artists to produce a small computer game. To assist with this, I made a small website that allowed contributors to post updates in a comments section, upload new artwork and designs, or share the latest version of code. Messages could be left and email notifications sent to all members of the minisite if desired (a login was required, so everyone had to register and leave an email address).
The site worked well and was regularly used, and feedback was positive in that it was much easier to write reports based from the content that had been contributed throughout the project rather than searching through endless emails as had been the case in the past.
This program was written by me from scratch to send out custom emails to members who have opted to subscribe to monthly email newsletters. Each issue follows a template that is easily updated using the CMS to insert news and images into various categories. Email recipient lists can then be assigned to the created email to be sent out, with the number of recipients sent to a batch queue to reduce the load on the server, as it is required to send out almost 2,500 emails at the same time. It is written in PHP, using MySQL.
Chrisalis Flowers is an e-commerce website that I designed and built on a freelance basis. It uses PHP and a MySQL database and content management system to be self-maintained and updated by the client, with categories and new products easily created, removed or updated, with images and various other options for each item.
The AGCAS website is made using Ruby/Rails, and was functioning prior to me joining the company. I have since added new features and styles, such as integration with Google maps, a complete overhaul of the layout to bring it up to date without losing existing familiarities and features, and other tweaks and fixes. It is maintained by a team of people, using GIT as the version control software to keep each other up to date.
Well, here it is. My first tutorial. I've decided to write this tutorial on creating a basic RSS/XML feed in PHP because it's something I couldn't really find a good tutorial on to suit my needs, so hopefully this will help somebody out. The same technique can also be applied to create XML feeds for sitemaps, which is always good for search engines.
I'll assume you have content being fed from an SQL database, know how to connect to the database from your website to display the information, and this is the content you expect to be put into your feed. It's quite a basic tutorial, so aimed at PHP novices, as I guess many tutorials are as that's kind of the point.
To begin with, create a blank .xml file on your website, and give it full control access in your web host settings. Mine's in the root of my website - http://www.adamgleeson.co.uk/rss.xml.
Next, in your admin area, make the rss.php page. This needs to include your database connection information as usual.
Then from this point onwards, the RSS/XML content will be added to as one single variable in PHP. This means the file will effectively be one long line, but web browsers and feed readers will sort this out and make it into a sensible layout as long as all the tags are correct.
The XML file needs to start with a definition and a channel open tag:
$xml = "<rss version=2.0>";
$xml .= "<channel>";
Note the ".=" to keep adding to what is previously in the variable without discarding it.
Continue by adding title and description tags for your feed. A title tag I would say is the minimum, but if you don't even want that you can skip this section I guess.
$xml .= "<title>Adam Gleeson</title>";
$xml .= "<description>Animation and Computer Games</description>";
$xml .= "http://adamgleeson.co.uk/</link>";
$xml .= "© Adam Gleeson 2008";
Now for the feedy goodness. Grab your SQL from the database like you would for a normal page:
$sql = "SELECT * FROM table_name LIMIT 25";
$rs = mysql_query($sql);
while($rss = mysql_fetch_array($rs)){
And open up tags to start a new feed item:
$xml .= <item>";
$xml .="<title>";
Add the title of the item, or whatever your table field heading is, then close the item tag.
$xml .= $rss["title"];
$xml .= "</title>";
Next comes the description. In my description I just have the date and category, rather than reformatting the text:
$xml .= "<description>";
$xml .= $rss["date"];
$xml .= "(";$xml .= $rss["category"];
$xml .= ")";
$xml .= "</description>";
Last tag to be entered in my feed is the all-important link. Just to make it easier, I've linked it to the ID of the relevant item, which the page then uses PHP GET to decide what to display by grabbing the ID from the URL.
$xml .= "http://www.adamgleeson.co.uk/blog/?article=";
$xml .= $rss["id"];
$xml .= "</link>";
Remember to close the item tag, then rinse and repeat as necessary. If all your data is contained within one table, this should be enough to display everything. The close bracket here is to end the while loop, while the close item tag only ends this current part of the feed, before continuing down the rest of the table as required.
$xml .= "</item>";
}
Finally, close your channel and RSS tags that are still open.
$xml .= "</channel>";
$xml .= "</rssl>";
Now to actually write the file. Using the empty file we created earlier, the PHP fwrite command is used to add the $xml variable we have just created into the file. Remember that PHP will only allow relative links in this stage.
Last thing to do then is simply to close the PHP tag.
$file = fopen("../../rss.xml", "w");
fwrite($file, $xml);
fclose($file);?>
To add some confirmation that it has been created (or rather, that nothing went wrong if you see no error), a simple link to the file is always helpful.
And that's it, you should now have a working RSS feed. To make the feed visible in your web browser like on many websites, add this to your head tags on the pages you want the RSS feed to be visible:
As with most web things, there are many ways of doing the same thing, and this is simply one of them. I'm not suggesting it is the best way, but it works for me, so I hope this will help someone. I appreciate any comments, let me know if it's any use to you, or any requests for future tutorials!
I think I'm finally happy with the website design again... for now. I'm surprised the old design lasted a full six months, so that did quite well, and much of the code is copied into this version of the website, just tidied up a little with all the little extras I've inevitably learnt over the past six months.
Big thanks (and a free inbound link for you, hurray!) to http://sperling.com/examples/menuh/ for much of the CSS code for the interactive drop down rollover menu. A popular one seems to be Son of Suckerfish, but I found this one to be much more useful and customisable, even though it follows largely the same structure.
As for the transparency... yes, I know. It's too much. I think I'll go and take some of it away because it's slowing some certain browsers down more than others (I'm looking at you, IE). Meh, serves those users right for not getting a real web browser I suppose. I wish IE didn't come with Windows so people were forced to go and look for a browser and install it themselves rather than sticking with IE and not even knowing what else was available.
Although if no browser was installed by default, I guess you'd have to wonder how someone would look for and install a browser on a fresh install...
Anyway, enough rambling about the gripping subject of the state of web browsers. I guess this counts as my first blog post on here. I need some vaguely useful subjects to comment on in future.
Anyway, the point of this blog section is mostly for my own selfish benefit, to get some thoughts out of my head and vent them somewhere, even if nobody actually reads it, it's out of my head and I'm happy... ish.
I expect some tutorials will be put up soon (because search engines love tutorials, so I'm told), and then a big rant on something that's bothering me at the moment...
A Flash presentation was required for an awards ceremony, but the content wasn't going to be clear until shortly before the ceremony as the winners were not known, and many other factors such as screen resolution were also unknown, so it had to be suitable for a wide range of users and machines.
I created a Flash slideshow that was programmed using ActionScript to draw from an external XML file, which was created once the winners were known using another program I made using C++/Windows Forms to generate the necessary XML structure. This allowed for a dynamic and stylish Flash presentation with more effects than a standard PowerPoint presentation, and more easily and quickly edited.
My site is written in PHP with MySQL, using strict W3C HTML, Flash, JavaScript and CSS. It has a full and custom content management system to easily update the content of any page and expands with each redesign. It also hosts mini sites such as my Blackjack game, motorsports calendar and custom template sites application.
Tags
- update run f1 php XML animation feedreader website !animation maps web character demo jQuery portfolio jump !animation site reel dragon highlights wtf trailer fight mysql !webapps game css motorsports javascript dance silverstone robot jquery canada the box july 2011 balls Mobile development web development stuff lip sync !character calendar tasks physics mental case soldier unnecessarily extravagant work in progress fota fall mask amazing june 2011 idiot 3D looks like the guy from the crystal maze superhero xml webapp PHP matrix evil rss chat Interface bounce MySQL webapps 11 second club orange development ott climb head explode sentinel cycle mclaren design 2011 assassins creed
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]
