<h4 class="subheader">
	sites 
	<a 
    href="#sitemodal" 
    role="button"
    data-toggle="modal"
    ng-click="showSiteModal()"
    eat-click
    class="btn btn-success btn-sm pull-right"
    >
    <i class="fa fa-plus"></i>
    add new site
	</a>
</h4>				
<table class="table table-striped">
	<thead>
		<th></th>
		<th>name</th>
		<th>address</th>
		<th></th>
		<th>postcode</th>
		<th>primary phone</th>
		<th></th>
	</thead>
	<tbody ng-repeat="site in data.sites">
		<tr>
			<td><i ng-class="{'fa fa-caret-square-o-down': !site.hide, 'fa fa-caret-square-o-right': site.hide}" ng-click="site.hide = !site.hide"></i></td>
			<td>{[{ site.name }]}</td>
			<td>{[{ site.address }]}</td>
			<td>{[{ site.address2 }]}</td>
			<td>{[{ site.postcode }]}</td>
			<td>{[{ site.primary_phone }]}</a></td>
			<td><a href="#sitemodal" role="button" ng-click="showSiteModal(site)" data-toggle="modal" eat-click>edit</a></td>
		</tr>
		<tr ng-hide="site.hide">
			<td></td>
			<td colspan="8">
				<div class="well well-small">
					<div widget-map data-address="site.postcode">
						<iframe height="180" frameborder="0" style="width: 100%; border:0"
					   ng-if="formatted_address"
	ng-src="{[{ trustSrc('https://www.google.com/maps/embed/v1/place?key={{ config('services.google.maps') }}&q=' + formatted_address) }]}" allowfullscreen>
						</iframe>
					</div>
					<h4>site users</h4>
					<table class="table-condensed" style="width: 100%;">
						<thead>
							<th>first name</th>
							<th>last name</th>
							<th>email</th>
							<th>phone</th>
							<th>mobile</th>
							<th>position</th>
							<th>authority</th>
							<th></th>
						<tbody>
								<tr ng-repeat="user in site.users">
													<td>{[{ user.first_name }]}</td>
													<td>{[{ user.last_name }]}</td>
													<td>{[{ user.email }]}</td>
													<td>{[{ user.phone }]}</a></td>
													<td>{[{ user.mobile }]}</a></td>
													<td>{[{ user.position }]}</td>
													<td class="centered"><i class="fa fa-check" ng-show="user.authority == '1'"></i></td>
													<td><a href="#siteUserModal" role="button" data-toggle="modal" ng-click="showSiteUserModal(site, user)" eat-click>Edit</a></td>
												</tr>
												<tr>
													<td colspan="8">
														<a href="#siteUserModal" role="button" class="btn btn-success btn-sm pull-right" data-toggle="modal" ng-click="showSiteUserModal(site)" eat-click><i class="fa fa-plus"></i> Add site user</a>
													</td>
												</tr>
											</tbody>
										</table>
									</div>
								</td>
							</tr>
						</tbody>
					</table>
