<div class="wizdom-fullview pages-i-must-readV1">

	<div class="container-fluid" ng-if="!loading">

		<div class="row">

			<div class="col-xs-12 col-md-6 counter-height">
				<div class="counter-table">
					<div class="counter-contents">
						<div class="counter" ng-if="manualPages && manualPages.length>9">{{manualPages.length}}</div>
						<div class="counter" ng-if="manualPages && manualPages.length<=9">0{{manualPages.length}}</div>
						<div class="counter" ng-if="!manualPages">0</div>
					</div>
				</div>
			</div>

			<div class="col-xs-12 col-md-6 counter-height text-center;">
				<div class="counter-table">
					<div class="documents-to-read-contents counter-contents">
						<div class="documents-to-read">{{"Pages I must read" | translate}}</div>
						<div class="documents-glasses"><i class="ms-Icon ms-Icon--Glasses"></i></div>
					</div>
				</div>
			</div>


		</div>
		<div class="row">
			<!-- list of pages -->
			<div class="col-md-12" ng-if="!manualPages">
				<div class="counter-table-no-height">
					<div class="pages-contents">
						<div class="pages">
							<div class="noPages">{{"You have read all required pages!" | translate}}</div>
						</div>
					</div>
				</div>
			</div>
			<div class="col-md-12" ng-if="manualPages">
				<div class="counter-table">
					<div class="pages-contents">

						<div class="pages" ng-init="currentLimit = 4">
							<div class="row" ng-repeat="page in manualPages | limitTo:currentLimit">
								<div class="col-xs-8 col-md-12 col-lg-8">
									<a href="{{page.path}}">{{page.title}}</a> (v{{page.pageVersion}})
								</div>
								<div class="col-xs-4 col-md-12 col-lg-4 text-right">
									<a href="{{page.path}}">{{page.modifiedDate | date: 'shortDate'}}</a>
								</div>
							</div>
						</div>
						<div class="all-pages"><a href="javascript:void(0);" ng-click="currentLimit = (currentLimit == 4 ? 10 : 4)">{{(currentLimit == 10 ? 'See Less' : 'See More') | translate}} <i class="glyphicon glyphicon-chevron-down"></i></a></div>
					</div>
				</div>
			</div>
		</div>

	</div>
</div>

