jenkins-bot has submitted this change and it was merged. (
https://gerrit.wikimedia.org/r/337398 )
Change subject: [WiP] BSFoundation: Added basic oojs ui components
......................................................................
[WiP] BSFoundation: Added basic oojs ui components
* Added StoreComboBoxInput
* Added StoreApiBoundComboBoxInput
* Added TitleComboBoxInput;
=> there is still some work to do with initial selection
Change-Id: Iaaf301d0d7b7a6973cd80cdb55ff9c7f8e76c464
---
M extension.json
A resources/bluespice.oojs/bluespice.ui.js
A resources/bluespice.oojs/ui/widget/StoreApiBoundComboBoxInput.js
A resources/bluespice.oojs/ui/widget/StoreComboBoxInput.js
A resources/bluespice.oojs/ui/widget/TitleComboBoxInput.js
5 files changed, 236 insertions(+), 0 deletions(-)
Approvals:
Robert Vogel: Looks good to me, approved
jenkins-bot: Verified
diff --git a/extension.json b/extension.json
index aa162bf..d340ee2 100644
--- a/extension.json
+++ b/extension.json
@@ -175,6 +175,24 @@
],
"group": "bsextjs"
},
+ "ext.bluespice.oojs": {
+ "localBasePath": "resources",
+ "remoteExtPath": "BlueSpiceFoundation/resources",
+ "targets": [
+ "mobile", "desktop"
+ ],
+ "scripts": [
+ "bluespice.oojs/bluespice.ui.js",
+
"bluespice.oojs/ui/widget/StoreComboBoxInput.js",
+
"bluespice.oojs/ui/widget/StoreApiBoundComboBoxInput.js",
+ "bluespice.oojs/ui/widget/TitleComboBoxInput.js"
+ ],
+ "dependencies": [
+ "mediawiki.api",
+ "oojs-ui",
+ "ext.bluespice"
+ ]
+ },
"ext.bluespice.upload": {
"localBasePath": "resources",
"remoteExtPath": "BlueSpiceFoundation/resources",
diff --git a/resources/bluespice.oojs/bluespice.ui.js
b/resources/bluespice.oojs/bluespice.ui.js
new file mode 100644
index 0000000..47a793d
--- /dev/null
+++ b/resources/bluespice.oojs/bluespice.ui.js
@@ -0,0 +1,6 @@
+
+bs = bs || {};
+bs.ui = bs.ui || {};
+bs.ui.mixin = bs.ui.mixin || {};
+bs.ui.mixin.element = bs.ui.mixin.element || {};
+bs.ui.widget = bs.ui.widget || {};
\ No newline at end of file
diff --git a/resources/bluespice.oojs/ui/widget/StoreApiBoundComboBoxInput.js
b/resources/bluespice.oojs/ui/widget/StoreApiBoundComboBoxInput.js
new file mode 100644
index 0000000..3098d7a
--- /dev/null
+++ b/resources/bluespice.oojs/ui/widget/StoreApiBoundComboBoxInput.js
@@ -0,0 +1,49 @@
+/**
+ *
+ * @class
+ * @abstract
+ * @extends OO.ui.ComboBoxInputWidget
+ *
+ * @constructor
+ * @param {Object} [config] Configuration options
+ * @cfg {Object[]} [options=[]] Array of menu options in the format `{ data:
…, label: … }`
+ * @cfg {Object} [menu] Configuration options to pass to the {@link
OO.ui.FloatingMenuSelectWidget menu select widget}.
+ * @cfg {jQuery} [$overlay] Render the menu into a separate layer. This
configuration is useful in cases where
+ * the expanded menu is larger than its containing `<div>`. The specified
overlay layer is usually on top of the
+ * containing `<div>` and has a larger area. By default, the menu uses
relative positioning.
+ */
+bs.ui.widget.StoreApiBoundComboBoxInput = function ( cfg ) {
+ cfg = cfg || {};
+
+ this.apiAction = cfg.apiAction || this.apiAction;
+ bs.ui.widget.StoreComboBoxInput.call( this, cfg );
+};
+
+OO.inheritClass(
+ bs.ui.widget.StoreApiBoundComboBoxInput,
+ bs.ui.widget.StoreComboBoxInput
+);
+
+/**
+ *
+ * @inheritdoc
+ */
+bs.ui.widget.StoreApiBoundComboBoxInput.prototype.getLookupRequest = function
() {
+ var value = this.getValue();
+ var deferred = $.Deferred();
+
+ if( value === '' ) {
+ deferred.resolve( [] );
+ }
+
+ var api = new mw.Api();
+ api.get({
+ action: this.apiAction,
+ query: value
+ })
+ .done( function( response, jqXHR ){
+ deferred.resolve( response.results );
+ });
+
+ return deferred.promise( { abort: function () {} } );
+};
diff --git a/resources/bluespice.oojs/ui/widget/StoreComboBoxInput.js
b/resources/bluespice.oojs/ui/widget/StoreComboBoxInput.js
new file mode 100644
index 0000000..c7be3af
--- /dev/null
+++ b/resources/bluespice.oojs/ui/widget/StoreComboBoxInput.js
@@ -0,0 +1,141 @@
+/**
+ *
+ * @class
+ * @abstract
+ * @extends OO.ui.ComboBoxInputWidget
+ *
+ * @constructor
+ * @param {Object} [config] Configuration options
+ * @cfg {Object[]} [options=[]] Array of menu options in the format `{ data:
…, label: … }`
+ * @cfg {Object} [menu] Configuration options to pass to the {@link
OO.ui.FloatingMenuSelectWidget menu select widget}.
+ * @cfg {jQuery} [$overlay] Render the menu into a separate layer. This
configuration is useful in cases where
+ * the expanded menu is larger than its containing `<div>`. The specified
overlay layer is usually on top of the
+ * containing `<div>` and has a larger area. By default, the menu uses
relative positioning.
+ */
+bs.ui.widget.StoreComboBoxInput = function ( cfg ) {
+ cfg = cfg || {};
+
+ this.selectedItem = null;
+
+ this.displayField = cfg.displayField || this.displayField;
+ this.valueField = cfg.valueField || '';
+ this.localData = cfg.localData || [];
+
+ OO.ui.ComboBoxInputWidget.call( this, cfg );
+ OO.ui.mixin.LookupElement.call( this, cfg );
+};
+
+OO.inheritClass( bs.ui.widget.StoreComboBoxInput, OO.ui.ComboBoxInputWidget );
+OO.mixinClass( bs.ui.widget.StoreComboBoxInput, OO.ui.mixin.LookupElement );
+
+/**
+ *
+ * @inheritdoc
+ */
+bs.ui.widget.StoreComboBoxInput.prototype.getLookupRequest = function () {
+ var value = this.getValue();
+ var deferred = $.Deferred();
+ var promise = deferred.promise( { abort: function () {} } );
+
+ if( !value ) {
+ deferred.resolve( this.localData );
+ }
+ else {
+ var filteredData = [];
+ for( var i = 0; i < this.localData.length; i++ ) {
+ var record = this.localData[i];
+ if( this.displayField &&
record[this.displayField].indexOf( value ) !== -1 ) {
+ filteredData.push( record );
+ continue;
+ }
+ }
+
+ deferred.resolve( filteredData );
+ }
+
+ return promise;
+};
+
+/**
+ *
+ * @inheritdoc
+ */
+bs.ui.widget.StoreComboBoxInput.prototype.getLookupMenuOptionsFromData =
function ( data ) {
+ var items = [];
+ for ( var i = 0; i < data.length; i++ ) {
+ var record = data[ i ];
+ items.push( new OO.ui.MenuOptionWidget( {
+ data: record,
+ label: record[this.displayField]
+ } ) );
+ }
+
+ return items;
+};
+
+/**
+ *
+ * @inheritdoc
+ */
+bs.ui.widget.StoreComboBoxInput.prototype.getLookupCacheDataFromResponse =
function ( response ) {
+ return response || [];
+};
+
+/**
+ *
+ * @inheritdoc
+ */
+bs.ui.widget.StoreComboBoxInput.prototype.setValue = function ( value ) {
+ this.selectedItem = null;
+ var displayValue = value;
+ if ( typeof value === 'object' ) {
+ this.selectedItem = value;
+ }
+
+ bs.ui.widget.StoreComboBoxInput.super.prototype.setValue.apply( this,
arguments );
+
+ if( typeof displayValue === 'string' && this.$input.val() !==
displayValue ) {
+ this.$input.val( displayValue );
+ }
+
+ return this;
+};
+
+/**
+ *
+ * @inheritdoc
+ */
+bs.ui.widget.StoreComboBoxInput.prototype.cleanUpValue = function ( value ) {
+ if( typeof value === 'object' ) {
+ value = value[this.displayField];
+ }
+ return bs.ui.widget.StoreComboBoxInput.super.prototype.cleanUpValue(
value );
+};
+
+/**
+ *
+ * @inheritdoc
+ */
+bs.ui.widget.StoreComboBoxInput.prototype.getSelectedItem = function () {
+ return this.selectedItem;
+};
+
+/**
+ * Returns the data object of the currently selected option or null if
+ * noting is selected
+ */
+bs.ui.widget.StoreComboBoxInput.prototype.getSelectedValue = function () {
+ if( this.valueField === '' ) {
+ return this.getValue();
+ }
+ var item = this.getSelectedItem();
+ return item ? item[this.valueField] : null;
+};
+
+/**
+ * Sets the data for the local store
+ * @param {Object[]} data
+ */
+bs.ui.widget.StoreComboBoxInput.prototype.setRawData = function ( data ) {
+ this.localData = data;
+};
\ No newline at end of file
diff --git a/resources/bluespice.oojs/ui/widget/TitleComboBoxInput.js
b/resources/bluespice.oojs/ui/widget/TitleComboBoxInput.js
new file mode 100644
index 0000000..8fad3c4
--- /dev/null
+++ b/resources/bluespice.oojs/ui/widget/TitleComboBoxInput.js
@@ -0,0 +1,22 @@
+/**
+ *
+ * @class
+ * @abstract
+ * @extends bs.ui.widget.StoreApiBoundComboBoxInput
+ *
+ * @constructor
+ * @param {Object} [config] Configuration options
+ * @cfg {Object[]} [options=[]] Array of menu options in the format `{ data:
…, label: … }`
+ * @cfg {Object} [menu] Configuration options to pass to the {@link
OO.ui.FloatingMenuSelectWidget menu select widget}.
+ * @cfg {jQuery} [$overlay] Render the menu into a separate layer. This
configuration is useful in cases where
+ * the expanded menu is larger than its containing `<div>`. The specified
overlay layer is usually on top of the
+ * containing `<div>` and has a larger area. By default, the menu uses
relative positioning.
+ */
+bs.ui.widget.TitleComboBoxInput = function ( cfg ) {
+ bs.ui.widget.StoreApiBoundComboBoxInput.call( this, cfg );
+ this.apiAction = 'bs-titlequery-store';
+ this.displayField = 'displayText';
+ this.valueField = 'prefixedText';
+};
+
+OO.inheritClass( bs.ui.widget.TitleComboBoxInput,
bs.ui.widget.StoreApiBoundComboBoxInput );
\ No newline at end of file
--
To view, visit https://gerrit.wikimedia.org/r/337398
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: Iaaf301d0d7b7a6973cd80cdb55ff9c7f8e76c464
Gerrit-PatchSet: 6
Gerrit-Project: mediawiki/extensions/BlueSpiceFoundation
Gerrit-Branch: master
Gerrit-Owner: Pwirth <[email protected]>
Gerrit-Reviewer: Ljonka <[email protected]>
Gerrit-Reviewer: Mglaser <[email protected]>
Gerrit-Reviewer: Robert Vogel <[email protected]>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
