{"id":18781,"date":"2026-03-12T12:46:01","date_gmt":"2026-03-12T12:46:01","guid":{"rendered":"https:\/\/buwebsite.azurewebsites.net\/projectnami\/?page_id=18781"},"modified":"2026-03-15T21:32:54","modified_gmt":"2026-03-15T21:32:54","slug":"media","status":"publish","type":"page","link":"https:\/\/bu.cloudlabs.live\/projectnami\/media\/","title":{"rendered":"Media"},"content":{"rendered":"\n<div class=\"wp-block-group has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">    <style>\n        .amh-wrapper { max-width: 1200px; margin: auto; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; padding: 10px; }\n        .amh-tabs { display: flex; justify-content: center; gap: 10px; margin-bottom: 30px; flex-wrap: wrap; }\n        .amh-btn { padding: 12px 25px; cursor: pointer; border-radius: 6px; font-weight: bold; transition: 0.3s; font-size: 15px; }\n        .amh-btn.active { background: #b2040e !important; color: #fff !important; border: none; box-shadow: 0 4px 10px rgba(178, 4, 14, 0.3); }\n        .amh-btn:not(.active) { background: #fff !important; color: #b2040e !important; border: 1px solid #b2040e !important; }\n        .amh-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 20px; }\n        .amh-card { background: #fff; border: 1px solid #eee; border-radius: 12px; overflow: hidden; box-shadow: 0 5px 15px rgba(0,0,0,0.05); transition: 0.3s; display: flex; flex-direction: column; }\n        .amh-card:hover { transform: translateY(-5px); box-shadow: 0 8px 20px rgba(0,0,0,0.1); }\n        .amh-card img, .amh-card video { width: 100%; height: 200px; object-fit: contain; background: #f4f4f4; display: block; cursor: pointer; border-bottom: 1px solid #f0f0f0; }\n        .amh-label { padding: 12px; font-size: 13px; text-align: center; color: #333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: help; background: #fff; font-weight: 500; }\n        .amh-pagination { margin-top: 40px; display: flex; justify-content: center; align-items: center; gap: 8px; flex-wrap: wrap; }\n        .p-num { padding: 8px 16px; border: 1px solid #ddd; background: #fff; cursor: pointer; border-radius: 4px; color: #555; font-weight: 600; transition: 0.2s; }\n        .p-num.active { background: #b2040e !important; color: #fff !important; border-color: #b2040e !important; }\n        .amh-nav-btn { padding: 10px 20px; cursor: pointer; border-radius: 4px; background: #b2040e; color: #fff; border: none; font-weight: bold; }\n        .amh-nav-btn:disabled { background: #ccc; cursor: not-allowed; }\n        .amh-lightbox { display: none; position: fixed; z-index: 999999; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.95); justify-content: center; align-items: center; padding: 20px; }\n        .amh-lightbox-content { max-width: 95%; max-height: 90%; border-radius: 4px; box-shadow: 0 0 30px rgba(255,255,255,0.1); object-fit: contain; }\n        .amh-close { position: absolute; top: 20px; right: 30px; color: #fff; font-size: 45px; font-weight: bold; cursor: pointer; line-height: 1; }\n    <\/style>\n\n    <div class=\"amh-wrapper\">\n        <div id=\"amh-lightbox\" class=\"amh-lightbox\" onclick=\"this.style.display='none'\">\n            <span class=\"amh-close\">&times;<\/span>\n            <img id=\"amh-full-img\" class=\"amh-lightbox-content\">\n        <\/div>\n\n        <div class=\"amh-tabs\">\n            <button class=\"amh-btn active\" onclick=\"amhUpdateView('photos')\">Photos (4)<\/button>\n            <button class=\"amh-btn\" onclick=\"amhUpdateView('videos')\">Videos (1)<\/button>\n            <button class=\"amh-btn\" onclick=\"amhUpdateView('news')\">News (63)<\/button>\n        <\/div>\n\n        <div id=\"amh-grid\" class=\"amh-grid\"><\/div>\n\n        <div class=\"amh-pagination\">\n            <button id=\"amh-prev\" class=\"amh-nav-btn\" onclick=\"amhGoPage(-1)\">Previous<\/button>\n            <div id=\"amh-pages\" style=\"display: flex; gap: 5px;\"><\/div>\n            <button id=\"amh-next\" class=\"amh-nav-btn\" onclick=\"amhGoPage(1)\">Next<\/button>\n        <\/div>\n    <\/div>\n\n    <script>\n        const amhData = {\"photos\":[\"2500.avif\",\"65.jpg\",\"AIM_6361.jpg\",\"BUBuilding.jpg\"],\"videos\":[\"1778609455_grok-video-43e6a904-0cf4-450c-9b71-2e99e5a77550-1.mp4\"],\"news\":[\"1778402899_fb_201996846556363_1391071903053625.jpg\",\"1778405573_fb_201996846556363_1386285020198980.jpg\",\"1778405580_fb_201996846556363_1385552166938932.jpg\",\"1778405585_fb_201996846556363_1385210523639763.jpg\",\"1778405592_fb_201996846556363_1385142183646597.jpg\",\"1778405616_fb_201996846556363_1384415750385907.jpg\",\"1778405622_fb_201996846556363_1383572247136924.jpg\",\"1778405629_fb_201996846556363_1382924233868392.jpg\",\"1778405666_fb_201996846556363_1382924233868392.jpg\",\"1778405676_fb_201996846556363_1382924233868392.jpg\",\"1778405691_fb_201996846556363_1382924233868392.jpg\",\"1778405816_fb_201996846556363_1382924233868392.jpg\",\"1778406274_fb_201996846556363_1382598467234302.jpg\",\"1778406315_fb_201996846556363_1380820727412076.jpg\",\"1778406321_fb_201996846556363_1381608977333251.jpg\",\"1778406330_fb_201996846556363_1382924233868392.jpg\",\"1778406348_fb_201996846556363_1379896890837793.jpg\",\"1778406355_fb_201996846556363_1378936820933800.jpg\",\"1778406367_fb_201996846556363_1378275470999935.jpg\",\"1778406376_fb_201996846556363_1378270981000384.jpg\",\"1778406383_fb_201996846556363_1377416497752499.jpg\",\"1778406390_fb_201996846556363_1377242351103247.jpg\",\"1778406398_fb_201996846556363_1376365054524310.jpg\",\"1778406406_fb_201996846556363_1375953967898752.jpg\",\"1778406414_fb_201996846556363_1375822234578592.jpg\",\"1778406422_fb_201996846556363_1375638291263653.jpg\",\"1778406442_fb_201996846556363_1375396947954454.jpg\",\"1778406448_fb_201996846556363_1374725224688293.jpg\",\"1778406457_fb_201996846556363_1372857608208388.jpg\",\"1778406467_fb_201996846556363_1372428044918011.jpg\",\"1778406474_fb_201996846556363_1372149934945822.jpg\",\"1778406481_fb_201996846556363_1372032401624242.jpg\",\"1778406488_fb_201996846556363_1371920771635405.jpg\",\"1778406509_fb_201996846556363_1371432761684206.jpg\",\"1778406516_fb_201996846556363_1371203401707142.jpg\",\"1778406602_fb_201996846556363_1371920771635405.jpg\",\"1778406626_fb_201996846556363_1371100001717482.jpg\",\"1778406633_fb_201996846556363_1371018301725652.jpg\",\"1778406638_fb_201996846556363_1371014521726030.jpg\",\"1778406644_fb_201996846556363_1370401558453993.jpg\",\"1778406651_fb_201996846556363_1370318178462331.jpg\",\"1778406660_fb_201996846556363_1370227411804741.jpg\",\"1778406667_fb_201996846556363_1369862225174593.jpg\",\"1778406674_fb_201996846556363_1369738781853604.jpg\",\"1778406681_fb_201996846556363_1369551661872316.jpg\",\"1778406688_fb_201996846556363_1365723965588419.jpg\",\"1778493804_fb_201996846556363_1364968202330662.jpg\",\"1778493874_fb_201996846556363_1360643032763179.jpg\",\"1778493883_fb_201996846556363_1359061846254631.jpg\",\"1778493891_fb_201996846556363_1355818456578970.jpg\",\"1778493905_fb_201996846556363_1354285150065634.jpg\",\"1778493914_fb_201996846556363_1352571290237020.jpg\",\"1778493924_fb_201996846556363_1350299837130832.jpg\",\"492341756_1160858552718747_5683575092580232050_n.jpg\",\"BU100.jpg\",\"BU_1.png\",\"DSC00581-Picsart-AiImageEnhancer.jpeg\",\"Gemini_Generated_Image_fmtl2gfmtl2gfmtl.png\",\"Inception-Workshop-2.jpg\",\"Seminar-1-1.jpg\",\"bus_dpt.jpeg\",\"n14.jpg\",\"\\u0996\\u09be\\u09b2\\u09c7\\u09a6\\u09be-\\u099c\\u09bf\\u09af\\u09bc\\u09be\\u09b0.webp\"]};\n        const amhBase = \"https:\/\/bu.cloudlabs.live\/projectnami\/wp-content\/Images\/\";\n        let amhCat = 'photos';\n        let amhPage = 1;\n        const amhLimit = 12;\n\n        function amhRender() {\n            const grid = document.getElementById('amh-grid');\n            const items = amhData[amhCat];\n            const total = Math.ceil(items.length \/ amhLimit) || 1;\n            \n            if (amhPage > total) amhPage = total;\n            grid.innerHTML = '';\n            \n            const start = (amhPage - 1) * amhLimit;\n            const pageItems = items.slice(start, start + amhLimit);\n\n            pageItems.forEach(file => {\n                const url = amhBase + amhCat + '\/' + encodeURIComponent(file);\n                const card = document.createElement('div');\n                card.className = 'amh-card';\n                let displayName = file.split('.').slice(0, -1).join('.');\n                let mediaHtml = amhCat === 'videos' \n                    ? `<video controls preload=\"metadata\"><source src=\"${url}\" type=\"video\/mp4\"><\/video>`\n                    : `<img decoding=\"async\" src=\"${url}\" loading=\"lazy\" onclick=\"amhPopup('${url}')\">`;\n                card.innerHTML = `${mediaHtml}<div class=\"amh-label\" title=\"${file}\">${displayName}<\/div>`;\n                grid.appendChild(card);\n            });\n            amhPager(total);\n        }\n\n        function amhPager(total) {\n            const container = document.getElementById('amh-pages');\n            container.innerHTML = '';\n            let startPage = Math.max(1, amhPage - 2);\n            let endPage = Math.min(total, startPage + 4);\n            if(endPage - startPage < 4) startPage = Math.max(1, endPage - 4);\n            for(let i = startPage; i <= endPage; i++) {\n                const btn = document.createElement('button');\n                btn.innerText = i;\n                btn.className = i === amhPage ? 'p-num active' : 'p-num';\n                btn.onclick = () => { amhPage = i; amhRender(); amhScroll(); };\n                container.appendChild(btn);\n            }\n            document.getElementById('amh-prev').disabled = amhPage === 1;\n            document.getElementById('amh-next').disabled = (amhPage === total || total === 0);\n        }\n\n        function amhPopup(url) { \n            document.getElementById('amh-lightbox').style.display = 'flex'; \n            document.getElementById('amh-full-img').src = url; \n        }\n\n        function amhUpdateView(c) { \n            amhCat = c; amhPage = 1; \n            document.querySelectorAll('.amh-btn').forEach(b => b.classList.remove('active'));\n            event.target.classList.add('active'); \n            amhRender(); \n        }\n\n        function amhGoPage(s) { \n            amhPage += s; amhRender(); amhScroll(); \n        }\n\n        function amhScroll() { \n            document.querySelector('.amh-wrapper').scrollIntoView({behavior:'smooth'}); \n        }\n\n        document.addEventListener('DOMContentLoaded', amhRender);\n    <\/script>\n    \n<\/div>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-18781","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/bu.cloudlabs.live\/projectnami\/wp-json\/wp\/v2\/pages\/18781","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/bu.cloudlabs.live\/projectnami\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/bu.cloudlabs.live\/projectnami\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/bu.cloudlabs.live\/projectnami\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/bu.cloudlabs.live\/projectnami\/wp-json\/wp\/v2\/comments?post=18781"}],"version-history":[{"count":2,"href":"https:\/\/bu.cloudlabs.live\/projectnami\/wp-json\/wp\/v2\/pages\/18781\/revisions"}],"predecessor-version":[{"id":18814,"href":"https:\/\/bu.cloudlabs.live\/projectnami\/wp-json\/wp\/v2\/pages\/18781\/revisions\/18814"}],"wp:attachment":[{"href":"https:\/\/bu.cloudlabs.live\/projectnami\/wp-json\/wp\/v2\/media?parent=18781"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}