sysadmin/ct-dtv-hx0100-002kwos
1
0
Fork 0
Code Issues 5 Pull Requests Actions Packages Projects Releases Wiki Activity

issue #11 Done shooping cart on amenity category item selection.

Browse Source
This commit is contained in:
Paul Kim
2024-03-15 22:37:30 +09:00
parent d805f4bb44
commit 2b36279807
2 changed files with 256 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files

308
procentric/application/lib/hoteltv.ui_appfull.js
View File

@@ -622,10 +622,16 @@ HotelTV.ui_appfull = (function() {
} }
} }
/** /**
* HotelTV UI[AppFull] Wrapper Function::> Draw amenity item selection cart ui * HotelTV UI[AppFull] Wrapper Function::> Draw amenity item selection cart ui
* @param {string} _action
* @param {function} _cbFxnExit
*/ */
function __uifxn_AppFull_DrawAmItemSeletionCart(_action) { function __uifxn_AppFull_DrawAmItemSeletionCart(_action, _cbFxnExit) {
let _state = HotelTV.state; let _state = HotelTV.state;
let _trTbl = HotelTV.translation; let _trTbl = HotelTV.translation;
let _opening = HotelTV.opening; let _opening = HotelTV.opening;
@@ -633,6 +639,7 @@ HotelTV.ui_appfull = (function() {
let _order = HotelTV.orders.amenity; let _order = HotelTV.orders.amenity;
let _aminfo_top = _opening.amenity; let _aminfo_top = _opening.amenity;
let _aminfo_ctgy = _aminfo_top.menu; let _aminfo_ctgy = _aminfo_top.menu;
let _aminfo_item = null;
let _elAmPupRoot = $('.popup .amenity'); let _elAmPupRoot = $('.popup .amenity');
let _elAmCtgyBg = _elAmPupRoot.children('.bg').find('#lst_ctgbg'); let _elAmCtgyBg = _elAmPupRoot.children('.bg').find('#lst_ctgbg');
let _elAmCtgyBgFocus = _elAmCtgyBg.find('.owl-item.active.center'); let _elAmCtgyBgFocus = _elAmCtgyBg.find('.owl-item.active.center');
@@ -643,9 +650,12 @@ HotelTV.ui_appfull = (function() {
let __status_am_specific = null; let __status_am_specific = null;
const __ifxn_estimateAmCartAmount = function(_item_idx) {
/**
* order/add to cart/back중 포커스 된 버턴의 ID를 반환
*/
const __ifxn_getFocusedBtnID = function() {
return _elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('.focus').attr('id');
} }
@@ -662,56 +672,63 @@ HotelTV.ui_appfull = (function() {
const __ifxn_updateAmCartRecTable = function() { const __ifxn_updateAmCartRecTable = function() {
try{ try{
let _elAmCtgyBgMenuItemCartLstRecTbl = _elAmCtgyBgMenuItemCartWinRight.children('.cart_table').find('.tbl_record'); const __ifxn_getValidCartItemCount = function(_cartObj) {
let ___validCnt = 0;
if ( _elAmCtgyBgMenuItemCartLstRecTbl.length ) for (let _j = 1; _j <= _cartObj.items.length; _j++) {
{ if ( _cartObj.items[_j].id ){
// Remove all record under tbl_record ___validCnt++;
_elAmCtgyBgMenuItemCartLstRecTbl.children().remove(); }
}
// { return ___validCnt;
// let _elTBody_ItmesRec = document.createElement('tbody');
// _elTBody_ItmesRec.setAttribute("id", "record");
// for (let _j = 1; _j <= _objAm_ctgyItem.length; _j++) {
// let _objChkAvail=null;
// let _objItem = _objAm_ctgyItem[_j];
// var _elTr_ItmesRec = document.createElement('tr');
// var _elDiv_ItmesRec = document.createElement('div');
// _elDiv_ItmesRec.className = "cartItem";
// var _elDiv_ItmesRecName = document.createElement('div');
// _elDiv_ItmesRecName.setAttribute("id", "title");
// _elDiv_ItmesRecName.textContent = _objItem.title[_state.lang];
// _elDiv_ItmesRec.appendChild(_elDiv_ItmesRecName);
// var _elDiv_ItmesRecPrice = document.createElement('div');
// _elDiv_ItmesRecPrice.setAttribute("id", "quantity");
// _elDiv_ItmesRecPrice.textContent = _objItem.quantity[_state.lang].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + _aminfo_top.currency[_state.lang];
// _elDiv_ItmesRec.appendChild(_elDiv_ItmesRecPrice);
// var _elDiv_ItmesRecStatus = document.createElement('div');
// _elDiv_ItmesRecStatus.setAttribute("id", "amount");
// _objChkAvail = __uifxn_Utils_CheckAmItemAvailable(_objItem.schedule);
// if(_objChkAvail.result==true){
// _elDiv_ItmesRecStatus.textContent = _trTbl.ui.amenity.title.orderable[_state.lang];
// }else{
// _elDiv_ItmesRec.classList.add("unavailable");
// if ( _objChkAvail.avail_dtime=="unorderable" ){
// _elDiv_ItmesRecStatus.textContent = _trTbl.ui.amenity.title.unorderable[_state.lang];
// }else{
// _elDiv_ItmesRecStatus.textContent = _objChkAvail.avail_dtime;
// }
// }
// _elDiv_ItmesRec.appendChild(_elDiv_ItmesRecStatus);
// _elTr_ItmesRec.appendChild(_elDiv_ItmesRec);
// _elTBody_ItmesRec.appendChild(_elTr_ItmesRec);
// }
// _elAmCtgyBgMenuItemCartLstRecTbl.appendChild(_elTBody_ItmesRec);
// }
} }
let _elAmCtgyBgMenuItemCartLstRecTbl = _elAmCtgyBgMenuItemCartWinRight.children('.cart_table').find('.tbl_record');
if ( _elAmCtgyBgMenuItemCartLstRecTbl.length ){
// Remove all record under tbl_record
_elAmCtgyBgMenuItemCartLstRecTbl.children().remove();
}
if ( __ifxn_getValidCartItemCount(_carts)==0 ){
// 카트에 유효한 아이템이 없음. 테이블 그릴필요 없음.
return ;
}
// 카트 리스트 구성
if ( _carts.items.length>0 )
{
let _elTBody_ItmesRec = document.createElement('tbody');
_elTBody_ItmesRec.setAttribute("id", "record");
for (let _j = 1; _j <= _carts.items.length; _j++) {
let _objCartItem = _carts.items[_j];
if ( _objCartItem.id==null ){
continue;
}
var _elTr_CartItmesRec = document.createElement('tr');
var _elDiv_CartItmesRec = document.createElement('div');
_elDiv_CartItmesRec.className = "cartItem";
var _elDiv_CartItmesRecName = document.createElement('div');
_elDiv_CartItmesRecName.setAttribute("id", "title");
_elDiv_CartItmesRecName.textContent = _objCartItem.title[_state.lang];
_elDiv_CartItmesRec.appendChild(_elDiv_CartItmesRecName);
var _elDiv_CartItmesRecQuantity = document.createElement('div');
_elDiv_CartItmesRecQuantity.setAttribute("id", "quantity");
_elDiv_CartItmesRecQuantity.textContent = _objCartItem.quantity;
_elDiv_CartItmesRec.appendChild(_elDiv_CartItmesRecQuantity);
var _elDiv_CartItmesRecPrice = document.createElement('div');
_elDiv_CartItmesRecPrice.setAttribute("id", "amount");
_elDiv_CartItmesRecPrice.textContent = _objCartItem.price[_state.lang].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + _aminfo_top.currency[_state.lang];
_elDiv_CartItmesRec.appendChild(_elDiv_CartItmesRecPrice);
_elTr_CartItmesRec.appendChild(_elDiv_CartItmesRec);
_elTBody_ItmesRec.appendChild(_elTr_CartItmesRec);
}
_elAmCtgyBgMenuItemCartLstRecTbl.append(_elTBody_ItmesRec);
}
} catch ( _err ){ } catch ( _err ){
console.log(`Fail to update::> ${_err}`); console.log(`Fail to update::> ${_err}`);
} }
@@ -726,7 +743,6 @@ HotelTV.ui_appfull = (function() {
let __api_resp_stock = null; let __api_resp_stock = null;
let __selected_item_amount_quantity = 0; let __selected_item_amount_quantity = 0;
let __selected_item_amount_subTotal = 0; let __selected_item_amount_subTotal = 0;
let __item_info = _aminfo_ctgy[__status_am_specific.category_sel.cur].items[_item_idx+1];
let _elDiv_QuntCtrlFrmQuantityValue = _elAmCtgyBgMenuItemCartWinLeft.children('.control').children('.quantity').find('#value_quantity'); let _elDiv_QuntCtrlFrmQuantityValue = _elAmCtgyBgMenuItemCartWinLeft.children('.control').children('.quantity').find('#value_quantity');
let _elDiv_QuntCtrlFrmAmountValue = _elAmCtgyBgMenuItemCartWinLeft.children('.control').children('.quantity').find('#value_amount'); let _elDiv_QuntCtrlFrmAmountValue = _elAmCtgyBgMenuItemCartWinLeft.children('.control').children('.quantity').find('#value_amount');
@@ -776,28 +792,31 @@ HotelTV.ui_appfull = (function() {
// i) 현재 카트내에 해당 item id에 해당하는 개수르 구함. // i) 현재 카트내에 해당 item id에 해당하는 개수르 구함.
// ii) stock API로 총 비용을 산정 // ii) stock API로 총 비용을 산정
if ( _action=="build" ){ if ( _action=="build" ){
__selected_item_amount_quantity = ___ifxn_getCartItemQuantity(_carts.items, __item_info.id); __selected_item_amount_quantity = ___ifxn_getCartItemQuantity(_carts.items, _aminfo_item.id);
__status_am_specific.stock[__item_info.id] = {"req_quantity": __selected_item_amount_quantity}; __status_am_specific.stock[_aminfo_item.id] = {"req_quantity": __selected_item_amount_quantity};
___ifxn_updateSubTotalAmount(__item_info.id, __selected_item_amount_quantity); ___ifxn_updateSubTotalAmount(_aminfo_item.id, __selected_item_amount_quantity);
} else if ( _action=="plus" ){ } else if ( _action=="plus" ){
__status_am_specific.stock[__item_info.id].req_quantity += 1; __status_am_specific.stock[_aminfo_item.id].req_quantity += 1;
___ifxn_updateSubTotalAmount(__item_info.id, __status_am_specific.stock[__item_info.id].req_quantity); ___ifxn_updateSubTotalAmount(_aminfo_item.id, __status_am_specific.stock[_aminfo_item.id].req_quantity);
} else if ( _action=="minus" ){ } else if ( _action=="minus" ){
if ( __status_am_specific.stock[__item_info.id].req_quantity>1 ){ if ( __status_am_specific.stock[_aminfo_item.id].req_quantity>1 ){
__status_am_specific.stock[__item_info.id].req_quantity -= 1; __status_am_specific.stock[_aminfo_item.id].req_quantity -= 1;
___ifxn_updateSubTotalAmount(__item_info.id, __status_am_specific.stock[__item_info.id].req_quantity); ___ifxn_updateSubTotalAmount(_aminfo_item.id, __status_am_specific.stock[_aminfo_item.id].req_quantity);
} }
} }
// 개수 및 금액 출력 // 개수 및 금액 출력
if ( _elDiv_QuntCtrlFrmQuantityValue.length ){ if ( _elDiv_QuntCtrlFrmQuantityValue.length ){
_elDiv_QuntCtrlFrmQuantityValue.text(__status_am_specific.stock[__item_info.id].req_quantity); _elDiv_QuntCtrlFrmQuantityValue.text(__status_am_specific.stock[_aminfo_item.id].req_quantity);
} }
} }
/**
* 어메니티 수량 선택 및 카트 윈도우 빌드업
* @param {number} _item_idx
*/
const __ifxn_buildAmSelectedItemCartWin = function(_item_idx) { const __ifxn_buildAmSelectedItemCartWin = function(_item_idx) {
let _sz_styleOpt = null; let _sz_styleOpt = null;
let __item_info = _aminfo_ctgy[__status_am_specific.category_sel.cur].items[_item_idx+1];
const __iCbfxn_buildAmSelectedItemWin = function() { const __iCbfxn_buildAmSelectedItemWin = function() {
// 상품 상세 설명페이지 구성 // 상품 상세 설명페이지 구성
@@ -814,7 +833,7 @@ HotelTV.ui_appfull = (function() {
//// Quantity control Frame //// Quantity control Frame
var _elDiv_QuntCtrlFrm = document.createElement('div'); var _elDiv_QuntCtrlFrm = document.createElement('div');
_elDiv_QuntCtrlFrm.className = "control"; _elDiv_QuntCtrlFrm.className = "control";
_elDiv_QuntCtrlFrm.innerHTML = `<div id="img_thumbnail" style="background-image: url(${__item_info.thumbnail.files[_state.lang].download});"></div>`; _elDiv_QuntCtrlFrm.innerHTML = `<div id="img_thumbnail" style="background-image: url(${_aminfo_item.thumbnail.files[_state.lang].download});"></div>`;
var _elDiv_QuntCtrlFrmQuantity = document.createElement('div'); var _elDiv_QuntCtrlFrmQuantity = document.createElement('div');
_elDiv_QuntCtrlFrmQuantity.className = "quantity"; _elDiv_QuntCtrlFrmQuantity.className = "quantity";
_elDiv_QuntCtrlFrmQuantity.innerHTML = `<div id="lable_quantity">${_trTbl.ui.amenity.title.quantity[_state.lang].toUpperCase()}</div>`; _elDiv_QuntCtrlFrmQuantity.innerHTML = `<div id="lable_quantity">${_trTbl.ui.amenity.title.quantity[_state.lang].toUpperCase()}</div>`;
@@ -827,14 +846,14 @@ HotelTV.ui_appfull = (function() {
//// Item description //// Item description
var _elDiv_QuntItemDesc = document.createElement('div'); var _elDiv_QuntItemDesc = document.createElement('div');
_elDiv_QuntItemDesc.className = "description"; _elDiv_QuntItemDesc.className = "description";
_elDiv_QuntItemDesc.innerHTML = `<div id="title">${__item_info.title[_state.lang]}</div><div id="details">${__item_info.description[_state.lang]}</div>`; _elDiv_QuntItemDesc.innerHTML = `<div id="title">${_aminfo_item.title[_state.lang]}</div><div id="details">${_aminfo_item.description[_state.lang]}</div>`;
_elAmCtgyBgMenuItemCartWinLeft.append(_elDiv_QuntItemDesc); _elAmCtgyBgMenuItemCartWinLeft.append(_elDiv_QuntItemDesc);
//// Buttons //// Buttons
var _elDiv_QuntBtnFrm = document.createElement('div'); var _elDiv_QuntBtnFrm = document.createElement('div');
_elDiv_QuntBtnFrm.className = "buttons"; _elDiv_QuntBtnFrm.className = "buttons";
_elDiv_QuntBtnFrm.innerHTML = `<div id="btn_addtocart">${_trTbl.ui.amenity.title.add_to_cart[_state.lang].toUpperCase()}</div>`; _elDiv_QuntBtnFrm.innerHTML = `<div id="btn_ordernow">${_trTbl.ui.amenity.title.order_now[_state.lang].toUpperCase()}</div>`;
_elDiv_QuntBtnFrm.innerHTML += `<div id="btn_ordernow">${_trTbl.ui.amenity.title.order_now[_state.lang].toUpperCase()}</div>`; _elDiv_QuntBtnFrm.innerHTML += `<div id="btn_addtocart">${_trTbl.ui.amenity.title.add_to_cart[_state.lang].toUpperCase()}</div>`;
_elDiv_QuntBtnFrm.innerHTML += `<div id="btn_back">${_trTbl.ui.amenity.title.back[_state.lang].toUpperCase()}</div>`; _elDiv_QuntBtnFrm.innerHTML += `<div id="btn_back">${_trTbl.ui.amenity.title.back[_state.lang].toUpperCase()}</div>`;
_elAmCtgyBgMenuItemCartWinLeft.append(_elDiv_QuntBtnFrm); _elAmCtgyBgMenuItemCartWinLeft.append(_elDiv_QuntBtnFrm);
} }
@@ -862,18 +881,18 @@ HotelTV.ui_appfull = (function() {
var _elTr_ItmesHdr = document.createElement('tr'); var _elTr_ItmesHdr = document.createElement('tr');
var _elTh_ItmesHdr_Title = document.createElement('th'); var _elTh_ItmesHdr_Title = document.createElement('th');
_elTh_ItmesHdr_Title.setAttribute("id", "title"); _elTh_ItmesHdr_Title.setAttribute("id", "title");
_elTh_ItmesHdr_Title.textContent = _trTbl.ui.amenity.title.item[_state.lang]; _elTh_ItmesHdr_Title.textContent = _trTbl.ui.amenity.title.item[_state.lang].toUpperCase();
_elTr_ItmesHdr.appendChild(_elTh_ItmesHdr_Title); _elTr_ItmesHdr.appendChild(_elTh_ItmesHdr_Title);
var _elTh_ItmesHdr_Amount = document.createElement('th'); var _elTh_ItmesHdr_Amount = document.createElement('th');
_elTh_ItmesHdr_Amount.setAttribute("id", "quantity"); _elTh_ItmesHdr_Amount.setAttribute("id", "quantity");
_elTh_ItmesHdr_Amount.textContent = _trTbl.ui.amenity.title.quantity[_state.lang]; _elTh_ItmesHdr_Amount.textContent = _trTbl.ui.amenity.title.quantity[_state.lang].toUpperCase();
_elTr_ItmesHdr.appendChild(_elTh_ItmesHdr_Amount); _elTr_ItmesHdr.appendChild(_elTh_ItmesHdr_Amount);
var _elTh_ItmesHdr_Status = document.createElement('th'); var _elTh_ItmesHdr_Status = document.createElement('th');
_elTh_ItmesHdr_Status.setAttribute("id", "amount"); _elTh_ItmesHdr_Status.setAttribute("id", "amount");
//toUppderCase() //toUppderCase()
_elTh_ItmesHdr_Status.textContent = _trTbl.ui.amenity.title.amount[_state.lang]; _elTh_ItmesHdr_Status.textContent = _trTbl.ui.amenity.title.amount[_state.lang].toUpperCase();
_elTr_ItmesHdr.appendChild(_elTh_ItmesHdr_Status); _elTr_ItmesHdr.appendChild(_elTh_ItmesHdr_Status);
_elTBody_ItmesHdr.appendChild(_elTr_ItmesHdr); _elTBody_ItmesHdr.appendChild(_elTr_ItmesHdr);
@@ -885,12 +904,12 @@ HotelTV.ui_appfull = (function() {
var _elTbl_ItemsRec = document.createElement('table'); var _elTbl_ItemsRec = document.createElement('table');
_elTbl_ItemsRec.className = "tbl_record"; _elTbl_ItemsRec.className = "tbl_record";
_elDiv_CartWinTable.appendChild(_elTbl_ItemsRec); _elDiv_CartWinTable.appendChild(_elTbl_ItemsRec);
//////// update cart table record
__ifxn_updateAmCartRecTable();
} }
_elAmCtgyBgMenuItemCartWinRight.append(_elDiv_CartWinTable); _elAmCtgyBgMenuItemCartWinRight.append(_elDiv_CartWinTable);
//////// update cart table record
__ifxn_updateAmCartRecTable();
//// Quantity Window Title //// Quantity Window Title
@@ -901,17 +920,20 @@ HotelTV.ui_appfull = (function() {
} }
} }
// 카테고리매뉴윈도우 hide -> 아이템선택 윈도우 빌드 -> 아이탬선택 윈도우 show -> 버튼 포커스(back)
_elAmCtgyBgMenuItemWin.fadeOut(200, function() { _elAmCtgyBgMenuItemWin.fadeOut(200, function() {
__iCbfxn_buildAmSelectedItemWin(); __iCbfxn_buildAmSelectedItemWin();
_elAmCtgyBgMenuItemCartWin.fadeIn(500, function() { _elAmCtgyBgMenuItemCartWin.fadeIn(500, function() {
_elAmCtgyBgMenuItemCartWinLeft.find('#btn_back').addClass('focus'); _elAmCtgyBgMenuItemCartWinLeft.find('#btn_back').addClass('focus');
__ifxn_updateAmSelectedItemCartWin(_item_idx, "build"); __ifxn_updateAmSelectedItemCartWin(_item_idx, "build");
// 통계 이벤트 송출
HotelTV.api.ReportEvent([ HotelTV.api.ReportEvent([
{ {
'power': true, 'power': true,
'location':{ 'location':{
// TODO: 통계 데이터 파라미터 확인해 // TODO: 통계 데이터 파라미터 확인해
'conId':__item_info.id 'conId':_aminfo_item.id
} }
}], "indirect"); }], "indirect");
}); });
@@ -931,14 +953,47 @@ HotelTV.ui_appfull = (function() {
} }
const __ifxn_processAmAddtoCart = async function(_item_idx, _new_quantity, _cbFxn_Success, _cbFxn_Failure) {
try {
console.log("_item_idx:" + _item_idx);
console.log("_new_quantity:" + _new_quantity);
// let _result = await HotelTV.api.PutAmenityCarts(_item_idx, _new_quantity);
// if (_result) {
// if (_cbFxn_Success) {
// _cbFxn_Success();
// }
// } else {
// if (_cbFxn_Failure) {
// _cbFxn_Failure();
// }
// }
} catch ( _err ){
console.log(`Fail to call API::> ${_err}`);
}
}
try{ try{
let _objChkAvail=null;
let _str_curBtnID = null;
// 어메니티 정보 오브젝트 // 어메니티 정보 오브젝트
_aminfo_top = _opening.amenity;
_aminfo_ctgy = _aminfo_top.menu;
__status_am_specific = _state.hotkey.mm[_aminfo_top.button].status; __status_am_specific = _state.hotkey.mm[_aminfo_top.button].status;
let __amctgyIdx = __status_am_specific.category_sel.cur; let __amctgyIdx = __status_am_specific.category_sel.cur;
let __amctgyItemStatus = __status_am_specific.items[_aminfo_ctgy[__amctgyIdx].name]; let __amctgyItemStatus = __status_am_specific.items[_aminfo_ctgy[__amctgyIdx].name];
// 선택된 어메니티 아이템 정보 매핑
_aminfo_item = _aminfo_ctgy[__status_am_specific.category_sel.cur].items[__amctgyItemStatus.idx+1];
_objChkAvail = __uifxn_Utils_CheckAmItemAvailable(_aminfo_item.schedule);
if(_objChkAvail.result==false){
return false;
}
if ( ["left","right","enter"].includes(_action) ){
_str_curBtnID = __ifxn_getFocusedBtnID();
}
switch ( _action ) switch ( _action )
{ {
case "cart": { case "cart": {
@@ -946,22 +1001,20 @@ HotelTV.ui_appfull = (function() {
} break; } break;
case "left": { case "left": {
let _str_curBtnID = _elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('.focus').attr('id');
if ( _str_curBtnID=='btn_back' ){ if ( _str_curBtnID=='btn_back' ){
_elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('.focus').removeClass('focus');
_elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('#btn_ordernow').addClass('focus');
} else if ( _str_curBtnID=='btn_ordernow' ){
_elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('.focus').removeClass('focus'); _elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('.focus').removeClass('focus');
_elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('#btn_addtocart').addClass('focus'); _elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('#btn_addtocart').addClass('focus');
} else if ( _str_curBtnID=='btn_addtocart' ){
_elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('.focus').removeClass('focus');
_elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('#btn_ordernow').addClass('focus');
} }
} break; } break;
case "right": { case "right": {
let _str_curBtnID = _elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('.focus').attr('id'); if ( _str_curBtnID=='btn_ordernow' ){
if ( _str_curBtnID=='btn_addtocart' ){
_elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('.focus').removeClass('focus'); _elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('.focus').removeClass('focus');
_elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('#btn_ordernow').addClass('focus'); _elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('#btn_addtocart').addClass('focus');
} else if ( _str_curBtnID=='btn_ordernow' ){ } else if ( _str_curBtnID=='btn_addtocart' ){
_elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('.focus').removeClass('focus'); _elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('.focus').removeClass('focus');
_elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('#btn_back').addClass('focus'); _elAmCtgyBgMenuItemCartWinLeft.find('.buttons').find('#btn_back').addClass('focus');
} }
@@ -975,13 +1028,41 @@ HotelTV.ui_appfull = (function() {
__ifxn_updateAmSelectedItemCartWin(__amctgyItemStatus.idx, "minus"); __ifxn_updateAmSelectedItemCartWin(__amctgyItemStatus.idx, "minus");
} break; } break;
case "enter": {
if ( _str_curBtnID=='btn_ordernow' ){
console.log("TODO::>> ORDERING NOW...");
} else if ( _str_curBtnID=='btn_addtocart' ){
//console.log("TODO::>> ADD TO CART NOW...");
__ifxn_processAmAddtoCart(
__amctgyItemStatus.idx,
__status_am_specific.stock[_aminfo_item.id].req_quantity,
function() {
},
function() {
}
);
} else if ( _str_curBtnID=='btn_back' ){
__ifxn_removeAmSelectedItemCartWin();
if ( _cbFxnExit ){
_cbFxnExit();
}
}
} break;
case "return": { case "return": {
__ifxn_removeAmSelectedItemCartWin(); __ifxn_removeAmSelectedItemCartWin();
if ( _cbFxnExit ){
_cbFxnExit();
}
} break; } break;
} }
return true;
}catch(_err){ }catch(_err){
console.log(`Fail to draw::> ${_err}`); console.log(`Fail to draw::> ${_err}`);
return false;
} }
} }
@@ -1002,7 +1083,7 @@ HotelTV.ui_appfull = (function() {
let __status_am_specific = null; let __status_am_specific = null;
const __ifxn_updateAmItemDesc = function(_item_idx) { const __ifxn_updateAmItemDesc = function(_item_idx,_cbFxn) {
let _sz_styleOpt = null; let _sz_styleOpt = null;
let __item_info = _aminfo_ctgy[__status_am_specific.category_sel.cur].items[_item_idx+1]; let __item_info = _aminfo_ctgy[__status_am_specific.category_sel.cur].items[_item_idx+1];
// Remove All element under winright div // Remove All element under winright div
@@ -1046,6 +1127,7 @@ HotelTV.ui_appfull = (function() {
} }
__iCbfxn_updateAmItemDesc(); __iCbfxn_updateAmItemDesc();
_elDivWinRight.fadeIn(500, function() { _elDivWinRight.fadeIn(500, function() {
if ( _cbFxn ){ _cbFxn(); }
}); });
}); });
}else{ }else{
@@ -1055,6 +1137,7 @@ HotelTV.ui_appfull = (function() {
__iCbfxn_updateAmItemDesc(); __iCbfxn_updateAmItemDesc();
_elDivWinRight.fadeIn(500, function() { _elDivWinRight.fadeIn(500, function() {
if ( _cbFxn ){ _cbFxn(); }
}); });
} }
} }
@@ -1093,6 +1176,7 @@ HotelTV.ui_appfull = (function() {
} break; } break;
case "up": { case "up": {
let _isNeedSoldOutMask = false;
let _elTbl_AmItem = _elAmCtgyBgMenuItemWin.find('.tbl_record'); let _elTbl_AmItem = _elAmCtgyBgMenuItemWin.find('.tbl_record');
let _elTblTr_AmItemNext = _elTbl_AmItem.find('.focus').parent().prev('tr'); let _elTblTr_AmItemNext = _elTbl_AmItem.find('.focus').parent().prev('tr');
@@ -1100,6 +1184,10 @@ HotelTV.ui_appfull = (function() {
_elTbl_AmItem.find('.focus').removeClass("focus"); _elTbl_AmItem.find('.focus').removeClass("focus");
_elTblTr_AmItemNext.children('.amctgyItem').addClass('focus'); _elTblTr_AmItemNext.children('.amctgyItem').addClass('focus');
if ( _elTblTr_AmItemNext.children('.amctgyItem.unavailable').length ){
_isNeedSoldOutMask = true;
}
// 테이블 ROW인덱스와 스크롤 OFFSET계산 // 테이블 ROW인덱스와 스크롤 OFFSET계산
__amctgyItemStatus.idx = _elTblTr_AmItemNext.prop('rowIndex'); __amctgyItemStatus.idx = _elTblTr_AmItemNext.prop('rowIndex');
//__amctgyItemStatus.scroll_TOfset = __amctgyItemStatus.idx*_elTblTr_AmItemNext.prop('scrollHeight'); //__amctgyItemStatus.scroll_TOfset = __amctgyItemStatus.idx*_elTblTr_AmItemNext.prop('scrollHeight');
@@ -1108,18 +1196,29 @@ HotelTV.ui_appfull = (function() {
//스크롤 에니메이션 수행 //스크롤 에니메이션 수행
_elTbl_AmItem.children('#record').animate({ scrollTop: __amctgyItemStatus.scroll_TOfset }, 200); _elTbl_AmItem.children('#record').animate({ scrollTop: __amctgyItemStatus.scroll_TOfset }, 200);
__ifxn_updateAmItemDesc(__amctgyItemStatus.idx); __ifxn_updateAmItemDesc(__amctgyItemStatus.idx, function() {
if ( _isNeedSoldOutMask==true ){
_elAmCtgyBgMenuItemWin.find('.winright').find('.amItemDescThumb').addClass('unavailable');
}else {
_elAmCtgyBgMenuItemWin.find('.winright').find('.amItemDescThumb').removeClass('unavailable');
}
});
} }
} break; } break;
case "down": { case "down": {
let _elTbl_AmItem = _elAmCtgyBgMenuItemWin.find('.tbl_record'); let _elTbl_AmItem = _elAmCtgyBgMenuItemWin.find('.tbl_record');
let _elTblTr_AmItemNext = _elTbl_AmItem.find('.focus').parent().next('tr'); let _elTblTr_AmItemNext = _elTbl_AmItem.find('.focus').parent().next('tr');
let _isNeedSoldOutMask = false;
if (_elTblTr_AmItemNext.length) { if (_elTblTr_AmItemNext.length) {
_elTbl_AmItem.find('.focus').removeClass("focus"); _elTbl_AmItem.find('.focus').removeClass("focus");
_elTblTr_AmItemNext.children('.amctgyItem').addClass('focus'); _elTblTr_AmItemNext.children('.amctgyItem').addClass('focus');
if ( _elTblTr_AmItemNext.children('.amctgyItem.unavailable').length ){
_isNeedSoldOutMask = true;
}
// 테이블 ROW인덱스와 스크롤 OFFSET계산 // 테이블 ROW인덱스와 스크롤 OFFSET계산
__amctgyItemStatus.idx = _elTblTr_AmItemNext.prop('rowIndex'); __amctgyItemStatus.idx = _elTblTr_AmItemNext.prop('rowIndex');
//__amctgyItemStatus.scroll_TOfset = __amctgyItemStatus.idx*_elTblTr_AmItemNext.prop('scrollHeight'); //__amctgyItemStatus.scroll_TOfset = __amctgyItemStatus.idx*_elTblTr_AmItemNext.prop('scrollHeight');
@@ -1128,17 +1227,15 @@ HotelTV.ui_appfull = (function() {
//스크롤 에니메이션 수행 //스크롤 에니메이션 수행
_elTbl_AmItem.children('#record').animate({ scrollTop: __amctgyItemStatus.scroll_TOfset }, 200); _elTbl_AmItem.children('#record').animate({ scrollTop: __amctgyItemStatus.scroll_TOfset }, 200);
__ifxn_updateAmItemDesc(__amctgyItemStatus.idx); __ifxn_updateAmItemDesc(__amctgyItemStatus.idx, function() {
if ( _isNeedSoldOutMask==true ){
_elAmCtgyBgMenuItemWin.find('.winright').find('.amItemDescThumb').addClass('unavailable');
}else {
_elAmCtgyBgMenuItemWin.find('.winright').find('.amItemDescThumb').removeClass('unavailable');
}
});
} }
} break; } break;
case "plus": {
} break;
case "minus": {
} break;
} }
} catch (_err){ } catch (_err){
console.log(`Fail to draw::> ${_err}`); console.log(`Fail to draw::> ${_err}`);
@@ -1278,17 +1375,17 @@ HotelTV.ui_appfull = (function() {
var _elTr_ItmesHdr = document.createElement('tr'); var _elTr_ItmesHdr = document.createElement('tr');
var _elTh_ItmesHdr_Title = document.createElement('th'); var _elTh_ItmesHdr_Title = document.createElement('th');
_elTh_ItmesHdr_Title.setAttribute("id", "title"); _elTh_ItmesHdr_Title.setAttribute("id", "title");
_elTh_ItmesHdr_Title.textContent = _trTbl.ui.amenity.title.item[_state.lang]; _elTh_ItmesHdr_Title.textContent = _trTbl.ui.amenity.title.item[_state.lang].toUpperCase();
_elTr_ItmesHdr.appendChild(_elTh_ItmesHdr_Title); _elTr_ItmesHdr.appendChild(_elTh_ItmesHdr_Title);
var _elTh_ItmesHdr_Amount = document.createElement('th'); var _elTh_ItmesHdr_Amount = document.createElement('th');
_elTh_ItmesHdr_Amount.setAttribute("id", "price"); _elTh_ItmesHdr_Amount.setAttribute("id", "price");
_elTh_ItmesHdr_Amount.textContent = _trTbl.ui.amenity.title.amount[_state.lang]; _elTh_ItmesHdr_Amount.textContent = _trTbl.ui.amenity.title.amount[_state.lang].toUpperCase();
_elTr_ItmesHdr.appendChild(_elTh_ItmesHdr_Amount); _elTr_ItmesHdr.appendChild(_elTh_ItmesHdr_Amount);
var _elTh_ItmesHdr_Status = document.createElement('th'); var _elTh_ItmesHdr_Status = document.createElement('th');
_elTh_ItmesHdr_Status.setAttribute("id", "status"); _elTh_ItmesHdr_Status.setAttribute("id", "status");
_elTh_ItmesHdr_Status.textContent = _trTbl.ui.amenity.title.orderability[_state.lang]; _elTh_ItmesHdr_Status.textContent = _trTbl.ui.amenity.title.orderability[_state.lang].toUpperCase();
_elTr_ItmesHdr.appendChild(_elTh_ItmesHdr_Status); _elTr_ItmesHdr.appendChild(_elTh_ItmesHdr_Status);
_elTBody_ItmesHdr.appendChild(_elTr_ItmesHdr); _elTBody_ItmesHdr.appendChild(_elTr_ItmesHdr);
@@ -1493,8 +1590,11 @@ HotelTV.ui_appfull = (function() {
_state.menu.stage.cur = "amenity_ctgy_sel"; _state.menu.stage.cur = "amenity_ctgy_sel";
} else if (event.keyCode == gRmtKey.enter) { } else if (event.keyCode == gRmtKey.enter) {
console.log('AMENITY CATEGORY ITEM SEL: KEY::> ' + event.keyCode); console.log('AMENITY CATEGORY ITEM SEL: KEY::> ' + event.keyCode);
__uifxn_AppFull_DrawAmItemSeletionCart("cart"); if ( __uifxn_AppFull_DrawAmItemSeletionCart("cart")==true ){
_state.menu.stage.cur = "amenity_ctgy_item_cart"; _state.menu.stage.cur = "amenity_ctgy_item_cart";
} else {
HotelTV.ui_utils.ShowNotificationMsgBalloon(_trTbl.system.ott_service_not_ready[_state.lang], 5);
}
} }
} else if (_state.menu.stage.cur == "amenity_ctgy_item_cart") { } else if (_state.menu.stage.cur == "amenity_ctgy_item_cart") {
if (event.keyCode == gRmtKey.left) { if (event.keyCode == gRmtKey.left) {
@@ -1506,9 +1606,13 @@ HotelTV.ui_appfull = (function() {
} else if (event.keyCode == gRmtKey.down) { } else if (event.keyCode == gRmtKey.down) {
__uifxn_AppFull_DrawAmItemSeletionCart("quantity_minus"); __uifxn_AppFull_DrawAmItemSeletionCart("quantity_minus");
} else if (event.keyCode == gRmtKey.back) { } else if (event.keyCode == gRmtKey.back) {
__uifxn_AppFull_DrawAmItemSeletionCart("return"); __uifxn_AppFull_DrawAmItemSeletionCart("return", function() {
_state.menu.stage.cur = "amenity_ctgy_item_sel"; _state.menu.stage.cur = "amenity_ctgy_item_sel";
});
} else if (event.keyCode == gRmtKey.enter) { } else if (event.keyCode == gRmtKey.enter) {
__uifxn_AppFull_DrawAmItemSeletionCart("enter", function() {
_state.menu.stage.cur = "amenity_ctgy_item_sel";
});
console.log('AMENITY CATEGORY ITEM SEL: KEY::> ' + event.keyCode); console.log('AMENITY CATEGORY ITEM SEL: KEY::> ' + event.keyCode);
} }
} else { } else {
@@ -3370,7 +3474,7 @@ HotelTV.ui_appfull = (function() {
HotelTV.api.ReportEvent([{ HotelTV.api.ReportEvent([{
'power': true, 'power': true,
'location':{ 'location':{
'category':_tvProg[_tvCtgIdx].id, 'catId':_tvProg[_tvCtgIdx].id,
'chId': _tvChInfo.id, 'chId': _tvChInfo.id,
} }
}]) }])

64
procentric/application/theme/HJS00001/hoteltv.app.full.popup.css
View File

@@ -534,10 +534,10 @@
} }
.popup .amenity .bg .am_item_sel_win .winleft>.tbl_header tbody tr>#title { .popup .amenity .bg .am_item_sel_win .winleft>.tbl_header tbody tr>#title {
width: 50%; width: 45%;
float: left; float: left;
/* text-align: left; */ /* text-align: left; */
padding: 0 0px 0 80px; padding: 0 0px 0 20px;
} }
.popup .amenity .bg .am_item_sel_win .winleft>.tbl_header tbody tr>#price { .popup .amenity .bg .am_item_sel_win .winleft>.tbl_header tbody tr>#price {
@@ -546,7 +546,7 @@
} }
.popup .amenity .bg .am_item_sel_win .winleft>.tbl_header tbody tr>#status { .popup .amenity .bg .am_item_sel_win .winleft>.tbl_header tbody tr>#status {
width: 30%; width: 35%;
float: left; float: left;
padding: 0px 30px 0 0px; padding: 0px 30px 0 0px;
} }
@@ -579,7 +579,7 @@
height: 52px; height: 52px;
width: 100%; width: 100%;
font-size: 30px; font-size: 30px;
/* line-height: 54px; */ line-height: 52px;
border-bottom: 2px solid rgb(21, 27, 34); border-bottom: 2px solid rgb(21, 27, 34);
} }
@@ -601,8 +601,15 @@
color: rgb(121, 121, 121); color: rgb(121, 121, 121);
} }
.popup .amenity .bg .am_item_sel_win .winleft>.tbl_record tbody tr>.amctgyItem.focus.unavailable:before {
}
.popup .amenity .bg .am_item_sel_win .winleft>.tbl_record tbody tr>.amctgyItem.focus.unavailable:after {
}
.popup .amenity .bg .am_item_sel_win .winleft>.tbl_record tbody tr>.amctgyItem>#title { .popup .amenity .bg .am_item_sel_win .winleft>.tbl_record tbody tr>.amctgyItem>#title {
width: 50%; width: 45%;
float: left; float: left;
padding: 0px 0px 0px 20px; padding: 0px 0px 0px 20px;
} }
@@ -614,7 +621,7 @@
} }
.popup .amenity .bg .am_item_sel_win .winleft>.tbl_record tbody tr>.amctgyItem>#status { .popup .amenity .bg .am_item_sel_win .winleft>.tbl_record tbody tr>.amctgyItem>#status {
width: 30%; width: 35%;
float: left; float: left;
/* text-align: right; */ /* text-align: right; */
padding: 0px 30px 0 0px; padding: 0px 30px 0 0px;
@@ -679,6 +686,33 @@
margin: 10px 25px 10px 25px; margin: 10px 25px 10px 25px;
} }
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_win .winright .amItemDescThumb.unavailable:before {
/* content: 'Not available';
width: 100%;
height: 100%;
transform: rotate(-30deg);
top: 0;
left: 0;
font-size: 7em;
font-weight: bolder;
color: rgba(1,1,1,1);
opacity: 0.7;
display: block;
align-items: center;
line-height: 479px;
text-align: center; */
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_win .winright .amItemDescThumb.unavailable:after {
/* content: '';
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background: #000;
opacity: 0.6 */
}
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_win .winright .amItemDescDetails{ .popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_win .winright .amItemDescDetails{
width: 852px; width: 852px;
height: 238px; height: 238px;
@@ -757,12 +791,13 @@
} }
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.control #img_thumbnail{ .popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.control #img_thumbnail{
width: 42%; width: 40%;
height: 228px; height: 228px;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center center; background-position: center center;
background-size: contain; background-size: contain;
float: left; float: left;
margin: 0px 0px 0px 2%;
} }
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.control>.quantity{ .popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.control>.quantity{
@@ -824,7 +859,7 @@
height: 54px; height: 54px;
width: 100%; width: 100%;
line-height: 54px; line-height: 54px;
font-size: 44px; font-size: 38px;
white-space: pre-wrap; white-space: pre-wrap;
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
@@ -868,13 +903,13 @@
background-color: rgba(173,255,47,1.0); background-color: rgba(173,255,47,1.0);
} }
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.buttons #btn_addtocart{ .popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.buttons #btn_ordernow{
/* border-radius: 14px; */ /* border-radius: 14px; */
/* background-color: rgba(255,255,255,1.0); */ /* background-color: rgba(255,255,255,1.0); */
margin: 0px 20px 0px 0px; margin: 0px 20px 0px 0px;
} }
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.buttons #btn_ordernow{ .popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winleft>.buttons #btn_addtocart{
/* border-radius: 14px; */ /* border-radius: 14px; */
/* background-color: rgba(255,255,255,1.0); */ /* background-color: rgba(255,255,255,1.0); */
margin: 0px 20px 0px 20px; margin: 0px 20px 0px 20px;
@@ -950,16 +985,16 @@
width: 50%; width: 50%;
float: left; float: left;
/* text-align: left; */ /* text-align: left; */
padding: 0 0px 0 80px; padding: 0 0px 0 20px;
} }
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_header tbody tr>#quantity { .popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_header tbody tr>#quantity {
width: 25%; width: 20%;
float: left; float: left;
} }
.popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_header tbody tr>#amount { .popup .amenity .bg .owl-carousel .owl-stage .am_item_sel_cart_win .winright>.cart_table>.tbl_header tbody tr>#amount {
width: 25%; width: 30%;
float: left; float: left;
padding: 0px 30px 0 0px; padding: 0px 30px 0 0px;
} }
@@ -992,7 +1027,7 @@
height: 52px; height: 52px;
width: 100%; width: 100%;
font-size: 30px; font-size: 30px;
/* line-height: 54px; */ line-height: 52px;
border-bottom: 2px solid rgb(21, 27, 34); border-bottom: 2px solid rgb(21, 27, 34);
} }
@@ -2138,6 +2173,7 @@
left: 73%; left: 73%;
width: 26%; width: 26%;
height: 10%; height: 10%;
z-index: 3;
} }
.popup>.notification>.balloon { .popup>.notification>.balloon {