<?
//--------------------------------------------------------- 
	session_start();
	include('title.php'); 
//--------------------------------------------------------- 
?>
<div class="row" style="margin:0px;">
    <div class="col-lg-12 center">
        <div class="relative block">
			<div class="f18 bold red center p20">
				<div class="relative iblock f18 bold red" style="width:50%;">
				***NOTICE***
				<br>
				<?php if(!$_SESSION['finished_training_page']) { ?>
				Wait until the video is complete. If you navigate away before the end of the video, you will need to watch the video in it's entirety again. You can click the checkbox at the bottom after the video is over.
				<?php } else { ?>
				Wait until the video is complete. An alert will pop up to indicate that the video has finished. If you navigate away before the alert, you will need to watch the video in it's entirety again.
				<?php } ?>
				</div>
			</div>
            <div id="videoContainer" class="relative block">
                <br>
                <video id="qaVid" src="https://surfcrm.com/training_calls/videos/Discounting Price.mp4" 
					controls
					style="width:50%;" 
					onended="$('#signDocument').parent().show(); $('#must_watch_video_text').remove(); videoEnded('3','<?= (!$_SESSION['finished_training_page']) ? 'new' : 'old';?>');"></video>
                <br>
            </div>
            <div class="center">
                <div class="relative iblock right" style="width:50%;">
                        <center style="font-size:18px;"><?= floor(319/60);?> minutes, <?= 319 % 60;?> seconds</center>
						<button id="vidScreen" type="button" class="btn btn-default bold" style="padding:12px 24px 12px 24px; font-size:18px;"
                            onclick="videoExpand('qaVid')">
                            <i class="fa fa-arrows-alt normal" aria-hidden="true"></i> Fullscreen
                        </button>
                        <button id="vidPlay" type="button" class="btn btn-default bold fleft" style="padding:12px 24px 12px 24px; font-size:18px;"
                            onclick="videoDisplay('qaVid')">
                            <i class="fa fa-play normal" aria-hidden="true"></i> Play Video
                        </button>
                        <button id="vidPause" type="button" class="btn btn-default bold fleft" style="padding:12px 24px 12px 24px; font-size:18px; display:none;"
                            onclick="videoHide('qaVid')">
                            <i class="fa fa-compress normal" aria-hidden="true"></i> Close Video
                        </button>
                </div>
            </div>
			<div class="relative iblock f18 bold red" style="width:50%;">
			</div>
        </div>
    </div>
</div>
<script>
$(document).ready(function(e) {
	var checked = $('#signDocument').val();
	if(checked != 'on')
	{
		$('#signatureBar').hide();
	} else {
		$('#must_watch_video_text').remove();
		$('#signDocument').parent().hide().after('<div id="must_watch_video_text">You must watch the entire video before checking this off.</div>');
	}
});
</script>
<?
$version = '1.0';
include('id.php');
?>