GregWolejkoAdding Events in JavaScript
Every once in a while I have to do a little bit of javascripting in a project that is too small to use some dedicated libraries like jQuery, Prototype or MooTools but is big enough that requires me to add custom even handlers there.
As fun as it may be you need to be careful when doing it as there are some possible pitfalls. What are those? Well, there are few:
- no easy way to test if element has an event assigned
- risk of overwriting handlers
- different browsers means different ways to actually get the job done (here is looking at you IE)
This is why it is always helpful to have this following piece of code for unobtrusive and cross browser adding and removing events. Code was originally written few years ago by the one and only John Resig but it is still awesomely cool and easy to use.
So without further hesitation, here are two important methods: addEvent and removeEvent.
addEvent (obj, type, fn)
Parameters:
- obj - element that event will be registered to
- type - type of the event
- fn - function that will be launched upon the event
Code:
function addEvent(obj, type, fn){
if (obj.attachEvent) {
obj['e' + type + fn] = fn;
obj[type + fn] = function(){
obj['e' + type + fn](window.event);
}
obj.attachEvent(’on’ + type, obj[type + fn]);
}
else
obj.addEventListener(type, fn, false);
}
removeEvent (obj, type, fn)
Parameters:
- obj - element that event will be registered to
- type - type of the event
- fn - function that will be launched upon the event
Code:
function removeEvent(obj, type, fn){
if (obj.detachEvent) {
obj.detachEvent(’on’ + type, obj[type + fn]);
obj[type + fn] = null;
}
else
obj.removeEventListener(type, fn, false);
}
Usage:
addEvent(document.getElementById('my_elem'),'click',foo);
And that is pretty much it. Just copy and paste it to your project and have fun with it.
Lifestreaming
Lifestreaming is a quite an interesting concept. It is loosely connected to the whole web3.0 slash semantic web thing as it is all about aggregating information and data that one publishes on different social sites in one place (application) for others to be able to view your complete online activity.
With all those interesting social sites that pretty much are a part of our lives the idea seems quite cool. I mean I would love the be able to group all my photos from flickr.com, my music from last.fm, twitts from twitter, posts from GregWolejko.com and maybe then I would even start using stuff like brightkite.com or use more frequently web apps like scrnshots.com or flickchart.com.
So why I haven’t been doing this? Or better yet, how can one do this right now?
Well there is one major player right now: FriendFeed and I don’t use it. Why? Hard to say. Basically it is not pretty and it is in fact a whole another social-y site you need to register to.
I was happily living in a world where I won’t be able to actually do a lifestreaming but then all has changed. Enter Sweetcron. A work in progres application (piece of opensource code) by Yongfook that will solve all my problems right there.
Sweetcron will be installable on your own servers (so it will for example be under gregwolejko.com domain) but will aggregate web activity from all over Teh Internet. Sounds pretty sweet. Only problem is that it is not out yet.
Only thing that you can do right now with Sweetcron is sign up for the newsletter to be notified when the product will be launched or see it as a live preview on Youngfook’s site.
Sweetcron is to be 100% free and fully customisable two things I am a sucker for. This will make stuff so much easier as it will be possible to seamlessly integrate it with your current web setup.
While I resisted the whole idea of a lifestreaming in the past now it seems that I will love Sweetcron. It seems that it will fulfill all my aggregating needs. Hopefully it will live up to the hype.
And what about you? Are you on board with the whole lifestreaming concept? Are you doing it? What do you use? Care to share?
Max Payne Trailer
Being a gamer and a comic fan I am always a bit worried when movie adaptations of various games (Uwe Boll’s Bloodrayne or Hitman) or comics (first Hulk) come out.
Hearing about upcoming Max Payne movie got me also worried but then I saw the trailer for it. And I have to admit that it is not half bad. The same cold feeling that was in the game seems to be placed in the movie and even Marky Mark as max doesn’t hurt my eyes as much as I expected.
Check it out for yourselves - Max Payne Trailer:
Debugging IE6
Every web developer needs to tackle the IE6 and its various CSS bugs once in a while. Generally it is a dreaded task as IE debugging is one of those really nasty jobs that just sometimes have to be done.
Yet I don’t despise IE6 that much. I don’t like it but the whole process of debugging IE6 CSS issues comes quite natural. Why is that?
It seems that if you work out your on process for it later on your job gets easier. There are however some ground rules that I try to stick to. So far so good, and my system haven’t failed me. All kinds of IE6 bugs come my way and I have been able to squash them quite proficiently.
So how do I do it? What is my magic workflow? Nothing fancy but maybe you’ll find it interesting or even better - helpful:
- IE Web Developer Toolbar - as close as you’ll get t o Firebug on IE
- Browser specific stylesheets - this is essential. No browser specific fixes without that.
- Learn about common IE6 bugs like double margin bug - info on float theory and lots of described IE bugs is covered by Smashing Magazine’s Float Theory article and also in this IE Primer
- Get to know the “hasLayout” issue - mind blowing experience. Every one needs to get to know it.
- Learn my and Bartek’s golden rule of IE6 debugging: “when in doubt use display:inline-block”
This is it. Nothing more to it. Sticking to those few simple rules I managed to greatly reduce my time spent on debugging and I am able to put more time into actual styling. Sounds good for me.
And as always, what about you? Do you have something to add? How do you tackle IE6? Care to share?
Why I bought a new PC and not a Mac
I bought new hardware yesterday. And 24 inch LCD. And it is not an iMac. Why is it?
It wasn’t an easy decision. Being an Apple fan(boy) that I am I was contemplating going the Apple way and buy me a new iMac. Yet, after lots (and I do mean lots) of thinking I decided that PC was better for me. Why?
Hopefully this post will help someone decide whether to buy PC or a Mac. If so - great. And here are my reasons why I bought PC and not a Mac:
I Have a Mac Book Pro - I love Macs. This is why I bought a MBP few months ago and I love every minute of using it. This was one of main reasons that I went with PC. If I haven’t had a Mac already I can’t guarantee my choice would be the same.
More Power - if you compare the technical specs of PCs and new Macs you can see that you can have more powerful computer going with PC. Of course people will make a point that with Macs you don’t need that much power but then comes the following argument…
Gaming Platform - I am gamer. I want to play. Although more and more games come out for Apple computers the market still favors PC machines.
Price - this one is simple you get more juice for less money.
Hardware Upgrades - with PC it is just way simpler to replace one part of your machine. Doing a hardware upgrade (CPU, graphics card) is just easier and cheaper.
And this is why I bought PC and not a Mac. Quite honestly games played a major part in my decision. If I were to take it out of the equation then my decision would have drastically changed. But since I am a hard core gamer that took a two year break from gaming and now I long for some action.
