From 77d759aab4acf6004ef3123d8ffc984782771720 Mon Sep 17 00:00:00 2001 From: =?utf8?q?Bartosz=20Dziewo=C5=84ski?= Date: Sun, 8 Nov 2015 16:21:58 +0100 Subject: [PATCH] Implement HTMLComboboxField It's a dropdown select with the ability to add custom options, or a text field with input suggestions, whichever you prefer. This is meant to be a replacement for HTMLSelectOrOtherField and HTMLAutoCompleteSelectField. In regular HTML mode, it uses HTML5 `` element with no custom JavaScript. This is supported by a wide range of browsers (IE 10+, modern Firefox and Chrome, Opera 12+). In OOUI mode, it uses a ComboBoxInputWidget. Depends on: I14b40884f185fb4e5 Bug: T118119 Change-Id: I954d3d24ed4efe90be9596a1bd9586ba3aee1e23 --- autoload.php | 1 + includes/XmlSelect.php | 12 +++- .../htmlform/HTMLAutoCompleteSelectField.php | 4 +- includes/htmlform/HTMLComboboxField.php | 57 +++++++++++++++++++ includes/htmlform/HTMLForm.php | 1 + includes/htmlform/HTMLSelectOrOtherField.php | 3 + 6 files changed, 75 insertions(+), 3 deletions(-) create mode 100644 includes/htmlform/HTMLComboboxField.php diff --git a/autoload.php b/autoload.php index 15f1b10ebf..3ebf44b15a 100644 --- a/autoload.php +++ b/autoload.php @@ -491,6 +491,7 @@ $wgAutoloadLocalClasses = array( 'HTMLCacheUpdateJob' => __DIR__ . '/includes/jobqueue/jobs/HTMLCacheUpdateJob.php', 'HTMLCheckField' => __DIR__ . '/includes/htmlform/HTMLCheckField.php', 'HTMLCheckMatrix' => __DIR__ . '/includes/htmlform/HTMLCheckMatrix.php', + 'HTMLComboboxField' => __DIR__ . '/includes/htmlform/HTMLComboboxField.php', 'HTMLEditTools' => __DIR__ . '/includes/htmlform/HTMLEditTools.php', 'HTMLFileCache' => __DIR__ . '/includes/cache/HTMLFileCache.php', 'HTMLFloatField' => __DIR__ . '/includes/htmlform/HTMLFloatField.php', diff --git a/includes/XmlSelect.php b/includes/XmlSelect.php index 78f476452f..9d37b95316 100644 --- a/includes/XmlSelect.php +++ b/includes/XmlSelect.php @@ -21,11 +21,12 @@ */ /** - * Class for generating HTML or elements. */ class XmlSelect { protected $options = array(); protected $default = false; + protected $tagName = 'select'; protected $attributes = array(); public function __construct( $name = false, $id = false, $default = false ) { @@ -49,6 +50,13 @@ class XmlSelect { $this->default = $default; } + /** + * @param string|array $tagName + */ + public function setTagName( $tagName ) { + $this->tagName = $tagName; + } + /** * @param string $name * @param string $value @@ -127,6 +135,6 @@ class XmlSelect { $contents .= self::formatOptions( $options, $this->default ); } - return Html::rawElement( 'select', $this->attributes, rtrim( $contents ) ); + return Html::rawElement( $this->tagName, $this->attributes, rtrim( $contents ) ); } } diff --git a/includes/htmlform/HTMLAutoCompleteSelectField.php b/includes/htmlform/HTMLAutoCompleteSelectField.php index 55cd5d0c8b..fc19d9a2d8 100644 --- a/includes/htmlform/HTMLAutoCompleteSelectField.php +++ b/includes/htmlform/HTMLAutoCompleteSelectField.php @@ -5,6 +5,9 @@ * auto-completion and optionally with a select dropdown for selecting common * options. * + * HTMLComboboxField implements most of the same functionality and should be + * used instead, if possible. + * * If one of 'options-messages', 'options', or 'options-message' is provided * and non-empty, the select dropdown will be shown. An 'other' key will be * appended using message 'htmlform-selectorother-other' if not already @@ -22,7 +25,6 @@ * other-message - Message to use instead of htmlform-selectorother-other for * the 'other' message. * other - Raw text to use for the 'other' message - * */ class HTMLAutoCompleteSelectField extends HTMLTextField { protected $autocomplete = array(); diff --git a/includes/htmlform/HTMLComboboxField.php b/includes/htmlform/HTMLComboboxField.php new file mode 100644 index 0000000000..e5679bbf06 --- /dev/null +++ b/includes/htmlform/HTMLComboboxField.php @@ -0,0 +1,57 @@ +` element. + * + * Besides the parameters recognized by HTMLTextField, the following are + * recognized: + * options-messages - As for HTMLSelectField + * options - As for HTMLSelectField + * options-message - As for HTMLSelectField + */ +class HTMLComboboxField extends HTMLTextField { + // FIXME Ewww, this shouldn't be adding any attributes not requested in $list :( + public function getAttributes( array $list, array $mappings = null ) { + $attribs = array( + 'type' => 'text', + 'list' => $this->mName . '-datalist', + ) + parent::getAttributes( $list, $mappings ); + + return $attribs; + } + + function getInputHTML( $value ) { + $datalist = new XmlSelect( false, $this->mName . '-datalist' ); + $datalist->setTagName( 'datalist' ); + $datalist->addOptions( $this->getOptions() ); + + return parent::getInputHTML( $value ) . $datalist->getHTML(); + } + + function getInputOOUI( $value ) { + $disabled = false; + $allowedParams = array( 'tabindex' ); + $attribs = $this->getAttributes( $allowedParams, array( 'tabindex' => 'tabIndex' ) ); + + if ( $this->mClass !== '' ) { + $attribs['classes'] = array( $this->mClass ); + } + + if ( !empty( $this->mParams['disabled'] ) ) { + $disabled = true; + } + + return new OOUI\ComboBoxInputWidget( array( + 'name' => $this->mName, + 'id' => $this->mID, + 'options' => $this->getOptionsOOUI(), + 'value' => strval( $value ), + 'disabled' => $disabled, + ) + $attribs ); + } +} diff --git a/includes/htmlform/HTMLForm.php b/includes/htmlform/HTMLForm.php index 2b9a49a25a..ac81ef2eff 100644 --- a/includes/htmlform/HTMLForm.php +++ b/includes/htmlform/HTMLForm.php @@ -128,6 +128,7 @@ class HTMLForm extends ContextSource { 'textwithbutton' => 'HTMLTextFieldWithButton', 'textarea' => 'HTMLTextAreaField', 'select' => 'HTMLSelectField', + 'combobox' => 'HTMLComboboxField', 'radio' => 'HTMLRadioField', 'multiselect' => 'HTMLMultiSelectField', 'limitselect' => 'HTMLSelectLimitField', diff --git a/includes/htmlform/HTMLSelectOrOtherField.php b/includes/htmlform/HTMLSelectOrOtherField.php index 3e7acdf881..81a29d0bce 100644 --- a/includes/htmlform/HTMLSelectOrOtherField.php +++ b/includes/htmlform/HTMLSelectOrOtherField.php @@ -2,6 +2,9 @@ /** * Select dropdown field, with an additional "other" textbox. + * + * HTMLComboboxField implements the same functionality using a single form field + * and should be used instead. */ class HTMLSelectOrOtherField extends HTMLTextField { function __construct( $params ) { -- 2.20.1