Tpt has uploaded a new change for review. (
https://gerrit.wikimedia.org/r/359649 )
Change subject: [WIP] Uses OOUI in Index pages editing interface
......................................................................
[WIP] Uses OOUI in Index pages editing interface
Change-Id: I83fefb58aaa010a5826926fd0ec074227c53008e
---
M extension.json
M includes/index/EditIndexPage.php
D modules/index/ext.proofreadpage.index.css
M modules/index/ext.proofreadpage.index.js
D modules/index/images/help-question.gif
5 files changed, 53 insertions(+), 79 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/ProofreadPage
refs/changes/49/359649/1
diff --git a/extension.json b/extension.json
index ee75be8..93881ba 100644
--- a/extension.json
+++ b/extension.json
@@ -159,14 +159,6 @@
"ext.proofreadpage.base"
]
},
- "ext.proofreadpage.index": {
- "scripts": "index/ext.proofreadpage.index.js",
- "styles": "index/ext.proofreadpage.index.css",
- "dependencies": [
- "ext.proofreadpage.base",
- "jquery.tipsy"
- ]
- },
"ext.proofreadpage.special.indexpages": {
"styles":
"special/indexpages/ext.proofreadpage.special.indexpages.css",
"dependencies": [
diff --git a/includes/index/EditIndexPage.php b/includes/index/EditIndexPage.php
index 909b96f..7c507c3 100644
--- a/includes/index/EditIndexPage.php
+++ b/includes/index/EditIndexPage.php
@@ -4,13 +4,15 @@
use ContentHandler;
use EditPage;
-use Html;
-use OutputPage;
+use OOUI\ButtonWidget;
+use OOUI\DropdownInputWidget;
+use OOUI\FieldLayout;
+use OOUI\FieldsetLayout;
+use OOUI\HtmlSnippet;
+use OOUI\TextInputWidget;
use ProofreadIndexEntry;
use ProofreadIndexPage;
use Status;
-use Xml;
-use XmlSelect;
/**
* @licence GNU GPL v2+
@@ -37,76 +39,72 @@
protected function showContentForm() {
$pageLang = $this->mTitle->getPageLanguage();
$out = $this->context->getOutput();
- $inputAttributes = [ 'lang' => $pageLang->getCode(), 'dir' =>
$pageLang->getDir() ];
+ $out->enableOOUI();
+ $inputOptions = [ 'lang' => $pageLang->getCode(), 'dir' =>
$pageLang->getDir() ];
if ( wfReadOnly() ) {
- $inputAttributes['readonly'] = '';
+ $inputOptions['readOnly'] = '';
}
- $entries = $this->getActualContent()->getIndexEntries();
-
- $out->addHTML( Html::openElement( 'table', [ 'id' =>
'prp-formTable' ] ) );
+ $fields = [];
$i = 10;
- foreach ( $entries as $entry ) {
- $inputAttributes['tabindex'] = $i;
- $this->addEntry( $entry, $inputAttributes, $out );
+ /** @var ProofreadIndexEntry $entry */
+ foreach ( $this->getActualContent()->getIndexEntries() as
$entry ) {
+ $inputOptions['tabIndex'] = $i;
+ if ( !$entry->isHidden() ) {
+ $fields[] = $this->buildEntry( $entry,
$inputOptions );
+ }
$i++;
}
- $out->addHTML( Html::closeElement( 'table' ) );
+
+ $out->addHTML( new FieldsetLayout( [
+ 'items' => $fields
+ ] ) );
$out->addModules( 'ext.proofreadpage.index' );
}
- /**
- * Add an entry to the form
- *
- * @param ProofreadIndexEntry $entry
- * @param array $inputAttributes
- */
- protected function addEntry( ProofreadIndexEntry $entry,
$inputAttributes, OutputPage $out ) {
- if ( $entry->isHidden() ) {
- return;
- }
+ private function buildEntry( ProofreadIndexEntry $entry, $inputOptions
) {
$key = $this->getFieldNameForEntry( $entry->getKey() );
$val = $this->safeUnicodeOutput( $entry->getStringValue() );
- $out->addHTML( Html::openElement( 'tr' ) . Html::openElement(
'th', [ 'scope' => 'row' ] ) . Xml::label( $entry->getLabel(), $key ) );
-
- $help = $entry->getHelp();
- if ( $help !== '' ) {
- $out->addHTML( Html::element( 'span', [ 'title' =>
$help, 'class' => 'prp-help-field' ] ) );
- }
-
- $out->addHTML( Html::closeElement( 'th' ) . Html::openElement(
'td' ) );
+ $inputOptions['name'] = $key;
+ $inputOptions['value'] = $val;
+ $inputOptions['inputId'] = $key;
$values = $entry->getPossibleValues();
if ( $values !== null ) {
- $select = new XmlSelect( $key, $key, $val );
- foreach ( $values as $value => $label ) {
- $select->addOption( $label, $value );
+ $options = [];
+ foreach ( $values as $data => $label ) {
+ $options[] = [ 'data' => $data, 'label' =>
$label ];
}
- if ( !isset( $values[$val] ) && $val !== '' ) { //
compatiblity with already set data that aren't in the list
- $select->addOption( $val, $val );
+ if ( !array_key_exists( $val, $values ) && $val !== ''
) {
+ $options[] = [ 'data' => $val, 'label' => $val
];
}
- $out->addHTML( $select->getHtml() );
+ $input = new DropdownInputWidget( $inputOptions + [
+ 'options' => $options
+ ] );
} else {
- $type = $entry->getType();
- $inputType = ( $type === 'number' && ( $val === '' ||
is_numeric( $val ) ) ) ? 'number' : 'text';
- $size = $entry->getSize();
- $inputAttributes['class'] = 'prp-input-' . $type;
-
- if ( $size === 1 ) {
- $inputAttributes['type'] = $inputType;
- $inputAttributes['id'] = $key;
- $inputAttributes['size'] = 60;
- $out->addHTML( Html::input( $key, $val,
$inputType, $inputAttributes ) );
- } else {
- $inputAttributes['cols'] = 60;
- $inputAttributes['rows'] = $size;
- $out->addHTML( Html::textarea( $key, $val,
$inputAttributes ) );
- }
+ $inputAttributes['classes'][] = 'prp-input-' .
$entry->getType();
+ $input = new TextInputWidget( $inputOptions + [
+ 'type' => ( $entry->getType() === 'number' && (
$val === '' || is_numeric( $val ) ) ) ? 'number' : 'text',
+ 'multiline' => $entry->getSize() > 1,
+ 'rows' => $entry->getSize()
+ ] );
}
- $out->addHTML( Html::closeElement( 'td' ) . Html::closeElement(
'tr' ) );
+ $fieldLayoutArgs = [
+ 'label' => $entry->getLabel()
+ ];
+ if ( $entry->getHelp() ) {
+ $fieldLayoutArgs['label'] = new HtmlSnippet(
$fieldLayoutArgs['label'] . ' ' . new ButtonWidget( [
+ 'classes' => [ 'oo-ui-fieldLayout-help'
],
+ 'framed' => false,
+ 'icon' => 'info',
+ 'title' => $entry->getHelp(),
+ ] ) );
+ }
+
+ return new FieldLayout( $input, $fieldLayoutArgs );
}
/**
@@ -115,7 +113,7 @@
* @param string $key the entry key
* @return string
*/
- protected function getFieldNameForEntry( $key ) {
+ private function getFieldNameForEntry( $key ) {
return 'wpprpindex-' . str_replace( ' ', '_', $key );
}
diff --git a/modules/index/ext.proofreadpage.index.css
b/modules/index/ext.proofreadpage.index.css
deleted file mode 100644
index 9ed47da..0000000
--- a/modules/index/ext.proofreadpage.index.css
+++ /dev/null
@@ -1,16 +0,0 @@
-/* TODO: Don't use IDs */
-table#prp-formTable th { /* stylelint-disable-line selector-no-id */
- text-align: left;
- font-weight: normal;
-}
-
-.prp-help-field {
- margin-left: 0.5em;
- padding: 0 0 0 15px;
-
- /* @embed */
- background-image: url( images/help-question.gif );
- background-position: left center;
- background-repeat: no-repeat;
- cursor: pointer;
-}
diff --git a/modules/index/ext.proofreadpage.index.js
b/modules/index/ext.proofreadpage.index.js
index bb4d660..6fb7505 100644
--- a/modules/index/ext.proofreadpage.index.js
+++ b/modules/index/ext.proofreadpage.index.js
@@ -3,7 +3,7 @@
$( function () {
// Set up the help system
- $( '.prp-help-field' ).tipsy( {
+ $( '.prp-help-field' ).tipsy( { //TODO: upgrade to OOjs
gravity: 'nw'
} );
} );
diff --git a/modules/index/images/help-question.gif
b/modules/index/images/help-question.gif
deleted file mode 100644
index b4fc9c5..0000000
--- a/modules/index/images/help-question.gif
+++ /dev/null
Binary files differ
--
To view, visit https://gerrit.wikimedia.org/r/359649
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I83fefb58aaa010a5826926fd0ec074227c53008e
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/ProofreadPage
Gerrit-Branch: master
Gerrit-Owner: Tpt <thoma...@hotmail.fr>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
