<div ng-controller="ContactsCtrl" class="contacts-view">
	<div class="row split-view">
		<div class="col-sm-6" ng-if="contacts" id="contacts-list">
			<div infinite-scroll='contacts.nextPage()' infinite-scroll-disabled='contacts.busy' infinite-scroll-distance='20' infinite-scroll-box="contacts-list">
				<div class="contact" ng-repeat="c in contacts.items" ng-class="{'unsubscribed': !c.Subscribed}">
					<span class="name">{{c.First_Name}} {{c.Last_Name}} {{c.Recipient_Name}}</span>
					<span class="email">&lt;{{c.Email}}&gt;</span>
					<span class="subscribed-date">{{c.Subscribe_Date | date:'MM/dd/yyyy @ h:mm a'}}</span>
					<span ng-show="!c.Subscribed" class="label label-default unsubscribed">unsubscrubed</span>
					<span ng-show="c.Fields" class="fields">
						<table>
							<tr ng-repeat="(key, val) in c.Fields">
								<td>{{key}}</td>
								<td>{{val}}</td>
							</tr>
						</table>
					</span>
				</div>				
			</div>
		</div>
		<div class="col-sm-6 exclusion-list-pane" id="exclusion-list-container" ng-class="{'show': showExclusionList}">
			<div class="title">
				<h4>Exclusion list</h4>	
			</div>			
			<div id="exclusion-list">
				<ul ng-if="contactsExcList" class="list-unstyled" infinite-scroll='contactsExcList.nextPage()' infinite-scroll-disabled='contactsExcList.busy' infinite-scroll-distance='20' infinite-scroll-box="exclusion-list">
					<li ng-repeat="e in contactsExcList.items">{{e.Email}}</li>
				</ul>				
			</div>
		</div>
	</div>
</div>		
