IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

refactoring(ui): minor ui improvement to graph axis tab

Browse Source
This commit is contained in:
Torkel Ödegaard
2015-12-01 14:04:44 +01:00
parent 82d8e3c2b6
commit 75b83af08f
1 changed files with 68 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

118
public/app/panels/graph/axisEditor.html
View File

@@ -6,7 +6,7 @@
<li class="tight-form-item" style="width: 80px"> <li class="tight-form-item" style="width: 80px">
Left Y Left Y
</li> </li>
<li class="tight-form-item"> <li class="tight-form-item" style="width: 40px">
Unit Unit
</li> </li>
<li class="dropdown" style="width: 140px;" <li class="dropdown" style="width: 140px;"
@@ -14,22 +14,6 @@
dropdown-typeahead="unitFormats" dropdown-typeahead="unitFormats"
dropdown-typeahead-on-select="setUnitFormat(0, $subItem)"> dropdown-typeahead-on-select="setUnitFormat(0, $subItem)">
</li> </li>
<li class="tight-form-item">
&nbsp;&nbsp; Grid Max
</li>
<li>
<input type="number" class="input-small tight-form-input" placeholder="auto"
empty-to-null ng-model="panel.grid.leftMax"
ng-change="render()" ng-model-onblur>
</li>
<li class="tight-form-item">
Min
</li>
<li>
<input type="number" class="input-small tight-form-input" placeholder="auto"
empty-to-null ng-model="panel.grid.leftMin"
ng-change="render()" ng-model-onblur>
</li>
<li class="tight-form-item"> <li class="tight-form-item">
Scale type Scale type
</li> </li>
@@ -46,12 +30,36 @@
</ul> </ul>
<div class="clearfix"></div> <div class="clearfix"></div>
</div> </div>
<div class="tight-form last"> <div class="tight-form">
<ul class="tight-form-list">
<li class="tight-form-item" style="width: 80px">
<i class="fa fa-remove invisible"></i>
</li>
<li class="tight-form-item">
Y-Max
</li>
<li>
<input type="number" class="input-small tight-form-input" placeholder="auto"
empty-to-null ng-model="panel.grid.leftMax"
ng-change="render()" ng-model-onblur>
</li>
<li class="tight-form-item" style="width: 115px; text-align: right;">
Y-Min
</li>
<li>
<input type="number" class="input-small tight-form-input" placeholder="auto" style="width: 113px;"
empty-to-null ng-model="panel.grid.leftMin"
ng-change="render()" ng-model-onblur>
</li>
</ul>
<div class="clearfix"></div>
</div>
<div class="tight-form">
<ul class="tight-form-list"> <ul class="tight-form-list">
<li class="tight-form-item" style="width: 80px"> <li class="tight-form-item" style="width: 80px">
Right Y Right Y
</li> </li>
<li class="tight-form-item"> <li class="tight-form-item" style="width: 40px">
Unit Unit
</li> </li>
<li class="dropdown" style="width: 140px" <li class="dropdown" style="width: 140px"
@@ -59,22 +67,6 @@
dropdown-typeahead="unitFormats" dropdown-typeahead="unitFormats"
dropdown-typeahead-on-select="setUnitFormat(1, $subItem)"> dropdown-typeahead-on-select="setUnitFormat(1, $subItem)">
</li> </li>
<li class="tight-form-item">
&nbsp;&nbsp; Grid Max
</li>
<li>
<input type="number" class="input-small tight-form-input" placeholder="auto"
empty-to-null ng-model="panel.grid.rightMax"
ng-change="render()" ng-model-onblur>
</li>
<li class="tight-form-item">
Min
</li>
<li>
<input type="number" class="input-small tight-form-input" placeholder="auto"
empty-to-null ng-model="panel.grid.rightMin"
ng-change="render()" ng-model-onblur>
</li>
<li class="tight-form-item"> <li class="tight-form-item">
Scale type Scale type
</li> </li>
@@ -91,6 +83,31 @@
</ul> </ul>
<div class="clearfix"></div> <div class="clearfix"></div>
</div> </div>
<div class="tight-form last">
<ul class="tight-form-list">
<li class="tight-form-item" style="width: 80px">
<i class="fa fa-remove invisible"></i>
</li>
<li class="tight-form-item">
Y-Max
</li>
<li>
<input type="number" class="input-small tight-form-input" placeholder="auto"
empty-to-null ng-model="panel.grid.rightMax"
ng-change="render()" ng-model-onblur>
</li>
<li class="tight-form-item" style="width: 115px; text-align: right;">
Y-Min
</li>
<li>
<input type="number" class="input-small tight-form-input" placeholder="auto" style="width: 113px;"
empty-to-null ng-model="panel.grid.rightMin"
ng-change="render()" ng-model-onblur>
</li>
</ul>
<div class="clearfix"></div>
</div>
</div> </div>
<div class="section" style="margin-bottom: 20px"> <div class="section" style="margin-bottom: 20px">
@@ -168,6 +185,21 @@
<div class="clearfix"></div> <div class="clearfix"></div>
</div> </div>
<div class="tight-form"> <div class="tight-form">
<ul class="tight-form-list">
<li class="tight-form-item" style="width: 80px">
Hide series
</li>
<li class="tight-form-item">
<editor-checkbox text="with only nulls" model="panel.legend.hideEmpty" change="render()"></editor-checkbox>
</li>
<li class="tight-form-item last">
<editor-checkbox text="with only zeroes" model="panel.legend.hideZero" change="render()"></editor-checkbox>
</li>
</ul>
<div class="clearfix"></div>
</div>
<div class="tight-form last">
<ul class="tight-form-list"> <ul class="tight-form-list">
<li class="tight-form-item" style="width: 80px"> <li class="tight-form-item" style="width: 80px">
Values Values
@@ -184,7 +216,7 @@
<li class="tight-form-item"> <li class="tight-form-item">
<editor-checkbox text="Current" model="panel.legend.current" change="legendValuesOptionChanged()"></editor-checkbox> <editor-checkbox text="Current" model="panel.legend.current" change="legendValuesOptionChanged()"></editor-checkbox>
</li> </li>
<li class="tight-form-item last"> <li class="tight-form-item">
<editor-checkbox text="Total" model="panel.legend.total" change="legendValuesOptionChanged()"></editor-checkbox> <editor-checkbox text="Total" model="panel.legend.total" change="legendValuesOptionChanged()"></editor-checkbox>
</li> </li>
<li class="tight-form-item"> <li class="tight-form-item">
@@ -197,19 +229,5 @@
</ul> </ul>
<div class="clearfix"></div> <div class="clearfix"></div>
</div> </div>
<div class="tight-form">
<ul class="tight-form-list">
<li class="tight-form-item" style="width: 80px">
Hide
</li>
<li class="tight-form-item last">
<editor-checkbox text="All null series" model="panel.legend.hideEmpty" change="render()"></editor-checkbox>
</li>
<li class="tight-form-item last">
<editor-checkbox text="All zero series" model="panel.legend.hideZero" change="render()"></editor-checkbox>
</li>
</ul>
<div class="clearfix"></div>
</div>
</div> </div>
</div> </div>