dashboard.html in kibana-sinatra-0.0.3

- old
+ new
@@ -1,77 +1,93 @@
-<div class="row-fluid container" style="margin-top:10px; width:98%">
+<!-- is there a better way to repeat without actually affecting the page? -->
+<nil ng-repeat="pulldown in dashboard.current.pulldowns" ng-controller="PulldownCtrl" ng-show="pulldown.enable">
+  <div class="top-row-open" ng-hide="pulldown.collapse">
+    <kibana-simple-panel type="pulldown.type" ng-cloak></kibana-simple-panel>
+  </div>
+  <div class="top-row-close pointer" ng-click="toggle_pulldown(pulldown);dismiss();" bs-tooltip="'Toggle '+pulldown.type" data-placement="bottom">
+    <span class="small row-text">{{pulldown.type}}</span>
+    <i class="small" ng-class="{'icon-caret-left':pulldown.collapse,'icon-caret-up':!pulldown.collapse}"></i>
+    <i class="small icon-star text-warning" ng-show="row.notice && pulldown.collapse"></i>
+  </div>
+</nil>
 
-  <!-- Rows -->
-  <div class="row-fluid kibana-row" ng-controller="RowCtrl" ng-repeat="(row_name, row) in dashboard.current.rows" ng-style="row_style(row)">
-    <div class="row-control">
-      <div class="row-fluid" style="padding:0px;margin:0px;position:relative;">
+<div class="container-fluid main">
+  <div class="row-fluid">
+    <div class="row-fluid container" style="margin-top:10px; width:98%">
+      <!-- Rows -->
+      <div class="row-fluid kibana-row" ng-controller="RowCtrl" ng-repeat="(row_name, row) in dashboard.current.rows" ng-style="row_style(row)">
+        <div class="row-control">
+          <div class="row-fluid" style="padding:0px;margin:0px;position:relative;">
 
-        <div class="row-close span12" ng-show="row.collapse" data-placement="bottom" >
-          <span class="row-button" bs-modal="'app/partials/roweditor.html'" class="pointer">
-            <i bs-tooltip="'Configure row'" data-placement="right" ng-show="row.editable" class="icon-cog pointer"></i>
-          </span>
-          <span class="row-button" ng-click="toggle_row(row)" ng-show="row.collapsable">
-            <i bs-tooltip="'Expand row'" data-placement="right" ng-show="row.editable" class="icon-expand pointer" ></i>
-          </span>
-          <span class="row-button row-text" ng-click="toggle_row(row)" ng-class="{'pointer':row.collapsable}">{{row.title || 'Row '+$index}}</span>
-        </div>
+            <div class="row-close span12" ng-show="row.collapse" data-placement="bottom" >
+              <span class="row-button" bs-modal="'app/partials/roweditor.html'" class="pointer">
+                <i bs-tooltip="'Configure row'" data-placement="right" ng-show="row.editable" class="icon-cog pointer"></i>
+              </span>
+              <span class="row-button" ng-click="toggle_row(row)" ng-show="row.collapsable">
+                <i bs-tooltip="'Expand row'" data-placement="right" ng-show="row.editable" class="icon-caret-right pointer" ></i>
+              </span>
+              <span class="row-button row-text" ng-click="toggle_row(row)" ng-class="{'pointer':row.collapsable}">{{row.title || 'Row '+$index}}</span>
+            </div>
 
-        <div style="text-align:left" class="row-open" ng-show="!row.collapse">
-          <span ng-show="row.collapsable">
-            <i bs-tooltip="'Hide row'" data-placement="right"  class="icon-collapse-top" ng-click="toggle_row(row)"></i>
-            <br>
-          </span>
-          <span bs-modal="'app/partials/roweditor.html'" ng-show="row.editable">
-            <i bs-tooltip="'Configure row'" data-placement="right"  class="icon-cog pointer"></i>
-            <br>
-          </span>
-          <span ng-show="rowSpan(row) == 12 && row.editable">
-            <i bs-tooltip="'Row full. Create a new row to add more panels'" data-placement="right" class="icon-trello"></i>
-            <br>
-          </span>
-          <span ng-show="rowSpan(row) > 12">
-            <i bs-tooltip="'Total span > 12. This row may format poorly'" data-placement="right" class="icon-warning-sign text-warning"></i>
-            <br>
-          </span>
-        </div>
+            <div style="text-align:center" class="row-open" ng-show="!row.collapse">
+              <span ng-show="row.collapsable">
+                <i bs-tooltip="'Hide row'" data-placement="right"  class="icon-caret-up" ng-click="toggle_row(row)"></i>
+                <br>
+              </span>
+              <span bs-modal="'app/partials/roweditor.html'" ng-show="row.editable">
+                <i bs-tooltip="'Configure row'" data-placement="right"  class="icon-cog pointer"></i>
+                <br>
+              </span>
+              <span ng-show="rowSpan(row) == 12 && row.editable">
+                <i bs-tooltip="'Row full. Create a new row to add more panels'" data-placement="right" class="icon-columns"></i>
+                <br>
+              </span>
+              <span ng-show="rowSpan(row) > 12">
+                <i bs-tooltip="'Total span > 12. This row may format poorly'" data-placement="right" class="icon-warning-sign text-warning"></i>
+                <br>
+              </span>
+            </div>
 
-      </div>
-      <div class="row-fluid" style="padding-top:0px" ng-hide="row.collapse">
+          </div>
+          <div class="row-fluid" style="padding-top:0px" ng-if="!row.collapse">
 
-        <!-- Panels -->
-        <div ng-repeat="(name, panel) in row.panels|filter:isPanel" ng-hide="panel.span == 0 || panel.hide" class="span{{panel.span}} panel nospace" style="min-height:{{row.height}}; position:relative" data-drop="true" ng-model="row.panels" data-jqyoui-options jqyoui-droppable="{index:$index,mutate:false,onDrop:'panelMoveDrop',onOver:'panelMoveOver(true)',onOut:'panelMoveOut'}">
-          <!-- Error Panel -->
-          <div class="row-fluid">
-            <div class="span12 alert alert-error panel-error" ng-hide="!panel.error">
-              <a class="close" ng-click="panel.error=false">&times;</a>
-              <i class="icon-exclamation-sign"></i> <strong>Oops!</strong> {{panel.error}}
+            <!-- Panels -->
+            <div ng-repeat="(name, panel) in row.panels|filter:isPanel" ng-hide="panel.span == 0 || panel.hide" class="span{{panel.span}} panel nospace" style="min-height:{{row.height}}; position:relative" data-drop="true" ng-model="row.panels" data-jqyoui-options jqyoui-droppable="{index:$index,mutate:false,onDrop:'panelMoveDrop',onOver:'panelMoveOver(true)',onOut:'panelMoveOut'}">
+              <!-- Error Panel -->
+              <div class="row-fluid">
+                <div class="span12 alert alert-error panel-error" ng-hide="!panel.error">
+                  <a class="close" ng-click="panel.error=false">&times;</a>
+                  <i class="icon-exclamation-sign"></i> <strong>Oops!</strong> {{panel.error}}
+                </div>
+              </div>
+
+              <!-- Content Panel -->
+              <div class="row-fluid" style="position:relative" ng-class="{'dragInProgress':dashboard.panelDragging}" >
+                <kibana-panel type="panel.type" ng-cloak></kibana-panel>
+              </div>
             </div>
-          </div>
-          <!-- Content Panel -->
-          <div class="row-fluid" style="position:relative" ng-class="{'dragInProgress':dashboard.panelDragging}" >
-            <kibana-panel type="panel.type" ng-cloak></kibana-panel>
-          </div>
-        </div>
 
-        <div ng-hide="(12-rowSpan(row)) < 1 || !dashboard.current.panel_hints" class="panel span{{(12-rowSpan(row))}}" ng-class="{'dragInProgress':dashboard.panelDragging}" style="height:{{row.height}};" data-drop="true" ng-model="row.panels" data-jqyoui-options jqyoui-droppable="{index:row.panels.length,onDrop:'panelMoveDrop({{(12-rowSpan(row))}})',onOver:'panelMoveOver(false)',onOut:'panelMoveOut'}">
+            <div ng-hide="(12-rowSpan(row)) < 1 || !dashboard.current.panel_hints" class="panel span{{(12-rowSpan(row))}}" ng-class="{'dragInProgress':dashboard.panelDragging}" ng-style="{height:row.height}" data-drop="true" ng-model="row.panels" data-jqyoui-options jqyoui-droppable="{index:row.panels.length,mutate:false,onDrop:'panelMoveDrop',onOver:'panelMoveOver',onOut:'panelMoveOut'}">
 
-          <span bs-modal="'app/partials/roweditor.html'" ng-show="row.editable && !dashboard.panelDragging">
-            <i ng-hide="rowSpan(row) == 0" class="pointer icon-plus-sign" ng-click="editor.index = 2" bs-tooltip="'Add a panel to this row'" data-placement="right"></i>
-            <span ng-click="editor.index = 2" style="margin-top: 8px; margin-left: 3px" ng-show="rowSpan(row) == 0" class="btn btn-mini">Add panel to empty row</btn>
-          </span>
+              <span bs-modal="'app/partials/roweditor.html'" ng-show="row.editable && !dashboard.panelDragging">
+                <i ng-hide="rowSpan(row) == 0" class="pointer icon-plus-sign" ng-click="editor.index = 2" bs-tooltip="'Add a panel to this row'" data-placement="right"></i>
+                <span ng-click="editor.index = 2" style="margin-top: 8px; margin-left: 3px" ng-show="rowSpan(row) == 0" class="btn btn-mini">Add panel to empty row</btn>
+              </span>
 
+            </div>
+
+          </div>
         </div>
+      </div>
 
+      <div class="row-fluid" ng-show='dashboard.current.editable'>
+        <div class="span12" style="text-align:right;">
+          <span style="margin-left: 0px;" class="pointer btn btn-mini" bs-modal="'app/partials/dasheditor.html'">
+            <span ng-click="editor.index = 2"><i class="icon-plus-sign"></i> ADD A ROW</span>
+          </span>
+        </div>
       </div>
-    </div>
-  </div>
 
-  <div class="row-fluid" ng-show='dashboard.current.editable'>
-    <div class="span12" style="text-align:right;">
-      <span style="margin-left: 0px;" class="pointer btn btn-mini" bs-modal="'app/partials/dasheditor.html'">
-        <span ng-click="editor.index = 2"><i class="icon-plus-sign"></i> ADD A ROW</span>
-      </span>
+
     </div>
   </div>
-
-
 </div>
\ No newline at end of file