Warning: This is a bit geeky.

I’ve always liked the idea of having rotating images on a web pages, so everytime a user refreshs the page, the look and feel changes slightly. But the only way i knew before was to write a javascript to rotate through a list of image names. It gets old after a while. I thought of crawling all the known image directories on my site and then collect the existing image path, then there is the question of non-uniformed size of each image. A webpage looks nice with a horizontal photo might not look as nice with a vertical one. Certainly there are scripts out there to resize the images to the desired size. Then there is also the possibility of storing your image file path in a db and just look it up there. Both seemed lots of work and maintenance.

For example, i liked the little image on the upper right corner on this site. It is a finite number of images that author scanned and nicely cropped for this use alone. But it is a limit number of choices, and it requires lots of work to create those images to fit that location.

V A G A B O N D I N G

Anyway, all these possibilities went through my head before there is flickr.

Now there is the “badge” concept created by flickr. Most people place their flickr badge on the side of their blog, and let it go on rotating and even flashing on by itself. It didn’t occure to me to use flickr badge to do what i always wanted until i saw Jason Goldman’s blog yesterday. He used the flickr photo badge to decorate his otherwise plain template.

So i emulated how Jason Goldman used the flickr script and modified the look of my Chinese blog. After some twicking of the layout, I was happy to call it finished. When i showed it to ZM, he liked it too, but the first thing he did was mouseover the image, and then the amazing thing was the title of the image was shown as the mouse move from image to image! I loved it so much that i went in my flickr and batch edited all my image title to make them meaningful. Lots of them are in Chinese. Then the trouble came.

Flickr’s badge generation javascript assumes everyone’s webpage is in UTF-8 encoding.

Mine wasn’t.

When i started setting up my Chinese blog, i didn’t really understand the world of encoding that well. At the time, all the Chinese pages i’ve ever seen were in “gb2312.” I figured out how to setup mine (using MT at the time) that way. Later when i switched to WordPress, i should’ve known better and taken the opportunity to convert everything into UTF-8. But by then i’ve accumulated so many articles in gb2312, i got lazy and was worried i might mess things up. So i ended up in gb2312 again.

Flickr, like all the other cutting edge websites(e.g. Google), uses UTF-8. So it could support multiple language on the same page. What Flickr badge generation script did was to assume the rest of the world is as clean and cutting edge as Flickr itself. It would have been an easy fix if i can access Flickr’s source code (time for Flickr to be open source, maybe?). All it needs to do is check the http header in the http request, identify the requesting page’s language setting, and return the image’s title in the correct format. Encoding conversion is easy to do on the server side.

But what was I to do now? I could file a bug on Flickr help and then wait. Except i can’t bear the ugly messed up encoding everytime i move my mouse over the image on the header.

So i set out to fix it from my side.

First i tried to insert an iframe on my gb2312 blog page, set the iframe’s source to another html that has encoding of utf-8, placed the Flickr badge on that utf-8 page. It works well with IE, but not with Firefox. 🙁

Then I started looking for something similar to php’s iconv on javascript. Since iconv in php has been so easy to use, i assumed it is a no brainer. But after googling around for 20 minutes and not finding anything useful, i started to realize it is not as easy as i thought.

Encoding conversion requires access to a huge amount of character resources, which are not available from client side. Sure i can try AJAX, but just for an image title, it seemed a little overkill. I might as well try to do this from server side. (actually i havn’t used AJAX, but i have a little project in mind so i can learn it. That’s another story.)

So my final solution is a relatively simple one.

I took the one-liner javascript from Flickr badge generator, executed on the server side using curl, took the returned value, converted from utf-8 to gb2312 using iconv, and then write it out to the page. It worked beautifully, on both IE and Firefox.

-php function that execute curl and return the http response (a very useful common function that can be used in many places, e.g. to fix douban.com’s badge for books/music/movies.)

function getResponse($post_url) {

    $ch = curl_init();
    curl_setopt($ch, CURLOPT_URL, $post_url);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);

    // Execute the http request.
    $response = curl_exec($ch);
        
    if (curl_errno($ch)) {
      echo curl_error($ch);
    } else {
        curl_close($ch);
    }

    // Return the response to the page
    return $response;
}

-php snippet that i placed on my header template:

<?php

// Send the request and receive a response
$querystring = <place your flickr javacript url here>;

$transmit_response = SendRequest($querystring);

$tempstr = iconv("utf-8", "gb2312", $transmit_response);
print ("<script language="JavaScript">".$tempstr."</script>");

?>

*Update: dotann just told me that changing the entire blog from gb to utf-8 is a matter of setting a configuration in mysql. Much easier than this hack. Now think about it. even AJAX might not be that bad. But i guess i just want to see if this kind of conversion can be done. 🙂

Just realized that I’ve missed my blogging anniversary.
May 8, 2003
Wow, it has been a year!

The most delightful aspect of discovering a new blog I like is to piece together someone’s story. The process is just like working on a jigsaw puzzle, where I could collect the little beautiful pieces. Together, they form a recognizable picture. The vagueness of the picture doesn’t bother me; even its incompleteness seems to be an attraction rather than a shortcoming. Because then I would come back for more!

However, I also find myself looking for ‘About’ section in a systematic manner. It is good to know a little fundamental facts of the person so I could build up an interesting enough base to start.

So here are a few facts in case anyone is interested:

1. My native language is Chinese, and you can find my Chinese weblog here.
2. Occasionally I would write the same weblog entry twice, once in Chinese, and once in English. But they almost never translated verbatim. They often ‘feel’ different, too. I don’t know why but I can’t help it.
3. Won’t blink twice before I curse in English, but I can’t bring myself to say the mildest curse words in Chinese
4. Dream in color and with massive details
5. I’m a word person. (versus being a picture person or a musical person)
6. I’m a cat person. (Dogs are cool, but cats are so much cooler)
7. My high school was a boarding school in the center of Beijing, and it was supposed to be one of the finest in China. It means we were taught some rather liberal ideas in the late 1980’s China. It was only 15 minutes away from Tian’an men square, on a bicycle.
8. Wasn’t into politics until 911.
9. Enjoy traveling and have traveled to a few popular western European countries by myself. I enjoyed traveling alone. I enjoyed being alone in general. yes, i’m anti-social.
10. I’m now living in SF with someone I love and who claims to love me as well. If Happiness is a promise, then i think we’ve gotten one.
11. Among all the cities I’ve been to, I think San Francisco is the best place to live and work. The runners up are Nice and Barcelona.
12. I graduated with an EECS (pronounced ee-ks) degree but I gave up pursuing the profession of circuit design the day I graduated. I’m doing software programming for a living. I equate debugging with working on jigsaw puzzle. So I enjoy it somewhat. I changed job in June 2005, and I’m doing a mixture of technical account management and project management now. Debated heavily whether to go back being a programmer and finally decided against it. I think i am a good programmer, but i’m far better at proj. management than programming.  So i stop fighting with my head, even though my heart might be else where.
13. Listen to NPR everyday. Ever since i started taking company shuttle to work since 2007, i haven’t been listening to NPR as much. That might change soon, fingers crossed.
14. Believe all things are balanced out at the end, you gain some and you lose some. No tragedy will last forever.
15. Love good stories well told. Love good movies well made. Then again, who doesn’t?
16. I cry frequently when watching movies, in a very non-discriminatory fashion, i.e. including those not so well made ones.
17. I say no often, but i change my mind often, as well.
18. Love Skiing with a passion. There are few things can make me happier than craning down a slope while light snow following on my face.
19. Legally allowed to operate a motorcycle. Scuba certified. Sky dived once. No, I don’t think I’m crazy. It is more a kind of “you gotta try everything at least once” curiosity.
20. Used to be a social cigar smoker. Martini, Cigar, smokey bars, and jazzy piano music seem to go together. Since I love jazz, the others were loved in the same package. In Chinese, we say, if you love the bird, you gotta love the house where the bird lives, too. (As all your Chinese speakers out there know, i got this one backward. The actual saying was “if you love the house, then you must love the bird land on the roof, too.” i like my version better. 🙂 )
21. Love musicals, and cities that love them: New York, London, Toronto…
22. Used to drink black coffee only. Drinking something warm was immense comfort to someone who had to get up at 4:30am and catch a Monday morning flight.
23. Most of my friends think i’m a city person. I start to believe it, especially after I moved to the city in March’04. [update 2008- it is confirmed, i’m definitely a city person. I can’t imagine living in the suburb again.]
24. Used to rock climb regularly, both indoors and outdoors. During the peak of my “climbing career”, i did Nutcracker Sweet in Yosemite with my climbing partner at the time. It was a classic 5.8. 5 pitches total, 600 ft of perfect granite, it took us 6 hours. It is by far the craziest thing i’ve ever done. Skydiving can’t even compare.
—end of original 2004 list—
25. My biggest asset is passion, which is contagious (i’ve been told); my biggest shortcoming is impatience, which i have been trying to tame for a few years. i have mellowed out substantially comparing to my younger days.
26. I love a good argument. I’m opinionated and judgmental. But I adore quick wit and rational thinking. Thoughtful argument, clever come back, and most importantly kindness can swing my opinion (at least i’d like to think so).
27. I love data-driven results. Show me the facts!
28. I’m intensely curious. And i’m worried someday my curiosity will get me in trouble. I prefer to think myself as a hopeless romantic. My best friend Gui thinks I’m more rational than i’d like to admit. 🙂
29. One quality in others that i admire the most, also the quality i wish i had is the ability to persuade.
30. I don’t do diet because my mom taught me, “There is no shame in gaining weight, your body put in lots of honest labor to acquire those weight, you didn’t steal them.” 🙂
31. I don’t do regret either. Move on already!

This is fun! 🙂 I think I will come back and update this post from time to time…

change log:
v1: 2004.05.25
v2: 2008.12.19

Regarding all the “injustice” cry over MT 3.0’s new pricing structure, this funny response is a must read! via MovableType RIP | Metafilter (http://www.metafilter.com/mefi/33072).

The Red and Green Christmasy color has been way way out of date for a while. I know summer is almost here, but I finally managed to get the Spring Look out for “fading notes”. Better late than never! 🙂 As you might already noticed, there is now an extra “yellow” bar on the “switch styles” section. Click on it you will be able to see the new look. Let me know if you have any suggestions on the color and fonts, as well as bug reports! 🙂

Happy Spring, everyone!

As you might have noticed, a small bar of color had appeared on the left column (between the link to Chinese Weblog and the Search button), with the notation: Switch Styles:.

I’ve been interested in such a feature since my first encounter with weblogs. Skins for weblog! 🙂 Everyone has some preference regarding color and layout. Now you can choose among all my three previous designs, and stay with the one you like the most.

I followed the instruction from alistapart.com step by step. It is well-writen and fairly easy to do.
Alternative Style: Working with Alternate Style Sheets

So, now check out the choices! Any suggestions or corrections are welcome. 🙂

As you’ve noticed, Jean’s Weblog now sports a rather colorful/contrasty color combination. Welcome to the Holiday Special! 🙂

If it is too bright for your taste, you could still read this weblog using the old color layout here. I was planning to add in the new feature where user can switch “look and feel” between this and previous two (blue and green) layouts. Then it turned out to be harder than I had expected. All because of IE not supporting a few crucial features! 🙁

I’m still investigating other possibilities… If you know a good way of doing the switching, do let me know! Thank you! 🙂

It seems this storm is officially over. 🙂 I’ve never been so happy to watch my website traffic slowed to a halt. heehee.

The culprit was an intro of that Chinese blogsphere sex symbol, which made to the largest Chinese news site: sina.com. One should never underestimate the power of traditional paper-based media, combined with popular web search engine that lies!

And here is the damage report:

Yesterday’s fadingnotes.com statistics:
Hits: 56£¬217
Files: 51£¬348
Pageviews: 17£¬624
Sessions: 12£¬430
KB sent: 345£¬473

Average daily statics prior to yesterday:
Hits: 1,822 – 5,826
Files: 1,192 – 3,610
Pageviews: 560 – 1,946
Sessions: 143 – 202
KB sent: 12,411 – 35,387

As you can see, it was roughly 10 times my peak traffic.

Looks like my current monthly transfer allowance could withstand another 10 days of such abuse. Yipee! Hat’s off to my web hosting company: One on One Internet, which weathered this storm with style. Thank you!

(* problem solved, see detail at the end…*)

That’s how I feel right now, like a trapped animal. Not sure where to turn.

This whole thing is so absurd.

There is this Chinese female columnist who writes a sex column for a relatively famous Chinese newspaper. She started writing a weblog detailing her personal sex life starting this summer. Her weblog was THE most famous in China, and because of it, weblog became mainstream in one summer in China.

I liked her writing, she is honest and a marvelous writer. So I praised her once in my Chinese weblog. The entire post was less than 50 words, one paragraph only. That was three weeks ago. During this past weekend, I started to notice that people who ended up on my Chinese weblog page by searching for her name or her blog name on google. I thought it funny. The traffic wasn¡¯t too much higher than normal so I didn¡¯t pay much attention to it.

Lo and behold, today my website traffic is 900% the normal and fast approaching 1000%. Now I got worried and dug out the actual google query that led them here. Guess what?! My Chinese weblog was number one on Google query result page if you search for HER NAME or HER WEBLOG NAME! WHAT the F**K! :(((((((

Google is so seriously busted.

Now I don¡¯t know what to do. Imagine all those people expecting some juicy details ended up on my boring page! Imagine all my precious bandwidth eaten away by all these stupid clicks!

I took down my Chinese weblog and replaced it with one page disclaimer. On it, I copied that paragraph which caused me all these trouble.

Still, those clicks kept on coming in. I¡¯m watching my bandwidth quota disappearing into nowhere with astonishing rate¡­

I¡¯m blocking Google bot for sure. Not sure how much longer my monthly quota will sustain the rest of the site. Oh Well! Moral of the story is: Never underestimate the power of Chinese people. If everyone of them makes one click on a link to your site, that makes 1.3 billion hits!

==========================
FIXED!
It turned out that Google allows the webmaster to remove any page from Google’s index. If you had ever had the same problem, go here. Register and list the page you want removed. Before doing so, make sure you put in the following meta tags in the page you want to remove.

Disallow indexing and archiving:
[META NAME=”ROBOTS” CONTENT=”NOINDEX, NOFOLLOW, NOARCHIVE”]
replace square bracket with angle bracket.

Google will remove them from their index within 24 hours. Whewww! That was close… 🙂

In case people are not familiar with the concept of a “sidelog”. I’ve added one to the right of the main column (yup, that narrow strip of blue thiny). The idea is when I find interesting stuff on the web, but don’t have much input other than the link itself, i will list them there. It is also reverse chronological ordered just like the main weblog, and the date is at the bottom of each short note. The (0) is indicating it has zero comments as of now. So you could comment on those items as well. The sidelog is itself a mini-weblog, so it has its own archive and RSS. Not sure if people would like those links, so i left them out for now.

This way, I can keep only the longer articles in the main log. From now on, most of the items that used to belong to the “web surfing” category will probably end up in the sidelog.

So check it out, it has some goodies already! 🙂
Let me know if you have any questions, suggestions, or complains… 🙂

Finally, I caved in. Sometimes I do have to wirte in Chinese. Come and see my Chinese Weblog if you are interested. 🙂 I still need to modify a few templates. But it is functional and open for now. Let me know if you see any broken links…

Summer is over. Time for the changing of leaves…

I was planning to write an essay on September 11th. But as the day came closer, I was suddenly at a loss of words. It seemed whatever I wanted to say was trivial comparing to what had happened and what is happening still. Then I saw the Moment of Silence post made by many bloggers. I decided to follow their examples.

I worked on the autumn look of my weblog instead. Golden sunshine, vast blue sky and quieter days…

Inspired by Alex the Girl, i gave the weblog a face lift. Color Theory is my weakness. It is one subject I’ve been having trouble with since the very beginning. I’m still not getting it. So my fool proof (literarily, trust me) method is trial and error. It works for me but it is very inefficient. 🙁

Therefore I need all the help I can get, here are a few very useful website that helped me a great deal in the color department:
– EasyRGB-Color harmonies, complements and themes: I used this most often. But colors it provides tend to be on the contrasty and bright side.
– Color Match: the javascript could work better, but it complements EasyRGB by providing more subdued colors within the same theme.
– Palette Man: After you get all four color plus text set, try “rotate”. It is an excellent way to show how arrange the same group of colors differently will provide such different mood. Only have web safe colors though.
– Scheme Machine: A good way to help decide the color of active links and visited links and how they look against different background color. It also gives you the final html code. Web safe colors only.
– xblog-color: Want more? Try this! Tons of color theory related links. Go crazy! 🙂