RCFilters: HTML-escape tag names in filter capsules
[lhc/web/wiklou.git] / resources / src / mediawiki.rcfilters / dm / mw.rcfilters.dm.ItemModel.js
1 ( function ( mw ) {
2 /**
3 * RCFilter base item model
4 *
5 * @mixins OO.EventEmitter
6 *
7 * @constructor
8 * @param {string} param Filter param name
9 * @param {Object} config Configuration object
10 * @cfg {string} [label] The label for the filter
11 * @cfg {string} [description] The description of the filter
12 * @cfg {string|Object} [labelPrefixKey] An i18n key defining the prefix label for this
13 * group. If the prefix has 'invert' state, the parameter is expected to be an object
14 * with 'default' and 'inverted' as keys.
15 * @cfg {boolean} [active=true] The filter is active and affecting the result
16 * @cfg {boolean} [selected] The item is selected
17 * @cfg {string} [namePrefix='item_'] A prefix to add to the param name to act as a unique
18 * identifier
19 * @cfg {string} [cssClass] The class identifying the results that match this filter
20 * @cfg {string[]} [identifiers] An array of identifiers for this item. They will be
21 * added and considered in the view.
22 * @cfg {string} [defaultHighlightColor] If set, highlight this filter by default with this color
23 */
24 mw.rcfilters.dm.ItemModel = function MwRcfiltersDmItemModel( param, config ) {
25 config = config || {};
26
27 // Mixin constructor
28 OO.EventEmitter.call( this );
29
30 this.param = param;
31 this.namePrefix = config.namePrefix || 'item_';
32 this.name = this.namePrefix + param;
33
34 this.label = config.label || this.name;
35 this.labelPrefixKey = config.labelPrefixKey;
36 this.description = config.description || '';
37 this.selected = !!config.selected;
38
39 this.identifiers = config.identifiers || [];
40
41 // Highlight
42 this.cssClass = config.cssClass;
43 this.highlightColor = config.defaultHighlightColor;
44 this.highlightEnabled = !!config.defaultHighlightColor;
45 };
46
47 /* Initialization */
48
49 OO.initClass( mw.rcfilters.dm.ItemModel );
50 OO.mixinClass( mw.rcfilters.dm.ItemModel, OO.EventEmitter );
51
52 /* Events */
53
54 /**
55 * @event update
56 *
57 * The state of this filter has changed
58 */
59
60 /* Methods */
61
62 /**
63 * Return the representation of the state of this item.
64 *
65 * @return {Object} State of the object
66 */
67 mw.rcfilters.dm.ItemModel.prototype.getState = function () {
68 return {
69 selected: this.isSelected()
70 };
71 };
72
73 /**
74 * Get the name of this filter
75 *
76 * @return {string} Filter name
77 */
78 mw.rcfilters.dm.ItemModel.prototype.getName = function () {
79 return this.name;
80 };
81
82 /**
83 * Get a prefixed label
84 *
85 * @param {boolean} inverted This item should be considered inverted
86 * @return {string} Prefixed label (HTML)
87 */
88 mw.rcfilters.dm.ItemModel.prototype.getPrefixedLabel = function ( inverted ) {
89 var escapedLabel = mw.html.escape( this.getLabel() );
90 if ( this.labelPrefixKey ) {
91 if ( typeof this.labelPrefixKey === 'string' ) {
92 return mw.message( this.labelPrefixKey, escapedLabel ).parse();
93 } else {
94 return mw.message(
95 this.labelPrefixKey[
96 // Only use inverted-prefix if the item is selected
97 // Highlight-only an inverted item makes no sense
98 inverted && this.isSelected() ?
99 'inverted' : 'default'
100 ],
101 escapedLabel
102 ).parse();
103 }
104 } else {
105 return escapedLabel;
106 }
107 };
108
109 /**
110 * Get the param name or value of this filter
111 *
112 * @return {string} Filter param name
113 */
114 mw.rcfilters.dm.ItemModel.prototype.getParamName = function () {
115 return this.param;
116 };
117
118 /**
119 * Get the message representing the state of this model.
120 *
121 * @return {string} State message
122 */
123 mw.rcfilters.dm.ItemModel.prototype.getStateMessage = function () {
124 // Display description
125 return this.getDescription();
126 };
127
128 /**
129 * Get the label of this filter
130 *
131 * @return {string} Filter label
132 */
133 mw.rcfilters.dm.ItemModel.prototype.getLabel = function () {
134 return this.label;
135 };
136
137 /**
138 * Get the description of this filter
139 *
140 * @return {string} Filter description
141 */
142 mw.rcfilters.dm.ItemModel.prototype.getDescription = function () {
143 return this.description;
144 };
145
146 /**
147 * Get the default value of this filter
148 *
149 * @return {boolean} Filter default
150 */
151 mw.rcfilters.dm.ItemModel.prototype.getDefault = function () {
152 return this.default;
153 };
154
155 /**
156 * Get the selected state of this filter
157 *
158 * @return {boolean} Filter is selected
159 */
160 mw.rcfilters.dm.ItemModel.prototype.isSelected = function () {
161 return this.selected;
162 };
163
164 /**
165 * Toggle the selected state of the item
166 *
167 * @param {boolean} [isSelected] Filter is selected
168 * @fires update
169 */
170 mw.rcfilters.dm.ItemModel.prototype.toggleSelected = function ( isSelected ) {
171 isSelected = isSelected === undefined ? !this.selected : isSelected;
172
173 if ( this.selected !== isSelected ) {
174 this.selected = isSelected;
175 this.emit( 'update' );
176 }
177 };
178
179 /**
180 * Set the highlight color
181 *
182 * @param {string|null} highlightColor
183 */
184 mw.rcfilters.dm.ItemModel.prototype.setHighlightColor = function ( highlightColor ) {
185 if ( !this.isHighlightSupported() ) {
186 return;
187 }
188
189 if ( this.highlightColor !== highlightColor ) {
190 this.highlightColor = highlightColor;
191 this.emit( 'update' );
192 }
193 };
194
195 /**
196 * Clear the highlight color
197 */
198 mw.rcfilters.dm.ItemModel.prototype.clearHighlightColor = function () {
199 this.setHighlightColor( null );
200 };
201
202 /**
203 * Get the highlight color, or null if none is configured
204 *
205 * @return {string|null}
206 */
207 mw.rcfilters.dm.ItemModel.prototype.getHighlightColor = function () {
208 return this.highlightColor;
209 };
210
211 /**
212 * Get the CSS class that matches changes that fit this filter
213 * or null if none is configured
214 *
215 * @return {string|null}
216 */
217 mw.rcfilters.dm.ItemModel.prototype.getCssClass = function () {
218 return this.cssClass;
219 };
220
221 /**
222 * Get the item's identifiers
223 *
224 * @return {string[]}
225 */
226 mw.rcfilters.dm.ItemModel.prototype.getIdentifiers = function () {
227 return this.identifiers;
228 };
229
230 /**
231 * Check if the highlight feature is supported for this filter
232 *
233 * @return {boolean}
234 */
235 mw.rcfilters.dm.ItemModel.prototype.isHighlightSupported = function () {
236 return !!this.getCssClass();
237 };
238
239 /**
240 * Check if the filter is currently highlighted
241 *
242 * @return {boolean}
243 */
244 mw.rcfilters.dm.ItemModel.prototype.isHighlighted = function () {
245 return !!this.getHighlightColor();
246 };
247 }( mediaWiki ) );