Alex Little

Spent the last few days at the Future of Web Apps conference, and, as with the previous one in February, loads of excellent presentations and lots of food for thought. Also managed to wrangle myself a place in the workshop sessions, which were well worth it. Here were the highlights for me…

Steve Souders (Yahoo) on high performance websites, excellent tips on how to improve the response time in your web app. This was all focussed on improving the speed of the front end, rather than the more usual approach of improving backend speed (with database optimisation etc) – but as he demonstrated, the gains are much more significant when applied to the front end. Steve also gave a workshop on the same subject – his presentation slides give all the info you need – rather than me repeating it all here. Steve’s team have built a plugin for FireBug, YSlow, making it easy to show how your web app scores against his 14 rules (see the presentation for details of these rules). The only one of these rules I would question, for all but the biggest of web sites/apps, is the Content Delivery Network (CDN). Out of interest, I ran YSlow against our OpenLearn site and there is definitely some scope for improvement.

Dion Almaer (Google) on Google Gears, this was broadly the same as I’d heard at the Google Developer Day and I’m still not totally convinced it will get huge take-up. The reason being that I think it’s only really relevant for a small slice of web apps – eg for salesmen-out-on-the-road apps – or maybe I’m being unfair, being able to use GoogleDocs when not online would be good. I am quite interested in the WorkerPool with thread-like JavaScript, and would be fantastic if this could be implemented in JavaScript generally. I should probably mention that I do actually like the fact I’m not always connected to the web!

Robin Christopherson (AbilityNet) – I think this is the first time I’ve been to a mainstream web development conference where there’s been a presentation highlighting how to develop for visually impaired users and I’m sure (hoping!) his demo of screen reader software (especially the reading of the image names on the Amazon tabs) was an eye-opener (excuse the pun).

Heidi Pollock (BluePulse) on the mobile web and all the associated complications and headaches due to the sheer number of different web browsers used on different phones and the screen size you can actually work with. Before her presentation I would have had no idea where to start designing an app for mobile phone, now I do, but whether I want to cope with all those headaches is another matter!

John Resig (JQuery) gave an insight on the future of JavaScript (v2). Though I have a voice in the back of my head telling me that it’s just converging with Java, for example, optionally giving variables types and being able to import packages of classes. However, ignoring my fears that this is reinventing Java, it will certainly be good to see some more ‘real-programming’ type principles applied to JavaScript. I did learn Java before JavaScript, so maybe I’m biased anyway. Another thing John mentioned and is applicable to the work I was looking at alerting user to a new MSG message with a beep, is the implementation of <video/> and <audio/> tags in HTML 5.

Joe Walker (DWR) on Comet and attempting to get over the hurdle of the fact that the web is a pull technology. This is something we had to address with MSG, being able to push new message notifications and presence state changes out to the user. We achieved this by use long running connections, only returning if some needs pushing out to the client, or after around 45 seconds. So I’ll need to look into whether comet can give us a better/different approach.

Tom Coates (Yahoo) showing FireEagle (though it’ll have a different name on release), a way of sharing your location, so relevant to me with the MSG – Google Maps integration. Essentially it provides a service that applications and devices can use to either write or read your current location. So you could have your mobile phone automatically update where you are now (using GPS) and have this fed out to Twitter. This could be a really good one for us to look at for MSG and auto updating your location rather than relying on someone remembering to go update their location. As Tom pointed out, there are loads of potential privacy issues/concerns (“Burglary 2.0″ was mentioned during the Q&A), but they seem to have done a really good job of addressing and anticipating these.

And last, but by no means least, Michael Kowolski’s (Kitsite) workshop on Interface Design for Web Apps, reminding us just how critical a good user interface is – and he wasn’t just talking about the graphical design. Everything he mentioned ought to be common-sense, obvious and in-built to web app developers/designers, but to me it highlighted just how often and easily it gets overlooked. Creating a easy-to-use and intuitive interface actually requires quite a lot of thought and planning, the fact that the user doesn’t have to learn the interface is a *good thing*.
It did make me think that Moodle has a way to go in this respect, I know that Moodle has ‘themes’, but essentially this is just changing the CSS and a few graphics, and that’s not really changing the interface. Michael is going to post the presentation up soon (here), and it’ll be a good one to look through again.

All in all, a thought provoking few days, and makes me wish I had far more time to investigate in detail all I’ve found out. The final thing I’ve learned is that I ought to get into the habit of blogging live, rather than leaving it till I get home and trying to remember all the excellent stuff I found out about! (or take better notes…)

I’ve now started work on being able to launch an instant FlashMeeting when you are using MSG. This would enable users to start up video & voice capabilities directly from MSG, rather than having to visit the FlashMeeting site seperately and book a meeting. It would also be a workaround for (all) those who want voice chat and multi-user chat as you could just instantly fire up FlashMeeting to get these capabilities. Most of the structure is now in place, we just need to get a service built which would book the FlashMeeting (behind the scenes) and check the FM server has capacity etc. Hopefully we should be able to get this implemented soon

After not realising that I’d received an MSG message the other day because the window that received the message was buried under a heap of other windows, though I’d look at adding message beep when a new message arrives (MSGAlert already does this – but not the web client or MSG API). However it appears that using javascript (which is what I’d need to use) to trigger sounds in the browser seems to be fraught with browser (and audio player plugin) differences. I did find SoundManager2 which worked really well as it essentially uses an invisible Flash object to play the sound.

But then I tried (and failed) to get this implemented into the MSG Netvibes widget, and I *think* this is to do with the way Netvibes restricts calling external (to the widget XML) javascript code, whch is kind of a shame as that’s exactly where I wanted to put a beep notification. I’ll probably have another go at this next week to see if I can get this working – though I’m not too confident! I should also figure out how GTalk handles beeping when you get a new message.

I’ve just updated the MSG Netvibes widget to include a link to the MSG Presence maps page so you can launch the map without having to go through the MSG client first.

I’ve finally got round to fixing the issue I had with the character encoding on my photo pages. Whereever “München” was printed, what actually appeared on the page was a question mark on black diamond rather than the u umlaut.

After bit of messing around I fixed the problem – turned out to be to do with the connection between PHP and MySQL, all I needed to do was add the command:
mysql_query(“SET NAMES utf8″);
before I did the query to extract from the database.

Previously I was looking as issues with the character encoding in the header, meta tags etc and couldn’t find anything wrong with these. Though not entirely sure exactly what this SET NAMES command actually does – will need to go & ook it up ….

Yesterday I was writing some javascript code to dynamically produce a list and add an event listener for when an item in the list was clicked on. When I then tested it out, for some reason the last event listener seems to have overridden all the others in the list. I’m not sure if the is a Javascript ‘feature’ or bug, but it occurs in both Firefox (v2) and IE (v6).
This is the code I tested:

function init(){
	var myUl = document.getElementById("test");

	for(var i=0; i<10; i++){
		var myLi = document.createElement("li");
		mySpan = document.createElement("span");
		mySpan.setAttribute("id","myspan"+i);
		myLi.appendChild(mySpan);
		myUl.appendChild(myLi);

		mySpan.appendChild(document.createTextNode(i));
		if(mySpan.addEventListener){ // Mozilla, Netscape, Firefox
			mySpan.addEventListener('click', function(){test(i);}, false);
		} else { // IE
			mySpan.attachEvent('onclick', function(){test(i);});
		}
	}
}

function test(myNum){
	alert(myNum);
}

This produces an unordered list of 10 items – (0-9), but when you click on any of the numbers the alert returns ’10′, rather than the expected 0-9 depending on which on you click. I could understand if it returned ’9′ for every item in the list – but why 10?? I spent ages fiddling with this, but never did find what was actually causing this to occur – it seems like a bug to me – unless I’m just misunderstanding how the addEventListeners work? Maybe something to do with the fact I’m using anonymous functions?

If anyone has an explanation (or can point me to an explanation) as to what I’ve done wrong it would be much appreciated.

For info I managed to get around the problem by using the code below instead, though I’d still like to know what was wrong with my original code!

function init(){
	var myUl = document.getElementById("test");

	for(var i=0; i<10; i++){
		var myLi = document.createElement("li");
		mySpan = document.createElement("span");
		mySpan.setAttribute("id",i);
		myLi.appendChild(mySpan);
		myUl.appendChild(myLi);

		mySpan.appendChild(document.createTextNode(i));
		if(mySpan.addEventListener){ // Mozilla, Netscape, Firefox
			mySpan.addEventListener('click', eventHandler, false);
		} else { // IE
			mySpan.attachEvent('onclick', eventHandler);
		}
	}
}

function eventHandler(e){
	var e=e? e : window.event;
	var el=e.target? e.target : e.srcElement;
	alert(el.id);
}

I’ve now implemented the chat history function on the msg.open.ac.uk server, so we can try it out there for little while, before I transfer it over to the msg-openlearn server.

I have found a couple of little ‘quirks’ which I’m not sure will annoy users or not…

1. the chat history is only written to the log files every 120 seconds (or whatever no of secs I set it to), presumably to stop too many file read/writes which would have performance implications. But it means that if you have a conversation, close the window, then immediately re-open a chat with the same user and try to load the history, you may not see the message history from the last couple of minutes (the history will be there later, just not now). I don’t know that I can completely resolve this, but I have set the log files to be written every 30 seconds, so hopefully it won’t be an issue.
2. another thing that may look a bit odd is that if you have a chat with someone for a little while, and then decide to load the history, the messages from over 2 mins ago will appear twice. I don’t want to just overwrite the whole chat window, because then you won’t get the most recent messages (due to (1)), and I guess seeing the message twice is better than not at all. I think I’ve got a way around this, and that is to load mark the “loaded chat history” in the interface, so you know what is currently stored – and it then won’t look so odd that some messages appear twice.

Any feedback on the new chat history function is much appreciated

well, English and Portuguese, so maybe bilingual rather than multilingual!

Thanks to Pedro Crispim for giving me the Portuguese lanugauge file for the online users map block

It’s in the Moodle CVS if you’d like to download it and if anyone else feels like translating into other languages, please do – if you already have then send me the lang file so I can add it to the package for others to use

Spent the day yesterday figuring out how I could implement a load chat history function in MSG – as one of the things I find a little annoying with MSG is that if you accidentally close the chat window, you can’t get the chat back – and if I find it irritating then I’m sure others do too

There were 2 ways I thought I could approach this…

1. In BuddyXML (essentially the MSG server layer) intercept the messages as they are sent to/from users and store in files on the server, just in a directory structure reflecting the users involved
2. Enable logging in the OpenFire server and parse these to give the user their chat conversation with the user selected

Each of these options has it’s pros and cons. Approach 1 means creating a new logging system (re-inventing functionality already implemented in OpenFire), but it would be quick to return the results to users (no parsing involved), whereas approach 2 has the opposite pros & cons – the logging is already implemented, but if the logs get big, it could take a while to parse/process them.

I decided to take approach 2, as it just *seems right*, but if it does start to become slow (with the parsing involved) we’ve got another method we could implement. In order to reduce the amount of parsing of log files, I’m restricting the conversation history returned to the last 7 days – although I’ll set the server to store the last 30 days, so we can increase the amount of history returned if it all works ok.

I’ve got most of this fixed up now and implemented – the final bit to put in place is to actually display the history back to the user in the chat window.

Hopefully this function with be useful to people (well, at the very least, I’ll find it handy!)

This morning the live OpenLearn servers have been updated with quite a few improvements…

• RSS feeds published for a variety for units (including unit content)
• MyLearningSpace and MyLabSpace – so you can see your courses, recent forum postings etc in one place (well really it’s 2 places!! – one for each OpenLearn site)
• More prominent forums – so will hopefully generate some more discussion, and what dicussion there is will be more visible to users
• much more sensible login navigation for users with OUCU (SAMS) user accounts
• plus, obviously the most important update (!) is to MSG block, so you now receive much more obvious new message notifications, when a new message arrives you’ll see a small pop up box appear in the bottom right of your browser window (in a similar way to how GTalk informs you of new messages)

Plus there have been lots of other updates to the servers too (bug fixes etc), but the ones above are (IMHO) the most significant.

In ‘other news’, I’ve put the FB stuff on bit a of a backburner for now, whilst we get chance to think about what exactly we want the FaceBook MSG application to actually do. The other (real!) reason for this is that I had quite an obscure bug which took most of last week to track down and fix. In the MSG forums there were a few people who weren’t getting automatically logged in to MSG. There didn’t appear to be any pattern to who was affected, and I didn;t have a user account which displayed the issue, so was difficult to pin down. Eventually we found it was to do with not all users being auto logged in to both LearningSpace and LabSpace, and it was these users who then didn;t get logged in to MSG. So we’re pretty sure we’ve got the issue fixed now, but if you’re still affected then please let us know!