<div class="container content">
	<div class="alert alert-error" ng-if="error">
		<b>Error:</b> {{ error }}
	</div>
	<div class="row">
		<table class="table table-hover boxed">
			<thead><tr><th>Profiles <small class="pull-right"><small class="pull-right"><a href="api/applications/{{ application.id }}/env">raw JSON</a></small></th></tr></thead>
			<tbody>
				<tr ng-repeat="profile in env.profiles" >
					<td style="word-break: break-all;" >{{ profile }}</td>
				</tr>
				<tr ng-hide="env.profiles" >
					<td style="word-break: break-all;" >No profiles active</td>
				</tr>
			</tbody>
		</table>
	</div>
	<div class="row" ng-show="application.capabilities.refresh">
		<table class="table table-hover boxed">
			<col width="38%">
			<col width="62%">
			<thead><tr><th colspan="2">Overriden properties</th></tr></thead>
			<tbody>
				<tr ng-repeat="(key, value) in env.manager track by key" >
					<td style="word-break: break-all;" >{{ key }}</td>
					<td style="word-break: break-all;" >{{ value }}</td>
				</tr>
				<tr ng-repeat="item in overrides.values">
					<td >
						<input type="text" class="input-xlarge" list="allkeys" placeholder="key" ng-model="item.key" ng-change="onChangeOverrideItem(item)"></input>
						<datalist id="allkeys">
							<option ng-repeat="key in allKeys | orderBy:'toString()' track by key">{{key}}</option>
						</datalist>
					</td>
					<td>
						<input type="text" class="input-xxlarge" placeholder="value" ng-model="item.value"></input>
					</td>
				</tr>
				<tr>
			</tbody>
			<tfoot>
				<tr>
					<td colspan="2">
						<div class="control-group pull-left">
							<button class="btn btn-info" ng-click="refresh()">Refresh beans</button>
						</div>
						<div class="control-group pull-right">
							<button class="btn btn-warning" ng-click="override()">Overrride values!</button>
							<button class="btn" ng-click="reset()">Reset overrides</button>
						</div>
						<div class="alert alert-info" ng-if="overrides.changes">
							<pre>{{ overrides.changes }}</pre>
						</div>
						<div class="alert alert-error" ng-if="overrides.error">
							<b>Error:</b> {{ overrides.error }}
						</div>
					</td>
				</tr>
			</tfoot>
		</table>
	</div>
	<div class="row">
		<div>
			<div class="input-append">
				<input placeholder="Filter" class="input-xxlarge" type="search" ng-model="searchFilter" />
				<button class="btn" title="reload list" ng-click="reload()"><i class="icon-refresh"></i></button>
			</div>
		</div>
		<table class="table table-hover boxed" ng-repeat="item in envArray track by item.key" ng-show="item.key != 'profiles' && (item.value | filter:searchFilter).length > 0">
			<col width="38%">
			<col width="62%">
			<thead><tr><th colspan="2">{{item.key}}</th></tr></thead>
			<tbody>
				<tr ng-repeat="property in item.value | orderBy:'key' | filter:searchFilter track by property.key" >
					<td style="word-break: break-all;" >{{ property.key }}</td>
					<td style="word-break: break-all;" >{{ property.value }}</td>
				</tr>
			</tbody>
		</table>
	</div>
</div>