grafana/panels/pie/editor.html

<div class="row-fluid" ng-switch="panel.mode">
  <div ng-switch-when="terms">
    <div class="row-fluid">    
      <div class="span4">
        <form style="margin-bottom: 0px">
          <h6> Field</h6>
          <input type="text" style="width:90%" ng-model="panel.query.field">
        </form>
      </div>
      <div class="span8">
        <form class="input-append" style="margin-bottom: 0px">
          <h6>Query</h6>
          <input type="text" style="width:80%" ng-model="panel.query.query">
          <button class="btn" ng-click="get_data()"><i class="icon-search"></i></button>
        </form>
      </div>
    </div>  
    <div class="row-fluid">
      <div class="span1">
        <h6>Length</h6>
        <input type="number" style="width:80%" ng-model="panel.size" ng-change="get_data()">
      </div>
      <div class="span11">
        <form class="input-append" style="margin-bottom: 0px">
          <h6>Exclude Terms(s) (comma seperated)</h6>
          <input array-join type="text" style="width:90%"  ng-model='panel.exclude'></input>
          <button class="btn" ng-click="get_data()"><i class="icon-search"></i></button>
        </form>
      </div>
    </div>
  </div>
  <div ng-switch-when="goal">
    <div class="row-fluid">    
      <div class="span2">
        <form style="margin-bottom: 0px">
          <h6>Goal</h6>
          <input type="number" style="width:90%" ng-model="panel.query.goal">
        </form>
      </div>
      <div class="span9">
        <form class="input-append" style="margin-bottom: 0px">
          <h6>Query</h6>
          <input type="text" style="width:80%" ng-model="panel.query.query">
          <button class="btn" ng-click="get_data()"><i class="icon-search"></i></button>
        </form>
      </div>
    </div>
  </div>
  <div ng-switch-when="query">
    <div class="row-fluid">    
      <div class="span3">
        <form style="margin-bottom: 0px">
          <h6>Label</h6>
          <input type="text" placeholder="New Label" style="width:70%" ng-model="newlabel">
        </form>
      </div>
      <div class="span8">
        <form class="input-append" style="margin-bottom: 0px">
          <h6>Query</h6>
          <input type="text" placeholder="New Query" style="width:80%" ng-model="newquery">
          <button class="btn" ng-click="add_query(newlabel,newquery);newlabel='';newquery=''"><i class="icon-plus"></i></button>
        </form>
      </div>
      <div class="span1">
      </div>  
    </div>
    <div class="row-fluid" ng-repeat="q in panel.query">
      <div class="span3">
        <form style="margin-bottom: 0px">
          <input type="text" style="width:70%" ng-model="q.label">
        </form>
      </div>
      <div class="span8">
        <form class="input-append" style="margin-bottom: 0px">
          <input type="text" style="width:80%" ng-model="q.query">
          <button class="btn" ng-click="get_data()"><i class="icon-search"></i></button>
        </form>
      </div>
      <div class="span1">
        <i class="icon-remove pointer" ng-click="remove_query(q)"></i>
      </div>    
    </div>
  </div>
</div>
<div class="row-fluid">    
  <div class="span1">
    <label class="small"> Donut </label><input type="checkbox" ng-model="panel.donut" ng-checked="panel.donut">
  </div>
  <div class="span1">
    <label class="small"> Tilt </label><input type="checkbox" ng-model="panel.tilt" ng-checked="panel.tilt">
  </div>
  <div class="span1">
    <label class="small"> Legend </label><input type="checkbox" ng-model="panel.legend" ng-checked="panel.legend">
  </div>
  <div class="span1">
    <label class="small"> Labels </label><input type="checkbox" ng-model="panel.labels" ng-checked="panel.labels">
  </div>
  <div class="span2">
    <label class="small">Mode</label> 
    <select class="input-small" ng-change="set_mode(panel.mode)" ng-model="panel.mode" ng-options="f for f in ['query','terms','goal']"></select>
  </div>
</div>