grafana/public/app/plugins/datasource/elasticsearch/partials/bucket_agg.html

<div class="tight-form">
	<ul class="tight-form-list">
		<li class="tight-form-item query-keyword tight-form-align" style="width: 75px;">
			<span ng-show="isFirst">Group by</span>
			<span ng-hide="isFirst">Then by</span>
		</li>
		<li>
			<metric-segment-model property="agg.type" options="bucketAggTypes" on-change="onTypeChanged()" custom="false" css-class="tight-form-item-large"></metric-segment-model>
		</li>
		<li ng-if="agg.field">
			<metric-segment-model property="agg.field" get-options="getFieldsInternal()" on-change="onChange()" css-class="tight-form-item-xxlarge"></metric-segment>
		</li>
		<li ng-if="!agg.field">
			<span class="tight-form-item tight-form-item-xxlarge">&nbsp;</span>
		</li>
		<li class="tight-form-item last" ng-if="settingsLinkText">
			<a ng-click="toggleOptions()">
				<i class="fa fa-caret-down" ng-show="showOptions"></i>
				<i class="fa fa-caret-right" ng-hide="showOptions"></i>
				{{settingsLinkText}}
			</a>
		</li>
	</ul>

	<ul class="tight-form-list pull-right">
		<li class="tight-form-item last" ng-if="isFirst">
			<a class="pointer" ng-click="addBucketAgg()"><i class="fa fa-plus"></i></a>
		</li>
		<li class="tight-form-item last">
			<a class="pointer" ng-click="removeBucketAgg()"><i class="fa fa-minus"></i></a>
		</li>
	</ul>
	<div class="clearfix"></div>
</div>

<div class="tight-form" ng-if="showOptions">
	<div class="tight-form-inner-box" ng-if="agg.type === 'date_histogram'">
		<div class="tight-form">
			<ul class="tight-form-list">
				<li class="tight-form-item" style="width: 140px">
					Interval
				</li>
				<li>
					<metric-segment-model property="agg.settings.interval" get-options="getIntervalOptions()" on-change="onChangeInternal()" css-class="last" custom="true"></metric-segment-model>
				</li>
			</ul>
			<div class="clearfix"></div>
		</div>
		<div class="tight-form">
			<ul class="tight-form-list">
				<li class="tight-form-item" style="width: 140px">
					Min Doc Count
				</li>
				<li>
					<input type="number" class="tight-form-input" ng-model="agg.settings.min_doc_count" ng-blur="onChangeInternal()">
				</li>
			</ul>
			<div class="clearfix"></div>
		</div>
		<div class="tight-form last">
			<ul class="tight-form-list">
				<li class="tight-form-item" style="width: 140px">
					Drop first &amp; last value
				</li>
				<li class="tight-form-item">
					<input class="cr1" type="checkbox" id="agg[{{agg.id}}].settings.dropFirstLast"
					ng-model="agg.settings.dropFirstLast" ng-checked="agg.settings.dropFirstLast" ng-change="onChangeInternal()">
					<label for="agg[{{agg.id}}].settings.dropFirstLast" class="cr1"></label>
				</li>
				<li class="tight-form-item last">
					<i class="fa fa-question-circle" bs-tooltip="'Ignore the first and last values of the dataset'" data-placement="right"></i>
				</li>
			</ul>
			<div class="clearfix"></div>
		</div>
	</div>
	<div class="tight-form-inner-box" ng-if="agg.type === 'terms'">
		<div class="tight-form">
			<ul class="tight-form-list">
				<li class="tight-form-item" style="width: 60px">
					Order
				</li>
				<li>
					<metric-segment-model property="agg.settings.order" options="orderOptions" on-change="onChangeInternal()" css-class="last"></metric-segment-model>
				</li>
			</ul>
			<div class="clearfix"></div>
		</div>
		<div class="tight-form">
			<ul class="tight-form-list">
				<li class="tight-form-item" style="width: 60px">
					Size
				</li>
				<li>
					<metric-segment-model property="agg.settings.size" options="sizeOptions" on-change="onChangeInternal()" css-class="last"></metric-segment-model>
				</li>
			</ul>
			<div class="clearfix"></div>
		</div>
		<div class="tight-form last">
			<ul class="tight-form-list">
				<li class="tight-form-item" style="width: 60px">
					Order By
				</li>
				<li>
					<metric-segment-model property="agg.settings.orderBy" options="orderByOptions" on-change="onChangeInternal()" css-class="last"></metric-segment-model>
				</li>
			</ul>
			<div class="clearfix"></div>
		</div>
	</div>
	<div class="tight-form-inner-box" ng-if="agg.type === 'filters'">
		<div class="tight-form" ng-repeat="filter in agg.settings.filters" ng-class="{last: $last}">
			<ul class="tight-form-list">
				<li class="tight-form-item" style="width: 100px">
					Query {{$index + 1}}
				</li>
				<li>
					<input type="text" class="tight-form-input input-large" ng-model="filter.query" spellcheck='false' placeholder="Lucene query" ng-blur="onChangeInternal()">
				</li>
				<li class="tight-form-item last" ng-if="$first">
					<a class="pointer" ng-click="addFiltersQuery()"><i class="fa fa-plus"></i></a>
				</li>
				<li class="tight-form-item last" ng-if="!$first">
					<a class="pointer" ng-click="removeFiltersQuery(filter)"><i class="fa fa-minus"></i></a>
				</li>
			</ul>
			<div class="clearfix"></div>
		</div>

	</div>

</div>