Post list


2012-09-22

리스트 시간표시부분 나오게 재 수정코드


리스트에 시간표기도 나오고 ㅎㅎㅎ   정말 감사합니다^^



단지,,, 리스트에 글목록과 레벨/카테고리의 색상이 G1님것처럼 다르게 안되는건가요?

혹시나 해서

 '템플릿->고급->링크->링크 색상' 을 변경하면 색상이 다르게 되지않을까 기대햇는데ㅜㅜㅜㅜ

변경해봣지만  글목록과 레벨/카테고리의 색상이 동시에 변하네요ㅠㅠ




그리고 전의 ㄷ답글에서 "왜 parseInt가 저렇게 작동하는지 모르시겟다고"하셧는데요,,

제가컴맹이라 잘모르는건데요,,, 혹시 ' parseInt'란게 리스트부분에서 글제목/레벨/시간 등 배체순서나 위치와 관련된다는거죠?

그니까 저의 것은 지금 글제목 앞을 장식하는 흑점이 가운데 놓엿다가 이번 수정으로 젤앞에 놓이는데, 그다음 글제목 아닌 역시 시간이 잇고 그 다음 글제목이 뜨고 제목아래가 아닌 직접 이이서 레벌/카테고리가 이어져 있네요,,,,, 보시다싶히  좀 이상하게 나오잖아요ㅠㅠ 블로그 넓이 조정해봐도 소용없구요ㅠ

(**파이어폭스에선 저렇게 보이지만, ie에선 "여전히 시간- 흑점-글제목,레벨" 이런 구조로 보이는군요


 ^^, 물론 G1님의 리스트는 어디서나 다 저렇게 보기 좋게 다같게 나타납니다^^
)

g1님처럼 글 제목이 맨앞에 오고 아래에 레벨이 잇고, 젤 뒤로 시간이 보이는면 좋겟는데요ㅠ

이게 다 같은 코드인데,,다르게표시되엿다는 거겠죠? 스킨이 달라서 그렇던가 한거겠죠?


미안합니다;; 제가 질문을 너무만이 해서요-_-;



------------------

a1.innerHTML = g1sObj.escapeHtml((1900+rdate.getYear()) +"."+ rdate.getMonth() +"."+ rdate.getDate() +". "+ rdate.getHours() +":"+ rdate.getMinutes() +":"+ ((rdate.getSeconds()<10)?"0"+rdate.getSeconds():rdate.getSeconds()));

부분을


a1.innerHTML = obj.escapeHtml(rdate.getFullYear() +"."+ rdate.getMonth() +"."+ rdate.getDate() +". "+ rdate.getHours() +":"+ rdate.getMinutes() +":"+ ((rdate.getSeconds()<10)?"0"+rdate.getSeconds():rdate.getSeconds()));



--------------수정한 코드---->>

<style>
.g1sPostsPost{clear: both;}
.g1sPostsLeft{float:left; width:150px;}
</style>

<div>
<div id="posts" style="padding: 10px;">
</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 div = document.createElement('div');
var a1 = document.createElement('a');
var a2 = document.createElement('a');
//link로 사용할 base url.
var url = page.home + '/search';
if(page.label != '')
url += '/label/' + page.label;
//최종 link를 url 입력.
if (i == 0){
a1.href = url + '?max-results=1';
a2.href = url + '?max-results=1';
}
else {
var published = obj.changeTime(z.feed.entry[i - 1].published.$t);
a1.href = url + '?updated-max=' + published + '&max-results=1&pgno='+page.no;
a2.href = url + '?updated-max=' + published + '&max-results=1&pgno='+page.no;
}
//제목만 a.innerHTML = obj.escapeHtml(z.feed.entry[i].title.$t);
//시간.
var ldiv = document.createElement('div');
var published = z.feed.entry[i].published.$t;
var y,mm,d,h,m,s;
y = 1 * published.substr(0,4);
mm = 1 * published.substr(5,2);
d = 1 * published.substr(8,2);
h = 1 * published.substr(11,2);
m = 1 * published.substr(14,2);
s = 1 * published.substr(17,2);
var date = new Date(y, mm, d, h, m, s);
var dt;
if(published.charAt('+'))
dt = (parseInt(published.substr(25,2)) * 60 + parseInt(published.substr(28,2)))*60000;
else
dt = (-parseInt(published.substr(25,2)) * 60 - parseInt(published.substr(28,2)))*60000;
var rdate = new Date(date.getTime() + dt);
a1.innerHTML = obj.escapeHtml(rdate.getFullYear() +"."+ rdate.getMonth() +"."+ rdate.getDate() +". "+ rdate.getHours() +":"+ rdate.getMinutes() +":"+ ((rdate.getSeconds()<10)?"0"+rdate.getSeconds():rdate.getSeconds()));

//제목
var rdiv = document.createElement('div');
div.className = "g1sPostsPost";
ldiv.className = "g1sPostsLeft";
rdiv.className = "g1sPostsRight";
a2.innerHTML = obj.escapeHtml(z.feed.entry[i].title.$t);
rdiv.appendChild(a2);
//라벨
for(var j in z.feed.entry[i].category){
var a3 = document.createElement('a');
a3.href = page.home + '/search/label/' + z.feed.entry[i].category[j].term + '?max-results=1';
a3.innerHTML = obj.escapeHtml('['+z.feed.entry[i].category[j].term+']');
rdiv.appendChild(a3);
}
ldiv.appendChild(a1);
div.appendChild(ldiv);
div.appendChild(rdiv);
//append
li.appendChild(div);
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)/10);
var total = z.feed.openSearch$totalResults.$t;

/* before page */
before.innerHTML = ' << ';
if(ten>0)
obj.onMouseDown(before, ten*10);
obj.pgno.appendChild(before);

/* page number */
for(var i=ten*10; i< (ten+1)*10; 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/10))
obj.onMouseDown(next, (ten+1)*10+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://hi5656.blogspot.com', 40);
page.setPage();
obj.init();
obj.pingSearch();
</script>



--------------

더뎌 성공!   좋은걸 공유해주시고 또 친철하게 설명해주신 G1님에 감사드립니따^^


댓글 4개:

  1. 아... 아니요. 제건 여기 포스팅 한 후에 몇번 코드 수정을 거치면서 저렇게 배치되도록 수정이 된거라서요.
    이것저것 세세하게 설명드리기는 좀 그렇고 제 블로그에 적용된 소스를 아래 댓글로 달아드릴게요. ^^

    답글삭제
  2. 전체 소스는 글자가 너무 많아 다 안올라가네요.
    이전과 같이 pongSearch 부분을 아래 것으로 바꿔주시구요.

    답글삭제
  3. 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 div = document.createElement('div');
    var a1 = document.createElement('a');
    var a2 = document.createElement('a');

    var url = page.home + '/search';
    if(page.label != '')
    url += '/label/' + page.label;
    if (i == 0){
    a1.href = url + '?max-results=1';
    a2.href = url + '?max-results=1';
    }else{
    var published = obj.changeTime(z.feed.entry[i - 1].published.$t);
    a1.href = url + '?updated-max=' + published + '&max-results=1&pgno='+page.no;
    a2.href = url + '?updated-max=' + published + '&max-results=1&pgno='+page.no;
    }
    var ldiv = document.createElement('div');
    var published = z.feed.entry[i].published.$t;
    var y,mm,d,h,m,s;
    y = 1 * published.substr(0,4);
    mm = 1 * published.substr(5,2);
    d = 1 * published.substr(8,2);
    h = 1 * published.substr(11,2);
    m = 1 * published.substr(14,2);
    s = 1 * published.substr(17,2);
    var date = new Date(y, mm, d, h, m, s);
    var dt;
    if(published.charAt('+'))
    dt = (parseInt(published.substr(25,2)) * 60 + parseInt(published.substr(28,2)))*60000;
    else
    dt = (-parseInt(published.substr(25,2)) * 60 - parseInt(published.substr(28,2)))*60000;
    var rdate = new Date(date.getTime() + dt);
    a1.innerHTML = obj.escapeHtml(rdate.getFullYear() +"."+ rdate.getMonth() +"."+ rdate.getDate() +". "+ rdate.getHours() +":"+ rdate.getMinutes() +":"+ ((rdate.getSeconds()<10)?"0"+rdate.getSeconds():rdate.getSeconds()));
    var rdiv = document.createElement('div');
    div.className = "g1sPostsPost";
    ldiv.className = "g1sPostsLeft";
    rdiv.className = "g1sPostsRight";
    a2.className = 'g1sPostsTitle';
    a2.innerHTML = obj.escapeHtml(z.feed.entry[i].title.$t);
    if(a2.innerHTML.length > 100)
    a2.innerHTML = a2.innerHTML.substr(0,100) + '...';
    ldiv.appendChild(a2);
    for(var j in z.feed.entry[i].category){
    var a3 = document.createElement('a');
    a3.className = 'g1sPostsTag';
    a3.style.color = 'green';
    a3.href = page.home + '/search/label/' + z.feed.entry[i].category[j].term + '?max-results=1';
    a3.innerHTML = obj.escapeHtml('['+z.feed.entry[i].category[j].term+']');
    rdiv.appendChild(a3);
    }
    rdiv.appendChild(a1);
    div.appendChild(ldiv);
    div.appendChild(rdiv);
    li.appendChild(div);
    obj.obj.appendChild(li);
    }
    obj.pongPgno(z);
    },

    답글삭제
  4. 글잣수 제한 맞추느라 힘드네요. 위의 부분을 바꿔주신 후
    아래 css 부분은.... 제일 앞에 수정해주시면 됩니다.

    <style>
        #posts{padding: 10px;}
        .g1sPostsPost{clear: both;}
        .g1sPostsTitle{}
        .g1sPostsTag{float:left;}
        .g1sPostsRight{float:right; text-align:right; width:99%;}
    </style>

    답글삭제