HedgerWow http://blog.hedgerwow.com Keep It Simple, Stupid Thu, 04 Jun 2009 07:13:24 +0000 http://wordpress.org/?v=2.0.5 en Preview image inline before uploading. http://blog.hedgerwow.com/2009/06/03/preview-image-inline-before-uploading/ http://blog.hedgerwow.com/2009/06/03/preview-image-inline-before-uploading/#comments Thu, 04 Jun 2009 07:12:55 +0000 hedgerwang JavaScript image http://blog.hedgerwow.com/2009/06/03/preview-image-inline-before-uploading/ I hope HTML5 and Google Gear could do this thing better :-)

JOT: The JavaScript Object Template http://blog.hedgerwow.com/2009/05/19/jot-the-javascript-object-template/ http://blog.hedgerwow.com/2009/05/19/jot-the-javascript-object-template/#comments Tue, 19 May 2009 21:05:56 +0000 hedgerwang JavaScript http://blog.hedgerwow.com/2009/05/19/jot-the-javascript-object-template/ http://code.google.com/p/jot-project/wiki/SyntaxAndHowTos :-) , still beta.

Hope you’d like it.

Found a new JS pattern from MSDN. http://blog.hedgerwow.com/2009/04/30/found-a-new-js-pattern-from-msdn/ http://blog.hedgerwow.com/2009/04/30/found-a-new-js-pattern-from-msdn/#comments Thu, 30 Apr 2009 20:36:26 +0000 hedgerwang JavaScript http://blog.hedgerwow.com/2009/04/30/found-a-new-js-pattern-from-msdn/ One day, I was trying to detect whether an element is an element that has no close tag.
So I did this:

var tagName = el.tagName.toLowerCase();
if( tagName == ‘img’ || tagName == ‘br’ || tagName == ‘input’  || tagName == ‘embed ‘ ){
// This is just a example, not all single tags are tested. These tags are :
// area,base,basefont,br,col,frame,hr,img,input,isindex,link,meta,param,embed.
// Do something here.

Well, this is not that efficient to write your program.
So I switch to use a string map, which is rather simple and John Resig uses the same trick in his HTML Parser.

var map = makeMap(’area,base,basefont,br,col,frame,hr,img,input,isindex,link,meta,param,embed’);
if( map[tagName]){
// Do something here.

Of course we can use RegExp to test it, just like many others did.

var reg = /^(area|base|basefont|br|col|frame|hr|img|input|isindex|link|meta|param|embed)$/i;
var tagName = ‘BR’;
if( reg.test(tagName)){
// Do something…

and maybe you can find more tricks that solve the same problem with low cost, but below is the most interesting one that caught my attention.

if ( tagName != “BUTTON” | “B” | “A” ){
// Do something…

Wait, this seems really strange to me and seems not to perform as what I was expecting.
However, since I found this code snippets from MSDN, there must be something magic which makes this working.

js code snippets

Unfortunately, this is simply not working though I almost thought I found a new JS pattern from MSDN and was very excited about it for just about 10 seconds.

It’s fun to learn JS from microsoft.

]]> http://blog.hedgerwow.com/2009/04/30/found-a-new-js-pattern-from-msdn/feed/ update:Cross Browser Base64 Encoded Images Embedded in HTML http://blog.hedgerwow.com/2009/04/16/updatecross-browser-base64-encoded-images-embedded-in-html/ http://blog.hedgerwow.com/2009/04/16/updatecross-browser-base64-encoded-images-embedded-in-html/#comments Fri, 17 Apr 2009 04:57:58 +0000 hedgerwang image http://blog.hedgerwow.com/2009/04/16/updatecross-browser-base64-encoded-images-embedded-in-html/ http://www.hedgerwow.com/360/dhtml/base64-image/demo.php

Notes from stylesheet-debug.js http://blog.hedgerwow.com/2009/02/20/notes-from-stylesheet-debugjs/ http://blog.hedgerwow.com/2009/02/20/notes-from-stylesheet-debugjs/#comments Fri, 20 Feb 2009 19:35:18 +0000 hedgerwang DOM CSS http://blog.hedgerwow.com/2009/02/20/notes-from-stylesheet-debugjs/ Below are the notes from the newly released YUI version 2.7.0 stylesheet.js
and the notes from its source probably explains why web development is too tricky to deal with.
Adapted from  tylesheet-debug.js…..
Copyright (c) 2009, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
version: 2.7.0


* Style node must be added to the head element.  Safari does not honor styles
applied to StyleSheet objects on style nodes in the body.
* StyleSheet object is created on the style node when the style node is added

to the head element in Firefox 2 (and maybe 3?)
* The cssRules collection is replaced after insertRule/deleteRule calls in
Safari 3.1.  Existing Rules are used in the new collection, so the collection
cannot be cached, but the rules can be.

* Opera requires that the index be passed with insertRule.
* Same-domain restrictions prevent modifying StyleSheet objects attached to
link elements with remote href (or “about:blank” or “javascript:false”)

* Same-domain restrictions prevent reading StyleSheet cssRules/rules
collection of link elements with remote href (or “about:blank” or
* Same-domain restrictions result in Safari not populating node.sheet property

for link elements with remote href (et.al)
* IE names StyleSheet related properties and methods differently (see code)
* IE converts tag names to upper case in the Rule’s selectorText

* IE converts empty string assignment to complex properties to value settings
for all child properties.  E.g. style.background = ‘’ sets non-'’ values on
style.backgroundPosition, style.backgroundColor, etc.  All else clear

style.background and all child properties.
* IE assignment style.filter = ‘’ will result in style.cssText == ‘FILTER:’
* All browsers support Rule.style.cssText as a read/write property, leaving

only opacity needing to be accounted for.
* Benchmarks of style.property = value vs style.cssText += ‘property: value’
indicate cssText is slightly slower for single property assignment.  For
multiple property assignment, cssText speed stays relatively the same where

style.property speed decreases linearly by the number of properties set.
Exception being Opera 9.27, where style.property is always faster than
* Opera 9.5b throws a syntax error when assigning cssText with a syntax error.

* Opera 9.5 doesn’t honor rule.style.cssText = ‘’.  Previous style persists.
You have to remove the rule altogether.
* Stylesheet properties set with !important will trump inline style set on an

element or in el.style.property.
* Creating a worker style collection like document.createElement(’p').style;
will fail after a time in FF (~5secs of inactivity).  Property assignments
will not alter the property or cssText.  It may be the generated node is

garbage collected and the style collection becomes inert (speculation).
* IE locks up when attempting to add a rule with a selector including at least
characters {[]}~`!@%^&*()+=|? (unescaped) and leading _ or -

such as addRule(’-foo’,'{ color: red }’) or addRule(’._abc’,'{…}’)
* IE’s addRule doesn’t support comma separated selectors such as
addRule(’.foo, .bar’,'{..}’)

* IE throws an error on valid values with leading/trailing white space.
* When creating an entire sheet at once, only FF2/3 & Opera allow creating a
style node, setting its innerHTML and appending to head.

* When creating an entire sheet at once, Safari requires the style node to be
created with content in innerHTML of another element.
* When creating an entire sheet at once, IE requires the style node content to

be set via node.styleSheet.cssText
* When creating an entire sheet at once in IE, styleSheet.cssText can’t be
written until node.type = ‘text/css’; is performed.
* When creating an entire sheet at once in IE, load-time fork on

var styleNode = d.createElement(’style’); _method = styleNode.styleSheet ?..
fails (falsey).  During run-time, the test for .styleSheet works fine
* Setting complex properties in cssText will SOMETIMES allow child properties

to be unset
set         unset              FF2  FF3  S3.1  IE6  IE7  Op9.27  Op9.5
———-  —————–  —  —  —-  —  —  ——  —–
border      -top               NO   NO   YES   YES  YES  YES     YES

-top-color         NO   NO   YES             YES     YES
-color             NO   NO   NO              NO      NO
background  -color             NO   NO   YES             YES     YES

-position          NO   NO   YES             YES     YES
-position-x        NO   NO   NO              NO      NO
font        line-height        YES  YES  NO    NO   NO   NO      YES

-style             YES  YES  NO              YES     YES
-size              YES  YES  NO              YES     YES
-size-adjust       ???  ???  n/a   n/a  n/a  ???     ???

padding     -top               NO   NO   YES             YES     YES
margin      -top               NO   NO   YES             YES     YES
list-style  -type              YES  YES  YES             YES     YES

-position          YES  YES  YES             YES     YES
overflow    -x                 NO   NO   YES             n/a     YES

??? - unsetting font-size-adjust has the same effect as unsetting font-size

* FireFox and WebKit populate rule.cssText as “SELECTOR { CSSTEXT }”, but
Opera and IE do not.
* IE6 and IE7 silently ignore the { and } if passed into addRule(’.foo’,'{
color:#000}’,0).  IE8 does not and creates an empty rule.

* IE6-8 addRule(’.foo’,'’,n) throws an error.  Must supply *some* cssText
Be careful with getComputedStyle http://blog.hedgerwow.com/2009/02/19/be-careful-with-getcomputedstyle/ http://blog.hedgerwow.com/2009/02/19/be-careful-with-getcomputedstyle/#comments Fri, 20 Feb 2009 07:07:03 +0000 hedgerwang DOM CSS bug http://blog.hedgerwow.com/2009/02/19/be-careful-with-getcomputedstyle/ Sometimes you really need to check whether an element is in the document already before calling some DOM methods.
See http://www.hedgerwow.com/360/bugs/dom-get-computed-style.php

Imageless Fuzzy Shadows with CSS + HTML http://blog.hedgerwow.com/2008/12/05/imageless-fuzzy-shadows-with-css-html/ http://blog.hedgerwow.com/2008/12/05/imageless-fuzzy-shadows-with-css-html/#comments Sat, 06 Dec 2008 01:41:55 +0000 hedgerwang CSS Hack CSS UI http://blog.hedgerwow.com/2008/12/05/imageless-fuzzy-shadows-with-css-html/ It’s fun to play with CSS over 10 years.
Year 1999: filter:blur();
Year 2009: background:url(/feed/dataimage/pngbase64/index.html);


What new Chief Technology Officer of the US need to do? http://blog.hedgerwow.com/2008/10/26/what-new-chief-technology-officer-of-the-us-need-to-do/ http://blog.hedgerwow.com/2008/10/26/what-new-chief-technology-officer-of-the-us-need-to-do/#comments Sun, 26 Oct 2008 21:16:29 +0000 hedgerwang Browsers http://blog.hedgerwow.com/2008/10/26/what-new-chief-technology-officer-of-the-us-need-to-do/ Banning the use of IE6.
I do believe it’s just the right time to do the right change to make the internet faster, greener, cheaper, which helps to boost the poor economy.

Choosing a DOCTYPE that is just simple and strict http://blog.hedgerwow.com/2008/10/16/choosing-a-doctype-that-is-just-simple-and-strict/ http://blog.hedgerwow.com/2008/10/16/choosing-a-doctype-that-is-just-simple-and-strict/#comments Thu, 16 Oct 2008 22:53:25 +0000 hedgerwang Browsers HTML http://blog.hedgerwow.com/2008/10/16/choosing-a-doctype-that-is-just-simple-and-strict/ I did not know this trick until I view the HTML source of

a randomly search
result from google


YAHOO.onBeforeUnload http://blog.hedgerwow.com/2008/09/11/yahooonbeforeunload/ http://blog.hedgerwow.com/2008/09/11/yahooonbeforeunload/#comments Thu, 11 Sep 2008 21:57:31 +0000 hedgerwang Random Thoughts http://blog.hedgerwow.com/2008/09/11/yahooonbeforeunload/ Just like most people, I like to travel whenever I have the opportunity to explore and experience the whole world.

I want to know more things, and I want to experience more things as well.

I had been to some great places in my past traveling and I always heard some great stories about some other very interesting and attractive destinations from people from varies places which always caught my and gives me more energy to move forward to the next new stop.

3 years ago, after working in Yahoo! Taiwan for a while, I had the chance to be transferred to Yahoo! US and started my career as a front-end engineer in Silicon Valley, one of the most amazing places where you can definitely see the abundance of the creativity and energy of human intelligence .

For me, Yahoo! had been a great place to work for through the past few years, and I will definitely it put it on my fav list of the best companies to work for.

It’s indeed a wonderful thing for me to have a decent job in Yahoo, to be able to meet more nice friends and to achieve my career goal here especially I’m an alien worker who rarely speaks English and drive cars before coming to the USA.

I’m much luckier than I think I’m.

So there is another great chance showing up for me to switch to the next company unexpectedly.

I think I should know about the next company well since I had been told a lot great and exciting things about this company either from the media, the people who work there or simply from the words of mouth and I had decided to step into this company instead of keeping myself as an outsider from that company..

It’s time to move on for me.

I’d thank for all the love, kindness and dedication of all my co-workers in Yahoo!, which is truly an amazing and unforgettable experience and I will always be proud of being a members of Yahoos.

9/12 is my last day in Yahoo, and I’d start my new job in Google by 9/22.

My personal contacts info are below:
Feel free to add me as your contact.

Email : hedgerwang (at) gmail.com
LinkedIn : http://www.linkedin.com/in/hedgerwang
Flickr : http://www.flickr.com/photos/hedger
BLOG : http://www.hedgerwow.com/

Cheers and best wishes for all.