| 1 |
efrain |
1 |
var COLOURPICKER_NAME = "Colourpicker",
|
|
|
2 |
COLOURPICKER;
|
|
|
3 |
|
|
|
4 |
/**
|
|
|
5 |
* Provides an in browser PDF editor.
|
|
|
6 |
*
|
|
|
7 |
* @module moodle-assignfeedback_editpdf-editor
|
|
|
8 |
*/
|
|
|
9 |
|
|
|
10 |
/**
|
|
|
11 |
* COLOURPICKER
|
|
|
12 |
* This is a drop down list of colours.
|
|
|
13 |
*
|
|
|
14 |
* @namespace M.assignfeedback_editpdf
|
|
|
15 |
* @class colourpicker
|
|
|
16 |
* @constructor
|
|
|
17 |
* @extends M.assignfeedback_editpdf.dropdown
|
|
|
18 |
*/
|
|
|
19 |
COLOURPICKER = function(config) {
|
|
|
20 |
COLOURPICKER.superclass.constructor.apply(this, [config]);
|
|
|
21 |
};
|
|
|
22 |
|
|
|
23 |
Y.extend(COLOURPICKER, M.assignfeedback_editpdf.dropdown, {
|
|
|
24 |
|
|
|
25 |
/**
|
|
|
26 |
* Initialise the menu.
|
|
|
27 |
*
|
|
|
28 |
* @method initializer
|
|
|
29 |
* @return void
|
|
|
30 |
*/
|
|
|
31 |
initializer: function(config) {
|
|
|
32 |
var colourlist = Y.Node.create('<ul role="menu" class="assignfeedback_editpdf_menu"/>'),
|
|
|
33 |
body;
|
|
|
34 |
|
|
|
35 |
// Build a list of coloured buttons.
|
|
|
36 |
Y.each(this.get('colours'), function(rgb, colour) {
|
|
|
37 |
var button, listitem, title, img, iconname;
|
|
|
38 |
|
|
|
39 |
title = M.util.get_string(colour, 'assignfeedback_editpdf');
|
|
|
40 |
iconname = this.get('iconprefix') + colour;
|
|
|
41 |
img = M.util.image_url(iconname, 'assignfeedback_editpdf');
|
|
|
42 |
button = Y.Node.create('<button><img alt="' + title + '" src="' + img + '"/></button>');
|
|
|
43 |
button.setAttribute('data-colour', colour);
|
|
|
44 |
button.setAttribute('data-rgb', rgb);
|
|
|
45 |
button.setAttribute('role', 'menuitem');
|
|
|
46 |
button.setStyle('backgroundImage', 'none');
|
|
|
47 |
listitem = Y.Node.create('<li/>');
|
|
|
48 |
listitem.append(button);
|
|
|
49 |
listitem.setAttribute('role', 'none');
|
|
|
50 |
colourlist.append(listitem);
|
|
|
51 |
}, this);
|
|
|
52 |
|
|
|
53 |
body = Y.Node.create('<div/>');
|
|
|
54 |
|
|
|
55 |
// Set the call back.
|
|
|
56 |
colourlist.delegate('click', this.callback_handler, 'button', this);
|
|
|
57 |
colourlist.delegate('key', this.callback_handler, 'down:13', 'button', this);
|
|
|
58 |
|
|
|
59 |
// Set the accessible header text.
|
|
|
60 |
this.set('headerText', M.util.get_string('colourpicker', 'assignfeedback_editpdf'));
|
|
|
61 |
|
|
|
62 |
// Set the body content.
|
|
|
63 |
body.append(colourlist);
|
|
|
64 |
this.set('bodyContent', body);
|
|
|
65 |
|
|
|
66 |
COLOURPICKER.superclass.initializer.call(this, config);
|
|
|
67 |
},
|
|
|
68 |
callback_handler: function(e) {
|
|
|
69 |
e.preventDefault();
|
|
|
70 |
|
|
|
71 |
var callback = this.get('callback'),
|
|
|
72 |
callbackcontext = this.get('context'),
|
|
|
73 |
bind;
|
|
|
74 |
|
|
|
75 |
this.hide();
|
|
|
76 |
|
|
|
77 |
// Call the callback with the specified context.
|
|
|
78 |
bind = Y.bind(callback, callbackcontext, e);
|
|
|
79 |
|
|
|
80 |
bind();
|
|
|
81 |
}
|
|
|
82 |
}, {
|
|
|
83 |
NAME: COLOURPICKER_NAME,
|
|
|
84 |
ATTRS: {
|
|
|
85 |
/**
|
|
|
86 |
* The list of colours this colour picker supports.
|
|
|
87 |
*
|
|
|
88 |
* @attribute colours
|
|
|
89 |
* @type {String: String} (The keys of the array are the colour names and the values are localized strings)
|
|
|
90 |
* @default {}
|
|
|
91 |
*/
|
|
|
92 |
colours: {
|
|
|
93 |
value: {}
|
|
|
94 |
},
|
|
|
95 |
|
|
|
96 |
/**
|
|
|
97 |
* The function called when a new colour is chosen.
|
|
|
98 |
*
|
|
|
99 |
* @attribute callback
|
|
|
100 |
* @type function
|
|
|
101 |
* @default null
|
|
|
102 |
*/
|
|
|
103 |
callback: {
|
|
|
104 |
value: null
|
|
|
105 |
},
|
|
|
106 |
|
|
|
107 |
/**
|
|
|
108 |
* The context passed to the callback when a colour is chosen.
|
|
|
109 |
*
|
|
|
110 |
* @attribute context
|
|
|
111 |
* @type Y.Node
|
|
|
112 |
* @default null
|
|
|
113 |
*/
|
|
|
114 |
context: {
|
|
|
115 |
value: null
|
|
|
116 |
},
|
|
|
117 |
|
|
|
118 |
/**
|
|
|
119 |
* The prefix for the icon image names.
|
|
|
120 |
*
|
|
|
121 |
* @attribute iconprefix
|
|
|
122 |
* @type String
|
|
|
123 |
* @default 'colour_'
|
|
|
124 |
*/
|
|
|
125 |
iconprefix: {
|
|
|
126 |
value: 'colour_'
|
|
|
127 |
}
|
|
|
128 |
}
|
|
|
129 |
});
|
|
|
130 |
|
|
|
131 |
M.assignfeedback_editpdf = M.assignfeedback_editpdf || {};
|
|
|
132 |
M.assignfeedback_editpdf.colourpicker = COLOURPICKER;
|