<ng-include src="'/intranet/quiz/html/includes/infoboxes/preview_mode.html'"></ng-include>

<div class="row row-fluid">
	<div class="col-md-4 my-3 my-md-0" ng-hide="!content.quiz.image_url">
		<img class="img-fluid" ng-src="{{ content.quiz.image_url }}" />
	</div>

	<div ng-class="!content.quiz.image_url ? 'col-md-8' : 'col-md-8'">
		<div class="float-right">
			<cla-share canonical_url="{{canonicalUrl}}"></cla-share>

			<div class="btn-group">
			<a href="/quiz/{{ content.quiz.id }}/review" name="link_edit" class="btn btn-secondary js-link-edit" ng-if="content.permissions.can_manage">
				<ion-icon name="create-outline"></ion-icon>
			</a>
			<a href="/quiz/statistics/{{ content.quiz.id }}" name="link_stats" class="btn btn-secondary" ng-if="content.permissions.can_view_statistics">
				<ion-icon name="stats-chart-outline"></ion-icon>
			</a>
			</div>
		</div>
		<h4 class="quiz-title">
			<span ng-bind="content.quiz.title">[Title]</span>
			<span ng-if="content.permissions.can_view_status">
				<span name="status_draft" class="small badge badge-pill badge-warning" ng-if="content.quiz.is_draft" lmsg="quiz.status.draft">[draft]</span>
				<span name="status_live" class="small badge badge-pill badge-success" ng-if="content.quiz.is_live" lmsg="quiz.status.live">[live]</span>
				<span name="status_archived" class="small badge badge-pill badge-info" ng-if="content.quiz.is_archived" lmsg="quiz.status.archived">[archived]</span>
			</span>
		</h4>
		<p name="intro-description" ng-bind-html="content.quiz.description">
			[Description]
		</p>
		<p><strong lmsg="quiz.info.author">[Author]</strong>:
			<a target="_blank" href="{{ content.quiz.created_by.url }}?from_list=true" ng-bind="content.quiz.created_by.name">[Username]</a>
		</p>

		<p><strong lmsg="quiz.info.questions">[Questions]</strong>: <span ng-bind="content.question_count">[0]</span></p>
		<p><strong lmsg="quiz.info.maxscore">[Maximum Score]</strong>: <span ng-bind="content.max_score">[0]</span></p>
		<p><strong lmsg="quiz.info.passmark">[Pass Mark]</strong>: <span ng-bind="content.pass_mark">[0]</span></p>
		<p><strong lmsg="quiz.info.attempts_left">[Attempts Left]</strong>: <span ng-bind="content.attempts_left">[0]</span></p>

		<!-- <p name="intro-description" ng-bind-html="content.quiz.description" ng-hide="!!content.attempt && content.attempt.attempt > 1">
			[description]
		</p> -->
		<div ng-if="preview && content.permissions.can_preview">
			<a href="#/start" class="btn btn-primary btn-intro" lmsg="quiz.button.preview">[Preview Quiz]</a>
		</div>

		<div ng-if="content.permissions.can_attempt">
			<a href="#/start" class="btn btn-success btn-intro" lmsg="quiz.button.start" ng-show="(!content.attempt || content.attempt.completed_date)" ng-if="!cannotRetake()">[Start Quiz]</a>
			<a href="#/continue" class="btn btn-primary btn-intro" lmsg="quiz.button.continue" ng-show="isContinue()">[Continue Quiz]</a>
			<!--<p name="" visible="1">You have <txt name="attempts-counter">[0]</txt> questions to go!</p>-->
		</div>

		<ng-include src="'/intranet/quiz/html/includes/infoboxes/cannot_retake.html'"></ng-include>
	</div>
</div>

<div class="row row-fluid">
	<div class="col-md-12">
		<txt name="previous_attempts" ng-show="content.attempts_count > 0">
			<button data-toggle="collapse" class="btn btn-link mb-2" data-target="#previous_attempts">
				<ion-icon name="time-outline"></ion-icon>
			 	<txt lmsg="quiz.info.previous_attempts">[previous attempts]</txt>
		 </button>
			<div id="previous_attempts" class="collapse">
				<div class="tab-pane" role="tabpanel" id="attempts">
					<div class="row">
						<div class="col-md-12">
							<!-- ng-include, php endpoint to render cla component -->
							<ng-include src="attemptsTemplate()"></ng-include>
						</div>
					</div>
				</div>
			</div>
		</txt>
	</div>
</div>
