{"id":10356,"date":"2021-07-16T17:52:40","date_gmt":"2021-07-16T09:52:40","guid":{"rendered":"https:\/\/www.hkmu.edu.hk\/lib\/?page_id=10356"},"modified":"2023-10-10T18:33:39","modified_gmt":"2023-10-10T10:33:39","slug":"announcements","status":"publish","type":"page","link":"https:\/\/www-uat.hkmu.edu.hk\/lib\/announcements\/","title":{"rendered":"Announcements"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"10356\" class=\"elementor elementor-10356\" data-elementor-settings=\"[]\">\n\t\t\t\t\t\t\t<div class=\"elementor-section-wrap\">\n\t\t\t\t\t\t\t<section class=\"wavo-column-gap-default elementor-section elementor-top-section elementor-element elementor-element-09070f4 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"09070f4\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-ab388a9\" data-id=\"ab388a9\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-965d09a elementor-widget elementor-widget-shortcode\" data-id=\"965d09a\" data-element_type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"elementor-shortcode\"><style>\r\n    .table-container {\r\n        margin-bottom: 50px;\r\n    }\r\n\r\n    tr.header-section td:nth-child(3),\r\n    tr.header-section td:nth-child(4) {\r\n        text-align: center;\r\n        width: 8vw;\r\n    }\r\n    tr.announcement td:nth-child(3),\r\n    tr.announcement td:nth-child(4) {\r\n        text-align: center;\r\n    }\r\n    .OU_DESC{\r\n        margin: 20px 0;\r\n    }\r\n\r\n    @media screen and (max-width: 600px) {\r\n        .table-container {\r\n            max-width: 100%;\r\n            overflow-x: auto;\r\n        }\r\n\r\n        .table-container table {\r\n            width: 100%;\r\n            border-collapse: collapse;\r\n        }\r\n\r\n        .table-container th, .table-container td {\r\n            padding: 8px;\r\n            text-align: left;\r\n            white-space: nowrap;\r\n        }\r\n    }\r\n<\/style>\r\n\r\n\r\n<div class=\"table-container\">\r\n    <table cellspacing=\"0\" cellpadding=\"0\" width=\"100%\">\t\t\t\t\t\r\n        <tbody id=\"LIB-container\">\r\n            <tr class=\"header-section\">\r\n                <td width=\"10\"><img decoding=\"async\" src=\"\/WEB\/images\/general\/ue6\/spacer.gif\" width=\"10\" border=\"0\" alt=\" \"><\/td>\r\n                <td>&nbsp;<\/td>\r\n                <td><u>Post Date<\/u><\/td>\r\n                <td><u>Expiry Date<\/u><\/td>\r\n            <\/tr>\r\n        <\/tbody>\r\n    <\/table>\r\n<\/div>\r\n\r\n\r\n<script>\r\n    \/\/   -------------------------------------------   Variable Setting   -------------------------------------------\r\n    var env = 'service';\r\n    var OU_UNIT = 'LIB';\r\n    var lang ='eng';\r\n    var url_lang = lang;\r\n    if( url_lang == 'chi' ){\r\n        url_lang = 'tc\/';\r\n    }else if( url_lang == 'sim' ){\r\n        url_lang = 'sc\/';\r\n    }else{\r\n        url_lang = '';\r\n    }\r\n    var subsite_url = 'https:\/\/www-uat.hkmu.edu.hk\/lib\/'+url_lang+'announcements';\r\n    var aid = '';\r\n\r\n\r\n    \/\/   -------------------------------------------   AJAX Call   -------------------------------------------\r\n    if( aid.length > 1 ){\r\n        \/\/ Create an XMLHttpRequest object\r\n        var xhr = new XMLHttpRequest();\r\n\r\n        \/\/ Define the URL and the request method\r\n        var url = 'https:\/\/'+env+'.hkmu.edu.hk\/WebAPI\/rest\/V1\/Announcement';\r\n        var method = 'GET';\r\n\r\n        \/\/ Construct the API URL with the query parameters\r\n        var queryParams = 'OU_ANNOUNCE_ID=' + encodeURIComponent(aid) + '&LANG=' + encodeURIComponent(lang);\r\n        var api_url = url + '?' + queryParams;\r\n\r\n        \/\/ Set up the request\r\n        xhr.open(method, api_url, true);\r\n        \/\/ Define the callback function to handle the response\r\n        xhr.onload = function () {\r\n            if (xhr.status === 200) {\r\n                var response = JSON.parse(xhr.responseText);\r\n\r\n                \/\/ Process the response data\r\n                \/\/ Access the JSON data here\r\n                console.log(response);\r\n                renderContentHTML(response);\r\n            }else{\r\n                \/\/ Request resulted in an error (e.g., 404 or 500)\r\n                handleError(xhr.status);\r\n            }\r\n        };\r\n\r\n        xhr.onerror = function() {\r\n            \/\/ An error occurred during the request\r\n            handleError(xhr.status);\r\n        };\r\n\r\n        \/\/ Send the request\r\n        xhr.send();\r\n\r\n    }else{\r\n        \/\/ Create an XMLHttpRequest object\r\n        var xhr = new XMLHttpRequest();\r\n\r\n        \/\/ Define the URL and the request method\r\n        var url = 'https:\/\/'+env+'.hkmu.edu.hk\/WebAPI\/rest\/V1\/AnnouncementList_V2';\r\n        var method = 'GET';\r\n\r\n        \/\/ Construct the API URL with the query parameters\r\n        var queryParams = 'OU_UNIT=' + encodeURIComponent(OU_UNIT) + '&LANG=' + encodeURIComponent(lang);\r\n        var api_url = url + '?' + queryParams;\r\n\r\n        \/\/ Set up the request\r\n        xhr.open(method, api_url, true);\r\n        \/\/ Define the callback function to handle the response\r\n        xhr.onload = function () {\r\n            if (xhr.status === 200) {\r\n                var response = JSON.parse(xhr.responseText);\r\n\r\n                \/\/ Process the response data\r\n                \/\/ Access the JSON data here\r\n                console.log(response);\r\n                renderHTML(response);\r\n            }else{\r\n                \/\/ Request resulted in an error (e.g., 404 or 500)\r\n                handleError(xhr.status);\r\n            }\r\n        };\r\n\r\n        xhr.onerror = function() {\r\n            \/\/ An error occurred during the request\r\n            handleError(xhr.status);\r\n        };\r\n\r\n        \/\/ Send the request\r\n        xhr.send();\r\n    }\r\n\r\n\r\n    \/\/   -------------------------------------------   Function to render HTML code   -------------------------------------------\r\n    function renderHTML(data) {\r\n        \/\/ Select the container element where the HTML code will be added\r\n        let container = document.getElementById(OU_UNIT+'-container');\r\n        container.classList.add(OU_UNIT);\r\n\r\n        \/\/ Generate HTML elements based on the data\r\n        for (var i = 0; i < data.length; i++) {\r\n            let announcement = data[i];\r\n\r\n            \/\/ Create a new HTML element\r\n            let tr = document.createElement('tr');\r\n            tr.classList.add('announcement');\r\n            tr.classList.add('announcement'+OU_UNIT);\r\n            tr.classList.add(i);\r\n\r\n            \/\/ handle the date variable\r\n            let PUB_DATE = '-';\r\n            if( announcement.OU_PUB_DATE != '' ){\r\n                PUB_DATE = announcement.OU_PUB_DATE;\r\n                PUB_DATE = convertDateFormat(PUB_DATE);\r\n            }\r\n\r\n            let EXP_DATE = '-';\r\n            if( announcement.OU_EXP_DATE != '' ){\r\n                EXP_DATE = announcement.OU_EXP_DATE;\r\n                EXP_DATE = convertDateFormat(EXP_DATE);\r\n            }\r\n\r\n            \/\/ avoid multiple language title is null issues.\r\n            let myTitle = announcement.OU_TITLE_ENG;\r\n            if( lang == 'chi' ){\r\n                myTitle = announcement.OU_TITLE_CHI;\r\n            }else if( lang == 'sim' ){\r\n                myTitle = announcement.OU_TITLE_SIM;\r\n            }\r\n\r\n            if( myTitle == '' ){\r\n                myTitle = announcement.OU_TITLE_ENG;\r\n            }\r\n\r\n\r\n            \/\/ control display or not\r\n            let myShow = announcement.OU_SHOW_ADMIN;\r\n            let myUnit = announcement.OU_UNIT;\r\n            if ( myUnit != null && (myUnit == \"FU\" || myUnit == \"FMU\") ) {\r\n                myUnit = \"FFMU\";\r\n            }\r\n\r\n            if ( myShow == \"Y\" && myUnit == OU_UNIT ){\r\n\r\n                let SHOW_TIME = new Date().getFullYear();\r\n                let SHOW_PUB_DATE = announcement.OU_PUB_DATE.toString().substring(0,4);\r\n                let SHOW_EXP_DATE = announcement.OU_EXP_DATE.toString().substring(0,4);\r\n                \/\/console.log('SHOW_TIME: '+SHOW_TIME);\r\n                \/\/console.log('SHOW_PUB_DATE: '+SHOW_PUB_DATE);\r\n                \/\/console.log('SHOW_EXP_DATE: '+SHOW_EXP_DATE);\r\n\r\n                if (SHOW_TIME - 1 <= SHOW_PUB_DATE || SHOW_TIME === SHOW_EXP_DATE) {\r\n                    \/\/ Set the content of the HTML element\r\n                    tr.innerHTML = \r\n                    '<td style=\"padding:5px; width:30px\"><img decoding=\"async\" src=\"https:\/\/www.hkmu.edu.hk\/data\/images\/arrow.gif\"><\/td>' +\r\n                    '<td style=\"padding:5px;\"><a href=\"'+subsite_url+'?lang='+lang+'&amp;aid='+announcement.OU_ANNOUNCE_ID+'\" target=\"_blank\" >'+myTitle+'<\/a><\/td>'+\r\n                    '<td style=\"padding:5px; \">'+PUB_DATE+'<\/td>'+\r\n                    '<td style=\"padding:5px; \">'+EXP_DATE+'<\/td>';\r\n\r\n                    \/\/ Append the HTML element to the container\r\n                    container.appendChild(tr);\r\n                }\r\n            }\r\n        }\r\n    }\r\n\r\n    function renderContentHTML(data) {\r\n        \/\/ Select the container element where the HTML code will be added\r\n        let container = document.getElementById(OU_UNIT+'-container');\r\n        container.classList.add(OU_UNIT);\r\n        \/\/ Create a new HTML element\r\n        let div = document.createElement('div');\r\n        div.classList.add('announcement');\r\n        div.classList.add('announcement'+OU_UNIT);\r\n\r\n        \/\/ Generate HTML elements based on the data\r\n        let announcement = data[0];\r\n\r\n        \/\/ handle the date variable\r\n        let PUB_DATE = '-';\r\n        if( announcement.OU_PUB_DATE != '' ){\r\n            PUB_DATE = announcement.OU_PUB_DATE;\r\n            PUB_DATE = convertDateFormat(PUB_DATE);\r\n        }\r\n\r\n        div.innerHTML = \r\n        '<h3>'+announcement.OU_TITLE+'<\/h3>'+\r\n        '<p>'+PUB_DATE+'<\/p><hr\/>'+\r\n        '<div class=\"OU_DESC\">'+announcement.OU_DESC+'<\/div>';\r\n\r\n        \/\/ Append the HTML element to the container\r\n        container.appendChild(div);\r\n\r\n    }\r\n\r\n    function convertDateFormat(inputDateTime){\r\n        const date = new Date(inputDateTime);\r\n        const formattedDate = `${date.getDate().toString().padStart(2, '0')}-${date.toLocaleString('default', { month: 'short' }).toUpperCase()}-${date.getFullYear().toString().substring(2)}`;\r\n        \/\/console.log(formattedDate); \/\/ Output: 09-OCT-23\r\n        return formattedDate;\r\n    }\r\n\r\n    function handleError(status) {\r\n        if (status === 404) {\r\n            console.log(\"404 Error: Resource not found\");\r\n            document.getElementById(OU_UNIT+'-container').innerHTML = 'Loading......';\r\n        } else if (status === 500) {\r\n            console.log(\"500 Error: Internal server error\");\r\n            document.getElementById(OU_UNIT+'-container').innerHTML = 'Loading......';\r\n        } else {\r\n            console.log(\"An error occurred: \" + status);\r\n            document.getElementById(OU_UNIT+'-container').innerHTML = 'Loading......';\r\n        }\r\n    }\r\n    \r\n<\/script><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_expiration-date-status":"","_expiration-date":0,"_expiration-date-type":"","_expiration-date-categories":[],"_expiration-date-options":[]},"_links":{"self":[{"href":"https:\/\/www-uat.hkmu.edu.hk\/lib\/wp-json\/wp\/v2\/pages\/10356"}],"collection":[{"href":"https:\/\/www-uat.hkmu.edu.hk\/lib\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www-uat.hkmu.edu.hk\/lib\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www-uat.hkmu.edu.hk\/lib\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www-uat.hkmu.edu.hk\/lib\/wp-json\/wp\/v2\/comments?post=10356"}],"version-history":[{"count":13,"href":"https:\/\/www-uat.hkmu.edu.hk\/lib\/wp-json\/wp\/v2\/pages\/10356\/revisions"}],"predecessor-version":[{"id":46387,"href":"https:\/\/www-uat.hkmu.edu.hk\/lib\/wp-json\/wp\/v2\/pages\/10356\/revisions\/46387"}],"wp:attachment":[{"href":"https:\/\/www-uat.hkmu.edu.hk\/lib\/wp-json\/wp\/v2\/media?parent=10356"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}