David Chan’s Blog

It just occured to me that Twitter’s emo whale likes self-inflicted pain.

Like many others, I am excited about the Firefox 3 release today.  Unfortunately for all fans, the release is delayed as the official website is still not updated as of this morning.  Word on Twitter is that you can download Firefox 3 from the Japanese Firefox site.

With that installed you might want to update your Firebug plugin, if you haven’t done so already.  The Firebug site has been down for a while now and there is no indication on when it will be back, but there is a great guide at A Tiny Pixel which will help you get Firebug on Firefox 3.

Lots of work arounds, but I find it all worth it.

I recently wrote some Javascript to create a rotating headlines section, complete with fading animation, for a client’s site. It was based off the Hot News Headlines section on the front page of Apple’s website, and with the help of MooTools (with Moo.Fx), it was a simple task. Here’s what the rotating headlines look like at Apple.com:

Lets start. My HTML section looked something like this:

1
2
3
4
5
6
7

<style>
div.Headline { display: none; }
</style>
<div id="divHeadlines">
    <div class="Headline"><a href="#">Link 1</a></div>
    <div class="Headline"><a href="#">Link 2</a></div>
</div>

And my Javascript took care of the rest. The basic idea is to show a headline, and then set a timeout to hide the current headline and show the next one, with all the transition animations handled by MooTools:

8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62

<script type="text/javascript">
var arrHeadlines = null; 	// array to hold headline objects
var intAniDuration = 1;		// duration of transition animation (seconds)
var intViewDuration = 5;	// time before rotation (seconds)
 
function Init()
{
    if ($('divHeadlines'))
    {
        // get all headlines
        arrHeadlines = $('divHeadlines').getElements('div[class=Headline]');	
        // convert time to milliseconds        
        intAniDuration = intAniDuration * 1000;
        intViewDuration = intViewDuration * 1000;
        if (arrHeadlines != null && arrHeadlines.length > 0)
        {
            // hide all
            for (var i = 0; i < arrHeadlines.length; i++)
            {
                var fx = new Fx.Styles(arrHeadlines[i], { duration:0, wait:false });
                fx.set({ 'opacity': 0 });
            }
            // show first link
            ShowHeadline(0);
        }
    }
}
 
function ShowHeadline(idx)
{
    var oTargetDiv = arrHeadlines[idx];
    oTargetDiv.style.display = "block";   // make div appear
    var fx = new Fx.Styles(oTargetDiv, { duration:intAniDuration, wait:false });
    fx.start({ 'opacity': 1 });     // set opacity to visible
    // in X seconds time, hide this headline's div
    setTimeout("HideHeadline(" + idx + ")", intViewDuration)
}
 
function HideHeadline(idx)
{
    // get index of next headline to show
    var newIdx = idx + 1;
    if (newIdx >= arrHeadlines.length)
        newIdx = 0;    // reset index
    var oTargetDiv = arrHeadlines[idx];
    var fx = new Fx.Styles(oTargetDiv, { duration:intAniDuration, wait:false,
        onComplete:function(){
            oTargetDiv.style.display = "none"; ShowHeadline(newIdx);
        }/*end onComplete*/ });
    fx.start({ 'opacity': 0 });     // set to fade out, on complete, show next headline
}
 
// call Init after everything loads
Init();
</script>

Make sure you place the JavaScript block at the bottom of your page (before the </body> tag). Comments and suggestions appreciated, especially if you know of a more elegant solution.

Recently there has been lot of whispering on my Twitter friend’s timeline as to who’s on, or will be joining Plurk.  I took a quick look at it and my initial impressions were underwhelming, but I decided to make an account anyways.

The first thing in any new social network would be to find friends from other social networks.

I used the find friends from Twitter feature, and it gave me a list of Plurk users to add, which was great - until I realized it doesn’t send them a friend request. Now I was stuck as a fan of my Twitter friends, and to add them as friends on Plurk, I had to manually go to each person’s page and click the “Add as friend” button.  Not exactly what I had in mind when I initiated the import functionality.

As a developer, I’m always looking to see if something has an API.  Plurk doesn’t have one yet, but that doesn’t stop others from making their own versions.  I particularly like this one from YungSang.  Mashables say that an official API is coming.  I’ll be looking at that as soon as it comes!

What Plurk does offer in comparison to Twitter is a more social experience.  The whole Karma system and the numerous rewards found throughout the system work great to attract users and build adoption.  However, it feels a bit gimicky to encourage usage with rewards.  Time will tell if this is a good idea, when the novelty of the Karma rewards system runs out.

Plurk looks great, but it’s not enough to attract me to use it over Twitter.  Other Twitter folk express similar first impressions.  Lets see if my mind changes in the future.

Regardless of what others think of Panic at the Disco, I enjoy their music, and I thought I’d go see them live as they promote their Pretty. Odd. album.

I’ve seen pictures and videos of some of their performances which encorporate the circus theme, but that was more A Fever You Can’t Sweat Out era.  The current PATD is more 60’s flower power hippy, which I assume is why they have teamed up with Honda to promote the Civic hybrid.

They played some hits from their first cd, which are more danceable than some of their current songs, and which were obvious crowd pleasers.  They also performed numerous numbers from their latest album, though the crowd wasn’t as involved during those songs, from what I saw.

Here are three videos from the concert, before my Flip’s battery died.

Opened with We’re so Starving and Nine in the Afternoon

But it’s Better if You Do (probably my favorite PATD song)

The Only Difference Between Martyrdom and Suicide is Press Coverage

My coworker Nick Simpson is truely amazing.  He is one of the most knowledgable sys admins I’ve known and I’ve been with many different companies (ie. I’ve been around the block).  His blog is neatly designed and he stumbles on many neat things.  Just recently I’ve been introduced to a new Facebook app to keep track of birthdays, and I got that information from his recent post titled “Facebook iCal birthdays“.

But if you do a search for “Facebook iCal Birthdays” on Google, you won’t find Nick’s post.  Even a search for “Nick Simpson” doesn’t return much from his blog.

One thing I’ve noticed is that the permalinks for his blog posts are in a very machine unfriendly format.

This doesn’t translate into any searchable keywords, and makes it hard for anyone to find this via a keyword search.

I’m a big fan of searchables and many readers of my blog find my content via search engines (actually, only through Google…is there any other search engine?).

I hope Nick reads this and changes his permalink structure to include the post’s title, or the post’s keywords, as part of the permalink for the story.  You may already know this, but in WordPress, going into Settings->Permalinks will allow you to choose a suitable link for your posts.

What good is creating content if no one can find it?

You may have heard of Google I/O, but you may not have known it to be a secret weapon in Google’s grand scheme.  So powerful, Google advertises it proudly on tshirts as “Google KO”.  KO as in Knock Out.

[Image via TechCrunch]

Excerpt: “Attendees of the Google I/O conference today were given t-shirts that, presumably, were supposed to spell GOOGLEIO on the front in binary. Just one problem, the actual message printed spells GOOGLEKO”

Google Gets Fancy With Google I/O TShirts.  Too Fancy. [TechCrunch]

I started using Twitter Tools a few weeks ago to aggregate my tweets in a daily blog post.  Last weekend, I had an idea where I could also aggregate tweets in my friends timeline.  I thought that it would be cool to show the links that my friends are sharing with the Twitterverse.

I started with Twitter Tools as a base, and after reading and understanding the code, it was relatively straightforward to add a seperate call to the friends timeline.  Once I had the desired tweets, scraping, storing and posting the ones containing links were easy and routine.

Now that it’s all said and done, I’m enjoying sharing novel links from Twitter on my blog.  However, the daily digest posts are now very lengthy due to the amount of links my Twitter friends post.  It’s kind of good and bad at the same time.

Does anyone have any suggestions for the “Links” section of the Twitter digest?  How to make it more relevant or compact, or perhaps display it in a different way?

Twitter Tools by Alex King [alexking.org]

A mid-term mission of mine is to appear on the first page of the Google (US search) index for the search phrase “David Chan”.  I’ve been working on it on and off, studying SEO here and there on my free time.

A tool I use to check my search engine ranking position (SERP) is the Top 100 Rankings Position Checker.  Not noted for its looks, it’s pretty useful in finding if an url is within the top 100 Google results for a particular keyword or phrase.  Best of all is the ability to bookmark your query so you can validate your ego in one click!

Hmm my current rating is “very nice”, but as this tool points out, it’s not good enough.  More work on this in the future.

I went to the M.I.A. concert last night at the PNE, and it was an interesting experience. I’ve been to numerous rock shows, and I’m more used to that kind of crowd and atmosphere, so I had no idea of what to expect from my first hip-hop concert.

When the (unknown to me) opening acts finished, M.I.A.’s show started, and we were shown this interesting video message:

It’s impossible to make out the subtitles from that video, and if you listen carefully there’s a guy in the back reciting the words.

Lots of beats, dancing, glow-in-the-dark glasses, disputes, and mosh-pit attempts later, the show was over. M.I.A. ends the concert with an encore, featuring Paper Planes:

Over all I can’t complain. My decision to see this show was a last minute thing, and I got my ticket for cheap off Craigslist. Anyone reading this also went to the concert? Did you see the fight over the flag?