2016年9月10日 星期六

[Blogger]階層式標籤

程式碼來源 http://licoriceguava.blogspot.tw/2014/01/5blogger.html
我加上一些修改及說明


"為雙引號(")
'為單引號(')
&lt;為(<)
<b:widget id='Label3' locked='false' title='分類' type='Label' version='1' visible='true'>
    <b:includable id='main'>
  <b:if cond='data:title'>
    <h2><data:title/></h2>
  </b:if>
  <div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>
<script>
var label_tree= new Object();
function tn(tag)
{
    return tag.substring(1,tag.length-1);
}
function build_node(tree,idx,cnt)
{
    if(!tree[idx[0]]){
        tree[idx[0]]=new Object();
        tree[idx[0]][&#39;_cnt&#39;]=0;
        tree[idx[0]][&#39;_item&#39;]=new Array();
    }
    tree[idx[0]][&#39;_cnt&#39;] = parseInt(tree[idx[0]][&#39;_cnt&#39;]) + parseInt(cnt);     
    if(idx.length==1){
        return tree[idx[0]];     
    }
    return build_node(tree[idx[0]],idx.slice(1),cnt);
}
function add_label(_name,_cnt,_url,_dir)
{
    var e1 = new RegExp(&quot;\\[(.+?)\\]&quot;,&quot;g&quot;);
    var e = new RegExp(&quot;\\[(.+)\\]&quot;,&quot;g&quot;);
    var m = _name.match(e);
    var tag = _name;
    var obj=new Object();
    obj[&#39;tag&#39;]=_name;
    obj[&#39;cnt&#39;]=_cnt;
    obj[&#39;dir&#39;]=_dir;
    obj[&#39;url&#39;]=_url;
    if(m){
        obj[&#39;tag&#39;]= _name.substring(m[0].length,_name.length);             
        var m1 = _name.match(e1);
        if(m1){
            node=build_node(label_tree,m1,_cnt);
            if(node){         
                node[&#39;_item&#39;].push(obj);
            }
        }     
    }
    else{
        if(!label_tree[&#39;_item&#39;]){
            label_tree[&#39;_item&#39;]=new Array();
        }
        label_tree[&#39;_item&#39;].push(obj);
    }

}
function menu_exp(id)
{
        var ul=document.getElementById(&quot;ul_&quot;+id);
        var li=document.getElementById(&quot;li_img_&quot;+id);
        if (ul.style.display==&quot;none&quot;){
            ul.style.display=&quot;block&quot;
            li.innerHTML=&quot;&#9660; &quot;
        }
        else {
            ul.style.display=&quot;none&quot;
            li.innerHTML=&quot;&#9658; &quot;
        }     
}
function draw_obj(obj)
{
    document.write(&quot;&lt;li style=&#39;padding-left: 30px&#39;&gt;&quot;);
    document.write(&quot; &#9679; &lt;a dir=&#39;&quot;+obj[&#39;dir&#39;]+&quot;&#39;href=&#39;&quot;+obj[&#39;url&#39;]+&quot;&#39;&gt;   &quot;+obj[&#39;tag&#39;]+&quot;&lt;/a&gt;&quot;);
    document.write(&quot;&lt;span dir=&#39;&quot;+obj[&#39;dir&#39;]+&quot;&#39;&gt;(&quot;+obj[&#39;cnt&#39;]+&quot;)&lt;/span&gt;&quot;);
    document.write(&quot;&lt;/li&gt;\n&quot;);
}
function draw_tree(tree)
{
    for(var tag in tree){
        if(tag!=&#39;_item&#39;&amp;&amp; tag!=&#39;_cnt&#39;){
            var rid = Math.random();
            document.write(&quot;&lt;li class=submenu id=li_&quot;+rid+&quot; onclick=menu_exp(&#39;&quot;+rid+&quot;&#39;); style=&#39;font-weight:bold;padding-left: 20px;background:  no-repeat left 0px;cursor: pointer&#39;&gt;&quot;);
   document.write(&quot;<span id='li_img_&quot;+rid+&quot;'>&#9658; </span>&quot;);
            document.write(tn(tag));
            document.write(&quot;(&quot;+tree[tag][&#39;_cnt&#39;]+&quot;)&quot;);
            document.write(&quot;&lt;/li&gt;&quot;);
            document.write(&quot;&lt;ul id=ul_&quot;+rid+&quot; style=&#39;display:none;padding-left: 20px&#39;&gt;&quot;);
            draw_tree(tree[tag]);
            document.write(&quot;&lt;/ul&gt;\n&quot;);
        }
    }
    if(tree[&#39;_item&#39;]){
        for(var i=0;i &lt; tree[&#39;_item&#39;].length;i++){
            draw_obj(tree[&#39;_item&#39;][i]);
        }
    }
}
</script>
<b:loop values='data:labels' var='label'>
<script>
    add_label(&#39;<data:label.name/>&#39;,&#39;<data:label.count/>&#39;,&#39;<data:label.url/>&#39;,&#39;<data:blog.languageDirection/>&#39;);
</script>
</b:loop>
      <ul>
      <script>
          draw_tree(label_tree);
      </script>
      </ul>
    <b:include name='quickedit'/>
  </div>
</b:includable>
  </b:widget>

紅色部份是我做的修改,換圖形、調位置。

剛開始用Blogger不久,覺得像這樣修改並不難,只是程式碼一堆符號好煩啊啊啊啊!!!不知道有沒有辦法來把它弄成比較習慣的樣子...


沒有留言 :

張貼留言