<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>

<%@ Import Namespace="Domain" %>
<%
    List<AppMenu> AppMenus = ViewData["AppMenuControl"] as List<AppMenu>;
%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0" />
    <title>App</title>
    <style type="text/css">
        html, body
        {
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
        }
        .align-center
        {
            position: fixed;
            width: 100%;
            height: 100%;
        }
    </style>
    <link type="text/css" rel="stylesheet" href="/Styles/app/common.css" />
    <link type="text/css" rel="stylesheet" href="/Styles/app/header.css" />
    <script type="text/javascript" src="/Scripts/jquery.min.js"></script>
    <script type="text/javascript" src="/Scripts/app/common.js"></script>
    <script type="text/javascript">
        var isCloseLoading = 0;

        var RoomConfig = {
            RoomNumber: '<%: ViewData["RoomNumber"] %>',
            ServiceControlUrl: '/App/ServiceControl/?RoomNumber=<%: ViewData["RoomNumber"] %>',
            LightControlUrl: '/App/LightControl/?RoomNumber=<%: ViewData["RoomNumber"] %>',
            AirConditionControlUrl: '/App/AirConditionControl/?RoomNumber=<%: ViewData["RoomNumber"] %>',
            CurtainControlUrl: '/App/CurtainControl/?RoomNumber=<%: ViewData["RoomNumber"] %>',
            SceneUrl: '/App/Scene/?RoomNumber=<%: ViewData["RoomNumber"] %>',
            TelevisionUrl: '/App/Television/?RoomNumber=<%: ViewData["RoomNumber"] %>',
            HotelUrl: '/App/HotelIntroduction/',
            AboutUrl: '/App/About/'
        };

		function sendServiceStatus(groupAddress, status) {
		    $.ajax({
		        url: RoomConfig.ServiceControlUrl,
		        data: { GroupAddress: groupAddress, Status: status },
		        type: "POST",
		        dataType: "JSON",
		        success: function (r) {
		            if (!r.IsSuccess) {
		                showMsg("", "操作失败," + r.Message);
		            }
		            //hideLoading();
		            isCloseLoading = 1;
		        },
		        error: function () {
		            hideLoading();
		        }
		    });
        }

        function ServiceSetClick(code, status) {
            showLoading();
            isCloseLoading = 0;
            //$("#" + code).attr("class", code + " " + (status ? "" : "active"));
            sendServiceStatus(code, (status ? '0' : "1"));
        }

        function timeRefreshService() {
            $.ajax({
                url: "/App/LoadAlarm/",
                data: { roomNumber: RoomConfig.RoomNumber },
                type: "POST",
                dataType: "JSON",
                success: function (r) {
                    $('#services').html("");
                    var strHtml = "";
                    for (var i = 0; i < r.length; i++) {
                        var active = (r[i].Status ? "active" : "");
                        strHtml += "<li><a id='" + r[i].Code + "' onclick=ServiceSetClick('" + r[i].Code + "'," + r[i].Status + ") ";
                        strHtml += "class='" + r[i].Code + " " + active + "' href='javascript:void(0);'></a><span>" + r[i].Name + "</span></li>";
                    }
                    $('#services').html(strHtml);


                    strHtml = null;
                    if (isCloseLoading) { hideLoading(); }
                    setTimeout('timeRefreshService()', 1000);
                },
                error: function () {
                    setTimeout('timeRefreshService()', 1000);
                }
            });
        }

        function showLoading() {
        	$('#loading').show();
        }
        function hideLoading() {
        	$('#loading').hide();
        }
        function showMsg(title, content) {
            $('#msg')
				.find(".dialog-content-title").html(title || "").end()
				.find(".dialog-content-text").html(content || "").end()
				.fadeIn("fast");
            setTimeout(function () { hideMsg(); }, 3000);
        }

        function hideMsg() {
            $("#msg").fadeOut("fast");
        }

        function go(obj, roomNumber) {
            $("#content").html("").load(obj + "?RoomNumber=" + roomNumber);
        }

        $(function () {
            $("#nav-menu li").click(function () {
                $("#nav-menu li").removeClass("active");
                $(this).addClass("active");
            });

            $("#content").load(RoomConfig.HotelUrl);

            timeRefreshService();
        });
    </script>
</head>
<body onload="startTime()">
    <section id="main">
		<header><% Html.RenderPartial("Header"); %></header>
		<nav id="nav">	 
	    <ul id="nav-menu">            
            <% foreach (var item in AppMenus) { %>
				<li>
				    <a href="javascript:void(0)"  onclick='go("<%=item.Url %>","<%: ViewData["RoomNumber"] %>")'> 
				    <i style='background: url(../../<%=item.Icon %>) no-repeat center center;'></i>
				    <% if (Request.Cookies["isCN"].Value == "zh-cn") { %>
				            <em class="text"> <%=item.Name %></em> 
				    <% } else { %>
				            <em class="text"> <%=item.EnglishName %></em> 
				    <% } %>
				    </a>  
				</li>
			<% } %>  
	    </ul>
    </nav>
	    <section id="content" class="content"></section>
	    <footer>
            <div>
				 <a id="CN" href="javascript:void(0)" onclick="switchLanuage('cn')"> 
            		<% if (Request.Cookies["isCN"].Value == "zh-cn")  { %> 
						<span class="CLanguageActive">中文</span> 
					<% } else { %> 
						<span class="CLanguage">中文</span> 
					<%} %>
				</a>
				<a id="EN" href="javascript:void(0)" onclick="switchLanuage('en')">
					<% if (Request.Cookies["isCN"].Value == "zh-cn") { %> 
						<span class="ELanguage">English</span> 
					<% } else { %>
						<span class="ELanguageActive">English</span>
					<% } %>
				</a>
            </div>
		    <ul id="services" class="clearfix">
				<%--<li ms-repeat="Alarm">
					<a id='{{el.Code}}' ms-click="ServiceSetClick($index)" ms-class='{{el.Code}}  {{el.Status ? "active" : ""}}' href="javascript:void(0)"></a>
					<span>{{el.Name}}</span>
                </li>--%>
		    </ul>
	    </footer>
		<div id="loading" class="loading" style="display:none;">
			<div class="mask"></div>
			<div class="content"></div>
		</div>
		<%--<div id="tip" class="tip">
			<div class="mask"></div>
			<span class="content">aaaaaa</span>
		</div>--%>
	    <div id="msg" class="dialog" style="display:none;">
			<div class="dialog-inner">
				<a href="javascript:void(0)" class="dialog-close" onclick="$('#msg').fadeOut('fast');">×</a>
				<div class="dialog-content">
					<h1 class="dialog-content-title"></h1>
					<p class="dialog-content-text"></p>
				</div>
			</div>
	    </div>
    </section>
</body>
</html>
