summaryrefslogtreecommitdiff
path: root/www/wiki/resources/src/mediawiki.widgets/mw.widgets.ComplexNamespaceInputWidget.js
blob: 9edd0bd958ed4e66d7e49f184ab2d753a75d480c (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
/*!
 * MediaWiki Widgets - ComplexNamespaceInputWidget class.
 *
 * @copyright 2011-2015 MediaWiki Widgets Team and others; see AUTHORS.txt
 * @license The MIT License (MIT); see LICENSE.txt
 */
( function ( $, mw ) {

	/**
	 * Namespace input widget. Displays a dropdown box with the choice of available namespaces, plus
	 * two checkboxes to include associated namespace or to invert selection.
	 *
	 * @class
	 * @extends OO.ui.Widget
	 *
	 * @constructor
	 * @param {Object} [config] Configuration options
	 * @cfg {Object} namespace Configuration for the NamespaceInputWidget dropdown with list
	 *     of namespaces
	 * @cfg {string} namespace.includeAllValue If specified, add a "all namespaces"
	 *     option to the dropdown, and use this as the input value for it
	 * @cfg {Object} invert Configuration for the "invert selection" CheckboxInputWidget. If
	 *     null, the checkbox will not be generated.
	 * @cfg {Object} associated Configuration for the "include associated namespace"
	 *     CheckboxInputWidget. If null, the checkbox will not be generated.
	 * @cfg {Object} invertLabel Configuration for the FieldLayout with label wrapping the
	 *     "invert selection" checkbox
	 * @cfg {string} invertLabel.label Label text for the label
	 * @cfg {Object} associatedLabel Configuration for the FieldLayout with label wrapping
	 *     the "include associated namespace" checkbox
	 * @cfg {string} associatedLabel.label Label text for the label
	 */
	mw.widgets.ComplexNamespaceInputWidget = function MwWidgetsComplexNamespaceInputWidget( config ) {
		// Configuration initialization
		config = $.extend(
			{
				// Config options for nested widgets
				namespace: {},
				invert: {},
				invertLabel: {},
				associated: {},
				associatedLabel: {}
			},
			config
		);

		// Parent constructor
		mw.widgets.ComplexNamespaceInputWidget.parent.call( this, config );

		// Properties
		this.config = config;

		this.namespace = new mw.widgets.NamespaceInputWidget( config.namespace );
		if ( config.associated !== null ) {
			this.associated = new OO.ui.CheckboxInputWidget( $.extend(
				{ value: '1' },
				config.associated
			) );
			// TODO Should use a LabelWidget? But they don't work like HTML <label>s yet
			this.associatedLabel = new OO.ui.FieldLayout(
				this.associated,
				$.extend(
					{ align: 'inline' },
					config.associatedLabel
				)
			);
		}
		if ( config.invert !== null ) {
			this.invert = new OO.ui.CheckboxInputWidget( $.extend(
				{ value: '1' },
				config.invert
			) );
			// TODO Should use a LabelWidget? But they don't work like HTML <label>s yet
			this.invertLabel = new OO.ui.FieldLayout(
				this.invert,
				$.extend(
					{ align: 'inline' },
					config.invertLabel
				)
			);
		}

		// Events
		this.namespace.connect( this, { change: 'updateCheckboxesState' } );

		// Initialization
		this.$element
			.addClass( 'mw-widget-complexNamespaceInputWidget' )
			.append(
				this.namespace.$element,
				this.invert ? this.invertLabel.$element : '',
				this.associated ? this.associatedLabel.$element : ''
			);
		this.updateCheckboxesState();
	};

	/* Setup */

	OO.inheritClass( mw.widgets.ComplexNamespaceInputWidget, OO.ui.Widget );

	/* Methods */

	/**
	 * Update the disabled state of checkboxes when the value of namespace dropdown changes.
	 *
	 * @private
	 */
	mw.widgets.ComplexNamespaceInputWidget.prototype.updateCheckboxesState = function () {
		var disabled = this.namespace.getValue() === this.namespace.allValue;
		if ( this.invert ) {
			this.invert.setDisabled( disabled );
		}
		if ( this.associated ) {
			this.associated.setDisabled( disabled );
		}
	};

	/**
	 * @inheritdoc
	 */
	mw.widgets.ComplexNamespaceInputWidget.prototype.setDisabled = function ( disabled ) {
		mw.widgets.ComplexNamespaceInputWidget.parent.prototype.setDisabled.call( this, disabled );
		if ( this.namespace ) {
			this.namespace.setDisabled( disabled );
		}
		if ( this.invert ) {
			this.invert.setDisabled( disabled );
		}

		if ( this.associated ) {
			this.associated.setDisabled( disabled );
		}
		return this;
	};

}( jQuery, mediaWiki ) );