/**
 * Copyright (c) 2020
 *
 * CENTIRM HotelTV UI-WELCOME module javascript.
 *
 * @summary short description for the file
 * @author Joel <joel.kim@centirm.com>
 *
 * Created at     : 2020-11-26 02:21:56
 * Last modified  : 2020-11-26 15:31:40
 */
const gRmtKey = {
    left: 37,
    right: 39,
    up: 38,
    down: 40,
    enter: 13,
    back: 461,
    red: 403,
    green: 404,
    yellow: 405,
    blue: 406,
    stop: 413,
    play: 415,

    num0: 48,
    num1: 49,
    num2: 50,
    num3: 51,
    num4: 52,
    num5: 53,
    num6: 54,
    num7: 55,
    num8: 56,
    num9: 57,

    chup: 427,
    chdown: 428,
    chprev: 711,

    /** ENNPLE SPECIAL KEY */
    amenity: -2072433963,
    roomservice: -2072437788,
    flight: -2072437533,
    weather: -2072438298,
    tv: -2072443143,
}


HotelTV.namespace('HotelTV.ui_appfull');
HotelTV.ui_appfull = (function() {
    //// 의존 관계 선언
    var _hndl_mmSel = null;
    var _hndl_mmBg = null;
    var _hndl_smSel = null;
    var _hndl_smBg = null;
    var _hndl_mpSel = null;
    var _hndl_mpBg = null;
    var _hndl_ctzGenBg = null;
    var _hndl_brochureBg = null;
    var _hndl_widget_topTime = null;
    var _hndl_tmrTvChnMngr = null;
    var _hndl_tmrUgMngr = null;
    var _hndl_tmrCtzThumbAni = null;
    var _hndl_tmrCtzBgAni = null;
    const _lastTm = {
        'tvchannel_changed': null,
        'keyevt': {
            'tv_num' :null,
            'tv_ctrl' :null,
            'last' :null,
        },
    };

    /***********************************************************************
     * 비공개 프로퍼티                                                      *
     ***********************************************************************/
    /**
     * HotelTV UI[AppFull] Wrapper Function::> 리모콘 키가 숫자키인지 검사
     * @param {dictionary} _evt event information
     */
    function __uifxn_Utils_CheckKeyisNumber(_evt_keyCode) {
        if ( _evt_keyCode == gRmtKey.num0 || _evt_keyCode == gRmtKey.num1 ||
            _evt_keyCode == gRmtKey.num2 || _evt_keyCode == gRmtKey.num3 ||
            _evt_keyCode == gRmtKey.num4 || _evt_keyCode == gRmtKey.num5 ||
            _evt_keyCode == gRmtKey.num6 || _evt_keyCode == gRmtKey.num7 ||
            _evt_keyCode == gRmtKey.num8 || _evt_keyCode == gRmtKey.num9 ){
            return true;
        }

        return false;
    }


    /**
     * HotelTV UI[AppFull] Wrapper Function::> Keydown event time recorder
     * @param {dictionary} _evt event information
     */
    function __uifxn_AppFull_OnKeyDnEvtRec(_evt) {
        const _state = HotelTV.state;
        let _tm_diff_ms = 0;
        let _cur_date = new Date();

        if ( __uifxn_Utils_CheckKeyisNumber(_evt.keyCode)==true ){
            _lastTm.keyevt.tv_num = _cur_date;
        } else if ( _evt.keyCode == gRmtKey.up || _evt.keyCode == gRmtKey.down ||
            _evt.keyCode == gRmtKey.left || _evt.keyCode == gRmtKey.right ||
            _evt.keyCode == gRmtKey.chup || _evt.keyCode == gRmtKey.chdown ) {
            _lastTm.keyevt.tv_ctrl = _cur_date;
        }
        _lastTm.keyevt.last = _cur_date;
    }




    /**
     * HotelTV UI Wrapper Function::> received event handling function
     * @param {dictionary} _evt event information
     */
    function __uifxn_AppFull_OnMediaEvt(_evt) {
        let _state = HotelTV.state;
        console.log("media_event_received = " + _evt.eventType);
        let _stateMedia = _evt.eventType;

        if (_state.menu.stage.cur == "ctzgen") {
            switch (_stateMedia) {
                case 'play_start':
                    _state.media.playing = true;
                    $('.main .ctzgen .bg .owl-carousel .owl-stage-outer .owl-stage .owl-item').removeClass('movieplay');
                    $('.main .ctzgen .bg .owl-carousel .owl-stage-outer .owl-stage .owl-item.active').addClass('movieplay');
                    $('.owl-theme .owl-nav.disabled+.owl-dots').fadeOut(500);
                    HotelTV.hcap.VideoWinSize(null);
                    break;
                case 'play_end':
                    _state.media.playing = false;
                    HotelTV.hcap.MediaStop(
                        function() {
                            $('.main .ctzgen .bg .owl-carousel .owl-stage-outer .owl-stage .owl-item').removeClass('movieplay');
                            $('.owl-theme .owl-nav.disabled+.owl-dots').fadeIn(500);
                        },
                        function() {
                            $('.main .ctzgen .bg .owl-carousel .owl-stage-outer .owl-stage .owl-item').removeClass('movieplay');
                            $('.owl-theme .owl-nav.disabled+.owl-dots').fadeIn(500);
                        });
                    break;
                case 'error_in_playing':
                    break;
                case 'buffer_full':
                    break;
                case 'file_not_found':
                    break;
                case 'network_disconnected':
                    break;
                case 'network_busy':
                    break;
                case 'seek_done':
                    break;
            }
        }
    }

    /**
     * HotelTV UI Wrapper Function::> received event handling function
     * @param {dictionary} _evt event information
     */
    function __uifxn_AppFull_OnNetEvt(_evt) {
        let _state = HotelTV.state;
        console.log("network_event_received = " + _evt.eventType);
        let _typeNetEvt = _evt.eventType;

        switch (_typeNetEvt) {
            case 'play_start':
                break;
            case 'play_end':
                break;
            case 'error_in_playing':
                break;
            case 'buffer_full':
                break;
            case 'file_not_found':
                break;
            case 'network_disconnected':
                break;
            case 'network_busy':
                break;
            case 'seek_done':
                break;
        }
    }

    /**
     * HotelTV UI Wrapper Function::> received event handling function
     * @param {dictionary} _evt event information
     */
    function __uifxn_AppFull_OnAppFocusEvt(_evt) {
        let _state = HotelTV.state;
        console.log("hcap_application_focus_changed = " + _evt.eventType);
        let _typeAppFocusEvt = _evt.eventType;

        if (_typeAppFocusEvt == "focused") {
            // HotelTV.hcap.SetSoftAp({
            //     "enable": false,
            // });
        }else if (_typeAppFocusEvt == "unfocused") {

        }
    }

    /**
     * HotelTV UI Wrapper Function::> received event handling function
     * @param {dictionary} _evt event information
     */
    function __uifxn_AppFull_OnHdmiConChangeEvt(_evt) {
        let _state = HotelTV.state;
        let _trTbl = HotelTV.translation;
        // {Number} param.index - index of the HDMI which was connected or disconnected.
        // {Boolean} param.connected - true if the HDMI is connected, else false.
        console.warn(
            "Event 'hdmi_connection_changed' is received.\n" +
            "HDMI-" + _evt.index + " : " + "connected = " + _evt.connected
        );

        if ( _evt.connected==true ){
            _state.menu.stage.prev = _state.menu.stage.cur;
            _state.menu.stage.cur = "external_av_hdmi";
            setTimeout(function(){
                $('body,html').fadeOut(500, function(){
                    HotelTV.hcap.SetExternalInput("HDMI", Number(_evt.index)-1);
                });
            }, 1000);
            HotelTV.ui_utils.ShowNotificationMsgBalloon(_trTbl.system.notice.event.external_input.hdmi_connected[_state.lang], 5);
        }else{
            $('body,html').fadeIn(500);
            _state.menu.stage.cur = _state.menu.stage.prev;
            _state.menu.stage.prev = null;
        }
    }

    /**
     * HotelTV UI Wrapper Function::> received event handling function
     * @param {dictionary} _evt event information
     */
    function __uifxn_AppFull_OnTvChChgChangeEvt(_evt) {
        let _state = HotelTV.state;

        // Set tv playing flag
        _state.tv.playing = true;
        // {Boolean} param.result - true if the current channel is changed successfully, else false.
        // {String} param.errorMessage - in case of failure, this message provides the details.
        console.log(
            "Event 'channel_changed' is received. " +
            "Result = " + _evt.result + "Error message = " + _evt.errorMessage
        );
    }




    /**
     * HotelTV UI[AppFull] Wrapper Function::> show/hide special hotkey(red/yellow/green/blue/etc...) btn
     * @param {boolean} e event
     */
    function __uifxn_AppFull_ShowMMHotKeyBtn(_show) {
        let _state = HotelTV.state;
        let _opening = HotelTV.opening;
        let _brochure = _opening.brochures;

        // Draw Amenity & Room Service
        if (_opening.amenity) {
            let _amenityCtz = _opening.amenity;
            // TITLE
            $(`.control .mm .hotkey_${_amenityCtz.button}`).text(_amenityCtz.title[_state.lang]);
            // HOTKEY 버튼 Show/Hide
            $(`.control .mm .hotkey_${_amenityCtz.button}`).css({ "background-image": "url(" + _amenityCtz.buttonImage.file.download + ")" });
            $(`.control .mm .hotkey_${_amenityCtz.button}`).css({ "top": _amenityCtz.positionY + "%" });
            $(`.control .mm .hotkey_${_amenityCtz.button}`).css({ "left": _amenityCtz.positionX + "%" });
            if (_show == true) {
                if ($(`.control .mm .hotkey_${_amenityCtz.button}`).css("display") == "none") {
                    $(`.control .mm .hotkey_${_amenityCtz.button}`).fadeIn(300);
                }
            } else {
                if ($(`.control .mm .hotkey_${_amenityCtz.button}`).css("display") != "none") {
                    $(`.control .mm .hotkey_${_amenityCtz.button}`).fadeOut(300);
                }
            }
        }

        if (_opening.roomService) {
            let _roomserviceCtz = _opening.roomService;
            // TITLE
            $(`.control .mm .hotkey_${_roomserviceCtz.button}`).text(_roomserviceCtz.title[_state.lang]);
            // HOTKEY 버튼 Show/Hide
            $(`.control .mm .hotkey_${_roomserviceCtz.button}`).css({ "background-image": "url(" + _roomserviceCtz.buttonImage.file.download + ")" });
            $(`.control .mm .hotkey_${_roomserviceCtz.button}`).css({ "top": _roomserviceCtz.positionY + "%" });
            $(`.control .mm .hotkey_${_roomserviceCtz.button}`).css({ "left": _roomserviceCtz.positionX + "%" });
            if (_show == true) {
                if ($(`.control .mm .hotkey_${_roomserviceCtz.button}`).css("display") == "none") {
                    $(`.control .mm .hotkey_${_roomserviceCtz.button}`).fadeIn(300);
                }
            } else {
                if ($(`.control .mm .hotkey_${_roomserviceCtz.button}`).css("display") != "none") {
                    $(`.control .mm .hotkey_${_roomserviceCtz.button}`).fadeOut(300);
                }
            }
        }

        // Draw Brochure contents
        for (let _idx = 1; _idx <= _brochure.length; _idx++) {
            let _brcCtz = _brochure[_idx];
            // TITLE
            $(`.control .mm .hotkey_${_brcCtz.button}`).text(_brcCtz.title[_state.lang]);
            // HOTKEY 버튼 Show/Hide
            $(`.control .mm .hotkey_${_brcCtz.button}`).css({ "background-image": "url(" + _brcCtz.buttonImage.file.download + ")" });
            $(`.control .mm .hotkey_${_brcCtz.button}`).css({ "top": _brcCtz.positionY + "%" });
            $(`.control .mm .hotkey_${_brcCtz.button}`).css({ "left": _brcCtz.positionX + "%" });
            if (_show == true) {
                if ($(`.control .mm .hotkey_${_brcCtz.button}`).css("display") == "none") {
                    $(`.control .mm .hotkey_${_brcCtz.button}`).fadeIn(300);
                }
            } else {
                if ($(`.control .mm .hotkey_${_brcCtz.button}`).css("display") != "none") {
                    $(`.control .mm .hotkey_${_brcCtz.button}`).fadeOut(300);
                }
            }
        }
    }

    /**
     * HotelTV UI[AppFull] Wrapper Function::> build Brochure and In-room dining
     * @param {boolean} e event
     */
    function __uifxn_AppFull_BuildBrochure() {
        let _state = HotelTV.state;
        let _brochure = HotelTV.opening.brochures;

        for (let _idx = 1; _idx <= _brochure.length; _idx++) {
            let _brcCtz = _brochure[_idx];
            // BROCHURE 이미지 노드를 동적으로 구성
            let _div_popup_mm_red_bglist = document.querySelector(`#lst_hotkey_mm_${_brcCtz.button}`);
            for (let _page_idx = 1; _page_idx <= _brcCtz.page[_state.lang].length; _page_idx++) {
                let _div_popup_mm_red_item = document.createElement('div');
                let _sz_styleOpt = null;
                _div_popup_mm_red_item.className = 'item';
                _div_popup_mm_red_item.setAttribute(`popup_hotkey_mm_${_brcCtz.button}`, _page_idx);
                _sz_styleOpt = "background-image: url(" + _brcCtz.page[_state.lang][_page_idx].download + "); ";
                _sz_styleOpt += "background-repeat: no-repeat; background-position: center center; background-size: 100% 100%; ";
                _div_popup_mm_red_item.setAttribute("style", _sz_styleOpt);

                _div_popup_mm_red_bglist.appendChild(_div_popup_mm_red_item);
            }
            _hndl_brochureBg = $(`#lst_hotkey_mm_${_brcCtz.button}`);
            _hndl_brochureBg.owlCarousel({
                center: false,
                items: 1, //Number of Items on Screen what you want
                nav: true,
                loop: false,
                margin: 0,
                smartSpeed: 1000,
                lazyLoad: true,
                mouseDrag: false,
                touchDrag: false,
                pullDrag: false,
                freeDrag: false,
                navText: ["<div class='nav-btn prev-slide'></div>", "<div class='nav-btn next-slide'></div>"],
                startPosition: 0,
            });

            // HOTKEY정보를 state에 기록
            if (!(_brcCtz.button in _state.hotkey.mm)) {
                _state.hotkey.mm[_brcCtz.button] = { 'type': "brochure" , 'id':_brcCtz.id};
            }
        }
    }


    /**
     * HotelTV UI[AppFull] Wrapper Function::> build amenity
     * @param {boolean} _show show/hide
     */
     function __uifxn_AppFull_DrawAmenityOrderAlert(_show) {
        let _state = HotelTV.state;
        let _trTbl = HotelTV.translation;
        let _elAmPupRoot = $('.popup .amenity');
        let _elAmOderAlertRoot = _elAmPupRoot.children('.alert');
        let _elAmOderAlertOrderComplete = _elAmOderAlertRoot.children('#order-complete');

        if (_show == false) {
            if (_elAmOderAlertRoot.css('display') != "none") {
                _elAmOderAlertOrderComplete.hide(0, function() {
                    _elAmOderAlertRoot.hide();
                });
            }
            return;
        }

        // Draw Titile and message
        _elAmOderAlertOrderComplete.children("#title").text(_trTbl.ui.amenity.title.ordercomplete[_state.lang]);
        _elAmOderAlertOrderComplete.children("#message").text(_trTbl.ui.amenity.usage.orderAlertComplete[_state.lang]);

        if (_elAmOderAlertOrderComplete.css('display') == "none") {
            _elAmOderAlertOrderComplete.show();
        }

        if (_elAmOderAlertRoot.css('display') == "none") {
            _elAmOderAlertRoot.fadeIn(300);
        }
    }

    /**
     * HotelTV UI[AppFull] Wrapper Function::> update amenity service order list
     * @param {boolean} _show show/hide
     * @param {string} _keyEvt key event
     */
    async function __uifxn_AppFull_DrawAmenityOrderList(_show, _keyEvt) {
        let _state = HotelTV.state;
        let _trTbl = HotelTV.translation;
        let _RsOrder = null;
        let _amenity = HotelTV.opening.amenity;

        let _elAmPupRoot = $('.popup .amenity');
        let _elAmOLstRoot = _elAmPupRoot.children('.order-details');
        let _elAmOLstItems = _elAmOLstRoot.children(`#orders`);
        let _elAmOLstSummary = _elAmOLstRoot.children('#summary');

        const __fxn_getAmItemValue = function(_object, _key, _itemID) {
            for (__j = 1; __j <= _object.length; __j++) {
                if (_object[__j].id == _itemID) {
                    return _object[__j][_key];
                }
            }
        }

        const __fxn_padZero = function(_num, _size) {
            _num = _num.toString();
            while (_num.length < _size) _num = "0" + _num;
            return _num;
        }




        if (_show == false) {
            if (_elAmOLstRoot.css('display') != "none") {
                _elAmOLstRoot.hide();
            }
            return;
        }


        switch (_keyEvt) {
            case "build":
                {
                    let _total_quantity = 0;

                    try {
                        HotelTV.orders.amenity = _RsOrder = await HotelTV.api.GetAmenityOrders(null);
                    } catch (_error) {
                        console.log(`Fail to call API::> ${_error}`);
                        return;
                    }

                    _elAmOLstRoot.children(`#title`).text(_trTbl.ui.amenity.title.orderdetails[_state.lang]);
                    _elAmOLstRoot.children(`#usage`).text(_trTbl.ui.amenity.usage.details[_state.lang]);

                    //Draw Amenity Order Items
                    try {
                        // Delete elements under amenity service item table
                        let _elAmOLstItemTblRec = _elAmOLstItems.children('.order_list').children('tbody');

                        // Delete elements under amenity service item table
                        if (_elAmOLstItemTblRec.children('tr').length) {
                            _elAmOLstItemTblRec.children('tr').remove();
                        }

                        for (let _idx = 1; _idx <= _RsOrder.orders.length; _idx++) {
                            let _Order = _RsOrder.orders[_idx];

                            var _eltr_ordering = document.createElement('tr');
                            _eltr_ordering.setAttribute("id", _Order.id);
                            _eltr_ordering.setAttribute("index", _idx); {
                                //룸서비스 아이탬 화면 드로잉
                                var _eldiv_ordering = document.createElement('div');
                                _eldiv_ordering.setAttribute("class", "ordering");

                                // Append Sub elements:: index
                                let _elDiv_index = document.createElement('div');
                                _elDiv_index.setAttribute("id", "index");
                                _elDiv_index.textContent = `[${__fxn_padZero(_idx,2)}]`;
                                _eldiv_ordering.appendChild(_elDiv_index);

                                // Append Sub elements:: date
                                let _elDiv_date = document.createElement('div');
                                _elDiv_date.setAttribute("id", "date");
                                _elDiv_date.textContent = `${_trTbl.ui.amenity.title.orderdate[_state.lang]}:${_Order.createdAt}`;
                                _eldiv_ordering.appendChild(_elDiv_date);

                                // Append Sub elements:: Order Id
                                let _elDiv_OrderId = document.createElement('div');
                                _elDiv_OrderId.setAttribute("id", "orderId");
                                _elDiv_OrderId.textContent = `${_trTbl.ui.amenity.title.ordernumber[_state.lang]}:${_Order.id}`;
                                _eldiv_ordering.appendChild(_elDiv_OrderId);

                                _eltr_ordering.appendChild(_eldiv_ordering);
                            }

                            // Append Ordered Item list
                            {
                                let _elDiv_OdItemsLst = document.createElement('div');
                                _elDiv_OdItemsLst.className = "OdItemLst";

                                // Append item list hdr
                                {
                                    var _elTbl_OdItemsHdr = document.createElement('table');
                                    _elTbl_OdItemsHdr.className = "tbl_header";

                                    let _elTBody_OdItmesHdr = document.createElement('tbody'); {
                                        _elTBody_OdItmesHdr.setAttribute("id", "hdr");

                                        var _elTr_OdItmesHdr = document.createElement('tr');
                                        var _elTh_OdItmesHdr_Type = document.createElement('th');
                                        _elTh_OdItmesHdr_Type.setAttribute("id", "type");
                                        _elTh_OdItmesHdr_Type.textContent = _trTbl.ui.amenity.title.item[_state.lang];
                                        _elTr_OdItmesHdr.appendChild(_elTh_OdItmesHdr_Type);

                                        var _elTh_OdItmesHdr_Quantity = document.createElement('th');
                                        _elTh_OdItmesHdr_Quantity.setAttribute("id", "quantity");
                                        _elTh_OdItmesHdr_Quantity.textContent = _trTbl.ui.amenity.title.quantity[_state.lang];
                                        _elTr_OdItmesHdr.appendChild(_elTh_OdItmesHdr_Quantity);

                                        var _elTh_OdItmesHdr_Amount = document.createElement('th');
                                        _elTh_OdItmesHdr_Amount.setAttribute("id", "amount");
                                        _elTh_OdItmesHdr_Amount.textContent = _trTbl.ui.amenity.title.amount[_state.lang];
                                        _elTr_OdItmesHdr.appendChild(_elTh_OdItmesHdr_Amount);

                                        var _elTh_OdItmesHdr_Subtotal1 = document.createElement('th');
                                        _elTh_OdItmesHdr_Subtotal1.setAttribute("id", "subtotal1");
                                        _elTh_OdItmesHdr_Subtotal1.textContent = `[ ${_trTbl.ui.amenity.title.sum[_state.lang]} `;
                                        _elTr_OdItmesHdr.appendChild(_elTh_OdItmesHdr_Subtotal1);

                                        var _elTh_OdItmesHdr_Subtotal2 = document.createElement('th');
                                        _elTh_OdItmesHdr_Subtotal2.setAttribute("id", "subtotal2");
                                        _elTh_OdItmesHdr_Subtotal2.textContent = `${_Order.amount[_state.lang].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}${_amenity.currency[_state.lang]}`;
                                        _elTr_OdItmesHdr.appendChild(_elTh_OdItmesHdr_Subtotal2);

                                        var _elTh_OdItmesHdr_Subtotal3 = document.createElement('th');
                                        _elTh_OdItmesHdr_Subtotal3.setAttribute("id", "subtotal3");
                                        _elTh_OdItmesHdr_Subtotal3.textContent = `${_trTbl.ui.amenity.title.quantity[_state.lang]} `;
                                        _elTr_OdItmesHdr.appendChild(_elTh_OdItmesHdr_Subtotal3);

                                        var _elTh_OdItmesHdr_Subtotal4 = document.createElement('th');
                                        _elTh_OdItmesHdr_Subtotal4.setAttribute("id", "subtotal4");
                                        _elTh_OdItmesHdr_Subtotal4.textContent = `## `;
                                        _elTr_OdItmesHdr.appendChild(_elTh_OdItmesHdr_Subtotal4);

                                        var _elTh_OdItmesHdr_Subtotal5 = document.createElement('th');
                                        _elTh_OdItmesHdr_Subtotal5.setAttribute("id", "subtotal5");
                                        _elTh_OdItmesHdr_Subtotal5.textContent = ` ]`;
                                        _elTr_OdItmesHdr.appendChild(_elTh_OdItmesHdr_Subtotal5);

                                        _elTBody_OdItmesHdr.appendChild(_elTr_OdItmesHdr);
                                    }
                                    _elTbl_OdItemsHdr.appendChild(_elTBody_OdItmesHdr);
                                }
                                _elDiv_OdItemsLst.appendChild(_elTbl_OdItemsHdr);


                                // Append item list record
                                {
                                    var _elTbl_OdItemsRec = document.createElement('table');
                                    _elTbl_OdItemsRec.className = "tbl_record";

                                    let _elTBody_OdItmesRec = document.createElement('tbody'); {
                                        _elTBody_OdItmesRec.setAttribute("id", "record");
                                        for (let _j = 1; _j <= _Order.items.length; _j++) {
                                            let _OdItem = _Order.items[_j];
                                            var _elTr_OdItmesRec = document.createElement('tr');
                                            var _elDiv_OdItmesRec = document.createElement('div');
                                            _elDiv_OdItmesRec.className = "oditem";
                                            var _elDiv_OdItmesRecName = document.createElement('div');
                                            _elDiv_OdItmesRecName.setAttribute("id", "name");
                                            _elDiv_OdItmesRecName.textContent =`[${_j}] ` + __fxn_getAmItemValue(_amenity.children, "title",
                                                _OdItem.itemId)[_state.lang];
                                            _elDiv_OdItmesRec.appendChild(_elDiv_OdItmesRecName);

                                            var _elDiv_OdItmesRecQuantity = document.createElement('div');
                                            _elDiv_OdItmesRecQuantity.setAttribute("id", "quantity");
                                            _elDiv_OdItmesRecQuantity.textContent = _OdItem.quantity;
                                            _elDiv_OdItmesRec.appendChild(_elDiv_OdItmesRecQuantity);

                                            _total_quantity += _OdItem.quantity;

                                            var _elDiv_OdItmesRecAmount = document.createElement('div');
                                            _elDiv_OdItmesRecAmount.setAttribute("id", "amount");
                                            _elDiv_OdItmesRecAmount.textContent = _OdItem.amount[_state.lang].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + _amenity.currency[_state.lang];
                                            _elDiv_OdItmesRec.appendChild(_elDiv_OdItmesRecAmount);
                                            _elTr_OdItmesRec.appendChild(_elDiv_OdItmesRec);
                                            _elTBody_OdItmesRec.appendChild(_elTr_OdItmesRec);
                                        }
                                    }
                                    _elTbl_OdItemsRec.appendChild(_elTBody_OdItmesRec);
                                }
                                _elDiv_OdItemsLst.appendChild(_elTbl_OdItemsRec);
                                _eltr_ordering.appendChild(_elDiv_OdItemsLst);
                            }

                            _elAmOLstItemTblRec.append(_eltr_ordering);
                        }

                        // Draw Total Amount and Quantity
                        _elAmOLstSummary.children(`#title`).text(_trTbl.ui.amenity.title.sum[_state.lang]);
                        _elAmOLstSummary.children(`#quantity`).text(_total_quantity);
                        _elAmOLstSummary.children(`#amount`).text(_RsOrder.amount[_state.lang].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + _amenity.currency[_state.lang]);

                        // Activate first order lists
                        _elAmOLstItemTblRec.children('tr').first().addClass('active');
                    } catch (_error) {
                        console.log(`Fail to call API::> ${_error}`);
                        return;
                    }


                    if (_elAmOLstRoot.css('display') == "none") {
                        _elAmOLstRoot.fadeIn(400);
                    }
                }
                break;
            case "up":
                {
                    let _elAmOLstItemTblRec = _elAmOLstItems.children('.order_list').children('tbody');
                    let selectedTblItem = _elAmOLstItemTblRec.children('tr.active').prev(".order_list tr");
                    if (selectedTblItem.length) {
                        _elAmOLstItemTblRec.children('tr.active').removeClass("active");
                        selectedTblItem.addClass('active');
                        _state.hotkey.mm[_amenity.button].status.orderdetails.idx = selectedTblItem.prop('rowIndex');

                        // 스크롤이 필요한 경우 스크롤링 하기
                        let _scrollTopVal = _state.hotkey.mm[_amenity.button].status.orderdetails.scroll_TOfset;
                        _scrollTopVal -= selectedTblItem.prop('scrollHeight');
                        _elAmOLstItems.animate({ scrollTop: _scrollTopVal }, 200);
                        _state.hotkey.mm[_amenity.button].status.orderdetails.scroll_TOfset = _scrollTopVal;
                    }
                }
                break;
            case "down":
                {
                    let _elAmOLstItemTblRec = _elAmOLstItems.children('.order_list').children('tbody');
                    let selectedTblItem = _elAmOLstItemTblRec.children('tr.active').next(".order_list tr");
                    if (selectedTblItem.length) {
                        _elAmOLstItemTblRec.children('tr.active').removeClass("active");
                        selectedTblItem.addClass('active');
                        _state.hotkey.mm[_amenity.button].status.orderdetails.idx = selectedTblItem.prop('rowIndex');

                        // 스크롤이 필요한 경우 스크롤링 하기
                        let _scrollTopVal = _state.hotkey.mm[_amenity.button].status.orderdetails.scroll_TOfset;
                        _scrollTopVal += selectedTblItem.prop('scrollHeight');
                        _elAmOLstItems.animate({ scrollTop: _scrollTopVal }, 200);
                        _state.hotkey.mm[_amenity.button].status.orderdetails.scroll_TOfset = _scrollTopVal;
                    }
                }
                break;
            case "back":
                break;
        }
    }

    /**
     * HotelTV UI[AppFull] Wrapper Function::> update amenity service cart list for ordering
     * @param {boolean} _show show/hide
     * @param {string} _keyEvt key event
     */
    function __uifxn_AppFull_DrawAmenityCartList(_show, _keyEvt) {
        let _state = HotelTV.state;
        let _trTbl = HotelTV.translation;
        let _amenity = HotelTV.opening.amenity;
        let _rsCart = HotelTV.carts.amenity;

        let _elAmPupRoot = $('.popup .amenity');
        let _elAmCLstRoot = _elAmPupRoot.children('.cart-list');
        let _elAmCLstSummary = _elAmCLstRoot.children('#summary');
        let _elAmCLstButtons = _elAmCLstRoot.children('#buttons');

        const __fxn_getAmItemValue = function(_object, _key, _itemID) {
            for (__j = 1; __j <= _object.length; __j++) {
                if (_object[__j].id == _itemID) {
                    return _object[__j][_key];
                }
            }
        }

        if (_show == false) {
            if (_elAmCLstRoot.css('display') != "none") {
                _elAmCLstButtons.find('#confirm').removeClass("active");
                _elAmCLstButtons.find('#cancel').removeClass("active");
                _elAmCLstRoot.hide();
            }
            return;
        }


        if (!_rsCart || !_amenity) {
            return;
        }

        switch (_keyEvt) {
            case "build":
                let _total_quantity = 0;

                _elAmCLstRoot.children('#title').text(_trTbl.ui.amenity.title.cartslist[_state.lang]);
                _elAmCLstRoot.children('#usage').text(_trTbl.ui.amenity.usage.orderConfirm[_state.lang]);

                //Draw Amenity Cart Items
                try {
                    let _elAmCLstItems = _elAmCLstRoot.children(`#items`);
                    let _elAmCLstItemTblHdr = _elAmCLstItems.children('.tbl_header').children('tbody');
                    let _elAmCLstItemTblRec = _elAmCLstItems.children('.tbl_record').children('tbody');
                    // Drawing Item Table Headers
                    _elAmCLstItemTblHdr.children('tr').children('th#type').text(`${_trTbl.ui.amenity.title.item[_state.lang]}`);
                    _elAmCLstItemTblHdr.children('tr').children('th#quantity').text(_trTbl.ui.amenity.title.quantity[_state.lang]);
                    _elAmCLstItemTblHdr.children('tr').children('th#amount').text(_trTbl.ui.amenity.title.amount[_state.lang]);

                    // Delete elements under amenity service item table
                    if (_elAmCLstItemTblRec.children('tr').length) {
                        _elAmCLstItemTblRec.children('tr').remove();
                    }

                    for (let _idx = 1; _idx <= _rsCart.items.length; _idx++) {
                        let _rsItem = _rsCart.items[_idx];
                        if (_rsItem.id) {
                            var _eltr_item = document.createElement('tr');
                            _eltr_item.setAttribute("id", _rsCart.items[_idx].id);
                            _eltr_item.setAttribute("index", _idx); {
                                //어메니티 아이탬 화면 드로잉
                                var _eldiv_item_ctz = document.createElement('div');
                                _eldiv_item_ctz.setAttribute("class", "products");

                                // Append Sub elements::title
                                let _elDiv_title = document.createElement('div');
                                _elDiv_title.setAttribute("id", "title");
                                _elDiv_title.textContent = __fxn_getAmItemValue(_amenity.children, "title", _rsItem.itemId)[_state.lang];
                                _eldiv_item_ctz.appendChild(_elDiv_title);

                                // Append Sub elements::quantity
                                let _elDiv_quantity = document.createElement('div');
                                _elDiv_quantity.setAttribute("id", "quantity");
                                _elDiv_quantity.textContent = _rsItem.quantity;
                                _eldiv_item_ctz.appendChild(_elDiv_quantity);
                                _total_quantity += _rsItem.quantity;

                                // Append Sub elements::amount
                                let _elDiv_price = document.createElement('div');
                                _elDiv_price.setAttribute("id", "price");
                                _elDiv_price.textContent = _rsItem.price[_state.lang].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + _amenity.currency[_state.lang];
                                _eldiv_item_ctz.appendChild(_elDiv_price);
                            }
                            _eltr_item.appendChild(_eldiv_item_ctz);
                            _elAmCLstItemTblRec.append(_eltr_item);
                        }
                    }
                    // 첫번째 테이블 아애템에 active 클래스 추가 (플래그용으로 사용)
                    // _elAmCLstItemTblRec.children('tr').first().addClass('active');
                } catch (_error) {
                    console.log(_error.message);
                }

                // Drawing Summary
                _elAmCLstSummary.children('#title').text(_trTbl.ui.amenity.title.sum[_state.lang]);
                _elAmCLstSummary.children('#quantity').text(_total_quantity);
                _elAmCLstSummary.children('#amount').text(_rsCart.amount[_state.lang].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + _amenity.currency[_state.lang]);

                // Drawing Notice
                _elAmCLstRoot.children('#notice').text(_trTbl.ui.amenity.usage.orderNoticeFinal[_state.lang]);

                // Drawing Buttons
                _elAmCLstButtons.find('#confirm').text(_trTbl.ui.amenity.title.confirm[_state.lang]);
                _elAmCLstButtons.find('#cancel').text(_trTbl.ui.amenity.title.back[_state.lang]);

                // Focus button
                _elAmCLstButtons.find('#confirm').addClass("active");

                if (_elAmCLstRoot.css('display') == "none") {
                    _elAmCLstRoot.fadeIn(300);
                }
                break;
            case "left":
                if (_state.hotkey.mm[_amenity.button].status.cartlist.idx == "confirm") {
                    _elAmCLstButtons.find('#confirm').removeClass("active");
                    _state.hotkey.mm[_amenity.button].status.cartlist.idx = "cancel";
                    _elAmCLstButtons.find('#cancel').addClass("active");
                } else if (_state.hotkey.mm[_amenity.button].status.cartlist.idx == "cancel") {
                    _elAmCLstButtons.find('#cancel').removeClass("active");
                    _state.hotkey.mm[_amenity.button].status.cartlist.idx = "confirm";
                    _elAmCLstButtons.find('#confirm').addClass("active");
                }
                break;
            case "right":
                if (_state.hotkey.mm[_amenity.button].status.cartlist.idx == "confirm") {
                    _elAmCLstButtons.find('#confirm').removeClass("active");
                    _state.hotkey.mm[_amenity.button].status.cartlist.idx = "cancel";
                    _elAmCLstButtons.find('#cancel').addClass("active");
                } else if (_state.hotkey.mm[_amenity.button].status.cartlist.idx == "cancel") {
                    _elAmCLstButtons.find('#cancel').removeClass("active");
                    _state.hotkey.mm[_amenity.button].status.cartlist.idx = "confirm";
                    _elAmCLstButtons.find('#confirm').addClass("active");
                }
                break;
            case "back":
                break;
        }
    }

    /**
     * HotelTV UI[AppFull] Wrapper Function::> update amenity service item description
     * @param {boolean} _show show/hide
     */
    function __uifxn_AppFull_DrawAmenityItemDescription(_show) {
        let _state = HotelTV.state;
        let _amenity = HotelTV.opening.amenity;

        let _elAmPupRoot = $('.popup .amenity');
        let _elAmMnRoot = _elAmPupRoot.children('.menu');
        let _elAmMnItmTbl = _elAmMnRoot.children('#items').find('.tbl_record').children('#record');
        let _elAmMnDesc = _elAmPupRoot.children('.description');

        const __fxn_getAmItemValue = function(_object, _key, _itemID) {
            for (__j = 1; __j <= _object.length; __j++) {
                if (_object[__j].id == _itemID) {
                    return _object[__j][_key];
                }
            }
        }

        if (_show == false) {
            if (_elAmMnDesc.css('display') != "none") {
                _elAmMnDesc.hide();
            }
            return;
        }

        //선택된 테이블 레코드의 ID속성값 읽어오기
        let selectedTblItemID = _elAmMnItmTbl.children('tr.active').prop('id');

        //Redraw Description
        _elAmMnDesc.children('#title').text(__fxn_getAmItemValue(_amenity.children, "title", selectedTblItemID)[_state.lang]);
        _elAmMnDesc.children('#comment').text(__fxn_getAmItemValue(_amenity.children, "description", selectedTblItemID)[_state.lang]);
        _elAmMnDesc.children('#thumb').css('background-image', 'url(' + __fxn_getAmItemValue(_amenity.children, "thumbnail", selectedTblItemID).files[_state.lang].download + ')');

        if (_elAmMnDesc.css('display') == "none") {
            _elAmMnDesc.show();
        }

        HotelTV.api.ReportEvent([{'power': true, 'location':{'conId':__fxn_getAmItemValue(_amenity.children, "id", selectedTblItemID)}}])
    }

    /**
     * HotelTV UI[AppFull] Wrapper Function::> update amenity service item
     * @param {boolean} _isUpdateDescrption show/hide item description
     */
    async function __uifxn_AppFull_DrawAmenityItem(_isUpdateDescrption) {
        let _state = HotelTV.state;
        let _amenity = HotelTV.opening.amenity;
        let _carts = null;
        const __fxn_cartItemExist = function(_object, _itemID) {
            for (__j = 1; __j <= _object.length; __j++) {
                if (_object[__j].itemId == _itemID) {
                    return true;
                }
            }
            return false;
        }

        const __fxn_cartItemValue = function(_object, _key, _itemID) {
            for (__j = 1; __j <= _object.length; __j++) {
                if (_object[__j].itemId == _itemID) {
                    return _object[__j][_key];
                }
            }
        }

        try {
            let _total_quantity = 0;
            let _elAmMnItemTblRoot = $('.popup .amenity>.menu #items>table.tbl_record');
            HotelTV.carts.amenity = _carts = await HotelTV.api.GetAmenityCarts();
            for (let _idx = 1; _idx <= _amenity.children.length; _idx++) {
                let _rsItem = _amenity.children[_idx];
                let _elAmItemRecRoot = _elAmMnItemTblRoot.find(`tr#${_rsItem.id}`).children('div.products');
                // Update Unit price
                _elAmItemRecRoot.find('#price').text(_rsItem.price[_state.lang].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + _amenity.currency[_state.lang]);

                // Update quantity
                if (_carts.items.length && __fxn_cartItemExist(_carts.items, _rsItem.id) == true) {
                    let _cart_item_quantity = __fxn_cartItemValue(_carts.items, "quantity", _rsItem.id);
                    _total_quantity += _cart_item_quantity;
                    // Cart Quantity
                    _elAmItemRecRoot.find('#quantity').text(_cart_item_quantity);
                }
            }

            //Update Total amount as well as quantity
            let _elAmMnSummary = $('.popup .amenity>.menu #summary');
            _elAmMnSummary.children('#value').text(_carts.amount[_state.lang].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + _amenity.currency[_state.lang]);
            _elAmMnSummary.children('#quantity').text(_total_quantity);

            //Refresh menu description
            if (_isUpdateDescrption == true) {
                __uifxn_AppFull_DrawAmenityItemDescription(true);
            }
        } catch (_error) {
            console.log(_error.message);
        }
    }

    /**
     * HotelTV UI[AppFull] Wrapper Function::> amenity service handling function
     * @param {string} _evtKey event
     * @param {boolean} _isFlushCart flag for flush cart
     * @param {callback} _cbFxn post-processing callback
     */
    async function __uifxn_AppFull_HandleAmenity(_evtKey, _isFlushCart, _isDoOrder, _cbFxn) {
        let _state = HotelTV.state;
        let _opening = HotelTV.opening;
        let _amenity = null;
        let _carts = HotelTV.carts.amenity;
        let _scrollTopVal = 0;
        let _elAmPupRoot = $('.popup .amenity');
        let _elAmMnRoot = _elAmPupRoot.children('.menu');
        let _elAmMnItmTbl = _elAmMnRoot.children('#items').find('.tbl_record').children('#record');
        let _elAmMnBtn = _elAmMnRoot.children('#buttons');
        let _elAmOdDetails = _elAmPupRoot.children('.order-details');

        const __fxn_cartEmpty = function(_object) {
            for (__j = 1; __j <= _object.length; __j++) {
                if (_object[__j].id) {
                    return false;
                }
            }
            return true;
        }

        const __fxn_cartItemValue = function(_object, _key, _itemID) {
            for (__j = 1; __j <= _object.length; __j++) {
                if (_object[__j].id == _itemID) {
                    return _object[__j][_key];
                }
            }
        }

        const __fxn_close_AmPopup = function(_fxn_post_process) {
            // 아이템 디스크립션(메뉴 오른쪽) 하이드
            __uifxn_AppFull_DrawAmenityItemDescription(false);

            _elAmPupRoot.animate({ top: 96, left: -560 }, 500, () => {
                // 아이탬 테이블 스크롤 맨 위로 이동
                _elAmMnItmTbl.animate({ scrollTop: 0 }, 200);

                // CART LIST 제거 및 Off
                __uifxn_AppFull_DrawAmenityCartList(false, "back");

                // 매뉴 아이탬 및 버튼에서 active클래스 초기화
                _elAmMnItmTbl.children('tr.active').removeClass("active");
                _elAmMnItmTbl.children('tr').first().addClass('active');
                _elAmMnBtn.children('div').removeClass("active");

                // state내의 Amenity 관련 HOTKEY정보를 초기화
                _state.hotkey.mm[_amenity.button] = {
                    'type': "amenity",
                    'id': _amenity.id,
                    "status": {
                        "focus": "menu",
                        "menu": {
                            "idx": 0,
                            "scroll_TOfset": 0
                        },
                        "button": {
                            "idx": null
                        },
                        "cartlist": {
                            "idx": null,
                            "scroll_TOfset": 0
                        },
                        "orderdetails": {
                            "idx": null,
                            "scroll_TOfset": 0
                        }
                    }
                };

                // Do post-processing
                if (_fxn_post_process) {
                    _fxn_post_process();
                }
            });
        }



        if (!_opening.amenity) {
            return;
        }
        _amenity = _opening.amenity;

        switch (_evtKey) {
            case "up":
                switch (_state.hotkey.mm[_amenity.button].status.focus) {
                    case "menu":
                        // 선택한 아이탬 알아내기
                        let selectedTblItem = _elAmMnItmTbl.children('tr.active').prev(".tbl_record tr");
                        if (selectedTblItem.length) {
                            _elAmMnItmTbl.children('tr.active').removeClass("active");
                            selectedTblItem.addClass('active');
                            _state.hotkey.mm[_amenity.button].status.menu.idx = selectedTblItem.prop('rowIndex');

                            // 스크롤이 필요한 경우 스크롤링 하기
                            _scrollTopVal = selectedTblItem.prop('scrollHeight') * _state.hotkey.mm[_amenity.button].status.menu.idx;
                            _state.hotkey.mm[_amenity.button].status.menu.scroll_TOfset = _scrollTopVal;
                            _elAmMnItmTbl.animate({ scrollTop: _scrollTopVal }, 200);

                            //Update Item Description Frame
                            __uifxn_AppFull_DrawAmenityItemDescription(true);
                        }
                        break;
                    case "button":
                        _elAmMnBtn.children('div').removeClass("active");
                        if (_state.hotkey.mm[_amenity.button].status.button.idx == "cancel") {
                            _state.hotkey.mm[_amenity.button].status.button.idx = "details";
                            _elAmMnBtn.children('div#details').addClass("active");
                        } else if (_state.hotkey.mm[_amenity.button].status.button.idx == "details") {
                            if (__fxn_cartEmpty(_carts.items) == false) {
                                _state.hotkey.mm[_amenity.button].status.button.idx = "order";
                                _elAmMnBtn.children('div#order').addClass("active");
                            } else {
                                _state.hotkey.mm[_amenity.button].status.button.idx = null;
                                _state.hotkey.mm[_amenity.button].status.focus = "menu";
                                _elAmMnItmTbl.children('tr').eq(_state.hotkey.mm[_amenity.button].status.menu.idx).addClass('active');
                                __uifxn_AppFull_DrawAmenityItemDescription(true);
                            }
                        } else {
                            _state.hotkey.mm[_amenity.button].status.button.idx = null;
                            _state.hotkey.mm[_amenity.button].status.focus = "menu";
                            _elAmMnItmTbl.children('tr').eq(_state.hotkey.mm[_amenity.button].status.menu.idx).addClass('active');
                            // Shows up Menu Item description
                            __uifxn_AppFull_DrawAmenityItemDescription(true);
                        }
                        break;
                    case "orderdetails":
                        //Navigate order lists
                        __uifxn_AppFull_DrawAmenityOrderList(true, "up");
                        break;
                }
                break;
            case "down":
                switch (_state.hotkey.mm[_amenity.button].status.focus) {
                    case "menu":
                        // 선택한 아이탬 알아내기
                        let selectedTblItem = _elAmMnItmTbl.children('tr.active').next(".tbl_record tr");
                        if (selectedTblItem.length) {
                            _elAmMnItmTbl.children('tr.active').removeClass("active");
                            selectedTblItem.addClass('active');
                            _state.hotkey.mm[_amenity.button].status.menu.idx = selectedTblItem.prop('rowIndex');

                            // 스크롤이 필요한 경우 스크롤링 하기
                            _scrollTopVal = selectedTblItem.prop('scrollHeight') * _state.hotkey.mm[_amenity.button].status.menu.idx;
                            _state.hotkey.mm[_amenity.button].status.menu.scroll_TOfset = _scrollTopVal;
                            _elAmMnItmTbl.animate({ scrollTop: _scrollTopVal }, 200);

                            //Update Item Description Frame
                            __uifxn_AppFull_DrawAmenityItemDescription(true);
                        } else {
                            _elAmMnItmTbl.children('tr.active').removeClass("active");
                            _state.hotkey.mm[_amenity.button].status.focus = "button";

                            //Hide Item Description Frame
                            __uifxn_AppFull_DrawAmenityItemDescription(false);
                            if (__fxn_cartEmpty(_carts.items) == false) {
                                _state.hotkey.mm[_amenity.button].status.button.idx = "order";
                                _elAmMnBtn.children('div#order').addClass("active");
                            } else {
                                _state.hotkey.mm[_amenity.button].status.button.idx = "details";
                                _elAmMnBtn.children('div#details').addClass("active");
                            }
                        }
                        break;
                    case "button":
                        if (_state.hotkey.mm[_amenity.button].status.button.idx == "order") {
                            _elAmMnBtn.children('div').removeClass("active");
                            _state.hotkey.mm[_amenity.button].status.button.idx = "details";
                            _elAmMnBtn.children('div#details').addClass("active");
                        } else if (_state.hotkey.mm[_amenity.button].status.button.idx == "details") {
                            _elAmMnBtn.children('div').removeClass("active");
                            _state.hotkey.mm[_amenity.button].status.button.idx = "cancel";
                            _elAmMnBtn.children('div#cancel').addClass("active");
                        }
                        break;
                    case "orderdetails":
                        //Navigate order lists
                        __uifxn_AppFull_DrawAmenityOrderList(true, "down");
                        break;
                }
                break;
            case "right":
                if (_state.hotkey.mm[_amenity.button].status.focus == "menu") {
                    let selectedTblItem = _elAmMnItmTbl.children('tr.active');
                    let _sel_itemID = selectedTblItem.attr('id');
                    try {
                        let _result = await HotelTV.api.PutAmenityCarts(_sel_itemID, 1);
                        if (_result) {
                            __uifxn_AppFull_DrawAmenityItem(false);
                        }
                    } catch (_error) {
                        console.log(`Fail to call API::> ${_error}`);
                    }
                } else if (_state.hotkey.mm[_amenity.button].status.focus == "cartlist") {
                    __uifxn_AppFull_DrawAmenityCartList(true, "left");
                }
                break;
            case "left":
                if (_state.hotkey.mm[_amenity.button].status.focus == "menu") {
                    let selectedTblItem = _elAmMnItmTbl.children('tr.active');
                    let _sel_itemID = selectedTblItem.attr('id');
                    try {
                        let _result = await HotelTV.api.PutAmenityCarts(_sel_itemID, -1);
                        if (_result) {
                            __uifxn_AppFull_DrawAmenityItem(false);
                        }
                    } catch (_error) {
                        console.log(`Fail to call API::> ${_error}`);
                    }
                } else if (_state.hotkey.mm[_amenity.button].status.focus == "cartlist") {
                    __uifxn_AppFull_DrawAmenityCartList(true, "right");
                }
                break;
            case "enter":
                if (_state.hotkey.mm[_amenity.button].status.focus == "button") {
                    switch (_state.hotkey.mm[_opening.amenity.button].status.button.idx) {
                        case "cancel":
                            __fxn_close_AmPopup(_cbFxn);
                            break;
                        case "order":
                            //Remove active class from menu buttons
                            _elAmMnBtn.children('div').removeClass("active");

                            // Build Cart List
                            _state.hotkey.mm[_amenity.button].status.focus = "cartlist";
                            __uifxn_AppFull_DrawAmenityCartList(true, "build");
                            _state.hotkey.mm[_opening.amenity.button].status.cartlist.idx = "confirm";
                            break;
                        case "details":
                            // Hide Menu
                            _elAmMnRoot.hide();

                            // Build Order details
                            _state.hotkey.mm[_amenity.button].status.focus = "orderdetails";
                            __uifxn_AppFull_DrawAmenityOrderList(true, "build");
                            break;
                    }
                } else if (_state.hotkey.mm[_amenity.button].status.focus == "cartlist") {
                    switch (_state.hotkey.mm[_opening.amenity.button].status.cartlist.idx) {
                        case "confirm":
                            _state.hotkey.mm[_amenity.button].status.focus = "orderalert";
                            try {
                                let _result = await HotelTV.api.PutAmenityOrders();
                                if (_result) {
                                    console.log(`Success to order CARTID::>`);
                                    __uifxn_AppFull_DrawAmenityItem(true);

                                    HotelTV.orders.amenity = await HotelTV.api.GetAmenityOrders(null);
                                } else {
                                    console.log(`Fail to order CARTID::>`);
                                }
                            } catch (_error) {
                                console.log(`Fail to call API::> ${_error}`);
                            }

                            //Show Order confirm alert
                            __uifxn_AppFull_DrawAmenityOrderAlert(true);
                            break;
                        case "cancel":
                            //Hide Cart List
                            __uifxn_AppFull_DrawAmenityCartList(false, "back");
                            //Return to button
                            _state.hotkey.mm[_amenity.button].status.focus = "button";
                            _elAmMnBtn.children('div#order').addClass("active");
                            break;
                    }
                } else if (_state.hotkey.mm[_amenity.button].status.focus == "orderalert") {
                    //Hide Cart List
                    __uifxn_AppFull_DrawAmenityCartList(false, "back");
                    //Hide Order confirm alert
                    __uifxn_AppFull_DrawAmenityOrderAlert(false);
                    //Return to button
                    _state.hotkey.mm[_amenity.button].status.focus = "button";
                    _elAmMnBtn.children('div#order').addClass("active");
                }
                break;
            case "back":
                if (_state.hotkey.mm[_amenity.button].status.focus == "orderalert") {
                    //Hide Cart List
                    __uifxn_AppFull_DrawAmenityCartList(false, "back");
                    //Hide Order confirm alert
                    __uifxn_AppFull_DrawAmenityOrderAlert(false);
                    //Return to button
                    _state.hotkey.mm[_amenity.button].status.focus = "button";
                    _elAmMnBtn.children('div#order').addClass("active");
                } else if (_state.hotkey.mm[_amenity.button].status.focus == "orderdetails") {
                    //Hide Order Details
                    __uifxn_AppFull_DrawAmenityOrderList(false, null);

                    //Return to button
                    _state.hotkey.mm[_amenity.button].status.focus = "button";

                    // Hide Menu
                    _elAmMnRoot.fadeIn(400);
                } else {
                    __fxn_close_AmPopup(_cbFxn);
                }
                break;
        }
    }


    /**
     * HotelTV UI[AppFull] Wrapper Function::> build amenity service
     * @param {boolean} e event
     */
    function __uifxn_AppFull_BuildAmenity() {
        let _state = HotelTV.state;
        let _trTbl = HotelTV.translation;
        let _opening = HotelTV.opening;
        let _order = HotelTV.orders.amenity;
        let _amenity = null;
        let _elAmPupRoot = $('.popup .amenity');
        let _elAmMnRoot = _elAmPupRoot.children('.menu');
        let _elAmMnBtn = _elAmMnRoot.children('#buttons');
        let _elAmMnSummary = _elAmMnRoot.children('#summary');

        if (!_opening.amenity) {
            return;
        }
        _amenity = _opening.amenity;

        _elAmMnRoot.children('#title').text(_amenity.title[_state.lang]);
        _elAmMnRoot.children('#usage').text(_trTbl.ui.amenity.usage.order[_state.lang]);


        //Draw Amenity Cart Items
        try {
            let _elAmMnItems = _elAmMnRoot.children(`#items`);
            let _elAmMnItemTblHdr = _elAmMnItems.children('.tbl_header').children('tbody');
            let _elAmMnItemTblRec = _elAmMnItems.children('.tbl_record').children('tbody');
            // Drawing Item Table Headers
            _elAmMnItemTblHdr.children('tr').children('th#type').text(`${_trTbl.ui.amenity.title.item[_state.lang]} [${_amenity.children.length}]`);
            _elAmMnItemTblHdr.children('tr').children('th#quantity').text(_trTbl.ui.amenity.title.quantity[_state.lang]);

            // Delete elements under amenity service item table
            if (_elAmMnItemTblRec.children('tr').length) {
                _elAmMnItemTblRec.children('tr').remove();
            }

            for (let _idx = 1; _idx <= _amenity.children.length; _idx++) {
                let _rsItem = _amenity.children[_idx];

                var _eltr_item = document.createElement('tr');
                _eltr_item.setAttribute("id", _amenity.children[_idx].id);
                _eltr_item.setAttribute("index", _idx); {
                    //어메니티 아이탬 화면 드로잉
                    var _eldiv_item_ctz = document.createElement('div');
                    _eldiv_item_ctz.setAttribute("class", "products");

                    // Append Sub elements::index
                    let _elDiv_index = document.createElement('div');
                    _elDiv_index.setAttribute("id", "index");
                    _elDiv_index.textContent = `[${_idx}]`;
                    _eldiv_item_ctz.appendChild(_elDiv_index);

                    // Append Sub elements::title
                    let _elDiv_title = document.createElement('div');
                    _elDiv_title.setAttribute("id", "title");
                    _elDiv_title.textContent = _rsItem.title[_state.lang];
                    _eldiv_item_ctz.appendChild(_elDiv_title);

                    // Append Sub elements::price
                    let _elDiv_price = document.createElement('div');
                    _elDiv_price.setAttribute("id", "price");
                    _elDiv_price.textContent = _rsItem.price[_state.lang].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                    _eldiv_item_ctz.appendChild(_elDiv_price);

                    // Append Sub elements::quantity
                    let _elDiv_quantity = document.createElement('div');
                    _elDiv_quantity.setAttribute("id", "quantity");
                    _elDiv_quantity.textContent = "0";
                    _eldiv_item_ctz.appendChild(_elDiv_quantity);

                }
                _eltr_item.appendChild(_eldiv_item_ctz);
                _elAmMnItemTblRec.append(_eltr_item);
            }
            // 첫번째 테이블 아애템에 active 클래스 추가 (플래그용으로 사용)
            _elAmMnItemTblRec.children('tr').first().addClass('active');
        } catch (_error) {
            console.log(_error.message);
        }

        // Drawing Amount(Cart)
        _elAmMnSummary.children('#title').text(_trTbl.ui.amenity.title.sum[_state.lang]);
        // _elAmMnSummary.children('#value').text("0");
        // _elAmMnSummary.children('#quantity').text("0");

        //
        __uifxn_AppFull_DrawAmenityCartList(false, null);
        __uifxn_AppFull_DrawAmenityOrderList(false, null);
        __uifxn_AppFull_DrawAmenityOrderAlert(false);

        // Draw Buttons
        _elAmMnBtn.children('#order').text(_trTbl.ui.amenity.title.order[_state.lang]);
        _elAmMnBtn.children('#details').text(_trTbl.ui.amenity.title.orderdetails[_state.lang]);
        _elAmMnBtn.children('#cancel').text(_trTbl.ui.amenity.title.cancel[_state.lang]);


        // HOTKEY정보를 state에 기록
        if (!(_amenity.button in _state.hotkey.mm)) {
            _state.hotkey.mm[_amenity.button] = {
                'type': "amenity",
                'id': _amenity.id,
                "status": {
                    "focus": "menu",
                    "menu": {
                        "idx": 0,
                        "scroll_TOfset": 0
                    },
                    "button": {
                        "idx": null
                    },
                    "cartlist": {
                        "idx": null,
                        "scroll_TOfset": 0
                    },
                    "orderdetails": {
                        "idx": null,
                        "scroll_TOfset": 0
                    }
                }
            };
        }
        return;
    }


    /**
     * HotelTV UI[AppFull] Wrapper Function::> build amenity
     * @param {boolean} _show show/hide
     */
    function __uifxn_AppFull_DrawRoomserviceOrderAlert(_show) {
        let _state = HotelTV.state;
        let _trTbl = HotelTV.translation;
        let _elRsPupRoot = $('.popup .roomservice');
        let _elRsOderAlertRoot = _elRsPupRoot.children('.alert');
        let _elRsOderAlertOrderComplete = _elRsOderAlertRoot.children('#order-complete');

        if (_show == false) {
            if (_elRsOderAlertRoot.css('display') != "none") {
                _elRsOderAlertOrderComplete.hide(0, function() {
                    _elRsOderAlertRoot.hide();
                });
            }
            return;
        }

        // Draw Titile and message
        _elRsOderAlertOrderComplete.children("#title").text(_trTbl.ui.roomservice.title.ordercomplete[_state.lang]);
        _elRsOderAlertOrderComplete.children("#message").text(_trTbl.ui.roomservice.usage.orderAlertComplete[_state.lang]);

        if (_elRsOderAlertOrderComplete.css('display') == "none") {
            _elRsOderAlertOrderComplete.show();
        }

        if (_elRsOderAlertRoot.css('display') == "none") {
            _elRsOderAlertRoot.fadeIn(300);
        }
    }

    /**
     * HotelTV UI[AppFull] Wrapper Function::> update room service order list
     * @param {boolean} _show show/hide
     * @param {string} _keyEvt key event
     */
    async function __uifxn_AppFull_DrawRoomservceOrderList(_show, _keyEvt) {
        let _state = HotelTV.state;
        let _trTbl = HotelTV.translation;
        let _RsOrder = null;
        let _roomservice = HotelTV.opening.roomService;

        let _elRsPupRoot = $('.popup .roomservice');
        let _elRsOLstRoot = _elRsPupRoot.children('.order-details');
        let _elRsOLstItems = _elRsOLstRoot.children(`#orders`);
        let _elRsOLstSummary = _elRsOLstRoot.children('#summary');

        const __fxn_getRsItemValue = function(_object, _key, _itemID) {
            for (__j = 1; __j <= _object.length; __j++) {
                if (_object[__j].id == _itemID) {
                    return _object[__j][_key];
                }
            }
            return '';
        }

        const __fxn_padZero = function(_num, _size) {
            _num = _num.toString();
            while (_num.length < _size) _num = "0" + _num;
            return _num;
        }




        if (_show == false) {
            if (_elRsOLstRoot.css('display') != "none") {
                _elRsOLstRoot.hide();
            }
            return;
        }


        switch (_keyEvt) {
            case "build":
                {
                    let _total_quantity = 0;

                    try {
                        HotelTV.orders.roomservice = _RsOrder = await HotelTV.api.GetRoomserviceOrders(null);
                    } catch (_error) {
                        console.log(`Fail to call API::> ${_error}`);
                        return;
                    }

                    _elRsOLstRoot.children(`#title`).text(_trTbl.ui.roomservice.title.orderdetails[_state.lang]);
                    _elRsOLstRoot.children(`#usage`).text(_trTbl.ui.roomservice.usage.details[_state.lang]);

                    //Draw Room service Order Items
                    try {
                        // Delete elements under room service item table
                        let _elRsOLstItemTblRec = _elRsOLstItems.children('.order_list').children('tbody');

                        // Delete elements under room service item table
                        if (_elRsOLstItemTblRec.children('tr').length) {
                            _elRsOLstItemTblRec.children('tr').remove();
                        }

                        for (let _idx = 1; _idx <= _RsOrder.orders.length; _idx++) {
                            let _Order = _RsOrder.orders[_idx];

                            var _eltr_ordering = document.createElement('tr');
                            _eltr_ordering.setAttribute("id", _Order.id);
                            _eltr_ordering.setAttribute("index", _idx); {
                                //룸서비스 아이탬 화면 드로잉
                                var _eldiv_ordering = document.createElement('div');
                                _eldiv_ordering.setAttribute("class", "ordering");

                                // Append Sub elements:: index
                                let _elDiv_index = document.createElement('div');
                                _elDiv_index.setAttribute("id", "index");
                                _elDiv_index.textContent = `[${__fxn_padZero(_idx,2)}]`;
                                _eldiv_ordering.appendChild(_elDiv_index);

                                // Append Sub elements:: date
                                let _elDiv_date = document.createElement('div');
                                _elDiv_date.setAttribute("id", "date");
                                _elDiv_date.textContent = `${_trTbl.ui.roomservice.title.orderdate[_state.lang]}:${_Order.createdAt}`;
                                _eldiv_ordering.appendChild(_elDiv_date);

                                // Append Sub elements:: Order Id
                                let _elDiv_OrderId = document.createElement('div');
                                _elDiv_OrderId.setAttribute("id", "orderId");
                                _elDiv_OrderId.textContent = `${_trTbl.ui.roomservice.title.ordernumber[_state.lang]}:${_Order.id}`;
                                _eldiv_ordering.appendChild(_elDiv_OrderId);

                                _eltr_ordering.appendChild(_eldiv_ordering);
                            }

                            // Append Ordered Item list
                            {
                                let _elDiv_OdItemsLst = document.createElement('div');
                                _elDiv_OdItemsLst.className = "OdItemLst";

                                // Append item list hdr
                                {
                                    var _elTbl_OdItemsHdr = document.createElement('table');
                                    _elTbl_OdItemsHdr.className = "tbl_header";

                                    let _elTBody_OdItmesHdr = document.createElement('tbody'); {
                                        _elTBody_OdItmesHdr.setAttribute("id", "hdr");

                                        var _elTr_OdItmesHdr = document.createElement('tr');
                                        var _elTh_OdItmesHdr_Type = document.createElement('th');
                                        _elTh_OdItmesHdr_Type.setAttribute("id", "type");
                                        _elTh_OdItmesHdr_Type.textContent = _trTbl.ui.roomservice.title.item[_state.lang];
                                        _elTr_OdItmesHdr.appendChild(_elTh_OdItmesHdr_Type);

                                        var _elTh_OdItmesHdr_Quantity = document.createElement('th');
                                        _elTh_OdItmesHdr_Quantity.setAttribute("id", "quantity");
                                        _elTh_OdItmesHdr_Quantity.textContent = _trTbl.ui.roomservice.title.quantity[_state.lang];
                                        _elTr_OdItmesHdr.appendChild(_elTh_OdItmesHdr_Quantity);

                                        var _elTh_OdItmesHdr_Amount = document.createElement('th');
                                        _elTh_OdItmesHdr_Amount.setAttribute("id", "amount");
                                        _elTh_OdItmesHdr_Amount.textContent = _trTbl.ui.roomservice.title.amount[_state.lang];
                                        _elTr_OdItmesHdr.appendChild(_elTh_OdItmesHdr_Amount);

                                        var _elTh_OdItmesHdr_Subtotal1 = document.createElement('th');
                                        _elTh_OdItmesHdr_Subtotal1.setAttribute("id", "subtotal1");
                                        _elTh_OdItmesHdr_Subtotal1.textContent = `[ ${_trTbl.ui.roomservice.title.sum[_state.lang]} `;
                                        _elTr_OdItmesHdr.appendChild(_elTh_OdItmesHdr_Subtotal1);

                                        var _elTh_OdItmesHdr_Subtotal2 = document.createElement('th');
                                        _elTh_OdItmesHdr_Subtotal2.setAttribute("id", "subtotal2");
                                        _elTh_OdItmesHdr_Subtotal2.textContent = `${_Order.amount[_state.lang].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}${_roomservice.currency[_state.lang]}`;
                                        _elTr_OdItmesHdr.appendChild(_elTh_OdItmesHdr_Subtotal2);

                                        var _elTh_OdItmesHdr_Subtotal3 = document.createElement('th');
                                        _elTh_OdItmesHdr_Subtotal3.setAttribute("id", "subtotal3");
                                        _elTh_OdItmesHdr_Subtotal3.textContent = `${_trTbl.ui.roomservice.title.quantity[_state.lang]} `;
                                        _elTr_OdItmesHdr.appendChild(_elTh_OdItmesHdr_Subtotal3);

                                        var _elTh_OdItmesHdr_Subtotal4 = document.createElement('th');
                                        _elTh_OdItmesHdr_Subtotal4.setAttribute("id", "subtotal4");
                                        _elTh_OdItmesHdr_Subtotal4.textContent = `## `;
                                        _elTr_OdItmesHdr.appendChild(_elTh_OdItmesHdr_Subtotal4);

                                        var _elTh_OdItmesHdr_Subtotal5 = document.createElement('th');
                                        _elTh_OdItmesHdr_Subtotal5.setAttribute("id", "subtotal5");
                                        _elTh_OdItmesHdr_Subtotal5.textContent = ` ]`;
                                        _elTr_OdItmesHdr.appendChild(_elTh_OdItmesHdr_Subtotal5);

                                        _elTBody_OdItmesHdr.appendChild(_elTr_OdItmesHdr);
                                    }
                                    _elTbl_OdItemsHdr.appendChild(_elTBody_OdItmesHdr);
                                }
                                _elDiv_OdItemsLst.appendChild(_elTbl_OdItemsHdr);


                                // Append item list record
                                {
                                    var _elTbl_OdItemsRec = document.createElement('table');
                                    _elTbl_OdItemsRec.className = "tbl_record";

                                    let _elTBody_OdItmesRec = document.createElement('tbody'); {
                                        _elTBody_OdItmesRec.setAttribute("id", "record");
                                        for (let _j = 1; _j <= _Order.items.length; _j++) {
                                            let _OdItem = _Order.items[_j];
                                            var _elTr_OdItmesRec = document.createElement('tr');
                                            var _elDiv_OdItmesRec = document.createElement('div');
                                            _elDiv_OdItmesRec.className = "oditem";
                                            var _elDiv_OdItmesRecName = document.createElement('div');
                                            _elDiv_OdItmesRecName.setAttribute("id", "name");
                                            _elDiv_OdItmesRecName.textContent =`[${_j}] ` + __fxn_getRsItemValue(_roomservice.children, "title", _OdItem.itemId)[_state.lang];
                                            _elDiv_OdItmesRec.appendChild(_elDiv_OdItmesRecName);

                                            var _elDiv_OdItmesRecQuantity = document.createElement('div');
                                            _elDiv_OdItmesRecQuantity.setAttribute("id", "quantity");
                                            _elDiv_OdItmesRecQuantity.textContent = _OdItem.quantity;
                                            _elDiv_OdItmesRec.appendChild(_elDiv_OdItmesRecQuantity);

                                            _total_quantity += _OdItem.quantity;

                                            var _elDiv_OdItmesRecAmount = document.createElement('div');
                                            _elDiv_OdItmesRecAmount.setAttribute("id", "amount");
                                            _elDiv_OdItmesRecAmount.textContent = _OdItem.amount[_state.lang].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + _roomservice.currency[_state.lang];
                                            _elDiv_OdItmesRec.appendChild(_elDiv_OdItmesRecAmount);
                                            _elTr_OdItmesRec.appendChild(_elDiv_OdItmesRec);
                                            _elTBody_OdItmesRec.appendChild(_elTr_OdItmesRec);
                                        }
                                    }
                                    _elTbl_OdItemsRec.appendChild(_elTBody_OdItmesRec);
                                }
                                _elDiv_OdItemsLst.appendChild(_elTbl_OdItemsRec);
                                _eltr_ordering.appendChild(_elDiv_OdItemsLst);
                            }

                            _elRsOLstItemTblRec.append(_eltr_ordering);
                        }

                        // Draw Total Amount and Quantity
                        _elRsOLstSummary.children(`#title`).text(_trTbl.ui.roomservice.title.sum[_state.lang]);
                        _elRsOLstSummary.children(`#quantity`).text(_total_quantity);
                        _elRsOLstSummary.children(`#amount`).text(_RsOrder.amount[_state.lang].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + _roomservice.currency[_state.lang]);

                        // Activate first order lists
                        _elRsOLstItemTblRec.children('tr').first().addClass('active');
                    } catch (_error) {
                        console.log(`Fail to call order detail page::> ${_error}`);
                        //return;
                    }


                    if (_elRsOLstRoot.css('display') == "none") {
                        _elRsOLstRoot.fadeIn(400);
                    }
                }
                break;
            case "up":
                {
                    let _elRsOLstItemTblRec = _elRsOLstItems.children('.order_list').children('tbody');
                    let selectedTblItem = _elRsOLstItemTblRec.children('tr.active').prev(".order_list tr");
                    if (selectedTblItem.length) {
                        _elRsOLstItemTblRec.children('tr.active').removeClass("active");
                        selectedTblItem.addClass('active');
                        _state.hotkey.mm[_roomservice.button].status.orderdetails.idx = selectedTblItem.prop('rowIndex');

                        // 스크롤이 필요한 경우 스크롤링 하기
                        let _scrollTopVal = _state.hotkey.mm[_roomservice.button].status.orderdetails.scroll_TOfset;
                        _scrollTopVal -= selectedTblItem.prop('scrollHeight');
                        _elRsOLstItems.animate({ scrollTop: _scrollTopVal }, 200);
                        _state.hotkey.mm[_roomservice.button].status.orderdetails.scroll_TOfset = _scrollTopVal;
                    }
                }
                break;
            case "down":
                {
                    let _elRsOLstItemTblRec = _elRsOLstItems.children('.order_list').children('tbody');
                    let selectedTblItem = _elRsOLstItemTblRec.children('tr.active').next(".order_list tr");
                    if (selectedTblItem.length) {
                        _elRsOLstItemTblRec.children('tr.active').removeClass("active");
                        selectedTblItem.addClass('active');
                        _state.hotkey.mm[_roomservice.button].status.orderdetails.idx = selectedTblItem.prop('rowIndex');

                        // 스크롤이 필요한 경우 스크롤링 하기
                        let _scrollTopVal = _state.hotkey.mm[_roomservice.button].status.orderdetails.scroll_TOfset;
                        _scrollTopVal += selectedTblItem.prop('scrollHeight');
                        _elRsOLstItems.animate({ scrollTop: _scrollTopVal }, 200);
                        _state.hotkey.mm[_roomservice.button].status.orderdetails.scroll_TOfset = _scrollTopVal;
                    }
                }
                break;
            case "back":
                break;
        }
    }

    /**
     * HotelTV UI[AppFull] Wrapper Function::> update room service cart list for ordering
     * @param {boolean} _show show/hide
     * @param {string} _keyEvt key event
     */
    function __uifxn_AppFull_DrawRoomservceCartList(_show, _keyEvt) {
        let _state = HotelTV.state;
        let _trTbl = HotelTV.translation;
        let _roomservice = HotelTV.opening.roomService;
        let _rsCart = HotelTV.carts.roomservice;

        let _elRsPupRoot = $('.popup .roomservice');
        let _elRsCLstRoot = _elRsPupRoot.children('.cart-list');
        let _elRsCLstSummary = _elRsCLstRoot.children('#summary');
        let _elRsCLstButtons = _elRsCLstRoot.children('#buttons');

        const __fxn_getRsItemValue = function(_object, _key, _itemID) {
            for (__j = 1; __j <= _object.length; __j++) {
                if (_object[__j].id == _itemID) {
                    return _object[__j][_key];
                }
            }
        }

        if (_show == false) {
            if (_elRsCLstRoot.css('display') != "none") {
                _elRsCLstButtons.find('#confirm').removeClass("active");
                _elRsCLstButtons.find('#cancel').removeClass("active");
                _elRsCLstRoot.hide();
            }
            return;
        }


        if (!_rsCart || !_roomservice) {
            return;
        }

        switch (_keyEvt) {
            case "build":
                let _total_quantity = 0;

                _elRsCLstRoot.children('#title').text(_trTbl.ui.roomservice.title.cartslist[_state.lang]);
                _elRsCLstRoot.children('#usage').text(_trTbl.ui.roomservice.usage.orderConfirm[_state.lang]);

                //Draw Roomservice Cart Items
                try {
                    let _elRsCLstItems = _elRsCLstRoot.children(`#items`);
                    let _elRsCLstItemTblHdr = _elRsCLstItems.children('.tbl_header').children('tbody');
                    let _elRsCLstItemTblRec = _elRsCLstItems.children('.tbl_record').children('tbody');
                    // Drawing Item Table Headers
                    _elRsCLstItemTblHdr.children('tr').children('th#type').text(`${_trTbl.ui.roomservice.title.item[_state.lang]}`);
                    _elRsCLstItemTblHdr.children('tr').children('th#quantity').text(_trTbl.ui.roomservice.title.quantity[_state.lang]);
                    _elRsCLstItemTblHdr.children('tr').children('th#amount').text(_trTbl.ui.roomservice.title.amount[_state.lang]);

                    // Delete elements under room service item table
                    if (_elRsCLstItemTblRec.children('tr').length) {
                        _elRsCLstItemTblRec.children('tr').remove();
                    }

                    for (let _idx = 1; _idx <= _rsCart.items.length; _idx++) {
                        let _rsItem = _rsCart.items[_idx];
                        if (_rsItem.id) {
                            var _eltr_item = document.createElement('tr');
                            _eltr_item.setAttribute("id", _rsCart.items[_idx].id);
                            _eltr_item.setAttribute("index", _idx); {
                                //룸서비스 아이탬 화면 드로잉
                                var _eldiv_item_ctz = document.createElement('div');
                                _eldiv_item_ctz.setAttribute("class", "products");

                                // Append Sub elements::title
                                let _elDiv_title = document.createElement('div');
                                _elDiv_title.setAttribute("id", "title");
                                _elDiv_title.textContent = __fxn_getRsItemValue(_roomservice.children, "title", _rsItem.itemId)[_state.lang];
                                _eldiv_item_ctz.appendChild(_elDiv_title);

                                // Append Sub elements::quantity
                                let _elDiv_quantity = document.createElement('div');
                                _elDiv_quantity.setAttribute("id", "quantity");
                                _elDiv_quantity.textContent = _rsItem.quantity;
                                _eldiv_item_ctz.appendChild(_elDiv_quantity);
                                _total_quantity += _rsItem.quantity;

                                // Append Sub elements::amount
                                let _elDiv_price = document.createElement('div');
                                _elDiv_price.setAttribute("id", "price");
                                _elDiv_price.textContent = _rsItem.price[_state.lang].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + _roomservice.currency[_state.lang];
                                _eldiv_item_ctz.appendChild(_elDiv_price);
                            }
                            _eltr_item.appendChild(_eldiv_item_ctz);
                            _elRsCLstItemTblRec.append(_eltr_item);
                        }
                    }
                    // 첫번째 테이블 아애템에 active 클래스 추가 (플래그용으로 사용)
                    // _elRsCLstItemTblRec.children('tr').first().addClass('active');
                } catch (_error) {
                    console.log(_error.message);
                }

                // Drawing Summary
                _elRsCLstSummary.children('#title').text(_trTbl.ui.roomservice.title.sum[_state.lang]);
                _elRsCLstSummary.children('#quantity').text(_total_quantity);
                _elRsCLstSummary.children('#amount').text(_rsCart.amount[_state.lang].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + _roomservice.currency[_state.lang]);

                // Drawing Notice
                _elRsCLstRoot.children('#notice').text(_trTbl.ui.roomservice.usage.orderNoticeFinal[_state.lang]);

                // Drawing Buttons
                _elRsCLstButtons.find('#confirm').text(_trTbl.ui.roomservice.title.confirm[_state.lang]);
                _elRsCLstButtons.find('#cancel').text(_trTbl.ui.roomservice.title.back[_state.lang]);

                // Focus button
                _elRsCLstButtons.find('#confirm').addClass("active");

                if (_elRsCLstRoot.css('display') == "none") {
                    _elRsCLstRoot.fadeIn(300);
                }
                break;
            case "left":
                if (_state.hotkey.mm[_roomservice.button].status.cartlist.idx == "confirm") {
                    _elRsCLstButtons.find('#confirm').removeClass("active");
                    _state.hotkey.mm[_roomservice.button].status.cartlist.idx = "cancel";
                    _elRsCLstButtons.find('#cancel').addClass("active");
                } else if (_state.hotkey.mm[_roomservice.button].status.cartlist.idx == "cancel") {
                    _elRsCLstButtons.find('#cancel').removeClass("active");
                    _state.hotkey.mm[_roomservice.button].status.cartlist.idx = "confirm";
                    _elRsCLstButtons.find('#confirm').addClass("active");
                }
                break;
            case "right":
                if (_state.hotkey.mm[_roomservice.button].status.cartlist.idx == "confirm") {
                    _elRsCLstButtons.find('#confirm').removeClass("active");
                    _state.hotkey.mm[_roomservice.button].status.cartlist.idx = "cancel";
                    _elRsCLstButtons.find('#cancel').addClass("active");
                } else if (_state.hotkey.mm[_roomservice.button].status.cartlist.idx == "cancel") {
                    _elRsCLstButtons.find('#cancel').removeClass("active");
                    _state.hotkey.mm[_roomservice.button].status.cartlist.idx = "confirm";
                    _elRsCLstButtons.find('#confirm').addClass("active");
                }
                break;
            case "back":
                break;
        }
    }

    /**
     * HotelTV UI[AppFull] Wrapper Function::> update room service item description
     * @param {boolean} _show show/hide
     */
    function __uifxn_AppFull_DrawRoomservceItemDescription(_show) {
        let _state = HotelTV.state;
        let _roomservice = HotelTV.opening.roomService;

        let _elRsPupRoot = $('.popup .roomservice');
        let _elRsMnRoot = _elRsPupRoot.children('.menu');
        let _elRsMnItmTbl = _elRsMnRoot.children('#items').find('.tbl_record').children('#record');
        let _elRsMnDesc = _elRsPupRoot.children('.description');

        const __fxn_getRsItemValue = function(_object, _key, _itemID) {
            for (__j = 1; __j <= _object.length; __j++) {
                if (_object[__j].id == _itemID) {
                    return _object[__j][_key];
                }
            }
        }

        if (_show == false) {
            if (_elRsMnDesc.css('display') != "none") {
                _elRsMnDesc.hide();
            }
            return;
        }

        //선택된 테이블 레코드의 ID속성값 읽어오기
        let selectedTblItemID = _elRsMnItmTbl.children('tr.active').prop('id');

        //Redraw Description
        _elRsMnDesc.children('#title').text(__fxn_getRsItemValue(_roomservice.children, "title", selectedTblItemID)[_state.lang]);
        _elRsMnDesc.children('#comment').text(__fxn_getRsItemValue(_roomservice.children, "description", selectedTblItemID)[_state.lang]);
        _elRsMnDesc.children('#thumb').css('background-image', 'url(' + __fxn_getRsItemValue(_roomservice.children, "thumbnail", selectedTblItemID).files[_state.lang].download + ')');

        if (_elRsMnDesc.css('display') == "none") {
            _elRsMnDesc.show();
        }

        HotelTV.api.ReportEvent([{'power': true, 'location':{'conId':__fxn_getRsItemValue(_roomservice.children, "id", selectedTblItemID)}}])
    }

    /**
     * HotelTV UI[AppFull] Wrapper Function::> update room service item
     * @param {boolean} _isUpdateDescrption show/hide item description
     */
    async function __uifxn_AppFull_DrawRoomserviceItem(_isUpdateDescrption) {
        let _state = HotelTV.state;
        let _roomservice = HotelTV.opening.roomService;
        let _carts = null;
        const __fxn_cartItemExist = function(_object, _itemID) {
            for (__j = 1; __j <= _object.length; __j++) {
                if (_object[__j].itemId == _itemID) {
                    return true;
                }
            }
            return false;
        }

        const __fxn_cartItemValue = function(_object, _key, _itemID) {
            for (__j = 1; __j <= _object.length; __j++) {
                if (_object[__j].itemId == _itemID) {
                    return _object[__j][_key];
                }
            }
        }

        try {
            let _total_quantity = 0;
            let _elRsMnItemTblRoot = $('.popup .roomservice>.menu #items>table.tbl_record');
            HotelTV.carts.roomservice = _carts = await HotelTV.api.GetRoomserviceCarts();
            for (let _idx = 1; _idx <= _roomservice.children.length; _idx++) {
                let _rsItem = _roomservice.children[_idx];
                let _elRsItemRecRoot = _elRsMnItemTblRoot.find(`tr#${_rsItem.id}`).children('div.products');
                // Update Unit price
                _elRsItemRecRoot.find('#price').text(_rsItem.price[_state.lang].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + _roomservice.currency[_state.lang]);

                // Update quantity
                if (_carts.items.length && __fxn_cartItemExist(_carts.items, _rsItem.id) == true) {
                    let _cart_item_quantity = __fxn_cartItemValue(_carts.items, "quantity", _rsItem.id);
                    _total_quantity += _cart_item_quantity;
                    // Cart Quantity
                    _elRsItemRecRoot.find('#quantity').text(_cart_item_quantity);
                }
            }

            //Update Total amount as well as quantity
            let _elRsMnSummary = $('.popup .roomservice>.menu #summary');
            _elRsMnSummary.children('#value').text(_carts.amount[_state.lang].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + _roomservice.currency[_state.lang]);
            _elRsMnSummary.children('#quantity').text(_total_quantity);

            //Refresh menu description
            if (_isUpdateDescrption == true) {
                __uifxn_AppFull_DrawRoomservceItemDescription(true);
            }
        } catch (_error) {
            console.log(_error.message);
        }
    }

    /**
     * HotelTV UI[AppFull] Wrapper Function::> room service handling function
     * @param {string} _evtKey event
     * @param {boolean} _isFlushCart flag for flush cart
     * @param {callback} _cbFxn post-processing callback
     */
    async function __uifxn_AppFull_HandleRoomservice(_evtKey, _isFlushCart, _isDoOrder, _cbFxn) {
        let _state = HotelTV.state;
        let _opening = HotelTV.opening;
        let _roomservice = null;
        let _carts = HotelTV.carts.roomservice;
        let _scrollTopVal = 0;
        let _elRsPupRoot = $('.popup .roomservice');
        let _elRsMnRoot = _elRsPupRoot.children('.menu');
        let _elRsMnItmTbl = _elRsMnRoot.children('#items').find('.tbl_record').children('#record');
        let _elRsMnBtn = _elRsMnRoot.children('#buttons');
        let _elRsOdDetails = _elRsPupRoot.children('.order-details');

        const __fxn_cartEmpty = function(_object) {
            for (__j = 1; __j <= _object.length; __j++) {
                if (_object[__j].id) {
                    return false;
                }
            }
            return true;
        }

        const __fxn_cartItemValue = function(_object, _key, _itemID) {
            for (__j = 1; __j <= _object.length; __j++) {
                if (_object[__j].id == _itemID) {
                    return _object[__j][_key];
                }
            }
        }

        const __fxn_close_RsPopup = function(_fxn_post_process) {
            // 아이템 디스크립션(메뉴 오른쪽) 하이드
            __uifxn_AppFull_DrawRoomservceItemDescription(false);

            _elRsPupRoot.animate({ top: 96, left: -560 }, 500, () => {
                // 아이탬 테이블 스크롤 맨 위로 이동
                _elRsMnItmTbl.animate({ scrollTop: 0 }, 200);

                // CART LIST 제거 및 Off
                __uifxn_AppFull_DrawRoomservceCartList(false, "back");

                // 매뉴 아이탬 및 버튼에서 active클래스 초기화
                _elRsMnItmTbl.children('tr.active').removeClass("active");
                _elRsMnItmTbl.children('tr').first().addClass('active');
                _elRsMnBtn.children('div').removeClass("active");

                // state내의 Room service관련 HOTKEY정보를 초기화
                _state.hotkey.mm[_roomservice.button] = {
                    'type': "roomservice",
                    'id': _roomservice.id,
                    "status": {
                        "focus": "menu",
                        "menu": {
                            "idx": 0,
                            "scroll_TOfset": 0
                        },
                        "button": {
                            "idx": null
                        },
                        "cartlist": {
                            "idx": null,
                            "scroll_TOfset": 0
                        },
                        "orderdetails": {
                            "idx": null,
                            "scroll_TOfset": 0
                        }
                    }
                };

                // Do post-processing
                if (_fxn_post_process) {
                    _fxn_post_process();
                }
            });
        }



        if (!_opening.roomService) {
            return;
        }
        _roomservice = _opening.roomService;

        switch (_evtKey) {
            case "up":
                switch (_state.hotkey.mm[_roomservice.button].status.focus) {
                    case "menu":
                        // 선택한 아이탬 알아내기
                        let selectedTblItem = _elRsMnItmTbl.children('tr.active').prev(".tbl_record tr");
                        if (selectedTblItem.length) {
                            _elRsMnItmTbl.children('tr.active').removeClass("active");
                            selectedTblItem.addClass('active');
                            _state.hotkey.mm[_roomservice.button].status.menu.idx = selectedTblItem.prop('rowIndex');

                            // 스크롤이 필요한 경우 스크롤링 하기
                            _scrollTopVal = selectedTblItem.prop('scrollHeight') * _state.hotkey.mm[_roomservice.button].status.menu.idx;
                            _state.hotkey.mm[_roomservice.button].status.menu.scroll_TOfset = _scrollTopVal;
                            _elRsMnItmTbl.animate({ scrollTop: _scrollTopVal }, 200);

                            //Update Item Description Frame
                            __uifxn_AppFull_DrawRoomservceItemDescription(true);
                        }
                        break;
                    case "button":
                        _elRsMnBtn.children('div').removeClass("active");
                        if (_state.hotkey.mm[_roomservice.button].status.button.idx == "cancel") {
                            _state.hotkey.mm[_roomservice.button].status.button.idx = "details";
                            _elRsMnBtn.children('div#details').addClass("active");
                        } else if (_state.hotkey.mm[_roomservice.button].status.button.idx == "details") {
                            if (__fxn_cartEmpty(_carts.items) == false) {
                                _state.hotkey.mm[_roomservice.button].status.button.idx = "order";
                                _elRsMnBtn.children('div#order').addClass("active");
                            } else {
                                _state.hotkey.mm[_roomservice.button].status.button.idx = null;
                                _state.hotkey.mm[_roomservice.button].status.focus = "menu";
                                _elRsMnItmTbl.children('tr').eq(_state.hotkey.mm[_roomservice.button].status.menu.idx).addClass('active');
                                __uifxn_AppFull_DrawRoomservceItemDescription(true);
                            }
                        } else {
                            _state.hotkey.mm[_roomservice.button].status.button.idx = null;
                            _state.hotkey.mm[_roomservice.button].status.focus = "menu";
                            _elRsMnItmTbl.children('tr').eq(_state.hotkey.mm[_roomservice.button].status.menu.idx).addClass('active');
                            // Shows up Menu Item description
                            __uifxn_AppFull_DrawRoomservceItemDescription(true);
                        }
                        break;
                    case "orderdetails":
                        //Navigate order lists
                        __uifxn_AppFull_DrawRoomservceOrderList(true, "up");
                        break;
                }
                break;
            case "down":
                switch (_state.hotkey.mm[_roomservice.button].status.focus) {
                    case "menu":
                        // 선택한 아이탬 알아내기
                        let selectedTblItem = _elRsMnItmTbl.children('tr.active').next(".tbl_record tr");
                        if (selectedTblItem.length) {
                            _elRsMnItmTbl.children('tr.active').removeClass("active");
                            selectedTblItem.addClass('active');
                            _state.hotkey.mm[_roomservice.button].status.menu.idx = selectedTblItem.prop('rowIndex');

                            // 스크롤이 필요한 경우 스크롤링 하기
                            _scrollTopVal = selectedTblItem.prop('scrollHeight') * _state.hotkey.mm[_roomservice.button].status.menu.idx;
                            _state.hotkey.mm[_roomservice.button].status.menu.scroll_TOfset = _scrollTopVal;
                            _elRsMnItmTbl.animate({ scrollTop: _scrollTopVal }, 200);

                            //Update Item Description Frame
                            __uifxn_AppFull_DrawRoomservceItemDescription(true);
                        } else {
                            _elRsMnItmTbl.children('tr.active').removeClass("active");
                            _state.hotkey.mm[_roomservice.button].status.focus = "button";

                            //Hide Item Description Frame
                            __uifxn_AppFull_DrawRoomservceItemDescription(false);
                            if (__fxn_cartEmpty(_carts.items) == false) {
                                _state.hotkey.mm[_roomservice.button].status.button.idx = "order";
                                _elRsMnBtn.children('div#order').addClass("active");
                            } else {
                                _state.hotkey.mm[_roomservice.button].status.button.idx = "details";
                                _elRsMnBtn.children('div#details').addClass("active");
                            }
                        }
                        break;
                    case "button":
                        if (_state.hotkey.mm[_roomservice.button].status.button.idx == "order") {
                            _elRsMnBtn.children('div').removeClass("active");
                            _state.hotkey.mm[_roomservice.button].status.button.idx = "details";
                            _elRsMnBtn.children('div#details').addClass("active");
                        } else if (_state.hotkey.mm[_roomservice.button].status.button.idx == "details") {
                            _elRsMnBtn.children('div').removeClass("active");
                            _state.hotkey.mm[_roomservice.button].status.button.idx = "cancel";
                            _elRsMnBtn.children('div#cancel').addClass("active");
                        }
                        break;
                    case "orderdetails":
                        //Navigate order lists
                        __uifxn_AppFull_DrawRoomservceOrderList(true, "down");
                        break;
                }
                break;
            case "right":
                if (_state.hotkey.mm[_roomservice.button].status.focus == "menu") {
                    let selectedTblItem = _elRsMnItmTbl.children('tr.active');
                    let _sel_itemID = selectedTblItem.attr('id');
                    try {
                        let _result = await HotelTV.api.PutRoomserviceCarts(_sel_itemID, 1);
                        if (_result) {
                            __uifxn_AppFull_DrawRoomserviceItem(false);
                        }
                    } catch (_error) {
                        console.log(`Fail to call API::> ${_error}`);
                    }
                } else if (_state.hotkey.mm[_roomservice.button].status.focus == "cartlist") {
                    __uifxn_AppFull_DrawRoomservceCartList(true, "left");
                }
                break;
            case "left":
                if (_state.hotkey.mm[_roomservice.button].status.focus == "menu") {
                    let selectedTblItem = _elRsMnItmTbl.children('tr.active');
                    let _sel_itemID = selectedTblItem.attr('id');
                    try {
                        let _result = await HotelTV.api.PutRoomserviceCarts(_sel_itemID, -1);
                        if (_result) {
                            __uifxn_AppFull_DrawRoomserviceItem(false);
                        }
                    } catch (_error) {
                        console.log(`Fail to call API::> ${_error}`);
                    }
                } else if (_state.hotkey.mm[_roomservice.button].status.focus == "cartlist") {
                    __uifxn_AppFull_DrawRoomservceCartList(true, "right");
                }
                break;
            case "enter":
                if (_state.hotkey.mm[_roomservice.button].status.focus == "button") {
                    switch (_state.hotkey.mm[_opening.roomService.button].status.button.idx) {
                        case "cancel":
                            __fxn_close_RsPopup(_cbFxn);
                            break;
                        case "order":
                            //Remove active class from menu buttons
                            _elRsMnBtn.children('div').removeClass("active");

                            // Build Cart List
                            _state.hotkey.mm[_roomservice.button].status.focus = "cartlist";
                            __uifxn_AppFull_DrawRoomservceCartList(true, "build");
                            _state.hotkey.mm[_opening.roomService.button].status.cartlist.idx = "confirm";
                            break;
                        case "details":
                            // Hide Menu
                            _elRsMnRoot.hide();

                            // Build Order details
                            _state.hotkey.mm[_roomservice.button].status.focus = "orderdetails";
                            __uifxn_AppFull_DrawRoomservceOrderList(true, "build");
                            break;
                    }
                } else if (_state.hotkey.mm[_roomservice.button].status.focus == "cartlist") {
                    switch (_state.hotkey.mm[_opening.roomService.button].status.cartlist.idx) {
                        case "confirm":
                            _state.hotkey.mm[_roomservice.button].status.focus = "orderalert";
                            try {
                                let _result = await HotelTV.api.PutRoomserviceOrders();
                                if (_result) {
                                    console.log(`Success to order CARTID::>`);
                                    __uifxn_AppFull_DrawRoomserviceItem(true);

                                    HotelTV.orders.roomservice = await HotelTV.api.GetRoomserviceOrders(null);
                                } else {
                                    console.log(`Fail to order CARTID::>`);
                                }
                            } catch (_error) {
                                console.log(`Fail to call API::> ${_error}`);
                            }

                            //Show Order confirm alert
                            __uifxn_AppFull_DrawRoomserviceOrderAlert(true);
                            break;
                        case "cancel":
                            //Hide Cart List
                            __uifxn_AppFull_DrawRoomservceCartList(false, "back");
                            //Return to button
                            _state.hotkey.mm[_roomservice.button].status.focus = "button";
                            _elRsMnBtn.children('div#order').addClass("active");
                            break;
                    }
                } else if (_state.hotkey.mm[_roomservice.button].status.focus == "orderalert") {
                    //Hide Cart List
                    __uifxn_AppFull_DrawRoomservceCartList(false, "back");
                    //Hide Order confirm alert
                    __uifxn_AppFull_DrawRoomserviceOrderAlert(false);
                    //Return to button
                    _state.hotkey.mm[_roomservice.button].status.focus = "button";
                    _elRsMnBtn.children('div#order').addClass("active");
                }
                break;
            case "back":
                if (_state.hotkey.mm[_roomservice.button].status.focus == "orderalert") {
                    //Hide Cart List
                    __uifxn_AppFull_DrawRoomservceCartList(false, "back");
                    //Hide Order confirm alert
                    __uifxn_AppFull_DrawRoomserviceOrderAlert(false);
                    //Return to button
                    _state.hotkey.mm[_roomservice.button].status.focus = "button";
                    _elRsMnBtn.children('div#order').addClass("active");
                } else if (_state.hotkey.mm[_roomservice.button].status.focus == "orderdetails") {
                    //Hide Order Details
                    __uifxn_AppFull_DrawRoomservceOrderList(false, null);

                    //Return to button
                    _state.hotkey.mm[_roomservice.button].status.focus = "button";

                    // Hide Menu
                    _elRsMnRoot.fadeIn(400);
                } else {
                    __fxn_close_RsPopup(_cbFxn);
                }
                break;
        }
    }


    /**
     * HotelTV UI[AppFull] Wrapper Function::> build room service
     * @param {boolean} e event
     */
    function __uifxn_AppFull_BuildRoomService() {
        let _state = HotelTV.state;
        let _trTbl = HotelTV.translation;
        let _opening = HotelTV.opening;
        let _order = HotelTV.orders.roomService;
        let _roomservice = null;
        let _elRsPupRoot = $('.popup .roomservice');
        let _elRsMnRoot = _elRsPupRoot.children('.menu');
        let _elRsMnBtn = _elRsMnRoot.children('#buttons');
        let _elRsMnSummary = _elRsMnRoot.children('#summary');

        if (!_opening.roomService) {
            return;
        }
        _roomservice = _opening.roomService;

        _elRsMnRoot.children('#title').text(_roomservice.title[_state.lang]);
        _elRsMnRoot.children('#usage').text(_trTbl.ui.roomservice.usage.order[_state.lang]);


        //Draw Roomservice Cart Items
        try {
            let _elRsMnItems = _elRsMnRoot.children(`#items`);
            let _elRsMnItemTblHdr = _elRsMnItems.children('.tbl_header').children('tbody');
            let _elRsMnItemTblRec = _elRsMnItems.children('.tbl_record').children('tbody');
            // Drawing Item Table Headers
            _elRsMnItemTblHdr.children('tr').children('th#type').text(`${_trTbl.ui.roomservice.title.item[_state.lang]} [${_roomservice.children.length}]`);
            _elRsMnItemTblHdr.children('tr').children('th#quantity').text(_trTbl.ui.roomservice.title.quantity[_state.lang]);

            // Delete elements under room service item table
            if (_elRsMnItemTblRec.children('tr').length) {
                _elRsMnItemTblRec.children('tr').remove();
            }

            for (let _idx = 1; _idx <= _roomservice.children.length; _idx++) {
                let _rsItem = _roomservice.children[_idx];

                var _eltr_item = document.createElement('tr');
                _eltr_item.setAttribute("id", _roomservice.children[_idx].id);
                _eltr_item.setAttribute("index", _idx); {
                    //어메니티 아이탬 화면 드로잉
                    var _eldiv_item_ctz = document.createElement('div');
                    _eldiv_item_ctz.setAttribute("class", "products");

                    // Append Sub elements::index
                    let _elDiv_index = document.createElement('div');
                    _elDiv_index.setAttribute("id", "index");
                    _elDiv_index.textContent = `[${_idx}]`;
                    _eldiv_item_ctz.appendChild(_elDiv_index);

                    // Append Sub elements::title
                    let _elDiv_title = document.createElement('div');
                    _elDiv_title.setAttribute("id", "title");
                    _elDiv_title.textContent = _rsItem.title[_state.lang];
                    _eldiv_item_ctz.appendChild(_elDiv_title);

                    // Append Sub elements::price
                    let _elDiv_price = document.createElement('div');
                    _elDiv_price.setAttribute("id", "price");
                    _elDiv_price.textContent = _rsItem.price[_state.lang].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                    _eldiv_item_ctz.appendChild(_elDiv_price);

                    // Append Sub elements::quantity
                    let _elDiv_quantity = document.createElement('div');
                    _elDiv_quantity.setAttribute("id", "quantity");
                    _elDiv_quantity.textContent = "0";
                    _eldiv_item_ctz.appendChild(_elDiv_quantity);

                }
                _eltr_item.appendChild(_eldiv_item_ctz);
                _elRsMnItemTblRec.append(_eltr_item);
            }
            // 첫번째 테이블 아애템에 active 클래스 추가 (플래그용으로 사용)
            _elRsMnItemTblRec.children('tr').first().addClass('active');
        } catch (_error) {
            console.log(_error.message);
        }

        // Drawing Amount(Cart)
        _elRsMnSummary.children('#title').text(_trTbl.ui.roomservice.title.sum[_state.lang]);
        // _elRsMnSummary.children('#value').text("0");
        // _elRsMnSummary.children('#quantity').text("0");

        //
        __uifxn_AppFull_DrawRoomservceCartList(false, null);
        __uifxn_AppFull_DrawRoomservceOrderList(false, null);
        __uifxn_AppFull_DrawRoomserviceOrderAlert(false);

        // Draw Buttons
        _elRsMnBtn.children('#order').text(_trTbl.ui.roomservice.title.order[_state.lang]);
        _elRsMnBtn.children('#details').text(_trTbl.ui.roomservice.title.orderdetails[_state.lang]);
        _elRsMnBtn.children('#cancel').text(_trTbl.ui.roomservice.title.cancel[_state.lang]);


        // HOTKEY정보를 state에 기록
        if (!(_roomservice.button in _state.hotkey.mm)) {
            _state.hotkey.mm[_roomservice.button] = {
                'type': "roomservice",
                'id': _roomservice.id,
                "status": {
                    "focus": "menu",
                    "menu": {
                        "idx": 0,
                        "scroll_TOfset": 0
                    },
                    "button": {
                        "idx": null
                    },
                    "cartlist": {
                        "idx": null,
                        "scroll_TOfset": 0
                    },
                    "orderdetails": {
                        "idx": null,
                        "scroll_TOfset": 0
                    }
                }
            };
        }
        return;
    }

    /**
     * HotelTV UI[AppFull] Wrapper Function::> build news
     * @param {boolean} e event
     */
    function __uifxn_AppFull_BldNews() {
        let _state = HotelTV.state;
        let _newsInfo = HotelTV.news;

        if (!(_newsInfo) || _newsInfo.length == 0) {
            $('.news').hide();
        } else {
            let _hndlNewsTicker = $('.news>.newsctz #hoteltv-news-ticker');
            if (_hndlNewsTicker.children().length == 0) {
                let sz_li_news = "";
                for (let _nwsIdx = 1; _nwsIdx <= _newsInfo.length; _nwsIdx++) {
                    if (_newsInfo[_nwsIdx].logo.download != "") {
                        sz_li_news += `<li data-update=item${_nwsIdx}><img src=" ${_newsInfo[_nwsIdx].logo.download}"/>${_newsInfo[_nwsIdx].content[_state.lang]}</li>`;
                    } else {
                        sz_li_news += `<li data-update=item${_nwsIdx}>${_newsInfo[_nwsIdx].content[_state.lang]}</li>`;
                    }
                }
                _hndlNewsTicker.html(sz_li_news);
                _hndlNewsTicker.webTicker({
                    height: '26px',
                    speed: 100
                });
            } else {
                let sz_li_news = "";
                for (let _nwsIdx = 1; _nwsIdx <= _newsInfo.length; _nwsIdx++) {
                    if (_newsInfo[_nwsIdx].logo.download != "") {
                        if (_newsInfo[_nwsIdx].multilanguage == true) {
                            sz_li_news += `<li data-update=item${_nwsIdx}><img src=" ${_newsInfo[_nwsIdx].logo.download}"/>${_newsInfo[_nwsIdx].content[_state.lang]}</li>`;
                        } else {
                            sz_li_news += `<li data-update=item${_nwsIdx}><img src=" ${_newsInfo[_nwsIdx].logo.download}"/>${_newsInfo[_nwsIdx].content.default}</li>`;
                        }
                    } else {
                        if (_newsInfo[_nwsIdx].multilanguage == true) {
                            sz_li_news += `<li data-update=item${_nwsIdx}>${_newsInfo[_nwsIdx].content[_state.lang]}</li>`;
                        } else {
                            sz_li_news += `<li data-update=item${_nwsIdx}>${_newsInfo[_nwsIdx].content.default}</li>`;
                        }
                    }
                }
                $(".news>.newsctz #hoteltv-news-ticker").webTicker('update', sz_li_news,
                    'swap',
                    true,
                    false
                );
            }
        }
    }




    /**
     * HotelTV UI[AppFull] Wrapper Function::> received event handling function
     * @param {boolean} e event
     */
    function __uifxn_AppFull_OnKeyDnEvt_SmSel(_evt) {
        let _state = HotelTV.state;
        let _sminfo = HotelTV.tvguide.program[_state.menu.main.cur].children;
        //console.log(`Evnt: ${_evt.item.index} Of ${_evt.item.count} page::> ${_evt.page.index} of ${_evt.page.count}`);

        $('#lst_smbg').trigger("to.owl.carousel", [_evt.page.index, 1000, true]);
    }

    /**
     * HotelTV UI[AppFull] Wrapper Function::> Get EPG Info by channel name
     * @param {string} _ch_name channel name
     */
    function __uifxn_AppFull_GetEpgInfoById(_ch_name) {
        let _epgInfo = HotelTV.epg;
        let _tm_cur = new Date();

        if (_epgInfo == 'undefined' || _epgInfo == null) {
            return null;
        }

        if (Object.keys(_epgInfo).includes('schedules') != true || Object.keys(_epgInfo).includes('channels') != true) {
            return null;
        }

        //Find out epg schedule id
        let _epg_schId = null;
        for (let _j = 0; _j < _epgInfo.channels.length; _j++) {
            if (_epgInfo.channels[_j].name == _ch_name) {
                _epg_schId = _epgInfo.channels[_j].id;
            }
        }

        // EPG SHEDULE ID를 찾을 수 없으므로, null 반환.
        if (_epg_schId == null) { return null; }

        let _epg_prom_info = null;
        if (Object.keys(_epgInfo.schedules).includes(_epg_schId) != true) {
            return null;
        }
        _epg_prom_info = _epgInfo.schedules[_epg_schId];

        let _rtn_epg = null;
        for (let _j in _epg_prom_info) {
            let _schTm = new Date();

            if (_epg_prom_info[_j].time.length != 5) {
                console.log("EPG Schedule org time is NULL");
            } else {
                _schTm.setHours(Number(_epg_prom_info[_j].time.charAt(0) + _epg_prom_info[_j].time.charAt(1)));
                _schTm.setMinutes(Number(_epg_prom_info[_j].time.charAt(3) + _epg_prom_info[_j].time.charAt(4)));
            }

            let _tdiff_cur = Math.round((_schTm - _tm_cur) / 60000); //Time diff in minuate
            if (_rtn_epg == null) {
                _rtn_epg = _epg_prom_info[_j];
            }

            if (_tdiff_cur > 0) {
                return _rtn_epg;
            }
            _rtn_epg = _epg_prom_info[_j];
            //console.log("CHNAME::>" + _ch_name + " TDiff::> " + _tdiff_cur);
        }
        return _rtn_epg;
    }

    /**
     * HotelTV UI[AppFull] Wrapper Function::> TV Channel manager ui show/hide
     */
    function __uifxn_AppFull_TVChMngrUi() {
        let _state = HotelTV.state;
        let _tm_diff_ms_tvctrl = 0;

        if (_lastTm.keyevt.tv_ctrl == null) {
            return;
        }

        let _tm_cur = new Date();
        _tm_diff_ms_tvctrl = Math.floor(_tm_cur.getTime() - _lastTm.keyevt.tv_ctrl.getTime());
        //마지막 KEY 이벤트 수신 시간 갱신
        //console.log(`KeyDn Event Recoreded::> ${_lastTm.keyevt.tv_ctrl} TMDiff::> ${_tm_diff_ms}`);

        // TV Channel UI 지속 시간 2초
        if ( _state.menu.stage.cur=="tvShortcut" )
        {

        }
        else
        {
            if (_tm_diff_ms_tvctrl <= 2500) {
                let el_width = $('.main .tv .bg .owl-carousel .owl-stage-outer .owl-stage .item').width();
                el_width = (el_width + 100) * -1;
                if ($('.main .tv .bg .owl-carousel .owl-stage-outer').position().left == el_width) {
                    $('.main .tv .bg .owl-carousel .owl-stage-outer').stop().animate({ left: '0px' }, 400, function() {
                        _state.menu.stage.cur = "tvCtgShow";
                    });
                }
            } else {
                if ($('.main .tv .bg .owl-carousel .owl-stage-outer').position().left == 0) {
                    _state.menu.stage.cur = "tvCtgHide";
                    let el_width = $('.main .tv .bg .owl-carousel .owl-stage-outer .owl-stage .item').width();
                    el_width = (el_width + 100) * -1;
                    $('.main .tv .bg .owl-carousel .owl-stage-outer').stop().animate({ left: el_width.toString() + 'px' }, 400);
                }
            }
        }
    }

    /**
     * HotelTV UI[AppFull] Wrapper Function::> update message selection on mypage
     * @param {string} _action parameter
     */
    function __uifxn_AppFull_MyPageSelectMessage(_action) {
        const _state = HotelTV.state;

        if (!(HotelTV.message)) {
            console.log("INFO::> No messages");
            return;
        }

        const _msg = HotelTV.message;
        const _mmIdx = _state.menu.main.cur;
        const _mmInfo = HotelTV.tvguide.program[_mmIdx];
        let _state_mypage = _state.menu.main[_mmIdx];

        if (_mmInfo.children[_state_mypage.cur].type == 'message') {
            const _total_cnt = _state_mypage['message']['cnt'];
            let _cur_idx = _state_mypage['message']['cur'];
            //mp_msg_tblrec tr엘리멘트들을 Query
            let _el_target = $('.main>.mypage>.bg>.owl-carousel .owl-item #mp_msg_tblrec tbody');
            if (_action == "up") {
                if ((_cur_idx - 1) < 0) {
                    _cur_idx = 0;
                } else {
                    _cur_idx -= 1;
                }

                $('.main>.mypage>.bg>.owl-carousel .owl-item #mp_msg_tblrec tr').removeClass('focus');
                $('.main>.mypage>.bg>.owl-carousel .owl-item #mp_msg_tblrec tr').filter("[msgidx='" + _cur_idx.toString() + "']").addClass('focus');
                _state.menu.main[_mmIdx]['message']['cur'] = _cur_idx;

                if ((_cur_idx >= 3) && (_cur_idx < (_total_cnt - 3))) {
                    _el_target.stop().animate({ scrollTop: ((_cur_idx - 3) * 52).toString() }, 500, function() {
                        console.log("SCROLL DONE>>>1");
                    });
                }
            } else if (_action == "down") {
                if ((_cur_idx + 1) > (_total_cnt - 1)) {
                    _cur_idx = (_total_cnt - 1);
                } else {
                    _cur_idx += 1;
                }
                $('.main>.mypage>.bg>.owl-carousel .owl-item #mp_msg_tblrec tr').removeClass('focus');
                $('.main>.mypage>.bg>.owl-carousel .owl-item #mp_msg_tblrec tr').filter("[msgidx='" + _cur_idx.toString() + "']").addClass('focus');
                _state.menu.main[_mmIdx]['message']['cur'] = _cur_idx;

                if ((_cur_idx > 3) && (_cur_idx < (_total_cnt - 2))) {
                    _el_target.stop().animate({ scrollTop: ((_cur_idx - 3) * 52).toString() }, 500, function() {
                        console.log("SCROLL DONE>>>2");
                    });
                }
            }
        } else {
            console.log("ERROR::> No centered Item");
        }
    }


    /**
     * HotelTV UI[AppFull] Wrapper Function::> My Page
     */
    function __uifxn_AppFull_BuildMyPage() {
        const _trTbl = HotelTV.translation;
        const _state = HotelTV.state;
        const _msg = HotelTV.message;
        const _guest = HotelTV.guestinfo;
        const _hotel = HotelTV.hotelinfo;
        const _mmIdx = _state.menu.main.cur;
        const _mpinfo = HotelTV.tvguide.program[_mmIdx].children;

        if (!(_mmIdx in _state.menu.main)) {
            _state.menu.main[_mmIdx] = {
                'cnt': 0,
                'cur': null,
                'prev': null,
            };
            _state.menu.main[_mmIdx].cnt = _mpinfo.length;
        }

        // 초기 메인 메뉴 KEY설정
        _state.menu.stage.cur = "preparing_mypage";
        if (_state.menu.main[_mmIdx].cur == null) {
            _state.menu.main[_mmIdx].cur = Object.keys(_mpinfo)[0];
        }

        // MYPAGE 메뉴 셀렉터 노드를 동적으로 구성
        let _div_mp_slist = document.querySelector('#lst_mypagesel');
        for (let _i = 1; _i <= _mpinfo.length; _i++) {
            let _div_mpsel_item = document.createElement('div');
            _div_mpsel_item.className = 'item';
            _div_mpsel_item.id = 'mpsel_' + _mpinfo[_i].type;
            _div_mpsel_item.setAttribute("mpid", _mpinfo[_i].id);

            // Append Sub elements::title
            let _mp_item_title = document.createElement('div');
            _mp_item_title.setAttribute("id", "mp_item_title");
            if (_mpinfo.length > 1) {
                _mp_item_title.textContent = _mpinfo[_i].title[_state.lang];

                // Append Sub elements::icon
                let _mp_item_icon = document.createElement('div');
                _mp_item_icon.setAttribute("id", "mp_item_icon");
                let _sz_styleOpt = "--icon_unfocus: url(" + _mpinfo[_i].unfocusIcon.file.download + "); ";
                _sz_styleOpt += "--icon_focus: url(" + _mpinfo[_i].focusIcon.file.download + "); ";
                _sz_styleOpt += "background-repeat: no-repeat; background-position: center bottom; background-size: 100% 100%; ";
                _mp_item_icon.setAttribute("style", _sz_styleOpt);

                _div_mpsel_item.appendChild(_mp_item_icon);
            } else {

            }
            _div_mpsel_item.appendChild(_mp_item_title);
            _div_mp_slist.appendChild(_div_mpsel_item);
        }

        // MYPAGE 메뉴 백그라운드 노드를 동적으로 구성
        let _div_mp_bglist = document.querySelector('#lst_mypagebg');
        for (let _i = 1; _i <= _mpinfo.length; _i++) {
            let _div_mpbg_item = document.createElement('div');
            _div_mpbg_item.className = 'item';
            _div_mpbg_item.id = 'mpbg_' + _mpinfo[_i].id;

            let _sz_styleOpt = "background-image: url(" + _mpinfo[_i].background.file.download + "); ";
            _sz_styleOpt += "background-repeat: no-repeat; background-position: center center; background-size: contain ";
            _div_mpbg_item.setAttribute("style", _sz_styleOpt);

            if (_mpinfo[_i].type == "accommodation") {
                let _accomo_title = document.createElement('div');
                _accomo_title.setAttribute("id", "mp_accomo_title");
                _accomo_title.textContent = _guest.name + _trTbl.ui.mypage.accmodation.title.title[_state.lang];
                _div_mpbg_item.appendChild(_accomo_title);

                let _accomo_info = document.createElement('div');
                _accomo_info.setAttribute("id", "mp_accomo_infowin");

                const _accmo_item_list = ["accmodation_gstname", "accmodation_rsvcode", "accmodation_hotel", "accmodation_bed_type", "accmodation_room_num", "accmodation_checkin", "accmodation_checkout"];
                for (let _j = 0; _j < _accmo_item_list.length; _j++) {
                    let __info_item = document.createElement('div');
                    __info_item.className = 'accmoinf_item';
                    switch (_accmo_item_list[_j]) {
                        case 'accmodation_gstname':
                            __info_item.innerHTML = `<span id="header">${_trTbl.ui.mypage.accmodation.title.gstname[_state.lang]}</span>`;
                            __info_item.innerHTML += `<span id="value">${_guest.name}</span>`;
                            break;
                        case 'accmodation_rsvcode':
                            __info_item.innerHTML = `<span id="header">${_trTbl.ui.mypage.accmodation.title.rsvcode[_state.lang]}</span>`;
                            __info_item.innerHTML += `<span id="value">${_guest.id}</span>`;
                            break;
                        case 'accmodation_hotel':
                            __info_item.innerHTML = `<span id="header">${_trTbl.ui.mypage.accmodation.title.hotel[_state.lang]}</span>`;
                            __info_item.innerHTML += `<span id="value">${_hotel.name}</span>`;
                            break;
                        case 'accmodation_bed_type':
                            __info_item.innerHTML = `<span id="header">${_trTbl.ui.mypage.accmodation.title.bed_type[_state.lang]}</span>`;
                            __info_item.innerHTML += `<span id="value">${_guest.roomtype[_state.lang]}</span>`;
                            break;
                        case 'accmodation_room_num':
                            __info_item.innerHTML = `<span id="header">${_trTbl.ui.mypage.accmodation.title.room_num[_state.lang]}</span>`;
                            __info_item.innerHTML += `<span id="value">${_guest.room}</span>`;
                            break;
                        case 'accmodation_checkin':
                            __info_item.innerHTML = `<span id="header">${_trTbl.ui.mypage.accmodation.title.checkin[_state.lang]}</span>`;
                            __info_item.innerHTML += `<span id="value">${_guest.checkIn}</span>`;
                            break;
                        case 'accmodation_checkout':
                            __info_item.innerHTML = `<span id="header">${_trTbl.ui.mypage.accmodation.title.checkout[_state.lang]}</span>`;
                            __info_item.innerHTML += `<span id="value">${_guest.checkOut}</span>`;
                            break;
                    }
                    _accomo_info.appendChild(__info_item);
                }
                _div_mpbg_item.appendChild(_accomo_info);

                //Hotel info win
                let _hotel_info = document.createElement('div');
                _hotel_info.setAttribute("id", "mp_hotel_infowin");

                const _hotelinfo_item_list = ["address", "custominquiry", "resvinquiry"];
                for (let _j = 0; _j < _hotelinfo_item_list.length; _j++) {
                    let __info_item = document.createElement('div');
                    __info_item.className = 'hotelinfo_item';
                    switch (_hotelinfo_item_list[_j]) {
                        case 'address':
                            __info_item.innerHTML = `<span id="title">${_trTbl.ui.mypage.accmodation.title.address[_state.lang]}</span>`;
                            __info_item.innerHTML += `<span id="address">${_hotel.address[_state.lang]}</span>`;
                            break;
                        case 'custominquiry':
                            __info_item.innerHTML = `<span id="title">${_trTbl.ui.mypage.accmodation.title.custominquiry[_state.lang]}</span>`;
                            __info_item.innerHTML += `<span id="email">${_hotel.inquiry.custom.email}</span>`;
                            __info_item.innerHTML += `<span id="phone">${_hotel.inquiry.custom.phone[_state.lang]}</span>`;
                            break;
                        case 'resvinquiry':
                            __info_item.innerHTML = `<span id="title">${_trTbl.ui.mypage.accmodation.title.resvinquiry[_state.lang]}</span>`;
                            __info_item.innerHTML += `<span id="email">${_hotel.inquiry.reservation.email}</span>`;
                            __info_item.innerHTML += `<span id="phone">${_hotel.inquiry.reservation.phone[_state.lang]}</span>`;
                            break;
                    }
                    _hotel_info.appendChild(__info_item);
                }
                _div_mpbg_item.appendChild(_hotel_info);

            } else if (_mpinfo[_i].type == "message") {
                // 메시지 상태 오브젝트 초기화
                if (!("message" in _state.menu.main[_mmIdx])) {
                    _state.menu.main[_mmIdx]['message'] = {
                        'cnt': 0,
                        'cur': null,
                        'prev': null,
                    };
                    _state.menu.main[_mmIdx]['message'].cnt = _msg.length;
                }


                let _msg_title = document.createElement('div');
                _msg_title.setAttribute("id", "mp_message_title");
                let _msg_unread_cnt = 0;
                for (let _j = 1; _j <= _msg.length; _j++) {
                    if (_msg[_j].read == false) {
                        _msg_unread_cnt++;
                    }
                }
                _msg_title.textContent = _guest.name + _trTbl.ui.mypage.message.title.title[_state.lang].replace("_XX", _msg_unread_cnt.toString());
                _div_mpbg_item.appendChild(_msg_title);

                let _msg_table = document.createElement('div');
                _msg_table.setAttribute("id", "mp_message_table");

                let _msg_tblhdr = document.createElement('table');
                _msg_tblhdr.setAttribute("id", "mp_msg_tblhdr");
                _msg_tblhdr.innerHTML = '<tbody><tr>' +
                    '<th id="num">' + _trTbl.ui.mypage.message.title.table.num[_state.lang] + '</th>' +
                    '<th id="title">' + _trTbl.ui.mypage.message.title.table.title[_state.lang] + '</th>' +
                    '<th id="from">' + _trTbl.ui.mypage.message.title.table.from[_state.lang] + '</th>' +
                    '<th id="date">' + _trTbl.ui.mypage.message.title.table.date[_state.lang] + '</th>' +
                    '</tr></tbody>';
                _msg_table.appendChild(_msg_tblhdr);

                let _msg_tblrec = document.createElement('table');
                _msg_tblrec.setAttribute("id", "mp_msg_tblrec");
                let _sz_innerHTML = '<tbody>';
                let _num_msgIdx = 0;
                for (let _j = _msg.length; _j > 0; _j--) {
                    _sz_innerHTML += '<tr msgnum=' + _j + ' msgidx=' + _num_msgIdx.toString() + ' >';
                    if (_msg[_j].read == false) {
                        _sz_innerHTML += '<td id="num">' + _j.toString() + '</td>';
                    } else {
                        _sz_innerHTML += '<td id="num" class="read">' + _j.toString() + '</td>';
                    }
                    if (_msg[_j].multilanguage == false) {
                        _sz_innerHTML += '<td id="title">' + _msg[_j].title.default+'</td>';
                    } else {
                        _sz_innerHTML += '<td id="title">' + _msg[_j].title[_state.lang] + '</td>';
                    }
                    _sz_innerHTML += '<td id="from">' + _msg[_j].from + '</td>';
                    _sz_innerHTML += '<td id="date">' + _msg[_j].createdAt + '</td>';
                    _sz_innerHTML += '</tr>';
                    _num_msgIdx++;
                }
                _sz_innerHTML += '</tbody>';
                _msg_tblrec.innerHTML = _sz_innerHTML;
                _msg_table.appendChild(_msg_tblrec);
                _div_mpbg_item.appendChild(_msg_table);
            }

            _div_mp_bglist.appendChild(_div_mpbg_item);
        }

        _hndl_mpBg = $('#lst_mypagebg');
        _hndl_mpBg.owlCarousel({
            center: true,
            items: 1, //Number of Items on Screen what you want
            loop: true,
            nav: false,
            dots: false,
            margin: 0,
            smartSpeed: 700,
            autoWidth: false,
            mouseDrag: false,
            touchDrag: false,
            pullDrag: false,
            freeDrag: false,
            //MYPAGE는 항상 accommodation부터 시작
            startPosition: 0,
        });


        _hndl_mpSel = $('#lst_mypagesel');
        _hndl_mpSel.owlCarousel({
            center: true,
            items: 3, //Number of Items on Screen what you want
            loop: true,
            nav: false,
            dots: true,
            margin: 0,
            smartSpeed: 700,
            autoWidth: false,
            mouseDrag: false,
            touchDrag: false,
            pullDrag: false,
            freeDrag: false,
            //MYPAGE는 항상 accommodation부터 시작
            startPosition: 0,
        });

        $('.main .mypage').show();
        $('.main .mypage .bg').show();

        //메인 페이지->MyPage 페이지 화면 전환
        $('.main .mypage .slider').show(function() {
            $('.main').animate({ top: -1080, left: 0 }, 1000, function() {
                $('.main .mm').fadeOut(1000);
                $('#lst_mypagesel').trigger('translate.owl.carousel', [0]);

                $(document.activeElement).keydown(function(event) { //attach event listener
                    if (_state.menu.stage.cur == "mypage") {
                        if (event.keyCode == gRmtKey.left) {
                            $('#lst_mypagesel').trigger('prev.owl')
                            $('#lst_mypagebg').trigger('prev.owl')
                        } else if (event.keyCode == gRmtKey.right) {
                            $('#lst_mypagesel').trigger('next.owl')
                            $('#lst_mypagebg').trigger('next.owl')
                        } else if (event.keyCode == 38) {
                            //UP
                            __uifxn_AppFull_MyPageSelectMessage("up");
                        } else if (event.keyCode == gRmtKey.down) {
                            //DOWN
                            __uifxn_AppFull_MyPageSelectMessage("down");
                        } else if (event.keyCode == gRmtKey.enter) {
                            // 메시지 팝업 빌드 및 화면 전환
                            if (HotelTV.tvguide.program[_mmIdx].children[_state.menu.main[_mmIdx].cur].type == 'message') {
                                let _msginf = HotelTV.message;
                                let _cur_msglst_idx = _state.menu.main[_mmIdx]['message']['cur'];
                                // 현재 선택된 메시지의 디테일 정보 가져오기
                                let _cur_msgnum = $($('.main>.mypage>.bg>.owl-carousel .owl-item.center #mp_msg_tblrec tbody .focus')[0]).attr('msgnum');
                                // 마이페이지 메뉴에서 메시지를 선택하지 않고 엔터키를 누른경우
                                if (!(_cur_msgnum)) {
                                    return;
                                }


                                let _cur_msgdesc = _msginf[_cur_msgnum];
                                // Message card 구성
                                switch (_state.lang) {
                                    case 'ko-KR':
                                        $('.popup>.mypage>.message').css('font-family', 'Nanum Pen Script');
                                        $('.popup>.mypage>.message>#msg_ctz').css('font-size', '34px');
                                        $('.popup>.mypage>.message>#title').css('font-size', '50px');
                                        break;
                                    case 'zh-CN':
                                        $('.popup>.mypage>.message').css('font-family', 'Ma Shan Zheng');
                                        $('.popup>.mypage>.message>#msg_ctz').css('font-size', '34px');
                                        $('.popup>.mypage>.message>#title').css('font-size', '50px');
                                        break;
                                    case 'zh-TW':
                                        $('.popup>.mypage>.message').css('font-family', 'Ma Shan Zheng');
                                        $('.popup>.mypage>.message>#msg_ctz').css('font-size', '34px');
                                        $('.popup>.mypage>.message>#title').css('font-size', '50px');
                                        break;
                                    default:
                                        $('.popup>.mypage>.message').css('font-family', 'Parisienne');
                                        $('.popup>.mypage>.message>#msg_ctz').css('font-size', '32px');
                                        break;
                                }
                                $('.popup>.mypage>.message>#title').text(_cur_msgdesc.from);
                                if (_cur_msgdesc.multilanguage == true) {
                                    $('.popup>.mypage>.message>#msg_ctz').html(_cur_msgdesc.content[_state.lang].replace(/(?:\r\n|\r|\n)/g, '<br>'));
                                } else {
                                    $('.popup>.mypage>.message>#msg_ctz').html(_cur_msgdesc.content.default.replace(/(?:\r\n|\r|\n)/g, '<br>'));
                                }

                                //Back button
                                $('.popup>.mypage>.message>#btn_back').text(_trTbl.system.btn.back[_state.lang]);

                                //SHOW ANIMATION
                                if ($('.popup>.mypage>.message').css('display') == "none") {
                                    _state.menu.stage.cur = "popup_message_card";
                                    $('.main>.mypage>.slider').animate({ top: 1080, left: 0 }, 1000, function() {
                                        $('.popup>.mypage>.message').fadeIn(500);

                                        //메시지 읽음 처리
                                        HotelTV.api.SetMessageStatus(_cur_msgdesc._id);
                                        _cur_msgdesc.read = true;
                                        $('.main>.mypage>.bg>.owl-carousel .owl-item #mp_msg_tblrec tr').filter("[msgidx='" + _cur_msglst_idx.toString() + "']").children('td#num').addClass('read');
                                        __uifxn_AppFull_TopWidjet_BuildMsgCnt();
                                    });
                                }
                            }
                        } else if (event.keyCode == gRmtKey.back) {
                            // 메인 메뉴로 귀환
                            $(document.activeElement).off('keydown');
                            $('.main .mm').show(function() {
                                $('#lst_mmsel').trigger('refresh.owl.carousel', [0]);
                            });
                            $('.main').animate({ top: 0, left: 0 }, 1000, () => {
                                $('#lst_mypagesel').off('translate.owl.carousel');

                                $('#lst_mypagebg').owlCarousel('destroy');
                                $('#lst_mypagesel').owlCarousel('destroy');

                                $('.main .mypage .slider #lst_mypagesel div').remove();
                                $('.main .mypage .bg #lst_mypagebg div').remove();
                                $('.main .mypage').hide();
                                _hndl_mpSel = null;
                                _hndl_mpBg = null;
                                _state.menu.stage.cur = "main"
                                setTimeout(function() {
                                    __uifxn_AppFull_ShowMMHotKeyBtn(true);
                                }, 500);
                            });
                        } else {
                            console.log("MYPAGE KEYEVT: Skip events::>" + event.keyCode);
                        }
                    } else if (_state.menu.stage.cur == "popup_message_card") {
                        if (event.keyCode == gRmtKey.back) {
                            if ($('.popup>.mypage>.message').css('display') != "none") {
                                $('.popup>.mypage>.message').fadeOut(500, function() {
                                    _state.menu.stage.cur = "mypage";
                                    $('.main>.mypage>.slider').animate({ top: 864, left: 0 }, 1000)
                                });
                            }
                        } else {
                            console.log("POPUP MESSAGE CARD KEYEVT: Skip events::>" + event.keyCode);
                        }
                    } else {
                        console.log("INVALID MYPAGE SUBMENU STAGE::>" + _state.menu.stage.cur);
                    }
                });
                _state.menu.stage.cur = "mypage";
            });

            $('#lst_mypagesel').on('translate.owl.carousel', function(event) {
                const __fxn_getMyPaggeItemIndex = function(_object, _type) {
                    for (__j = 1; __j <= _object.length; __j++) {
                        if (_object[__j].type == _type) {
                            return __j;
                        }
                    }
                }

                // 메뉴 셀렉터 좌/우 헨들링 및 이펙트
                let uiCtrl_idx = 0;
                if (typeof event.item != 'undefined') {
                    uiCtrl_idx = event.item.index;
                } else {
                    uiCtrl_idx = $('.main .mypage .slider .owl-item.active.center').index();
                }
                //console.log("MYPAGE EVT(TRANSLATED) IDX::>" + uiCtrl_idx);
                if ($('.main .mypage .slider .owl-item').eq(uiCtrl_idx).children('.item').length == 1) {
                    let _mp_sm = $('.main .mypage .slider .owl-item').eq(uiCtrl_idx).children('.item')[0].id;

                    if (_mp_sm == "mpsel_accommodation") {
                        // MYPAGE서브 메뉴 인덱스 갱신
                        _state.menu.main[_mmIdx].cur = __fxn_getMyPaggeItemIndex(_mpinfo,'accommodation');
                    } else if (_mp_sm == "mpsel_message") {
                        let __curMsgDspIdx = 0;
                        // MYPAGE서브 메뉴 인덱스 갱신
                        _state.menu.main[_mmIdx].cur = __fxn_getMyPaggeItemIndex(_mpinfo,'message');

                        // 메시지 포커싱
                        if ('message' in Object.keys(_state.menu.main[_mmIdx])) {
                            __curMsgDspIdx = _state.menu.main[_mmIdx].message.cur;
                        } else {
                            _state.menu.main[_mmIdx]['message'] = {
                                "cnt": Object.keys(_msg).length,
                                "cur": __curMsgDspIdx,
                                "prev": null,
                            }
                        }
                        $('.main>.mypage>.bg>.owl-carousel .owl-item #mp_msg_tblrec tr').removeClass('focus');
                        $('.main>.mypage>.bg>.owl-carousel .owl-item #mp_msg_tblrec tr').filter("[msgidx='" + __curMsgDspIdx + "']").addClass('focus');
                    }
                    console.log("MYPAGE EVT(TRANSLATED) MYPAGE MENU::>" + _state.menu.main[_mmIdx].cur);

                    HotelTV.api.ReportEvent([
                        {
                            'power': true,
                            'location':
                            {
                                'conId': _mpinfo[_state.menu.main[_mmIdx].cur].id
                            }
                        }])
                }
                $('.main .mypage .slider .owl-item.focus').removeClass('focus');
                $('.main .mypage .slider .owl-item.unfocus').removeClass('unfocus');
                $('.main .mypage .slider .owl-item').eq(uiCtrl_idx).addClass('focus');
                $('.main .mypage .slider .owl-item').eq(uiCtrl_idx - 1).addClass('unfocus');
                $('.main .mypage .slider .owl-item').eq(uiCtrl_idx + 1).addClass('unfocus');
            });
        });


    }

    /**
     * HotelTV UI[AppFull] Wrapper Function::> request tv channel function
     */
    function __uifxn_AppFull_TVRequestChannel(_force_ctg_item_idx, _force_ch_item_idx) {
        const _state = HotelTV.state;
        const _trTbl = HotelTV.translation;
        const _mmIdx_tv = _state.menu.main.cur;
        let _tvCtgIdx = _state.menu.main[_mmIdx_tv].cur;
        let _tvChIdx = _state.menu.main[_mmIdx_tv][_tvCtgIdx].cur;
        const _program = HotelTV.tvguide.program;
        const _tvProg = _program[_mmIdx_tv].categories;
        let _tvChInfo = _tvProg[_tvCtgIdx].channels[_tvChIdx];
        let _need_to_changeTVChannel = false;
        let _tm_diff_ms = 0;

        if (_lastTm.tvchannel_changed == null) {
            _lastTm.tvchannel_changed = new Date();
            _need_to_changeTVChannel = true;
        } else {
            let _tm_cur = new Date();
            _tm_diff_ms = Math.floor(_tm_cur.getTime() - _lastTm.tvchannel_changed.getTime());
            //마지막 TV채널 변경 시간 갱신
            _lastTm.tvchannel_changed = _tm_cur;

            if (_tm_diff_ms > 200) {
                _need_to_changeTVChannel = true;
            }
        }

        // 번호키로 채널 변경시 카테고리와 채널 아이탬의 인덱스
        if ( _force_ctg_item_idx!=null && _force_ch_item_idx!=null ){
            //console.log(`Override channel category(${_force_ctg_item_idx}) and channel index(${_force_ch_item_idx})`);
            _tvCtgIdx = _force_ctg_item_idx;
            _tvChIdx = _force_ch_item_idx;
            _tvChInfo = _tvProg[_tvCtgIdx].channels[_tvChIdx];
        }




        if (_need_to_changeTVChannel == true) {
            let _chReqParam = {};
            console.log(`CHANGE::TVCTG[${_tvProg[_tvCtgIdx].name}]` +
                ` CUR CH IDX::>${_tvChIdx} CHNAME:${_tvChInfo.name}  EPGID: ${_tvChInfo.epg_id} URL::>${_tvChInfo.url} TMDIFF::>${_tm_diff_ms}`);

            if (_tvChInfo.type == "ptcrf") {
                // RF
                _chReqParam['rf'] = {
                    "type": _tvChInfo.RFType,
                    "major": _tvChInfo.majorNo,
                    "minor": _tvChInfo.minorNo,
                    "program": _tvChInfo.programNo,
                    "frequency": 0,
                };
            } else if (_tvChInfo.type == "ipstream") {
                // IP STREAM URL
            } else if (_tvChInfo.type == "encoder") {
                // ENCODER
            }
            HotelTV.hcap.ChannelSetup(_tvChInfo.type, _chReqParam);

            //TODO: 아래 실제 채널 셋업 부분 주석처리 되어 있는데, IP와 RF모두 처리 할 수 있도록 구현할것
            //let _uri_stream = _tvChInfo.url.split('://@')[1];
            //let _typ_proto = _tvChInfo.url.split('://@')[0];
            //let _uri_ip = _uri_stream.split(':')[0];
            //let _uri_port = _uri_stream.split(':')[1];
            //console.log(`ip = ${_uri_ip} port=${_uri_port} protocol=${_typ_proto}`);
            //HotelTV.hcap.ChannelSetup("ip", { "ip": _uri_ip, "port": Number(_uri_port), "ptype": _typ_proto });


            // {
            //     let min = Math.ceil(0);
            //     let max = Math.floor(16);
            //     let _major = Math.floor(Math.random() * (max - min + 1)) + min;
            //     console.log("Major=5 minor=" + _major);
            //     HotelTV.hcap.ChannelSetup("rf_analog_ntsc", { "major": _major, "minor": 0 });
            // }

            HotelTV.api.ReportEvent([{
                'power': true,
                'location':{
                    'category':_tvProg[_tvCtgIdx].id,
                    'chId': _tvChInfo.id,
                }
            }])
        } else {
            console.log(`SKIPPED::TVCTG[${_tvProg[_tvCtgIdx].name}]` +
                ` CUR CH IDX::>${_tvChIdx} EPGID: ${_tvChInfo.epg_id} URL::>${_tvChInfo.url} TMDIFF::>${_tm_diff_ms}`);
        }
    }

    /**
     * HotelTV UI[AppFull] Wrapper Function::> build tv channel shortcut list
     * @param {string} _action parameter
     */
    function __uifxn_AppFull_TVDrawShortCutList(_show, _action, _keyCode) {
        let _state = HotelTV.state;
        let _mmIdx = _state.menu.main.cur;
        let _trTbl = HotelTV.translation;
        let _program = HotelTV.tvguide.program;
        let _tvProg = _program[_mmIdx].categories;
        let _tvChitemAll = null;

        const __fxn_getTvCtgAllId = function() {
            for (let _ctgidx = 1; _ctgidx <= _tvProg.length; _ctgidx++) {
                if ( _tvProg[_ctgidx].name=="all" ){
                    return _ctgidx;
                }
            }
            // ALL채널의 디폴트 인덱스번호는 1이라고 간주
            return 1;
        }

        const __fxn_getTvIdxByChnumber = function(_dic_channel, _ch_num) {
            for (let _ctgidx = 1; _ctgidx <= _tvProg.length; _ctgidx++) {
                if ( _tvProg[_ctgidx].name=="all" ){
                    return _ctgidx;
                }
            }
            // ALL채널의 디폴트 인덱스번호는 1이라고 간주
            return 1;
        }

        const __fxn_getChItemValue = function(_object, _key) {
            return _object[_key];
        }






        // if (!(_mmIdx in _state.menu.main)) {
        //     _state.menu.main[_mmIdx] = {
        //         'cnt': 0,
        //         'cur': null, //현재 TV카테고리
        //         'prev': null, //마지막 TV카테고리
        //     };
        //     // TV Program category 개수
        //     _state.menu.main[_mmIdx].cnt = _tvProg.length;
        // }

        let _elTvScutRoot = $('.main .tv .shortcut');
        let _elTvScutSugesstion = _elTvScutRoot.children('#suggestion');
        let _elTvScutChlistTbl = _elTvScutSugesstion.children('.ch_list');
        let _elTvScutChlistRecord = _elTvScutChlistTbl.children('tbody');

        // TV바로가기 번호키 UI 드로잉
        if ( _action=="build" )
        {
            const _tbl_keycode_to_num = {
                "48" : 0,
                "49" : 1,
                "50" : 2,
                "51" : 3,
                "52" : 4,
                "53" : 5,
                "54" : 6,
                "55" : 7,
                "56" : 8,
                "57" : 9,
            };

            // ALL 카테고리 TV채널 정보 가져오기
            _tvChitemAll = _tvProg[__fxn_getTvCtgAllId()].channels;

            try {
                let first_item = true;
                // 기존 레코드 제거
                if (_elTvScutChlistRecord.children('tr').length) {
                    _elTvScutChlistRecord.children('tr').remove();
                }

                _state.tv.shortkey = {
                    "idx": "1",
                    "scroll_offset": 0,
                    "ch_item_idx": 1,
                };

                for (let _idx = 1; _idx <= _tvChitemAll.length; _idx++)
                {
                    let _ChItem = _tvChitemAll[_idx];

                    if ( __fxn_getChItemValue(_ChItem, "number").includes( _tbl_keycode_to_num[_keyCode].toString())==true )
                    {
                        var _elTr_ChtmesRec = document.createElement('tr');
                        var _elDiv_ChItmesRec = document.createElement('div');
                        _elDiv_ChItmesRec.className = "scitem";
                        // all카테고리의 channels의 해당 채널의 아이탬 인덱스
                        _elDiv_ChItmesRec.setAttribute("item_idx", _idx);
                        if ( first_item==true ){
                            _state.tv.shortkey.ch_item_idx = _idx;
                            first_item = false;
                        }

                        var _elDiv_ChItmesRecChIcon = document.createElement('div');
                        _elDiv_ChItmesRecChIcon.setAttribute("id", "logo");
                        _elDiv_ChItmesRecChIcon.style.backgroundImage = "url('" + __fxn_getChItemValue(_ChItem, "logo").file.download + "')";
                        _elDiv_ChItmesRec.appendChild(_elDiv_ChItmesRecChIcon);

                        // 채널 번호
                        var _elDiv_ChItmesRecChNum = document.createElement('div');
                        _elDiv_ChItmesRecChNum.setAttribute("id", "num");
                        _elDiv_ChItmesRecChNum.textContent = Number(__fxn_getChItemValue(_ChItem, "number"));
                        _elDiv_ChItmesRec.appendChild(_elDiv_ChItmesRecChNum);

                        var _elDiv_ChItmesRecName = document.createElement('div');
                        _elDiv_ChItmesRecName.setAttribute("id", "title");
                        _elDiv_ChItmesRecName.textContent = __fxn_getChItemValue(_ChItem, "title")[_state.lang];
                        _elDiv_ChItmesRec.appendChild(_elDiv_ChItmesRecName);

                        _elTr_ChtmesRec.appendChild(_elDiv_ChItmesRec);
                        _elTvScutChlistRecord.append(_elTr_ChtmesRec);
                    }
                }
                // Activate first order lists
                _elTvScutChlistRecord.children('tr').first().addClass('active');

                // 화면 출력
                if ( _elTvScutRoot.css('display') == 'none') {
                    _elTvScutRoot.fadeIn(500);
                }
            } catch (_error) {
                console.log(`Fail to call API::> ${_error}`);
            }
        }
        else if ( _action=="destory")
        {
            // 기존 레코드 제거
            if (_elTvScutChlistRecord.children('tr').length) {
                _elTvScutChlistRecord.children('tr').remove();
            }

            // 채널 요청
            __uifxn_AppFull_TVRequestChannel(__fxn_getTvCtgAllId(), _state.tv.shortkey.ch_item_idx);

            if ( _elTvScutRoot.css('display') != 'none') {
                _elTvScutRoot.fadeOut(500);
            }
        }
        else if ( _action=="move" )
        {
            if ( _keyCode == gRmtKey.up || _keyCode==gRmtKey.chup ) {
                let selectedTblItem = _elTvScutChlistRecord.children('tr.active').prev("#record tr");

                if (selectedTblItem.length) {
                    _elTvScutChlistRecord.children('tr.active').removeClass("active");
                    selectedTblItem.addClass('active');
                    _state.tv.shortkey.idx = selectedTblItem.prop('rowIndex');
                    //_state.tv.shortkey.ch_item_idx = Number(selectedTblItem.children(".scitem").children("#num").text());
                    _state.tv.shortkey.ch_item_idx = Number(selectedTblItem.children(".scitem").attr("item_idx"));

                    // 스크롤이 필요한 경우 스크롤링 하기
                    let _scrollTopVal = _state.tv.shortkey.scroll_offset;
                    _scrollTopVal -= selectedTblItem.prop('scrollHeight');
                    _elTvScutChlistRecord.animate({ scrollTop: _scrollTopVal }, selectedTblItem.height());
                    _state.tv.shortkey.scroll_offset = _scrollTopVal;
                }
            } else if ( _keyCode == gRmtKey.down || _keyCode==gRmtKey.chdown ) {
                let selectedTblItem = _elTvScutChlistRecord.children('tr.active').next("#record tr");

                if (selectedTblItem.length) {
                    _elTvScutChlistRecord.children('tr.active').removeClass("active");
                    selectedTblItem.addClass('active');
                    _state.tv.shortkey.idx = selectedTblItem.prop('rowIndex');
                    //_state.tv.shortkey.ch_item_idx = Number(selectedTblItem.children(".scitem").children("#num").text());
                    _state.tv.shortkey.ch_item_idx = Number(selectedTblItem.children(".scitem").attr("item_idx"));

                    // 스크롤이 필요한 경우 스크롤링 하기
                    let _scrollTopVal = _state.tv.shortkey.scroll_offset;
                    _scrollTopVal += selectedTblItem.prop('scrollHeight');
                    _elTvScutChlistRecord.animate({ scrollTop: _scrollTopVal }, selectedTblItem.height());
                    _state.tv.shortkey.scroll_offset = _scrollTopVal;
                }
            }
        }
    }

    /**
     * HotelTV UI[AppFull] Wrapper Function::> update tv channel list within selected tv category
     * @param {string} _action parameter
     */
    function __uifxn_AppFull_TVUpdateChList(_action) {
        const _state = HotelTV.state;
        const _mmIdx_tv = _state.menu.main.cur;
        const _tvCtgIdx = _state.menu.main[_mmIdx_tv].cur;
        const _tvChIdx = _state.menu.main[_mmIdx_tv][_tvCtgIdx].cur; //프로파일 상의 채널 인덱스(문자열)
        let tv_chElIdx = Number(_tvChIdx) - 1; //엘리멘트 인덱스(0베이스)

        //CENTER로 마킹된 엘리멘트 가져오기
        let _hndlOwlCtrEl = $('.main .tv .bg .owl-carousel .owl-stage-outer .owl-item.center');
        if (_hndlOwlCtrEl.length == 1) {
            //현재 ACTIVATED(CENTER)된 OWL로부터 tvctgfrm_xxx과 같은 아이디 가져오기
            let _targetChListId = $(_hndlOwlCtrEl.find(".item")).attr('id');
            //_targetChListId는 tvctgfrm_xxxx와 같은 형식임
            let _el_target = $('#' + _targetChListId + ' .tvctg_chlist');
            if (_action == "on_load") {
                if (_el_target.find('.focused').length == 0) {
                    _el_target.stop().animate({ scrollTop: ((tv_chElIdx - 2) * 120).toString() }, 500, function() {
                        __uifxn_AppFull_TVRequestChannel(null, null);
                    });
                    _el_target.each(function(index, item) {
                        $($(item).children()[tv_chElIdx]).addClass("focused");
                    });
                    _state.menu.stage.cur = "tvCtgShow";
                    console.log("1st time ....");
                }
            } else if (_action == "ch_up") {
                if ((tv_chElIdx >= 2) && (tv_chElIdx < (Number(_state.menu.main[_mmIdx_tv][_tvCtgIdx].cnt) - 3))) {
                    _el_target.stop().animate({ scrollTop: ((tv_chElIdx - 2) * 120).toString() }, 500, function() {
                        __uifxn_AppFull_TVRequestChannel(null, null);
                    });
                } else {
                    __uifxn_AppFull_TVRequestChannel(null, null);
                }

                _el_target.each(function(index, item) {
                    $($(item).children()[tv_chElIdx + 1]).removeClass("focused");
                    $($(item).children()[tv_chElIdx]).addClass("focused");
                });
            } else if (_action == "ch_down") {
                if ((tv_chElIdx > 2) && (tv_chElIdx < (Number(_state.menu.main[_mmIdx_tv][_tvCtgIdx].cnt) - 2))) {
                    _el_target.stop().animate({ scrollTop: ((tv_chElIdx - 2) * 120).toString() }, 500, function() {
                        __uifxn_AppFull_TVRequestChannel(null, null);
                    });
                } else {
                    __uifxn_AppFull_TVRequestChannel(null, null);
                }
                _el_target.each(function(index, item) {
                    $($(item).children()[tv_chElIdx - 1]).removeClass("focused");
                    $($(item).children()[tv_chElIdx]).addClass("focused");
                });
            }
        } else {
            console.log("ERROR::> No centered Item");
        }
    }

    /**
     * HotelTV UI[AppFull] Wrapper Function::> Buildup sub menu and main bg
     */
    function __uifxn_AppFull_Update_CtzThumbnail() {
        let _state = HotelTV.state;
        let _mmIdx = _state.menu.main.cur;
        let _smIdx = _state.menu.main[_mmIdx].cur;
        if (_state.menu.main[_mmIdx][_smIdx] && _state.menu.main[_mmIdx][_smIdx].cur) {
            let _ctzidx = _state.menu.main[_mmIdx][_smIdx].cur;
            let _program = HotelTV.tvguide.program;
            let _ctzinfo = _program[_mmIdx].children[_smIdx].children;

            if (_state.menu.main[_mmIdx][_smIdx].thumbimg[_ctzidx].idx < _state.menu.main[_mmIdx][_smIdx].thumbimg[_ctzidx].cnt) {
                _state.menu.main[_mmIdx][_smIdx].thumbimg[_ctzidx].idx++;
            } else {
                _state.menu.main[_mmIdx][_smIdx].thumbimg[_ctzidx].idx = 1;
            }
            let _img_ctz_thumbnail = $('.main .ctzgen .bg .owl-carousel .owl-item.active .ctz_desc_frame #ctz_thumbnail img');

            _img_ctz_thumbnail.fadeOut(1000, function() {
                _img_ctz_thumbnail.attr({
                    src: _ctzinfo[_ctzidx].thumbnails.files[_state.lang][_state.menu.main[_mmIdx][_smIdx].thumbimg[_ctzidx].idx].download
                });
            }).fadeIn(1000);
            //console.log("CTZ(THUMBNAIL) UPDATED::> " + _state.menu.main[_mmIdx][_smIdx].thumbimg[_ctzidx].idx);
        }
    }


    /**
     * HotelTV UI[AppFull] Wrapper Function::> Buildup sub menu and main bg
     */
    function __uifxn_AppFull_BldPage_CtzGeneral() {
        let _trTbl = HotelTV.translation;
        let _state = HotelTV.state;
        let _mmIdx = _state.menu.main.cur;
        let _smIdx = _state.menu.main[_mmIdx].cur;
        let _program = HotelTV.tvguide.program;
        let _ctzinfo = _program[_mmIdx].children[_smIdx].children;


        if (!(_smIdx in _state.menu.main[_mmIdx])) {
            _state.menu.main[_mmIdx][_smIdx] = {
                'cnt': 0,
                'cur': null,
                'prev': null,
                'thumbimg': {}
            };
            _state.menu.main[_mmIdx][_smIdx].cnt = _ctzinfo.length;
        }

        // UI State Flag 설정
        _state.menu.stage.cur = "preparing_ctz_general";
        if (_state.menu.main[_mmIdx][_smIdx].cur == null) {
            _state.menu.main[_mmIdx][_smIdx].cur = Object.keys(_ctzinfo)[0];
        }

        // 컨텐트 매뉴 백그라운드 이미지 노드를 동적으로 구성
        let _div_ctzgen_bglist = document.querySelector('#lst_ctzgenbg');
        for (let _ctzidx = 1; _ctzidx <= _ctzinfo.length; _ctzidx++) {
            let _div_ctz_item = document.createElement('div');
            let _sz_styleOpt = null;

            _div_ctz_item.className = 'item';
            _div_ctz_item.id = _ctzinfo[_ctzidx].id;
            _div_ctz_item.setAttribute("cgzgenid", _ctzidx);
            _sz_styleOpt = "--bg_noplay: url(" + _ctzinfo[_ctzidx].background.file.download + "); ";
            _sz_styleOpt += "background-repeat: no-repeat; background-position: center bottom; background-size: 100% 100%; ";
            _div_ctz_item.setAttribute("style", _sz_styleOpt);


            // 컨텐트 DESCRIPTION용 DIV 삽입
            let _div_ctz_frame = document.createElement('div');
            _div_ctz_frame.setAttribute("class", "ctz_desc_frame");

            // 컨텐트 타이틀 삽입
            let _div_ctz_title = document.createElement('div');
            _div_ctz_title.setAttribute("id", "ctz_title");
            _div_ctz_title.textContent = _ctzinfo[_ctzidx].title[_state.lang];
            _div_ctz_frame.appendChild(_div_ctz_title);

            // 컨텐트 썸네일 삽입
            let _div_ctz_thumbnail = document.createElement('div');
            _div_ctz_thumbnail.setAttribute("id", "ctz_thumbnail");

            let _img_ctz_thumbnail = document.createElement('img');
            _img_ctz_thumbnail.src = _ctzinfo[_ctzidx].thumbnails.files[_state.lang][1].download;
            _div_ctz_thumbnail.appendChild(_img_ctz_thumbnail);
            _div_ctz_frame.appendChild(_div_ctz_thumbnail);

            // 썸네일 에니메이션 관리용 맴버 추가 및 초기화
            _state.menu.main[_mmIdx][_smIdx].thumbimg[_ctzidx] = { "cnt": _ctzinfo[_ctzidx].thumbnails.files[_state.lang].length, "idx": 1 };

            // 컨텐트 설명 삽입
            let _div_ctz_desc = document.createElement('div');
            _div_ctz_desc.setAttribute("id", "ctz_description");
            _div_ctz_desc.innerHTML = "<p>" + _ctzinfo[_ctzidx].description[_state.lang].replace(/(?:\r\n|\r|\n)/g, '<br>') + "</p>";
            _div_ctz_frame.appendChild(_div_ctz_desc);

            _div_ctz_item.appendChild(_div_ctz_frame);


            // 나중에 구현하기로 하고 조선프로젝트에서 우선 스킵
            // // 컨텐트 IMAGE VIEWER DIV 삽입
            // let _div_ctz_imgvwr = document.createElement('div');
            // _div_ctz_imgvwr.setAttribute("class", "ctz_imgvwr_frame");
            // _div_ctz_item.appendChild(_div_ctz_imgvwr);

            // // 이미지 뷰어를 사용하는 경우 경우, PLAY안내 버튼 노출
            // if (_ctzinfo[_ctzidx].images.enable == true && _ctzinfo[_ctzidx].images.files[_state.lang]) {
            //     let _div_ctz_vwrctrl = document.createElement('div');
            //     _div_ctz_vwrctrl.setAttribute("class", "ctz_mv_ctrl");
            //     // _div_ctz_vwrctrl.setAttribute("video_url", _ctzinfo[_ctzidx].video.files[_state.lang].download);
            //     _sz_styleOpt = '--playmsg: "' + _trTbl.ui.player.watch_imgshow[_state.lang] + '";';
            //     _sz_styleOpt += '--stopmsg: "' + _trTbl.ui.player.stop_imgshow[_state.lang] + '";';
            //     _div_ctz_vwrctrl.setAttribute("style", _sz_styleOpt);
            //     _div_ctz_item.appendChild(_div_ctz_vwrctrl);
            // }

            // 동영상이 있는 경우, PLAY안내 버튼 노출
            if (_ctzinfo[_ctzidx].video.enable == true && _ctzinfo[_ctzidx].video.files[_state.lang]) {
                let _div_ctz_mvctrl = document.createElement('div');
                _div_ctz_mvctrl.setAttribute("class", "ctz_mv_ctrl");
                _div_ctz_mvctrl.setAttribute("video_url", _ctzinfo[_ctzidx].video.files[_state.lang].download);
                _sz_styleOpt = '--playmsg: "' + _trTbl.ui.player.watch_movie[_state.lang] + '";';
                _sz_styleOpt += '--stopmsg: "' + _trTbl.ui.player.stop_movie[_state.lang] + '";';
                _div_ctz_mvctrl.setAttribute("style", _sz_styleOpt);
                _div_ctz_item.appendChild(_div_ctz_mvctrl);
            }

            _div_ctzgen_bglist.appendChild(_div_ctz_item);
        }

        _hndl_ctzGenBg = $('#lst_ctzgenbg');
        _hndl_ctzGenBg.owlCarousel({
            center: false,
            items: 1, //Number of Items on Screen what you want
            loop: true,
            margin: 0,
            smartSpeed: 0,
            lazyLoad: true,
            mouseDrag: false,
            touchDrag: false,
            pullDrag: false,
            freeDrag: false,
            startPosition: Number(_state.menu.main[_mmIdx][_smIdx].cur) - 1,
        });

        //서브 페이지->콘텐트 페이지 화면 전환
        $('.main .ctzgen').show(function() {
            $('.main .ctzgen .bg').show(function() {
                $('.main').animate({ top: -2160, left: 0 }, 1000, function() {
                    $('.main .sub').fadeOut(600);
                    //$('#lst_ctzgenbg').trigger('translate.owl.carousel', [0]);
                    $('#lst_ctzgenbg').trigger('translate.owl.carousel', [0, 500, true]);
                });
            });
        });


        $('#lst_ctzgenbg').on('change.owl.carousel', function(event) {
            // Update HotelTV sub menu status
            let _state = HotelTV.state;
            let _mmIdx = _state.menu.main.cur;
            let _smIdx = _state.menu.main[_mmIdx].cur;
            let _program = HotelTV.tvguide.program;
            let _ctzinfo = _program[_mmIdx].children[_smIdx].children;
            _state.menu.main[_mmIdx][_smIdx].prev = Object.keys(_ctzinfo)[event.page.index];
        });

        $('#lst_ctzgenbg').on('changed.owl.carousel', function(event) {
            // Update HotelTV sub menu status
            let _state = HotelTV.state;
            let _mmIdx = _state.menu.main.cur;
            let _smIdx = _state.menu.main[_mmIdx].cur;
            let _program = HotelTV.tvguide.program;
            let _ctzinfo = _program[_mmIdx].children[_smIdx].children;
            _state.menu.main[_mmIdx][_smIdx].cur = Object.keys(_ctzinfo)[event.page.index];

            //if (_ctzinfo[_state.menu.main[_mmIdx][_smIdx].cur].thumbnails.autoplay == true )
            {
                if (_ctzinfo[_state.menu.main[_mmIdx][_smIdx].cur].thumbnails.interval > 0 && _ctzinfo[_state.menu.main[_mmIdx][_smIdx].cur].thumbnails.files[_state.lang].length > 1) {
                    if (_hndl_tmrCtzThumbAni != null) {
                        clearInterval(_hndl_tmrCtzThumbAni);
                        _hndl_tmrCtzThumbAni = null;
                        console.log("TMR(CTZ ANI)::>Destoried...");
                    }
                    _hndl_tmrCtzThumbAni = setInterval(__uifxn_AppFull_Update_CtzThumbnail, Number(_ctzinfo[_state.menu.main[_mmIdx][_smIdx].cur].thumbnails.interval) * 1000);
                    console.log("TMR::>Created...");
                } else {
                    if (_hndl_tmrCtzThumbAni != null) {
                        clearInterval(_hndl_tmrCtzThumbAni);
                        _hndl_tmrCtzThumbAni = null;
                        console.log("TMR(CTZ ANI)::>Destoried...");
                    }
                }
            }

            if (_ctzinfo[_state.menu.main[_mmIdx][_smIdx].cur].images.autoplay == true )
            {
                // if (_ctzinfo[_state.menu.main[_mmIdx][_smIdx].cur].thumbnails.interval > 0 && _ctzinfo[_state.menu.main[_mmIdx][_smIdx].cur].thumbnails.files[_state.lang].length > 1) {
                //     if (_hndl_tmrCtzThumbAni != null) {
                //         clearInterval(_hndl_tmrCtzThumbAni);
                //         _hndl_tmrCtzThumbAni = null;
                //         console.log("TMR(CTZ ANI)::>Destoried...");
                //     }
                //     _hndl_tmrCtzThumbAni = setInterval(__uifxn_AppFull_Update_CtzThumbnail, Number(_ctzinfo[_state.menu.main[_mmIdx][_smIdx].cur].thumbnails.interval) * 1000);
                //     console.log("TMR::>Created...");
                // } else {
                //     if (_hndl_tmrCtzThumbAni != null) {
                //         clearInterval(_hndl_tmrCtzThumbAni);
                //         _hndl_tmrCtzThumbAni = null;
                //         console.log("TMR(CTZ ANI)::>Destoried...");
                //     }
                // }
            }

            console.log("CTZ(GEN) IDX::>" + _state.menu.main[_mmIdx][_smIdx].cur);
            HotelTV.api.ReportEvent([{'power': true, 'location':{'conId':_ctzinfo[_state.menu.main[_mmIdx][_smIdx].cur].id}}])

            if ( _state.menu.stage.cur=="preparing_ctz_general" ){
                setTimeout(function() {
                    _state.menu.stage.cur = "ctzgen";
                }, 2000);
            }
        });

        $('#lst_ctzgenbg').on('translate.owl.carousel', function(event) {
            // 메뉴 셀렉터 좌/우 헨들링 및 이펙트
            let idx = 0;
            if (typeof event.item != 'undefined') {
                idx = event.item.index;
            } else {
                idx = $('.main .ctzgen .bg .owl-item.active').index();
            }

            if ($('.main .ctzgen .bg .owl-item').eq(idx).hasClass('movieplay') == true) {
                if ($('.owl-theme .owl-nav.disabled+.owl-dots').css('display') != 'none') {
                    $('.owl-theme .owl-nav.disabled+.owl-dots').fadeOut(500);
                }
            } else {
                if ($('.owl-theme .owl-nav.disabled+.owl-dots').css('display') == 'none') {
                    $('.owl-theme .owl-nav.disabled+.owl-dots').fadeIn(500);
                }
            }
        });
    }


    /**
     * HotelTV UI[AppFull] Wrapper Function::> Buildup sub menu and main bg
     */
    function __uifxn_AppFull_BldPage_SubGeneral() {
        let _trTbl = HotelTV.translation;
        let _state = HotelTV.state;
        let _mmIdx = _state.menu.main.cur;
        let _program = HotelTV.tvguide.program;
        let _sminfo = _program[_mmIdx].children;

        if (!(_mmIdx in _state.menu.main)) {
            _state.menu.main[_mmIdx] = {
                'cnt': 0,
                'cur': null,
                'prev': null,
            };
            _state.menu.main[_mmIdx].cnt = _sminfo.length;
        }

        // 초기 메인 메뉴 KEY설정
        _state.menu.stage.cur = "preparing_sub";
        if (_state.menu.main[_mmIdx].cur == null) {
            _state.menu.main[_mmIdx].cur = Object.keys(_sminfo)[0];
        }

        // 서브 메뉴 셀렉터 노드를 동적으로 구성
        let _div_sm_slist = document.querySelector('#lst_smsel');
        for (let _idx = 1; _idx <= _sminfo.length; _idx++) {
            let _div_sm_item = document.createElement('div');
            _div_sm_item.className = 'item';
            _div_sm_item.id = _sminfo[_idx].id;
            _div_sm_item.setAttribute("smid", _idx);

            // Append Sub elements::title
            let _sm_item_title = document.createElement('div');
            _sm_item_title.setAttribute("id", "sm_item_title");

            if (_sminfo[_idx].showTitle && _sminfo[_idx].showTitle == true) {
                _sm_item_title.textContent = _sminfo[_idx].title[_state.lang];
            }

            // Append Sub elements::icon
            let _sm_item_icon = document.createElement('div');
            _sm_item_icon.setAttribute("id", "sm_item_icon");
            let _sz_styleOpt = "--icon_unfocus: url(" + _sminfo[_idx].unfocusIcon.file.download + "); ";
            _sz_styleOpt += "--icon_focus: url(" + _sminfo[_idx].focusIcon.file.download + "); ";
            //_sz_styleOpt += "background-repeat: no-repeat; background-position: center bottom; background-size: 100% 100%; ";
            _sz_styleOpt += "background-repeat: no-repeat; background-position: center bottom;";
            _sm_item_icon.setAttribute("style", _sz_styleOpt);

            _div_sm_item.appendChild(_sm_item_icon);
            _div_sm_item.appendChild(_sm_item_title);

            _div_sm_slist.appendChild(_div_sm_item);
        }

        // 서브 메뉴 백그라운드 이미지 노드를 동적으로 구성
        let _div_sm_bglist = document.querySelector('#lst_smbg');
        for (let _idx = 1; _idx <= _sminfo.length; _idx++) {
            let _div_sm_item = document.createElement('div');
            let _sz_styleOpt = null;

            _div_sm_item.className = 'item';
            _div_sm_item.id = _sminfo[_idx].id;
            _div_sm_item.setAttribute("smid", _idx);
            _sz_styleOpt = "background-image: url(" + _sminfo[_idx].background.file.download + "); ";
            _sz_styleOpt += "background-repeat: no-repeat; background-position: center center; background-size: 100% 100%; ";
            _div_sm_item.setAttribute("style", _sz_styleOpt);

            //해당 서버메뉴가 하위에 콘텐트를 가지고 있는 경우
            if (_sminfo[_idx].type.toLowerCase() == 'menu') {
                // 컨텐트 썸네일 베경 화면에 삽입
                let _div_sm_ctz_frame = document.createElement('div');
                _div_sm_ctz_frame.setAttribute("class", "bg_ctz_thumb_frame");

                // 컨텐트 썸네일 타이틀(신규 콘텐트)문구 삽입
                let _div_sm_ctz_title = document.createElement('div');
                _div_sm_ctz_title.setAttribute("id", "bg_ctz_thumb_title");
                _div_sm_ctz_title.textContent = _trTbl.ui.misc.title.new_ctz[_state.lang];
                _div_sm_ctz_frame.appendChild(_div_sm_ctz_title);


                let _ctz_info = _sminfo[_idx].children;
                for (let _ctzidx = 1; _ctzidx <= _sminfo[_idx].children.length; _ctzidx++) {
                    if (Number(_ctzidx) < 4) {
                        let _div_sm_ctz_item = document.createElement('div');
                        _div_sm_ctz_item.setAttribute("id", "bg_ctz_thumb_item");
                        // 해당 서브메뉴 아이탬의 하위 콘텐트들의 첫 썸네일 이미지
                        _sz_styleOpt = "background-image: url(" + _ctz_info[_ctzidx].thumbnails.files[_state.lang][1].download + "); ";
                        _sz_styleOpt += "background-repeat: no-repeat; background-position: center center; background-size: 100% 100%; ";
                        _sz_styleOpt += "background-color: rgba(0,0,0,0.4)";
                        _div_sm_ctz_item.setAttribute("style", _sz_styleOpt);
                        _div_sm_ctz_item.textContent = _ctz_info[_ctzidx].title[_state.lang];
                        _div_sm_ctz_frame.appendChild(_div_sm_ctz_item);
                    }
                }

                // 추가 콘텐트 갯수 표시
                if (_ctz_info.length > 3) {
                    let _div_sm_ctz_notice = document.createElement('div');
                    _div_sm_ctz_notice.setAttribute("id", "bg_ctz_thumb_morenotice");
                    let _remain_ctz_cnt = _ctz_info.length - 3;
                    let _str_remain_ctz_cnt = _trTbl.ui.submenu.info.remain_ctz_cnt;
                    _div_sm_ctz_notice.textContent = _str_remain_ctz_cnt[_state.lang].replace('__CTZCNT', _remain_ctz_cnt);
                    _div_sm_ctz_frame.appendChild(_div_sm_ctz_notice);
                }
                _div_sm_item.appendChild(_div_sm_ctz_frame);

                //Set Attribute
                _div_sm_item.setAttribute("ctzUse", true);
            } else {
                _div_sm_item.setAttribute("ctzUse", false);
                //contents_use가 1이 아닌경우, 이에 대한 페이지 활용 아이디어 필요
            }
            _div_sm_bglist.appendChild(_div_sm_item);
        }

        _hndl_smBg = $('#lst_smbg');
        _hndl_smBg.owlCarousel({
            center: true,
            items: 1, //Number of Items on Screen what you want
            loop: true,
            margin: 0,
            smartSpeed: 1000,
            lazyLoad: true,
            mouseDrag: false,
            touchDrag: false,
            pullDrag: false,
            freeDrag: false,
            startPosition: (Number(_state.menu.main[_mmIdx].cur) - 1),
        });
        $('.main .sub').show(function() {
            $('.main .mm').fadeOut(800);
        });

        _hndl_smSel = $('#lst_smsel');
        _hndl_smSel.owlCarousel({
            center: true,
            items: 3, //Number of Items on Screen what you want
            loop: true,
            margin: 0,
            smartSpeed: 0,
            autoWidth: false,
            mouseDrag: false,
            touchDrag: false,
            pullDrag: false,
            freeDrag: false,
            startPosition: (Number(_state.menu.main[_mmIdx].cur) - 1),
        });

        //메인 페이지->서브 페이지 화면 전환
        $('.main .sub .slider').show(function() {
            $('.main').animate({ top: -1080, left: 0 }, 1000, function() {

                $('.main .sub .slider .owl-item').addClass('unfocus');
                $('#lst_smsel').trigger("to.owl.carousel", [(Number(_state.menu.main[_mmIdx].cur) - 1), 10, true]);
                $('#lst_smsel').trigger('translate.owl.carousel', [0, 500, true]);

                $(document.activeElement).keydown(function(event) { //attach event listener
                    if (_state.menu.stage.cur == "sub") {
                        if (event.keyCode == gRmtKey.left) {
                            $('#lst_smsel').trigger('prev.owl', 700);
                        } else if (event.keyCode == gRmtKey.right) {
                            $('#lst_smsel').trigger('next.owl', 700);
                        } else if (event.keyCode == gRmtKey.enter) {
                            // 콘텐트 리스트 화면 빌드 및 화면 전환
                            let _program = HotelTV.tvguide.program;
                            let _mmIdx = _state.menu.main.cur;
                            if (_program[_mmIdx].type.toLowerCase() == "normal") {
                                if (_program[_mmIdx].style.toLowerCase() == "none") {
                                    console.log("Invalid options");
                                } else if (_program[_mmIdx].style.toLowerCase() == "content") {
                                    console.log("Invalid options");
                                } else if (_program[_mmIdx].style.toLowerCase() == "submenu") {
                                    console.log('DDDBUG::> Go to CTZ>');
                                    __uifxn_AppFull_BldPage_CtzGeneral();
                                }
                            }
                        } else if (event.keyCode == gRmtKey.back) {
                            // 컨텐트 폼의 백그라운드 에니메이션용 타이머 제거
                            if (_hndl_tmrCtzBgAni != null) {
                                clearInterval(_hndl_tmrCtzBgAni);
                                _hndl_tmrCtzBgAni = null;
                                console.log("TMR(CTZ ANI For Background)::>Destoried...");
                            }

                            // 컨텐트 폼의 썸네일 에니메이션용 타이머 제거
                            if (_hndl_tmrCtzThumbAni != null) {
                                clearInterval(_hndl_tmrCtzThumbAni);
                                _hndl_tmrCtzThumbAni = null;
                                console.log("TMR(CTZ ANI For Thumbnail)::>Destoried...");
                            }

                            // 메인 메뉴로 귀환
                            $(document.activeElement).off('keydown');
                            $('.main .mm').show(function() {
                                $('#lst_mmsel').trigger('translate.owl.carousel', [0]);
                            });
                            $('.main').animate({ top: 0, left: 0 }, 1000, () => {
                                $('#lst_smsel').off('refresh.owl.carousel');
                                $('#lst_smsel').off('change.owl.carousel');
                                $('#lst_smsel').off('changed.owl.carousel');
                                $('#lst_smsel').off('translate.owl.carousel');

                                $('#lst_smbg').owlCarousel('destroy');
                                $('#lst_smsel').owlCarousel('destroy');

                                $('.main .sub .slider #lst_smsel div').remove();
                                $('.main .sub .bg #lst_smbg div').remove();
                                $('.main .sub').hide();
                                _hndl_smSel = null;
                                _hndl_smBg = null;
                                _state.menu.stage.cur = "main"
                                setTimeout(function() {
                                    __uifxn_AppFull_ShowMMHotKeyBtn(true);
                                }, 500);
                            });
                        }
                    } else if (_state.menu.stage.cur == "ctzgen") {
                        if (event.keyCode == gRmtKey.left) {
                            $('#lst_ctzgenbg').trigger('prev.owl', 700);
                        } else if (event.keyCode == gRmtKey.right) {
                            $('#lst_ctzgenbg').trigger('next.owl', 700);
                        } else if (event.keyCode == gRmtKey.back) {
                            _state.menu.stage.cur = "preparing_sub";
                            $('.main .sub').show(0, function(){
                                $('.main').animate({ top: -1080, left: 0 }, 1000, () => {
                                    $('.main .ctzgen').hide();
                                    _state.media.playing = false;
                                    HotelTV.hcap.MediaStop(null, null);

                                    $('#lst_ctzgenbg').off('refresh.owl.carousel');
                                    $('#lst_ctzgenbg').off('change.owl.carousel');
                                    $('#lst_ctzgenbg').off('changed.owl.carousel');
                                    $('#lst_ctzgenbg').off('translate.owl.carousel');
                                    $('#lst_ctzgenbg').owlCarousel('destroy');
                                    $('.main .ctzgen .bg #lst_ctzgenbg div').remove();
                                    _hndl_ctzGenBg = null;
                                    $('#lst_smsel').trigger('translate.owl.carousel', [0]);
                                    _state.menu.stage.cur = "sub";
                                    console.log('DDDBUG::> Return to SUB>');
                                });
                            });

                        } else if (event.keyCode == gRmtKey.play) {
                            if ($('.main .ctzgen .bg .owl-carousel .owl-item.active .ctz_mv_ctrl').length == 1) {
                                let uri_video = $($('.main .ctzgen .bg .owl-carousel .owl-item.active .ctz_mv_ctrl')[0]).attr('video_url');
                                if (uri_video != null) {
                                    HotelTV.hcap.MediaPlay(
                                        HotelTV.api.GetBaseUrl() + uri_video,
                                        "",
                                        "video/mp4",
                                        1,
                                        () => {
                                            console.log("STARTUP Done CB.");
                                        },
                                        () => {
                                            console.log("STARTUP Fail CB.");
                                        }
                                    );
                                }
                            }
                        } else if (event.keyCode == gRmtKey.stop) {
                            if (_state.media.playing == true) {
                                _state.media.playing = false;
                                HotelTV.hcap.MediaStop(
                                    function() {
                                        $('.main .ctzgen .bg .owl-carousel .owl-stage-outer .owl-stage .owl-item').removeClass('movieplay');
                                        $('.owl-theme .owl-nav.disabled+.owl-dots').fadeIn(1000);
                                    },
                                    function() {
                                        $('.main .ctzgen .bg .owl-carousel .owl-stage-outer .owl-stage .owl-item').removeClass('movieplay');
                                        $('.owl-theme .owl-nav.disabled+.owl-dots').fadeIn(1000);
                                    });
                            }
                        } else {
                            console.log('CTZ MENU: KEY::> ' + event.keyCode);
                        }
                    } else {
                        console.log("SUBMENU KEYEVT: Skip events");
                    }
                });
                _state.menu.stage.cur = "sub";
            });
        });

        $('#lst_smsel').on('change.owl.carousel', function(event) {
            // Update HotelTV sub menu status
            let _state = HotelTV.state;
            let _mmIdx = _state.menu.main.cur;
            let _sminfo = HotelTV.tvguide.program[_mmIdx].children;
            _state.menu.main[_mmIdx].prev = Object.keys(_sminfo)[event.page.index];
        });

        $('#lst_smsel').on('changed.owl.carousel', function(event) {
            // Update HotelTV sub menu status
            let _state = HotelTV.state;
            let _mmIdx = _state.menu.main.cur;
            let _sminfo = HotelTV.tvguide.program[_mmIdx].children;
            _state.menu.main[_mmIdx].cur = Object.keys(_sminfo)[event.page.index];
            //console.log("SUB IDX::>" + _state.menu.main[_mmIdx].cur);
            __uifxn_AppFull_OnKeyDnEvt_SmSel(event);

            HotelTV.api.ReportEvent([{'power': true, 'location':{'conId':_sminfo[_state.menu.main[_mmIdx].cur].id}}])
        });

        $('#lst_smsel').on('translate.owl.carousel', function(event) {
            // 메뉴 셀렉터 좌/우 헨들링 및 이펙트
            let _uiCtrl_idx = 0;
            if (typeof event.item != 'undefined') {
                _uiCtrl_idx = event.item.index;
            } else {
                _uiCtrl_idx = $('.main .sub .slider .owl-item.active.center').index();
            }
            //console.log("SUB UI CTRL IDX::>" + _uiCtrl_idx);
            $('.main .sub .slider .owl-item.focus').addClass('unfocus');
            $('.main .sub .slider .owl-item.focus').removeClass('focus');
            $('.main .sub .slider .owl-item').eq(_uiCtrl_idx).addClass('focus');
            $('.main .sub .slider .owl-item').eq(_uiCtrl_idx).removeClass('unfocus');
        });
    }


    /**
     * HotelTV UI[AppFull] Wrapper Function::> Buildup sub menu and main bg
     */
    function __uifxn_AppFull_BldPage_SubTV() {
        let _state = HotelTV.state;
        let _mmIdx = _state.menu.main.cur;
        let _trTbl = HotelTV.translation;
        let _program = HotelTV.tvguide.program;
        let _tvProg = _program[_mmIdx].categories;

        const __fxn_exitTvMenu = function() {
            // 현재 재생중인 TV채널 종료
            HotelTV.hcap.ChannelShutDown();

            if (_hndl_tmrTvChnMngr != null) {
                clearInterval(_hndl_tmrTvChnMngr);
                _hndl_tmrTvChnMngr = null;
                console.log("TMR::>Destoried...");
            }

            // 메인 메뉴로 귀환
            $(document.activeElement).off('keydown');
            $('.main .mm').show(function() {
                $('#lst_mmsel').trigger('refresh.owl.carousel', [0]);
            });

            $('.main').animate({ top: 0, left: 0 }, 1000, () => {
                $('#lst_tvCtgbg').off('refresh.owl.carousel');
                $('#lst_tvCtgbg').off('change.owl.carousel');
                $('#lst_tvCtgbg').off('changed.owl.carousel');
                $('#lst_tvCtgbg').off('translated.owl.carousel');

                $('#lst_tvCtgbg').owlCarousel('destroy');

                $('.main .tv .bg #lst_tvCtgbg div').remove();
                _hndl_tvCtg = null;
                _state.menu.stage.cur = "main";

                setTimeout(function() {
                    __uifxn_AppFull_ShowMMHotKeyBtn(true);
                    __uifxn_AppFull_TopWidjetShow(true);
                }, 500);
            });
        }

        const __fxn_moveTvChannel = function(_tvProgram, _action) {
            let _mmIdx = _state.menu.main.cur;
            let _curChCtg = _state.menu.main[_mmIdx].cur;
            let _curChIdx = Number(_state.menu.main[_mmIdx][_curChCtg].cur);

            if ( _action=="ch_up" ){
                if ((_curChIdx - 1) >= 1) {
                    _curChIdx -= 1;
                    _state.menu.main[_mmIdx][_curChCtg].cur = _curChIdx.toString();
                    console.log(`TVCTG[${_tvProgram[_curChCtg].name}] CUR CH::>${_state.menu.main[_mmIdx][_curChCtg].cur}`);

                    __uifxn_AppFull_TVUpdateChList("ch_up");
                }
            }else if ( _action=="ch_down" ) {
                if ((_curChIdx + 1) <= Number(_state.menu.main[_mmIdx][_curChCtg].cnt)) {
                    _curChIdx += 1;
                    _state.menu.main[_mmIdx][_curChCtg].cur = _curChIdx.toString();
                    console.log(`TVCTG[${_tvProg[_curChCtg].name}] CUR CH::>${_state.menu.main[_mmIdx][_curChCtg].cur}`);

                    __uifxn_AppFull_TVUpdateChList("ch_down");
                }
            }
        }

        // 초기 채널 카테고리 슬라이더 표시 시간 증가
        _lastTm.keyevt.tv_ctrl = new Date();
        _lastTm.keyevt.tv_ctrl.setSeconds(_lastTm.keyevt.tv_ctrl.getSeconds() + 3);

        if (!(_mmIdx in _state.menu.main)) {
            _state.menu.main[_mmIdx] = {
                'cnt': 0,
                'cur': null, //현재 TV카테고리
                'prev': null, //마지막 TV카테고리
            };
            // TV Program category 개수
            _state.menu.main[_mmIdx].cnt = _tvProg.length;
        }

        // state내의 tv shortcut key관련 상태값 초기화및 화면 숨김
        _state.tv.shortkey = {
            "idx": "1",
            "scroll_offset": 0,
            "ch_item_idx": 1,
        };
        $('.main .tv .shortcut').hide();

        // 초기 메인 메뉴 KEY설정
        _state.menu.stage.cur = "preparing_tv";
        if (_state.menu.main[_mmIdx].cur == null) {
            _state.menu.main[_mmIdx].cur = Object.keys(_tvProg)[0];

            // 각 채널 카테고리별 채널 개수 및 이전 시청 채널 과 현재 시청 채널 정보 초기화
            //for (let _tvCtg_item in _tvProg) {
            for (let _i = 1; _i <= _tvProg.length; _i++) {
                _state.menu.main[_mmIdx][_i] = {
                    'cnt': 0,
                    'cur': null,
                    'prev': null,
                };
                _state.menu.main[_mmIdx][_i].cnt = _tvProg[_i].channels.length;
                _state.menu.main[_mmIdx][_i].cur = Object.keys(_tvProg[_i].channels)[0];
            }
        }

        // TV 메뉴 카테고리 노드를 동적으로 구성
        let _div_tvCgh_bglist = document.querySelector('#lst_tvCtgbg');
        for (let _tvCtg_idx = 1; _tvCtg_idx <= _tvProg.length; _tvCtg_idx++) {
            let _tvCtgInfo = _tvProg[_tvCtg_idx];
            let _div_tvCtg_frame = document.createElement('div');
            let _sz_styleOpt = null;

            // TV 메뉴 카테고리 노드를 동적으로 구성
            _div_tvCtg_frame.className = 'item';
            _div_tvCtg_frame.id = 'tvctgfrm_' + _tvCtgInfo.name.replace(/\s/g, '').toLowerCase();
            _div_tvCtg_frame.setAttribute("tvctgidx", _tvCtg_idx);

            // TV 카테고리 타이틀
            let _div_tvCtg_title = document.createElement('div');
            _div_tvCtg_title.setAttribute("id", "tvctg_title");
            _div_tvCtg_title.textContent = _trTbl.ui.tv.title.category[_tvCtgInfo.name][_state.lang];
            _div_tvCtg_frame.appendChild(_div_tvCtg_title);

            // ADD Upper Arrow
            let _div_tvCtg_arUp = document.createElement('div');
            _div_tvCtg_arUp.setAttribute("id", "tvctg_arrow_up");
            _div_tvCtg_frame.appendChild(_div_tvCtg_arUp);

            // TV CHANNEL LIST LIST UNDER Given TV CATEGORY
            let _div_tv_chlist = document.createElement('div');
            _div_tv_chlist.setAttribute("class", "tvctg_chlist");

            for (let _tvCh_idx = 1; _tvCh_idx <= _tvCtgInfo.channels.length; _tvCh_idx++) {
                let _tvChInfo = _tvCtgInfo.channels[_tvCh_idx];
                let _div_tv_chframe = document.createElement('div');
                _div_tv_chframe.setAttribute("class", "tvch_item_frame");
                _div_tv_chframe.setAttribute("idx", _tvCh_idx);


                let _div_tv_chepg = document.createElement('div');
                _div_tv_chepg.setAttribute("class", "tvch_epg");

                let _span_tv_chtitle = document.createElement('span');
                _span_tv_chtitle.setAttribute("id", "tvch_epg_title");
                _span_tv_chtitle.textContent = _tvChInfo.title[_state.lang];
                _span_tv_chtitle.setAttribute("ch_num", "CH:" + _tvChInfo.number + "]");
                _div_tv_chepg.appendChild(_span_tv_chtitle);

                let _span_tv_chepginfo = document.createElement('span');
                _span_tv_chepginfo.setAttribute("id", "tvch_epg_info");
                _span_tv_chepginfo.setAttribute("epg_id", _tvChInfo.epg);
                let _egp_prog_inf = __uifxn_AppFull_GetEpgInfoById(_tvChInfo.epg);
                if (_egp_prog_inf != null) {
                    _span_tv_chepginfo.textContent = _egp_prog_inf.name;
                }
                _div_tv_chepg.appendChild(_span_tv_chepginfo);

                // chframe에 자식 추가
                _div_tv_chframe.appendChild(_div_tv_chepg);


                let _div_tv_chlogo = document.createElement('div');
                _div_tv_chlogo.setAttribute("id", "tvch_logo");
                _sz_styleOpt = "background-image: url(" + _tvChInfo.logo.file.download + "); ";
                _sz_styleOpt += "background-repeat: no-repeat; background-position: center center; background-size: 100%; ";
                _div_tv_chlogo.setAttribute("style", _sz_styleOpt);
                _div_tv_chframe.appendChild(_div_tv_chlogo);


                _div_tv_chlist.appendChild(_div_tv_chframe);
            }
            _div_tvCtg_frame.appendChild(_div_tv_chlist);

            // ADD Down Arrow
            let _div_tvCtg_arDn = document.createElement('div');
            _div_tvCtg_arDn.setAttribute("id", "tvctg_arrow_down");
            _div_tvCtg_frame.appendChild(_div_tvCtg_arDn);

            //TV 카테고리 프레임 엘리멘트에 Child엘레멘트 추가
            _div_tvCgh_bglist.appendChild(_div_tvCtg_frame);
        }

        _hndl_tvCtg = $('#lst_tvCtgbg');

        //owlCarousel을 초기화 하기 전에 등록해야할 callback 함수들
        //initialized.owl.carousel같은 이벤트는 생성하기 전에 등록해야함.
        //이벤트 발생 순서는 대략 아래와 같음.
        //[1]change
        //[2]changed
        //[3]prepared
        //[4]initialized
        //[5]refresh
        //[6]translate

        _hndl_tvCtg.owlCarousel({
            center: true,
            items: 1, //Number of Items on Screen what you want
            loop: true,
            margin: 0,
            nav: true,
            dots: false,
            smartSpeed: 100,
            lazyLoad: true,
            mouseDrag: false,
            touchDrag: false,
            pullDrag: false,
            freeDrag: false,
            startPosition: (Number(_state.menu.main[_mmIdx].cur) - 1),
        });
        $('.main .tv .bg').show(function() {
            $('.main .mm').fadeOut(1000);
            $('.main').animate({ top: -1080, left: 0 }, 1000, function() {
                // Create Timer handle for channel guide ui show/hide
                if (_hndl_tmrTvChnMngr == null) {
                    _hndl_tmrTvChnMngr = setInterval(__uifxn_AppFull_TVChMngrUi, 500);
                    console.log("TMR::>Created...");
                }

                $('#lst_tvCtgbg').trigger('translated.owl.carousel', [0]);

                $(document.activeElement).keydown(function(event) { //attach event listener
                    if (_state.menu.stage.cur == "tvCtgShow") {
                        if (event.keyCode == gRmtKey.left) {
                            $('#lst_tvCtgbg').trigger('prev.owl', [1000])
                        } else if (event.keyCode == gRmtKey.right) {
                            $('#lst_tvCtgbg').trigger('next.owl', [1000])
                        } else if (event.keyCode == gRmtKey.up || event.keyCode == gRmtKey.chup) {
                            // 채널 리스트 아이탬 이동(UP)
                            __fxn_moveTvChannel(_tvProg, "ch_up");
                        } else if (event.keyCode == gRmtKey.down || event.keyCode == gRmtKey.chdown) {
                            // 채널 리스트 아이탬 이동(DOWN)
                            __fxn_moveTvChannel(_tvProg, "ch_down");
                        } else if (event.keyCode == gRmtKey.enter) {
                            // TV채널 플레이
                        } else if (event.keyCode == gRmtKey.back) {
                            // TV 메뉴를 종료하고 메인 메뉴로 이동
                            __fxn_exitTvMenu();
                        } else if ( __uifxn_Utils_CheckKeyisNumber(event.keyCode)==true  ){
                            _state.menu.stage.prev = _state.menu.stage.cur;
                            _state.menu.stage.cur = "tvShortcut";
                            //Navigate TV shortcut lists
                            __uifxn_AppFull_TVDrawShortCutList(true, "build", event.keyCode);
                        }
                    } else if (_state.menu.stage.cur == "tvCtgHide") {
                        if (event.keyCode == gRmtKey.chup) {
                            // 채널 리스트 아이탬 이동(CHUP)
                            __fxn_moveTvChannel(_tvProg, "ch_up");
                        } else if (event.keyCode == gRmtKey.chdown) {
                            // 채널 리스트 아이탬 이동(CHDOWN)
                            __fxn_moveTvChannel(_tvProg, "ch_down");
                        } else if (event.keyCode == gRmtKey.back) {
                            // TV 메뉴를 종료하고 메인 메뉴로 이동
                            __fxn_exitTvMenu();
                        } else if ( __uifxn_Utils_CheckKeyisNumber(event.keyCode)==true ) {
                            _state.menu.stage.prev = _state.menu.stage.cur;
                            _state.menu.stage.cur = "tvShortcut";
                            //Navigate TV shortcut lists
                            __uifxn_AppFull_TVDrawShortCutList(true, "build", event.keyCode);
                        } else {
                            console.log("event.keyCode::>" + event.keyCode);
                        }
                    } else if (_state.menu.stage.cur == "tvShortcut") {
                        // console.log("TV shortcut routine: key:" + event.keyCode);
                        if (event.keyCode == gRmtKey.back) {
                            // TV 메뉴를 종료하고 메인 메뉴로 이동
                            //__fxn_exitTvMenu();
                            __uifxn_AppFull_TVDrawShortCutList(false, "destory", event.keyCode);
                            _state.menu.stage.cur = _state.menu.stage.prev;
                            _state.menu.stage.prev = null;
                        } else if (event.keyCode == gRmtKey.enter) {
                            // 번호키를 이용한 채널 선택 팝업 삭제
                            __uifxn_AppFull_TVDrawShortCutList(false, "destory", event.keyCode);
                            _state.menu.stage.cur = _state.menu.stage.prev;
                            _state.menu.stage.prev = null;

                            _lastTm.keyevt.tv_ctrl = new Date();
                            _lastTm.keyevt.tv_ctrl.setSeconds(_lastTm.keyevt.tv_ctrl.getSeconds() - 3);
                        } else {
                            __uifxn_AppFull_TVDrawShortCutList(true, "move", event.keyCode);
                            console.log("TVSHORTCUT CHNUM: " + _state.tv.shortkey.ch_item_idx);
                        }
                    } else {
                        console.log("TVMENU KEYEVT: Skip events::> Invalid menu stage:" + _state.menu.stage.cur);
                    }
                });
            });
        });

        $('#lst_tvCtgbg').on('translated.owl.carousel', function(event) {
            __uifxn_AppFull_TVUpdateChList("on_load");
        });


        $('#lst_tvCtgbg').on('changed.owl.carousel', function(event) {
            // Update HotelTV sub menu status
            let _state = HotelTV.state;
            let _mmIdx = _state.menu.main.cur;
            let _hndlOwlEl = $('.main .tv .bg .owl-carousel .owl-stage-outer .owl-item');
            let _acvatedEl = null;
            let _curChListEl = null;
            let _curChCtg = null;
            let _bHasValidData = false;

            if (_hndlOwlEl) {
                _acvatedEl = $(_hndlOwlEl.children()[event.item.index]);
                if (_acvatedEl) {
                    _curChListEl = _acvatedEl.find(".tvctg_chlist");
                    if (_curChListEl) {
                        _curChCtg = _acvatedEl.attr('tvctgidx');
                        _bHasValidData = true;
                    }
                }
            }
            if (_bHasValidData != true) {
                return;
            }
            // 현재 채널 카테고리 인덱스 갱신
            _state.menu.main[_mmIdx].prev = _state.menu.main[_mmIdx].cur;
            _state.menu.main[_mmIdx].cur = _curChCtg;
            console.log("CHANGED TV CATEGORY::> CURRENT TV CTG IDX::> " + _curChCtg);
        });
    }

    /**
     * HotelTV UI[AppFull] Wrapper Function::> Bottom Guide Bar UI mngr
     */
    function __uifxn_AppFull_GuideBarUiMngr() {
        let _state = HotelTV.state;
        let _newsInfo = HotelTV.news;
        let _trTbl = HotelTV.translation;

        let _tm_diff_ms = 0;

        if (_lastTm.keyevt.last == null) {
            _lastTm.keyevt.last = new Date();
            console.log("keyevt.last is NULL");
            return;
        }

        let _tm_cur = new Date();
        _tm_diff_ms = Math.floor(_tm_cur.getTime() - _lastTm.keyevt.last.getTime());
        //마지막 KEY 이벤트 수신 시간 갱신
        //console.log(`KeyDn Event Recoreded::> ${_lastTm.keyevt.last} TMDiff::> ${_tm_diff_ms}`);

        if (_state.menu.stage.cur == "popup_message_card") {
            //HIDE NEWS and USER GUIDE TIPS
            if (_newsInfo == null || _newsInfo.length == 0) {
                if ($('.news').css('display') != "none") {
                    $('.news').hide();
                }
            }

            if ($('.guide>.tips').css('display') != "none") {
                $('.guide>.tips').fadeOut(500);
            }
            return;
        }

        // 가이드 UI 지속 시간 8초
        if (_state.media.playing == false) {
            if (_tm_diff_ms < 8000)
            {
                //KEY이벤트 발생이 8초 이내인경우
                //SHOW USER GUIDE TIPS
                let show_stages = ["hotkey_mm_red", "hotkey_mm_green", "hotkey_mm_yellow", "hotkey_mm_blue", "main", "sub", "ctzgen", "tvCtgShow", "tvCtgHide", "mypage"];
                let sz_msg = null;
                if (show_stages.includes(_state.menu.stage.cur) == true) {
                    switch (_state.menu.stage.cur) {
                        case "hotkey_mm_red":
                            sz_msg = _trTbl.ui.guide.navi_brochure[_state.lang];
                            if ($('.guide>.tips').text() != sz_msg) {
                                $('.guide>.tips').text(sz_msg);
                            }
                            break;
                        case "hotkey_mm_green":
                            sz_msg = _trTbl.ui.guide.navi_brochure[_state.lang];
                            if ($('.guide>.tips').text() != sz_msg) {
                                $('.guide>.tips').text(sz_msg);
                            }
                            break;
                        case "hotkey_mm_yellow":
                            sz_msg = _trTbl.ui.guide.navi_brochure[_state.lang];
                            if ($('.guide>.tips').text() != sz_msg) {
                                $('.guide>.tips').text(sz_msg);
                            }
                            break;
                        case "hotkey_mm_blue":
                            sz_msg = _trTbl.ui.guide.navi_brochure[_state.lang];
                            if ($('.guide>.tips').text() != sz_msg) {
                                $('.guide>.tips').text(sz_msg);
                            }
                            break;
                        case "main":
                            //sz_msg = _trTbl.ui.guide.navi_menu[_state.lang] || "";
                            sz_msg = _trTbl.ui.guide.navi_menu[_state.lang];
                            if ($('.guide>.tips').text() != sz_msg) {
                                $('.guide>.tips').text(sz_msg);
                            }
                            break;
                        case "sub":
                            sz_msg = _trTbl.ui.guide.navi_menu[_state.lang];
                            if ($('.guide>.tips').text() != sz_msg) {
                                $('.guide>.tips').text(sz_msg);
                            }
                            break;
                        case "ctzgen":
                            sz_msg = _trTbl.ui.guide.navi_ctz[_state.lang];
                            if ($('.guide>.tips').text() != sz_msg) {
                                $('.guide>.tips').text(sz_msg);
                            }
                            break;
                        case "tvCtgShow":
                        case "tvCtgHide":
                            sz_msg = _trTbl.ui.guide.navi_tvchannel[_state.lang];
                            if ($('.guide>.tips').text() != sz_msg) {
                                $('.guide>.tips').text(sz_msg);
                            }
                            break;
                    }

                    if ($('.guide>.tips').css('display') == "none") {
                        $('.guide>.tips').fadeIn(500, function() {
                            //HIDE NEWS
                            if (_newsInfo == null || _newsInfo.length == 0) {
                                if ($('.news').css('display') != "none") {
                                    $('.news').hide();
                                }
                            } else {
                                if ($('.news').css('display') != "none") {
                                    if ($('.news>.newsctz #hoteltv-news-ticker').children().length > 0) {
                                        $('.news>.newsctz #hoteltv-news-ticker').webTicker('stop');
                                        $('.news').fadeOut(500);
                                    }
                                }
                            }
                        });
                    }
                } else {
                    if ($('.guide>.tips').css('display') == "block") {
                        $('.guide>.tips').fadeOut(500);
                    }

                    if ($('.news').css('display') != "none") {
                        if ($('.news>.newsctz #hoteltv-news-ticker').children().length > 0) {
                            $('.news>.newsctz #hoteltv-news-ticker').webTicker('stop');
                            $('.news').fadeOut(500);
                        }
                    }
                }
            }
            else
            {
                //KEY이벤트 발생이 8초가 초과한경우
                //HIDE TIPS and then SHOW NEWS
                if ($('.guide>.tips').css('display') == "block") {
                    $('.guide>.tips').fadeOut(500, function() {
                        if (_newsInfo == null || _newsInfo.length == 0) {
                            if ($('.news').css('display') != "none") {
                                $('.news').hide();
                            }
                        } else {
                            if ( _state.menu.stage.cur=="tvCtgShow" || _state.menu.stage.cur=="tvCtgHide" )
                            {

                            }
                            else
                            {
                                if ($('.news').css('display') != "block") {
                                    $('.news').fadeIn(500, function() {
                                        __uifxn_AppFull_BldNews();
                                        $('.news>.newsctz #hoteltv-news-ticker').webTicker('cont');
                                    });
                                }
                            }
                        }
                    });
                } else {
                    if (_newsInfo == null || _newsInfo.length == 0) {
                        if ($('.news').css('display') != "none") {
                            $('.news').hide();
                        }
                    } else {
                        if ( _state.menu.stage.cur=="tvCtgShow" || _state.menu.stage.cur=="tvCtgHide" )
                        {
                            // if ($('.news').css('display') != "block") {
                            //     if ($('.news>.newsctz #hoteltv-news-ticker').children().length > 0) {
                            //         $('.news>.newsctz #hoteltv-news-ticker').webTicker('stop');
                            //         $('.news').fadeOut(500);
                            //     }
                            // }
                        }
                        else
                        {
                            if ($('.news').css('display') != "block") {
                                $('.news').fadeIn(500, function() {
                                    __uifxn_AppFull_BldNews();
                                    $('.news>.newsctz #hoteltv-news-ticker').webTicker('cont');
                                });
                            }
                        }
                    }
                }
            }
        } else {
            //HIDE NEWS and USER GUIDE TIPS
            if (_newsInfo == null || _newsInfo.length == 0) {
                if ($('.news').css('display') != "none") {
                    $('.news').hide();
                }
            }


            if ($('.guide>.tips').css('display') != "none") {
                $('.guide>.tips').fadeOut(500, function() {
                    if (_newsInfo == null || _newsInfo.length == 0) {
                        if ($('.news').css('display') != "none") {
                            $('.news').hide();
                        }
                    } else {
                        if ($('.news').css('display') != "none") {
                            if ($('.news>.newsctz #hoteltv-news-ticker').children().length > 0) {
                                $('.news>.newsctz #hoteltv-news-ticker').webTicker('stop');
                                $('.news').fadeOut(500);
                            }
                        }
                    }
                });
            }
        }
    }


    /**
     * HotelTV UI Wrapper Function::> received event handling function
     * @param {boolean} _evt event
     */
    function __uifxn_AppFull_OnKeyDnEvt_MmSel(_evt) {
        let _program = HotelTV.tvguide.program;
        let _state = HotelTV.state;

        if ((_program[(_evt.page.index + 1)].type == "weather") || (_program[(_evt.page.index + 1)].type == "flight")) {
            __uifxn_AppFull_ShowMMHotKeyBtn(false);
        } else {
            __uifxn_AppFull_ShowMMHotKeyBtn(true);
        }

        //console.log(`Evnt: ${_evt.item.index} Of ${_evt.item.count} page::> ${_evt.page.index} of ${_evt.page.count}`);
        //Shows Up Weather Contents
        if (_program[(_evt.page.index + 1)].type == "weather") {
            if ($('.main .mm .weather').css("display") == "none") {
                $('.main .mm .weather').fadeIn(1000);
            }
        } else {
            if ($('.main .mm .weather').css("display") != "none") {
                $('.main .mm .weather').fadeOut(300);
            }
        }

        //Shows Up Flight Contents
        if (_program[(_evt.page.index + 1)].type == "flight") {
            $('.main .mm .flight').each(function (index, docObjFlight) {
                //console.log(index);
                if ( $(docObjFlight).css("display")!="none" ){
                    if ( $(docObjFlight).find('#record').length>0 ){
                        $(docObjFlight).find('#record').scrollTop(0);
                    }
                    $(docObjFlight).fadeOut(300);
                }
            });

            if ($(`.main .mm #flight_${_program[(_evt.page.index + 1)].location}`).css("display") == "none") {
                $(`.main .mm #flight_${_program[(_evt.page.index + 1)].location}`).fadeIn(1000, () => {
                    $(document.activeElement).keydown(function(_evt) {
                        let _curPos = 0;
                        let _maxHeight = 0;

                        switch (_evt.keyCode) {
                            case gRmtKey.up:
                                _curPos = $(`.main .mm #flight_${_program[_state.menu.main.cur].location} .departure tbody#record`).scrollTop();
                                _maxHeight = $(`.main .mm #flight_${_program[_state.menu.main.cur].location} .departure tbody#record`)[0].scrollHeight;
                                _curPos = (_curPos - 50) < 0 ? 0 : (_curPos - 50);
                                $('.main .mm .flight tbody#record').scrollTop(_curPos);
                                break;

                            case gRmtKey.down:
                                _curPos = $(`.main .mm #flight_${_program[_state.menu.main.cur].location} .departure tbody#record`).scrollTop();
                                _maxHeight = $(`.main .mm #flight_${_program[_state.menu.main.cur].location} .departure tbody#record`)[0].scrollHeight;
                                _curPos = (_curPos + 50) > _maxHeight ? _maxHeight : (_curPos + 50);
                                $('.main .mm .flight tbody#record').scrollTop(_curPos);
                                break;
                        }
                    });
                });
            }
        } else {
            $('.main .mm .flight').each(function (index, docObjFlight) {
                //console.log(index);
                if ( $(docObjFlight).css("display")!="none" ){
                    if ( $(docObjFlight).find('#record').length>0 ){
                        $(docObjFlight).find('#record').scrollTop(0);
                    }
                    $(docObjFlight).fadeOut(300, () => {
                        $(document.activeElement).off('keydown');
                    });
                }
            });
        }
        $('#lst_mmbg').trigger("to.owl.carousel", [_evt.page.index, 1000, true]);
    }


    /**
     * HotelTV UI Wrapper Function::> Show Top Widjet Weather
     * @param {boolean} _en show/hide
     */
    function __uifxn_AppFull_TopWidjet_BuildWeather() {
        const _state = HotelTV.state;
        let _widget_weather = HotelTV.widget.weather;

        $('.widjet .top .weather #icon').css({ "background-image": "url(" + _widget_weather.smallicon_image[_widget_weather.item.condition.code] + ")" });
        $('.widjet .top .weather #temp').text(_widget_weather.item.condition.temp + "°C");
        $('.widjet .top .weather').show();
    }


    /**
     * HotelTV UI Wrapper Function::> Show Top Widjet Message Cnt(Unread)
     * @param {boolean} _en show/hide
     */
    function __uifxn_AppFull_TopWidjet_BuildMsgCnt(_en) {
        let _msgCnt = 0;
        const _state = HotelTV.state;
        const _guest = HotelTV.guestinfo;
        let _trTbl = HotelTV.translation;
        const _get_unread_msgCnt = function(_object) {
            let _msg_unread_cnt = 0;
            for (__j = 1; __j <= _object.length; __j++) {
                if (_object[__j].read == false) {
                    _msg_unread_cnt++;
                }
            }
            return _msg_unread_cnt;
        }

        _msgCnt = _get_unread_msgCnt(HotelTV.message);
        if (_msgCnt > 0) {
            $('.widjet .top .message #unread_cnt').text(_msgCnt.toString());
            $('.widjet .top .message').show();
        } else {
            $('.widjet .top .message').hide();
        }

        $('div#lst_mypagebg div #mp_message_title').text(_guest.name + _trTbl.ui.mypage.message.title.title[_state.lang].replace("_XX", _msgCnt.toString()));
    }

    /**
     * HotelTV UI Wrapper Function::> Show Top Widjet Weather
     * @param {boolean} _show show/hide
     */
    function __uifxn_AppFull_TopWidjetShow(_show) {
        if (_show == true) {
            if ($('.widjet .top').css("display") == "none") {
                $('.widjet .top').fadeIn(300);
            }
        } else {
            if ($('.widjet .top').css("display") != "none") {
                $('.widjet .top').fadeOut(300);
            }
        }
    }


    /**
     * HotelTV UI Wrapper Function::> Build Main Menu::> Flight
     */
    function __uifxn_AppFull_MM_BldFlight() {
        let _state = HotelTV.state;
        let _program = HotelTV.tvguide.program;
        let _trTbl = HotelTV.translation;
        let _curDaTm = new Date();
        const ar_tdItem = ['airline', 'flight', 'scheduled', 'origin', 'destination', 'type', 'gate', 'status'];

        let _elFlightRoot = document.querySelector('.main .mm');
        for (let _mm_idx = 1; _mm_idx <= _program.length; _mm_idx++) {
            if ( _program[_mm_idx].type=="flight" ){
                let _flight = HotelTV.flight[_program[_mm_idx].location];
                _hndl_flight_elm = $(`.main .mm #flight_${_program[_mm_idx].location}`);
                if ( _hndl_flight_elm.length==0 )
                {
                    let _div_flight_item = document.createElement('div');
                    _div_flight_item.setAttribute("id", "flight_" + _program[_mm_idx].location );
                    _div_flight_item.setAttribute("class", "flight");

                    // 1. Departure DIV  생성
                    let _div_departure_item = document.createElement('div');
                    _div_departure_item.setAttribute("class", "departure");
                    // 1.1 Departure TITLE DIV  생성
                    let _div_departure_title_item = document.createElement('div');
                    _div_departure_title_item.setAttribute("id", "title");
                    _div_departure_title_item.innerText = _trTbl.ui.flight.title.departure[_state.lang] + "["+_flight.location+"]";
                    _div_departure_item.appendChild(_div_departure_title_item);

                    // 1.2 Departure Table 생성
                    // 1.2.1. Table HDR 생성
                    let _departure_tblhdr = document.createElement('table');
                    _departure_tblhdr.setAttribute("class", "tbl_header");
                    _departure_tblhdr.innerHTML = '<tbody id="hdr"><tr>' +
                        '<th id="airline">' + _trTbl.ui.flight.title.airline[_state.lang] + '</th>' +
                        '<th id="flight">' + _trTbl.ui.flight.title.flight_no[_state.lang] + '</th>' +
                        '<th id="scheduled">' + _trTbl.ui.flight.title.scheduled[_state.lang] + '</th>' +
                        '<th id="origin">' + _trTbl.ui.flight.title.origin[_state.lang] + '</th>' +
                        '<th id="destination">' + _trTbl.ui.flight.title.destination[_state.lang] + '</th>' +
                        '<th id="type">' + _trTbl.ui.flight.title.destination[_state.lang] + '</th>' +
                        '<th id="gate">' + _trTbl.ui.flight.title.boarding_gate[_state.lang] + '</th>' +
                        '<th id="status">' + _trTbl.ui.flight.status[_state.lang] + '</th>' +
                        '</tr></tbody>';
                    _div_departure_item.appendChild(_departure_tblhdr);

                    // 1.2.2. Table REC 생성
                    let _departure_tblrec = document.createElement('table');
                    _departure_tblrec.setAttribute("class", "tbl_record");
                    _departure_tblrec.innerHTML = '<tbody id="record"></tbody>';
                    _div_departure_item.appendChild(_departure_tblrec);

                    // 1.3. Border Table Bottom DIV  생성
                    let _div_departure_border_item = document.createElement('div');
                    _div_departure_border_item.setAttribute("id", "border_table_bottom");
                    _div_departure_item.appendChild(_div_departure_border_item);

                    _div_flight_item.appendChild(_div_departure_item);


                    // 2. Arrive DIV  생성
                    let _div_arrival_item = document.createElement('div');
                    _div_arrival_item.setAttribute("class", "arrival");
                    // 2.1 Arrive TITLE DIV  생성
                    let _div_arrive_title_item = document.createElement('div');
                    _div_arrive_title_item.setAttribute("id", "title");
                    _div_arrive_title_item.innerText = _trTbl.ui.flight.title.arrival[_state.lang] + "["+_flight.location+"]";
                    _div_arrival_item.appendChild(_div_arrive_title_item);

                    // 2.2 Departure Table 생성
                    // 2.2.1. Table HDR 생성
                    let _arrival_tblhdr = document.createElement('table');
                    _arrival_tblhdr.setAttribute("class", "tbl_header");
                    _arrival_tblhdr.innerHTML = '<tbody id="hdr"><tr>' +
                        '<th id="airline">' + _trTbl.ui.flight.title.airline[_state.lang] + '</th>' +
                        '<th id="flight">' + _trTbl.ui.flight.title.flight_no[_state.lang] + '</th>' +
                        '<th id="scheduled">' + _trTbl.ui.flight.title.scheduled[_state.lang] + '</th>' +
                        '<th id="origin">' + _trTbl.ui.flight.title.origin[_state.lang] + '</th>' +
                        '<th id="destination">' + _trTbl.ui.flight.title.destination[_state.lang] + '</th>' +
                        '<th id="type">' + _trTbl.ui.flight.title.destination[_state.lang] + '</th>' +
                        '<th id="gate">' + _trTbl.ui.flight.title.boarding_gate[_state.lang] + '</th>' +
                        '<th id="status">' + _trTbl.ui.flight.status[_state.lang] + '</th>' +
                        '</tr></tbody>';
                    _div_arrival_item.appendChild(_arrival_tblhdr);

                    // 2.2.2. Table REC 생성
                    let _arrival_tblrec = document.createElement('table');
                    _arrival_tblrec.setAttribute("class", "tbl_record");
                    _arrival_tblrec.innerHTML = '<tbody id="record"></tbody>';
                    _div_arrival_item.appendChild(_arrival_tblrec);

                    // 2.3. Border Table Bottom DIV  생성
                    let _div_arrival_border_item = document.createElement('div');
                    _div_arrival_border_item.setAttribute("id", "border_table_bottom");
                    _div_arrival_item.appendChild(_div_arrival_border_item);

                    _div_flight_item.appendChild(_div_arrival_item);

                    //3 Caution 추가
                    let _div_caution_item = document.createElement('div');
                    _div_caution_item.setAttribute("id", "caution");
                    _div_flight_item.appendChild(_div_caution_item);

                    // 생성된 Flight를 .main .mm 아래애 추가
                    _elFlightRoot.appendChild(_div_flight_item);
                }


                //Delete all table record for departure & arrival
                if ( $(`.main .mm #flight_${_program[_mm_idx].location} .departure table #record tr`).children().length>0 ){
                    $(`.main .mm #flight_${_program[_mm_idx].location} .departure table #record tr`).remove();
                }
                if ( $(`.main .mm #flight_${_program[_mm_idx].location} .arrival table #record tr`).children().length>0 ){
                    $(`.main .mm #flight_${_program[_mm_idx].location} .arrival table #record tr`).remove();
                }

                let _el_departure_tbl_rec = $(`.main .mm #flight_${_program[_mm_idx].location} .departure table #record`);
                let _el_arrival_tbl_rec = $(`.main .mm #flight_${_program[_mm_idx].location} .arrival table #record`);

                for (let _i = 0; _i < _flight.count; _i++) {
                    let _schOrg = new Date();
                    let _schEdt = new Date();
                    let _flitem = _flight.items[_i];

                    //let _sTmOrg = _flitem.std.length != 4 ? null : ;
                    //let _sTmChanged = _flitem.etd;

                    if (_flitem.std.length != 4) {
                        console.log("Flight Schedule org time is NULL");
                    } else {
                        _schOrg.setHours(Number(_flitem.std.charAt(0) + _flitem.std.charAt(1)));
                        _schOrg.setMinutes(Number(_flitem.std.charAt(2) + _flitem.std.charAt(3)));
                    }

                    if (_flitem.std.length != 4) {
                        console.log("Flight Schedule edited time is NULL");
                    } else {
                        _schEdt.setHours(Number(_flitem.std.charAt(0) + _flitem.std.charAt(1)));
                        _schEdt.setMinutes(Number(_flitem.std.charAt(2) + _flitem.std.charAt(3)));
                    }



                    let diffMs = (_schOrg - _curDaTm); // milliseconds between now & Christmas
                    // let diffDays = Math.floor(diffMs / 86400000); // days
                    // let diffHrs = Math.floor((diffMs % 86400000) / 3600000); // hours
                    // let diffMins = Math.round(((diffMs % 86400000) % 3600000) / 60000); // minutes
                    // console.log(diffDays + " days, " + diffHrs + " hours, " + diffMins + " minutes");
                    let diffMins = Math.round(diffMs / 60000);
                    //console.log("TDiff::> " + diffMins);

                    if ((-360 < diffMins) && (diffMins < 360)) {
                        if (_flitem.io == "O") {
                            let _el_tr = document.createElement('tr');
                            _el_tr.setAttribute("id", "record");
                            ar_tdItem.forEach(_itm => {
                                let _el_td = document.createElement('td');
                                _el_td.setAttribute("id", _itm);
                                if (_itm == "airline") {
                                    _el_td.innerText = HotelTV.ui_utils.Get_Airline(_trTbl.ui.flight.airlines, _flitem.airline, _state.lang);
                                } else if (_itm == "flight") {
                                    _el_td.innerText = _flitem.airFln;
                                } else if (_itm == "scheduled") {
                                    _el_td.innerText = _flitem.std.charAt(0) + _flitem.std.charAt(1) + ":" + _flitem.std.charAt(2) + _flitem.std.charAt(3) + " - ";
                                    _el_td.innerText += _flitem.etd.charAt(0) + _flitem.etd.charAt(1) + ":" + _flitem.etd.charAt(2) + _flitem.etd.charAt(3);
                                } else if (_itm == "origin") {
                                    _el_td.innerText = HotelTV.ui_utils.Get_Airport(_trTbl.ui.flight.city, _flitem.boarding, _state.lang);
                                } else if (_itm == "destination") {
                                    _el_td.innerText = HotelTV.ui_utils.Get_Airport(_trTbl.ui.flight.city, _flitem.arrived, _state.lang);
                                } else if (_itm == "type") {
                                    _el_td.innerText = _trTbl.ui.flight.line[_flitem.line][_state.lang];
                                } else if (_itm == "gate") {
                                    _el_td.innerText = _flitem.gate;
                                } else if (_itm == "status") {
                                    _el_td.innerText = HotelTV.ui_utils.Get_FlightStatus(_trTbl.ui.flight.result, _flitem.rmk, _state.lang);
                                }
                                _el_tr.appendChild(_el_td);
                            });
                            _el_departure_tbl_rec.append(_el_tr);
                        } else {
                            let _el_tr = document.createElement('tr');
                            _el_tr.setAttribute("id", "record");
                            ar_tdItem.forEach(_itm => {
                                let _el_td = document.createElement('td');
                                _el_td.setAttribute("id", _itm);
                                if (_itm == "airline") {
                                    _el_td.innerText = HotelTV.ui_utils.Get_Airline(_trTbl.ui.flight.airlines, _flitem.airline, _state.lang);
                                } else if (_itm == "flight") {
                                    _el_td.innerText = _flitem.airFln;
                                } else if (_itm == "scheduled") {
                                    _el_td.innerText = _flitem.std.charAt(0) + _flitem.std.charAt(1) + ":" + _flitem.std.charAt(2) + _flitem.std.charAt(3) + " - ";
                                    _el_td.innerText += _flitem.etd.charAt(0) + _flitem.etd.charAt(1) + ":" + _flitem.etd.charAt(2) + _flitem.etd.charAt(3);
                                } else if (_itm == "origin") {
                                    _el_td.innerText = HotelTV.ui_utils.Get_Airport(_trTbl.ui.flight.city, _flitem.boarding, _state.lang);
                                } else if (_itm == "destination") {
                                    _el_td.innerText = HotelTV.ui_utils.Get_Airport(_trTbl.ui.flight.city, _flitem.arrived, _state.lang);
                                } else if (_itm == "type") {
                                    if (_trTbl.ui.flight.line[_flitem.line]) {
                                        _el_td.innerText = _trTbl.ui.flight.line[_flitem.line][_state.lang];
                                    }
                                } else if (_itm == "gate") {
                                    _el_td.innerText = _flitem.gate;
                                } else if (_itm == "status") {
                                    _el_td.innerText = HotelTV.ui_utils.Get_FlightStatus(_trTbl.ui.flight.result, _flitem.rmk, _state.lang);
                                }
                                _el_tr.appendChild(_el_td);
                            });
                            _el_arrival_tbl_rec.append(_el_tr);
                        }
                    }
                }
                $(`.main .mm #flight_${_program[_mm_idx].location} #caution`).text(_trTbl.ui.flight.caution.body[_state.lang]);
            }
        }
    }

    /**
     * HotelTV UI Wrapper Function::> Build Main Menu::> Weather
     */
    function __uifxn_AppFull_MM_BldWeather() {
        let _state = HotelTV.state;
        let _trTbl = HotelTV.translation;
        let _weather = HotelTV.weather[_state.weather.default_location];
        let _cur_cond = _weather.item.condition
        let _elWeatherRoot = $('.main .mm .weather');
        let _elWeatherToday = _elWeatherRoot.children('.today');
        let _elWeatherForcast = _elWeatherRoot.children('.forcast');
        let _elWeatherCation = _elWeatherRoot.children('#caution');

        _elWeatherRoot.children('.location').text(_trTbl.system.locale.city[_weather.location][_state.lang] || null);
        _elWeatherToday.children('#temp_cur').text(_weather.item.condition.temp + "°C");
        _elWeatherToday.children('#temp_minmax').text(_weather.item.forecast[0].low + "°C/" + _weather.item.forecast[0].high + " °C");
        _elWeatherToday.children('.detail').children('#discription').text(_trTbl.ui.weather.cond[_cur_cond.code][_state.lang]);
        _elWeatherToday.children('.detail').children('#img_status').css('background-image', 'url(' + _weather.icon_image[_cur_cond.code] + ')');
        _elWeatherToday.children('.detail').children('#humidity').children('#icon').css('background-image', 'url(./images/icons/icon_humidity.png)');
        _elWeatherToday.children('.detail').children('#humidity').children('#value').text(_weather.daily['1'].main.humidity + " %");
        _elWeatherToday.children('.detail').children('#wind').children('#icon').css('background-image', 'url(./images/icons/icon_wind.png)');
        _elWeatherToday.children('.detail').children('#wind').children('#value').text(HotelTV.ui_utils.Weather_GetWindReport(_trTbl.ui.weather.wind_dir, _weather.wind.speed, _weather.wind.direction, _state.lang));

        //Daily Summary
        _elWeatherForcast.children('.daily').children('#title').text(_trTbl.ui.weather.fc_today[_state.lang]);
        let _eltbl_fc_daily_items = _elWeatherForcast.children('.daily').children('ul').children('li');
        for (let _idx = 0; _idx < _eltbl_fc_daily_items.length; ++_idx) {
            let _wData = _weather.daily[Number(_idx) + 1];
            let _time = _wData.dt_txt.split(' ')[1];
            let _temp = _wData.main.temp;
            $(_eltbl_fc_daily_items[_idx]).css('background-image', 'url(' + _weather.icon_image[_wData.weather.code] + ')');
            $(_eltbl_fc_daily_items[_idx].children.time)[0].innerText = _time.split(":")[0] + ":" + _time.split(":")[1];
            $(_eltbl_fc_daily_items[_idx].children.temp)[0].innerText = _temp.toString() + " °C";
        }

        //Weekly Summary
        _elWeatherForcast.children('.weekly').children('#title').text(_trTbl.ui.weather.fc_weekly[_state.lang]);
        let _eltbl_fc_weekly_items = _elWeatherForcast.children('.weekly').children('ul').children('li');
        for (let _idx = 0; _idx < _eltbl_fc_weekly_items.length; ++_idx) {
            let _wData = _weather.item.forecast[Number(_idx)];
            $(_eltbl_fc_weekly_items[_idx]).css('background-image', 'url(' + _weather.icon_image[_wData.code] + ')');
            $(_eltbl_fc_weekly_items[_idx].children.date)[0].innerText = _trTbl.system.days[_wData.day][_state.lang];
            $(_eltbl_fc_weekly_items[_idx].children.temp)[0].innerText = _wData.low + " °C /" + _wData.high + " °C";
        }
        _elWeatherCation.text(_trTbl.ui.weather.caution.body[_state.lang]);
    }

    /**
     * HotelTV UI[AppFull] Wrapper Function::> Buildup main menu and main bg
     * @param {boolean} uri_img background image url
     */
    function __uifxn_AppFull_BldPage_Main() {
        let _program = HotelTV.tvguide.program;
        let _weather = null;
        let _state = HotelTV.state;
        let _mmcnt = 0;

        const _get_weather_def_location = function() {
            let _found = false;
            for (__j = 1; __j <= _program.length; __j++) {
                if (_program[__j].type == "weather" || _program[__j].widget==true ) {
                    if ( _program[__j].widget==true ) {
                        _state.weather.default_location = _program[__j].location;
                        _found = true;
                        break;
                    }
                }
            }
            return _found;
        }

        _mmcnt = _program.length;
        //_mm_width = 1920 / (_mmcnt - 1);
        _mm_width = 266;

        // 초기 메인 메뉴 KEY설정
        _state.menu.stage.cur = "preparing_main";
        if (_state.menu.main.cur == null) {
            _state.menu.main.cur = Object.keys(_program)[0];
        }

        // 메인 메뉴 셀렉터 노드를 동적으로 구성
        let _div_mm_slist = document.querySelector('#lst_mmsel');
        for (let _mm_idx = 1; _mm_idx <= _program.length; _mm_idx++) {
            let _div_mm_item = document.createElement('div');
            _div_mm_item.className = 'item';
            _div_mm_item.id = _program[_mm_idx].id;
            _div_mm_item.setAttribute("mmid", _mm_idx);
            _div_mm_item.style.height = '92px';
            // _div_mm_item.style.width = _mm_width + 'px';

            // Append Sub elements::title
            let _mm_item_title = document.createElement('div');
            _mm_item_title.setAttribute("id", "mm_item_title");
            if (_program[_mm_idx].showTitle && _program[_mm_idx].showTitle == true) {
                _mm_item_title.textContent = _program[_mm_idx].title[_state.lang];
            } else {
                _mm_item_title.textContent = "";
            }

            // Append Sub elements::icon
            let _mm_item_icon = document.createElement('div');
            _mm_item_icon.setAttribute("id", "mm_item_icon");
            let _sz_styleOpt = "--icon_unfocus: url(" + _program[_mm_idx].unfocusIcon.file.download + "); ";
            _sz_styleOpt += "--icon_focus: url(" + _program[_mm_idx].focusIcon.file.download + "); ";
            //_sz_styleOpt += "background-repeat: no-repeat; background-position: center bottom; background-size: 100% 100%; ";
            _sz_styleOpt += "background-repeat: no-repeat; background-position: center bottom;";
            _mm_item_icon.setAttribute("style", _sz_styleOpt);

            _div_mm_item.appendChild(_mm_item_icon);
            _div_mm_item.appendChild(_mm_item_title);

            _div_mm_slist.appendChild(_div_mm_item);

            // Record Special key map info
            if (['flight', 'weather', 'tv'].includes(_program[_mm_idx].type)) {
                if (!('specialKey' in _state)) {
                    _state['specialKey'] = {};
                }

                if (!(_program[_mm_idx].type in _state['specialKey'])) {
                    _state['specialKey'][_program[_mm_idx].type] = { "mm_index": _mm_idx , "id": _program[_mm_idx].id};
                }
            }
        }

        // 디폴트 로케이션 설정
        if ( _get_weather_def_location()==true ){
            _weather = HotelTV.weather[_state.weather.default_location];
        }

        // 메인 메뉴 백그라운드 이미지 노드를 동적으로 구성
        let _div_mm_bglist = document.querySelector('#lst_mmbg');
        for (let _mm_idx = 1; _mm_idx <= _program.length; _mm_idx++) {
            let _div_mm_item = document.createElement('div');
            let _sz_styleOpt = null;

            _div_mm_item.className = 'item';
            _div_mm_item.id = 'mmbg_' + _program[_mm_idx].name.replace(/\s/g, '').toLowerCase();
            _div_mm_item.setAttribute("mmid", _mm_idx);
            if (_program[_mm_idx].type.toLowerCase() == "weather") {
                if (_weather != null) {
                    _sz_styleOpt = "background-image: url(" + _weather.background_image[_weather.item.condition.code] + "); ";
                } else {
                    _sz_styleOpt = "background-image: url(" + _program[_mm_idx].background.file.download + "); ";
                }
            } else {
                _sz_styleOpt = "background-image: url(" + _program[_mm_idx].background.file.download + "); ";
            }
            _sz_styleOpt += "background-repeat: no-repeat; background-position: center center; background-size: 100% 100%; ";
            _div_mm_item.setAttribute("style", _sz_styleOpt);

            _div_mm_bglist.appendChild(_div_mm_item);
        }
        _hndl_mmBg = $('#lst_mmbg');
        _hndl_mmBg.owlCarousel({
            center: true,
            items: 1, //Number of Items on Screen what you want
            loop: true,
            margin: 0,
            smartSpeed: 1000,
            lazyLoad: true,
            mouseDrag: false,
            touchDrag: false,
            pullDrag: false,
            freeDrag: false,
            startPosition: Number(_state.menu.cur) - 1,
        });
        $('.main .mm .bg').show(function() {
            //호텔 로고 출력
            $('.widjet .top .hotellogo').css({ "background-image": "url(" + HotelTV.hotelinfo.subLogo.download + ")" });

            //상단 메시지(unread)개수 표시
            __uifxn_AppFull_TopWidjet_BuildMsgCnt();

            // //상단 시계 표시
            _hndl_widget_topTime = setInterval(() => {
                let _szCurTm = HotelTV.ui_utils.GetCur_DateTime();
                //console.log("_szCurTm=>" + _szCurTm);
                $('.widjet .top .datetime .time').text(_szCurTm.time);
                $('.widjet .top .datetime .date').text(_szCurTm.date);
            }, 1000);

            __uifxn_AppFull_TopWidjetShow(true);

            //Weather Contents Buildup
            if ( _get_weather_def_location()==true ){
                if ( Object.keys(_state.weather.default_location).length != 0 ){
                    __uifxn_AppFull_MM_BldWeather();
                }
            }

            //Buildup Widget: Weather
            __uifxn_AppFull_TopWidjet_BuildWeather();

            //Build Flight
            __uifxn_AppFull_MM_BldFlight();

            //Build Brochures
            __uifxn_AppFull_BuildBrochure();

            //Build Amenity
            __uifxn_AppFull_BuildAmenity();

            //Build Room Service
            __uifxn_AppFull_BuildRoomService();

            //위젯 표시
            $('.widjet').show();
        });



        _hndl_mmSel = $('#lst_mmsel');
        _hndl_mmSel.owlCarousel({
            center: true,
            items: 5, //Number of Items on Screen what you want
            loop: true,
            margin: 0,
            smartSpeed: 10,
            autoWidth: false,
            mouseDrag: false,
            touchDrag: false,
            pullDrag: false,
            freeDrag: false,
            startPosition: Number(_state.menu.cur) - 1,
        });
        $('.main .mm .slider').fadeIn(500, function() {
            if (_hndl_tmrUgMngr == null) {
                _hndl_tmrUgMngr = setInterval(__uifxn_AppFull_GuideBarUiMngr, 1000);
                console.log("TMR::>Created...");
            }
            $('.main .mm .slider .owl-item').addClass('unfocus');
            $('#lst_mmsel').trigger("to.owl.carousel", [0, 10, true]);
            $('#lst_mmsel').trigger('translate.owl.carousel', [0, 500, true]);

            HotelTV.ui_utils.SetBusy(false);
            _state.menu.stage.cur = "main";
        });

        $(document).on('keydown', function(_evt) { //attach event listener
            let _opening = HotelTV.opening;
            let _trTbl = HotelTV.translation;

            if (_state.menu.stage.cur == "main") {
                console.log(`MM KEY EVENT::> ${_evt.keyCode}, UINT=>${parseInt(_evt.keyCode)}`);

                // 현재 재생중인 TV채널 종료
                if ( _state.tv.playing == true ){
                    console.warn("Try to channel shutdown..");
                    HotelTV.hcap.ChannelShutDown();
                    _state.tv.playing = false;
                }

                if (_evt.keyCode == gRmtKey.left) {
                    $('#lst_mmsel').trigger('prev.owl', 700)
                    //console.log("   MM ID::> " + _state.menu.main.cur + _program[_state.menu.main.cur].name);
                    HotelTV.api.ReportEvent([{'power': true, 'location':{'conId':_program[_state.menu.main.cur].id}}])
                } else if (_evt.keyCode == gRmtKey.right) {
                    $('#lst_mmsel').trigger('next.owl', 700)
                    //console.log("   MM ID::> " + _state.menu.main.cur + _program[_state.menu.main.cur].name);
                    HotelTV.api.ReportEvent([{'power': true, 'location':{'conId':_program[_state.menu.main.cur].id}}])
                } else if (_evt.keyCode == gRmtKey.enter) {
                    // 서브 메뉴 빌드 및 화면 전환
                    __uifxn_AppFull_ShowMMHotKeyBtn(false);
                    if (_program[Number(_state.menu.main.cur)].type.toLowerCase() == "normal") {
                        if (_program[Number(_state.menu.main.cur)].style.toLowerCase() == "none") {
                            console.log("It's Top level contents...");
                        } else if (_program[Number(_state.menu.main.cur)].style.toLowerCase() == "content") {
                            console.log("Preparing General sub contents...");
                        } else if (_program[Number(_state.menu.main.cur)].style.toLowerCase() == "submenu") {
                            console.log("Preparing General sub menu...");
                            __uifxn_AppFull_BldPage_SubGeneral();
                        }
                    } else if (_program[Number(_state.menu.main.cur)].type.toLowerCase() == "mypage") {
                        console.log("Preparing Mypage sub menu...");
                        __uifxn_AppFull_BuildMyPage();
                    } else if (_program[Number(_state.menu.main.cur)].type.toLowerCase() == "tv") {
                        console.log("Preparing TV sub menu...");
                        __uifxn_AppFull_TopWidjetShow(false);
                        __uifxn_AppFull_BldPage_SubTV();
                    } else if (_program[Number(_state.menu.main.cur)].type.toLowerCase() == "application") {
                        console.log("Preparing TV APP::>" + _program[Number(_state.menu.main.cur)].service);
                        if (_program[Number(_state.menu.main.cur)].service == "youtube") {
                            // console.log(`Type:${_program[Number(_state.menu.main.cur)].type} preparing WIFI AP...`);
                            // HotelTV.hcap.SetSoftAp({
                            //     "enable": true,
                            //     "ssid": "TVWIFI-" + HotelTV.guestinfo.room,
                            //     "password": "12345678",
                            // });
                            HotelTV.hcap.LaunchPreApp(_program[Number(_state.menu.main.cur)].service, null);
                        } else if (_program[Number(_state.menu.main.cur)].service == "netflix") {
                            let _foundNetflix = false;
                            for (_i = 0; _i < _state['hcap_app'].length; _i++) {
                                if (_state['hcap_app'][_i].title == 'Netflix') {
                                    _foundNetflix = true;
                                }
                            }

                            if (_foundNetflix == true) {
                                HotelTV.hcap.LaunchPreApp(_program[Number(_state.menu.main.cur)].service, { "hotel_name": HotelTV.hotelinfo.name });
                            } else {
                                HotelTV.ui_utils.ShowNotificationMsgBalloon(_trTbl.system.ott_service_not_ready[_state.lang], 5);
                            }
                        }
                    } else {
                        console.log(`Type:${_program[Number(_state.menu.main.cur)].type} doen's have sub menu...`);
                    }
                } else if (_evt.keyCode == gRmtKey.red) {
                    // RED BUTTON
                    if ("red" in _state.hotkey.mm) {
                        $('.guide>.tips').stop().animate({ backgroundColor: "rgba(0,0,0,0.8)" }, 500, function() {
                            if (_state.hotkey.mm.red.type == "brochure") {
                                $('.popup .hotkey_mm_red').fadeIn(1000, function() {
                                    _state.menu.stage.cur = "hotkey_mm_red";
                                    __uifxn_AppFull_ShowMMHotKeyBtn(false);
                                    __uifxn_AppFull_TopWidjetShow(false);
                                });
                            } else if (_state.hotkey.mm.red.type == "amenity") {
                                $('.popup .amenity').show(0, function() {
                                    $('.popup .amenity').animate({ top: 96, left: 64 }, 500, () => {
                                        _state.menu.stage.cur = "hotkey_mm_amenity";
                                        __uifxn_AppFull_DrawAmenityItem(true);
                                        __uifxn_AppFull_ShowMMHotKeyBtn(false);
                                    });
                                });
                            } else if (_state.hotkey.mm.red.type == "roomservice") {
                                $('.popup .roomservice').show(0, function() {
                                    $('.popup .roomservice').animate({ top: 96, left: 64 }, 500, () => {
                                        _state.menu.stage.cur = "hotkey_mm_roomservice";
                                        __uifxn_AppFull_DrawRoomserviceItem(true);
                                        __uifxn_AppFull_ShowMMHotKeyBtn(false);
                                    });
                                });
                            }
                        });
                        HotelTV.api.ReportEvent([{'power': true, 'location':{'conId':_state.hotkey.mm['red'].id}}])
                    }
                } else if (_evt.keyCode == gRmtKey.green) {
                    // GREEN BUTTON
                    if ("green" in _state.hotkey.mm) {
                        $('.guide>.tips').stop().animate({ backgroundColor: "rgba(0,0,0,0.8)" }, 500, function() {
                            if (_state.hotkey.mm.green.type == "brochure") {
                                $('.popup .hotkey_mm_green').fadeIn(1000, function() {
                                    _state.menu.stage.cur = "hotkey_mm_green";
                                    __uifxn_AppFull_ShowMMHotKeyBtn(false);
                                    __uifxn_AppFull_TopWidjetShow(false);
                                });
                            } else if (_state.hotkey.mm.green.type == "amenity") {
                                $('.popup .amenity').show(0, function() {
                                    $('.popup .amenity').animate({ top: 96, left: 64 }, 500, () => {
                                        _state.menu.stage.cur = "hotkey_mm_amenity";
                                        __uifxn_AppFull_DrawAmenityItem(true);
                                        __uifxn_AppFull_ShowMMHotKeyBtn(false);
                                    });
                                });
                            } else if (_state.hotkey.mm.green.type == "roomservice") {
                                $('.popup .roomservice').show(0, function() {
                                    $('.popup .roomservice').animate({ top: 96, left: 64 }, 500, () => {
                                        _state.menu.stage.cur = "hotkey_mm_roomservice";
                                        __uifxn_AppFull_DrawRoomserviceItem(true);
                                        __uifxn_AppFull_ShowMMHotKeyBtn(false);
                                    });
                                });
                            }
                        });
                        HotelTV.api.ReportEvent([{'power': true, 'location':{'conId':_state.hotkey.mm['green'].id}}])
                    }
                } else if (_evt.keyCode == gRmtKey.yellow) {
                    // YELLOW BUTTON
                    if ("yellow" in _state.hotkey.mm) {
                        $('.guide>.tips').stop().animate({ backgroundColor: "rgba(0,0,0,0.8)" }, 500, function() {
                            if (_state.hotkey.mm.yellow.type == "brochure") {
                                $('.popup .hotkey_mm_yellow').fadeIn(1000, function() {
                                    _state.menu.stage.cur = "hotkey_mm_yellow";
                                    __uifxn_AppFull_ShowMMHotKeyBtn(false);
                                    __uifxn_AppFull_TopWidjetShow(false);
                                });
                            } else if (_state.hotkey.mm.yellow.type == "amenity") {
                                $('.popup .amenity').show(0, function() {
                                    $('.popup .amenity').animate({ top: 96, left: 64 }, 500, () => {
                                        _state.menu.stage.cur = "hotkey_mm_amenity";
                                        __uifxn_AppFull_DrawAmenityItem(true);
                                        __uifxn_AppFull_ShowMMHotKeyBtn(false);
                                    });
                                });
                            } else if (_state.hotkey.mm.yellow.type == "roomservice") {
                                $('.popup .roomservice').show(0, function() {
                                    $('.popup .roomservice').animate({ top: 96, left: 64 }, 500, () => {
                                        _state.menu.stage.cur = "hotkey_mm_roomservice";
                                        __uifxn_AppFull_DrawRoomserviceItem(true);
                                        __uifxn_AppFull_ShowMMHotKeyBtn(false);
                                    });
                                });
                            }
                        });
                        HotelTV.api.ReportEvent([{'power': true, 'location':{'conId':_state.hotkey.mm['yellow'].id}}])
                    }
                } else if (_evt.keyCode == gRmtKey.blue) {
                    // BLUE BUTTON
                    if ("blue" in _state.hotkey.mm) {
                        $('.guide>.tips').stop().animate({ backgroundColor: "rgba(0,0,0,0.8)" }, 500, function() {
                            if (_state.hotkey.mm.blue.type == "brochure") {
                                $('.popup .hotkey_mm_blue').fadeIn(1000, function() {
                                    _state.menu.stage.cur = "hotkey_mm_blue";
                                    __uifxn_AppFull_ShowMMHotKeyBtn(false);
                                    __uifxn_AppFull_TopWidjetShow(false);
                                });
                            } else if (_state.hotkey.mm.blue.type == "amenity") {
                                $('.popup .amenity').show(0, function() {
                                    $('.popup .amenity').animate({ top: 96, left: 64 }, 500, () => {
                                        _state.menu.stage.cur = "hotkey_mm_amenity";
                                        __uifxn_AppFull_DrawAmenityItem(true);
                                        __uifxn_AppFull_ShowMMHotKeyBtn(false);
                                    });
                                });
                            } else if (_state.hotkey.mm.blue.type == "roomservice") {
                                $('.popup .roomservice').show(0, function() {
                                    $('.popup .roomservice').animate({ top: 96, left: 64 }, 500, () => {
                                        _state.menu.stage.cur = "hotkey_mm_roomservice";
                                        __uifxn_AppFull_DrawRoomserviceItem(true);
                                        __uifxn_AppFull_ShowMMHotKeyBtn(false);
                                    });
                                });
                            }
                        });
                        HotelTV.api.ReportEvent([{'power': true, 'location':{'conId':_state.hotkey.mm['blue'].id}}])
                    }
                } else if (_evt.keyCode == gRmtKey.amenity) {
                    // DEDICATED HOT KEY: Amenity
                    // Check amenity menu enabled
                    if (_opening.amenity) {
                        $('.popup .amenity').show(0, function() {
                            $('.popup .amenity').animate({ top: 96, left: 64 }, 500, () => {
                                _state.menu.stage.cur = "hotkey_mm_amenity";
                                __uifxn_AppFull_DrawAmenityItem(true);
                                __uifxn_AppFull_ShowMMHotKeyBtn(false);
                            });
                        });
                        HotelTV.api.ReportEvent([{'power': true, 'location':{'conId':_opening.amenity.id}}])
                    }
                } else if (_evt.keyCode == gRmtKey.roomservice) {
                    // DEDICATED HOT KEY: Room service
                    // Check room service menu enabled
                    if (_opening.roomService) {
                        $('.popup .roomservice').show(0, function() {
                            $('.popup .roomservice').animate({ top: 96, left: 64 }, 500, () => {
                                _state.menu.stage.cur = "hotkey_mm_roomservice";
                                __uifxn_AppFull_DrawRoomserviceItem(true);
                                __uifxn_AppFull_ShowMMHotKeyBtn(false);
                            });
                        });
                        HotelTV.api.ReportEvent([{'power': true, 'location':{'conId':_opening.amenity.roomService}}])
                    }
                } else if (_evt.keyCode == gRmtKey.flight) {
                    // DEDICATED HOT KEY: Flight
                    // Check flight main menu index and go
                    if (('flight' in _state['specialKey'])) {
                        $('#lst_mmsel').trigger("to.owl.carousel", [Number(_state['specialKey']['flight'].mm_index) - 1, 10, true]);
                        HotelTV.api.ReportEvent([{'power': true, 'location':{'conId':_state['specialKey']['flight'].id}}])
                    }
                } else if (_evt.keyCode == gRmtKey.weather) {
                    // DEDICATED HOT KEY: Weather
                    // Check flight main menu index and go
                    if (('weather' in _state['specialKey'])) {
                        $('#lst_mmsel').trigger("to.owl.carousel", [Number(_state['specialKey']['weather'].mm_index) - 1, 10, true]);
                        HotelTV.api.ReportEvent([{'power': true, 'location':{'conId':_state['specialKey']['weather'].id}}])
                    }
                } else if (_evt.keyCode == gRmtKey.tv) {
                    // DEDICATED HOT KEY: TV
                    // Check flight main menu index and go
                    if (('tv' in _state['specialKey'])) {
                        $('#lst_mmsel').trigger("to.owl.carousel", [Number(_state['specialKey']['tv'].mm_index) - 1, 10, true]);
                        HotelTV.api.ReportEvent([{'power': true, 'location':{'conId':_state['specialKey']['tv'].id}}])
                    }
                }
            } else if (_state.menu.stage.cur == "hotkey_mm_red") {
                console.log("HOTKEY(MM:RED) KEY EVENT::> " + _evt.keyCode);
                if (_evt.keyCode == gRmtKey.left) {
                    $('#lst_hotkey_mm_red').trigger('prev.owl')
                } else if (_evt.keyCode == gRmtKey.right) {
                    $('#lst_hotkey_mm_red').trigger('next.owl')
                } else if (_evt.keyCode == gRmtKey.back) {
                    $('.popup .hotkey_mm_red').fadeOut(1000, function() {
                        $('.popup .hotkey_mm_red').stop().animate({ backgroundColor: "rgba(0,0,0,0.0)" }, 500, function() {
                            $('.popup .hotkey_mm_red').css({ "background-color": "" });
                            _state.menu.stage.cur = "main";
                            __uifxn_AppFull_ShowMMHotKeyBtn(true);
                            __uifxn_AppFull_TopWidjetShow(true);
                        });
                    });
                }
            } else if (_state.menu.stage.cur == "hotkey_mm_green") {
                console.log("HOTKEY(MM:GREEN) KEY EVENT::> " + _evt.keyCode);
                if (_evt.keyCode == gRmtKey.left) {
                    $('#lst_hotkey_mm_green').trigger('prev.owl')
                } else if (_evt.keyCode == gRmtKey.right) {
                    $('#lst_hotkey_mm_green').trigger('next.owl')
                } else if (_evt.keyCode == gRmtKey.back) {
                    $('.popup .hotkey_mm_green').fadeOut(1000, function() {
                        $('.popup .hotkey_mm_green').stop().animate({ backgroundColor: "rgba(0,0,0,0.0)" }, 500, function() {
                            $('.popup .hotkey_mm_green').css({ "background-color": "" });
                            _state.menu.stage.cur = "main";
                            __uifxn_AppFull_ShowMMHotKeyBtn(true);
                            __uifxn_AppFull_TopWidjetShow(true);
                        });
                    });
                }
            } else if (_state.menu.stage.cur == "hotkey_mm_yellow") {
                console.log("HOTKEY(MM:YELLOW) KEY EVENT::> " + _evt.keyCode);
                if (_evt.keyCode == gRmtKey.left) {
                    console.log("LEFT");
                } else if (_evt.keyCode == 38) {
                    console.log("UP");
                } else if (_evt.keyCode == gRmtKey.right) {
                    console.log("RIGHT");
                } else if (_evt.keyCode == gRmtKey.down) {
                    console.log("DOWN");
                } else if (_evt.keyCode == gRmtKey.back) {
                    $('.popup .hotkey_mm_yellow').fadeOut(1000, function() {
                        $('.popup .hotkey_mm_yellow').stop().animate({ backgroundColor: "rgba(0,0,0,0.0)" }, 500, function() {
                            $('.popup .hotkey_mm_yellow').css({ "background-color": "" });
                            _state.menu.stage.cur = "main";
                            __uifxn_AppFull_ShowMMHotKeyBtn(true);
                            __uifxn_AppFull_TopWidjetShow(true);
                        });
                    });
                }
            } else if (_state.menu.stage.cur == "hotkey_mm_blue") {
                console.log("HOTKEY(MM:BLUE) KEY EVENT::> " + _evt.keyCode);
                if (_evt.keyCode == gRmtKey.left) {
                    console.log("LEFT");
                } else if (_evt.keyCode == 38) {
                    console.log("UP");
                } else if (_evt.keyCode == gRmtKey.right) {
                    console.log("RIGHT");
                } else if (_evt.keyCode == gRmtKey.down) {
                    console.log("DOWN");
                } else if (_evt.keyCode == gRmtKey.back) {
                    $('.popup .hotkey_mm_blue').fadeOut(1000, function() {
                        $('.popup .hotkey_mm_blue').stop().animate({ backgroundColor: "rgba(0,0,0,0.0)" }, 500, function() {
                            $('.popup .hotkey_mm_blue').css({ "background-color": "" });
                            _state.menu.stage.cur = "main";
                            __uifxn_AppFull_ShowMMHotKeyBtn(true);
                            __uifxn_AppFull_TopWidjetShow(true);
                        });
                    });
                }
            } else if (_state.menu.stage.cur == "hotkey_mm_amenity") {
                console.log("HOTKEY(MM:AMENITY: MENU) KEY EVENT::> " + _evt.keyCode);
                if (_evt.keyCode == gRmtKey.left) {
                    console.log("AMENITY::>LEFT");
                    __uifxn_AppFull_HandleAmenity("left", false, false, null);
                } else if (_evt.keyCode == 38) {
                    console.log("AMENITY::>UP");
                    __uifxn_AppFull_HandleAmenity("up", false, false, null);
                } else if (_evt.keyCode == gRmtKey.right) {
                    console.log("AMENITY::>RIGHT");
                    __uifxn_AppFull_HandleAmenity("right", false, false, null);
                } else if (_evt.keyCode == gRmtKey.down) {
                    console.log("AMENITY::>DOWN");
                    __uifxn_AppFull_HandleAmenity("down", false, false, null);
                } else if (_evt.keyCode == gRmtKey.enter) {
                    console.log("AMENITY::>ENTER");
                    __uifxn_AppFull_HandleAmenity("enter", false, false, function() {
                        _state.menu.stage.cur = "main";
                        __uifxn_AppFull_ShowMMHotKeyBtn(true);
                    });
                } else if (_evt.keyCode == gRmtKey.back) {
                    __uifxn_AppFull_HandleAmenity("back", true, false, function() {
                        _state.menu.stage.cur = "main";
                        __uifxn_AppFull_ShowMMHotKeyBtn(true);
                    });
                }
            } else if (_state.menu.stage.cur == "hotkey_mm_roomservice") {
                console.log("HOTKEY(MM:ROOMSERVICE: MENU) KEY EVENT::> " + _evt.keyCode);
                if (_evt.keyCode == gRmtKey.left) {
                    console.log("ROOMSERVICE::>LEFT");
                    __uifxn_AppFull_HandleRoomservice("left", false, false, null);
                } else if (_evt.keyCode == 38) {
                    console.log("ROOMSERVICE::>UP");
                    __uifxn_AppFull_HandleRoomservice("up", false, false, null);
                } else if (_evt.keyCode == gRmtKey.right) {
                    console.log("ROOMSERVICE::>RIGHT");
                    __uifxn_AppFull_HandleRoomservice("right", false, false, null);
                } else if (_evt.keyCode == gRmtKey.down) {
                    console.log("ROOMSERVICE::>DOWN");
                    __uifxn_AppFull_HandleRoomservice("down", false, false, null);
                } else if (_evt.keyCode == gRmtKey.enter) {
                    console.log("ROOMSERVICE::>ENTER");
                    __uifxn_AppFull_HandleRoomservice("enter", false, false, function() {
                        _state.menu.stage.cur = "main";
                        __uifxn_AppFull_ShowMMHotKeyBtn(true);
                    });
                } else if (_evt.keyCode == gRmtKey.back) {
                    __uifxn_AppFull_HandleRoomservice("back", true, false, function() {
                        _state.menu.stage.cur = "main";
                        __uifxn_AppFull_ShowMMHotKeyBtn(true);
                    });
                }
            }
        });

        _hndl_mmSel.on('change.owl.carousel', function(event) {
            // Update HotelTV menu status
            let _state = HotelTV.state;
            _state.menu.main.prev = Object.keys(_program)[event.page.index];
        });

        _hndl_mmSel.on('changed.owl.carousel', function(event) {
            // Update HotelTV menu status
            let _state = HotelTV.state;
            _state.menu.main.cur = Object.keys(_program)[event.page.index];
            __uifxn_AppFull_OnKeyDnEvt_MmSel(event);
            //console.log("MAIN IDX::>" + _state.menu.main.cur);
        });

        _hndl_mmSel.on('translate.owl.carousel', function(event) {
            /** 메뉴 셀렉터 좌/우 헨들링 및 이펙트 */
            //console.log("MM::> Translaged Event");
            let idx = 0;
            if (typeof event.item != 'undefined') {
                idx = event.item.index;
            } else {
                idx = $('.main .mm .slider .owl-item.active.center').index();
            }
            //console.log("Get Translate Event::>" + idx);
            $('.main .mm .slider .owl-item.focus').addClass('unfocus');
            $('.main .mm .slider .owl-item.focus').removeClass('focus');
            $('.main .mm .slider .owl-item').eq(idx).addClass('focus');
            $('.main .mm .slider .owl-item').eq(idx).removeClass('unfocus');
        });
    }

    /// 초기화 루틴

    //// 공개 API
    return {
        Init: function(width, height) {
            //ADD Media related event haldner
            document.addEventListener("media_event_received", __uifxn_AppFull_OnMediaEvt, false);
            //ADD Key(remote control) event handler
            document.addEventListener("keydown", __uifxn_AppFull_OnKeyDnEvtRec, false);
            //ADD Network related event handler
            document.addEventListener("network_event_received", __uifxn_AppFull_OnNetEvt, false);
            //ADD Event for the focus change of HCAP application
            document.addEventListener("hcap_application_focus_changed", __uifxn_AppFull_OnAppFocusEvt, false);
            //ADD Event for the result of HDMI connection change
            document.addEventListener("hdmi_connection_changed", __uifxn_AppFull_OnHdmiConChangeEvt, false);
            //ADD Event for the result of channel changed
            document.addEventListener("channel_changed", __uifxn_AppFull_OnTvChChgChangeEvt, false);
        },

        Show: function() {
            let _ctzWc = HotelTV.welcome;
            let _ctzGst = HotelTV.guestinfo;
            let _ctzHotel = HotelTV.hotelinfo;

            console.log("Preparing APP[FULL] Page");
            __uifxn_AppFull_BldPage_Main();
        },

        BGServiceEvent: function(_evt) {
            let _state = HotelTV.state;
            let _program = HotelTV.tvguide.program;

            if ( _evt == "update_flight" ){
                _state.schedule.flight_reflash = true;
            }else if ( _evt == "update_weather" ){
                _state.schedule.weather_reflash = true;
            }else if ( _evt == "update_widget" ){
                _state.schedule.widget_reflash = true;
            }

            // Update flight schedule table if user doesn't watch flight schedule screen
            if ( _state.schedule.flight_reflash == true) {
                //if (_program[Number(_state.menu.main.cur)].type.toLowerCase() != "flight")
                {
                    _state.schedule.flight_reflash = false;
                    console.warn("Updated flight scheudle UI table.");

                    //Flight Contents Buildup
                    __uifxn_AppFull_MM_BldFlight();
                }
            }

            // Update weather schedule table if user doesn't watch weather screen
            if ( _state.schedule.weather_reflash == true) {
                if (_program[Number(_state.menu.main.cur)].type.toLowerCase() != "weather"){
                    _state.schedule.weather_reflash = false;
                    console.log("Updated Weather UI table.");

                    //Weather Contents Buildup
                    if ( _state.weather.default_location!=null )
                    {
                        if ( Object.keys(_state.weather.default_location).length != 0 ){
                            //날씨 콘텐트 업데이트
                            __uifxn_AppFull_MM_BldWeather();
                        }
                    }
                }
            }

            // Update weather schedule table if user doesn't watch weather screen
            if ( _state.schedule.widget_reflash == true) {
                _state.schedule.widget_reflash = false;
                console.log("Updated Widget UI");

                //Widget:Weather Contents Buildup
                if ( _state.weather!=null )
                {
                    if ( Object.keys(_state.weather.default_location).length != 0 ){
                        //상단 날씨 아이콘 및 온도 표시
                        __uifxn_AppFull_TopWidjet_BuildWeather();
                    }
                }
            }
        },

        MqttEvent: function(_evt) {
            let _state = HotelTV.state;

            console.log("MQTT RECEVED MESSAGE::> " + _evt);
            if (_evt == "EVENT-MESSAGE-CREATE" || _evt == "EVENT-MESSAGE-UPDATE" || _evt == "EVENT-MESSAGE-DELETE") {
                //DO NEW GUEST MESSAGE&DO CHANGE GUEST MESSAGE
                HotelTV.api.GetMessage().then(_ret => {
                    HotelTV.message = _ret;
                    console.log("Get New Message contents");

                    let _el_tbls = $('div#lst_mypagebg div #mp_message_table #mp_msg_tblrec');
                    let _msg = HotelTV.message;
                    let _msg_unread_cnt = 0;
                    //기존 메시지 테이블 레코드 삭제
                    _el_tbls.children('tbody').remove();
                    _el_tbls.each(function(_idx, _item) {
                        let _sz_innerHTML = '<tbody>';
                        let _num_msgIdx = 0;
                        for (let _j = _msg.length; _j > 0; _j--) {
                            _sz_innerHTML += '<tr msgnum=' + _j + ' msgidx=' + _num_msgIdx.toString() + ' >';
                            if (_msg[_j].read == false) {
                                _sz_innerHTML += '<td id="num">' + _j.toString() + '</td>';
                            } else {
                                _sz_innerHTML += '<td id="num" class="read">' + _j.toString() + '</td>';
                            }

                            if (_msg[_j].multilanguage == false) {
                                _sz_innerHTML += '<td id="title">' + _msg[_j].title.default+'</td>';
                            } else {
                                _sz_innerHTML += '<td id="title">' + _msg[_j].title[_state.lang] + '</td>';
                            }
                            _sz_innerHTML += '<td id="from">' + _msg[_j].from + '</td>';
                            _sz_innerHTML += '<td id="date">' + _msg[_j].createdAt + '</td>';
                            _sz_innerHTML += '</tr>';
                            _num_msgIdx++;
                        }
                        _sz_innerHTML += '</tbody>';
                        $(_item).html(_sz_innerHTML);
                    });

                    // 사용자가 메시지 메뉴를 사용중인경우에 대한 처리
                    if (_state.menu.stage.cur == "popup_message_card" || _state.menu.stage.cur == "mypage") {
                        const _mmIdx = _state.menu.main.cur;
                        // 메시지 상태 오브젝트 초기화
                        if ("message" in _state.menu.main[_mmIdx]) {
                            _state.menu.main[_mmIdx]['message'] = {
                                'cnt': _msg.length,
                                'cur': 0,
                                'prev': null,
                            };
                        }
                        $('.main>.mypage>.bg>.owl-carousel .owl-item #mp_msg_tblrec tr').removeClass('focus');
                        $('.main>.mypage>.bg>.owl-carousel .owl-item #mp_msg_tblrec tr').filter("[msgidx='" + _state.menu.main[_mmIdx]['message']['cur'] + "']").addClass('focus');
                    }

                    //메시지 개수 표시
                    const _guest = HotelTV.guestinfo;
                    let _trTbl = HotelTV.translation;
                    for (let _j = _msg.length; _j > 0; _j--) {
                        if (_msg[_j].read == false) {
                            _msg_unread_cnt++;
                        }
                    }
                    $('div#lst_mypagebg div #mp_message_title').text(_guest.name + _trTbl.ui.mypage.message.title.title[_state.lang].replace("_XX", _msg_unread_cnt.toString()));

                    //widjet 상단 메시지(unread)개수 표시
                    __uifxn_AppFull_TopWidjet_BuildMsgCnt();

                    //신규 메시지 볼룬팝업
                    HotelTV.ui_utils.ShowNotificationMsgBalloon(_guest.name + _trTbl.ui.mypage.message.title.title_widget[_state.lang].replace("_XX", _msg_unread_cnt.toString()), 10);
                }).catch(_error => {
                    console.log("Fail to get Message info");
                });
            } else if (_evt == "EVENT-NEWS-UPDATE") {
                //DO NEW NEWS
                HotelTV.api.GetNews().then(_ret => {
                    HotelTV.news = _ret;
                    console.log("Get New News contents");
                    __uifxn_AppFull_BldNews();
                }).catch(_error => {
                    console.log("Fail to get news info");
                });
            } else if (_evt == "EVENT-EMERGENCY-START") {

            } else if (_evt == "EVENT-EMERGENCY-STOT") {

            } else if (_evt == "COMMAND-SYSTEM-RESTART") {
                let _tmval = 10;
                let _state = HotelTV.state;
                let _trTbl = HotelTV.translation;

                HotelTV.ui_utils.ShowSysNoticeMsg(true,
                    "notice",
                    "SYSTEM NOTICE",
                    _trTbl.system.notice.event.mqtt.system_reboot[_state.lang], {
                        "timeout": _tmval,
                        "cb_disp": function() {
                            _tmval -= 1;
                            console.log("time..." + _tmval);
                            if ($('.error #countdown').css("display") == "none") {
                                $('.error #countdown').fadeIn(1000);
                            }
                            $('.error #countdown #message').text(`System will be shutdown in ${_tmval} second...`);
                        },
                        "cb_eoe": function() {
                            setTimeout(HotelTV.hcap.PwrOff(), 500);
                            HotelTV.api.ReportEvent([{'power': false, 'location':null}])
                        }
                    });
            } else if (_evt == "GUEST-CHECKIN") {

            } else if (_evt == "GUEST-CHECKOUT") {
                let _tmval = 30;
                let _state = HotelTV.state;
                let _trTbl = HotelTV.translation;

                HotelTV.ui_utils.ShowSysNoticeMsg(true,
                    "notice",
                    "SYSTEM NOTICE",
                    _trTbl.system.notice.event.mqtt.checkout[_state.lang], {
                        "timeout": _tmval,
                        "cb_disp": function() {
                            _tmval -= 1;
                            console.log("time..." + _tmval);
                            if ($('.error #countdown').css("display") == "none") {
                                $('.error #countdown').fadeIn(1000);
                            }
                            $('.error #countdown #message').text(`System will be shutdown in ${_tmval} second...`);
                        },
                        "cb_eoe": function() {
                            setTimeout(HotelTV.hcap.PwrOff(), 500);
                            HotelTV.api.ReportEvent([{'power': false, 'location':null}])
                        }
                    });
            } else if (_evt == "GUEST-UPDATE") {

            } else if (_evt == "GUEST-ROOMCHANGE") {
                let _tmval = 30;
                let _state = HotelTV.state;
                let _trTbl = HotelTV.translation;

                HotelTV.ui_utils.ShowSysNoticeMsg(true,
                    "notice",
                    "SYSTEM NOTICE",
                    _trTbl.system.notice.event.mqtt.room_change[_state.lang], {
                        "timeout": _tmval,
                        "cb_disp": function() {
                            _tmval -= 1;
                            console.log("time..." + _tmval);
                            if ($('.error #countdown').css("display") == "none") {
                                $('.error #countdown').fadeIn(1000);
                            }
                            $('.error #countdown #message').text(`System will be shutdown in ${_tmval} second...`);
                        },
                        "cb_eoe": function() {
                            setTimeout(HotelTV.hcap.PwrOff(), 500);
                            HotelTV.api.ReportEvent([{'power': false, 'location':null}])
                        }
                    });
            }
        },

        UpdateEpg: function() {
            let _state = HotelTV.state;
            let _trTbl = HotelTV.translation;

            if (_state.menu.stage.cur != 'tvCtgHide') {
                return;
            }

            let _el_tvctglst = $('.main .tv .bg .owl-item>.item');
            if (_el_tvctglst.length > 0) {
                _el_tvctglst.each(function(_idx, _item) {
                    let _el_epg_items = $(_item[_idx]).find('span#tvch_epg_info')
                    _el_epg_items.each(function(_j, _ch) {
                        let _epg_id = _ch.attr('epg_id');
                        let _epg_inf = __uifxn_AppFull_GetEpgInfoById(_epg_id);
                        if (_epg_inf != null) {
                            _ch.text(_egp_prog_inf.name);
                        } else {
                            _ch.text(_trTbl.ui.tv.epg.msg.none_epg_info[_state.lang]);
                        }
                    });
                });
            }
        },

        Close: function() {
            SpatialNavigation.clear();
        },
    }
})();