diff --git a/procentric/application/hoteltv.app.full.popup.css b/procentric/application/hoteltv.app.full.popup.css index 145115a..dcc5858 100755 --- a/procentric/application/hoteltv.app.full.popup.css +++ b/procentric/application/hoteltv.app.full.popup.css @@ -1954,6 +1954,23 @@ height: 100%; } + +.popup>.mypage.fade { + animation-delay: 1s; + animation-name: popup_mypage_fade; + animation-iteration-count: 1; + animation-timing-function: ease-in; + animation-fill-mode: forwards; + animation-duration: 3s; + background-color:rgba(10, 10, 10, 0); +} + +@keyframes popup_mypage_fade { + from {background-color:rgba(10, 10, 10, 0);} + to {background-color:rgba(10, 10, 10, 0.7);} +} + + .popup>.mypage>.message { position: absolute; top: 13%; @@ -1961,8 +1978,9 @@ width: 88%; height: 80%; background-color: rgb(64, 64, 64); - background-image: url(./images/bg_message_cream-paper.png); - box-shadow: 2px 3px 20px black, 0 0 200px rgb(16, 16, 16) inset; + /* background-image: url(./images/bg_message_cream-paper.png); */ + /* box-shadow: 2px 3px 20px black, 0 0 200px rgb(16, 16, 16) inset; */ + box-shadow: 0 0px 60px rgba(0, 0, 0, 0.65); overflow: hidden; display: none; } diff --git a/procentric/application/lib/hoteltv.ui_appfull.js b/procentric/application/lib/hoteltv.ui_appfull.js index 65a973a..02ee497 100755 --- a/procentric/application/lib/hoteltv.ui_appfull.js +++ b/procentric/application/lib/hoteltv.ui_appfull.js @@ -2928,35 +2928,67 @@ HotelTV.ui_appfull = (function() { let _cur_msgdesc = _msginf[_cur_msgnum]; - // Message card 구성 - $('.popup>.mypage>.message>#msg_ctz').css('font-size', '34px'); - $('.popup>.mypage>.message>#title').css('font-size', '50px'); - // 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, '
')); - } else { - $('.popup>.mypage>.message>#msg_ctz').html(_cur_msgdesc.content.default.replace(/(?:\r\n|\r|\n)/g, '
')); + + if ( _cur_msgdesc.format==="text" ) + { + // TEXT타입 메시지 + $('.popup>.mypage>.message').css({ 'background-size' : '', 'background-repeat' : '' }); + $('.popup>.mypage>.message').css({"background-image":"url(./images/bg_message_cream-paper.png)"}); + + // Message card 구성 + $('.popup>.mypage>.message>#msg_ctz').css('font-size', '34px'); + $('.popup>.mypage>.message>#title').css('font-size', '50px'); + // 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; + // } + + if (_cur_msgdesc.multilanguage == true) { + $('.popup>.mypage>.message>#title').text(_cur_msgdesc.title[_state.lang]); + $('.popup>.mypage>.message>#msg_ctz').html(_cur_msgdesc.content[_state.lang].replace(/(?:\r\n|\r|\n)/g, '
')); + } else { + $('.popup>.mypage>.message>#title').text(_cur_msgdesc.title.default); + $('.popup>.mypage>.message>#msg_ctz').html(_cur_msgdesc.content.default.replace(/(?:\r\n|\r|\n)/g, '
')); + } + } + else + { + let _imgmsg_url = null; + // 혹시 모를 타이틀 제거 + $('.popup>.mypage>.message>#title').empty(); + + // 혹시 모를 html콘텐츠 제거 + $('.popup>.mypage>.message>#msg_ctz').empty(); + + + // Image 타입 메시지 + if (_cur_msgdesc.multilanguage == false) + { + _imgmsg_url = _cur_msgdesc.imageContent.default.download; + } + else + { + _imgmsg_url = _cur_msgdesc.imageContent[_state.lang].download; + } + $('.popup>.mypage>.message').css({"background-image":"url("+ _imgmsg_url +")"}); + $('.popup>.mypage>.message').css({"background-size":"cover"}); } //Back button @@ -2965,6 +2997,7 @@ HotelTV.ui_appfull = (function() { //SHOW ANIMATION if ($('.popup>.mypage>.message').css('display') == "none") { _state.menu.stage.cur = "mypage_popup_message_card"; + $('.popup>.mypage').addClass('fade'); $('.main>.mypage>.slider').animate({ top: 1080, left: 0 }, 1000, function() { $('.popup>.mypage>.message').fadeIn(500); @@ -2982,6 +3015,7 @@ HotelTV.ui_appfull = (function() { $('.main .mm').show(function() { $('#lst_mmsel').trigger('refresh.owl.carousel', [0]); }); + $('.main').animate({ top: 0, left: 0 }, 1000, () => { $('#lst_mypagesel').off('translate.owl.carousel'); @@ -3048,6 +3082,7 @@ HotelTV.ui_appfull = (function() { } else if (_state.menu.stage.cur == "mypage_popup_message_card") { if (event.keyCode == gRmtKey.back) { if ($('.popup>.mypage>.message').css('display') != "none") { + $('.popup>.mypage').removeClass('fade'); $('.popup>.mypage>.message').fadeOut(500, function() { _state.menu.stage.cur = "mypage_select_menu"; $('.main>.mypage>.slider').animate({ top: 864, left: 0 }, 1000)