{"id":1525,"date":"2025-01-14T02:19:02","date_gmt":"2025-01-13T19:19:02","guid":{"rendered":"https:\/\/caaip.net\/corps\/?page_id=1525"},"modified":"2026-08-17T22:42:29","modified_gmt":"2026-08-17T15:42:29","slug":"caaip-public-news","status":"publish","type":"page","link":"https:\/\/caaip.net\/corps\/caaip-public-news\/","title":{"rendered":"CAAIP PUBLIC NEWS"},"content":{"rendered":"\n<div id=\"caaip-public-news\">\n\n    <div class=\"cpn-header\">\n        <div class=\"cpn-title\">\ud83d\udcf0 CAAIP PUBLIC NEWS<\/div>\n        <div class=\"cpn-subtitle\">\n            Berita terbaru dari CAAIP News\n        <\/div>\n    <\/div>\n\n    <div class=\"cpn-tabs\">\n        <button class=\"cpn-tab active\" data-category=\"\">Semua<\/button>\n        <button class=\"cpn-tab\" data-category=\"Berita Utama\">Berita Utama<\/button>\n        <button class=\"cpn-tab\" data-category=\"Berita Duka\">Berita Duka<\/button>\n        <button class=\"cpn-tab\" data-category=\"Ulasan\">Ulasan<\/button>\n        <button class=\"cpn-tab\" data-category=\"Profil\">Profil<\/button>\n        <button class=\"cpn-tab\" data-category=\"Marine Engineering\">Marine Engineering<\/button>\n    <\/div>\n\n    <div id=\"cpn-loading\">\n        \u23f3 Memuat berita CAAIP&#8230;\n    <\/div>\n\n    <div id=\"cpn-list\"><\/div>\n\n    <div id=\"cpn-more\">\n        <a href=\"https:\/\/news.caaip.net\/\" target=\"_blank\" rel=\"noopener\">\n            \ud83d\udcf0 Lihat Semua Berita CAAIP \u2192\n        <\/a>\n    <\/div>\n\n<\/div>\n\n<style>\n\n#caaip-public-news {\n    width:100%;\n    max-width:1200px;\n    margin:20px auto;\n    box-sizing:border-box;\n    font-family:Arial,Helvetica,sans-serif;\n}\n\n.cpn-header {\n    background:linear-gradient(135deg,#0d47a1,#1976d2);\n    color:#fff;\n    text-align:center;\n    padding:25px 15px;\n    border-radius:12px 12px 0 0;\n}\n\n.cpn-title {\n    font-size:27px;\n    font-weight:700;\n}\n\n.cpn-subtitle {\n    font-size:14px;\n    margin-top:6px;\n    opacity:.9;\n}\n\n.cpn-tabs {\n    display:flex;\n    flex-wrap:wrap;\n    gap:8px;\n    justify-content:center;\n    padding:14px;\n    background:#f5f7fa;\n    border:1px solid #e2e6ea;\n}\n\n.cpn-tab {\n    border:1px solid #d5dbe1;\n    background:#fff;\n    color:#444;\n    padding:8px 15px;\n    border-radius:20px;\n    cursor:pointer;\n    font-size:13px;\n}\n\n.cpn-tab:hover {\n    background:#e9f2ff;\n}\n\n.cpn-tab.active {\n    background:#1976d2;\n    color:#fff;\n    border-color:#1976d2;\n}\n\n#cpn-loading {\n    text-align:center;\n    padding:40px 15px;\n    color:#777;\n}\n\n#cpn-list {\n    display:grid;\n    grid-template-columns:repeat(3,minmax(0,1fr));\n    gap:20px;\n    padding:20px 0;\n}\n\n.cpn-card {\n    background:#fff;\n    border:1px solid #e1e5e9;\n    border-radius:10px;\n    overflow:hidden;\n    box-shadow:0 2px 8px rgba(0,0,0,.06);\n    display:flex;\n    flex-direction:column;\n    transition:.2s;\n}\n\n.cpn-card:hover {\n    transform:translateY(-3px);\n    box-shadow:0 6px 18px rgba(0,0,0,.12);\n}\n\n.cpn-image {\n    width:100%;\n    height:190px;\n    object-fit:cover;\n    display:block;\n    background:#eee;\n}\n\n.cpn-content {\n    padding:16px;\n    display:flex;\n    flex-direction:column;\n    flex:1;\n}\n\n.cpn-category {\n    font-size:11px;\n    font-weight:bold;\n    color:#1976d2;\n    text-transform:uppercase;\n    margin-bottom:7px;\n}\n\n.cpn-card-title {\n    font-size:18px;\n    line-height:1.35;\n    margin:0 0 8px;\n    color:#222;\n}\n\n.cpn-card-title a {\n    color:inherit;\n    text-decoration:none;\n}\n\n.cpn-card-title a:hover {\n    color:#1976d2;\n}\n\n.cpn-date {\n    color:#888;\n    font-size:12px;\n    margin-bottom:10px;\n}\n\n.cpn-excerpt {\n    color:#555;\n    font-size:13px;\n    line-height:1.6;\n    flex:1;\n    margin-bottom:15px;\n}\n\n.cpn-read {\n    display:inline-block;\n    align-self:flex-start;\n    background:#1976d2;\n    color:#fff !important;\n    text-decoration:none !important;\n    padding:8px 13px;\n    border-radius:5px;\n    font-size:12px;\n    font-weight:bold;\n}\n\n.cpn-read:hover {\n    background:#0d47a1;\n}\n\n.cpn-empty {\n    grid-column:1\/-1;\n    text-align:center;\n    padding:40px 15px;\n    color:#777;\n}\n\n.cpn-error {\n    grid-column:1\/-1;\n    text-align:center;\n    background:#fff3f3;\n    border:1px solid #efcccc;\n    padding:25px;\n    border-radius:8px;\n    color:#a33;\n}\n\n#cpn-more {\n    text-align:center;\n    padding:5px 0 30px;\n}\n\n#cpn-more a {\n    display:inline-block;\n    background:#333;\n    color:#fff !important;\n    text-decoration:none !important;\n    padding:11px 20px;\n    border-radius:6px;\n    font-size:13px;\n    font-weight:bold;\n}\n\n@media(max-width:900px) {\n    #cpn-list {\n        grid-template-columns:repeat(2,minmax(0,1fr));\n    }\n}\n\n@media(max-width:600px) {\n\n    .cpn-title {\n        font-size:22px;\n    }\n\n    .cpn-tabs {\n        justify-content:flex-start;\n        overflow-x:auto;\n        flex-wrap:nowrap;\n    }\n\n    .cpn-tab {\n        white-space:nowrap;\n        flex-shrink:0;\n    }\n\n    #cpn-list {\n        grid-template-columns:1fr;\n        gap:15px;\n        padding:15px 0;\n    }\n\n    .cpn-image {\n        height:200px;\n    }\n}\n\n<\/style>\n\n<script>\n\n(function() {\n\n    var maxResults = 12;\n    var allNews = [];\n\n    var list =\n        document.getElementById(\"cpn-list\");\n\n    var loading =\n        document.getElementById(\"cpn-loading\");\n\n    if (!list) {\n        return;\n    }\n\n\n    function escapeHTML(text) {\n\n        var div =\n            document.createElement(\"div\");\n\n        div.textContent =\n            text || \"\";\n\n        return div.innerHTML;\n    }\n\n\n    function stripHTML(html) {\n\n        var div =\n            document.createElement(\"div\");\n\n        div.innerHTML =\n            html || \"\";\n\n        return (\n            div.textContent ||\n            div.innerText ||\n            \"\"\n        );\n    }\n\n\n    function formatDate(value) {\n\n        if (!value) {\n            return \"\";\n        }\n\n        var date =\n            new Date(value);\n\n        if (isNaN(date.getTime())) {\n            return \"\";\n        }\n\n        return date.toLocaleDateString(\n            \"id-ID\",\n            {\n                day:\"2-digit\",\n                month:\"long\",\n                year:\"numeric\"\n            }\n        );\n    }\n\n\n    function getImage(entry) {\n\n        if (\n            entry.media$thumbnail &&\n            entry.media$thumbnail.url\n        ) {\n\n            return entry.media$thumbnail.url\n                .replace(\n                    \/\\\/s[0-9]+-\/,\n                    \"\/s800-\"\n                );\n        }\n\n\n        var html = \"\";\n\n        if (\n            entry.content &&\n            entry.content.$t\n        ) {\n            html =\n                entry.content.$t;\n        }\n\n\n        if (\n            entry.summary &&\n            entry.summary.$t &&\n            !html\n        ) {\n            html =\n                entry.summary.$t;\n        }\n\n\n        var match =\n            html.match(\n                \/<img[^>]+src=[\"']([^\"']+)[\"']\/i\n            );\n\n\n        if (\n            match &&\n            match[1]\n        ) {\n            return match[1];\n        }\n\n\n        return \"\";\n    }\n\n\n    function getCategories(entry) {\n\n        if (\n            !entry.category ||\n            !entry.category.length\n        ) {\n            return [];\n        }\n\n\n        return entry.category\n            .map(function(cat) {\n                return cat.term || \"\";\n            })\n            .filter(function(cat) {\n                return cat !== \"\";\n            });\n    }\n\n\n    function getExcerpt(entry) {\n\n        var html = \"\";\n\n        if (\n            entry.summary &&\n            entry.summary.$t\n        ) {\n\n            html =\n                entry.summary.$t;\n\n        } else if (\n            entry.content &&\n            entry.content.$t\n        ) {\n\n            html =\n                entry.content.$t;\n        }\n\n\n        var text =\n            stripHTML(html)\n            .replace(\/\\s+\/g,\" \")\n            .trim();\n\n\n        if (text.length > 150) {\n\n            text =\n                text.substring(0,150) +\n                \"...\";\n        }\n\n\n        return text;\n    }\n\n\n    function getLink(entry) {\n\n        if (!entry.link) {\n            return \"\";\n        }\n\n\n        for (\n            var i = 0;\n            i < entry.link.length;\n            i++\n        ) {\n\n            if (\n                entry.link[i].rel ===\n                \"alternate\"\n            ) {\n\n                return entry.link[i].href;\n            }\n        }\n\n\n        return \"\";\n    }\n\n\n    function render(category) {\n\n        var filtered =\n            allNews.filter(\n                function(item) {\n\n                    if (!category) {\n                        return true;\n                    }\n\n\n                    return item.categories.some(\n                        function(cat) {\n\n                            return (\n                                cat.toLowerCase() ===\n                                category.toLowerCase()\n                            );\n\n                        }\n                    );\n\n                }\n            );\n\n\n        list.innerHTML = \"\";\n\n\n        if (!filtered.length) {\n\n            list.innerHTML =\n                '<div class=\"cpn-empty\">' +\n                '\ud83d\udcf0 Belum ada berita pada kategori ini.' +\n                '<\/div>';\n\n            return;\n        }\n\n\n        filtered.forEach(\n            function(item) {\n\n                var card =\n                    document.createElement(\n                        \"article\"\n                    );\n\n                card.className =\n                    \"cpn-card\";\n\n\n                var categoryName =\n                    item.categories.length\n                    ? item.categories[0]\n                    : \"CAAIP News\";\n\n\n                var imageHTML = \"\";\n\n                if (item.image) {\n\n                    imageHTML =\n                        '<img class=\"cpn-image\" ' +\n                        'src=\"' +\n                        escapeHTML(item.image) +\n                        '\" ' +\n                        'alt=\"' +\n                        escapeHTML(item.title) +\n                        '\" loading=\"lazy\">';\n\n                } else {\n\n                    imageHTML =\n                        '<div class=\"cpn-image\" ' +\n                        'style=\"display:flex;align-items:center;justify-content:center;font-size:40px;\">' +\n                        '\ud83d\udcf0' +\n                        '<\/div>';\n                }\n\n\n                card.innerHTML =\n\n                    imageHTML +\n\n                    '<div class=\"cpn-content\">' +\n\n                    '<div class=\"cpn-category\">' +\n                    escapeHTML(categoryName) +\n                    '<\/div>' +\n\n                    '<h2 class=\"cpn-card-title\">' +\n\n                    '<a href=\"' +\n                    escapeHTML(item.url) +\n                    '\" target=\"_blank\" rel=\"noopener\">' +\n\n                    escapeHTML(item.title) +\n\n                    '<\/a>' +\n\n                    '<\/h2>' +\n\n                    '<div class=\"cpn-date\">' +\n                    '\ud83d\udcc5 ' +\n                    escapeHTML(\n                        formatDate(item.date)\n                    ) +\n                    '<\/div>' +\n\n                    '<div class=\"cpn-excerpt\">' +\n                    escapeHTML(item.excerpt) +\n                    '<\/div>' +\n\n                    '<a class=\"cpn-read\" ' +\n                    'href=\"' +\n                    escapeHTML(item.url) +\n                    '\" target=\"_blank\" rel=\"noopener\">' +\n                    'Baca Selengkapnya \u2192' +\n                    '<\/a>' +\n\n                    '<\/div>';\n\n\n                list.appendChild(card);\n\n            }\n        );\n\n    }\n\n\n    \/*\n     * Blogger JSONP callback\n     *\/\n\n    window.caaipPublicNewsCallback =\n        function(data) {\n\n            if (loading) {\n                loading.style.display =\n                    \"none\";\n            }\n\n\n            if (\n                !data ||\n                !data.feed ||\n                !data.feed.entry\n            ) {\n\n                list.innerHTML =\n                    '<div class=\"cpn-empty\">' +\n                    '\ud83d\udcf0 Belum ada berita yang dapat ditampilkan.' +\n                    '<\/div>';\n\n                return;\n            }\n\n\n            allNews =\n                data.feed.entry.map(\n                    function(entry) {\n\n                        return {\n\n                            title:\n                                entry.title\n                                ? entry.title.$t\n                                : \"CAAIP News\",\n\n                            url:\n                                getLink(entry),\n\n                            date:\n                                entry.published\n                                ? entry.published.$t\n                                : \"\",\n\n                            image:\n                                getImage(entry),\n\n                            excerpt:\n                                getExcerpt(entry),\n\n                            categories:\n                                getCategories(entry)\n\n                        };\n\n                    }\n                );\n\n\n            render(\"\");\n\n        };\n\n\n    \/*\n     * Load Blogger feed\n     *\/\n\n    var script =\n        document.createElement(\"script\");\n\n\n    script.src =\n        \"https:\/\/news.caaip.net\/feeds\/posts\/default\" +\n        \"?alt=json-in-script\" +\n        \"&callback=caaipPublicNewsCallback\" +\n        \"&max-results=\" +\n        maxResults;\n\n\n    script.onerror =\n        function() {\n\n            if (loading) {\n                loading.style.display =\n                    \"none\";\n            }\n\n\n            list.innerHTML =\n                '<div class=\"cpn-error\">' +\n                '\u26a0\ufe0f Berita CAAIP tidak dapat dimuat saat ini.' +\n                '<\/div>';\n\n        };\n\n\n    document\n        .getElementsByTagName(\"head\")[0]\n        .appendChild(script);\n\n\n    \/*\n     * Category buttons\n     *\/\n\n    var tabs =\n        document.querySelectorAll(\n            \".cpn-tab\"\n        );\n\n\n    tabs.forEach(\n        function(tab) {\n\n            tab.addEventListener(\n                \"click\",\n                function() {\n\n                    tabs.forEach(\n                        function(t) {\n                            t.classList.remove(\n                                \"active\"\n                            );\n                        }\n                    );\n\n\n                    tab.classList.add(\n                        \"active\"\n                    );\n\n\n                    render(\n                        tab.getAttribute(\n                            \"data-category\"\n                        )\n                    );\n\n                }\n            );\n\n        }\n    );\n\n})();\n\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>\ud83d\udcf0 CAAIP PUBLIC NEWS Berita terbaru dari CAAIP News Semua Berita Utama Berita Duka Ulasan Profil Marine Engineering \u23f3 Memuat berita CAAIP&#8230; \ud83d\udcf0 Lihat Semua Berita CAAIP \u2192<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"pagelayer_contact_templates":[],"_pagelayer_content":"","footnotes":""},"class_list":["post-1525","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/caaip.net\/corps\/wp-json\/wp\/v2\/pages\/1525","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/caaip.net\/corps\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/caaip.net\/corps\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/caaip.net\/corps\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/caaip.net\/corps\/wp-json\/wp\/v2\/comments?post=1525"}],"version-history":[{"count":6,"href":"https:\/\/caaip.net\/corps\/wp-json\/wp\/v2\/pages\/1525\/revisions"}],"predecessor-version":[{"id":2073,"href":"https:\/\/caaip.net\/corps\/wp-json\/wp\/v2\/pages\/1525\/revisions\/2073"}],"wp:attachment":[{"href":"https:\/\/caaip.net\/corps\/wp-json\/wp\/v2\/media?parent=1525"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}