config data to local storage, notifications
[iot-control-center.git] / index.html
blob:a/index.html -> blob:b/index.html
--- a/index.html
+++ b/index.html
@@ -78,17 +78,6 @@
         <ol class="breadcrumb">
             <li class="active"><i class="fa fa-dashboard"></i> Dashboard</li>
         </ol>
-        <div class="">
-          <div class="tab-bar tab-bar--top tab-bar--material pagination">
-            <label class="tab-bar__item tab-bar--material__item" data-pagination="0">
-              <input type="radio" name="tab-bar-material-a" checked="checked">
-              <button class="tab-bar__button tab-bar--material__button">
-                <i class="tab-bar__icon tab-bar--material__icon ion-drag"></i>
-                <div class="tab-bar__label tab-bar--material__label">All</div>
-              </button>
-            </label>
-          </div>
-        </div>
     </section>
 
     <section class="content-header hide" data-section="settings">
@@ -108,11 +97,98 @@
     <!-- Dashboard content -->
     <section class="content" data-section="dashboard">
 
+        <div class="row">
+          <div class="col-md-12">
+            <div class="tab-bar tab-bar--top tab-bar--material pagination hide">
+              <label class="tab-bar__item tab-bar--material__item" data-pagination="0">
+                <input type="radio" name="tab-bar-material-a" checked="checked">
+                <button class="tab-bar__button tab-bar--material__button">
+                  <i class="tab-bar__icon tab-bar--material__icon ion-drag"></i>
+                  <div class="tab-bar__label tab-bar--material__label">All</div>
+                </button>
+              </label>
+            </div>
+          </div>
+        </div>
+
+        <div class="row">
+          <div class="col-md-12">
+            <div class="callout notification-dashboard hide">
+              <h4></h4>
+              <span></span>
+            </div>
+          </div>
+        </div>
+
     </section>
 
     <!-- Settings content -->
     <section class="content hide" data-section="settings">
 
+      <div class="row">
+        <div class="col-md-12">
+          <div class="callout notification-settings hide">
+            <h4></h4>
+            <span></span>
+          </div>
+        </div>
+      </div>
+
+      <div class="row">
+        <div class="col-md-12">
+          <div class="box box-primary">
+            <div class="box-header with-border">
+              <h3 class="box-title">MQTT connection data</h3>
+            </div>
+            <!-- /.box-header -->
+            <!-- form start -->
+            <form id="mqttConfig">
+              <div class="box-body">
+                <div class="form-group">
+                  <label for="mqttClientId">Client ID</label>
+                  <input type="text" class="form-control" id="mqttClientId" name="mqttClientId" placeholder="Client ID" />
+                </div>
+                <div class="form-group">
+                  <label for="mqttHost">Host</label>
+                  <input type="text" class="form-control" id="mqttHost" name="mqttHost" placeholder="Host" />
+                </div>
+                <div class="form-group">
+                  <label for="mqttHost">Port</label>
+                  <input type="text" class="form-control" id="mqttPort" name="mqttPort" placeholder="Port" />
+                </div>
+                <div class="form-group">
+                  <label for="mqttUser">Username</label>
+                  <input type="text" class="form-control" id="mqttUser" name="mqttUser" placeholder="Username" />
+                </div>
+                <div class="form-group">
+                  <label for="mqttPass">Password</label>
+                  <input type="text" class="form-control" id="mqttPass" name="mqttPass" placeholder="Password" />
+                </div>
+                <div class="checkbox">
+                  <label for="mqttSecure">
+                    <input type="checkbox" id="mqttSecure" name="mqttSecure" /> Secure
+                  </label>
+                </div>
+                <div class="checkbox">
+                  <label for="mqttDebug">
+                    <input type="checkbox" id="mqttDebug" name="mqttDebug" /> Debug
+                  </label>
+                </div>
+                <div class="checkbox">
+                  <label for="mqttSimulateDevices">
+                    <input type="checkbox" id="mqttSimulateDevices" name="mqttSimulateDevices" /> Simulate devices
+                  </label>
+                </div>
+              </div>
+              <!-- /.box-body -->
+
+              <div class="box-footer">
+                <button type="submit" class="btn btn-primary" id="saveMqttConfig">Save</button>
+              </div>
+            </form>
+          </div>
+        </div>
+      </div>
     </section>
     <!-- /.content -->
 

comments