구글 블로그 분류별 리스트 가젯 추가

구글 블로그의 가젯에 분류 별 리스트를 추가해 보려고 한다.
라벨 형태로 분류하는 것이 장점도 많지만 카테고리 별로 문서를 리스트 할수 없어 불편함이 많다.
이런 점을 어느 정도 보완 하고자 가젯에 카테고리(라벨) 별로 리스트를 만들어 보려한다.



1. [내 블로그] -> [레이아웃] -> [가젯 추가] 를 클릭

2. [HTML/JavaScript] 위젯을 추가한다.

3. 제목과 내용을 넣으면 완성

4. 스크립트 내용
  밑에서 5번째 줄에 자신의 블로그 주소를 적는다.
  바로 옆에 15 라는 숫자는 한번에 출력 되는 리스트 갯수이니 조절해서 사용한다.

% 내용출처 링크 %

<span style="font-weight: bold;"><span style="font-weight: bold;"></span></span><div>
<div id="posts" style="padding: 0px;">
</div>
<div align="center" id="posts-pgno" style="cursor: pointer;">
</div>
</div>
<script language="Javascript" type="text/javascript">  
 /** url의 Parameter를 얻는 Class. **/  
    var request = {   
  parameter: function(name) {  
   return this.parameters()[name];  
  },  
    
  parameters: function() {  
   var result = {};  
   var url = window.location.href;  
   var parameters = url.slice(url.indexOf('?') + 1).split('&');  
      
   for(var i = 0;  i < parameters.length; i++) {  
    var parameter = parameters[i].split('=');  
    result[parameter[0]] = parameter[1];  
   }  
   return result;  
  }  
 }  
   
 /** Page의 정보를 저장. **/  
 var page = {  
  //초기화.  
  init: function(home,max){  
   page.home = home;  
   page.max = max;  
   page.label = '';  
   page.no = 1;  
  },     
     
  //url의 parameter에서 pgno 값을 읽어 옮.  
  setPage: function(){  
   var url = window.location.href;  
   
   var pl = url.lastIndexOf("/label/");  
   var pq = url.lastIndexOf("?");  
     
   if(pl != -1)  
    page.label = url.substr(pl+7,((pq!=-1)?pq:url.length)-(pl+7));  
     
   if(url.indexOf("pgno") != -1)  
    page.no = request.parameter("pgno");  
      
  }  
    
 }  
 /** feed를 parsing 하여 결과 뿌려 줌. **/  
 var obj = {  
  init: function () {  
   obj.obj = document.getElementById('posts');  
   obj.pgno = document.getElementById('posts-pgno');  
  },  
    
  // 검색을 요청하는 함수   
  pingSearch: function () {  
   //변수 선언.  
   obj.s = document.createElement('script');  
   obj.s.type = 'text/javascript';  
   obj.s.charset = 'utf-8';  
     
   //feed callback 함수를 이용 json 객체 구한 후 pongSearch 함수호출.   
   if(page.label == '')  
    obj.s.src = '' + page.home +   
     '/feeds/posts/summary/?max-results='+(page.no*page.max)  
     +'&alt=json-in-script&callback=obj.pongSearch';  
   else  
    obj.s.src = '' + page.home + '/feeds/posts/summary/-/'  
     +page.label+'?max-results='+(page.no*page.max)  
     +'&alt=json-in-script&callback=obj.pongSearch';  
      
   //append.  
   document.getElementsByTagName('head')[0].appendChild(obj.s);  
  },  
     
  // 검색 결과를 뿌리는 함수   
  pongSearch: function (z) {  
   obj.obj.innerHTML = '';  
     
   /* 글 목록을 뿌려 줌. */  
   for (var i = (page.no-1)*page.max; i < page.no*page.max; i++) {  
    //예외처리.  
    if(i >= z.feed.openSearch$totalResults.$t)  
     break;  
      
    //변수선언.  
    var li = document.createElement("li");  
    var a = document.createElement('a');  
      
    //link로 사용할 base url.  
    var url = page.home + '/search';  
    if(page.label != '')  
     url += '/label/' + page.label;  
      
    //최종 link를 url 입력.  
    if (i == 0)   
     a.href = url + '?max-results=1';  
    else {  
     var pub=obj.changeTime(z.feed.entry[i-1].published.$t);  
     a.href = url + '?updated-max=' + pub   
     + '&max-results=1&pgno='+page.no;  
    }  
    a.innerHTML = obj.escapeHtml(z.feed.entry[i].title.$t);  
       
    //append  
    li.appendChild(a);  
    obj.obj.appendChild(li);  
   }  
      
   /* page 뿌려줌. */  
   obj.pongPgno(z);  
  },  
    
  // page를 뿌려주는 함수.  
  pongPgno: function(z){  
   obj.pgno.innerHTML = '';  
   var before = document.createElement('a');  
   var next = document.createElement('a');  
     
   var ten = parseInt((page.no-1)/5);  
   var total = z.feed.openSearch$totalResults.$t;  
  
   /* before page */  
   before.innerHTML = ' << ';     
   if(ten>0)  
    obj.onMouseDown(before, ten*5);  
   obj.pgno.appendChild(before);  
     
   /* page number */  
   for(var i=ten*5; i< (ten+1)*5; i++){  
    if(i >= total/page.max)  
     break;  
    var a = document.createElement('a');  
    obj.onMouseDown(a,i+1);  
      
    a.innerHTML = ' ' + (i+1) + ' ';  
      
    if(i+1 == page.no)  
     a.style.color = 'yellow';       
    obj.pgno.appendChild(a);  
   }  
      
   /* next page */  
   next.innerHTML = ' >> ';  
   if(ten< parseInt(total/page.max/5))  
    obj.onMouseDown(next, (ten+1)*5+1);  
   obj.pgno.appendChild(next);  
  },  
     
  //mouse click event.  
  onMouseDown: function(a, i){  
   a.onmousedown = function(){  
    page.no = i;  
    obj.pingSearch();  
   }  
  },  
  
  //Time 에러 수정.  
  changeTime: function(str){  
    var s = str.lastIndexOf('.')-1;  
    var e = str.lastIndexOf('+')+1;  
  
    if(e<1){  
        e = str.lastIndexOf('-')+1;  
        var str2 = str.substr(0,s) + '-' + str.substr(e,100);  
    }  
    else{  
        var str2 = str.substr(0,s) + '%2B' + str.substr(e,100);  
    }  
    return str2;  
},  
    
  // HTML태그 안 먹게 하는 함수  
  escapeHtml: function (str) {  
   str = str.replace(/&/g, "&");  
   str = str.replace(/</g, "<");  
   str = str.replace(/>/g, ">");  
   return str;  
  }  
 };   

 page.init('http://clover4282.blogspot.com', 15);
 page.setPage();
 obj.init(); 
 obj.pingSearch();
</script>