<?xml version="1.0" encoding="utf-8"?>
<feed xmlns="http://www.w3.org/2005/Atom">
   <title>Stanley Yao&apos;s Blog</title>
   <link rel="alternate" type="text/html" href="http://stanblog.jojoyao.com/" />
   <link rel="self" type="application/atom+xml" href="http://stanblog.jojoyao.com/atom.xml" />
   <id>tag:stanblog.jojoyao.com,2008://2</id>
   <updated>2008-04-13T00:37:39Z</updated>
   <subtitle>Sleepiness in Seattle - Tech Chat on Web, Search Engine, and Programming</subtitle>
   <generator uri="http://www.sixapart.com/movabletype/">Movable Type 3.33</generator>

<entry>
   <title>Tibet WAS,IS,and ALWAYS WILL BE a part of China</title>
   <link rel="alternate" type="text/html" href="http://stanblog.jojoyao.com/2008/04/tibet_wasisand_always_will_be.html" />
   <id>tag:stanblog.jojoyao.com,2008://2.57</id>
   
   <published>2008-04-13T00:09:54Z</published>
   <updated>2008-04-13T00:37:39Z</updated>
   
   <summary><![CDATA[I don't like to discuss politics, but I just can't stand so much unobjective information from some western media any more.&nbsp; Learn the history, not the media!&nbsp; China is a friendly country and Chinese people love peace.&nbsp; Take a look...]]></summary>
   <author>
      <name>Stanley</name>
      <uri>stanley.jojoyao.com</uri>
   </author>
   
   
   <content type="html" xml:lang="en" xml:base="http://stanblog.jojoyao.com/">
      <![CDATA[<p>I don't like to discuss politics, but I just can't stand so much unobjective information from some western media any more.&nbsp; Learn the history, not the media!&nbsp; China is a friendly country and Chinese people love peace.&nbsp; Take a look at <a href="http://www.anti-cnn.com/">http://www.anti-cnn.com/</a> with more videos and photos.&nbsp; See for your self how some media makes biased reports.</p>
<p>You have your own wisdom.&nbsp; Do your diligence, read some unbiased history, find out the truth, make up your own opinion, and don't blindly follow the media.&nbsp; I don't ask you to believe me.&nbsp; But please do believe the truth!!<br />
</p>
<center> <object width="425" height="355">
<param value="http://www.youtube.com/v/x9QNKB34cJo&amp;rel=0&amp;hl=en" name="movie" />
<param value="transparent" name="wmode" /><embed width="425" height="355" wmode="transparent" type="application/x-shockwave-flash" src="http://www.youtube.com/v/x9QNKB34cJo&amp;rel=0&amp;hl=en"></embed></object> </center>]]>
      
   </content>
</entry>
<entry>
   <title>Amazon&apos;s Kindle Opens the New Era of Reading</title>
   <link rel="alternate" type="text/html" href="http://stanblog.jojoyao.com/2007/11/amazons_kindle_opens_the_new_e.html" />
   <id>tag:stanblog.jojoyao.com,2007://2.56</id>
   
   <published>2007-11-22T21:43:48Z</published>
   <updated>2007-11-22T22:28:24Z</updated>
   
   <summary><![CDATA[ Since a few years ago, I've been longing for a light portable library that can hold a couple hundred books, articles, and news papers in it and I can read anywhere when convenient.&nbsp; I've tried a bunch of devices...]]></summary>
   <author>
      <name>Stanley</name>
      <uri>stanley.jojoyao.com</uri>
   </author>
         <category term="Tech" scheme="http://www.sixapart.com/ns/types#category" />
   
   <category term="167" label="amazon" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="153" label="gadget" scheme="http://www.sixapart.com/ns/types#tag" />
   
   <content type="html" xml:lang="en" xml:base="http://stanblog.jojoyao.com/">
      <![CDATA[<p align="center"><a href="http://amazon.com/gp/product/B000FI73MA/ref=amb_link_5892762_1?pf_rd_m=ATVPDKIKX0DER&amp;pf_rd_s=center-1&amp;pf_rd_r=17AYJ4YX4BSB4A80XBZ0&amp;pf_rd_t=101&amp;pf_rd_p=333267901&amp;pf_rd_i=507846"><img alt="Amazon's Kindle" src="http://g-ecx.images-amazon.com/images/G/01/digital/fiona/dp/product-descr-book._V4948744_.jpg" /></a></p>
<p align="left">Since a few years ago, I've been longing for a light portable library that can hold a couple hundred books, articles, and news papers in it and I can read anywhere when convenient.&nbsp; I've tried a bunch of devices from Franklin to Palm and read about Sony's Reader which, although features electronic ink technology,&nbsp;didn't caught much popularity at all.&nbsp; <a href="http://amazon.com/gp/product/B000FI73MA/ref=amb_link_5892762_1?pf_rd_m=ATVPDKIKX0DER&amp;pf_rd_s=center-1&amp;pf_rd_r=17AYJ4YX4BSB4A80XBZ0&amp;pf_rd_t=101&amp;pf_rd_p=333267901&amp;pf_rd_i=507846">Amazon's newly launched Kindle</a> seems to begin to light up the candles of the portable reading.</p>
<p>It take much to build a electronic book reading device that could compete with paper books.&nbsp; First of all LCD still causes much more eye fatigue than natual ink on paper.&nbsp; The electronic ink technology in the Kindle could simulate natual ink and the ability of changing the font size is a plus for eye comfort.&nbsp; Content quality is the next most important thing.&nbsp; For example, the Acrobat Reader for Palm has to transform normal PDF files into a special format to be displayed on Palm.&nbsp; It not only take a long time to transform, but also lose a lot of formatting for graphics, tables, and math formula.&nbsp; Content collection is also a challenge, where Amazon definitely wins with its unbeatable collection of books, partnership with large content providers, a aggregation of community contents (e.g., blogs).&nbsp; And don't forget these can all be access wirelessly while you are on the go and they are fully searchable!&nbsp; Isn't that cool?</p>
<p>Since this is only the first version, there must be a lot that could be further improved.&nbsp; While I'm reading, I like to see more per screen.&nbsp; So while not change the physical keyboard into a touch screen and let the screen&nbsp;be as big as possible?&nbsp; Kindle won't have the <font face="Arial">dilemma as iPhone's small touch screen keyword, because Kindle has bigger screen.&nbsp; Even many people got use to the iPhone keyboard after practicing, Kindle will be even much easier.</font></p>
<p>It has been&nbsp;reported that due to the burgeoning advancement in digital multimedia content on TV and Internet, reading and literacy&nbsp;capability of&nbsp;young generation is decreasing.&nbsp; Hopefully this cool gadget could bring books back into the competition with TV and Inernet.</p>]]>
      
   </content>
</entry>
<entry>
   <title>Create an Animated GPS Like Driving Direction with Virtual Earth Map</title>
   <link rel="alternate" type="text/html" href="http://stanblog.jojoyao.com/2007/09/create_an_animated_gps_like_dr_1.html" />
   <id>tag:stanblog.jojoyao.com,2007://2.55</id>
   
   <published>2007-09-07T02:32:41Z</published>
   <updated>2007-09-07T08:46:58Z</updated>
   
   <summary><![CDATA[Link: Animated 3D Driving Direction Reading map isn't always an easy job for lots of people.&nbsp; In Friends TV show, Joey&nbsp;put a paper map on the gound and step on it in order to get a sense which direction is...]]></summary>
   <author>
      <name>Stanley</name>
      <uri>stanley.jojoyao.com</uri>
   </author>
         <category term="Web" scheme="http://www.sixapart.com/ns/types#category" />
   
   <category term="103" label="map" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="107" label="virtual earth" scheme="http://www.sixapart.com/ns/types#tag" />
   
   <content type="html" xml:lang="en" xml:base="http://stanblog.jojoyao.com/">
      <![CDATA[<p>Link: <a href="http://stanley.jojoyao.com/animatedmaprouting.htm"><strong>Animated 3D Driving Direction</strong></a></p>
<p>Reading map isn't always an easy job for lots of people.&nbsp; In Friends TV show, Joey&nbsp;put a paper map on the gound and step on it in order to get a sense which direction is right.&nbsp; Though that's a little bit of a extreme case,&nbsp;it illustrates the challenge.&nbsp; Many people need&nbsp;more intuitive&nbsp;online maps too and especially the driving directions, so that they don't have to put the computer monitor on the ground and step on it :)&nbsp; Some GPS devices like TomTom came up with really nice 3D UI to show the driving directions in a much more intuitive way.</p>
<p align="center"><img height="106" alt="tomtom.jpg" width="118" src="http://stanblog.jojoyao.com/myimg/tomtom.jpg" /></p>
<p>Live Virtual Earth Map provides a rich set of APIs with which interesting map applications could be developed, even in 3D and birds eye view.&nbsp; As an example, I built an animated driving direction that kind of simulates TomTom.&nbsp; Turn by turn the map will move as if you are driving and what you see is a view of 45 degree looking down from above your &quot;car&quot; and you can see clearly what road and intersection is ahead of you.</p>
<p align="center"><a href="http://stanley.jojoyao.com/animatedmaprouting.htm"><img height="300" alt="3Ddriving.jpg" width="481" src="http://stanblog.jojoyao.com/myimg/3Ddriving.jpg" /></a></p>
<p>The basic idea is to call the routing API to get the itinerary with all segments of the driving direction.&nbsp; For each segment, the map orientation&nbsp;will be&nbsp;adjusted so that the next point is right ahead and then pan to the next point while showing the textual turn by turn instruction.&nbsp;Some suggestion for the API is that the panning APIs are mostly asynchronized so that the calls return immediately while the actually panning is done a while later.&nbsp; This causes a little bit trouble in showing the textual turn by turn driving direction in sync with the map animation.&nbsp; Map events help to some degree, but still some work needs to be done to keep the map and text in sync, because events are generic and there doesn't seem to be a way to assign per event instance parameters.&nbsp; Also the detailed road of each segment is not available, so when the road between 2 points&nbsp;is not straight we can't follow the curve of the road in order to simulate the exact driving experience.</p>]]>
      
   </content>
</entry>
<entry>
   <title>50 Best Websites 2007</title>
   <link rel="alternate" type="text/html" href="http://stanblog.jojoyao.com/2007/09/50_best_websites_2007.html" />
   <id>tag:stanblog.jojoyao.com,2007://2.54</id>
   
   <published>2007-09-01T11:47:07Z</published>
   <updated>2007-09-01T12:11:09Z</updated>
   
   <summary><![CDATA[ clipped from www.time.com Time.com CNN.com From Photonhead.com to Cellswapper and FunnyorDie.com to Lastfm, we've chosen our favorite sites of the year. &nbsp; http://www.time.com/time/specials/2007/article/0,28804,1633488_1639316,00.html...]]></summary>
   <author>
      <name>Stanley</name>
      <uri>stanley.jojoyao.com</uri>
   </author>
         <category term="Web" scheme="http://www.sixapart.com/ns/types#category" />
   
   <category term="123" label="web" scheme="http://www.sixapart.com/ns/types#tag" />
   
   <content type="html" xml:lang="en" xml:base="http://stanblog.jojoyao.com/">
      <![CDATA[<div id="dvAmpBorderBottom" style="DISPLAY: none; FONT-SIZE: 3px; Z-INDEX: 999999; WIDTH: 200px; LINE-HEIGHT: 4px; POSITION: absolute; HEIGHT: 4px; BACKGROUND-COLOR: #ff9900"></div>
<div id="dvAmpBorderTop" style="DISPLAY: none; FONT-SIZE: 3px; Z-INDEX: 999999; WIDTH: 200px; LINE-HEIGHT: 4px; POSITION: absolute; HEIGHT: 4px; BACKGROUND-COLOR: #ff9900"></div>
<div id="dvAmpBorderRight" style="DISPLAY: none; FONT-SIZE: 3px; Z-INDEX: 999999; WIDTH: 4px; LINE-HEIGHT: 4px; POSITION: absolute; HEIGHT: 200px; BACKGROUND-COLOR: #ff9900"></div>
<div id="dvAmpBorderLeft" style="DISPLAY: none; FONT-SIZE: 3px; Z-INDEX: 999999; WIDTH: 4px; LINE-HEIGHT: 4px; POSITION: absolute; HEIGHT: 200px; BACKGROUND-COLOR: #ff9900"></div>
<table style="CLEAR: left; BORDER-RIGHT: #e5e5e5 4px solid; BORDER-TOP: #e5e5e5 4px solid; BACKGROUND: #ffffff; MARGIN: 12px 0px; BORDER-LEFT: #e5e5e5 4px solid; WIDTH: 100%; COLOR: #333333; BORDER-BOTTOM: #e5e5e5 4px solid; FONT-FAMILY: arial" cellspacing="0" cellpadding="0">
    <tbody>
        <tr>
            <td valign="top"><!-- BEGIN_CLIP_CONTENT ID:BBC07D9E-19CE-4F74-AB87-7867AA32B67B:1 CLIPMARKS.COM -->
            <div class="CM_CTB_Content_Wrap" style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; BACKGROUND-COLOR: #ffffff">
            <div style="FONT-SIZE: 10px; BACKGROUND-IMAGE: url(http://clipmarks.com/images/source-bg.gif); MARGIN-BOTTOM: 8px; PADDING-BOTTOM: 4px; VERTICAL-ALIGN: middle; COLOR: #666666; LINE-HEIGHT: 24px; BORDER-BOTTOM: #dcdcdc 1px solid; BACKGROUND-REPEAT: repeat-x; WHITE-SPACE: nowrap; HEIGHT: 24px; BACKGROUND-COLOR: #eeeeee"><a title="go to this clipmark" href="http://clipmarks.com/clipmark/BBC07D9E-19CE-4F74-AB87-7867AA32B67B/"><img style="BORDER-RIGHT: medium none; BORDER-TOP: medium none; DISPLAY: inline; FLOAT: none; MARGIN: 0px 4px; VERTICAL-ALIGN: middle; BORDER-LEFT: medium none; BORDER-BOTTOM: medium none" height="19" alt="" width="19" border="0" src="http://content.clipmarks.com/blog_icon/6ce49aa4-327c-4bb0-917f-c6ebbe692e68/BBC07D9E-19CE-4F74-AB87-7867AA32B67B/" /></a>clipped from <a title="http://www.time.com/time/specials/2007/article/0,28804,1633488_1639316,00.html" style="FONT-SIZE: 11px" href="http://www.time.com/time/specials/2007/article/0,28804,1633488_1639316,00.html">www.time.com</a></div>
            <blockquote style="BORDER-RIGHT: medium none; PADDING-RIGHT: 8px; BORDER-TOP: medium none; PADDING-LEFT: 8px; BACKGROUND: none transparent scroll repeat 0% 0%; PADDING-BOTTOM: 0px; MARGIN: 4px 0px 8px; BORDER-LEFT: medium none; PADDING-TOP: 0px; BORDER-BOTTOM: medium none; TEXT-ALIGN: left" cite="http://www.time.com/time/specials/2007/article/0,28804,1633488_1639316,00.html">
            <div id="logo">
            <div id="time"><a title="Time.com Home Page" alt="Time Logo" href="http://www.time.com/">Time.com</a></div>
            <div id="cnn"><a title="CNN.com Home Page" alt="CNN Logo" href="http://www.cnn.com/">CNN.com</a></div>
            </div>
            </blockquote>
            <div style="FONT-SIZE: 2px; BACKGROUND: #dcdcdc; MARGIN: 2px 4px; BORDER-BOTTOM: #f5f5f5 1px solid; HEIGHT: 2px"></div>
            <blockquote style="BORDER-RIGHT: medium none; PADDING-RIGHT: 8px; BORDER-TOP: medium none; PADDING-LEFT: 8px; BACKGROUND: none transparent scroll repeat 0% 0%; PADDING-BOTTOM: 0px; MARGIN: 4px 0px 8px; BORDER-LEFT: medium none; PADDING-TOP: 0px; BORDER-BOTTOM: medium none; TEXT-ALIGN: left" cite="http://www.time.com/time/specials/2007/article/0,28804,1633488_1639316,00.html">From Photonhead.com to Cellswapper and FunnyorDie.com to Lastfm, we've chosen our favorite sites of the year. </blockquote></div>
            <div style="MARGIN: 0px 6px 6px 4px">
            <table style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-SIZE: 11px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; border-spacing: 0px" cellspacing="0" cellpadding="0" width="100%">
                <tbody>
                    <tr>
                        <td style="BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: none transparent scroll repeat 0% 0%; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px">&nbsp;</td>
                        <td style="BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: none transparent scroll repeat 0% 0%; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; WIDTH: 107px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px" align="right" width="107"><a title="blog or email this clip" href="http://clipmarks.com/share/BBC07D9E-19CE-4F74-AB87-7867AA32B67B/blog/"><img style="BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px" height="17" alt="blog it" width="107" border="0" src="http://content5.clipmarks.com/images/c2b-foot.png" /></a></td>
                    </tr>
                </tbody>
            </table>
            </div>
            <!-- END_CLIP_CONTENT --></td>
        </tr>
    </tbody>
</table>
<div><a target="_blank" rel="nofollow" href="http://www.time.com/time/specials/2007/article/0,28804,1633488_1639316,00.html">http://www.time.com/time/specials/2007/article/0,28804,1633488_1639316,00.html</a> </div>]]>
      
   </content>
</entry>
<entry>
   <title>Sun Changes Nasdaq Symbol To Java; Will Stock Perk Up?</title>
   <link rel="alternate" type="text/html" href="http://stanblog.jojoyao.com/2007/08/sun_changes_nasdaq_symbol_to_j.html" />
   <id>tag:stanblog.jojoyao.com,2007://2.53</id>
   
   <published>2007-08-25T21:40:39Z</published>
   <updated>2007-08-25T21:44:32Z</updated>
   
   <summary> clipped from www.informationweek.com Sun Microsystems is going to leave the roots of its name -- Stanford University Network -- behind and change its listing on the Nasdaq stock exchange from SUNW to JAVA. Sun itself was a preferred brand...</summary>
   <author>
      <name>Stanley</name>
      <uri>stanley.jojoyao.com</uri>
   </author>
         <category term="Industry" scheme="http://www.sixapart.com/ns/types#category" />
   
   <category term="166" label="java" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="165" label="sun" scheme="http://www.sixapart.com/ns/types#tag" />
   
   <content type="html" xml:lang="en" xml:base="http://stanblog.jojoyao.com/">
      <![CDATA[<div id="dvAmpBorderBottom" style="DISPLAY: none; FONT-SIZE: 3px; Z-INDEX: 999999; WIDTH: 200px; LINE-HEIGHT: 4px; POSITION: absolute; HEIGHT: 4px; BACKGROUND-COLOR: #ff9900"></div>
<div id="dvAmpBorderTop" style="DISPLAY: none; FONT-SIZE: 3px; Z-INDEX: 999999; WIDTH: 200px; LINE-HEIGHT: 4px; POSITION: absolute; HEIGHT: 4px; BACKGROUND-COLOR: #ff9900"></div>
<div id="dvAmpBorderRight" style="DISPLAY: none; FONT-SIZE: 3px; Z-INDEX: 999999; WIDTH: 4px; LINE-HEIGHT: 4px; POSITION: absolute; HEIGHT: 200px; BACKGROUND-COLOR: #ff9900"></div>
<div id="dvAmpBorderLeft" style="DISPLAY: none; FONT-SIZE: 3px; Z-INDEX: 999999; WIDTH: 4px; LINE-HEIGHT: 4px; POSITION: absolute; HEIGHT: 200px; BACKGROUND-COLOR: #ff9900"></div>
<table style="CLEAR: left; BORDER-RIGHT: #e5e5e5 4px solid; BORDER-TOP: #e5e5e5 4px solid; BACKGROUND: #ffffff; MARGIN: 12px 0px; BORDER-LEFT: #e5e5e5 4px solid; WIDTH: 100%; COLOR: #333333; BORDER-BOTTOM: #e5e5e5 4px solid; FONT-FAMILY: arial" cellspacing="0" cellpadding="0">
    <tbody>
        <tr>
            <td valign="top"><!-- BEGIN_CLIP_CONTENT ID:DA623332-AFA9-4630-A04C-16CBF94D75F7:1 CLIPMARKS.COM -->
            <div class="CM_CTB_Content_Wrap" style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; BACKGROUND-COLOR: #ffffff">
            <div style="FONT-SIZE: 10px; BACKGROUND-IMAGE: url(http://clipmarks.com/images/source-bg.gif); MARGIN-BOTTOM: 8px; PADDING-BOTTOM: 4px; VERTICAL-ALIGN: middle; COLOR: #666666; LINE-HEIGHT: 24px; BORDER-BOTTOM: #dcdcdc 1px solid; BACKGROUND-REPEAT: repeat-x; WHITE-SPACE: nowrap; HEIGHT: 24px; BACKGROUND-COLOR: #eeeeee"><a title="go to this clipmark" href="http://clipmarks.com/clipmark/DA623332-AFA9-4630-A04C-16CBF94D75F7/"><img style="BORDER-RIGHT: medium none; BORDER-TOP: medium none; DISPLAY: inline; FLOAT: none; MARGIN: 0px 4px; VERTICAL-ALIGN: middle; BORDER-LEFT: medium none; BORDER-BOTTOM: medium none" height="19" alt="" width="19" border="0" src="http://content.clipmarks.com/blog_icon/60bc1e4a-7fec-4fcd-9846-53aa5abd8deb/DA623332-AFA9-4630-A04C-16CBF94D75F7/" /></a>clipped from <a title="http://www.informationweek.com/shared/printableArticleSrc.jhtml;jsessionid=B0AFJEC4XI3Z4QSNDLRSKH0CJUNN2JVN?articleID=201802015" style="FONT-SIZE: 11px" href="http://www.informationweek.com/shared/printableArticleSrc.jhtml;jsessionid=B0AFJEC4XI3Z4QSNDLRSKH0CJUNN2JVN?articleID=201802015">www.informationweek.com</a></div>
            <blockquote style="BORDER-RIGHT: medium none; PADDING-RIGHT: 8px; BORDER-TOP: medium none; PADDING-LEFT: 8px; BACKGROUND: none transparent scroll repeat 0% 0%; PADDING-BOTTOM: 0px; MARGIN: 4px 0px 8px; BORDER-LEFT: medium none; PADDING-TOP: 0px; BORDER-BOTTOM: medium none; TEXT-ALIGN: left" cite="http://www.informationweek.com/shared/printableArticleSrc.jhtml;jsessionid=B0AFJEC4XI3Z4QSNDLRSKH0CJUNN2JVN?articleID=201802015">Sun Microsystems is going to leave the roots of its name -- Stanford University Network -- behind and change its listing on the Nasdaq stock exchange from SUNW to JAVA. </blockquote>
            <div style="FONT-SIZE: 2px; BACKGROUND: #dcdcdc; MARGIN: 2px 4px; BORDER-BOTTOM: #f5f5f5 1px solid; HEIGHT: 2px"></div>
            <blockquote style="BORDER-RIGHT: medium none; PADDING-RIGHT: 8px; BORDER-TOP: medium none; PADDING-LEFT: 8px; BACKGROUND: none transparent scroll repeat 0% 0%; PADDING-BOTTOM: 0px; MARGIN: 4px 0px 8px; BORDER-LEFT: medium none; PADDING-TOP: 0px; BORDER-BOTTOM: medium none; TEXT-ALIGN: left" cite="http://www.informationweek.com/shared/printableArticleSrc.jhtml;jsessionid=B0AFJEC4XI3Z4QSNDLRSKH0CJUNN2JVN?articleID=201802015">
            <p>Sun itself was a preferred brand during the dot-com boom, with Sun Solaris servers and the Java programming language being a common part of dot-com infrastructure. But the 2001 bust hit Sun hard, including its stock price. It's recovered somewhat from its January 2003 lows in the $2.60 range, but Sun is clearly hoping the Nasdaq name change will give it a boost. Its stock was trading at $4.90 by late afternoon Thursday, still at the low end of its $4.50 to $6.78 12-month range. </p>
            </blockquote></div>
            <div style="MARGIN: 0px 6px 6px 4px">
            <table style="PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-SIZE: 11px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; border-spacing: 0px" cellspacing="0" cellpadding="0" width="100%">
                <tbody>
                    <tr>
                        <td style="BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: none transparent scroll repeat 0% 0%; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px">&nbsp;</td>
                        <td style="BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: none transparent scroll repeat 0% 0%; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; WIDTH: 107px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px" align="right" width="107"><a title="blog or email this clip" href="http://clipmarks.com/share/DA623332-AFA9-4630-A04C-16CBF94D75F7/blog/"><img style="BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; BORDER-RIGHT-WIDTH: 0px" height="17" alt="blog it" width="107" border="0" src="http://content1.clipmarks.com/images/c2b-foot.png" /></a></td>
                    </tr>
                </tbody>
            </table>
            </div>
            <!-- END_CLIP_CONTENT --></td>
        </tr>
    </tbody>
</table>
<div>I doubt this could help. The original image of the company is a mainstream industry leader making high end servers, UNIX operating systems, innovative initiatives (like NC), and of course the standards of the popular JAVA technology. Of course Java is successful and as SUN claimed it is developed into a &quot;Java industry&quot;. But renaming the symbol sends a negative message that the power of the company is shrinking. People would think is Java the only thing left that is SUN's success? And what? It's free downloadable? Good luck. </div>]]>
      
   </content>
</entry>
<entry>
   <title>Live Earth - 24 Hours Global Concerts for a Climate in Crisis</title>
   <link rel="alternate" type="text/html" href="http://stanblog.jojoyao.com/2007/07/live_earth_-_24_hours_global_concerts_for_a_climate_in_crisis.html" />
   <id>tag:stanblog.jojoyao.com,2007://2.52</id>
   
   <published>2007-07-08T02:19:40Z</published>
   <updated>2007-07-08T06:14:54Z</updated>
   
   <summary> Facts: Across 6 continents 24 hours exclusive beaming on liveearth.msn.com 2 billion audience world wide Organized in part by Al Gore 150+ top bands...</summary>
   <author>
      <name>Stanley</name>
      <uri>stanley.jojoyao.com</uri>
   </author>
         <category term="Web" scheme="http://www.sixapart.com/ns/types#category" />
   
   <category term="164" label="msn" scheme="http://www.sixapart.com/ns/types#tag" />
   
   <content type="html" xml:lang="en" xml:base="http://stanblog.jojoyao.com/">
      <![CDATA[<a href="http://liveearth.msn.com/"><img height="124" alt="LE_logo_horz.jpg" width="258" src="http://stanblog.jojoyao.com/myimg/LE_logo_horz.jpg" /></a>
<div id="dvAmpBorderBottom" style="DISPLAY: none; FONT-SIZE: 3px; Z-INDEX: 999999; WIDTH: 200px; LINE-HEIGHT: 4px; POSITION: absolute; HEIGHT: 4px; BACKGROUND-COLOR: #ff9900"></div>
<div id="dvAmpBorderTop" style="DISPLAY: none; FONT-SIZE: 3px; Z-INDEX: 999999; WIDTH: 200px; LINE-HEIGHT: 4px; POSITION: absolute; HEIGHT: 4px; BACKGROUND-COLOR: #ff9900"></div>
<div id="dvAmpBorderRight" style="DISPLAY: none; FONT-SIZE: 3px; Z-INDEX: 999999; WIDTH: 4px; LINE-HEIGHT: 4px; POSITION: absolute; HEIGHT: 200px; BACKGROUND-COLOR: #ff9900"></div>
<div id="dvAmpBorderLeft" style="DISPLAY: none; FONT-SIZE: 3px; Z-INDEX: 999999; WIDTH: 4px; LINE-HEIGHT: 4px; POSITION: absolute; HEIGHT: 200px; BACKGROUND-COLOR: #ff9900"></div>
<p>Facts:</p>
<ul>
    <li>Across 6 continents </li>
    <li>24 hours exclusive beaming on liveearth.msn.com </li>
    <li>2 billion audience world wide </li>
    <li>Organized in part by Al Gore </li>
    <li>150+ top bands </li>
</ul>
<p>
<center><img height="0" alt="" width="0" border="0" src="http://microsoftwlmessengermkt.112.2o7.net/b/ss/mswlmmktdreamcom/1/H.9--NS/1?ns=microsoftwlmessengermkt&amp;pageName=Module&amp;c3=Module%20WLMblog_panel" /> <img height="420" alt="" width="420" usemap="#Map" border="0" src="http://global.msads.net/ads/pronws/WLM2_panel.jpg" /> <map id="Map" name="Map">
            <area target="_blank" href="http://im.live.com/Messenger/IM/Join/?source=WLM_blogpanel" coords="266,348,402,385" shape="RECT" />
            <area target="_blank" href="http://im.live.com/messenger/im/causes/WLM/?source=WLM_blogpanel" coords="99,295,174,311" shape="RECT" />
            <area target="_blank" href="http://im.live.com/messenger/im/causes/WLM/?source=WLM_blogpanel" coords="20,28,389,140" shape="RECT" /></map></center>
</p>]]>
      
   </content>
</entry>
<entry>
   <title>Use Visual Studio to Quickly Locate Where the Exceptions are Thrown</title>
   <link rel="alternate" type="text/html" href="http://stanblog.jojoyao.com/2007/07/use_visual_studio_to_quickly_l.html" />
   <id>tag:stanblog.jojoyao.com,2007://2.51</id>
   
   <published>2007-07-05T08:05:59Z</published>
   <updated>2007-07-06T07:18:56Z</updated>
   
   <summary><![CDATA[When there are a deep chain of function calls, especially when the managed and unmanaged code are intermingled together, it's getting more trickier to debug.&nbsp; One situation is that an exception is thrown deep at the bottom of the chain...]]></summary>
   <author>
      <name>Stanley</name>
      <uri>stanley.jojoyao.com</uri>
   </author>
         <category term="Programming" scheme="http://www.sixapart.com/ns/types#category" />
   
   <category term="91" label="debug" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="33" label="visual studio" scheme="http://www.sixapart.com/ns/types#tag" />
   
   <content type="html" xml:lang="en" xml:base="http://stanblog.jojoyao.com/">
      <![CDATA[<p>When there are a deep chain of function calls, especially when the managed and unmanaged code are intermingled together, it's getting more trickier to debug.&nbsp; One situation is that an exception is thrown deep at the bottom of the chain and caught at some level after it's relaid/re-thrown by a couple of levels and the message logged by the exception handler code is too generic to help locating the root cause of the exception.&nbsp; In this case Visual Studio could help locate where the exception is actually thrown at the beginning.&nbsp; This helps a lot in narrowing down the problem when debugging in a large code base.</p>
<p>After loading the project into Visual Studio, bring up the exception dialog by menu &quot;Debug&quot; =&gt; &quot;Exceptions...&quot; and check the types of the exceptions that you want to investigate.&nbsp; After this attach to the process in question.&nbsp; Whenever the statement will cause exceptions to be thrown, it will prompt and let you choose whether to break at that trouble&nbsp;statement and do further investigation.</p>]]>
      
   </content>
</entry>
<entry>
   <title>Yahoo! Mail Offering Unlimited Storage</title>
   <link rel="alternate" type="text/html" href="http://stanblog.jojoyao.com/2007/06/yahoo_mail_offering_unlimited.html" />
   <id>tag:stanblog.jojoyao.com,2007://2.50</id>
   
   <published>2007-06-15T07:37:21Z</published>
   <updated>2007-06-15T08:00:35Z</updated>
   
   <summary><![CDATA[ &nbsp; Yahoo! Mail begins to roll out unlimited storage today worldwide.&nbsp; Feeling lucky that minutes after their announcement, I'm getting this great offer already.&nbsp; Now&nbsp;I don't need to worry about overflow any more. :)...]]></summary>
   <author>
      <name>Stanley</name>
      <uri>stanley.jojoyao.com</uri>
   </author>
         <category term="Web" scheme="http://www.sixapart.com/ns/types#category" />
   
   <category term="163" label="email" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="162" label="yahoo" scheme="http://www.sixapart.com/ns/types#tag" />
   
   <content type="html" xml:lang="en" xml:base="http://stanblog.jojoyao.com/">
      <![CDATA[<p align="center"><a onclick="window.open('http://stanblog.jojoyao.com/myimg/yahoo_unlimited.html','popup','width=306,height=255,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false" href="http://stanblog.jojoyao.com/myimg/yahoo_unlimited.html"><img height="255" alt="" width="306" src="http://stanblog.jojoyao.com/myimg/yahoo_unlimited-thumb.jpg" /></a> </p>
<p>&nbsp;</p>
<p>Yahoo! Mail begins to roll out <a href="http://yodel.yahoo.com/2007/05/14/unlimited-storage-its-coming/">unlimited storage</a> today worldwide.&nbsp; Feeling lucky that minutes after their announcement, I'm getting this great offer already.&nbsp; Now&nbsp;I don't need to worry about overflow any more. :)</p>]]>
      
   </content>
</entry>
<entry>
   <title>Cross-browser Event Handler Assignment</title>
   <link rel="alternate" type="text/html" href="http://stanblog.jojoyao.com/2007/06/crossbrowser_event_handler_ass.html" />
   <id>tag:stanblog.jojoyao.com,2007://2.49</id>
   
   <published>2007-06-06T16:17:33Z</published>
   <updated>2007-06-06T16:39:16Z</updated>
   
   <summary><![CDATA[ Making the client side scripts work across different major browsers is not easy, especially when client debugging is not as convenient as more strongly typed programming languages.&nbsp; Try the following web page.&nbsp; It works fine on IE but on...]]></summary>
   <author>
      <name>Stanley</name>
      <uri>stanley.jojoyao.com</uri>
   </author>
         <category term="Web" scheme="http://www.sixapart.com/ns/types#category" />
   
   <category term="161" label="cross-browser" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="28" label="javascript" scheme="http://www.sixapart.com/ns/types#tag" />
   
   <content type="html" xml:lang="en" xml:base="http://stanblog.jojoyao.com/">
      <![CDATA[<div id="dvAmpBorderBottom" style="DISPLAY: none; FONT-SIZE: 3px; Z-INDEX: 999999; WIDTH: 200px; LINE-HEIGHT: 4px; POSITION: absolute; HEIGHT: 4px; BACKGROUND-COLOR: #ff9900"></div>
<div id="dvAmpBorderTop" style="DISPLAY: none; FONT-SIZE: 3px; Z-INDEX: 999999; WIDTH: 200px; LINE-HEIGHT: 4px; POSITION: absolute; HEIGHT: 4px; BACKGROUND-COLOR: #ff9900"></div>
<div id="dvAmpBorderRight" style="DISPLAY: none; FONT-SIZE: 3px; Z-INDEX: 999999; WIDTH: 4px; LINE-HEIGHT: 4px; POSITION: absolute; HEIGHT: 200px; BACKGROUND-COLOR: #ff9900"></div>
<div id="dvAmpBorderLeft" style="DISPLAY: none; FONT-SIZE: 3px; Z-INDEX: 999999; WIDTH: 4px; LINE-HEIGHT: 4px; POSITION: absolute; HEIGHT: 200px; BACKGROUND-COLOR: #ff9900"></div>
<p>Making the client side scripts work across different major browsers is not easy, especially when client debugging is not as convenient as more strongly typed programming languages.&nbsp; Try the following web page.&nbsp; It works fine on IE but on FireFox clicking the button will trigger nothing to happen.</p>
<p>
<table cellspacing="1" cellpadding="1" width="95%" align="center" summary="" border="1">
    <tbody>
        <tr>
            <td><font color="#0000ff" size="2">&lt;</font><font color="#a31515" size="2">html</font><font size="2"> </font><font color="#ff0000" size="2">xmlns</font><font color="#0000ff" size="2">=&quot;http://www.w3.org/1999/xhtml&quot;</font><font size="2"> </font><font color="#0000ff" size="2">&gt;<br />
            &lt;</font><font color="#a31515" size="2">head</font><font color="#0000ff" size="2">&gt;</font><font color="#0000ff" size="2">&lt;</font><font color="#a31515" size="2">title</font><font color="#0000ff" size="2">&gt;</font><font size="2">Untitled Page</font><font color="#0000ff" size="2">&lt;/</font><font color="#a31515" size="2">title</font><font color="#0000ff" size="2">&gt;&lt;/</font><font color="#a31515" size="2">head</font><font color="#0000ff" size="2">&gt;<br />
            &lt;</font><font color="#a31515" size="2">script</font><font size="2"> </font><font color="#ff0000" size="2">language</font><font color="#0000ff" size="2">=&quot;Javascript&quot;&gt;<br />
            function</font><font size="2"> document.onclick() {<br />
            &nbsp; alert(</font><font color="#a31515" size="2">'doc event'</font><font size="2">);<br />
            }<br />
            </font><font color="#0000ff" size="2">function</font><font size="2"> foo() {<br />
            &nbsp; alert(</font><font color="#a31515" size="2">'foo'</font><font size="2">);<br />
            }<br />
            </font><font color="#0000ff" size="2">&lt;/</font><font color="#a31515" size="2">script</font><font color="#0000ff" size="2">&gt;<br />
            &lt;</font><font color="#a31515" size="2">body</font><font color="#0000ff" size="2">&gt;<br />
            &lt;</font><font color="#a31515" size="2">input</font><font size="2"> </font><font color="#ff0000" size="2">type</font><font color="#0000ff" size="2">=&quot;button&quot;</font><font size="2"> </font><font color="#ff0000" size="2">value</font><font color="#0000ff" size="2">=&quot;ok&quot;</font><font size="2"> </font><font color="#ff0000" size="2">onclick</font><font color="#0000ff" size="2">=&quot;foo();&quot;</font><font size="2"> </font><font color="#0000ff" size="2">/&gt;<br />
            &lt;/</font><font color="#a31515" size="2">body</font><font color="#0000ff" size="2">&gt;<br />
            &lt;/</font><font color="#a31515" size="2">html</font><font color="#0000ff" size="2">&gt;</font></td>
        </tr>
    </tbody>
</table>
</p>
<p>The page will silently fail and none of the event handlers works.&nbsp; Change the document.onclick handler assignment into the following and it works on both browsers.&nbsp; Tools like the Error Console on FireFox is very helpful in diagnosing these type of errors.</p>
<p>
<table cellspacing="1" cellpadding="1" width="95%" align="center" summary="" border="1">
    <tbody>
        <tr>
            <td><font color="#0000ff" size="2">...<br />
            </font><font size="2">document.onclick = function () {<br />
            &nbsp; alert(</font><font color="#a31515" size="2">'doc event'</font><font size="2">);<br />
            }<br />
            ...</font></td>
        </tr>
    </tbody>
</table>
</p>]]>
      
   </content>
</entry>
<entry>
   <title>Video: Steve Jobs and Bill Gates Interview on D 2007</title>
   <link rel="alternate" type="text/html" href="http://stanblog.jojoyao.com/2007/05/video_steve_jobs_and_bill_gate.html" />
   <id>tag:stanblog.jojoyao.com,2007://2.48</id>
   
   <published>2007-06-01T07:21:52Z</published>
   <updated>2007-06-01T07:30:00Z</updated>
   
   <summary><![CDATA[ It feels kinda weird to see they describe the achievement of each other. :)&nbsp; It's historical to see these two big guys sitting together on the stage....]]></summary>
   <author>
      <name>Stanley</name>
      <uri>stanley.jojoyao.com</uri>
   </author>
         <category term="Tech" scheme="http://www.sixapart.com/ns/types#category" />
   
   <category term="142" label="bill gates" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="159" label="steve jobs" scheme="http://www.sixapart.com/ns/types#tag" />
   
   <content type="html" xml:lang="en" xml:base="http://stanblog.jojoyao.com/">
      <![CDATA[<embed width="486" height="412" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" swliveconnect="true" type="application/x-shockwave-flash" seamlesstabbing="false" name="flashObj" base="http://admin.brightcove.com" flashvars="videoId=958475626&amp;playerId=452319854&amp;viewerSecureGatewayURL=https://services.brightcove.com/services/amfgateway&amp;servicesURL=http://services.brightcove.com/services&amp;cdnURL=http://admin.brightcove.com&amp;domain=embed&amp;autoStart=false&amp;" bgcolor="#FFFFFF" src="http://services.brightcove.com/services/viewer/federated_f8/452319854"></embed><br />
<br />
It feels kinda weird to see they describe the achievement of each other. :)&nbsp; It's historical to see these two big guys sitting together on the stage.]]>
      
   </content>
</entry>
<entry>
   <title>Google Gear: Web Applications Going Offline</title>
   <link rel="alternate" type="text/html" href="http://stanblog.jojoyao.com/2007/05/google_gear_web_applications_g.html" />
   <id>tag:stanblog.jojoyao.com,2007://2.47</id>
   
   <published>2007-05-31T07:50:05Z</published>
   <updated>2007-05-31T09:39:05Z</updated>
   
   <summary><![CDATA[The offline web applications like Zimbra narrow the gap between the web and desktop applications in many aspects like connectivity, performance, reliability, etc.&nbsp; The newly released Google Gear is an even bigger hit in that it sets a platform to...]]></summary>
   <author>
      <name>Stanley</name>
      <uri>stanley.jojoyao.com</uri>
   </author>
         <category term="Web" scheme="http://www.sixapart.com/ns/types#category" />
   
   <category term="93" label="google" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="121" label="offline" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="123" label="web" scheme="http://www.sixapart.com/ns/types#tag" />
   
   <content type="html" xml:lang="en" xml:base="http://stanblog.jojoyao.com/">
      <![CDATA[The offline web applications like Zimbra narrow the gap between the web and desktop applications in many aspects like connectivity, performance, reliability, etc.&nbsp; The newly released Google Gear is an even bigger hit in that it sets a platform to help bring any web application &quot;offline&quot;.&nbsp; This will change the way people perceive &quot;web application&quot;.&nbsp; You do NOT need to be always connected to a network in order to use a web application any more.<br />
<p>
<table width="95%" cellspacing="1" cellpadding="1" border="1" align="center" summary="">
    <tbody>
        <tr>
            <td>            (From TechCrunch.com) <a title="Permanent Link to Google Gears Lets Developers Take Apps Offline" rel="bookmark" href="http://www.techcrunch.com/2007/05/30/google-gears-lets-developers-take-apps-offline/">Google Gears Lets Developers Take Apps Offline</a>: Tomorrow, Google will be hosting a developer day for 5,000 developers worldwide...             </td>
        </tr>
    </tbody>
</table>
</p>
<br />
Followed offline app demo above, I tried the offline Google Reader.&nbsp; It is very cool.&nbsp; Also tried simulating an unexpected network connection drop.&nbsp; When browsing the feeds in Google Reader in &quot;online&quot; mode, the network was suddenly disconnected.&nbsp; It tried to read the content but timed out.&nbsp; Then it popped up a window reporting the connection drop and asked if I would like to switch to &quot;offline&quot; mode.&nbsp; Answer &quot;yes&quot; and I was able to continue reading the feeds offline!&nbsp; After I get back online, the local data (items marked as read) is synchronized back to the server.&nbsp; I was never a big fan of Google Reader due to its lack of useful features.&nbsp; But this offline mode really draws my attention and interest to try using it more.<br />
<br />
What's next?&nbsp; If this offline technology is used in developing mobile applications and it supports automatic smart downloading and synchronizing, it could greatly improve the performance of the sophisticated applications running on mobile devices with limited bandwidth.<br />
<br />
An interesting comparison is with the <a href="http://msdn2.microsoft.com/en-US/library/ms998439.aspx">Microsoft Smart Clients offline mode</a> emerged in 2004 with the similar idea.]]>
      
   </content>
</entry>
<entry>
   <title>Building database and web service driven asynchronous google map application</title>
   <link rel="alternate" type="text/html" href="http://stanblog.jojoyao.com/2007/05/database_and_web_service_drive.html" />
   <id>tag:stanblog.jojoyao.com,2007://2.46</id>
   
   <published>2007-05-23T06:03:39Z</published>
   <updated>2007-05-25T15:17:28Z</updated>
   
   <summary><![CDATA[Map API could help build very cool mashup websites.&nbsp; Often times a back end database is the source of the objects to be drawn on the map and querying for those objects from the database based on the parameters the...]]></summary>
   <author>
      <name>Stanley</name>
      <uri>stanley.jojoyao.com</uri>
   </author>
         <category term="Web" scheme="http://www.sixapart.com/ns/types#category" />
   
   <category term="77" label=".net" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="122" label="ajax" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="156" label="api" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="157" label="asynchronous" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="65" label="database" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="93" label="google" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="103" label="map" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="19" label="microsoft" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="155" label="ole" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="33" label="visual studio" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="105" label="web service" scheme="http://www.sixapart.com/ns/types#tag" />
   
   <content type="html" xml:lang="en" xml:base="http://stanblog.jojoyao.com/">
      <![CDATA[Map API could help build very cool mashup websites.&nbsp; Often times a back end database is the source of the objects to be drawn on the map and querying for those objects from the database based on the parameters the users choose on the website (e.g., state, city, search criteria) gets complex.&nbsp; Also to improve the user experience, asynchronous map loading is desired so that while the next batch of objects is being retrieved from the server, the current ones on the map could continue functioning.&nbsp; To address all these challenges and build a smooth database driven asynchronous loading map application, web service can serve as the bridge between the server side complex data model and the client side map drawing logic.&nbsp; The following describes the steps of implementing such architecture and a sample code project created in Visual Studio (free version could be downloaded <a href="http://msdn.microsoft.com/vstudio/express/vwd/">here</a>).&nbsp; This time, I played with Google Maps API.<br />
<br />
<div align="center"><img width="849" height="510" src="http://stanblog.jojoyao.com/myimg/ws_map.jpg" alt="ws_map.jpg" /> <br />
</div>
<br />
Firstly, set up a basic ASP.NET AJAX-enabled web site through the Visual Studio wizard.&nbsp; You may need to download the AJAX extension from http://ajax.asp.net/.&nbsp; Inside Default.aspx, add a div in the body like the following to host the map<br />
<br />
<table width="95%" cellspacing="1" cellpadding="1" border="1" align="center" summary="">
    <tbody>
        <tr>
            <td>&lt;div id=&quot;map&quot; style=&quot;width: 90%; height: 600px; margin-left:auto; margin-right:auto&quot;&gt;&lt;/div&gt;</td>
        </tr>
    </tbody>
</table>
<br />
Reference the google api javascript source and your own javascript file (e.g., gmap.js where the client side mapping code is located) in the head section.<br />
<br />
Next is to prepare the data on the server side.&nbsp; It is actually much easier to set up a relational database in Visual Studio by a just few clicks and there are tons of such examples on the web.&nbsp; So here let's try a slightly trickier scenario where we only have a static plain text CSV data file (e.g., exported from an legacy system or Excel spreadsheet) that contains various cities and the fun places in them to be drawn on the map.&nbsp; Add that data file (e.g., mapdata.csv) under the App_Data/ folder in the solution explore.&nbsp; Assume the data file has 3 columns State, City, and FunPlace.&nbsp; Now create a web service (e.g., MapDataWebService) to extract the data from the CSV file and serve to the client side mapping code.&nbsp; To add this web service, right click the project in the solution explore, select &quot;Add New Item...&quot;, select &quot;Web Service&quot;, and then rename the file name into &quot;MapDataWebService.asmx&quot;.&nbsp; The web service skeleton is automatically added under App_Code/.&nbsp; Open it and add 2 web methods getAllStates() and getFunPlacesByState(string state).&nbsp; The former is used to populate the dropdown on the web page to select a state and the latter is to get the fun places of the selected state.&nbsp; Both methods connect to the data file through OLE DB and query the data using convenient SQL syntax.&nbsp; To quickly unit test the web method, you could open MapDataWebService.asmx and press F5 to run the web service alone.<br />
<br />
The return value of getFunPlacesByState(string state) would be an array of objects (type of class Place), each of which contains the latitude and longitude of the city and the name of the fun place in that city.&nbsp; The class Place is the object oriented representation of this information.&nbsp; The web service will return the objects to the JavaScript caller.&nbsp; In order for the caller to get the consistent objects and dereference them the same way as in C#, the following directive should be added to the top of the web service code and a reference to the assembly System.Web.Extensions.dll needs to be added to the solution too.&nbsp; If you don't have this assembly already installed on your machine, you could download and install &quot;ASP.NET Ajax&quot; from http://ajax.asp.net/.<br />
<br />
<table width="95%" cellspacing="1" cellpadding="1" border="1" align="center" summary="">
    <tbody>
        <tr>
            <td>...<br />
            using System.Web.Script.Services;<br />
            ...<br />
            &nbsp;&nbsp;&nbsp; [ScriptService]<br />
            &nbsp;&nbsp;&nbsp; [GenerateScriptType(typeof(Place))]<br />
            &nbsp;&nbsp;&nbsp; public class MapDataWebService : System.Web.Services.WebService<br />
            &nbsp;&nbsp;&nbsp; {<br />
            ....<br />
            &nbsp;&nbsp;&nbsp; }<br />
            &nbsp;&nbsp;&nbsp; public class Place<br />
            &nbsp;&nbsp;&nbsp; {<br />
            ....<br />
            &nbsp;&nbsp;&nbsp; }</td>
        </tr>
    </tbody>
</table>
<br />
<br />
After the data service is created, the getAllStates() web method could be used to build a data source to populate the dropdown list.&nbsp; Drag and drop a dropdown list onto the Default.aspx, select to create a new data source from its context menu, choose object as the type, MapDataWebService as the business object, and getAllStates() as the SELECT method.&nbsp; The data binding is automatically done.&nbsp; Add an onchange event handler to this control to trigger the mapping function (e.g., drawMarkers) and we are almost done.<br />
<br />
The last step is to implement the mapping method drawMarkers() in gmap.js.&nbsp; It retrieves the state that the user chose in the dropdown and use it as the parameter to call the web service method getFunPlacesByState(state) asynchronously.&nbsp; The callback function will receive the resulting list of Place objects and then use the Google maps API to draw them on the map.&nbsp; To successfully make the web service call from JavaScript, it has to be registered in the Default.aspx like the following.<br />
<br />
<table width="95%" cellspacing="1" cellpadding="1" border="1" align="center" summary="">
    <tbody>
        <tr>
            <td>&lt;asp:ScriptManager ID=&quot;ScriptManager1&quot; runat=&quot;server&quot;&gt;<br />
            &nbsp;&nbsp;&nbsp; &lt;Services&gt;<br />
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;asp:ServiceReference Path=&quot;~/MapDataWebService.asmx&quot; /&gt;<br />
            &nbsp;&nbsp;&nbsp; &lt;/Services&gt;<br />
            &lt;/asp:ScriptManager&gt;</td>
        </tr>
    </tbody>
</table>
<br />
To make it more fun and improve the user experience, during the async web service call, a spinning progress icon could be display indicating that the data is being loaded.&nbsp; Overall, no whole page loading is done and web page looks better.&nbsp; If you are interested the sample solution and code can be downloaded <a href="http://stanblog.jojoyao.com/myupload/GMapExample.zip">GMapExample.zip</a>.&nbsp; Before you can compile and run this web site, go to http://www.google.com/apis/maps/ to register your API key and replace the place holder &quot;YOUR_API_KEY&quot; in file Default.aspx and App_Code/MapDataWebService.cs.<br />
<br />
By the way, a comment about Google Maps API.&nbsp; The markers manager is a convenient way of aggregating all the markers, but removing objects from the manager seems buggy.&nbsp; Whenever the map zoom level is changed, all the removed markers come back on the map.&nbsp; The markers in the manager are not controlled by the map.removeOverlay() either.&nbsp; Other than that, the API works pretty well.<br />
<br />
Sample code download: <a href="http://stanblog.jojoyao.com/myupload/GMapExample.zip">GMapExample.zip</a>]]>
      
   </content>
</entry>
<entry>
   <title>innerHTML could invalidate the event handlers of its child elements</title>
   <link rel="alternate" type="text/html" href="http://stanblog.jojoyao.com/2007/05/innerhtml_could_invalidate_the.html" />
   <id>tag:stanblog.jojoyao.com,2007://2.45</id>
   
   <published>2007-05-11T05:48:10Z</published>
   <updated>2007-05-11T06:04:12Z</updated>
   
   <summary><![CDATA[In Javascript, using an element's innerHTML property to dynamically edit its content provides much flexibility and convenience.&nbsp; But special care needs to be taken when using it, because it could bite you silently.&nbsp; Take one of my experiences as an...]]></summary>
   <author>
      <name>Stanley</name>
      <uri>stanley.jojoyao.com</uri>
   </author>
         <category term="Web" scheme="http://www.sixapart.com/ns/types#category" />
   
   <category term="154" label="dom" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="28" label="javascript" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="123" label="web" scheme="http://www.sixapart.com/ns/types#tag" />
   
   <content type="html" xml:lang="en" xml:base="http://stanblog.jojoyao.com/">
      <![CDATA[In Javascript, using an element's innerHTML property to dynamically edit its content provides much flexibility and convenience.&nbsp; But special care needs to be taken when using it, because it could bite you silently.&nbsp; Take one of my experiences as an example, it could break the event handlers of the child elements.&nbsp; Sample code as the following:<br />
<br />
<table width="90%" cellspacing="1" cellpadding="1" border="1" align="center" summary="">
    <tbody>
        <tr>
            <td>&lt;!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Transitional//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quot;&gt;<br />
            &lt;html xmlns=&quot;http://www.w3.org/1999/xhtml&quot; &gt;<br />
            &lt;head&gt;<br />
            &nbsp;&nbsp;&nbsp; &lt;title&gt;innerHTML&lt;/title&gt;<br />
            &lt;/head&gt;<br />
            &lt;body&gt;<br />
            <br />
            &lt;hr /&gt;&lt;div id=&quot;myd&quot;&gt;&lt;/div&gt;&lt;hr /&gt;<br />
            <br />
            &lt;script language=&quot;javascript&quot;&gt;<br />
            function myaction()<br />
            {<br />
            &nbsp;&nbsp;&nbsp; alert(&quot;hello&quot;);<br />
            }<br />
            <br />
            var d1 = document.createElement(&quot;div&quot;);<br />
            d1.onclick = myaction;<br />
            d1.innerHTML = &quot;child div&quot;;<br />
            <br />
            var d = document.getElementById(&quot;myd&quot;);<br />
            d.appendChild(d1);<br />
            //d.innerHTML += &quot;parent div&quot;;<br />
            &lt;/script&gt;<br />
            <br />
            &lt;/body&gt;<br />
            &lt;/html&gt;</td>
        </tr>
    </tbody>
</table>
<br />
This code works well and when you click on div, &quot;hello&quot; will pop up.&nbsp; However if you uncomment the last line of the JavaScript code.&nbsp; The message won't pop up any more.&nbsp; innerHTML manipulates the content of the element as a string instead of DOM, so it might just break the underlying &quot;wires&quot; that hooks up the elements and their event handlers.&nbsp; So watch out, when any of the events stops working as expected, look for the evil &quot;innerHTML&quot; first.]]>
      
   </content>
</entry>
<entry>
   <title>Live.com Zillow Gadget for Tracking Your Home Value</title>
   <link rel="alternate" type="text/html" href="http://stanblog.jojoyao.com/2007/05/livecom_gadget_for_tracking_yo.html" />
   <id>tag:stanblog.jojoyao.com,2007://2.44</id>
   
   <published>2007-05-07T02:10:27Z</published>
   <updated>2007-05-13T07:52:05Z</updated>
   
   <summary><![CDATA[ I just created and published&nbsp;a&nbsp;new gadget on live.com called&nbsp;&quot;Zillow Home Value Estimate&quot;.&nbsp; Please give it&nbsp;a try!&nbsp; The above link points to the gadget hosted on gallery.live.com.&nbsp; If you are brave enough, you can also try the one I hosted...]]></summary>
   <author>
      <name>Stanley</name>
      <uri>stanley.jojoyao.com</uri>
   </author>
         <category term="Web" scheme="http://www.sixapart.com/ns/types#category" />
   
   <category term="153" label="gadget" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="152" label="live.com" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="105" label="web service" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="150" label="zillow" scheme="http://www.sixapart.com/ns/types#tag" />
   
   <content type="html" xml:lang="en" xml:base="http://stanblog.jojoyao.com/">
      <![CDATA[<div id="dvAmpBorderBottom" style="DISPLAY: none; FONT-SIZE: 3px; Z-INDEX: 999999; WIDTH: 200px; LINE-HEIGHT: 4px; POSITION: absolute; HEIGHT: 4px; BACKGROUND-COLOR: #ff9900"></div>
<div id="dvAmpBorderTop" style="DISPLAY: none; FONT-SIZE: 3px; Z-INDEX: 999999; WIDTH: 200px; LINE-HEIGHT: 4px; POSITION: absolute; HEIGHT: 4px; BACKGROUND-COLOR: #ff9900"></div>
<div id="dvAmpBorderRight" style="DISPLAY: none; FONT-SIZE: 3px; Z-INDEX: 999999; WIDTH: 4px; LINE-HEIGHT: 4px; POSITION: absolute; HEIGHT: 200px; BACKGROUND-COLOR: #ff9900"></div>
<div id="dvAmpBorderLeft" style="DISPLAY: none; FONT-SIZE: 3px; Z-INDEX: 999999; WIDTH: 4px; LINE-HEIGHT: 4px; POSITION: absolute; HEIGHT: 200px; BACKGROUND-COLOR: #ff9900"></div>
<p>I just created and published&nbsp;a&nbsp;new gadget on live.com called&nbsp;&quot;<a href="http://gallery.live.com/liveItemDetail.aspx?li=d93f97d2-6cbb-4c05-9452-f20cc2bcbb3b&amp;pl=4&amp;bt=7">Zillow Home Value Estimate</a>&quot;.&nbsp; Please give it&nbsp;a try!&nbsp; The above link points to the gadget hosted on gallery.live.com.&nbsp; If you are brave enough, you can also try the one I hosted on my own site by clicking the following link&nbsp;&quot;<a href="http://www.live.com/?add=http://stanley.jojoyao.com/live_gadgets/Zillow/gadget.xml">Add the gadget to your live.com</a>&quot; or &quot;<a href="http://spaces.live.com/spacesapi.aspx?wx_action=create&amp;wx_url=http://stanley.jojoyao.com/live_gadgets/Zillow/gadget.xml">Add the gadget to your live space</a>&quot;.&nbsp; I would normally upgrade the 2nd one quicker :)</p>
<p>Screenshot:<br />
<table style="WIDTH: 494px; HEIGHT: 258px" cellspacing="1" cellpadding="1" width="494" align="center" summary="" border="0">
    <tbody>
        <tr>
            <td>
            <p align="center"><img alt="zillowGadget.jpg"  src="http://stanblog.jojoyao.com/myimg/zillowGadget.jpg" /></p>
            </td>
        </tr>
    </tbody>
</table>
<br />
</p>
<p align="left">If you are a home owner put this gadget on your own personalized live.com homepage, so you could closely monitor the value trend of your property.&nbsp; Type in the street address and&nbsp;city/state (or zip code) of the real estate property that you are interested in, the zillow estimate (zestimate) and the 1 year value trend chart will appear on your live.com personalized home page.&nbsp; To change the address, click on the underlined address itself and the editing functionality will show up.&nbsp; The gadget uses <a href="http://www.zillow.com/howto/api/APIOverview.htm">zillow web services API</a> to query the home value estimate.</p>
<p>A tip for developing live.com gadgets is beside publishing your new gadgets to the live.com gallery, you could also post a quick link on your own website/blog too so that the visitors can add your gadgets to their home page by a simple click on your site.&nbsp; All you need to do is put a hyper link&nbsp;http://www.live.com/?add=URL_TO_YOUR_GADGET_XML_FILE&nbsp;for adding to live.com and <font face="Arial">http://spaces.live.com/spacesapi.aspx?wx_action=create&amp;wx_url=URL_TO_YOUR_GADGET_XML_FILE</font>&nbsp;for adding to live spaces. For example:&nbsp;<font face="Arial">&lt;a href=&quot;http://www.live.com/?add=http://stanley.jojoyao.com/live_gadgets/Zillow/ZillowGadget.xml&quot;&gt;Add to Live.com&lt;/a&gt; and &lt;a href=&quot;<font face="Arial">http://spaces.live.com/spacesapi.aspx?wx_action=create&amp;wx_url=http://stanley.jojoyao.com/live_gadgets/Zillow/gadget.xml</font>&quot;&gt;Add to Live Spaces&lt;/a&gt;</font></p>]]>
      
   </content>
</entry>
<entry>
   <title>Usability, Usability, Usability</title>
   <link rel="alternate" type="text/html" href="http://stanblog.jojoyao.com/2007/04/usability_usability_usability.html" />
   <id>tag:stanblog.jojoyao.com,2007://2.42</id>
   
   <published>2007-04-29T21:17:21Z</published>
   <updated>2007-04-29T21:17:29Z</updated>
   
   <summary><![CDATA[Just begin with some of the many good and bad examples of usability cases.&nbsp; In google search, when you click the &quot;search&quot; button after typing in the keywords, at the top of the search result a tip will appear saying...]]></summary>
   <author>
      <name>Stanley</name>
      <uri>stanley.jojoyao.com</uri>
   </author>
         <category term="Search Engine" scheme="http://www.sixapart.com/ns/types#category" />
   
   <category term="145" label="usability" scheme="http://www.sixapart.com/ns/types#tag" />
   <category term="26" label="ux" scheme="http://www.sixapart.com/ns/types#tag" />
   
   <content type="html" xml:lang="en" xml:base="http://stanblog.jojoyao.com/">
      <![CDATA[<p>Just begin with some of the many good and bad examples of usability cases.&nbsp; In google search, when you click the &quot;search&quot; button after typing in the keywords, at the top of the search result a tip will appear saying &quot;Tip: Save time by hitting the return key instead of clicking on 'search' &quot;.&nbsp; This approach is light footprint yet effective.&nbsp; The users see the tip right after they did a &quot;stupid&quot; thing.&nbsp; They have the motivation to try the tip right on the spot and found it really helped.&nbsp; This whole process of stupidity-&gt;gotcha-&gt;cool happens in a streamline and I believe the user will remember the tip in the bone.</p>
<p>In live search, when users type in a&nbsp;non-English keyword, there are very small amount of snippets/summary&nbsp;for the non-English sites in its own language, which is not very international user friendly.&nbsp; Those who typed in a non-English language keyword most likely know that language well enough to read the results in that language.&nbsp; Having summary in the website's native language is a very natural thing to do and an expected result for the users.&nbsp; Even if the search engine is facing NA market, since there are a large number of foreign people in NA, having some degree of International language support makes sense.</p>
<p>The importance of usability is elevated to a even higher level in the web 2.0 era.&nbsp; The center of computing is shifting from computers to human users.&nbsp; After many years' of advancement, computers&nbsp;begin to fade into the background as commodity. &nbsp;The real power is organizing and combining exploding information generated by&nbsp;people and eventually used by people.&nbsp; However, people are &quot;lazy&quot;, &quot;impatient&quot;, and &quot;greedy&quot;.&nbsp; Making the human users satisfied becomes more and more critical to the success of software and services providers.&nbsp; The business model and vehicle to deliver the software and services in Web 2.0 era is so unique that contributes in &quot;spoiling&quot; the users too.&nbsp; The barrier of entering and Web 2.0 industry is so low that a few good programmers with a good idea could make a very successful website.&nbsp; The services of huge number of those websites are very innovative, powerful, and, more importantly, free most of the time thanks to the online ads business model.&nbsp; The release and delivery of newer and nicer online services has so low impact to the users, with no hassle of installation, upgrading, or troubleshooting on the client side.&nbsp; With all these things together, the users end up being the spoiled king!&nbsp; They have so many choices and they are&nbsp;free.&nbsp; So they can switch to any&nbsp;better product without much difficulty.&nbsp; Now it's time for the software and service providers to worry about the user experience their products bring to the customers.</p>
<p>One big resistance to achieving good usability is from the software developers.&nbsp; Most of them are passionate about technology and tackling challenging problems, while feeling bored about non-technical stuff.&nbsp; Being customer obsessed and having a mind set of building software for human instead for machines would be a very appreciated capability of an excellent&nbsp;software developer.&nbsp; The new ways of organizing emails in gmail, the&nbsp;search engine keyword spelling correction feature, and so on are all from developers who made&nbsp;this step ahead.</p>]]>
      
   </content>
</entry>

</feed>
