You appear to be using Internet Explorer 6 or lower, which this site does not support. I recommend you upgrade to a more recent browser, such as Firefox or IE7.

Web development

Archived Posts from this Category

Yet more Ratebird.

Posted by Sam on 15 Jul 2010 | Tagged as: Internets, Mozilla, Web development

So I released Ratebird 0.32 with the aforementioned überfix for the RYM site.  Took a bit of noodling to get it to happen, but it turned out simpler was better and we got there in the end.   Basically if you’re on an artist page when signed in to RYM, your ratings for that artist’s releases appear instead of the ‘rate’ text in the far right; the long-standing problem is that this doesn’t happen for split or various artist releases…until now.  Hopefully the RYM guys won’t finally fix this in the immediate future, thus denying me my…er, glory?

I then noticed a typo in the install.rdf I uploaded so pushed 0.33 up with possibly the fastest Mozilla extension feature I’ve ever written – took me less than 40min to add a context menu option for library items that opens a new tab with a basic search of the album (or artist if the album tag is null) for that track.  Works for multiple tracks and pseudoThreaded too, just in case.  Will get back on to improving the core feature for 0.4, although it won’t be for at least a couple of weeks.

And finally, I looked at the CDN stuff again and it would appear the aforementioned Google App Engine doesn’t support PHP/MySQL – putting WordPress and this site right out of the equation.  There has been some success in getting WordPress to work but it’s pretty damn fiddly and I’d probably just be better off paying for Amazon’s CDN.  Will revisit at some point.

Ratebird can be found here.

Zend Certification

Posted by Sam on 05 Jul 2010 | Tagged as: Internets, Life, Web development, Work

I passed my Zend PHP5 Certification exam today, which has been a long time coming; work and life always managed to get in the way of studying for and, crucially, booking the exam itself.

It was certainly more broad, less fiddly/fussy than the practice tests available on the Web, and thankfully with far fewer grammatical, spelling and, most annoyingly, syntactical errors.  Whilst the flaws of the exam are obvious (it often favours testing recall of function syntax, specific behaviour, obscure use cases, etc. over real-world problems and coding skill or elegance of solutions), I found it a highly positive experience to really get into some of the dark corners of the PHP manual; I feel I came away with a heightened understanding of the language in general and learnt a lot about the more advanced (and interesting) new techniques available.  Especially streams…that’s a funky set of functionality right there.

Maybe I’ll apply some of the techniques I learnt to this site, but first of all it needs a new design, which shouldn’t take too long now that I’ve found myself with a lot more ‘free’ time.

New Extension

Posted by Sam on 19 Jan 2010 | Tagged as: Internets, Mozilla, Music, Web development

So I got annoyed with looking up albums in RYM and decided to write something to extract the ratings into Songbird.  The result is here, it’s actually at 0.2 already because I’ve done quite a lot of work on it recently (whilst being something of a slack blogger).  Now all I need are the POTI guys to make Songbird do multiple genre tagging, improve the search/filter functions accordingly and then make Songbird much snappier with large libraries.  Then I will have the (almost) perfect media player.

Future plans include integrating the RYM enhancer script into this, once I’ve got the hang of pref management.

Assorted site woes

Posted by Sam on 24 Feb 2009 | Tagged as: Internets, Web development

In the mini-flurry of work I’ve been doing on this site recently, I’ve noticed that the loading speed is very slack.  I used the same tools as I use at work (Firebug, YSlow) to analyse the performance issue and have made a number of structural fixes that have made things a bit faster, but it seems to be the initial GET request that is taking the most time.  I’ll talk to DreamHost about it, although given that they’re in the US, it could just be that I need to look at acquiring a CDN.  Obviously I can’t afford it, but I did find an interesting article detailing how to set up Google App Engine, for free, as a personal CDN.  It’s apparently limited to files smaller than 1MB, 650,000 requests per day and 10GB of downloads – but that’s perfectly fine for 99.9% of the things that this site serves.

On a side-note, I’ve switched to a better browser detection script as the old one had serious issues with IE8.  I know that browser-sniffing is not a good thing, but it seems to work fine for now (and it’s only really for IE6/7 – everything else gets pretty much the same standards-based HTML/CSS/JS), at least until I sort out some kind of feature detection routine.

And on a completely different side-note, using this page I finally fixed the annoying console error messages that plague Firefox with Firebug and HTML Validator extensions installed.  Hurrah!

RYM Greasemonkey script

Posted by Sam on 19 Feb 2009 | Tagged as: Internets, Mozilla, Web development

Yes, that’s right.

The short story is I got annoyed at the glacial pace of feature development over on Rate Your Music, Richey showed me a couple of Greasemonkey scripts he found to enhance the experience and this one popped up as being the most useful.  Except that I didn’t like a few things about it, so proceeded to simplify the options and add a small pile of new features.

So I present my enhanced version of the RYM enhancer script.  Features:

  • Changes ratings from 0.5-5 to 1-10*
  • Sets hover (title) text of star rating to a 1-10 scale*
  • Calculates average ratings for each artist and release category (album, single, video, etc.)*
  • Enhances ratings with colour (1-4 red; 4-7 yellow; 7-10 green)*
  • Highlights rated, owned or wishlist items in both custom charts and lists
    • Rated items are highlighted in blue, owned items in yellow, wishlist items are red.
    • Each type of highlight can be switched on or off depending on user preference.
    • If both owned and rated highlights are selected, owned items which have also been rated are highlighted in green.
    • If both wishlist and rated highlights are selected, wishlist items which have also been rated are highlighted in purple.
    • Calculates the total number of each different highlighted item type at the bottom of the page.  This is performed dynamically based on the highlighting preferences.

Starred items are features carried over from the original version of the script.  Highlight colours have been carefully chosen to allow readability, and also to provide a colour combination metaphor when rated & owned, or rated & wishlist, highlights are selected.  You can’t own an item and have it on your wishlist, so there is no combination highlight for that.

There are certain circumstances where releases that you have rated will not be highlighted.  This is because RYM allows you to rate multiple versions of any given release, but doesn’t provide a user friendly way to manage these ratings with respect to the release as a whole.  So if you have rated a release version which is different to that displayed in a list or chart, that album’s entry will not show up as having been rated.  Most annoyingly, this also happens when looking at artist pages; the way I currently get around it is to rate multiple versions of the same album, which achieves the desired results but can be annoying as you are rating the same release multiple times.  I might see if I can provide a better fix to this issue with an extension to the script.

Needless to say, this requires Firefox and the Greasemonkey extension.  Go get it :)

New WordPress Widget/Plugin

Posted by Sam on 14 Jan 2009 | Tagged as: Internets, Web development

I wanted to find an easily customisable search box plugin for my blog, as the default one is a bit boring to say the least.  I couldn’t find one that did everything I wanted, so I set about writing my own.

Features:

  • Customisable title
  • Customisable button text
  • Choose between text button or image button
  • Customisable margin between button and text box
  • Choose between small or large image buttons – small image button is designed to be used with a negative margin to place the search button inside the text box
  • Info boxes in the admin area explaining everything
  • Change the default images for your own, with optimum margin for ‘inner button’ case dynamically calculated and displayed in the admin area

This is based on the rather obviously named Search Widget with Title, and has been fully tested on WordPress 2.7.

So, here it is…Advanced Search Widget

Instructions: Unzip the download, upload the directory within to your plugins directory.  Then, activate the plugin and add the widget to one of your sidebars.

JS++

Posted by Sam on 21 Sep 2008 | Tagged as: Internets, Web development

The recent massive improvements in JavaScript performance are absolutely awesome for a number of reasons:

  1. When I use a Web app, it will be much faster, and more responsive :)
  2. Microsoft and Adobe should be scared, as JS may just prove to be the true open-source competitor to Silverlight and AIR.
  3. It will pave the way for more advanced, cross-platform Web apps.
  4. Hopefully, as the speed difference between old and new browsers becomes more apparent, it will speed up the switchover from the horrors of IE6.  New apps will start to support IE6 less and less, as the performance hit will be unacceptable.
  5. It could help attempts to piggyback certain technologies that Microsoft will probably never support (such as Canvas), onto IE.  Of course, this assumes that MS keeps up with the curve regarding JS performance.

And on a completely unrelated note, I found a cool page that beautifully sums up the options for IE when it comes to exploiting CSS hacks.  Whilst I knew most of the hacks on the page, this inline rule was quite interesting:

style=”*background:red!important;background:white!important;background:blue;”

The first background rule applies to IE7 only, the second to all other (more advanced) browsers, and the last one to IE6 only.  While inline CSS is not good for obvious reasons, I have found this hack to be quick and useful when restricted by bad design in some of our older sites.

Edit: This can also be used in external CSS files, as shown by this neat tutorial.  Furthermore, it shows that we can combine the star hack (applies to IE6 and 7) with the underscore hack (applies only to IE6), to produce a more streamlined version of this style attribute:

style=”*background:red;background:white;_background:blue;”

New Job :)

Posted by Sam on 18 Dec 2007 | Tagged as: Life, Web development, Work

Right, I haven’t blogged for ages so here’s the f’shizzle:

I recently moved from Edinburgh back down to Sheffield, staying at Richey’s while I started my job and found somewhere for me and the girly thing to live… I’m working for School Trends doing 2nd Line Web Technical Support, basically fixing stuff that the customers (mainly schools) have problems with, in managing their websites. What’s cool about it is I can try my hand at pretty much anything that helps to make the software or customer experience better, which is quite liberating, although the requirements of the position will relegate my coding explorations to only a few hours a week. I’m still ultimately aiming to be able to do Web App development, so any R&D or general developmental experience at School Trends will be great and I’ll jump on any chance to make their software better and help with redesigning the UI.

The new abode will be in Ranmoor, which is particularly poncey – as is the flat :) It’s about 45-55min walk out of town, from what I can tell – which isn’t quite as close as I originally wanted but it’s an awesome area and the flat is seriously phat. It’s really hard to get decent flats in nice areas much closer to town. Hopefully I should have all my junk moved up from dearest mama’s by early January too.

This site hasn’t had much done on it at all recently besides finally fix the menu to a point where I’m actually rather pleased with it; I am however getting a lot more confident with PHP & MySQL so it should take less time to roll out things that I want put on the site. The quote generator test I did worked fine, which means that the random image generator will take only about 5min to do, given that the code is quite basic and pretty much the same thing. The main thing I will be working on before both of those are live is the login system, I need it to be as close to the LoginView .NET control as I can get it in terms of functionality. SEO is also a priority; I really need to get my Google listing sorted. Hopefully by the time I’ve got somewhere with those I’ll have some more content (I know, it’s crazy talk…actual content on my site!), and then I’ll probably do that AJAXy Photo viewer along with some Semantic Web stuff.

Edit:

Little did I know that being entirely responsible for the development of a CMS, as well as most technical support issues for over 200 customers, would completely demolish my appetite for spending time developing this site.  A few months ago, one of the Mozilla developers blogged about losing his interest in developing Firefox extensions due to spending most of his working day hacking on the ‘fox.  I totally empathise with this, although I don’t plan on giving up on this site just yet.  So:

  • Photos will happen eventually, although I’ll probably grab someone else’s viewer code and customise it a little.
  • Login system has been dropped as it was rather ambitious and probably would not have been used much anyway.
  • Changes to the design are now mainly restricted to CSS bug fixing.  If/when I get bored of the design, I will either make gradual changes or, if I want a fairly substantial change, will just pick a nice WP template.
  • I can’t be bothered to make this site work in IE6, I spend enough time doing that at work.  Anything to hasten it’s demise…
  • The GridView tutorial won’t be happening – I’m not in possession of it, I’ve tried numerous times to get my hands on it in some form but to no avail.  It is a pity as I spent ages on it and it would have been a great addition to the site, along with a good way to reacquaint myself with .NET, but ‘s been quite a while so I’ll just let it go now.  I have some other things in the pipeline to help flesh out the Downloads page.

—————-
Listening to: Kayo Dot – The Antique

Update #64,587

Posted by Sam on 09 Nov 2007 | Tagged as: Web development

Just a few things changed:

  • New menu – not finished but looking a lot better. Found a good workaround for the IE7 ‘current page’ CSS issue Edit: More menu improvements but the IE7 current page tab appearance (z-index) bug is back. Annoying. Edit #2: Finally fixed it for good with an overlay image and some CSS tweaking – this seems to be the way that most sites utilising similar menus make them work in all browsers.
  • JS animations courtesy of JQuery . House now fades, menu tabs are ‘pulled up’ on hover, content togglers slide nicely
  • Minor improvements to house image
  • Content ‘sanitised’ to take account of potential humour deficiency
  • Sidebar pics added – some of these will change, and some will be randomised once I finalise how best to go about hooking a PHP image randomisation routine up with the existing Smarty templates.
  • Some minor validation errors fixed
  • More CV tweaking

Whilst I’m thinking about IE7 CSS bugs, I found this great page with loads of bug reports and testcases. Not too many workarounds, but it’s nice to know that the bizarre behaviour you’ve seen in IE7 has actually been reported by someone else as a bug. The site also has sections on IE6, Opera and Mozilla.

Next thing to do is fix the CSS and JS generation script so that it generates the files less frequently – At the moment lots of hits will probably result in a dead Dreamhost server.

Browsers are weird…especially Internet Exploder.

Posted by Sam on 13 Oct 2007 | Tagged as: Web development

Some more updates to the site:

  • About page finally has something decent on it – blurb about me (strangely enough) and a personalDNA swatch script, slightly modified to fix an annoying gap in my swatch and to ensure the output validates.
  • Minor menu tweaks
  • Minor CV tweaks
  • Minor SST page tweaks, example tables now look and play nicer.
  • Fixed a couple of obvious silly errors
  • Fixed Copyright element adjustment script for small pages in IE7 and Opera

The last item on the list was interesting. For some odd reason, my JS that worked perfectly well in Fx and Safari was failing miserably (without an error) in IE7 and Opera. The script basically just retrieves the following element with getElementById:

<p id=”copyright>Copyright ©2005-2007 Sam Maister, All Rights Reserved.</p>

…before adding extra padding (via inline CSS) to ensure that it is at the bottom of the page, if the content is too small to push the element to the bottom. So I tried a few things out such as changing the element to a div, removing the existing applicable CSS rules, using ye olde document.all.getElementById, etc. None of these worked, and I quickly realised that the existing method did actually work, just not on that particular element. So I tried a couple more things before changing the id of the element from ‘copyright’ to something arbitrary; I didn’t expect this to work at all, but work it did. To test my theory, I changed the id of a different element to ‘copyright’ and that element was now immune to the script…bizarre; for some reason IE and Opera (maybe through some misguided attempt to be more IE-like?) seem to ignore any attempt to retrieve an element with an id of ‘copyright’ through getElementById. Googling it came up with nothing, but whatever. Now I have ‘copyright_notice’ and everything is peachy.

Here’s a simple testcase:

inline JS – var copy=document.getElementById(‘copyright’);
var notcopy=document.getElementById(‘this_copyright_bug_is_stupid’);
copy.style.color=’red’;
notcopy.style.color=’red’;

Clicking here should change both of the following text lines red. Click here to reset the colours:

I have an id of ‘copyright’.
I have an id of ‘this_copyright_bug_is_stupid’.

Edit: Another reason I should really be using jQuery for all of my JS stuff; this bug doesn’t occur when you use $(“#copyright”).css(“color”,”red”); instead of the clunky code above.

Next Page »