<!DOCTYPE html> <html> <head> <meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/> <title>Blogger Table of Contents</title> <script> /** * CONTENT LIST * * Created by : Copycat91 On July 30th 2009 * Website : http://infotentangblog.blogspot.com/ * Original post : * * Special thanks to : * *) http://www.blogger.com for the free blog hosting * *) http://buzz.blogger.com for the tutorial to convert feed->json * *) NetBeans IDE 6.5 for the free IDE * *) And other tutorials about HTML, javascript, json, etc I have read */ var all_entries, entries, all_labels = [], json; function createEntries(json) { var entries_obj_list = []; var entries = json.feed.entry; for (var i = 0; i < entries.length; i++) { var entry = entries[i]; var entry_obj = new Object; entry_obj.id = entry.id.$t; entry_obj.title = entry.title.$t; entry_obj.href = getEntryHref(entry); entry_obj.content = getEntryContent(entry); entry_obj.labels = getEntryLabels(entry); entry_obj.published = entry.published.$t.substr(0, 10); entries_obj_list.push(entry_obj); } return entries_obj_list; } function getEntryById(id) { for (var i = 0; i < all_entries.length; i++) { if (all_entries[i].id == id) { return all_entries[i]; } } return null; } function getEntryContent(entry) { return entry.content ? entry.content.$t : entry.summary.$t; } function getEntryHref(entry) { var links = entry.link; for (var i = 0; i < links.length; i++) { if (links[i].rel == "alternate") { return links[i].href; } } return null; } function getEntryLabels(entry) { var labels = []; var categories = entry.category; if (!categories) { return labels; } for (var i = 0; i < categories.length; i++) { var label = categories[i].term; if (!isExists(all_labels, label)) { all_labels.push(label); } // while collecting all labels labels.push(label); } return labels; } function getSomeEntries(cmp) { entries = []; for (var i = 0; i < all_entries.length; i++) { var entry = all_entries[i]; if (cmp(entry)) { entries.push(entry); } } return entries; } function isExists(array, val) { for (var i = 0; i < array.length; i++) { if (array[i] == val) { return true; } } return false; } function onLoadFeed(json_arg) { json = json_arg; setTimeout("onLoadFeedTimeout()", 100); } function onLoadFeedTimeout() { entries = createEntries(json); all_entries = entries; showHeaderOption(); showEntries(entries); } function showEntries(entries) { var s = ""; for (var i = 0; i < entries.length; i++) { var entry = entries[i]; s += "<p>"; s += titleCode(entry); s += "<span style='font-size:80%;'>" + footlabel + " " + labelsCode(entry); s += " " + footon + " " + publishedDateCode(entry) + "</span>"; s += "</p>"; } document.getElementById("cl_content_list").innerHTML = s; } function showHeaderOption() { var s = ""; s += "<table cellpadding='3'>"; s += "<tr>"; s += "<td style='text-align:right;'>" + sortby; s += "<td><select onchange='sortBy(this.value.substr(1), this.value.substr(0,1))' style='width:100%;'>"; s += "<option value='0published'>" + timepub + "</option>"; s += "<option value='1title'>" + ptitle + "</option>"; s += "</select>"; s += "<tr>"; s += "<td style='text-align:right'>" + labelsort; s += "<td><select onchange='showPostsWLabel(this.value)' id='cl_labels' style='width:100%;'>"; s += "<option value='*'>" + showall + "</option>"; for (var i = 0; i < all_labels.length; i++) { var label = all_labels[i]; s += "<option value='" + label + "'>" + label + "</option>"; } s += "</select>"; s += "<tr>"; s += "<td><td><button onclick='showPostsWLabel(\"*\");'>" + showall + "</button>"; s += "</table>"; document.getElementById("cl_option").innerHTML = s; } function shortenContent(entry) { var content = entry.content; content = stripHTML(content); if (content.length > cl_summlen) { content = content.substr(0, cl_summlen); if (content.charAt(content.length - 1) != " ") { content = content.substr(0, content.lastIndexOf(" ") + 1); } content += "..."; } entry.content = content; return content; } function showHideSummary(obj) { var p = obj.nextSibling; while (p.className != "cl_content") { p = p.nextSibling; } var id = p.id; var entry = getEntryById(id); var content = shortenContent(entry); if (p.innerHTML == "") { p.innerHTML = content + "<br/>"; obj.innerHTML = "▼"; obj.title = hidesum; } else { p.innerHTML = ""; obj.innerHTML = "►"; obj.title = showsum; } } function sortBy(attribute, asc) { var cmp = function(entry1, entry2) { if (entry1[attribute] == entry2[attribute]) { return 0; } else if (asc == '1') { return entry1[attribute].toLowerCase() > entry2[attribute].toLowerCase(); } else { return entry1[attribute].toLowerCase() < entry2[attribute].toLowerCase(); } } entries.sort(cmp); showEntries(entries); } function stripHTML(s) { var c; var intag = false; var newstr = ""; for (var i = 0; i < s.length; i++) { c = s.charAt(i); if (c == "<") { intag = true; } else if (c == ">") { intag = false; } if (c == ">") { newstr += " "; } else if (!intag) { newstr += c; } } return newstr; } // Functions Returning HTML Code function labelsCode(entry) { var s = ""; if (entry.labels.length == 0) { return " (tidak berlabel) "; } for (var j = 0; j < entry.labels.length; j++) { var label = entry.labels[j]; s += "<a href='javascript:showPostsWLabel(\"" + label + "\")' "; s += "title='" + showlabel + " " + label + "'>" + label + "</a>"; s += (j != entry.labels.length - 1) ? ", " : ""; } return s; } function publishedDateCode(entry) { var y = entry.published.substr(0, 4); var m = entry.published.substr(5, 2); var d = entry.published.substr(8, 2); var s = "<a href='javascript:showPostsInDate(\"" + y + "\")' title='" + y + "'>" + y + "</a>/"; s += "<a href='javascript:showPostsInDate(\"" + y + "-" + m + "\")' title='" + y + "/" + m + "'>" + m + "</a>/"; s += "<a href='javascript:showPostsInDate(\"" + y + "-" + m + "-" + d + "\")'title='" + y + "/" + m + "/" + d + "'>" + d + "</a>"; return s; } function titleCode(entry) { var s = "<span title='" + showsum + "' onclick='showHideSummary(this)' style='cursor:pointer'>►</span> "; s += "<b><a href='" + entry.href + "'>" + entry.title + "</a></b><br/>"; s += "<span class='cl_content' id='" + entry.id + "'></span>"; return s; } // Selection Functions function showPostsInDate(date) { var cmp = function(entry) { return entry.published.indexOf(date) == 0; } var entries = getSomeEntries(cmp); showEntries(entries); } function showPostsWLabel(label) { var cmp = function(entry) { if (label == "*") { return true; } for (var i = 0; i < entry.labels.length; i++) { if (entry.labels[i] == label) { return true; } } return false; } var entries = getSomeEntries(cmp); showEntries(entries); document.getElementById("cl_labels").value = label; } </script> </head> <body> <div id="cl_option">Loading...</div> <div id="cl_content_list"></div> <script> var cl_summlen = 500, timepub = "Tanggal Publikasi", ptitle = "Judul Artikel", sortby = "Urut berdasarkan:", labelsort = "Filter artikel dengan label:", showall = "Lihat Semua", hidesum = "Sembunyikan Rangkuman...", showsum = "Tampilkan Rangkuman...", footlabel = "Kategori:", footon = "di", showlabel = "Lihat posing dengan label"; </script> <script src="//dte-feed.blogspot.com/feeds/posts/default?alt=json-in-script&callback=onLoadFeed&max-results=9999"></script> </body> </html>
Langganan:
Posting Komentar (Atom)