It didn't take too long before I got bored of the appearance of my website. The last version only lasted for 10 months having been launched in February 2011.
I decided I wanted something cleaner, with straighter edges and fewer lines. I wanted a site which worked better visually including better javascript functions and better use of AJAX. To that end, I have launched this new version - the tenth - with a brand new colour scheme, which fulfils my above requirements.
Whilst the overall layout of the site remains similar, the layout of blog entries better focuses on the content, moving secondary information out of the main flow. Borders are more subtle and the main menu easier to read and more focussed. A secondary menu (Tools) provides access to the smaller parts of the site such as the postcode lookup tool. Images embedded in blog entries can now be enlarged in an embedded popup container.
There have been changes behind the scenes too, with an entirely new database running the show. This has been the most significant alteration as the data from the old database had to be migrated. I took the opportunity to recreate record ID numbers which made the migration all the more difficult. I am anticipating that some data probably hasn't come across yet but the old system does still exist so I can continue to work on that if it transpires that something is missing.
The database change has also meant that I've had to start rebuilding my CMS (Content Management System). Obviously it needs to correctly use the new database which has meant some fundamental re-writing of queries and PHP code. That work is still ongoing so new entries may continue to be infrequent. For example, although I've got it working for adding and updating entries, I cannot yet add new hyperlinks or upload image files.
Still, the last blog entry here was back in October so if posts aren't that frequent I don't think it really matters.
I decided I wanted something cleaner, with straighter edges and fewer lines. I wanted a site which worked better visually including better javascript functions and better use of AJAX. To that end, I have launched this new version - the tenth - with a brand new colour scheme, which fulfils my above requirements.
Whilst the overall layout of the site remains similar, the layout of blog entries better focuses on the content, moving secondary information out of the main flow. Borders are more subtle and the main menu easier to read and more focussed. A secondary menu (Tools) provides access to the smaller parts of the site such as the postcode lookup tool. Images embedded in blog entries can now be enlarged in an embedded popup container.
There have been changes behind the scenes too, with an entirely new database running the show. This has been the most significant alteration as the data from the old database had to be migrated. I took the opportunity to recreate record ID numbers which made the migration all the more difficult. I am anticipating that some data probably hasn't come across yet but the old system does still exist so I can continue to work on that if it transpires that something is missing.
The database change has also meant that I've had to start rebuilding my CMS (Content Management System). Obviously it needs to correctly use the new database which has meant some fundamental re-writing of queries and PHP code. That work is still ongoing so new entries may continue to be infrequent. For example, although I've got it working for adding and updating entries, I cannot yet add new hyperlinks or upload image files.
Still, the last blog entry here was back in October so if posts aren't that frequent I don't think it really matters.
Following the launch of my new website yesterday, I thought I'd be nice and publish a couple of JavaScript functions which I have written and found most useful.
Feel free to make use of these snippets as you wish, and let me know if they can be improved upon. I'm using them on this site so if they can be made better then that's only a good thing.
Load Content using AJAX
This function loads an external file into a HTML <DIV> element meaning that content can be changed without having to reload the entire site. It's parameters are the full path to the file being loaded and the ID of the element to contain it.
You could enhance this function to include error messages (e.g., 404 not found) but this is not something I've considered necessary. Whilst loading the content, the message "Please wait..." is displayed.
Toggle Element Visibility
Here we have a function that alters the style property 'display' for the given element, effectively toggling it between the property 'block' or 'none' i.e., making it visible or invisible. Of course, the element is always loaded. This is just a toggle of whether it can be seen or not.
The function requires the ID of the element being toggled and optionally what it is being toggled to (type; can be 'block' or 'none'). If type isn't provided then the opposite of the current state is used.
Key Press Action
A function that is called by the OnKeyDown property in the HTML <body> tag, this permits a degree of keyboard control to a website.
The following function recognises a press of the ESCAPE key but this can be expanded to detect any key press simply by using the appropriate KeyCode value.
I've used an IF statement to evaluate the keyCode, but if numerous codes are evaluated then a SWITCH...CASE block would be a better choice.
There we are. Nothing major or ground-breaking, but a few functions which I think are useful and thought I'd share. I'm nice like that :)
Feel free to make use of these snippets as you wish, and let me know if they can be improved upon. I'm using them on this site so if they can be made better then that's only a good thing.
Load Content using AJAX
This function loads an external file into a HTML <DIV> element meaning that content can be changed without having to reload the entire site. It's parameters are the full path to the file being loaded and the ID of the element to contain it.
You could enhance this function to include error messages (e.g., 404 not found) but this is not something I've considered necessary. Whilst loading the content, the message "Please wait..." is displayed.
function ajaxLoadDoc(file,element)
{
xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById(element).innerHTML=xmlhttp.responseText;
}
else if (xmlhttp.readyState <4)
{
document.getElementById(element).innerHTML="Please wait...";
}
}
xmlhttp.open("GET",file,true);
xmlhttp.send();
}
Toggle Element Visibility
Here we have a function that alters the style property 'display' for the given element, effectively toggling it between the property 'block' or 'none' i.e., making it visible or invisible. Of course, the element is always loaded. This is just a toggle of whether it can be seen or not.
The function requires the ID of the element being toggled and optionally what it is being toggled to (type; can be 'block' or 'none'). If type isn't provided then the opposite of the current state is used.
function toggle(id,type)
{
//Toggle element display on (block) or off (none)
if (!type) type = 'block';
var e = document.getElementById(id);
if(e.style.display == type) e.style.display = 'none';
else {e.style.display = type;}
}
Key Press Action
A function that is called by the OnKeyDown property in the HTML <body> tag, this permits a degree of keyboard control to a website.
The following function recognises a press of the ESCAPE key but this can be expanded to detect any key press simply by using the appropriate KeyCode value.
I've used an IF statement to evaluate the keyCode, but if numerous codes are evaluated then a SWITCH...CASE block would be a better choice.
function keyPressAction(e)
{
if (e == 27) //Key = ESCAPE
{
//Code to execute goes here
}
}
There we are. Nothing major or ground-breaking, but a few functions which I think are useful and thought I'd share. I'm nice like that :)
Today I launched my long-awaited (for me anyway) new version of my website! This is version 9, and the first major overhaul since July 2009.
This site has been in coding for about six months. Not that it's really taken that long. It's just I haven't been as dedicated to sitting down and doing the coding as I could have been.
Here is a summary of the main changed:
Of course, being new there may be a few glitches here and there. I'll be keeping the site under review for a while and small things may change if they don't work as expected or cause problems (Commenting System - I'm looking at you!)
In terms of testing, I know that some browsers display this site better than others. IE6 users - you'll probably experience problems. All I have to say to that is 'sort yourselves out and get a decent, modern browser.'
I've tested this site as follows:
This site has been in coding for about six months. Not that it's really taken that long. It's just I haven't been as dedicated to sitting down and doing the coding as I could have been.
Here is a summary of the main changed:
- A larger font on both the main content and navigation sections should make the site easier to read. The lighter colour scheme should also make the site seem friendlier in comparison to the old dark greens and grays.
- Blog posts have a new commenting system which should be vastly easier to use. I will also get alerts when comments are submitted so the months shouldn't roll by before I get around to replying.
- All blog tags are immediately visible now, and are in a 'tag cloud' format instead of a straight alphabetical list. This means that more frequently used tags are given a larger font size and hence greater prominence.
- My Music Library is no longer contained within this site. Instead, it is now accessible via it's own URL: music.bengamblin.com. This is because the interface for the library has grown substantially. Where-as before it was a glorified list of songs, now it is much more dynamic and I intend to improve it further.
- The postcode lookup has been altered. Now, instead of doing a full page reload when searching for a postcode, just the appropriate part of the page will change (using AJAX/JavaScript). This should make the system feel smoother. The Google Map within this section has changed from an interactive type to three images at different zoom levels. A link will jump to Google Maps for interactivity if that is required.
- 'My Map' (previously known simply as 'Map') has been enhanced. Immediate plotting of each and every route in the database has been disabled to improve loading times and page efficiency. Instead, all routes are indicated by their start point. The map can be filtered to show just point markers, just route start points, or both. By clicking on icons in the map, options are given to centre-and-zoom and display route (if applicable).
- Search has been re-coded and doesn't cause any (known) errors any more. The old options to search the music library have been removed. Search results now appear in their own in-site popup window (again using AJAX/Javascript) as do the Search Options.
- The 'Elsewhere On The Web' section has been given a permanently displayed box on the right of the screen. Before this was hidden away, only to be displayed when toggled. The icons have been refreshed to create a more uniform look and to prevent this box from using too much space.
- Advertising has changed slightly to ensure it's not too intrusive on the new design.
- More RSS options are available, including links to external feeds.
Of course, being new there may be a few glitches here and there. I'll be keeping the site under review for a while and small things may change if they don't work as expected or cause problems (Commenting System - I'm looking at you!)
In terms of testing, I know that some browsers display this site better than others. IE6 users - you'll probably experience problems. All I have to say to that is 'sort yourselves out and get a decent, modern browser.'
I've tested this site as follows:
- Linux Mint, Firefox 3.6 (no problems)
- Linux Mint, Chromium 8.0.552 (no problems)
- Windows 7, Firefox 4.0b1 (no problems)
- Windows 7, Google Chrome (no problems)
- Windows 7, IE8 (display problems due to lack of CSS3 support but perfectly usable)
I went on holiday for a few days last week and as is really quite typical, it was during this holiday that my server decided to fail.
What made this particularly annoying was I had intended to use my server as remote storage for my photographs. Considering the holiday was my first abroad since 1998, I felt some form of backup for photographs would be important. That plan had to be abandoned when I could no longer gain access on Tuesday 3 August.
As far as I can establish, a power failure of an unknown magnitude occurred at some point on Tuesday. When I came home, I discovered that the Sky box had reset which can happen with the smallest glitches. Normally after a failure, the computer restarts and all is well. However the server had no power when I returned home in the early hours of Thursday morning. I switched the machine on and ignored the numerous beeps emitted by the PC speaker being too tired to acknowledge them.
Realising the next day that I still could not access the server, I took the monitor from my normal machine, connected it to the server along with a spare keyboard and discovered that the CMOS had reset to its defaults. I checked over the BIOS settings and all seeming well, booted the server. What I didn't notice however was that there was no mention on bootup of the SATA to IDE controller to which my data drive was connected. When I noticed a few failure messages on start, I tried to access the data drive but was unsuccessful.
Panic started to set in at this point. Had I lost nearly 1TB of data? I took the drive out of the server and plugged it into my more modern general use machine. I could feel and hear the hum of the drive spinning and the BIOS detected it. Thank goodness, it seemed to be intact.
I then did a little experiment, powering the drive from my general machine, but connecting the drive to the server's SATA controller. Still the server did not recognise it. That led me to deduce that the onboard SATA controller on my server had failed.
So that left me with a dilemma. How do I get this drive reconnected to the server? Could I buy a new controller card? I did some research but the cheaper cards did not appear to be reliable with Linux. More expensive cards were out of my price range. So the alternative was to run the data drive as an external USB drive. I purchased an enclosure suitable for a 3.5" SATA drive and that arrived today.
I was very impressed to find that on connecting the drive to the server via USB, it was instantly detected and mounted at the correct point meaning everything instantly came back to life! Panic over!
Fortunately I had run a partial backup of this drive so if it had failed, I wouldn't have lost everything. Unfortunately though I don't have enough storage space to do a full backup of nearly 1TB. This scare has led me to realise I really need to get this sorted as soon as possible. I'll probably look at a solution to backup up to 2TB of data considering I am now recording HD home videos which consume a lot of space. I think 1TB of space will be consumed reasonably quickly.
What made this particularly annoying was I had intended to use my server as remote storage for my photographs. Considering the holiday was my first abroad since 1998, I felt some form of backup for photographs would be important. That plan had to be abandoned when I could no longer gain access on Tuesday 3 August.
As far as I can establish, a power failure of an unknown magnitude occurred at some point on Tuesday. When I came home, I discovered that the Sky box had reset which can happen with the smallest glitches. Normally after a failure, the computer restarts and all is well. However the server had no power when I returned home in the early hours of Thursday morning. I switched the machine on and ignored the numerous beeps emitted by the PC speaker being too tired to acknowledge them.
Realising the next day that I still could not access the server, I took the monitor from my normal machine, connected it to the server along with a spare keyboard and discovered that the CMOS had reset to its defaults. I checked over the BIOS settings and all seeming well, booted the server. What I didn't notice however was that there was no mention on bootup of the SATA to IDE controller to which my data drive was connected. When I noticed a few failure messages on start, I tried to access the data drive but was unsuccessful.
Panic started to set in at this point. Had I lost nearly 1TB of data? I took the drive out of the server and plugged it into my more modern general use machine. I could feel and hear the hum of the drive spinning and the BIOS detected it. Thank goodness, it seemed to be intact.
I then did a little experiment, powering the drive from my general machine, but connecting the drive to the server's SATA controller. Still the server did not recognise it. That led me to deduce that the onboard SATA controller on my server had failed.
So that left me with a dilemma. How do I get this drive reconnected to the server? Could I buy a new controller card? I did some research but the cheaper cards did not appear to be reliable with Linux. More expensive cards were out of my price range. So the alternative was to run the data drive as an external USB drive. I purchased an enclosure suitable for a 3.5" SATA drive and that arrived today.
I was very impressed to find that on connecting the drive to the server via USB, it was instantly detected and mounted at the correct point meaning everything instantly came back to life! Panic over!
Fortunately I had run a partial backup of this drive so if it had failed, I wouldn't have lost everything. Unfortunately though I don't have enough storage space to do a full backup of nearly 1TB. This scare has led me to realise I really need to get this sorted as soon as possible. I'll probably look at a solution to backup up to 2TB of data considering I am now recording HD home videos which consume a lot of space. I think 1TB of space will be consumed reasonably quickly.
It seems I've somehow managed to break images on this site. Goodness knows how mind you.
Until I figure it out, I've disabled the Photography section and removed images from blog posts. I'll put them back when the mystery is solved.
What's most strange is that my recent coding has had nothing to do with images. I did wonder if I'd damaged some of my own PHP functions but nothing has jumped out at me so far.
It is nearly midnight though, so maybe I'll solve it with a fresh head tomorrow.
Until I figure it out, I've disabled the Photography section and removed images from blog posts. I'll put them back when the mystery is solved.
What's most strange is that my recent coding has had nothing to do with images. I did wonder if I'd damaged some of my own PHP functions but nothing has jumped out at me so far.
It is nearly midnight though, so maybe I'll solve it with a fresh head tomorrow.