2007年4月22日 星期日

Try quote, code, cap, rc.js features

Many nice features are referred in some blogger's pages.
After looking around some expert blogger, some features can be tried and very helpful.Quote is the feature to add background image in the quotted string. The Quote feature is done by change the .post blockquote.
The following information is just for personal note. Detailed implementation should be referred to the original creator.

The following document give us this trick.
Josh's note

The code to enable the quote feature are as follows:

blockquote {
/* margin:.75em 0;
border:1px dotted $borderColor;
border-width:1px 0;
padding:5px 15px;
color: $dateHeaderColor;
*/
background-position:-10px -7px;
border: 1px dashed #FFC600;
margin: 20px 10;
padding: 0 10px 0 25px;
background: url("http://nobodybutyou.lin.googlepages.com/quote.png") 5% no-repeat #FFF8DD;
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
}
.post blockquote p {
margin:.5em 0;
}

The added code to enable code and cap feature are as follows:

code {
display: block; /* files a strange ie margin bug */
font-family: Courier New;
font-size: 8pt;
overflow:auto;
background: #f0f0f0 url(http://klcintw.images.googlepages.com/Code_BG.gif) left top repeat-y;
border: 1px solid #ccc;
padding: 10px 10px 10px 21px;
max-height:200px;
line-height: 1.2em;
}

cap {
float:left;
color:white;
background:#00CCFF;
border:1px solid;
font-size:40px;
line-height:48px;
}


The recently comments now can be enabled. The following javascript code can be uploaded into the personal googlepages. Then, add a information feeder widget in the template and the provider URL is http://aboutwimax.blogspot.com/feeds/comments/summary. Using modification of HTML template, add the folllowing code into the feeder widget.

<script>g_szBlogDomain='aboutwimax.blogspot.com'; </script>
<script src="http://nobodybutyou.lin.googlepages.com/rc.js"></script>

The rc.js code which will be put into personal google page are as follows:

var g_szHead;
if (g_szHead==undefined) g_szHead ='最近回應';
var g_szBlogDomain;
if (g_szBlogDomain==undefined) g_szBlogDomain='aboutwimax.blogspot.com';
document.write('<h2>' + g_szHead + '<a href="http://' + g_szBlogDomain + '/feeds/comments/default?alt=rss">rss</a></h2><div id="divrc">下載中...</div>');
var g_szAuthorsLink=new Array();
var g_szTitle= new Array();
var g_szOrgLink = new Array();
var g_iIndex=0;
var g_iShowCount=5;
function a_comprc(a,b)
{
order= Date.parse(a.published.$t.replace(/^(\d{4})-(\d{2})-(\d{2})T([0-9:]*)([.0-9]*)(.)(.*)$/, '$1/$2/$3 $4 GMT')) - Date.parse(b.published.$t.replace(/^(\d{4})-(\d{2})-(\d{2})T([0-9:]*)([.0-9]*)(.)(.*)$/, '$1/$2/$3 $4 GMT'));
return 0-order;
}
function a_rc(json)
{
g_szComments = json.feed.entry.sort(a_comprc);
}
function a_FindTitle(posts,orgLink)
{
var ret= orgLink;
for (var ii=0,post; post= posts.feed.entry[ii]; ii++)
{
if (post.link[0].href == orgLink)
{
ret= post.title.$t;
break;
}
}
return ret;
}
function a_FindIndex(posts,orgLink)
{
var ij=0;
for (ij=0; ij < g_iIndex; ij++)
{
if (orgLink==g_szOrgLink[ij])
return ij;
}
g_szOrgLink[ij]=orgLink;
g_szTitle[ij]= a_FindTitle(posts,orgLink);
g_szAuthorsLink[ij]='◎';
g_iIndex ++;
return ij;
}
function b_rc(posts)
{
for (var i=0,comment; comment = g_szComments[i]; i++)
{
var content = comment.title.$t;
var link = comment.link[0].href;
var iFind = link.indexOf('#');
var orgLink= link;
if (iFind>0)
orgLink = link.substring(0,iFind);
var index = a_FindIndex(posts,orgLink);
if (index>= g_iShowCount)
{
g_iIndex--;
break;
}
var auther= comment.author[0].name.$t;
var timestamp=comment.published.$t.substr(0,10) + ' ' +comment.published.$t.substr(11,5);
g_szAuthorsLink[index] += '<a href="' + link + '" title="' + timestamp + ':' + content + '">' + auther + '</a> « ';
}
var temp = '<ul id="feedItemListDisplay">';
for (var j=0; j< g_iIndex; j++)
{
temp += '<li><a href="' + g_szOrgLink[j] + '">' + g_szTitle[j] + '</a><br/>' + g_szAuthorsLink[j] + '</li>';
}
temp+="</ul>";
document.getElementById("divrc").innerHTML = temp;
}
document.write('<script src="http://' + g_szBlogDomain + '/feeds/comments/summary?alt=json-in-script&callback=a_rc"></script><script src="http://' + g_szBlogDomain + '/feeds/posts/summary?alt=json-in-script&callback=b_rc&max-results=99"></script>');

沒有留言: