Subversion Repositories HomeAutomation

Rev

Rev 2068 | Only display areas with differences | Regard whitespace | Details | Blame | Last modification | View Log | SVN | RSS feed

Rev 2068 Rev 2070
1 
<?php
 1 
<?php
2 
require_once("backend.php");
 2 
require_once("backend.php");
3 
require_once("config.php");
 3 
require_once("config.php");
4 
?>
 4 
?>
5 
<!DOCTYPE HTML>
 5 
<!DOCTYPE HTML>
6 
<html>
 6 
<html>
7 
  <head>
 7 
  <head>
8 
    <meta charset="utf-8">
 8 
    <meta charset="utf-8">
9 
    <meta name="viewport" content="width=device-width, initial-scale=1">
 9 
    <meta name="viewport" content="width=device-width, initial-scale=1">
10 
    <title>Home Automation Control Center</title>
 10 
    <title>Home Automation Control Center</title>
11 
    <link rel="stylesheet" href="jquery.mobile-1.1.1.min.css" />
 11 
    <link rel="stylesheet" href="jquery.mobile-1.1.1.min.css" />
12 
    <script src="jquery-1.7.2.min.js"></script>
 12 
    <script src="jquery-1.7.2.min.js"></script>
13 
    <script src="jquery.mobile-1.1.1.min.js"></script>
 13 
    <script src="jquery.mobile-1.1.1.min.js"></script>
14 
    <script src="jquery.tmpl.min.js"></script>
 14 
    <script src="jquery.tmpl.min.js"></script>
15 
 
 15 
 
16 
    <style>
 16 
    <style>
17 
    <?php
 17 
    <?php
18 
      foreach ($pages as $page)
 18 
      foreach ($pages as $page)
19 
      {
 19 
      {
20 
        include("pages/" . $page . "/style.css");
 20 
        include("pages/" . $page . "/style.css");
21 
      }
 21 
      }
22 
    ?>
 22 
    ?>
23 
    </style>
 23 
    </style>
24 
 
 24 
 
25 
    <?php
 25 
    <?php
26 
      foreach ($pages as $page)
 26 
      foreach ($pages as $page)
27 
      {
 27 
      {
28 
        include("pages/" . $page . "/template.html");
 28 
        include("pages/" . $page . "/template.html");
29 
      }
 29 
      }
30 
    ?>
 30 
    ?>
31 
 
 31 
 
32 
    <script id="page-template" type="text/x-jquery-tmpl" data-enhance="false">
 32 
    <script id="page-template" type="text/x-jquery-tmpl" data-enhance="false">
33 
      <div id="page-${name}" data-role="page" data-add-back-btn="true" data-theme="a">
 33 
      <div id="page-${name}" data-role="page" data-theme="a">
- 
 
 34 
        <div data-role="header">
- 
 
 35 
          <a href="#" data-icon="left" data-rel="back" data-direction="reverse">Home</a>
34 
        <div data-role="header"><h1>Home Automation Control Center - ${title}</h1></div>
 36 
          <h1>Home Automation Control Center - ${title}</h1>
- 
 
 37 
        </div>
35 
        <div data-role="content"></div>
 38 
        <div data-role="content"></div>
36 
      </div>
 39 
      </div>
37 
    </script>
 40 
    </script>
38 
 
 41 
 
39 
    <script id="pagelink-template" type="text/x-jquery-tmpl" data-enhance="false">
 42 
    <script id="pagelink-template" type="text/x-jquery-tmpl" data-enhance="false">
40 
      <span>
 43 
      <span>
41 
        <a href="#pagelink?page=${name}" data-role="button">${title}</a>
 44 
        <a href="#" data-role="button">${title}</a>
42 
      </span>
 45 
      </span>
43 
    </script>
 46 
    </script>
44 
 
 47 
 
45 
    <script>
 48 
    <script>
46 
      $.mobile.ignoreContentEnabled = true;
 49 
      $.mobile.ignoreContentEnabled = true;
47 
 
 50 
 
48 
      function sendCommand(command, callback)
 51 
      function sendCommand(command, callback)
49 
      {
 52 
      {
50 
        jQuery.getJSON("backend.php?ajax", { command: command }, callback);
 53 
        jQuery.getJSON("backend.php?ajax", { command: command }, callback);
51 
      }
 54 
      }
52 
    </script>
 55 
    </script>
53 
 
 56 
 
54 
    <script>
 57 
    <script>
55 
      var pages = {};
 58 
      var pages = {};
56 
 
 59 
 
57 
    <?php
 60 
    <?php
58 
      foreach ($pages as $page)
 61 
      foreach ($pages as $page)
59 
      {
 62 
      {
60 
        include("pages/" . $page . "/script.js");
 63 
        include("pages/" . $page . "/script.js");
61 
      }
 64 
      }
62 
    ?>
 65 
    ?>
63 
    </script>
 66 
    </script>
64 
 
 67 
 
65 
    <script>
 68 
    <script>
66 
 
 69 
 
67 
      var pageConfigurations = <?php echo json_encode($pageConfiguration); ?>;
 70 
      var pageConfigurations = <?php echo json_encode($pageConfiguration); ?>;
68 
      var pageInstances = {};
 71 
      var pageInstances = {};
69 
 
 72 
 
70 
      $(document).ready(function(event)
 73 
      $(document).ready(function(event)
71 
      {
 74 
      {
72 
        jQuery.each(pageConfigurations, function(n, configuration)
 75 
        jQuery.each(pageConfigurations, function(n, configuration)
73 
        {
 76 
        {
74 
          var pageName = configuration.page + "_" + n;
 77 
          var pageName = configuration.page + "_" + n;
75 
 
 78 
 
76 
          pageInstances[pageName] = configuration;
 79 
          pageInstances[pageName] = configuration;
77 
 
 80 
 
78 
          pageInstances[pageName].name = pageName;
 81 
          pageInstances[pageName].name = pageName;
79 
 
 82 
 
80 
          pageInstances[pageName].pageLinkElement = $("#pagelink-template").tmpl(pageInstances[pageName]).appendTo($("#home").find(":jqmData(role=content)")).trigger("create");
 - 
 
81 
          pageInstances[pageName].pageElement = $("#page-template").tmpl(pageInstances[pageName]).appendTo($("body")).page();
 83 
          pageInstances[pageName].pageElement = $("#page-template").tmpl(pageInstances[pageName]).appendTo($("body")).page();
82 
          pageInstances[pageName].pageContentElement = pageInstances[pageName].pageElement.find(":jqmData(role=content)");
 84 
          pageInstances[pageName].pageContentElement = pageInstances[pageName].pageElement.find(":jqmData(role=content)");
83 
 
 85 
 
- 
 
 86 
          pageInstances[pageName].pageElement.find(":jqmData(rel=back)").on("click", function(event)
- 
 
 87 
          {
- 
 
 88 
            $.mobile.changePage($("#home"), "slide");
- 
 
 89 
            event.preventDefault();
- 
 
 90 
          });
- 
 
 91 
 
- 
 
 92 
          pageInstances[pageName].pageLinkElement = $("#pagelink-template").tmpl(pageInstances[pageName]).appendTo($("#home").find(":jqmData(role=content)")).trigger("create").on("click", function(event)
- 
 
 93 
          {
- 
 
 94 
            $.mobile.changePage(pageInstances[pageName].pageElement, "slide");
- 
 
 95 
            event.preventDefault();
- 
 
 96 
          });
- 
 
 97 
 
- 
 
 98 
 
84 
          if (pages[configuration.page] && pages[configuration.page].init)
 99 
          if (pages[configuration.page] && pages[configuration.page].init)
85 
          {
 100 
          {
86 
            pages[configuration.page].init(pageInstances[pageName]);
 101 
            pages[configuration.page].init(pageInstances[pageName]);
87 
          }
 102 
          }
88 
        });
 - 
 
89 
      });
 103 
        });
90 
 
 104 
 
91 
      $(document).bind("pagebeforechange", function(e, data)
 105 
        $(".ui-page").on("swipeleft", function()
92 
      {
 106 
        {
- 
 
 107 
          var nextpage = $(this).nextAll(":jqmData(role=page)");
- 
 
 108 
 
93 
        if (typeof data.toPage === "string")
 109 
          if (nextpage.length > 0)
- 
 
 110 
          {
- 
 
 111 
            $.mobile.changePage($(nextpage[0]), "slide");
- 
 
 112 
          }
- 
 
 113 
        });
- 
 
 114 
       
- 
 
 115 
        $(".ui-page").on("swiperight", function()
94 
        {
 116 
        {
95 
          var u = $.mobile.path.parseUrl(data.toPage);
 117 
          var prevpage = $(this).prevAll(":jqmData(role=page)");
96 
          var re = /^#pagelink/;
 - 
 
97 
 
 118 
 
98 
          if (u.hash.search(re) !== -1)
 119 
          if (prevpage.length > 0)
99 
          {
 120 
          {
100 
            var pageName = u.hash.replace(/.*page=/, "");
 - 
 
101 
            var page = $("#page-" + pageName);
 - 
 
102 
 
 - 
 
103 
            if (page)
 - 
 
104 
            {
 - 
 
105 
              data.options.dataUrl = u.href;
 - 
 
106 
 
 - 
 
107 
              $.mobile.changePage(page, data.options);
 121 
            $.mobile.changePage($(prevpage[0]), "slide", true);
108 
            }
 - 
 
109 
 
 - 
 
110 
            e.preventDefault();
 - 
 
111 
          }
 - 
 
112 
        }
 122 
          }
- 
 
 123 
        });
113 
      });
 124 
      });
114 
 
 125 
 
115 
    </script>
 126 
    </script>
116 
  </head>
 127 
  </head>
117 
 
 128 
 
118 
  <body>
 129 
  <body>
119 
    <div id="home" data-role="page" data-theme="a">
 130 
    <div id="home" data-role="page" data-theme="a">
120 
      <div data-role="header"><h1>Home Automation Control Center</h1></div>
 131 
      <div data-role="header"><h1>Home Automation Control Center</h1></div>
121 
      <div data-role="content"></div>
 132 
      <div data-role="content"></div>
122 
    </div>
 133 
    </div>
123 
  </body>
 134 
  </body>
124 
</html>
 135 
</html>
125 
 
 136