I was recently contacted by American Express as part of a market research thing.
The market research involved several members of the market research company interviewing me with a film crew present, and some other people who I guess were employees of either AMEX or the market research company witnessing proceedings.
Continue reading ‘Why hasn’t on-line banking experienced a Web 2.0 overhaul?’
And what do I even mean by that?
Well what I’ve been longing for is an on-line store that I can use for the majority of my purchases. The problem I seem to have here is that my purchases are so varied. I also suffer because I am fussy about which sites to use as they have to be designed well and have high usability in mind.
So, what on earth am I looking for that I feel it doesn’t exist?
Continue reading ‘Is there such a thing as a good online bicycle shop?’
The Flickr web services were great, but just a little annoying in that to make them work in a web page I would always have to create wrappers on the server to perform the web service calls. I had to do this as if you’re in JavaScript you have no permission to perform a cross-domain XmlHttp call, and because if you’re not doing it in JavaScript you were on the server anyway.
The two biggest reasons I disliked this are that it added load to my server, and it added a dependency on the responsiveness of my server on the responsiveness of the Flickr servers.
That is now a thing of the past.
JSON is JavaScript Object Notation. It is a way of encapsulating within JavaScript a hierarchical object model and of populating that with properties, values and content.
It is documented here: http://www.json.org/ and is simply a joy to use.
All you need do is add a HTML script tag to your page with the SRC of that being the JSON web service that you wish to call, once the web service returns you have a JavaScript object that you can act on.
Because you can pull in JavaScript from across domains, this works across domains.
So I played around with it for half an hour last night and knocked out a demo. What the demo does is takes a username of a Flickr user (I’m “the boy on the bike”), looks up their Flickr Id, and then queries the most recent public photographs for that user and renders the thumbnails of them.
Here is a demonstration (right click to download the source).
Here is the code that I used, remember to change the flickApiKey to use it on your site:
<html>
<head>
</head>
<body>
<script type="text/javascript">
var totalThumbs = 16;
var thumbsPerRow = 4;
var flickrApiKey = '73cd571dac7cb8390a8e848ed7ab5c09';
var flickrUsername = '';
function jsonFlickrApi(rsp) {
if (rsp.stat != "ok") {
document.getElementById('flickrContainer').appendChild(
document.createTextNode('Flickr Error: ' + rsp.message)
);
return;
} else if (rsp.user) {
var flickrPhotoScript = document.createElement('script');
flickrPhotoScript.type = 'text/javascript';
flickrPhotoScript.src =
'http://www.flickr.com/services/rest/?format=json&api_key=' + flickrApiKey +
'&method=flickr.people.getPublicPhotos&per_page=' + totalThumbs +
'&user_id=' + rsp.user.id;
flickrUsername = rsp.user.username._content;
document.getElementById('flickrContainer').appendChild(flickrPhotoScript);
} else if (rsp.photos) {
for (var ii = 0; ii < rsp.photos.photo.length; ii++) {
var photo = rsp.photos.photo[ii];
if (!ii) {
var userAnchor = document.createElement('a');
userAnchor.href = 'http://www.flickr.com/photos/' + photo.owner + '/';
userAnchor.appendChild(document.createTextNode(flickrUsername));
document.getElementById('flickrContainer').appendChild(
document.createTextNode(totalThumbs + ' Most recent photos from ')
);
document.getElementById('flickrContainer').appendChild(userAnchor);
document.getElementById('flickrContainer').appendChild(
document.createTextNode('.')
);
document.getElementById('flickrContainer').appendChild(
document.createElement('br')
);
}
var anchor = document.createElement('a');
anchor.href = 'http://www.flickr.com/photos/' + photo.owner + '/' + photo.id + '/';
var img = document.createElement('img');
img.height = 75;
img.width = 75;
img.border = 0;
img.alt = photo.title;
img.src = 'http://static.flickr.com/' + photo.server + '/' + photo.id + '_' + photo.secret + '_s.jpg';
anchor.appendChild(img);
document.getElementById('flickrContainer').appendChild(anchor);
if (ii % thumbsPerRow == thumbsPerRow - 1) {
document.getElementById('flickrContainer').appendChild(
document.createElement('br')
);
}
}
}
}
function flickrLoad() {
var flickrUserScript = document.createElement('script');
flickrUserScript.type = 'text/javascript';
flickrUserScript.src = 'http://www.flickr.com/services/rest/?format=json&api_key=' + flickrApiKey +
'&method=flickr.people.findByUsername&username=' + escape('the boy on the bike');
document.getElementById('flickrContainer').appendChild(flickrUserScript);
}
if (document.attachEvent) {
window.attachEvent('onload', flickrLoad);
} else if (document.addEventListener) {
window.addEventListener('load', flickrLoad, false);
}
</script>
<div id='flickrContainer' class='smallfont'></div>
</body>
</html>
Recent Comments