MDL-28471 make the question flag smaller, and give it a label.

This commit is contained in:
Wale Olujide 2011-07-26 12:07:24 +01:00 committed by Tim Hunt
parent 6f05796919
commit 474ee9389a
3 changed files with 29 additions and 3 deletions

View file

@ -399,3 +399,5 @@ $string['whethercorrect'] = 'Whether correct';
$string['withselected'] = 'With selected'; $string['withselected'] = 'With selected';
$string['xoutofmax'] = '{$a->mark} out of {$a->max}'; $string['xoutofmax'] = '{$a->mark} out of {$a->max}';
$string['yougotnright'] = 'You have correctly selected {$a->num}.'; $string['yougotnright'] = 'You have correctly selected {$a->num}.';
$string['clickflag'] = 'Flag question';
$string['clickunflag'] = 'Unflag question';

View file

@ -632,20 +632,24 @@ abstract class question_flags {
'requires' => array('base', 'dom', 'event-delegate', 'io-base'), 'requires' => array('base', 'dom', 'event-delegate', 'io-base'),
); );
$actionurl = $CFG->wwwroot . '/question/toggleflag.php'; $actionurl = $CFG->wwwroot . '/question/toggleflag.php';
$fltext = array(0 => get_string('clickflag', 'question'),
1 => get_string('clickunflag', 'question'));
$flagattributes = array( $flagattributes = array(
0 => array( 0 => array(
'src' => $OUTPUT->pix_url('i/unflagged') . '', 'src' => $OUTPUT->pix_url('i/unflagged') . '',
'title' => get_string('clicktoflag', 'question'), 'title' => get_string('clicktoflag', 'question'),
'alt' => get_string('notflagged', 'question'), 'alt' => get_string('notflagged', 'question'),
// 'text' => get_string('clickflag', 'question'),
), ),
1 => array( 1 => array(
'src' => $OUTPUT->pix_url('i/flagged') . '', 'src' => $OUTPUT->pix_url('i/flagged') . '',
'title' => get_string('clicktounflag', 'question'), 'title' => get_string('clicktounflag', 'question'),
'alt' => get_string('flagged', 'question'), 'alt' => get_string('flagged', 'question'),
// 'text' => get_string('clickunflag', 'question'),
), ),
); );
$PAGE->requires->js_init_call('M.core_question_flags.init', $PAGE->requires->js_init_call('M.core_question_flags.init',
array($actionurl, $flagattributes), false, $module); array($actionurl, $flagattributes, $fltext), false, $module);
$done = true; $done = true;
} }
} }

View file

@ -28,11 +28,13 @@
M.core_question_flags = { M.core_question_flags = {
flagattributes: null, flagattributes: null,
actionurl: null, actionurl: null,
fltext: null,
listeners: [], listeners: [],
init: function(Y, actionurl, flagattributes) { init: function(Y, actionurl, flagattributes, fltext) {
M.core_question_flags.flagattributes = flagattributes; M.core_question_flags.flagattributes = flagattributes;
M.core_question_flags.actionurl = actionurl; M.core_question_flags.actionurl = actionurl;
M.core_question_flags.fltext = fltext;
Y.all('div.questionflag').each(function(flagdiv, i) { Y.all('div.questionflag').each(function(flagdiv, i) {
var checkbox = flagdiv.one('input[type=checkbox]'); var checkbox = flagdiv.one('input[type=checkbox]');
@ -49,10 +51,18 @@ M.core_question_flags = {
var image = Y.Node.create('<input type="image" class="questionflagimage" />'); var image = Y.Node.create('<input type="image" class="questionflagimage" />');
M.core_question_flags.update_flag(input, image); M.core_question_flags.update_flag(input, image);
// Create flag text
var flstatus = input.get('value');
var txt = M.core_question_flags.fltext[flstatus];
var flagtext = Y.Node.create('<span class="flag-text">');
flagtext.addClass(txt);
flagtext.append(txt);
checkbox.remove(); checkbox.remove();
flagdiv.one('label').remove(); flagdiv.one('label').remove();
flagdiv.append(input); flagdiv.append(input);
flagdiv.append(image); flagdiv.append(image);
flagdiv.append(flagtext);
}); });
Y.delegate('click', function(e) { Y.delegate('click', function(e) {
@ -69,7 +79,17 @@ M.core_question_flags = {
}, },
update_flag: function(input, image) { update_flag: function(input, image) {
YUI().use('node', function (Y) {
image.setAttrs(M.core_question_flags.flagattributes[input.get('value')]); image.setAttrs(M.core_question_flags.flagattributes[input.get('value')]);
// get flag text which is next to image element
var element = image.next();
// if element update its text
if(element){
element.set('innerText', M.core_question_flags.fltext[input.get('value')]);
}
});
}, },
add_listener: function(listener) { add_listener: function(listener) {