×

Welcome to TagMyCode

Please login or create account to add a snippet.
 

index.html

0
0
 
0
Language: HTML
Posted by: Alan SAEED
Added: Nov 26, 2014 5:10 PM
Views: 1841
Tags: demo
  1. html>
  2.         <head>
  3.                 <title>oBIX Demo</title>
  4.  
  5.                 <style>
  6.                         form {
  7.                                 width: 100%;
  8.                         }
  9.  
  10.                         input[type=text] {
  11.                                 width: 100%;
  12.                         }
  13.                 </style>
  14.                 <script src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.min.js"></script>
  15.                 <script type="text/javascript" src="lodash.js"></script>
  16.                 <script type="text/javascript" src="EventEmitter.js"></script>
  17.                 <script type="text/javascript" src="bootstrap.js"></script>
  18.                 <script type="text/javascript" src="timer.js"></script>
  19.                 <script type="text/javascript" src="OBIX.js"></script>
  20.                 <script type='text/javascript' src='obixWatch.js'></script>
  21.                 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  22.                 <script>
  23.                         var obixWatch = new ObixWatch();
  24.  
  25.                         /**
  26.                          * Called when the page is loaded
  27.                          */
  28.                         function start() {
  29.                                 // Build the items to Watch
  30.                                 var item1 = {
  31.                                         uri : '/obix/network/N0022F7/DEV81/AI41/Present_Value/',
  32.                                         handler : watchCallback,
  33.                                         dispName : 'VAV1',
  34.                                         inBody : '',
  35.                                         pickle : document.getElementById('abc001')
  36.                                 };
  37.  
  38.                                 var item2 = {
  39.                                         uri : '/obix/network/N0022F7/DEV81/AI61/Present_Value/',
  40.                                         handler : watchCallback,
  41.                                         dispName : 'VAV2',
  42.                                         inBody : '',
  43.                                         pickle : document.getElementById('abc002')
  44.                                 };
  45.  
  46.                                 var item3 = { uri: '/obix/network/N0022F7/DEV73/EO1/',
  47.                                 handler: watchCallback,
  48.                                 dispName: 'VAV3',
  49.                                 inBody: '',
  50.                                 pickle: document.getElementById('abc003')
  51.  
  52.                                 // Add the items to Watch
  53.                                 obixWatch.addURIs([item1, item2, item3]);
  54.  
  55.                                 // Start the Watch
  56.                                 obixWatch.startWatch();
  57.                         }
  58.  
  59.                         /**
  60.                          * Called when the page is unloaded
  61.                          */
  62.                         function stop() {
  63.                                 obixWatch.stopWatch();
  64.                         }
  65.  
  66.                         /**
  67.                          * Call back when the oBIX Watch is updated
  68.                          */
  69.                         function watchCallback(uriItem, node) {
  70.                                 // Update the inner HTML element with the 'display' part of oBIX
  71.                                 uriItem.pickle.innerHTML = node.getAttribute('val');
  72.                         }
  73.  
  74.                 </script>
  75.         </head>
  76.  
  77.         <body onload="start()" onunload="stop()">
  78.  
  79.                 <h1>oBIX Demo</h1>
  80.                 <br />
  81.  
  82.                 This is an example of using the oBIX on an HTML page...
  83.                 <br />
  84.                 <br />
  85.  
  86.                 <table border="1">
  87.                         <tr>
  88.                                 <th>Name</th>
  89.                                 <th>Value</th>
  90.  
  91.                         </tr>
  92.                         <tr>
  93.                                 <td>Temp</td>
  94.                                 <td><a id='abc001'>-wait-</a></td>
  95.                         </tr>
  96.                         <tr>
  97.                                 <td>Temp</td>
  98.                                 <td><a id='abc002'>-wait-</a></td>
  99.                         </tr>
  100.                         <tr>
  101.                                 <td>Value</td>
  102.                                 <td><a id='abc003'>-wait-</a></td>
  103.                         </tr>
  104.  
  105.                 </table>
  106.                 <h2>Result:</h2><h1 id="Result"></h1>
  107.                 <button id="submit">
  108.                         Submit
  109.                 </button>
  110.                 <div id="resp"></div>
  111.                 <img src="logo.png" width="500px"/>
  112.                 <script>
  113. // build table of points to edit
  114. PropertyRow.add(nodeID + "/DEV81/AI41/Present_Value","AV1");
  115. PropertyRow.add(nodeID + "/DEV81/AI61/Present_Value","Room 1");
  116. PropertyRow.add(nodeID + "/DEV100/AV3/Present_Value");
  117. </script>
  118.         </body>
  119. </html>

Write a comment

To post comments, please log in or register.