Menyediakan informasi seputar perkembangan mesin Blogger dan internet secara umum.

Blogger JSON · Content List Base

<!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 : http://infotentangblog.blogspot.com/2009/08/membuat-daftar-isi-blog.html
 *
 * 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 = "&#9660;";
        obj.title = hidesum;
    } else {
        p.innerHTML = "";
        obj.innerHTML = "&#9658;";
        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'>&#9658;</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>

  

Berlangganan

Berlangganan: Dapatkan berbagai materi dan informasi seputar dunia pemrograman yang tidak akan pernah bisa kalian dapatkan di buku dan di bangku kuliah.

 8 Komentar

Memuat…

Tautan (link) hidup dalam komentar akan terhapus secara otomatis.
Untuk menyisipkan tautan dengan aman, gunakan kode [url=http://example.com]Teks Tautan[/url]
Untuk menyisipkan kode, gunakan tag <i rel="code">KODE ANDA</i>
Untuk menyisipkan gambar, gunakan kode [img]URL GAMBAR[/img]
Untuk menyisipkan judul, gunakan tag <b rel="h4">JUDUL ANDA DI SINI…</b>
Untuk menciptakan efek tebal gunakan tag <strong>TEKS ANDA DI SINI…</strong>
Untuk menciptakan efek huruf miring gunakan tag <em>TEKS ANDA DI SINI…</em>

Khusus untuk membalas komentar disarankan menggunakan tombol balas di samping komentar terkait dibandingkan menggunakan formulir komentar di bawah agar komunikasi lebih terstruktur. Karena mungkin, apa yang Anda tanyakan/katakan saat ini akan sangat bermanfaat bagi pembaca lain.

:) :( ^_^ :D ;) :bd :'( :\ ;p B) :Q :Ozzz 7:( \o/ **p :* 0:) :a 7:O *fuck* x& x@ ~x( *yaya* =p*

Nama Saya Taufik Nurrohman. Sebenarnya Saya tidak bisa disebut sebagai seorang yang profesional dalam bidang ini, karena Saya tidak menguasai bidang ini melalui pendidikan formal. Saya hanyalah seorang antusias. Dibandingkan sebagai seorang desainer atau pengembang, Saya lebih suka jika disebut sebagai seorang hobiis saja yang tertarik dengan dunia web.

Daftar Tautan

Saya tidak bisa hidup tanpa JavaScript! Aktifkan JavaScript?
Ke atas!