

<div class="row">
	<div class="col-md-12">
		<label for="xqueryInput" class="control-label">Cql Query</label>
	</div>
</div>
<div class="row">
	<div class="col-md-12">
		<textarea class="form-control" id="xqueryInput" ng-model="query"></textarea>	
	</div>
</div>
<div class="row">
	<div class="col-md-3">
		<label for="xqueryInput" class="control-label">Metadata
			Format</label>
	</div>
	<div class="col-md-3">
		<label for="xqueryInput" class="control-label">Backend</label>
	</div>
	<div class="col-md-3">
		<label for="xqueryInput" class="control-label">Index</label>
	</div>
</div>
<div class="row">

	<div class="col-md-3">
		<select class="form-control" ng-model="selectedMdref"
			ng-change="metadataFormatSelected({{item.layout}})"
			ng-options="(item.format +'-' + item.layout + '-' + item.interpretation) for item in mdFormats">
			<option value="" selected="selected">--Select Metadata
				Format--</option>
		</select>


	</div>
	<div class="col-md-3">
		<select class="form-control" ng-model="selectedbackend"
			ng-change="backendSelected()" ng-options="item for item in backends">
			<option value="" selected="selected">--Select Backend--</option>
		</select>
	</div>
	<div class="col-md-3">
		<select class="form-control" ng-model="selectedIndex"
			ng-options="item.id for item in indices">
			<option value="" selected="selected">--ALL --</option>
		</select>
	</div>
</div>

<div class="row" style="padding-top: 10px">
	<div class="col-md-4">
		<button class="btn btn-info" ng-click="startSearch()">Search</button>
	</div>

	<div class="col-md-6">
		<button class="btn btn-info" ng-click="share()">Share</button>
	</div>
</div>

<div class="container-fluid" style="padding-top: 10px">

<div class="row" ng-show="error">
		<div class="panel panel-default" >
			<div class="panel-heading">
				<a class="accordion-toggle" data-toggle="collapse" data-target="#collapse_error"><b>Error:</b> <i>{{error.message}}</i></a>
			</div>
			<div id="collapse_error" class="panel-collapse collapse in">
				<div class="panel-body">
					<pre>{{error.stacktrace}}</pre>
				</div>			
			</div>
		</div>
	</div>

<div class="row" ng-show="searchResult">
	<div class="col-md-12 ">
		<h3>Number of results: {{searchResult.total}}</h3>
	</div>
	<div class="col-md-12 text-center">
		<ul class="pagination">
			<li><a href="" ng-click="prevPage()">&laquo;</a></li>			
			<li><a href="" ng-click="nextPage()">&raquo;</a></li>
		</ul>
	</div>
</div>



<div class="row" ng-repeat="item in searchResult.records">
	<div class="col-md-12">
		<div class="panel panel-default">
			<div class="panel-heading">
				<a class="accordion-toggle" data-toggle="collapse"
					data-target="#collapse_{{$index}}"><b>{{$index+1 + from}}</b></a>
			</div>
			<div id="collapse_{{$index}}" class="panel-collapse collapse in">
				<div class="panel-body">
					<div ng-bind-html="to_trusted(item)" compile-template></div>
				</div>


			</div>
		</div>
	</div>
</div>
</div>