Friday, April 14, 2006

Blogger Favelet (1)

Set folding

People who wrote frequently on blogger would soon find that they have a long list of articles jamming on the same page. Some of the templates provided by blogger do have a list of article titles on the sidebar for readers to click. But in some templates those article list is either not shown or is hidden far below and not so eye-catching.

Recently I came up with a favelet to deal with this. The entire code reads:

javascript:function gcls(c) {void(arr=[]); void(es= document.body.getElementsByTagName("*")); for(var i=0; (e=es[i]); i++) {if (e.className==c) arr.push(e)} return arr}; function each (a,f) { void(o=[]); for (var i=0; (x=a[i]); i++) {o.push(f(i,x))} return o} function h(c) {void(each(gcls(c), function(i,x) {void(x.style.display='none')}))}; h("post-body"); function nd(t) { void(ss=t.parentNode.childNodes); for (var i=0; i<ss.length; i++) {void(u=ss[i]); if (u==t) {return ss[i+2] }}}; void( each(gcls("post-title"), function (i,x) {x.style.cursor= 'pointer'; x.onclick= function() {void(y= nd(x).style); y.display= y.display== "none"? "block":"none"} }))
It does look ugly, doesn't it ?

What it will do is:
  1. Find all the post contents and hide them;
  2. Find all the post title, and assign an onclick eventhandler to each of them, such that when clicked, their corresponding content is either shown or hidden.
How to use it ?
  1. Go to the bookmark manager of your browser and create a new bookmark;
  2. To the "url" entry, copy and paste the above code. Note that entire code should all be in one line.
  3. Give whatever name you want. For example, "Set Folding";
  4. Click [OK] to accept the settings;
  5. When you are reading a blogger, click this bookmark.
It should turn Fig.A into Fig.B:




Fig.AFig.B

Clicking on the title will show/hide the content of each article.