Page MenuHomePhabricator

Reduce differences between PHP and JS code-comment documentation
Open, LowPublic

Description

We should reduce differences between PHP and JS code-comment documentation.

There is a handy script in the repository, bin/doccomparer.rb, which generates the following report: (as of 2017-04-07)

1AccessKeyedElement: JS/PHP
2 Basic:
3 description: MISMATCH
4 JS: "AccessKeyedElement is mixed into other classes to provide an `accesskey` attribute. Accesskeys allow an user to go to a specific element by using a shortcut combination of a browser specific keys + the key set to the field. @example // AccessKeyedElement provides an 'accesskey' attribute to the // ButtonWidget class var button = new ButtonWidget( { label: 'Button with Accesskey', accessKey: 'k' } ); $( 'body' ).append( button.$element );"
5 PHP: "Element with an accesskey. Accesskeys allow an user to go to a specific element by using a shortcut combination of a browser specific keys + the key set to the field."
6 Methods:
7 #constructor: PHP missing
8 getAccessKey: MISMATCH
9 description: MISMATCH
10 JS: "Get accesskey."
11 PHP: "Get AccessKey."
12 return: MISMATCH
13 description: MISMATCH
14 JS: "accessKey string"
15 PHP: "Accesskey string"
16 initializeAccessKeyedElement: JS missing
17 setAccessKey: MISMATCH
18 description: MISMATCH
19 JS: "Set accesskey."
20 PHP: "Set access key."
21 params: MISMATCH
22 accessKey: MISMATCH
23 description: MISMATCH
24 JS: "Key, a function that returns a key, or `null` for no accesskey"
25 PHP: "Tag's access key, use empty string to remove"
26 type: MISMATCH
27 JS: "string|null"
28 PHP: "string"
29 return: JS missing
30 setAccessKeyedElement: PHP missing
31 Properties:
32 accessKey: MISMATCH
33 description: MISMATCH
34 JS: "The access key, a function that returns a key, or `null` for no accesskey."
35 PHP: "Accesskey"
36 static: PHP missing
37 type: MISMATCH
38 JS: "string|null"
39 PHP: "string"
40 accessKeyed: JS missing
41
42ActionFieldLayout: JS/PHP
43 Basic:
44 description: MISMATCH
45 JS: "ActionFieldLayouts are used with FieldsetLayout. The layout consists of a field-widget, a button, and an optional label and/or help text. The field-widget (e.g., a {@link OO.ui.TextInputWidget TextInputWidget}), is required and is specified before any optional configuration settings. Labels can be aligned in one of four ways: - **left**: The label is placed before the field-widget and aligned with the left margin. A left-alignment is used for forms with many fields. - **right**: The label is placed before the field-widget and aligned to the right margin. A right-alignment is used for long but familiar forms which users tab through, verifying the current field with a quick glance at the label. - **top**: The label is placed above the field-widget. A top-alignment is used for brief forms that users fill out from top to bottom. - **inline**: The label is placed after the field-widget and aligned to the left. An inline-alignment is best used with checkboxes or radio buttons. Help text is accessed via a help icon that appears in the upper right corner of the rendered field layout when help text is specified. @example // Example of an ActionFieldLayout var actionFieldLayout = new OO.ui.ActionFieldLayout( new OO.ui.TextInputWidget( { placeholder: 'Field widget' } ), new OO.ui.ButtonWidget( { label: 'Button' } ), { label: 'An ActionFieldLayout. This label is aligned top', align: 'top', help: 'This is help text' } ); $( 'body' ).append( actionFieldLayout.$element );"
46 PHP: "Layout made of a field, button and optional label."
47 Methods:
48 #constructor: MISMATCH
49 params: MISMATCH
50 buttonWidget: MISMATCH
51 description: MISMATCH
52 JS: "Button widget"
53 PHP: "Field widget"
54 Properties:
55 buttonWidget: JS missing
56
57ApexTheme: JS/PHP
58 Methods:
59 #constructor: PHP missing
60
61BlankTheme: JS/PHP
62 Basic:
63 parent: MISMATCH
64 JS: "{Theme}"
65 PHP: "Theme"
66 Methods:
67 #constructor: PHP missing
68
69ButtonElement: JS/PHP
70 Basic:
71 description: MISMATCH
72 JS: "ButtonElement is often mixed into other classes to generate a button, which is a clickable interface element that can be configured with access keys for accessibility. See the [OOjs UI documentation on MediaWiki] [1] for examples. [1]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Buttons_and_SwitchesButtons()"
73 PHP: "Element with a button. Buttons are used for controls which can be clicked. They can be configured to use tab indexing and access keys for accessibility purposes."
74 Methods:
75 #constructor: PHP missing
76 initializeButtonElement: JS missing
77 isActive: PHP missing
78 onClick: PHP missing
79 onKeyDown: PHP missing
80 onKeyPress: PHP missing
81 onKeyUp: PHP missing
82 onMouseDown: PHP missing
83 onMouseUp: PHP missing
84 setActive: PHP missing
85 setButtonElement: PHP missing
86 toggleFramed: MISMATCH
87 description: MISMATCH
88 JS: "Render the button with or without a frame. Omit the `framed` parameter to toggle the button frame on and off."
89 PHP: "Toggle frame."
90 return: JS missing
91 Properties:
92 button: JS missing
93 cancelButtonMouseDownEvents: PHP missing
94 framed: JS missing
95
96ButtonGroupWidget: JS/PHP
97 Basic:
98 description: MISMATCH
99 JS: "A ButtonGroupWidget groups related buttons and is used together with ButtonWidget and its subclasses. Each button in a group is addressed by a unique reference. Buttons can be added, removed, and cleared from the group. @example // Example: A ButtonGroupWidget with two buttons var button1 = new OO.ui.PopupButtonWidget( { label: 'Select a category', icon: 'menu', popup: { $content: $( '<p>List of categories...</p>' ), padded: true, align: 'left' } } ); var button2 = new OO.ui.ButtonWidget( { label: 'Add item' }); var buttonGroup = new OO.ui.ButtonGroupWidget( { items: [button1, button2] } ); $( 'body' ).append( buttonGroup.$element );"
100 PHP: "Group widget for multiple related buttons. Use together with ButtonWidget."
101
102ButtonInputWidget: JS/PHP
103 Basic:
104 description: MISMATCH
105 JS: "ButtonInputWidget is used to submit HTML forms and is intended to be used within a FormLayout. If you do not need the button to work with HTML forms, you probably want to use OO.ui.ButtonWidget instead. Button input widgets can be rendered as either an HTML `<button>` (the default) or an HTML `<input>` tags. See the [OOjs UI documentation on MediaWiki] [1] for more information. @example // A ButtonInputWidget rendered as an HTML button, the default. var button = new OO.ui.ButtonInputWidget( { label: 'Input button', icon: 'check', value: 'check' } ); $( 'body' ).append( button.$element ); [1]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/InputsButton_inputs()"
106 PHP: "A button that is an input widget. Intended to be used within a FormLayout."
107 mixins: MISMATCH
108 JS: ["ButtonElement", "IconElement", "IndicatorElement", "LabelElement", "TitledElement"]
109 PHP: ["ButtonElement", "IconElement", "IndicatorElement", "LabelElement"]
110 Methods:
111 #constructor: MISMATCH
112 config: MISMATCH
113 type: MISMATCH
114 description: MISMATCH
115 JS: "The value of the HTML `'type'` attribute: 'button', 'submit' or 'reset'."
116 PHP: "HTML tag `type` attribute, may be 'button', 'submit' or 'reset'"
117 useInputTag: MISMATCH
118 description: MISMATCH
119 JS: "Use an `<input>` tag instead of a `<button>` tag, the default. Widgets configured to be an `<input>` do not support {@link icon() icons} and {@link indicator() indicators}, non-plaintext {@link label() labels}, or {@link value() values}. In general, useInputTag should only be set to `true` when there\u2019s need to support IE 6 in a form with multiple buttons."
120 PHP: "Whether to use `<input>` rather than `<button>`. Only useful if you need IE 6 support in a form with multiple buttons. If you use this option, icons and indicators will not be displayed, it won't be possible to have a non-plaintext label, and it won't be possible to set a value (which will internally become identical to the label)."
121 setLabel: MISMATCH
122 description: MISMATCH
123 JS: "Set label value. If useInputTag() is `true`, the label is set as the `value` of the `<input>` tag."
124 PHP: "Set label value. Overridden to support setting the 'value' of `<input>` elements."
125 params: MISMATCH
126 label: MISMATCH
127 description: MISMATCH
128 JS: "Label nodes, text, a function that returns nodes or text, or `null` for no label"
129 PHP: "Label text"
130 return: JS missing
131 setValue: MISMATCH
132 description: MISMATCH
133 JS: "Set the value of the input. This method is disabled for button inputs configured as {@link useInputTag() <input> tags}, as they do not support {@link value() values}."
134 PHP: "Set the value of the input. Overridden to disable for `<input>` elements, which have value identical to the label."
135 return: JS missing
136 Properties:
137 supportsSimpleLabel: JS missing
138 useInputTag: JS missing
139
140ButtonWidget: JS/PHP
141 Basic:
142 description: MISMATCH
143 JS: "ButtonWidget is a generic widget for buttons. A wide variety of looks, feels, and functionality can be customized via the class\u2019s configuration options and methods. Please see the [OOjs UI documentation on MediaWiki] [1] for more information and examples. [1]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Buttons_and_Switches @example // A button widget var button = new ButtonWidget( { label: 'Button with Icon', icon: 'remove', iconTitle: 'Remove' } ); $( 'body' ).append( button.$element ); NOTE: HTML form buttons should use the OO.ui.ButtonInputWidget class."
144 PHP: "Generic widget for buttons."
145 Methods:
146 #constructor: MISMATCH
147 config: MISMATCH
148 href: MISMATCH
149 description: MISMATCH
150 JS: "Hyperlink to visit when the button is clicked."
151 PHP: "Hyperlink to visit when clicked"
152 noFollow: MISMATCH
153 default: JS missing
154 description: MISMATCH
155 JS: "Search engine traversal hint (default: true)"
156 PHP: "Search engine traversal hint"
157 target: MISMATCH
158 description: MISMATCH
159 JS: "The frame or window in which to open the hyperlink."
160 PHP: "Target to open hyperlink in"
161 isActive: JS missing
162 onDisable: PHP missing
163 setActive: JS missing
164 setHref: MISMATCH
165 return: JS missing
166 setNoFollow: MISMATCH
167 return: JS missing
168 setTarget: MISMATCH
169 return: JS missing
170 updateHref: MISMATCH
171 description: MISMATCH
172 JS: "Update the `href` attribute, in case of changes to href or disabled state."
173 PHP: "Update the href attribute, in case of changes to href or disabled state."
174 return: JS missing
175 visibility: MISMATCH
176 JS: :private
177 PHP: :public
178 Properties:
179 active: JS missing
180 href: JS missing
181 noFollow: JS missing
182 target: JS missing
183
184CheckboxInputWidget: JS/PHP
185 Basic:
186 description: MISMATCH
187 JS: "CheckboxInputWidgets, like HTML checkboxes, can be selected and/or configured with a value. Note that these {@link InputWidget input widgets} are best laid out in {@link OO.ui.FieldLayout field layouts} that use the {@link OO.ui.FieldLayoutalign() inline} alignment. For more information, please see the [OOjs UI documentation on MediaWiki][1]. This widget can be used inside an HTML form, such as a OO.ui.FormLayout. @example // An example of selected, unselected, and disabled checkbox inputs var checkbox1=new OO.ui.CheckboxInputWidget( { value: 'a', selected: true } ); var checkbox2=new OO.ui.CheckboxInputWidget( { value: 'b' } ); var checkbox3=new OO.ui.CheckboxInputWidget( { value:'c', disabled: true } ); // Create a fieldset layout with fields for each checkbox. var fieldset = new OO.ui.FieldsetLayout( { label: 'Checkboxes' } ); fieldset.addItems( [ new OO.ui.FieldLayout( checkbox1, { label: 'Selected checkbox', align: 'inline' } ), new OO.ui.FieldLayout( checkbox2, { label: 'Unselected checkbox', align: 'inline' } ), new OO.ui.FieldLayout( checkbox3, { label: 'Disabled checkbox', align: 'inline' } ), ] ); $( 'body' ).append( fieldset.$element ); [1]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Inputs"
188 PHP: "Checkbox input widget."
189 mixins: MISMATCH
190 JS: ["the"]
191 PHP: {}
192 Methods:
193 #constructor: MISMATCH
194 config: MISMATCH
195 selected: MISMATCH
196 description: MISMATCH
197 JS: "Select the checkbox initially. By default, the checkbox is not selected."
198 PHP: "Whether the checkbox is initially selected"
199 setSelected: MISMATCH
200 params: MISMATCH
201 state: MISMATCH
202 description: MISMATCH
203 JS: "`true` for selected"
204 PHP: "Whether the checkbox is selected"
205 return: JS missing
206 Properties:
207 selected: JS missing
208
209CheckboxMultiselectInputWidget: JS/PHP
210 Basic:
211 description: MISMATCH
212 JS: "CheckboxMultiselectInputWidget is a {@link CheckboxMultiselectWidget CheckboxMultiselectWidget} intended to be used within a HTML form, such as a OO.ui.FormLayout. The selected values are synchronized with the value of HTML `<input type=checkbox>` tags. Please see the [OOjs UI documentation on MediaWiki][1] for more information about input widgets. @example // Example: A CheckboxMultiselectInputWidget with three options var multiselectInput = new OO.ui.CheckboxMultiselectInputWidget( { options: [ { data: 'a', label: 'First' }, { data: 'b', label: 'Second'}, { data: 'c', label: 'Third' } ] } ); $( 'body' ).append( multiselectInput.$element ); [1]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Inputs"
213 PHP: "Multiple checkbox input widget. Intended to be used within a FormLayout."
214 Methods:
215 #constructor: MISMATCH
216 config: MISMATCH
217 options: MISMATCH
218 default: PHP missing
219 description: MISMATCH
220 JS: "Array of menu options in the format `{ data: \u2026, label: \u2026, disabled: \u2026 }`"
221 PHP: "Array of menu options in the format `[ 'data' => \u2026, 'label' => \u2026, 'disabled' => \u2026 ]`"
222 type: MISMATCH
223 JS: "Object[]"
224 PHP: "array[]"
225 cleanUpValue: MISMATCH
226 visibility: MISMATCH
227 JS: :public
228 PHP: :protected
229 setOptions: MISMATCH
230 params: MISMATCH
231 options: MISMATCH
232 description: MISMATCH
233 JS: "Array of menu options in the format `{ data: \u2026, label: \u2026, disabled: \u2026 }`"
234 PHP: "Array of menu options in the format `[ 'data' => \u2026, 'label' => \u2026, 'disabled' => \u2026 ]`"
235 type: MISMATCH
236 JS: "Object[]"
237 PHP: "array[]"
238 return: JS missing
239 setValue: JS missing
240 Properties:
241 fields: JS missing
242 name: JS missing
243 value: JS missing
244
245ComboBoxInputWidget: JS/PHP
246 Basic:
247 description: MISMATCH
248 JS: "ComboBoxInputWidgets combine a {@link TextInputWidget text input} (where a value can be entered manually) and a {@link OO.ui.MenuSelectWidget menu of options} (from which a value can be chosen instead). Users can choose options from the combo box in one of two ways: - by typing a value in the text input field. If the value exactly matches the value of a menu option, that option will appear to be selected. - by choosing a value from the menu. The value of the chosen option will then appear in the text input field. After the user chooses an option, its `data` will be used as a new value for the widget. A `label` also can be specified for each option: if given, it will be shown instead of the `data` in the dropdown menu. This widget can be used inside an HTML form, such as a OO.ui.FormLayout. For more information about menus and options, please see the [OOjs UI documentation on MediaWiki][1]. @example // Example: A ComboBoxInputWidget. var comboBox = new OO.ui.ComboBoxInputWidget( { value: 'Option 1', options: [ { data: 'Option 1' }, { data: 'Option 2' }, { data: 'Option 3' } ] } ); $( 'body' ).append( comboBox.$element ); @example // Example: A ComboBoxInputWidget with additional option labels. var comboBox = new OO.ui.ComboBoxInputWidget( { value: 'Option 1', options: [ { data: 'Option 1', label: 'Option One' }, { data: 'Option 2', label: 'Option Two' }, { data: 'Option 3', label: 'Option Three' } ] } ); $( 'body' ).append( comboBox.$element ); [1]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Selects_and_OptionsMenu_selects_and_options()"
249 PHP: "Combo box input widget, wrapping a text input with `<datalist>`. Intended to be used within a FormLayout."
250 Methods:
251 #constructor: MISMATCH
252 config: MISMATCH
253 $overlay: PHP missing
254 menu: PHP missing
255 options: MISMATCH
256 default: PHP missing
257 description: MISMATCH
258 JS: "Array of menu options in the format `{ data: \u2026, label: \u2026 }`"
259 PHP: "Array of menu options in the format `[ 'data' => \u2026, 'label' => \u2026 ]`"
260 type: MISMATCH
261 JS: "Object[]"
262 PHP: "array[]"
263 getInput: PHP missing
264 getMenu: PHP missing
265 onDropdownButtonClick: PHP missing
266 onInputChange: PHP missing
267 onInputEnter: PHP missing
268 onMenuChoose: PHP missing
269 onMenuItemsChange: PHP missing
270 setOptions: MISMATCH
271 params: MISMATCH
272 options: MISMATCH
273 description: MISMATCH
274 JS: "Array of menu options in the format `{ data: \u2026, label: \u2026 }`"
275 PHP: "Array of menu options in the format `[ 'data' => \u2026, 'label' => \u2026 ]`"
276 type: MISMATCH
277 JS: "Object[]"
278 PHP: "array[]"
279 return: JS missing
280 Properties:
281 options: JS missing
282
283DropdownInputWidget: JS/PHP
284 Basic:
285 description: MISMATCH
286 JS: "DropdownInputWidget is a {@link DropdownWidget DropdownWidget} intended to be used within an HTML form, such as a OO.ui.FormLayout. The selected value is synchronized with the value of a hidden HTML `input` tag. Please see the [OOjs UI documentation on MediaWiki][1] for more information about input widgets. A DropdownInputWidget always has a value (one of the options is always selected), unless there are no options. If no `value` configuration option is provided, the first option is selected. If you need a state representing no value (no option being selected), use a DropdownWidget. This and OO.ui.RadioSelectInputWidget support the same configuration options. @example // Example: A DropdownInputWidget with three options var dropdownInput = new OO.ui.DropdownInputWidget( { options: [ { data: 'a', label: 'First' }, { data: 'b', label: 'Second'}, { data: 'c', label: 'Third' } ] } ); $( 'body' ).append( dropdownInput.$element ); [1]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Inputs"
287 PHP: "Dropdown input widget, wrapping a `<select>` element. Intended to be used within a FormLayout."
288 mixins: MISMATCH
289 JS: ["TitledElement"]
290 PHP: {}
291 Methods:
292 #constructor: MISMATCH
293 config: MISMATCH
294 dropdown: PHP missing
295 options: MISMATCH
296 default: PHP missing
297 description: MISMATCH
298 JS: "Array of menu options in the format `{ data: \u2026, label: \u2026 }`"
299 PHP: "Array of menu options in the format `[ 'data' => \u2026, 'label' => \u2026 ]`"
300 type: MISMATCH
301 JS: "Object[]"
302 PHP: "array[]"
303 onMenuSelect: PHP missing
304 setOptions: MISMATCH
305 params: MISMATCH
306 options: MISMATCH
307 description: MISMATCH
308 JS: "Array of menu options in the format `{ data: \u2026, label: \u2026 }`"
309 PHP: "Array of menu options in the format `[ 'data' => \u2026, 'label' => \u2026 ]`"
310 type: MISMATCH
311 JS: "Object[]"
312 PHP: "array[]"
313 return: JS missing
314 Properties:
315 options: JS missing
316
317Element: JS/PHP
318 Basic:
319 description: MISMATCH
320 JS: "Each Element represents a rendering in the DOM\u2014a button or an icon, for example, or anything that is visible to a user. Unlike {@link Widget widgets}, plain elements usually do not have events connected to them and can't be interacted with."
321 PHP: "DOM element abstraction."
322 parent: JS missing
323 Methods:
324 #constructor: MISMATCH
325 config: MISMATCH
326 $content: PHP missing
327 $element: PHP missing
328 classes: MISMATCH
329 description: MISMATCH
330 JS: "The names of the CSS classes to apply to the element. CSS styles are added to the top level (e.g., the outermost div) of the element. See the [OOjs UI documentation on MediaWiki][2] for an example. [2]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Buttons_and_SwitchescssExample()"
331 PHP: "CSS class names to add"
332 content: MISMATCH
333 description: MISMATCH
334 JS: "An array of content elements to append (after text()). Strings will be html-escaped; use an HtmlSnippet to append raw HTML. Instances of OO.ui.Element will have their $element appended."
335 PHP: "Content to append (after text), strings or Element arrays. Strings will be HTML-escaped for output, use an HtmlSnippet instance to prevent that."
336 type: MISMATCH
337 JS: "Array"
338 PHP: "array"
339 data: MISMATCH
340 description: MISMATCH
341 JS: "Custom data of any type or combination of types (e.g., string, number, array, array). Data can also be specified with the setData() method."
342 PHP: "Element data"
343 type: MISMATCH
344 JS: "Mixed"
345 PHP: "mixed"
346 id: MISMATCH
347 description: MISMATCH
348 JS: "The HTML id attribute used in the rendered tag."
349 PHP: "HTML id attribute"
350 configFromHtmlAttributes: JS missing
351 getClosestScrollableElementContainer: PHP missing
352 getConfig: JS missing
353 getData: MISMATCH
354 return: MISMATCH
355 type: MISMATCH
356 JS: "Mixed"
357 PHP: "mixed"
358 getDir: JS missing
359 getElementDocument: PHP missing
360 getElementGroup: PHP missing
361 getElementWindow: PHP missing
362 getJavaScriptClassName: JS missing
363 getScrollLeft: PHP missing
364 getSerializedConfig: JS missing
365 isElementAttached: PHP missing
366 isVisible: PHP missing
367 registerConfigCallback: JS missing
368 restorePreInfuseState: PHP missing
369 scrollElementIntoView: PHP missing
370 setData: MISMATCH
371 params: MISMATCH
372 data: MISMATCH
373 type: MISMATCH
374 JS: "Mixed"
375 PHP: "mixed"
376 return: JS missing
377 setDefaultDir: JS missing
378 setElementGroup: PHP missing
379 toString: JS missing
380 toggle: PHP missing
381 updateThemeClasses: PHP missing
382 Properties:
383 configCallbacks: JS missing
384 data: JS missing
385 defaultDir: JS missing
386 gatherPreInfuseState: PHP missing
387 getBorders: PHP missing
388 getClosestScrollableContainer: PHP missing
389 getDimensions: PHP missing
390 getDir: PHP missing
391 getDocument: PHP missing
392 getFrameOffset: PHP missing
393 getJQuery: PHP missing
394 getRelativePosition: PHP missing
395 getRootScrollableElement: PHP missing
396 getWindow: PHP missing
397 infuse: PHP missing
398 ownClasses: JS missing
399 reconsiderScrollbars: PHP missing
400 reusePreInfuseDOM: PHP missing
401 scrollIntoView: PHP missing
402 tagName: MISMATCH
403 description: MISMATCH
404 JS: "The name of the HTML tag used by the element. The static value may be ignored if the getTagName() method is overridden."
405 PHP: "HTML tag name. This may be ignored if getTagName() is overridden."
406 unsafeInfuse: PHP missing
407
408FieldLayout: JS/PHP
409 Basic:
410 description: MISMATCH
411 JS: "FieldLayouts are used with FieldsetLayout. Each FieldLayout requires a field-widget, which is a widget that is specified by reference before any optional configuration settings. Field layouts can be configured with help text and/or labels. Labels are aligned in one of four ways: - **left**: The label is placed before the field-widget and aligned with the left margin. A left-alignment is used for forms with many fields. - **right**: The label is placed before the field-widget and aligned to the right margin. A right-alignment is used for long but familiar forms which users tab through, verifying the current field with a quick glance at the label. - **top**: The label is placed above the field-widget. A top-alignment is used for brief forms that users fill out from top to bottom. - **inline**: The label is placed after the field-widget and aligned to the left. An inline-alignment is best used with checkboxes or radio buttons. Help text is accessed via a help icon that appears in the upper right corner of the rendered field layout. Please see the [OOjs UI documentation on MediaWiki] [1] for examples and more information. [1]: https://www.mediawiki.org/wiki/OOjs_UI/Layouts/Fields_and_Fieldsets"
412 PHP: "Layout made of a field and optional label. Available label alignment modes include: - left: Label is before the field and aligned away from it, best for when the user will be scanning for a specific label in a form with many fields - right: Label is before the field and aligned toward it, best for forms the user is very familiar with and will tab through field checking quickly to verify which field they are in - top: Label is before the field and above it, best for when the user will need to fill out all fields from top to bottom in a form with few fields - inline: Label is after the field and aligned toward it, best for small boolean fields like checkboxes or radio buttons"
413 Methods:
414 #constructor: MISMATCH
415 config: MISMATCH
416 $overlay: PHP missing
417 align: MISMATCH
418 description: MISMATCH
419 JS: "Alignment of the label: 'left', 'right', 'top' or 'inline'"
420 PHP: "Alignment mode, either 'left', 'right', 'top' or 'inline'"
421 errors: MISMATCH
422 description: MISMATCH
423 JS: "Error messages about the widget, which will be displayed below the widget. The array may contain strings or HtmlSnippet instances."
424 PHP: "Error messages about the widget, as strings or HtmlSnippet instances."
425 type: MISMATCH
426 JS: "Array"
427 PHP: "array"
428 help: MISMATCH
429 description: MISMATCH
430 JS: "Help text. When help text is specified, a \"help\" icon will appear in the upper-right corner of the rendered field; clicking it will display the text in a popup. For important messages, you are advised to use `notices`, as they are always shown."
431 PHP: "Explanatory text shown as a '?' icon."
432 notices: MISMATCH
433 description: MISMATCH
434 JS: "Notices about the widget, which will be displayed below the widget. The array may contain strings or HtmlSnippet instances."
435 PHP: "Notices about the widget, as strings or HtmlSnippet instances."
436 type: MISMATCH
437 JS: "Array"
438 PHP: "array"
439 getField: MISMATCH
440 description: MISMATCH
441 JS: "Get the widget contained by the field."
442 PHP: "Get the field."
443 isFieldInline: MISMATCH
444 return: MISMATCH
445 type: MISMATCH
446 JS: "boolean"
447 PHP: "bool"
448 makeMessage: MISMATCH
449 visibility: MISMATCH
450 JS: :protected
451 PHP: :private
452 onFieldDisable: PHP missing
453 setAlignment: MISMATCH
454 return: JS missing
455 visibility: MISMATCH
456 JS: :private
457 PHP: :protected
458 setErrors: PHP missing
459 setNotices: PHP missing
460 updateMessages: PHP missing
461 Properties:
462 align: JS missing
463 errors: JS missing
464 fieldWidget: JS missing
465 help: JS missing
466 notices: JS missing
467
468FieldsetLayout: JS/PHP
469 Basic:
470 description: MISMATCH
471 JS: "FieldsetLayouts are composed of one or more {@link FieldLayout FieldLayouts}, which each contain an individual widget and, optionally, a label. Each Fieldset can be configured with a label as well. For more information and examples, please see the [OOjs UI documentation on MediaWiki][1]. @example // Example of a fieldset layout var input1 = new OO.ui.TextInputWidget( { placeholder: 'A text input field' } ); var input2 = new OO.ui.TextInputWidget( { placeholder: 'A text input field' } ); var fieldset = new OO.ui.FieldsetLayout( { label: 'Example of a fieldset layout' } ); fieldset.addItems( [ new OO.ui.FieldLayout( input1, { label: 'Field One' } ), new OO.ui.FieldLayout( input2, { label: 'Field Two' } ) ] ); $( 'body' ).append( fieldset.$element ); [1]: https://www.mediawiki.org/wiki/OOjs_UI/Layouts/Fields_and_Fieldsets"
472 PHP: "Layout made of a fieldset and optional legend. Just add FieldLayout items."
473 Methods:
474 #constructor: MISMATCH
475 config: MISMATCH
476 $overlay: PHP missing
477 help: PHP missing
478 items: MISMATCH
479 description: MISMATCH
480 JS: "An array of fields to add to the fieldset. See FieldLayout for more information about fields."
481 PHP: "Items to add"
482
483FlaggedElement: JS/PHP
484 Basic:
485 description: MISMATCH
486 JS: "The FlaggedElement class is an attribute mixin, meaning that it is used to add additional functionality to an element created by another class. The class provides a \u2018flags\u2019 property assigned the name (or an array of names) of styling flags, which are used to customize the look and feel of a widget to better describe its importance and functionality. The library currently contains the following styling flags for general use: - **progressive**: Progressive styling is applied to convey that the widget will move the user forward in a process. - **destructive**: Destructive styling is applied to convey that the widget will remove something. - **constructive**: Constructive styling is applied to convey that the widget will create something. The flags affect the appearance of the buttons: @example // FlaggedElement is mixed into ButtonWidget to provide styling flags var button1 = new ButtonWidget( { label: 'Constructive', flags: 'constructive' } ); var button2 = new OO.ui.ButtonWidget( { label: 'Destructive', flags: 'destructive' } ); var button3 = new OO.ui.ButtonWidget( { label: 'Progressive', flags: 'progressive' } ); $( 'body' ).append( button1.$element, button2.$element, button3.$element ); {@link OO.ui.ActionWidget ActionWidgets}, which are a special kind of button that execute an action, use these flags: **primary** and **safe**. Please see the [OOjs UI documentation on MediaWiki] [1] for more information. [1]: https://www.mediawiki.org/wiki/OOjs_UI/Elements/Flagged"
487 PHP: "Element with named flags that can be added, removed, listed and checked. A flag, when set, adds a CSS class on the `$element` by combining `oo-ui-flaggedElement-` with the flag name. Flags are primarily useful for styling."
488 Methods:
489 #constructor: PHP missing
490 clearFlags: MISMATCH
491 return: JS missing
492 hasFlag: MISMATCH
493 description: MISMATCH
494 JS: "Check if the specified flag is set."
495 PHP: "Check if a flag is set."
496 return: MISMATCH
497 description: MISMATCH
498 JS: "The flag is set"
499 PHP: "Has flag"
500 initializeFlaggedElement: JS missing
501 setFlaggedElement: PHP missing
502 setFlags: MISMATCH
503 params: MISMATCH
504 flags: MISMATCH
505 description: MISMATCH
506 JS: "A flag name, an array of flag names, or an array keyed by flag name with a boolean value that indicates whether the flag should be added (`true`) or removed (`false`)."
507 PHP: "One or more flags to add, or an array keyed by flag name containing boolean set/remove instructions."
508 type: MISMATCH
509 JS: "string|string[]|array"
510 PHP: "string|array"
511 return: JS missing
512 Properties:
513 flagged: JS missing
514 flags: JS missing
515
516FormLayout: JS/PHP
517 Basic:
518 description: MISMATCH
519 JS: "FormLayouts are used to wrap {@link FieldsetLayout FieldsetLayouts} when you intend to use browser-based form submission for the fields instead of handling them in JavaScript. Form layouts can be configured with an HTML form action, an encoding type, and a method using the action(), enctype(), and method() configs, respectively. See the [OOjs UI documentation on MediaWiki] [1] for more information and examples. Only widgets from the {@link OO.ui.InputWidget InputWidget} family support form submission. It includes standard form elements like {@link OO.ui.CheckboxInputWidget checkboxes}, {@link OO.ui.RadioInputWidget radio buttons} and {@link OO.ui.TextInputWidget text fields}, as well as some fancier controls. Some controls have both regular and InputWidget variants, for example OO.ui.DropdownWidget and OO.ui.DropdownInputWidget \u2013 only the latter support form submission and often have simplified APIs to match the capabilities of HTML forms. See the [OOjs UI Inputs documentation on MediaWiki] [2] for more information about InputWidgets. [1]: https://www.mediawiki.org/wiki/OOjs_UI/Layouts/Forms [2]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Inputs @example // Example of a form layout that wraps a fieldset layout var input1 = new OO.ui.TextInputWidget( { placeholder: 'Username' } ); var input2 = new OO.ui.TextInputWidget( { placeholder: 'Password', type: 'password' } ); var submit = new OO.ui.ButtonInputWidget( { label: 'Submit' } ); var fieldset = new OO.ui.FieldsetLayout( { label: 'A form layout' } ); fieldset.addItems( [ new OO.ui.FieldLayout( input1, { label: 'Username', align: 'top' } ), new OO.ui.FieldLayout( input2, { label: 'Password', align: 'top' } ), new OO.ui.FieldLayout( submit ) ] ); var form = new OO.ui.FormLayout( { items: [ fieldset ], action: '/api/formhandler', method: 'get' } ) $( 'body' ).append( form.$element );"
520 PHP: "Layout with an HTML form."
521 Methods:
522 #constructor: MISMATCH
523 config: MISMATCH
524 items: MISMATCH
525 description: MISMATCH
526 JS: "Fieldset layouts to add to the form layout."
527 PHP: "Items to add"
528 onFormSubmit: PHP missing
529
530GroupElement: JS/PHP
531 Basic:
532 description: MISMATCH
533 JS: "Any OOjs UI widget that contains other widgets (such as {@link ButtonWidget buttons} or {@link OO.ui.OptionWidget options}) mixes in GroupElement. Adding, removing, and clearing items from the group is done through the interface the class provides. For more information, please see the [OOjs UI documentation on MediaWiki] [1]. [1]: https://www.mediawiki.org/wiki/OOjs_UI/Elements/Groups"
534 PHP: "Element containing a sequence of child elements."
535 mixins: MISMATCH
536 JS: ["OO.EmitterList"]
537 PHP: {}
538 Methods:
539 #constructor: PHP missing
540 addItems: MISMATCH
541 description: MISMATCH
542 JS: "Add items to the group. Items will be added to the end of the group array unless the optional `index` parameter specifies a different insertion point. Adding an existing item will move it to the end of the array or the point specified by the `index`."
543 PHP: "Add items. Adding an existing item will move it."
544 params: MISMATCH
545 index: MISMATCH
546 description: MISMATCH
547 JS: "Index of the insertion point"
548 PHP: "Index to insert items at"
549 items: MISMATCH
550 description: MISMATCH
551 JS: "An array of items to add to the group"
552 PHP: "Items"
553 return: JS missing
554 clearItems: MISMATCH
555 description: MISMATCH
556 JS: "Clear all items from the group. Cleared items are detached from the DOM, not removed, so that they may be reused. To remove only a subset of items from a group, use the removeItems() method."
557 PHP: "Clear all items. Items will be detached, not removed, so they can be used later."
558 return: JS missing
559 getItemFromData: PHP missing
560 getItems: JS missing
561 getItemsFromData: PHP missing
562 initializeGroupElement: JS missing
563 insertItemElements: PHP missing
564 isEmpty: JS missing
565 removeItems: MISMATCH
566 description: MISMATCH
567 JS: "Remove the specified items from a group. Removed items are detached (not removed) from the DOM so that they may be reused. To remove all items from a group, you may wish to use the clearItems() method instead."
568 PHP: "Remove items."
569 params: MISMATCH
570 items: MISMATCH
571 description: MISMATCH
572 JS: "An array of items to remove"
573 PHP: "Items to remove"
574 return: JS missing
575 setGroupElement: PHP missing
576 Properties:
577 group: JS missing
578 items: JS missing
579
580HorizontalLayout: JS/PHP
581 Basic:
582 description: MISMATCH
583 JS: "HorizontalLayout arranges its contents in a single line (using `display: inline-block` for its items), with small margins between them. Convenient when you need to put a number of block-level widgets on a single line next to each other. Note that inline elements, such as ButtonWidgets, do not need this wrapper. @example // HorizontalLayout with a text input and a label var layout = new OO.ui.HorizontalLayout( { items: [ new OO.ui.LabelWidget( { label: 'Label' } ), new OO.ui.TextInputWidget( { value: 'Text' } ) ] } ); $( 'body' ).append( layout.$element );"
584 PHP: "HorizontalLayout arranges its contents in a single line (using `display: inline-block` for its items), with small margins between them."
585
586HtmlSnippet: JS/PHP
587 Basic:
588 description: MISMATCH
589 JS: "Wraps an HTML snippet for use with configuration values which default to strings. This bypasses the default html-escaping done to string values."
590 PHP: "Wraps a HTML snippet for use with Tag::appendContent() and Tag::prependContent()."
591 Methods:
592 #constructor: MISMATCH
593 params: MISMATCH
594 content: MISMATCH
595 description: MISMATCH
596 JS: "HTML content"
597 PHP: ""
598 __toString: JS missing
599 toString: PHP missing
600 Properties:
601 content: JS missing
602
603IconElement: JS/PHP
604 Basic:
605 description: MISMATCH
606 JS: "IconElement is often mixed into other classes to generate an icon. Icons are graphics, about the size of normal text. They are used to aid the user in locating a control or to convey information in a space-efficient way. See the [OOjs UI documentation on MediaWiki] [1] for a list of icons included in the library. [1]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Icons,_Indicators,_and_LabelsIcons()"
607 PHP: "Element containing an icon. Icons are graphics, about the size of normal text. They can be used to aid the user in locating a control or convey information in a more space efficient way. Icons should rarely be used without labels; such as in a toolbar where space is at a premium or within a context where the meaning is very clear to the user."
608 Methods:
609 #constructor: PHP missing
610 getIcon: MISMATCH
611 description: MISMATCH
612 JS: "Get the symbolic name of the icon."
613 PHP: "Get icon name."
614 getIconElement: JS missing
615 getIconTitle: PHP missing
616 initializeIconElement: JS missing
617 setIcon: MISMATCH
618 description: MISMATCH
619 JS: "Set icon by symbolic name (e.g., \u2018remove\u2019 or \u2018menu\u2019). Use `null` to remove an icon. The icon parameter can also be set to a map of icon names. See the icon() config setting for an example."
620 PHP: "Set icon name."
621 params: MISMATCH
622 icon: MISMATCH
623 description: MISMATCH
624 JS: "A symbolic icon name, a {@link icon() map of icon names} keyed by language code, or `null` to remove the icon."
625 PHP: "Symbolic icon name"
626 type: MISMATCH
627 JS: "Object|string|null"
628 PHP: "string|null"
629 return: JS missing
630 setIconElement: PHP missing
631 setIconTitle: PHP missing
632 Properties:
633 icon: MISMATCH
634 description: MISMATCH
635 JS: "The symbolic name of the icon (e.g., \u2018remove\u2019 or \u2018menu\u2019), or a map of symbolic names. A map is used for i18n purposes and contains a `default` icon name and additional names keyed by language code. The `default` name is used when no icon is keyed by the user's language. Example of an i18n map: { default: 'bold-a', en: 'bold-b', de: 'bold-f' } Note: the static property will be overridden if the icon() configuration is used."
636 PHP: ""
637 static: PHP missing
638 type: MISMATCH
639 JS: "Object|string"
640 PHP: "Tag"
641 iconName: JS missing
642 iconTitle: PHP missing
643
644IconWidget: JS/PHP
645 Basic:
646 description: MISMATCH
647 JS: "IconWidget is a generic widget for {@link IconElement icons}. In general, IconWidgets should be used with OO.ui.LabelWidget, which creates a label that identifies the icon\u2019s function. See the [OOjs UI documentation on MediaWiki] [1] for a list of icons included in the library. @example // An icon widget with a label var myIcon = new OO.ui.IconWidget( { icon: 'help', iconTitle: 'Help' } ); // Create a label. var iconLabel = new OO.ui.LabelWidget( { label: 'Help' } ); $( 'body' ).append( myIcon.$element, iconLabel.$element ); [1]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Icons,_Indicators,_and_LabelsIcons()"
648 PHP: "Icon widget. See IconElement for more information."
649
650IndicatorElement: JS/PHP
651 Basic:
652 description: MISMATCH
653 JS: "IndicatorElement is often mixed into other classes to generate an indicator. Indicators are small graphics that are generally used in two ways: - To draw attention to the status of an item. For example, an indicator might be used to show that an item in a list has errors that need to be resolved. - To clarify the function of a control that acts in an exceptional way (a button that opens a menu instead of performing an action directly, for example). For a list of indicators included in the library, please see the [OOjs UI documentation on MediaWiki] [1]. [1]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Icons,_Indicators,_and_LabelsIndicators()"
654 PHP: "Element containing an indicator. Indicators are graphics, smaller than normal text. They can be used to describe unique status or behavior. Indicators should only be used in exceptional cases; such as a button that opens a menu instead of performing an action directly, or an item in a list which has errors that need to be resolved."
655 Methods:
656 #constructor: PHP missing
657 getIndicator: MISMATCH
658 description: MISMATCH
659 JS: "Get the symbolic name of the indicator (e.g., \u2018alert\u2019 or \u2018down\u2019)."
660 PHP: "Get indicator name."
661 getIndicatorElement: JS missing
662 getIndicatorTitle: PHP missing
663 initializeIndicatorElement: JS missing
664 setIndicator: MISMATCH
665 description: MISMATCH
666 JS: "Set the indicator by its symbolic name: \u2018alert\u2019, \u2018down\u2019, \u2018next\u2019, \u2018previous\u2019, \u2018required\u2019, \u2018up\u2019. Use `null` to remove the indicator."
667 PHP: "Set indicator name."
668 params: MISMATCH
669 indicator: MISMATCH
670 description: MISMATCH
671 JS: "Symbolic name of indicator, or `null` for no indicator"
672 PHP: "Symbolic name of indicator to use or null for no indicator"
673 return: JS missing
674 setIndicatorElement: PHP missing
675 setIndicatorTitle: PHP missing
676 Properties:
677 indicator: MISMATCH
678 description: MISMATCH
679 JS: "Symbolic name of the indicator (e.g., \u2018alert\u2019 or \u2018down\u2019). The static property will be overridden if the indicator() configuration is used."
680 PHP: ""
681 static: PHP missing
682 type: MISMATCH
683 JS: "string|null"
684 PHP: "Tag"
685 indicatorName: JS missing
686 indicatorTitle: PHP missing
687
688IndicatorWidget: JS/PHP
689 Basic:
690 description: MISMATCH
691 JS: "IndicatorWidgets create indicators, which are small graphics that are generally used to draw attention to the status of an item or to clarify the function of a control. For a list of indicators included in the library, please see the [OOjs UI documentation on MediaWiki][1]. @example // Example of an indicator widget var indicator1 = new IndicatorWidget( { indicator: 'alert' } ); // Create a fieldset layout to add a label var fieldset = new OO.ui.FieldsetLayout(); fieldset.addItems( [ new OO.ui.FieldLayout( indicator1, { label: 'An alert indicator:' } ) ] ); $( 'body' ).append( fieldset.$element ); [1]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Icons,_Indicators,_and_LabelsIndicators()"
692 PHP: "Indicator widget. See IndicatorElement for more information."
693
694InputWidget: JS/PHP
695 Basic:
696 description: MISMATCH
697 JS: "InputWidget is the base class for all input widgets, which include {@link TextInputWidget text inputs}, {@link OO.ui.CheckboxInputWidget checkbox inputs}, {@link OO.ui.RadioInputWidget radio inputs}, and {@link OO.ui.ButtonInputWidget button inputs}. See the [OOjs UI documentation on MediaWiki] [1] for more information and examples. [1]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Inputs"
698 PHP: "Base class for input widgets."
699 Methods:
700 #constructor: MISMATCH
701 config: MISMATCH
702 dir: MISMATCH
703 description: MISMATCH
704 JS: "The directionality of the input (ltr/rtl)."
705 PHP: "The directionality of the input (ltr/rtl)"
706 inputFilter: PHP missing
707 name: MISMATCH
708 description: MISMATCH
709 JS: "The value of the input\u2019s HTML `name` attribute."
710 PHP: "HTML input name"
711 value: MISMATCH
712 description: MISMATCH
713 JS: "The value of the input."
714 PHP: "Input value"
715 blur: PHP missing
716 cleanUpValue: MISMATCH
717 visibility: MISMATCH
718 JS: :private
719 PHP: :protected
720 focus: PHP missing
721 getInputElement: MISMATCH
722 description: MISMATCH
723 JS: "Get input element. Subclasses of InputWidget use the `config` parameter to produce different elements in different circumstances. The element must have a `value` property (like form elements)."
724 PHP: "Get input element."
725 getInputId: MISMATCH
726 return: MISMATCH
727 type: MISMATCH
728 JS: "string"
729 PHP: "{string}"
730 onEdit: PHP missing
731 setDir: MISMATCH
732 return: JS missing
733 setValue: MISMATCH
734 return: JS missing
735 simulateLabelClick: PHP missing
736 Properties:
737 input: JS missing
738 value: JS missing
739
740LabelElement: JS/PHP
741 Basic:
742 description: MISMATCH
743 JS: "LabelElement is often mixed into other classes to generate a label, which helps identify the function of an interface element. See the [OOjs UI documentation on MediaWiki] [1] for more information. [1]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Icons,_Indicators,_and_LabelsLabels()"
744 PHP: "Element containing a label."
745 Methods:
746 #constructor: PHP missing
747 getLabel: MISMATCH
748 return: MISMATCH
749 description: MISMATCH
750 JS: "Label nodes; text; a function that returns nodes or text; or null for no label"
751 PHP: "Label text"
752 type: MISMATCH
753 JS: "string|null"
754 PHP: "string|HtmlSnippet|null"
755 initializeLabelElement: JS missing
756 setHighlightedQuery: PHP missing
757 setLabel: MISMATCH
758 params: MISMATCH
759 label: MISMATCH
760 description: MISMATCH
761 JS: "Label nodes; text; a function that returns nodes or text; or null for no label"
762 PHP: "Label text"
763 type: MISMATCH
764 JS: "Tag|string|HtmlSnippet|Function|null"
765 PHP: "string|HtmlSnippet|null"
766 return: JS missing
767 setLabelContent: PHP missing
768 setLabelElement: PHP missing
769 Properties:
770 highlightQuery: PHP missing
771 label: MISMATCH
772 description: MISMATCH
773 JS: "The label text. The label can be specified as a plaintext string, a function that will produce a string in the future, or `null` for no label. The static value will be overridden if a label is specified with the label() config option."
774 PHP: ""
775 static: PHP missing
776 type: MISMATCH
777 JS: "string|null"
778 PHP: "Tag"
779 labelValue: JS missing
780
781LabelWidget: JS/PHP
782 Basic:
783 description: MISMATCH
784 JS: "LabelWidgets help identify the function of interface elements. Each LabelWidget can be configured with a `label` option that is set to a string, a label node, or a function: - String: a plaintext string - Tag selection: a Tag selection, used for anything other than a plaintext label, e.g., a label that includes a link or special styling, such as a gray color or additional graphical elements. - Function: a function that will produce a string in the future. Functions are used in cases where the value of the label is not currently defined. In addition, the LabelWidget can be associated with an {@link InputWidget input widget}, which will come into focus when the label is clicked. @example // Examples of LabelWidgets var label1 = new OO.ui.LabelWidget( { label: 'plaintext label' } ); var label2 = new OO.ui.LabelWidget( { label: $( '<a href=\"default.html\">Tag label</a>' ) } ); // Create a fieldset layout with fields for each example var fieldset = new OO.ui.FieldsetLayout(); fieldset.addItems( [ new OO.ui.FieldLayout( label1 ), new OO.ui.FieldLayout( label2 ) ] ); $( 'body' ).append( fieldset.$element );"
785 PHP: "Label widget."
786 mixins: MISMATCH
787 JS: ["LabelElement", "TitledElement"]
788 PHP: ["LabelElement"]
789 Methods:
790 #constructor: MISMATCH
791 config: MISMATCH
792 input: MISMATCH
793 description: MISMATCH
794 JS: "{@link InputWidget Input widget} that uses the label. Clicking the label will focus the specified input field."
795 PHP: "Input widget this label is for"
796 Properties:
797 input: JS missing
798
799Layout: JS/PHP
800 Basic:
801 description: MISMATCH
802 JS: "Layouts are containers for elements and are used to arrange other widgets of arbitrary type in a way that is centrally controlled and can be updated dynamically. Layouts can be, and usually are, combined. See {@link FieldsetLayout FieldsetLayout}, {@link OO.ui.FieldLayout FieldLayout}, {@link OO.ui.FormLayout FormLayout}, {@link OO.ui.PanelLayout PanelLayout}, {@link OO.ui.StackLayout StackLayout}, {@link OO.ui.PageLayout PageLayout}, {@link OO.ui.HorizontalLayout HorizontalLayout}, and {@link OO.ui.BookletLayout BookletLayout} for more information and examples."
803 PHP: "Container for elements."
804
805MediaWikiTheme: JS/PHP
806 Methods:
807 #constructor: PHP missing
808
809PanelLayout: JS/PHP
810 Basic:
811 description: MISMATCH
812 JS: "PanelLayouts expand to cover the entire area of their parent. They can be configured with scrolling, padding, and a frame, and are often used together with {@link StackLayout StackLayouts}. @example // Example of a panel layout var panel = new OO.ui.PanelLayout( { expanded: false, framed: true, padded: true, $content: $( '<p>A panel layout with padding and a frame.</p>' ) } ); $( 'body' ).append( panel.$element );"
813 PHP: "Layout that expands to cover the entire area of its parent, with optional scrolling and padding."
814 Methods:
815 #constructor: MISMATCH
816 config: MISMATCH
817 expanded: MISMATCH
818 description: MISMATCH
819 JS: "Expand the panel to fill the entire parent element."
820 PHP: "Expand size to fill the entire parent element"
821 framed: MISMATCH
822 description: MISMATCH
823 JS: "Render the panel with a frame to visually separate it from outside content."
824 PHP: "Wrap in a frame to visually separate from outside content"
825 padded: MISMATCH
826 description: MISMATCH
827 JS: "Add padding between the content and the edges of the panel."
828 PHP: "Pad the content from the edges"
829 focus: PHP missing
830
831ProgressBarWidget: JS/PHP
832 Basic:
833 description: MISMATCH
834 JS: "Progress bars visually display the status of an operation, such as a download, and can be either determinate or indeterminate: - **determinate** process bars show the percent of an operation that is complete. - **indeterminate** process bars use a visual display of motion to indicate that an operation is taking place. Because the extent of an indeterminate operation is unknown, the bar does not use percentages. The value of the `progress` configuration determines whether the bar is determinate or indeterminate. @example // Examples of determinate and indeterminate progress bars. var progressBar1 = new ProgressBarWidget( { progress: 33 } ); var progressBar2 = new OO.ui.ProgressBarWidget(); // Create a FieldsetLayout to layout progress bars var fieldset = new OO.ui.FieldsetLayout; fieldset.addItems( [ new OO.ui.FieldLayout( progressBar1, {label: 'Determinate', align: 'top'}), new OO.ui.FieldLayout( progressBar2, {label: 'Indeterminate', align: 'top'}) ] ); $( 'body' ).append( fieldset.$element );"
835 PHP: ""
836 Methods:
837 #constructor: MISMATCH
838 config: MISMATCH
839 progress: MISMATCH
840 default: PHP missing
841 description: MISMATCH
842 JS: "The type of progress bar (determinate or indeterminate). To create a determinate progress bar, specify a number that reflects the initial percent complete. By default, the progress bar is indeterminate."
843 PHP: "The type of progress bar (determinate or indeterminate). To create a determinate progress bar,specify a number that reflects the initial percent complete. By default, the progress bar is indeterminate."
844 type: MISMATCH
845 JS: "number|boolean"
846 PHP: "bool|int"
847 getProgress: MISMATCH
848 description: MISMATCH
849 JS: "Get the percent of the progress that has been completed. Indeterminate progresses will return `false`."
850 PHP: ""
851 return: MISMATCH
852 description: MISMATCH
853 JS: "Progress percent"
854 PHP: ""
855 type: MISMATCH
856 JS: "number|boolean"
857 PHP: "bool|int"
858 setProgress: MISMATCH
859 description: MISMATCH
860 JS: "Set the percent of the process completed or `false` for an indeterminate process."
861 PHP: ""
862 params: MISMATCH
863 progress: MISMATCH
864 description: MISMATCH
865 JS: "Progress percent or `false` for indeterminate"
866 PHP: ""
867 type: MISMATCH
868 JS: "number|boolean"
869 PHP: "bool|int"
870 Properties:
871 bar: JS missing
872 progress: JS missing
873
874RadioInputWidget: JS/PHP
875 Basic:
876 description: MISMATCH
877 JS: "RadioInputWidget creates a single radio button. Because radio buttons are usually used as a set, in most cases you will want to use a {@link RadioSelectWidget radio select} with {@link OO.ui.RadioOptionWidget radio options} instead of this class. For more information, please see the [OOjs UI documentation on MediaWiki][1]. This widget can be used inside an HTML form, such as a OO.ui.FormLayout. @example // An example of selected, unselected, and disabled radio inputs var radio1 = new OO.ui.RadioInputWidget( { value: 'a', selected: true } ); var radio2 = new OO.ui.RadioInputWidget( { value: 'b' } ); var radio3 = new OO.ui.RadioInputWidget( { value: 'c', disabled: true } ); // Create a fieldset layout with fields for each radio button. var fieldset = new OO.ui.FieldsetLayout( { label: 'Radio inputs' } ); fieldset.addItems( [ new OO.ui.FieldLayout( radio1, { label: 'Selected', align: 'inline' } ), new OO.ui.FieldLayout( radio2, { label: 'Unselected', align: 'inline' } ), new OO.ui.FieldLayout( radio3, { label: 'Disabled', align: 'inline' } ), ] ); $( 'body' ).append( fieldset.$element ); [1]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Inputs"
878 PHP: "Radio input widget."
879 mixins: MISMATCH
880 JS: ["a"]
881 PHP: {}
882 Methods:
883 #constructor: MISMATCH
884 config: MISMATCH
885 selected: MISMATCH
886 description: MISMATCH
887 JS: "Select the radio button initially. By default, the radio button is not selected."
888 PHP: "Whether the radio button is initially selected"
889 setSelected: MISMATCH
890 params: MISMATCH
891 state: MISMATCH
892 description: MISMATCH
893 JS: "`true` for selected"
894 PHP: "Whether the button is selected"
895 return: JS missing
896
897RadioSelectInputWidget: JS/PHP
898 Basic:
899 description: MISMATCH
900 JS: "RadioSelectInputWidget is a {@link RadioSelectWidget RadioSelectWidget} intended to be used within an HTML form, such as a OO.ui.FormLayout. The selected value is synchronized with the value of a hidden HTML `input` tag. Please see the [OOjs UI documentation on MediaWiki][1] for more information about input widgets. This and OO.ui.DropdownInputWidget support the same configuration options. @example // Example: A RadioSelectInputWidget with three options var radioSelectInput = new OO.ui.RadioSelectInputWidget( { options: [ { data: 'a', label: 'First' }, { data: 'b', label: 'Second'}, { data: 'c', label: 'Third' } ] } ); $( 'body' ).append( radioSelectInput.$element ); [1]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Inputs"
901 PHP: "Multiple radio buttons input widget. Intended to be used within a FormLayout."
902 Methods:
903 #constructor: MISMATCH
904 config: MISMATCH
905 options: MISMATCH
906 default: PHP missing
907 description: MISMATCH
908 JS: "Array of menu options in the format `{ data: \u2026, label: \u2026 }`"
909 PHP: "Array of menu options in the format `[ 'data' => \u2026, 'label' => \u2026 ]`"
910 type: MISMATCH
911 JS: "Object[]"
912 PHP: "array[]"
913 onMenuSelect: PHP missing
914 setOptions: MISMATCH
915 params: MISMATCH
916 options: MISMATCH
917 description: MISMATCH
918 JS: "Array of menu options in the format `{ data: \u2026, label: \u2026 }`"
919 PHP: "Array of menu options in the format `[ 'data' => \u2026, 'label' => \u2026 ]`"
920 type: MISMATCH
921 JS: "Object[]"
922 PHP: "array[]"
923 return: JS missing
924 Properties:
925 fields: JS missing
926 name: JS missing
927
928TabIndexedElement: JS/PHP
929 Basic:
930 description: MISMATCH
931 JS: "The TabIndexedElement class is an attribute mixin used to add additional functionality to an element created by another class. The mixin provides a \u2018tabIndex\u2019 property, which specifies the order in which users will navigate through the focusable elements via the \"tab\" key. @example // TabIndexedElement is mixed into the ButtonWidget class // to provide a tabIndex property. var button1 = new ButtonWidget( { label: 'fourth', tabIndex: 4 } ); var button2 = new OO.ui.ButtonWidget( { label: 'second', tabIndex: 2 } ); var button3 = new OO.ui.ButtonWidget( { label: 'third', tabIndex: 3 } ); var button4 = new OO.ui.ButtonWidget( { label: 'first', tabIndex: 1 } ); $( 'body' ).append( button1.$element, button2.$element, button3.$element, button4.$element );"
932 PHP: "Element supporting \"sequential focus navigation\" using the 'tabindex' attribute."
933 Methods:
934 #constructor: PHP missing
935 getTabIndex: MISMATCH
936 description: MISMATCH
937 JS: "Get the value of the tabindex."
938 PHP: "Get tab index value."
939 return: MISMATCH
940 description: MISMATCH
941 JS: "Tabindex value"
942 PHP: "Tab index value"
943 initializeTabIndexedElement: JS missing
944 onTabIndexedElementDisable: PHP missing
945 setTabIndex: MISMATCH
946 description: MISMATCH
947 JS: "Set the value of the tabindex."
948 PHP: "Set tab index value."
949 params: MISMATCH
950 tabIndex: MISMATCH
951 description: MISMATCH
952 JS: "Tabindex value, or `null` for no tabindex"
953 PHP: "Tab index value or null for no tab index"
954 return: JS missing
955 setTabIndexedElement: PHP missing
956 updateTabIndex: MISMATCH
957 description: MISMATCH
958 JS: "Update the `tabindex` attribute, in case of changes to tab index or disabled state."
959 PHP: "Update the tabIndex attribute, in case of changes to tabIndex or disabled state."
960 return: JS missing
961 visibility: MISMATCH
962 JS: :private
963 PHP: :public
964 Properties:
965 tabIndex: JS missing
966 tabIndexed: JS missing
967
968TextInputWidget: JS/PHP
969 Basic:
970 description: MISMATCH
971 JS: "TextInputWidgets, like HTML text inputs, can be configured with options that customize the size of the field as well as its presentation. In addition, these widgets can be configured with {@link IconElement icons}, {@link OO.ui.mixin.IndicatorElement indicators}, an optional validation-pattern (used to determine if an input value is valid or not) and an input filter, which modifies incoming values rather than validating them. Please see the [OOjs UI documentation on MediaWiki] [1] for more information and examples. This widget can be used inside an HTML form, such as a OO.ui.FormLayout. @example // Example of a text input widget var textInput = new OO.ui.TextInputWidget( { value: 'Text input' } ) $( 'body' ).append( textInput.$element ); [1]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Inputs"
972 PHP: "Input widget with a text field."
973 mixins: MISMATCH
974 JS: ["IconElement", "IndicatorElement", "LabelElement"]
975 PHP: ["IconElement", "IndicatorElement"]
976 Methods:
977 #constructor: MISMATCH
978 config: MISMATCH
979 autocomplete: MISMATCH
980 description: MISMATCH
981 JS: "Should the browser support autocomplete for this field"
982 PHP: "If the field should support autocomplete or not"
983 autofocus: MISMATCH
984 description: MISMATCH
985 JS: "Use an HTML `autofocus` attribute to instruct the browser to focus this widget."
986 PHP: "Ask the browser to focus this widget, using the 'autofocus' HTML attribute"
987 autosize: PHP missing
988 labelPosition: PHP missing
989 maxLength: MISMATCH
990 description: MISMATCH
991 JS: "Maximum number of characters allowed in the input."
992 PHP: "Maximum allowed number of characters to input"
993 maxRows: PHP missing
994 readOnly: MISMATCH
995 description: MISMATCH
996 JS: "Prevent changes to the value of the text input."
997 PHP: "Prevent changes"
998 rows: MISMATCH
999 description: MISMATCH
1000 JS: "If multiline, number of visible lines in textarea. If used with `autosize`, specifies minimum number of rows to display."
1001 PHP: "If multiline, number of visible lines in textarea"
1002 type: MISMATCH
1003 JS: "number"
1004 PHP: "int"
1005 type: MISMATCH
1006 description: MISMATCH
1007 JS: "The value of the HTML `type` attribute: 'text', 'password', 'search', 'email', 'url' or 'number'. Ignored if `multiline` is true. Some values of `type` result in additional behaviors: - `search`: implies `icon: 'search'` and `indicator: 'clear'`; when clicked, the indicator empties the text field"
1008 PHP: "HTML tag `type` attribute: 'text', 'password', 'search', 'email', 'url' or 'number'. Ignored if `multiline` is true. Some values of `type` result in additional behaviors: - `search`: implies `icon: 'search'` and `indicator: 'clear'`; when clicked, the indicator empties the text field"
1009 validate: PHP missing
1010 adjustSize: PHP missing
1011 encapsulateContent: PHP missing
1012 getInputLength: PHP missing
1013 getRange: PHP missing
1014 getSaneType: PHP missing
1015 getValidity: PHP missing
1016 insertContent: PHP missing
1017 installParentChangeDetector: PHP missing
1018 isAutosizing: PHP missing
1019 isMultiline: MISMATCH
1020 description: MISMATCH
1021 JS: "Check if the input supports multiple lines."
1022 PHP: "Check if input supports multiple lines."
1023 isReadOnly: MISMATCH
1024 description: MISMATCH
1025 JS: "Check if the input is {@link readOnly() read-only}."
1026 PHP: "Check if the widget is read-only."
1027 isRequired: MISMATCH
1028 description: MISMATCH
1029 JS: "Check if the input is {@link required() required}."
1030 PHP: "Check if the widget is required."
1031 moveCursorToEnd: PHP missing
1032 moveCursorToStart: PHP missing
1033 onBlur: PHP missing
1034 onChange: PHP missing
1035 onDebouncedChange: PHP missing
1036 onDisable: PHP missing
1037 onElementAttach: PHP missing
1038 onFocus: PHP missing
1039 onIconMouseDown: PHP missing
1040 onIndicatorMouseDown: PHP missing
1041 onKeyPress: PHP missing
1042 positionLabel: PHP missing
1043 select: PHP missing
1044 selectRange: PHP missing
1045 setLabelPosition: PHP missing
1046 setReadOnly: MISMATCH
1047 description: MISMATCH
1048 JS: "Set the {@link readOnly() read-only} state of the input."
1049 PHP: "Set the read-only state of the widget. This should probably change the widget's appearance and prevent it from being used."
1050 return: JS missing
1051 setRequired: MISMATCH
1052 description: MISMATCH
1053 JS: "Set the {@link required() required} state of the input."
1054 PHP: "Set the required state of the widget."
1055 return: JS missing
1056 setValidation: PHP missing
1057 setValidityFlag: PHP missing
1058 updatePosition: PHP missing
1059 updateSearchIndicator: PHP missing
1060 Properties:
1061 multiline: JS missing
1062 readOnly: JS missing
1063 required: JS missing
1064 type: JS missing
1065
1066Theme: JS/PHP
1067 Methods:
1068 #constructor: PHP missing
1069 getDialogTransitionDuration: PHP missing
1070 queueUpdateElementClasses: PHP missing
1071 setSingleton: JS missing
1072 singleton: JS missing
1073 updateElementClasses: MISMATCH
1074 return: JS missing
1075 updateQueuedElementClasses: PHP missing
1076
1077TitledElement: JS/PHP
1078 Basic:
1079 description: MISMATCH
1080 JS: "TitledElement is mixed into other classes to provide a `title` attribute. Titles are rendered by the browser and are made visible when the user moves the mouse over the element. Titles are not visible on touch devices. @example // TitledElement provides a 'title' attribute to the // ButtonWidget class var button = new ButtonWidget( { label: 'Button with Title', title: 'I am a button' } ); $( 'body' ).append( button.$element );"
1081 PHP: "Element with a title. Titles are rendered by the browser and are made visible when hovering the element. Titles are not visible on touch devices."
1082 Methods:
1083 #constructor: PHP missing
1084 initializeTitledElement: JS missing
1085 setTitle: MISMATCH
1086 params: MISMATCH
1087 title: MISMATCH
1088 description: MISMATCH
1089 JS: "Title text, a function that returns text, or `null` for no title"
1090 PHP: "Title text or null for no title"
1091 return: JS missing
1092 setTitledElement: PHP missing
1093 Properties:
1094 title: MISMATCH
1095 description: MISMATCH
1096 JS: "The title text, a function that returns text, or `null` for no title. The value of the static property is overridden if the title() config option is used."
1097 PHP: "Title text."
1098 static: PHP missing
1099 type: MISMATCH
1100 JS: "string|null"
1101 PHP: "string"
1102 titled: JS missing
1103
1104Widget: JS/PHP
1105 Basic:
1106 description: MISMATCH
1107 JS: "Widgets are compositions of one or more OOjs UI elements that users can both view and interact with. All widgets can be configured and modified via a standard API, and their state can change dynamically according to a model."
1108 PHP: "User interface control."
1109 Methods:
1110 #constructor: MISMATCH
1111 config: MISMATCH
1112 disabled: MISMATCH
1113 description: MISMATCH
1114 JS: "Disable the widget. Disabled widgets cannot be used and their appearance reflects this state."
1115 PHP: "Disable"
1116 isDisabled: MISMATCH
1117 return: MISMATCH
1118 description: MISMATCH
1119 JS: "Widget is disabled"
1120 PHP: "Button is disabled"
1121 setDisabled: MISMATCH
1122 description: MISMATCH
1123 JS: "Set the 'disabled' state of the widget. When a widget is disabled, it cannot be used and its appearance is updated to reflect this state."
1124 PHP: "Set the disabled state of the widget. This should probably change the widgets' appearance and prevent it from being used."
1125 return: JS missing
1126 updateDisabled: PHP missing
1127 Properties:
1128 disabled: JS missing
1129 supportsSimpleLabel: MISMATCH
1130 description: MISMATCH
1131 JS: "Whether this widget will behave reasonably when wrapped in an HTML `<label>`. If this is true, wrappers such as FieldLayout may use a `<label>` instead of implementing own label click handling."
1132 PHP: "Whether this widget will behave reasonably when wrapped in a HTML `<label>`. If this is true, wrappers such as FieldLayout may use a `<label>`."

There are 358 "MISMATCH"-es right now. Ideally, there would be zero. But let's say we can close this task when we have… fewer than 50?

Usually, these need to be simply fixed in PHP or JS – many are trivial like different capitalisation or missing full stop. Sometimes it's a pattern of differences that should be ignored, by adding it to the 'sanitize_description' method in doccomparer.rb.

Various items are also missing in JS or PHP only. "PHP missing" is usually okay (many methods and options are indeed simply not implemented in PHP). "JS missing" is usually not okay (most cases are instances of T88629: Document public properties).

Event Timeline

matmarex added a project: good first task.

This is really low priority. Something to do when someone's feeling bored :)

Hi. Brand new contributer here, and looking for a first task to get a feel for the work flow. Is this still open?

Sure! It's also kind of boring, but go ahead if you don't mind that ;)

I think boring is good for this first one. Is there an IRC I can ask you a couple questions in?

OOjs UI development is in #wikimedia-editing on freenode. If no one is around, ask on #wikimedia-dev too. See: https://meta.wikimedia.org/wiki/IRC/Channels

Hi I am Jenniline. I am interested in solving this issue so as to apply under the project " Develop an editing widget for Proofread Page extension for Google Summer of code 2020".

I see this is a Documentation issue. I am willing to work on it. I will like to know if I can be assigned this issue.
Thanks

Hi, I was setting up Gerrit for this issue. After cloning the issue to my local system I realised that the file named in this issue is not found in the clone of the project. The file to be edited is bin/doccomparer.rb > compare.txt. And from my own understanding, compare.txt is the file that needs these changes. However, compare.txt is not found in the bin/doccomparer.rb directory. I have also searched for it in order directories but it is nowhere to be found.

I have the feeling the filename has been changed from compare.txt to something else. If so can someone please help me with the correct filename for this issue?
Any other additional information on this issue will be appreciated thanks.

@Samwilson
@Aklapper

This comment was removed by Jenniline.

@Jenniline bin/doccomparer.rb is an executable ruby script in the bin directory. The script generates output. > compare.txt is bash scripting for "redirect the output of doccomparer.rb to compare.txt"

The result is a list of all the differences detected in the two sets of documentation. A 2017 version of that output is listed in the description of this ticket. You need to lookup the files yourself, based on the widget names listed in that output. It shouldn't be too hard to find.

The first for instance is AccessKeyedElement and the files that define those elements (and contains the documentation) in JS and PHP are:
src/mixins/AccessKeyedElement.js
php/mixins/AccessKeyedElement.php

Hi @Samwilson and @Jenniline,
I also wants to contribute in this project but I don't understand that how I clone this file(s) in my local system.
Please help.

Hi guys, I'm Fabrice, I really want to work on this task because simple tasks like this usually get ignored and the problem not solved, but I'm somehow faced with the same issue as @Suchit1999

Hi guys, I'm Fabrice, I really want to work on this task because simple tasks like this usually get ignored and the problem not solved, but I'm somehow faced with the same issue as @Suchit1999

Yes, we relly want to contribute in wikimedia but we require guidance to do all the task.
So, Please help.

I don't understand that how I clone this file(s) in my local system.

Under "Tags" this task says OOUI. Click it and go to its project description. It has a link to more info, including source code location and how to use Gerrit.

(Please also note that general Gerrit support unrelated to this task is out of scope for this task, in case there are problems with Gerrit itself. Thanks!)

If nobody is working on this, I'll give it a shot :)

Okay, quite a lot (not all though) of the Class properties that are marked as JS missing in the output of bin/doccomparer.rb have already been declared and documented in the Javascript code. The bin/doccomparer.rb script doesn't seem to pick up these variables and reports them in the output. This seems to be a bug.

Ex:
Under FieldLayout, there are quite a lot of properties that are mentioned as JS missing, however, all of them are documented in the corresponding JS code.

Screenshot from 2020-03-29 18-10-55.png (531×1 px, 192 KB)

Any idea what I should do here ?

Will try to get most of this done by the end of this week.

Soda removed Soda as the assignee of this task.Jun 6 2020, 7:45 AM

Feel free to take it up... I completely forgot that I had assigned myself the task :)

Is the issue been resolved? If not, I would like to contribute.

@Shubham656jain, @Diwanshu885: Hi and welcome. Please check the upper left corner, below the task title, for the status of any task. Also see https://www.mediawiki.org/wiki/How_to_become_a_MediaWiki_hacker#Feedback,_questions_and_support - thanks!