From 0623eae79fef8f09cd1b5e16c3bde9b974afb7b8 Mon Sep 17 00:00:00 2001 From: Frank Ronny Larsen Date: Tue, 8 Jan 2013 08:14:47 +0100 Subject: [PATCH 01/54] Initial empty files --- content.json | 0 js/questionset.js | 0 library.json | 0 schema.json | 0 views/questionset.ejs | 0 5 files changed, 0 insertions(+), 0 deletions(-) create mode 100644 content.json create mode 100644 js/questionset.js create mode 100644 library.json create mode 100644 schema.json create mode 100644 views/questionset.ejs diff --git a/content.json b/content.json new file mode 100644 index 0000000..e69de29 diff --git a/js/questionset.js b/js/questionset.js new file mode 100644 index 0000000..e69de29 diff --git a/library.json b/library.json new file mode 100644 index 0000000..e69de29 diff --git a/schema.json b/schema.json new file mode 100644 index 0000000..e69de29 diff --git a/views/questionset.ejs b/views/questionset.ejs new file mode 100644 index 0000000..e69de29 From ae4040f27a4649c5a6b33bc38417b939a389558e Mon Sep 17 00:00:00 2001 From: Frank Ronny Larsen Date: Tue, 8 Jan 2013 13:04:15 +0100 Subject: [PATCH 02/54] First working version of QuestionSet --- js/questionset.js | 136 ++++++++++++++++++++++++++++++++++++++++++ schema.json | 35 +++++++++++ views/questionset.ejs | 25 ++++++++ 3 files changed, 196 insertions(+) diff --git a/js/questionset.js b/js/questionset.js index e69de29..93e7d0b 100644 --- a/js/questionset.js +++ b/js/questionset.js @@ -0,0 +1,136 @@ +// Will render a Question with multiple choices for answers. + +// Options format: +// { +// title: "Optional title for question box", +// question: "Question text", +// answers: [{text: "Answer text", correct: false}, ...], +// singleAnswer: true, // or false, will change rendered output slightly. +// } +window.H5P = window.H5P || {}; + +H5P.QuestionSet = function (options) { + if ( !(this instanceof H5P.QuestionSet) ) + return new H5P.QuestionSet(options); + + var texttemplate = '' + +'
' + +'

<%= title %>

' + +' <% for (var i=0; i' + +'
' + +'

<%= questions[i].machineName %>

' + +'
' + +' <% } %>' + +'
' + +'
' + +' <% if (progressType == "dots") { %>' + +' <% for (var i=0; i' + +' o' + +' <%} %>' + +' <% } else if (progressType == "textual") { %>' + +' ' + +' of' + +' <%= questions.length %>' + +' questions' + +' <% } %>' + +'
' + +' ' + +' ' + +' ' + +'
' + +'
' + + ''; + + var defaults = { + title: "", + randomOrder: false, + initialQuestion: 0, + progressType: 'textual', + questions: [] + }; + + var template = new EJS({text: texttemplate}); + var params = jQuery.extend({}, defaults, options); + + var currentQuestion = -1; + var questionInstances = new Array(); + var allQuestionsAnswered = false; + var myDom; + + if (params.randomOrder) { + // TODO: Randomize order of questions + console.log("TODO: Randomize order of questions"); + } + + var _showQuestion = function (questionNumber) { + // Sanitize input. + if (questionNumber < 0) { questionNumber = 0; } + if (questionNumber >= params.questions.length) { questionNumber = params.questions.length - 1; } + + $('.prev.button', myDom).attr({'disabled': (questionNumber === 0)}); + $('.next.button', myDom).attr({'disabled': (questionNumber == params.questions.length-1)}); + + // Hide all questions + $('.question', myDom).hide(); + + // Reshow the requested question + $('#q-' + questionNumber, myDom).show(); + + // Update progress indicator + // Test if current has been answered. + if (params.progressType == 'textual') { + $('.progress-current', myDom).text("" + (questionNumber+1)); + } else { + $('.progress-dot.current', myDom).removeClass('current'); + // Set answered/unanswered for current. + $('#qdot-' + questionNumber, myDom).addClass('current'); + } + + // Remember where we are + currentQuestion = questionNumber; + return currentQuestion; + }; + + // Function for attaching the multichoice to a DOM element. + var attach = function (targetId) { + // Render own DOM into target. + template.update(targetId, params); + myDom = jQuery('#' + targetId); + + // Attach questions + for (var i=0; i= 0; i--) { + score += questionInstances[i].getScore(); + } + return score; + }; + + return { + attach: attach, // Attach to DOM object + getQuestions: function () {return questionInstances;}, + getScore: getScore, + defaults: defaults // Provide defaults for inspection + }; +}; diff --git a/schema.json b/schema.json index e69de29..63026ba 100644 --- a/schema.json +++ b/schema.json @@ -0,0 +1,35 @@ +{ + "title": { + "name": "Title", + "description": "Question set title (optional)", + "type": "text", + "default": "" + }, + "randomOrder": { + "name": "Randomize order", + "description": "Whether questions should be shown in random order", + "type": "boolean", + "default": false + }, + "initialQuestion": { + "name": "Initial question", + "description": "Which question to start with. Count from 0", + "type": "integer", + "default": 0 + }, + "progressType": { + "name": "Progress indicator", + "description": "Question set progress indicator style", + "type": "select", + "values": [{"text": "Textual", "value": "textual"}, {"text": "Dots", "value": "dots"}], + "default": "textual" + }, + "questions": { + "name": "Questions", + "description": "List of questions in this set.", + "type": "h5p-library", + "array": true, + "minEntries": 1, + "maxEntries": -1 + } +} diff --git a/views/questionset.ejs b/views/questionset.ejs index e69de29..a9c19b4 100644 --- a/views/questionset.ejs +++ b/views/questionset.ejs @@ -0,0 +1,25 @@ +
+

<%= title %>

+ <% for (var i=0; i +
+

<%= questions[i].machineName %>

+
+ <% } %> +
+
+ <% if (progressType == "dots") { %> + <% for (var i=0; i + o + <%} %> + <% } else if (progressType == "textual") { %> + + of + <%= questions.length %> + questions + <% } %> +
+ + + +
+
From 37a7d54fbf851cad4219fdab9c6d228bbf8bfc32 Mon Sep 17 00:00:00 2001 From: Frank Ronny Larsen Date: Tue, 8 Jan 2013 16:16:19 +0100 Subject: [PATCH 03/54] Multiple changes Don't use H* in templates. Stick to DIVs and SPANs. (so as not to get any styling) Translatable strings. (options.texts.*) --- js/questionset.js | 26 +++++++++++++++----------- schema.json | 1 + views/questionset.ejs | 15 ++++++--------- 3 files changed, 22 insertions(+), 20 deletions(-) diff --git a/js/questionset.js b/js/questionset.js index 93e7d0b..e354141 100644 --- a/js/questionset.js +++ b/js/questionset.js @@ -15,10 +15,10 @@ H5P.QuestionSet = function (options) { var texttemplate = '' + '
' + -'

<%= title %>

' + +'
<%= title %>
' + ' <% for (var i=0; i' + '
' + -'

<%= questions[i].machineName %>

' + +'
<%= questions[i].machineName %>
' + '
' + ' <% } %>' + '
' + @@ -28,15 +28,12 @@ H5P.QuestionSet = function (options) { ' o' + ' <%} %>' + ' <% } else if (progressType == "textual") { %>' + -' ' + -' of' + -' <%= questions.length %>' + -' questions' + +' ' + ' <% } %>' + '
' + -' ' + -' ' + -' ' + +' ' + +' ' + +' ' + '
' + '' + ''; @@ -46,7 +43,13 @@ H5P.QuestionSet = function (options) { randomOrder: false, initialQuestion: 0, progressType: 'textual', - questions: [] + questions: [], + texts: { + prevButton: "Previous", + nextButton: "Next", + finishButton: "Finish", + textualProgress: "Question: @current of @total questions" + } }; var template = new EJS({text: texttemplate}); @@ -79,7 +82,8 @@ H5P.QuestionSet = function (options) { // Update progress indicator // Test if current has been answered. if (params.progressType == 'textual') { - $('.progress-current', myDom).text("" + (questionNumber+1)); + $('.progress-text', myDom).text(params.texts.textualProgress.replace("@current", questionNumber+1).replace("@total", params.questions.length)); + // $('.progress-current', myDom).text("" + (questionNumber+1)); } else { $('.progress-dot.current', myDom).removeClass('current'); // Set answered/unanswered for current. diff --git a/schema.json b/schema.json index 63026ba..d76e117 100644 --- a/schema.json +++ b/schema.json @@ -28,6 +28,7 @@ "name": "Questions", "description": "List of questions in this set.", "type": "h5p-library", + "validLibs": ["H5P.MultiChoice"], "array": true, "minEntries": 1, "maxEntries": -1 diff --git a/views/questionset.ejs b/views/questionset.ejs index a9c19b4..8a1dee1 100644 --- a/views/questionset.ejs +++ b/views/questionset.ejs @@ -1,8 +1,8 @@
-

<%= title %>

+
<%= title %>
<% for (var i=0; i
-

<%= questions[i].machineName %>

+
<%= questions[i].machineName %>
<% } %>
@@ -12,14 +12,11 @@ o <%} %> <% } else if (progressType == "textual") { %> - - of - <%= questions.length %> - questions + <% } %>
- - - + + +
From c57e0d5921e225978773775d5be2e7a3389df43b Mon Sep 17 00:00:00 2001 From: Frank Ronny Larsen Date: Wed, 9 Jan 2013 16:26:52 +0100 Subject: [PATCH 04/54] Better dots for progress, still not perfect.. --- js/questionset.js | 57 +++++++++++++++++++++++++++++++++++++------ schema.json | 7 +++++- views/questionset.ejs | 30 ++++++++++++++++++++--- 3 files changed, 81 insertions(+), 13 deletions(-) diff --git a/js/questionset.js b/js/questionset.js index e354141..9a482de 100644 --- a/js/questionset.js +++ b/js/questionset.js @@ -14,19 +14,41 @@ H5P.QuestionSet = function (options) { return new H5P.QuestionSet(options); var texttemplate = '' + +'' + '
' + '
<%= title %>
' + ' <% for (var i=0; i' + -'
' + +'
' + '
<%= questions[i].machineName %>
' + '
' + ' <% } %>' + '
' + '
' + ' <% if (progressType == "dots") { %>' + -' <% for (var i=0; i' + -' o' + -' <%} %>' + +'
' + +' <% for (var i=0; i' + +' ' + +' <%} %>' + +'
' + ' <% } else if (progressType == "textual") { %>' + ' ' + ' <% } %>' + @@ -55,7 +77,7 @@ H5P.QuestionSet = function (options) { var template = new EJS({text: texttemplate}); var params = jQuery.extend({}, defaults, options); - var currentQuestion = -1; + var currentQuestion = 0; var questionInstances = new Array(); var allQuestionsAnswered = false; var myDom; @@ -65,6 +87,14 @@ H5P.QuestionSet = function (options) { console.log("TODO: Randomize order of questions"); } + var _allQuestionsAnswered = function () { + var answered = true; + for (var i = questionInstances.length - 1; i >= 0; i--) { + answered = answered && (questionInstances[i]).getAnswerGiven(); + } + return answered; + }; + var _showQuestion = function (questionNumber) { // Sanitize input. if (questionNumber < 0) { questionNumber = 0; } @@ -72,9 +102,10 @@ H5P.QuestionSet = function (options) { $('.prev.button', myDom).attr({'disabled': (questionNumber === 0)}); $('.next.button', myDom).attr({'disabled': (questionNumber == params.questions.length-1)}); + $('.finish.button', myDom).attr({'disabled': !(_allQuestionsAnswered())}); // Hide all questions - $('.question', myDom).hide(); + $('.question-container', myDom).hide(); // Reshow the requested question $('#q-' + questionNumber, myDom).show(); @@ -88,6 +119,9 @@ H5P.QuestionSet = function (options) { $('.progress-dot.current', myDom).removeClass('current'); // Set answered/unanswered for current. $('#qdot-' + questionNumber, myDom).addClass('current'); + if (questionInstances[currentQuestion].getAnswerGiven()) { + $('#qdot-' + currentQuestion, myDom).removeClass('unanswered').addClass('answered'); + } } // Remember where we are @@ -110,12 +144,19 @@ H5P.QuestionSet = function (options) { } // Set event listeners. - $('.next.button', myDom).click(function() { + $('.next.button', myDom).click(function (ev) { _showQuestion(currentQuestion + 1); }); - $('.prev.button', myDom).click(function() { + $('.prev.button', myDom).click(function (ev) { _showQuestion(currentQuestion - 1); }); + $('.finish.button', myDom).click(function (ev) { + // get total score. + // Display result page. + // Display animation if present. + // Remove DOM. (delete container) + myDom.remove(); + }); // Hide all but initial Question. _showQuestion(params.initialQuestion); diff --git a/schema.json b/schema.json index d76e117..9e5654f 100644 --- a/schema.json +++ b/schema.json @@ -17,13 +17,18 @@ "type": "integer", "default": 0 }, + "backgroundImage": { + "name": "Background image", + "description": "An optional background image for the Question set.", + "type": "image" + }, "progressType": { "name": "Progress indicator", "description": "Question set progress indicator style", "type": "select", "values": [{"text": "Textual", "value": "textual"}, {"text": "Dots", "value": "dots"}], "default": "textual" - }, + }, "questions": { "name": "Questions", "description": "List of questions in this set.", diff --git a/views/questionset.ejs b/views/questionset.ejs index 8a1dee1..1d05cdd 100644 --- a/views/questionset.ejs +++ b/views/questionset.ejs @@ -1,16 +1,38 @@ +
<%= title %>
<% for (var i=0; i -
+
<%= questions[i].machineName %>
<% } %>
<% if (progressType == "dots") { %> - <% for (var i=0; i - o - <%} %> +
+ <% for (var i=0; i + + <%} %> +
<% } else if (progressType == "textual") { %> <% } %> From b4d4944e125ecf70f1fc317e5cad8ec8720aef1e Mon Sep 17 00:00:00 2001 From: Frank Ronny Larsen Date: Sun, 13 Jan 2013 09:43:55 +0100 Subject: [PATCH 05/54] Several changes: Added h5pQuestionsetFinished event trigger Use H5P.jQuery Added result page. Initial code for endGame (results, animations) Revised code for showing current question. Added passPercentage option (default 50) Intro page and endGame in schema. (Only endGame has been implemented in code yet) --- js/questionset.js | 136 +++++++++++++++++++++++++++++----- schema.json | 131 +++++++++++++++++++++++++++++++- views/questionset-intro.ejs | 5 ++ views/questionset-results.ejs | 6 ++ 4 files changed, 256 insertions(+), 22 deletions(-) create mode 100644 views/questionset-intro.ejs create mode 100644 views/questionset-results.ejs diff --git a/js/questionset.js b/js/questionset.js index 9a482de..59d7feb 100644 --- a/js/questionset.js +++ b/js/questionset.js @@ -7,12 +7,17 @@ // answers: [{text: "Answer text", correct: false}, ...], // singleAnswer: true, // or false, will change rendered output slightly. // } +// +// Events provided: +// - h5pQuestionSetFinished: Triggered when a question is finished. (User presses Finish-button) window.H5P = window.H5P || {}; H5P.QuestionSet = function (options) { if ( !(this instanceof H5P.QuestionSet) ) return new H5P.QuestionSet(options); + var $ = H5P.jQuery; + var texttemplate = '' + '' + '
' + +' <% if (introPage.showIntroPage) { %>' + +'
' + +'
<%= introPage.title %>
' + +'
<%= introPage.introduction %>
' + +'
' + +'
' + +' <%} %>' + '
<%= title %>
' + ' <% for (var i=0; i' + '
' + @@ -200,6 +216,10 @@ H5P.QuestionSet = function (options) { } } + $('#qs-startbutton').click(function (ev) { + $(this).parents('.intro-page').hide(); + }); + // Set event listeners. $('.progress-dot', $myDom).click(function (ev) { var idx = parseInt($(this).attr('id').split('-')[1]); diff --git a/views/questionset-intro.ejs b/views/questionset-intro.ejs index 8285586..cc18bb6 100644 --- a/views/questionset-intro.ejs +++ b/views/questionset-intro.ejs @@ -1,5 +1,5 @@
<%= title %>
<%= introduction %>
-
+
\ No newline at end of file diff --git a/views/questionset.ejs b/views/questionset.ejs index 1d05cdd..574132b 100644 --- a/views/questionset.ejs +++ b/views/questionset.ejs @@ -17,8 +17,24 @@ .progress-dot.current { box-shadow: 0px 0px 6px firebrick; } +.intro-page { + background: white; + position: absolute; + z-index: 20; + height: 100%; + width: 100%; + left: 0px; + top: 0px; +}
+ <% if (introPage.showIntroPage) { %> +
+
<%= introPage.title %>
+
<%= introPage.introduction %>
+
+
+ <%} %>
<%= title %>
<% for (var i=0; i
From cb58c835e3acee9b573f74dd3a46f9ea415b57a5 Mon Sep 17 00:00:00 2001 From: Svein-Tore Griff With Date: Tue, 22 Jan 2013 21:59:14 +0100 Subject: [PATCH 12/54] Add changes from h5p.git example_content --- content.json | 0 css/questionset.css | 32 ++++++++++++++++++++++++++ js/questionset.js | 53 +++++++++++++------------------------------ library.json | 17 ++++++++++++++ views/questionset.ejs | 29 ----------------------- 5 files changed, 65 insertions(+), 66 deletions(-) delete mode 100644 content.json create mode 100644 css/questionset.css diff --git a/content.json b/content.json deleted file mode 100644 index e69de29..0000000 diff --git a/css/questionset.css b/css/questionset.css new file mode 100644 index 0000000..26c5a3a --- /dev/null +++ b/css/questionset.css @@ -0,0 +1,32 @@ +.dots-container { + text-align: center; +} +.progress-dot { + display: inline-block; + width: 10px; + height: 10px; + border-radius: 50%; +} +.progress-dot.unanswered { + background: darkred; +} +.progress-dot.answered { + background: darkgreen; +} +.progress-dot.current { + box-shadow: 0px 0px 6px firebrick; +} +.intro-page { + background-color: rgba(255,255,255,0.9); + padding: 10px; + position: absolute; + z-index: 20; + height: 100%; + width: 100%; + left: 0px; + top: 0px; +} +.questionset-results { + background-color: rgba(255, 255, 255, 0.75); + padding: 10px; +} diff --git a/js/questionset.js b/js/questionset.js index ca85d98..c9ebdc9 100644 --- a/js/questionset.js +++ b/js/questionset.js @@ -12,42 +12,14 @@ // - h5pQuestionSetFinished: Triggered when a question is finished. (User presses Finish-button) window.H5P = window.H5P || {}; -H5P.QuestionSet = function (options) { +H5P.QuestionSet = function (options, contentId) { if ( !(this instanceof H5P.QuestionSet) ) - return new H5P.QuestionSet(options); + return new H5P.QuestionSet(options, contentId); var $ = H5P.jQuery; + var cp = H5P.getContentPath(contentId); var texttemplate = '' + -'' + '
' + ' <% if (introPage.showIntroPage) { %>' + '
' + @@ -153,7 +125,7 @@ H5P.QuestionSet = function (options) { for (var i=0; i -.dots-container { - text-align: center; -} -.progress-dot { - display: inline-block; - width: 10px; - height: 10px; - border-radius: 50%; -} -.progress-dot.unanswered { - background: darkred; -} -.progress-dot.answered { - background: darkgreen; -} -.progress-dot.current { - box-shadow: 0px 0px 6px firebrick; -} -.intro-page { - background: white; - position: absolute; - z-index: 20; - height: 100%; - width: 100%; - left: 0px; - top: 0px; -} -
<% if (introPage.showIntroPage) { %>
From 55e3af8dd17636756076f870caa227317fa48cce Mon Sep 17 00:00:00 2001 From: Frank Ronny Larsen Date: Wed, 23 Jan 2013 21:39:14 +0100 Subject: [PATCH 13/54] BUGFIX: Missing commas and colons in schema.json --- schema.json | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/schema.json b/schema.json index 790af6a..fb3dc03 100644 --- a/schema.json +++ b/schema.json @@ -72,7 +72,7 @@ }, "texts": { "label": "Interface texts in quiz", - "type": "combined" + "type": "combined", "fields": { "prevButton": { "label": "Back button", @@ -100,7 +100,7 @@ "endGame": { "label": "End game data", "type": "combined", - "fields" { + "fields": { "showResultPage": { "label": "Show result page", "type": "boolean", @@ -140,13 +140,13 @@ }, "animations": { "label": "Animations", - "type": "combined" + "type": "combined", "fields": { "showAnimations": { "label": "Show animations", "type": "boolean", "default": false - } + }, "successResultAnimation": { "label": "Result animation for success", "description": "Add animation for successful completion of the quiz", From 393379884bf0af28402d7c086b601c09e5b3a416 Mon Sep 17 00:00:00 2001 From: Frank Ronny Larsen Date: Wed, 23 Jan 2013 23:05:22 +0100 Subject: [PATCH 14/54] Added video playback on QuestionSet finish --- js/questionset.js | 29 +++++++++++++++++++++++++---- 1 file changed, 25 insertions(+), 4 deletions(-) diff --git a/js/questionset.js b/js/questionset.js index c9ebdc9..88e3847 100644 --- a/js/questionset.js +++ b/js/questionset.js @@ -86,7 +86,7 @@ H5P.QuestionSet = function (options, contentId) { endGame: { showResultPage: true, resultPage: { - succesGreeting: "Congratulations!", + successGreeting: "Congratulations!", successComment: "You have enough correct answers to pass the test.", failGreeting: "Sorry!", failComment: "You don't have enough correct answers to pass this test.", @@ -95,7 +95,9 @@ H5P.QuestionSet = function (options, contentId) { }, animations: { showAnimations: false, - succesResultAnimation: { + successVideo: undefined, + failVideo: undefined, + successResultAnimation: { machineName: "H5P.Image", options: {image: ""} }, @@ -236,8 +238,27 @@ H5P.QuestionSet = function (options, contentId) { if (params.endGame.animations.showAnimations) { // Init anims. console.log("Now we should have started some anims..."); - // On animation finished: - $(returnObject).trigger('h5pQuestionSetFinished', eventData); + var sources = ""; + var videoData = success ? params.endGame.animations.successVideo : params.endGame.animations.failVideo; + + if (videoData) { + for (var key in videoData) { + sources += ''; + } + // TODO: Width/height from somewhere. + var $video = $(''); + + target.html($video); + $video.on('play', function(ev) { + console.log('Video started playing!!!'); + }).on('ended', function(ev) { + console.log('Video is finished, quitting now!'); + // On animation finished: + $(returnObject).trigger('h5pQuestionSetFinished', eventData); + }); + // Play vidoi! + $video[0].play(); + } } else { // Trigger finished event. $(returnObject).trigger('h5pQuestionSetFinished', eventData); From f23160d67b1e8db622c48221a2c1b07872f2efd7 Mon Sep 17 00:00:00 2001 From: Frank Ronny Larsen Date: Thu, 24 Jan 2013 09:25:17 +0100 Subject: [PATCH 15/54] Preload video, to avoid wait when pressing finish-button --- js/questionset.js | 53 ++++++++++++++++++++++++++--------------------- 1 file changed, 29 insertions(+), 24 deletions(-) diff --git a/js/questionset.js b/js/questionset.js index 88e3847..ad1686b 100644 --- a/js/questionset.js +++ b/js/questionset.js @@ -233,32 +233,37 @@ H5P.QuestionSet = function (options, contentId) { finishButtonText: params.endGame.resultPage.finishButtonText }; endTemplate.update(target.attr('id'), eparams); + + var $video; + if (params.endGame.animations.showAnimations) { + var sources = ""; + var videoData = success ? params.endGame.animations.successVideo : params.endGame.animations.failVideo; + + if (videoData) { + for (var key in videoData) { + sources += ''; + } + // TODO: Width/height from somewhere. + $video = $(''); + $video[0].autoplay = false; + $video[0].load(); + } + } + $('.qs-finishbutton').click(function (ev) { // Display animation if present. - if (params.endGame.animations.showAnimations) { - // Init anims. - console.log("Now we should have started some anims..."); - var sources = ""; - var videoData = success ? params.endGame.animations.successVideo : params.endGame.animations.failVideo; - - if (videoData) { - for (var key in videoData) { - sources += ''; - } - // TODO: Width/height from somewhere. - var $video = $(''); - - target.html($video); - $video.on('play', function(ev) { - console.log('Video started playing!!!'); - }).on('ended', function(ev) { - console.log('Video is finished, quitting now!'); - // On animation finished: - $(returnObject).trigger('h5pQuestionSetFinished', eventData); - }); - // Play vidoi! - $video[0].play(); - } + if ($video) { + // Start video. + target.html($video); + $video.on('play', function(ev) { + console.log('Video started playing!!!'); + }).on('ended', function(ev) { + console.log('Video is finished, quitting now!'); + // On animation finished: + $(returnObject).trigger('h5pQuestionSetFinished', eventData); + }); + // Press play on tape! + $video[0].play(); } else { // Trigger finished event. $(returnObject).trigger('h5pQuestionSetFinished', eventData); From 3cfbd5f586b27f889f9fc86cd27a5b5ce0222a47 Mon Sep 17 00:00:00 2001 From: Frank Ronny Larsen Date: Fri, 25 Jan 2013 10:22:47 +0100 Subject: [PATCH 16/54] Changes to default styles for QuestionSets --- css/img/Paper-clean.png | Bin 0 -> 6679 bytes css/img/mark-fail.png | Bin 0 -> 3520 bytes css/img/mark-pass.png | Bin 0 -> 3220 bytes css/questionset.css | 94 +++++++++++++++++++++++++++++++++- js/questionset.js | 26 +++++----- library.json | 2 +- schema.json | 10 ++++ views/questionset-intro.ejs | 5 -- views/questionset-results.ejs | 4 +- views/questionset.ejs | 20 ++++---- 10 files changed, 129 insertions(+), 32 deletions(-) create mode 100644 css/img/Paper-clean.png create mode 100644 css/img/mark-fail.png create mode 100644 css/img/mark-pass.png delete mode 100644 views/questionset-intro.ejs diff --git a/css/img/Paper-clean.png b/css/img/Paper-clean.png new file mode 100644 index 0000000000000000000000000000000000000000..3552d55ff72f70171798cac886be0019f59e8ce9 GIT binary patch literal 6679 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' + -' <% if (introPage.showIntroPage) { %>' + -'

' + -'
<%= introPage.title %>
' + -'
<%= introPage.introduction %>
' + -'
' + -'
' + -' <%} %>' + +'<% if (introPage.showIntroPage) { %>' + +'
' + +'
<%= introPage.title %>
' + +'
<%= introPage.introduction %>
' + +'
' + +'
' + +'<%} %>' + +'