<%@ Master Language="C#" Inherits="System.Web.Mvc.ViewMasterPage<YouGrade.Dtos.ExamDefDto>" %>
<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Data.Entity" %>
<!DOCTYPE html>
<html>
<head runat="server">
<title>
<asp:ContentPlaceHolder ID="TitleContent" runat="server" />
</title>
<link href="<%: Url.Content("~/Content/Site.css") %>" rel="stylesheet" type="text/css" />
<link href="<%: Url.Content("~/Content/jquery-ui-1.8.13.custom.css") %>" rel="stylesheet" type="text/css" />
<link rel="shortcut icon" href=""<%: Url.Content("~/Content/Images/YouGrade.PNG") %>" type="image/x-icon" />
<script src="<%: Url.Content("~/Scripts/jquery-1.5.1.min.js") %>" type="text/javascript"></script>
<script src="<%: Url.Content("~/Scripts/modernizr-1.7.min.js") %>" type="text/javascript"></script>
<script src="<%: Url.Content("~/Scripts/jquery-ui-1.8.13.custom.min.js") %>" type="text/javascript"></script>
<script type="text/javascript" src="<%: Url.Content("~/Scripts/swfobject.js") %>"></script>
<script type="text/javascript">
var question;
// The video to load.
var videoID = "iapcKVn7DdY"
http: //www.youtube.com/watch?v=
// Lets Flash from another domain call JavaScript
var params = { allowScriptAccess: "always", wmode: "transparent" };
// The element id of the Flash embed
var atts = { id: "ytPlayer" };
// All of the magic handled by SWFObject (http://code.google.com/p/swfobject/)
swfobject.embedSWF("http://www.youtube.com/v/" + videoID + "&enablejsapi=1&playerapiid=ytPlayer&wmode=opaque",
"videoDiv", "480", "295", "8", null, null, params, atts);
var ytplayer;
$(window).load(function () {
// Dialog
$('#endExamDialog').dialog({
autoOpen: false,
modal: true,
width: 600,
buttons: {
"Ok": function () {
$(this).dialog("close");
}
}
});
$('.button').hover(
function () {
$(this).removeClass('ui-state-default');
$(this).addClass('ui-state-hover');
},
function () {
$(this).addClass('ui-state-default');
$(this).removeClass('ui-state-hover');
});
});
function onYouTubePlayerReady(playerId) {
ytplayer = document.getElementById(playerId);
getQuestion();
}
function play() {
renderQuestion(question);
}
function getQuestion() {
$.ajax({
url: '/Home/GetQuestion',
type: 'GET',
cache: false,
dataType: 'json',
error: function (jqXHR, textStatus, errorThrown) {
alert(errorThrown);
},
success: function (json) {
question = json;
renderQuestion(json);
}
});
}
function moveToPreviousQuestion() {
saveAnswer();
$.ajax({
url: '/Home/MoveToPreviousQuestion',
type: 'GET',
cache: false,
dataType: 'json',
error: function (jqXHR, textStatus, errorThrown) {
alert(errorThrown);
},
success: function (json) {
renderQuestion(json);
}
});
}
function moveToNextQuestion() {
saveAnswer();
$.ajax({
url: '/Home/MoveToNextQuestion',
type: 'GET',
cache: false,
dataType: 'json',
error: function (jqXHR, textStatus, errorThrown) {
alert(errorThrown);
},
success: function (json) {
renderQuestion(json);
}
});
}
function saveAnswer(afterSaveAnswer) {
var answers = '';
$.each($('.alternatives > input'), function (key, value) {
if ($(this).attr('value') == 'on') {
answers = answers + String.fromCharCode(65 + key);
}
});
$.ajax({
url: '/Home/SaveAnswer',
type: 'POST',
cache: false,
dataType: 'json',
data: ({
questionId: question.Id,
answers: answers
}),
error: function (jqXHR, textStatus, errorThrown) {
alert(errorThrown);
},
success: function (json) {
// renderQuestion(json);
if (afterSaveAnswer != null) {
afterSaveAnswer();
}
}
});
}
function endExam() {
saveAnswer(function () {
$('#endExamDialog').dialog('open');
$.ajax({
url: '/Home/EndExam',
type: 'GET',
cache: false,
dataType: 'json',
data: ({}),
error: function (jqXHR, textStatus, errorThrown) {
alert(errorThrown);
},
success: function (json) {
$("#progressbar").progressbar({
value: json.result
});
$('#yourResult').html(json.result);
}
});
});
}
function renderQuestion(q) {
question = q;
ytplayer.stopVideo();
ytplayer.loadVideoById(q.Url, q.StartSeconds);
ytplayer.playVideo();
$('.questionTitle').html('Question ' + q.Id);
$('.questionText').html(q.Text);
$('.alternatives').html('');
for (var i = 0; i < q.Alternatives.length; i++) {
var checked = q.Alternatives[i].IsChecked ? 'checked="true"' : '';
var type = q.IsMultiSelect ? 'checkbox' : 'radio';
$('.alternatives').append('<input id="alt' + q.Alternatives[i].Id + '" name="alternatives" type="' + type + '" ' + checked + ' />' + q.Alternatives[i].Id + '. ' + q.Alternatives[i].Text + '<br />');
}
}
</script>
</head>
<body>
<div class="page">
<header>
<div id="title">
<h1>
<img src="../../Content/Images/YouGrade.PNG" width="120" />
<div class="examTitle"><%=ViewData.Model.Name %></div></h1>
</div>
<div id="logindisplay">
<%--<% Html.RenderPartial("LogOnUserControl"); %>--%>
</div>
<nav>
<ul id="menu">
<li><%: Html.ActionLink("Home", "Index", "Home")%></li>
<%--<li><%: Html.ActionLink("About", "About", "Home")%></li>--%>
</ul>
</nav>
</header>
<section id="main">
<!-- ui-dialog -->
<div id="endExamDialog" title="<%=ViewData.Model.Name %> - Results" style="z-index:1000;">
<p>Your Result: <span id="yourResult"></span></p>
<div id="progressbar"></div>
</div>
<asp:ContentPlaceHolder ID="MainContent" runat="server" />
<footer>
</footer>
</section>
</div>
</body>
</html>
Submit an article or tip