437 lines
17 KiB
HTML
Executable File
437 lines
17 KiB
HTML
Executable File
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<link rel="stylesheet" href="/procentric/application/theme/hoteltv.ui_utils.css">
|
|
<link rel="stylesheet" href="/procentric/application/theme/hoteltv.error.css">
|
|
<link rel="stylesheet" href="/procentric/application/css/owlcarousel/owl.carousel.min.css">
|
|
<link rel="stylesheet" href="/procentric/application/css/owlcarousel/owl.theme.default.min.css">
|
|
<link rel="stylesheet" href="/procentric/application/css/acmeticker/style.css">
|
|
<title>CENTIRM LG-PROCENTRIC HOTEL SERVICE</title>
|
|
</head>
|
|
|
|
|
|
<body>
|
|
<!-- APP[FULL] Screen Layout -->
|
|
<div class="main">
|
|
<div class="mm">
|
|
<div class="bg">
|
|
<div class="owl-carousel owl-theme" id="lst_mmbg"></div>
|
|
</div>
|
|
<div class="slider">
|
|
<div class="owl-carousel owl-theme" id="lst_mmsel"></div>
|
|
</div>
|
|
<div class="weather">
|
|
<div class="location">Seoul</div>
|
|
<div class="today">
|
|
<div id="temp_cur">12</div>
|
|
<div id="temp_minmax">9/15</div>
|
|
<div class="detail">
|
|
<div id="discription"></div>
|
|
<div id="img_status"></div>
|
|
<div id="humidity">
|
|
<span id="icon" style="width:30%; height:100%; display:inline-block; background-repeat: no-repeat; background-size: contain; background-position: center center; margin-top:10px;"></span>
|
|
<span id="value" style="width:50%; height:100%; display:inline-block; font-size: 32px; text-align: left; margin-top: 10px;"></span>
|
|
</div>
|
|
<div id="wind">
|
|
<span id="icon" style="width:30%; height:100%; display:inline-block; background-repeat: no-repeat; background-size: contain; background-position: center center;margin-top:10px;"></span>
|
|
<marquee id="value" style="width:60%; height:100%; display:inline-block; font-size: 32px; text-align: left; margin-top: 10px; border-bottom: solid;"></marquee>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="forcast">
|
|
<div class="daily">
|
|
<div id="title" style="font-size:32px; display: block"></div>
|
|
<ul>
|
|
<li idx="1">
|
|
<div id="time"></div>
|
|
<div id="temp"></div>
|
|
</li>
|
|
<li idx="2">
|
|
<div id="time"></div>
|
|
<div id="temp"></div>
|
|
</li>
|
|
<li idx="3">
|
|
<div id="time"></div>
|
|
<div id="temp"></div>
|
|
</li>
|
|
<li idx="4">
|
|
<div id="time"></div>
|
|
<div id="temp"></div>
|
|
</li>
|
|
<li idx="5">
|
|
<div id="time"></div>
|
|
<div id="temp"></div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="weekly">
|
|
<ul style="margin-bottom: 30px;">
|
|
<li idx="1">
|
|
<div id="date"></div>
|
|
<div id="temp"></div>
|
|
</li>
|
|
<li idx="2">
|
|
<div id="date"></div>
|
|
<div id="temp"></div>
|
|
</li>
|
|
<li idx="3">
|
|
<div id="date"></div>
|
|
<div id="temp"></div>
|
|
</li>
|
|
<li idx="4">
|
|
<div id="date"></div>
|
|
<div id="temp"></div>
|
|
</li>
|
|
<li idx="5">
|
|
<div id="date"></div>
|
|
<div id="temp"></div>
|
|
</li>
|
|
</ul>
|
|
<div id="title" style="font-size:32px; display: block"></div>
|
|
</div>
|
|
</div>
|
|
<div id="caution" style="position:absolute; top: 410px; width: 99%; height:50px; text-align: right; color:rgb(180,180,190);"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="sub">
|
|
<div class="bg">
|
|
<div class="owl-carousel owl-theme" id="lst_smbg"></div>
|
|
</div>
|
|
<div class="slider">
|
|
<div class="owl-carousel owl-theme" id="lst_smsel"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="ctzgen">
|
|
<div class="bg">
|
|
<div class="owl-carousel owl-theme" id="lst_ctzgenbg"></div>
|
|
</div>
|
|
<div class="slider">
|
|
<div class="owl-carousel owl-theme" id="lst_ctzgensel"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="tv">
|
|
<div class="bg">
|
|
<div class="owl-carousel owl-theme" id="lst_tvCtgbg"></div>
|
|
</div>
|
|
<div class="shortcut">
|
|
<div id="suggestion">
|
|
<table class="ch_list">
|
|
<tbody id="record"></tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mypage">
|
|
<div class="bg">
|
|
<div class="owl-carousel owl-theme" id="lst_mypagebg"></div>
|
|
</div>
|
|
<div class="slider">
|
|
<div class="owl-carousel owl-theme" id="lst_mypagesel"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="widjet">
|
|
<div class="top">
|
|
<div class="hotellogo"></div>
|
|
<div class="message">
|
|
<div id="unread_cnt"></div>
|
|
</div>
|
|
<div class="weather">
|
|
<div id="icon"></div>
|
|
<div id="temp"></div>
|
|
</div>
|
|
|
|
<div class="datetime">
|
|
<p class="time"></p>
|
|
<p class="date"></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="news">
|
|
<div class="title">NEWS</div>
|
|
<div class="newsctz">
|
|
<lu id="hoteltv-news-ticker"></lu>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="guide">
|
|
<div class="tips"></div>
|
|
</div>
|
|
|
|
|
|
<div class="popup">
|
|
<div class="hotkey_mm_red">
|
|
<div class="owl-carousel owl-theme" id="lst_hotkey_mm_red"></div>
|
|
</div>
|
|
<div class="hotkey_mm_green">
|
|
<div class="owl-carousel owl-theme" id="lst_hotkey_mm_green"></div>
|
|
</div>
|
|
<div class="hotkey_mm_yellow">
|
|
<div class="owl-carousel owl-theme" id="lst_hotkey_mm_yellow"></div>
|
|
</div>
|
|
<div class="hotkey_mm_blue">
|
|
<div class="owl-carousel owl-theme" id="lst_hotkey_mm_blue"></div>
|
|
</div>
|
|
<div class="amenity">
|
|
<div class="bg">
|
|
<div class="owl-carousel owl-theme" id="lst_ctgbg"></div>
|
|
</div>
|
|
<div class="slider">
|
|
<div class="owl-carousel owl-theme" id="lst_ctgsel"></div>
|
|
</div>
|
|
<div class="cart">
|
|
<div>
|
|
<div class="menu">
|
|
<div>
|
|
<div id="title"></div>
|
|
<div id="control">
|
|
<div id="thumb"></div>
|
|
<div>
|
|
<div id="quantity"></div>
|
|
<div>
|
|
<div id="icon_up"></div>
|
|
<div id="number"></div>
|
|
<div id="icon_down"></div>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div id="amount"></div>
|
|
<div id="total"></div>
|
|
</div>
|
|
</div>
|
|
<div id="description">
|
|
<div id="name"></div>
|
|
<div id="details"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="items">
|
|
<div id="title"></div>
|
|
<div id="table"></div>
|
|
<div id="amount">
|
|
<div id="total"></div>
|
|
<div id="value"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="order">
|
|
<div class="winleft"></div>
|
|
</div>
|
|
<div class="use_guide"></div>
|
|
</div>
|
|
<div class="roomservice">
|
|
<div class="bg">
|
|
<div class="owl-carousel owl-theme" id="lst_ctgbg"></div>
|
|
</div>
|
|
<div class="slider">
|
|
<div class="owl-carousel owl-theme" id="lst_ctgsel"></div>
|
|
</div>
|
|
<div class="cart">
|
|
<div>
|
|
<div class="menu">
|
|
<div>
|
|
<div id="title"></div>
|
|
<div id="control">
|
|
<div id="thumb"></div>
|
|
<div>
|
|
<div id="quantity"></div>
|
|
<div>
|
|
<div id="icon_up"></div>
|
|
<div id="number"></div>
|
|
<div id="icon_down"></div>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div id="amount"></div>
|
|
<div id="total"></div>
|
|
</div>
|
|
</div>
|
|
<div id="description">
|
|
<div id="name"></div>
|
|
<div id="details"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="items">
|
|
<div id="title"></div>
|
|
<div id="table"></div>
|
|
<div id="amount">
|
|
<div id="total"></div>
|
|
<div id="value"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="order">
|
|
<div class="winleft"></div>
|
|
</div>
|
|
<div class="use_guide"></div>
|
|
</div>
|
|
<div class="mypage">
|
|
<div class="message">
|
|
<div id="hotel_logo"></div>
|
|
<p id="title"></p>
|
|
<p id="msg_ctz"></p>
|
|
<span id="btn_back"></span>
|
|
</div>
|
|
</div>
|
|
<div class="lang_selection">
|
|
<div class="selector">
|
|
<div class="title"></div>
|
|
<div class="usage"></div>
|
|
<div class="buttons"></div>
|
|
</div>
|
|
</div>
|
|
<div class="notification">
|
|
<div class="balloon right"><span id="message"></span></div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!-- Buttons Layout -->
|
|
<div class="control">
|
|
<div class="mm">
|
|
<div class="hotkey_red"></div>
|
|
<div class="hotkey_green"></div>
|
|
<div class="hotkey_yellow"></div>
|
|
<div class="hotkey_blue"></div>
|
|
</div>
|
|
<div class="skip_video"></div>
|
|
</div>
|
|
|
|
<!-- Player Layout -->
|
|
<div class="player"></div>
|
|
|
|
<!-- Error Frame Layout -->
|
|
<div class="error">
|
|
<div id="details">
|
|
<div id="title"></div>
|
|
<div id="message"></div>
|
|
</div>
|
|
<div id="countdown">
|
|
<div id="message"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Busy Animation Area -->
|
|
<div class="busy-frame">
|
|
<div id="busy_animation">
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
|
|
|
|
<!-- Standard & 3rd party Library -->
|
|
<script src="/procentric/application/lib/jquery-3.6.0.min.js"></script>
|
|
<script src="/procentric/application/lib/jquery.color-2.1.2.min.js"></script>
|
|
<script src="/procentric/application/lib/jquery.webticker.min.js"></script>
|
|
<script src="/procentric/application/lib/xml2json.js"></script>
|
|
<script src="/procentric/application/lib/owl.carousel.min.js"></script>
|
|
|
|
<!-- LG HCAP Library -->
|
|
<script src="/procentric/application/lib/hcap.js"></script>
|
|
<script src="/procentric/application/lib/idcap.js"></script>
|
|
|
|
<!-- CENTIRM HOTELTV Library -->
|
|
<script src="/procentric/application/lib/hoteltv.js"></script>
|
|
<script src="/procentric/application/lib/hoteltv.ui_utils.js"></script>
|
|
<script src="/procentric/application/lib/hoteltv.ui_appfull.js"></script>
|
|
<script src="/procentric/application/lib/hoteltv.hcap.js"></script>
|
|
<script src="/procentric/application/lib/hoteltv.api.js"></script>
|
|
|
|
<!-- MQTT Library -->
|
|
<script src="/procentric/application/lib/mqtt.min.js"></script>
|
|
|
|
<!-- ACMETICKER Library -->
|
|
<script src="/procentric/application/lib/acmeticker.js"></script>
|
|
|
|
|
|
<script>
|
|
window.addEventListener('cached', function() {
|
|
|
|
});
|
|
|
|
window.addEventListener('load', function() {
|
|
HotelTV.state = JSON.parse(sessionStorage.getItem("state"));
|
|
let needed_css_files = ["/hoteltv.app.full.css",
|
|
"/hoteltv.app.full.mm.css",
|
|
"/hoteltv.app.full.mm.weather.css",
|
|
"/hoteltv.app.full.mm.flight.css",
|
|
"/hoteltv.app.full.widjet.css",
|
|
"/hoteltv.app.full.sm.css",
|
|
"/hoteltv.app.full.mypage.css",
|
|
"/hoteltv.app.full.ctzgen.css",
|
|
"/hoteltv.app.full.tv.css",
|
|
"/hoteltv.app.full.guide.css",
|
|
"/hoteltv.app.full.news.css",
|
|
"/hoteltv.app.full.popup.css"];
|
|
for ( let _idx=0; _idx<needed_css_files.length; _idx++ )
|
|
{
|
|
$('head:first').append('<link rel="stylesheet" type="text/css" href="/procentric/application/theme/'
|
|
+ HotelTV.state['theme_root'] + needed_css_files[_idx] + '" />');
|
|
}
|
|
console.log("Documents loaded...")
|
|
});
|
|
|
|
|
|
window.addEventListener('unload', function(event) {
|
|
console.log('Uninitalized');
|
|
//HotelTV.UnloadAppFull();
|
|
});
|
|
|
|
|
|
document.addEventListener("keydown",
|
|
function(e) {
|
|
let _profile = HotelTV.tvguide.program;
|
|
let _state = HotelTV.state;
|
|
|
|
// if (_state.menu.stage.cur == "main") {
|
|
// console.log(`KEY::${e.keyCode} Main Menu(Prev)::> ${_state.menu.main.cur} ${_profile[Number(_state.menu.main.cur)].name}`);
|
|
// }
|
|
|
|
switch (e.keyCode) {
|
|
case 602: // Portail
|
|
if ( HotelTV.dbginfo['en'] == true ) {
|
|
window.location.replace('./index.html');
|
|
}
|
|
break;
|
|
case 409:
|
|
HotelTV.hcap.PwrOff();
|
|
break;
|
|
case 457: // INFO Key
|
|
HotelTV.hcap.GetScrshot();
|
|
break;
|
|
default:
|
|
//console.log(`KEY::${e.keyCode}`);
|
|
break;
|
|
}
|
|
}
|
|
);
|
|
|
|
$(document).ready(function() {
|
|
HotelTV.LoadAppFull();
|
|
});
|
|
</script>
|
|
|
|
</html> |