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

<div class="row row-fluid">

	<div class="col-md-4 mb-10" ng-hide="!content.poll.image_url">
		<img class="img-fluid" ng-src="{{ content.poll.image_url }}" />
	</div>

	<div ng-class="!content.poll.image_url ? 'col-md-8' : 'col-md-8'">
		<div class="row">
			<div class="col-sm-8">
		<h3 class="text-break mb-0 mt-0">

			<!-- Poll title -->
			<span class="va-middle" ng-bind-html="poll_title">[Title]</span>

			<!-- Poll ending date -->
			<cla-badge styleclass="badge badge-warning" ng-show="showEndDate()"> {{end_date_lmsg}}</cla-badge>

			<!-- Poll ended -->
			<cla-badge styleclass="badge badge-secondary" ng-if="hasEnded()" lmsg="quiz.status.ended">Ended</cla-badge>

			<!-- Poll in draft mode -->
			<cla-badge name="status_draft" styleclass="badge badge-warning" ng-if="content.poll.is_draft" lmsg="quiz.status.draft">[Draft]</cla-badge>

			<!-- Poll is archived -->
			<cla-badge name="status_archived" styleclass="badge badge-secondary" ng-if="content.poll.is_archived" lmsg="quiz.status.archived">[Archived]</cla-badge>


		</h3>
		</div>
		<div class="col-sm-4 title-buttons text-left text-sm-right mt-2 mt-sm-0">
			<cla-share canonical_url="{{canonicalUrl}}"></cla-share>

			<div class="btn-group">
			<a href="/polls-surveys/poll/{{ content.poll.id }}/edit" name="link_edit" class="btn btn-secondary js-link-edit" ng-if="content.permissions.can_manage" rel="tooltip" data-original-title="{{ edit_poll_lmsg}}">
				<ion-icon name="create-outline"></ion-icon>
			</a>
			<a href="/polls-surveys/poll/results/{{ content.poll.id }}" name="link_stats" class="btn btn-secondary" ng-if="content.permissions.can_view_statistics" rel="tooltip" data-original-title="{{view_results_lmsg}}">
				<ion-icon name="stats-chart-outline"></ion-icon>
			</a>
			</div>
		</div>
		</div>
		<!-- Poll description -->
		<p class="mt-5" name="intro-description" ng-bind-html="content.poll.description">
			[Description]
		</p>
		<!-- author -->
		<p><strong lmsg="quiz.info.author">[Author]</strong>:
			<a target="_blank" href="{{ content.poll.created_by.url }}?from_list=true" ng-bind="content.poll.created_by.name">[Username]</a>
		</p>
<!-- begin poll wrapper-->
		<div id="poll-wrapper" ng-if="show_wrapper">

			<div ng-if="content.poll.anonymous">
				<h5>
					<ion-icon class="mr-1 align-middle" name="eye-off-outline"></ion-icon>
					<loc lmsg="quiz.poll.info.anonymous">You're answering this poll anonymously</loc>
				</h5>
			</div>
			<!-- CLA PICKER  -->

			<div ng-if="!isIE">
				<cla-picker-group multiselectable="false">
					<cla-item ng-if="question.type === 0" orientate="vertical" ng-repeat="optionId in optionIndexes[question.id] track by $index">
						<clang-label hidden="true"><span ng-bind="question.options[optionId].text"></span></clang-label>

						<clang-picker size="large" block="block" name="{{question.options[optionId].id}}" id="{{question.options[optionId].id}}" value="{{question.options[optionId].id}}" ng-checked="isOptionSelected(question.options[optionId].id)"
						ng-click="toggleOption(question.options[optionId].id)" ng-disabled="submit_disabled"></clang-picker>
					</cla-item>
				</cla-picker-group>
			</div>

			<!-- IS IE OR EDGE -->
			<div ng-if="question.type === 0 && isIE" ng-repeat="optionId in optionIndexes[question.id] track by $index" class="radio">
				<label>
					<input type="radio" name="question-{{question.id}}" id="{{question.options[optionId].id}}" value="{{question.options[optionId].id}}" ng-checked="isOptionSelected(question.options[optionId].id)" ng-click="toggleOption(question.options[optionId].id)"/>
					<span ng-bind="question.options[optionId].text"></span>
				</label>
			</div>



			<div ng-if="preview && content.permissions.can_preview">
				<a href="javascript:void(0)" class="btn btn-primary btn-intro-poll" lmsg="quiz.button.submit" ng-click="finish();">Submit</a>
			</div>

			<!-- submit button -->
			<div ng-if="content.permissions.can_attempt">
				<a href="javascript:void(0)"  class="btn btn-primary btn-intro-poll" lmsg="quiz:button:submit"  ng-if="showSubmit()" ng-click="finish();"  ng-disabled="outstandingRequests > 0"><loc lmsg="quiz.button.submit">[Submit]</loc></a>
			</div>

		</div>
<!--end poll wrapper-->

		<!-- Poll finish -->
		<div id="poll-finish" ng-if="showFinish()">
			<h4 id="completion_msg" ng-bind-html="completion">[Thanks for your vote!]</h4>
		</div>

		<!-- Poll already voted -->
		<div id="poll-voted" ng-if="showAlreadyVoted()">
				<h4 lmsg="quiz.poll.already_voted">You've already voted</h4>
		</div>

		<!-- Poll results -->
		<div id="poll-results" ng-if="showResults()">

			<div ng-show="viewResults == 1">
				<loc lmsg="quiz.polls-surveys.polls.end_results">Results will be revealed when the voting ends</loc>
			</div>

			<div ng-show="viewResults == 2 || can_manage">
				<hr>
				<ng-include src="'/intranet/quiz/html/includes/poll_results.html'"></ng-include>
			</div>

		</div>



		<!-- Poll vote again button -->
		<div ng-if="vote_again">
			<a href="" class="btn btn-primary btn-intro-poll" lmsg="quiz.button.vote_again"  ng-click="voteAgain()"><txt lmsg="quiz.poll.again">Vote Again</txt></a>
		</div>

	</div>
</div>

<!--<pre>{{content | json}}</pre>-->
