MDL-28471 make the question flag smaller, and give it a label.
[moodle.git] / question / flags.js
... / ...
CommitLineData
1// This file is part of Moodle - http://moodle.org/
2//
3// Moodle is free software: you can redistribute it and/or modify
4// it under the terms of the GNU General Public License as published by
5// the Free Software Foundation, either version 3 of the License, or
6// (at your option) any later version.
7//
8// Moodle is distributed in the hope that it will be useful,
9// but WITHOUT ANY WARRANTY; without even the implied warranty of
10// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
11// GNU General Public License for more details.
12//
13// You should have received a copy of the GNU General Public License
14// along with Moodle. If not, see <http://www.gnu.org/licenses/>.
15
16/**
17 * JavaScript library for dealing with the question flags.
18 *
19 * This script, and the YUI libraries that it needs, are inluded by
20 * the $PAGE->requires->js calls in question_get_html_head_contributions in lib/questionlib.php.
21 *
22 * @package moodlecore
23 * @subpackage questionengine
24 * @copyright 2010 The Open University
25 * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
26 */
27
28M.core_question_flags = {
29 flagattributes: null,
30 actionurl: null,
31 fltext: null,
32 listeners: [],
33
34 init: function(Y, actionurl, flagattributes, fltext) {
35 M.core_question_flags.flagattributes = flagattributes;
36 M.core_question_flags.actionurl = actionurl;
37 M.core_question_flags.fltext = fltext;
38
39 Y.all('div.questionflag').each(function(flagdiv, i) {
40 var checkbox = flagdiv.one('input[type=checkbox]');
41 if (!checkbox) {
42 return;
43 }
44
45 var input = Y.Node.create('<input type="hidden" />');
46 input.set('id', checkbox.get('id'));
47 input.set('name', checkbox.get('name'));
48 input.set('value', checkbox.get('checked') ? 1 : 0);
49
50 // Create an image input to replace the img tag.
51 var image = Y.Node.create('<input type="image" class="questionflagimage" />');
52 M.core_question_flags.update_flag(input, image);
53
54 // Create flag text
55 var flstatus = input.get('value');
56 var txt = M.core_question_flags.fltext[flstatus];
57 var flagtext = Y.Node.create('<span class="flag-text">');
58 flagtext.addClass(txt);
59 flagtext.append(txt);
60
61 checkbox.remove();
62 flagdiv.one('label').remove();
63 flagdiv.append(input);
64 flagdiv.append(image);
65 flagdiv.append(flagtext);
66 });
67
68 Y.delegate('click', function(e) {
69 var input = this.previous('input');
70 input.set('value', 1 - input.get('value'));
71 M.core_question_flags.update_flag(input, this);
72 var postdata = this.previous('input.questionflagpostdata').get('value') +
73 input.get('value');
74
75 e.halt();
76 Y.io(M.core_question_flags.actionurl , {method: 'POST', 'data': postdata});
77 M.core_question_flags.fire_listeners(postdata);
78 }, document.body, 'input.questionflagimage');
79 },
80
81 update_flag: function(input, image) {
82
83 YUI().use('node', function (Y) {
84 image.setAttrs(M.core_question_flags.flagattributes[input.get('value')]);
85 // get flag text which is next to image element
86 var element = image.next();
87 // if element update its text
88 if(element){
89 element.set('innerText', M.core_question_flags.fltext[input.get('value')]);
90 }
91 });
92
93 },
94
95 add_listener: function(listener) {
96 M.core_question_flags.listeners.push(listener);
97 },
98
99 fire_listeners: function(postdata) {
100 for (var i = 0; i < M.core_question_flags.listeners.length; i++) {
101 M.core_question_flags.listeners[i](
102 postdata.match(/\bqubaid=(\d+)\b/)[1],
103 postdata.match(/\bslot=(\d+)\b/)[1],
104 postdata.match(/\bnewstate=(\d+)\b/)[1]
105 );
106 }
107 }
108};