*/
$wgHtml5Version = null;
+/**
+ * Temporary variable that allows HTMLForms to be rendered as tables.
+ * Table based layouts cause various issues when designing for mobile.
+ * This global allows skins or extensions a means to force non-table based rendering.
+ * Setting to false forces form components to always render as div elements.
+ * @since 1.24
+ */
+$wgHTMLFormAllowTableFormat = true;
+
+/**
+ * Temporary variable that applies MediaWiki UI wherever it can be supported.
+ * Temporary variable that should be removed when mediawiki ui is more
+ * stable and change has been communicated.
+ * @since 1.24
+ */
+$wgUseMediaWikiUIEverywhere = false;
+
/**
* Enabled RDFa attributes for use in wikitext.
* NOTE: Interaction with HTML5 is somewhat underspecified.
}
protected function showStandardInputs( &$tabindex = 2 ) {
- global $wgOut;
+ global $wgOut, $wgUseMediaWikiUIEverywhere;
$wgOut->addHTML( "<div class='editOptions'>\n" );
if ( $this->section != 'new' ) {
$message = wfMessage( 'edithelppage' )->inContentLanguage()->text();
$edithelpurl = Skin::makeInternalOrExternalUrl( $message );
- $edithelp = '<a target="helpwindow" href="' . $edithelpurl . '">' .
- wfMessage( 'edithelp' )->escaped() . '</a> ' .
+ $attrs = array(
+ 'target' => 'helpwindow',
+ 'href' => $edithelpurl,
+ );
+ if ( $wgUseMediaWikiUIEverywhere ) {
+ $attrs['class'] = 'mw-ui-button mw-ui-quiet';
+ }
+ $edithelp = Html::element( 'a', $attrs, wfMessage( 'edithelp' )->text() ) .
wfMessage( 'newwindow' )->parse();
$wgOut->addHTML( " <span class='cancelLink'>{$cancel}</span>\n" );
* @return string
*/
public function getCancelLink() {
+ global $wgUseMediaWikiUIEverywhere;
$cancelParams = array();
if ( !$this->isConflict && $this->oldid > 0 ) {
$cancelParams['oldid'] = $this->oldid;
}
+ $attrs = array( 'id' => 'mw-editform-cancel' );
+ if ( $wgUseMediaWikiUIEverywhere ) {
+ $attrs['class'] = 'mw-ui-button mw-ui-quiet';
+ }
return Linker::linkKnown(
$this->getContextTitle(),
wfMessage( 'cancel' )->parse(),
- array( 'id' => 'mw-editform-cancel' ),
+ $attrs,
$cancelParams
);
}
* @return array
*/
public function getCheckboxes( &$tabindex, $checked ) {
- global $wgUser;
+ global $wgUser, $wgUseMediaWikiUIEverywhere;
$checkboxes = array();
'accesskey' => wfMessage( 'accesskey-minoredit' )->text(),
'id' => 'wpMinoredit',
);
- $checkboxes['minor'] =
+ $minorEditHtml =
Xml::check( 'wpMinoredit', $checked['minor'], $attribs ) .
" <label for='wpMinoredit' id='mw-editpage-minoredit'" .
Xml::expandAttributes( array( 'title' => Linker::titleAttrib( 'minoredit', 'withaccess' ) ) ) .
">{$minorLabel}</label>";
+
+ if ( $wgUseMediaWikiUIEverywhere ) {
+ $checkboxes['minor'] = Html::openElement( 'div', array( 'class' => 'mw-ui-checkbox' ) ) .
+ $minorEditHtml .
+ Html::closeElement( 'div' );
+ } else {
+ $checkboxes['minor'] = $minorEditHtml;
+ }
}
}
'accesskey' => wfMessage( 'accesskey-watch' )->text(),
'id' => 'wpWatchthis',
);
- $checkboxes['watch'] =
+ $watchThisHtml =
Xml::check( 'wpWatchthis', $checked['watch'], $attribs ) .
" <label for='wpWatchthis' id='mw-editpage-watch'" .
Xml::expandAttributes( array( 'title' => Linker::titleAttrib( 'watch', 'withaccess' ) ) ) .
">{$watchLabel}</label>";
+ if ( $wgUseMediaWikiUIEverywhere ) {
+ $checkboxes['watch'] = Html::openElement( 'div', array( 'class' => 'mw-ui-checkbox' ) ) .
+ $watchThisHtml .
+ Html::closeElement( 'div' );
+ } else {
+ $checkboxes['watch'] = $watchThisHtml;
+ }
}
wfRunHooks( 'EditPageBeforeEditChecks', array( &$this, &$checkboxes, &$tabindex ) );
return $checkboxes;
* @return array
*/
public function getEditButtons( &$tabindex ) {
+ global $wgUseMediaWikiUIEverywhere;
+
$buttons = array();
$attribs = array(
'tabindex' => ++$tabindex,
'value' => wfMessage( 'savearticle' )->text(),
) + Linker::tooltipAndAccesskeyAttribs( 'save' );
+ if ( $wgUseMediaWikiUIEverywhere ) {
+ $attribs['class'] = 'mw-ui-button mw-ui-constructive';
+ }
$buttons['save'] = Xml::element( 'input', $attribs, '' );
++$tabindex; // use the same for preview and live preview
'tabindex' => $tabindex,
'value' => wfMessage( 'showpreview' )->text(),
) + Linker::tooltipAndAccesskeyAttribs( 'preview' );
+ if ( $wgUseMediaWikiUIEverywhere ) {
+ $attribs['class'] = 'mw-ui-button mw-ui-progressive';
+ }
$buttons['preview'] = Xml::element( 'input', $attribs, '' );
$buttons['live'] = '';
'tabindex' => ++$tabindex,
'value' => wfMessage( 'showdiff' )->text(),
) + Linker::tooltipAndAccesskeyAttribs( 'diff' );
+ if ( $wgUseMediaWikiUIEverywhere ) {
+ $attribs['class'] = 'mw-ui-button mw-ui-progressive';
+ }
$buttons['diff'] = Xml::element( 'input', $attribs, '' );
wfRunHooks( 'EditPageBeforeEditButtons', array( &$this, &$buttons, &$tabindex ) );
'itemscope',
);
+ /**
+ * Modifies a set of attributes meant for text input elements
+ * and apply a set of default attributes.
+ * Removes size attribute when $wgUseMediaWikiUIEverywhere enabled.
+ * @param array $attrs An attribute array.
+ * @return array $attrs A modified attribute array
+ */
+ public static function getTextInputAttributes( $attrs ) {
+ global $wgUseMediaWikiUIEverywhere;
+ if ( !$attrs ) {
+ $attrs = array();
+ }
+ if ( isset( $attrs['class'] ) ) {
+ if ( is_array( $attrs['class'] ) ) {
+ $attrs['class'][] = 'mw-ui-input';
+ } else {
+ $attrs['class'] .= ' mw-ui-input';
+ }
+ } else {
+ $attrs['class'] = 'mw-ui-input';
+ }
+ if ( $wgUseMediaWikiUIEverywhere ) {
+ // Note that size can effect the desired width rendering of mw-ui-input elements
+ // so it is removed. Left intact when mediawiki ui not enabled.
+ unset( $attrs['size'] );
+ }
+ return $attrs;
+ }
+
/**
* Returns an HTML element in a string. The major advantage here over
* manually typing out the HTML is that it will escape all attribute
$attribs['type'] = $type;
$attribs['value'] = $value;
$attribs['name'] = $name;
-
+ if ( in_array( $type, array( 'text', 'search', 'email', 'password', 'number' ) ) ) {
+ $attribs = Html::getTextInputAttributes( $attribs );
+ }
return self::element( 'input', $attribs );
}
} else {
$spacedValue = $value;
}
- return self::element( 'textarea', $attribs, $spacedValue );
+ return self::element( 'textarea', Html::getTextInputAttributes( $attribs ), $spacedValue );
}
/**
$attributes['value'] = $value;
}
- return self::element( 'input', $attributes + $attribs );
+ return self::element( 'input',
+ Html::getTextInputAttributes( $attributes + $attribs ) );
}
/**
* @return string HTML
*/
public static function checkLabel( $label, $name, $id, $checked = false, $attribs = array() ) {
- return self::check( $name, $checked, array( 'id' => $id ) + $attribs ) .
+ global $wgUseMediaWikiUIEverywhere;
+ $chkLabel = self::check( $name, $checked, array( 'id' => $id ) + $attribs ) .
' ' .
self::label( $label, $id, $attribs );
+
+ if ( $wgUseMediaWikiUIEverywhere ) {
+ $chkLabel = self::openElement( 'div', array( 'class' => 'mw-ui-checkbox' ) ) .
+ $chkLabel . self::closeElement( 'div' );
+ }
+ return $chkLabel;
}
/**
/**
* Convenience function to build an HTML submit button
+ * When $wgUseMediaWikiUIEverywhere is true it will default to a constructive button
* @param string $value Label text for the button
* @param array $attribs Optional custom attributes
* @return string HTML
*/
public static function submitButton( $value, $attribs = array() ) {
- return Html::element( 'input', array( 'type' => 'submit', 'value' => $value ) + $attribs );
+ global $wgUseMediaWikiUIEverywhere;
+ $baseAttrs = array(
+ 'type' => 'submit',
+ 'value' => $value,
+ );
+ // Done conditionally for time being as it is possible
+ // some submit forms
+ // might need to be mw-ui-destructive (e.g. delete a page)
+ if ( $wgUseMediaWikiUIEverywhere ) {
+ $baseAttrs['class'] = 'mw-ui-button mw-ui-constructive';
+ }
+ // Any custom attributes will take precendence of anything in baseAttrs e.g. override the class
+ $attribs = $attribs + $baseAttrs;
+ return Html::element( 'input', $attribs );
}
/**
*/
public static function textarea( $name, $content, $cols = 40, $rows = 5, $attribs = array() ) {
return self::element( 'textarea',
- array(
- 'name' => $name,
- 'id' => $name,
- 'cols' => $cols,
- 'rows' => $rows
- ) + $attribs,
+ Html::getTextInputAttributes(
+ array(
+ 'name' => $name,
+ 'id' => $name,
+ 'cols' => $cols,
+ 'rows' => $rows
+ ) + $attribs
+ ),
$content, false );
}
}
public function show() {
-
+ global $wgUseMediaWikiUIEverywhere;
+ if ( $wgUseMediaWikiUIEverywhere ) {
+ $out = $this->getOutput();
+ $out->addModuleStyles( array(
+ 'mediawiki.ui.input',
+ 'mediawiki.ui.checkbox',
+ ) );
+ }
$this->page->delete();
}
}
}
public function show() {
+ global $wgUseMediaWikiUIEverywhere;
+ if ( $wgUseMediaWikiUIEverywhere ) {
+ $out = $this->getOutput();
+ $out->addModuleStyles( array(
+ 'mediawiki.ui.input',
+ 'mediawiki.ui.checkbox',
+ ) );
+ }
$page = $this->page;
$user = $this->getUser();
wfProfileIn( __METHOD__ );
$this->preCacheMessages();
+ $config = $this->context->getConfig();
# Fill in the file cache if not set already
- $useFileCache = $this->context->getConfig()->get( 'UseFileCache' );
+ $useFileCache = $config->get( 'UseFileCache' );
if ( $useFileCache && HTMLFileCache::useFileCache( $this->getContext() ) ) {
$cache = HTMLFileCache::newFromTitle( $this->getTitle(), 'history' );
if ( !$cache->isCacheGood( /* Assume up to date */ ) ) {
// Setup page variables.
$out->setFeedAppendQuery( 'action=history' );
$out->addModules( 'mediawiki.action.history' );
+ if ( $config->get( 'UseMediaWikiUIEverywhere' ) ) {
+ $out = $this->getOutput();
+ $out->addModuleStyles( array(
+ 'mediawiki.ui.input',
+ 'mediawiki.ui.checkbox',
+ ) );
+ }
// Handle atom/RSS feeds.
$feedType = $request->getVal( 'feed' );
* @return string HTML output
*/
function getStartBody() {
+ global $wgUseMediaWikiUIEverywhere;
$this->lastRow = false;
$this->counter = 1;
$this->oldIdChecked = 0;
// Button container stored in $this->buttons for re-use in getEndBody()
$this->buttons = '<div>';
+ $className = 'historysubmit mw-history-compareselectedversions-button';
+ if ( $wgUseMediaWikiUIEverywhere ) {
+ $className .= ' mw-ui-button mw-ui-constructive';
+ }
$this->buttons .= $this->submitButton( $this->msg( 'compareselectedversions' )->text(),
- array( 'class' => 'historysubmit mw-history-compareselectedversions-button' )
+ array( 'class' => $className )
+ Linker::tooltipAndAccesskeyAttribs( 'compareselectedversions' )
) . "\n";
}
public function show() {
+ global $wgUseMediaWikiUIEverywhere;
+ if ( $wgUseMediaWikiUIEverywhere ) {
+ $out = $this->getOutput();
+ $out->addModuleStyles( array(
+ 'mediawiki.ui.input',
+ 'mediawiki.ui.checkbox',
+ ) );
+ }
$this->page->protect();
}
),
Xml::check( $this->mName, $value, $attr ) . $this->mLabel );
} else {
- return Xml::check( $this->mName, $value, $attr )
- . ' '
- . Html::rawElement( 'label', array( 'for' => $this->mID ), $this->mLabel );
+ return Xml::checkLabel( $this->mLabel, $this->mName, $this->mID, $value, $attr );
}
}
* @return string
*/
function getInputHTML( $value ) {
+ global $wgUseMediaWikiUIEverywhere;
+
$html = '';
$tableContents = '';
$rows = $this->mParams['rows'];
foreach ( $columns as $columnTag ) {
$thisTag = "$columnTag-$rowTag";
// Construct the checkbox
+ $thisId = "{$this->mID}-$thisTag";
$thisAttribs = array(
- 'id' => "{$this->mID}-$thisTag",
+ 'id' => $thisId,
'value' => $thisTag,
);
$checked = in_array( $thisTag, (array)$value, true );
$checked = true;
$thisAttribs['disabled'] = 1;
}
+ $chkBox = Xml::check( "{$this->mName}[]", $checked, $attribs + $thisAttribs );
+ if ( $wgUseMediaWikiUIEverywhere ) {
+ $chkBox = Html::openElement( 'div', array( 'class' => 'mw-ui-checkbox' ) ) .
+ $chkBox .
+ Html::element( 'label', array( 'for' => $thisId ) ) .
+ Html::closeElement( 'div' );
+ }
$rowContents .= Html::rawElement(
'td',
array(),
- Xml::check( "{$this->mName}[]", $checked, $attribs + $thisAttribs )
+ $chkBox
);
}
$tableContents .= Html::rawElement( 'tr', array(), "\n$rowContents\n" );
* @return string
*/
public function getDisplayFormat() {
- return $this->displayFormat;
+ global $wgHTMLFormAllowTableFormat;
+ $format = $this->displayFormat;
+ if ( !$wgHTMLFormAllowTableFormat && $format === 'table' ) {
+ $format = 'div';
+ }
+ return $format;
}
/**
* @return string HTML.
*/
function getButtons() {
+ global $wgUseMediaWikiUIEverywhere;
$buttons = '';
if ( $this->mShowSubmit ) {
$attribs['class'] = array( 'mw-htmlform-submit' );
+ if ( $this->isVForm() || $wgUseMediaWikiUIEverywhere ) {
+ array_push( $attribs['class'], 'mw-ui-button', 'mw-ui-constructive' );
+ }
+
if ( $this->isVForm() ) {
// mw-ui-block is necessary because the buttons aren't necessarily in an
// immediate child div of the vform.
// @todo Let client specify if the primary submit button is progressive or destructive
array_push(
$attribs['class'],
- 'mw-ui-button',
'mw-ui-big',
- 'mw-ui-constructive',
'mw-ui-block'
);
}
$attrs['id'] = $button['id'];
}
+ if ( $wgUseMediaWikiUIEverywhere ) {
+ if ( isset( $attrs['class' ] ) ) {
+ $attrs['class'] .= ' mw-ui-button';
+ } else {
+ $attrs['class'] = 'mw-ui-button';
+ }
+ }
+
$buttons .= Html::element( 'input', $attrs ) . "\n";
}
// Close enough to a div.
$getFieldHtmlMethod = 'getDiv';
break;
+ case 'div':
+ $getFieldHtmlMethod = 'getDiv';
+ break;
default:
$getFieldHtmlMethod = 'get' . ucfirst( $displayFormat );
}
} else {
$thisAttribs = array( 'id' => "{$this->mID}-$info", 'value' => $info );
+ // @todo: Make this use checkLabel for consistency purposes
$checkbox = Xml::check(
$this->mName . '[]',
in_array( $info, $value, true ),
function getInputHTML( $value ) {
$attribs = array(
'id' => $this->mID,
- 'name' => $this->mName,
'cols' => $this->getCols(),
'rows' => $this->getRows(),
) + $this->getTooltipAndAccessKey();
);
$attribs += $this->getAttributes( $allowedParams );
-
- return Html::element( 'textarea', $attribs, $value );
+ return Html::textarea( $this->mName, $value, $attribs );
}
}
# Implement tiny differences between some field variants
# here, rather than creating a new class for each one which
# is essentially just a clone of this one.
+ $type = 'text';
if ( isset( $this->mParams['type'] ) ) {
switch ( $this->mParams['type'] ) {
case 'int':
- $attribs['type'] = 'number';
+ $type = 'number';
break;
case 'float':
- $attribs['type'] = 'number';
+ $type = 'number';
$attribs['step'] = 'any';
break;
# Pass through
case 'password':
case 'file':
case 'url':
- $attribs['type'] = $this->mParams['type'];
+ $type = $this->mParams['type'];
break;
}
}
-
- return Html::element( 'input', $attribs );
+ return Html::input( $this->mName, $value, $type, $attribs );
}
}
$out->setArticleRelated( false );
$out->setRobotPolicy( $this->getRobotPolicy() );
$out->setPageTitle( $this->getDescription() );
+ if ( $this->getConfig()->get( 'UseMediaWikiUIEverywhere' ) ) {
+ $out->addModuleStyles( array(
+ 'mediawiki.ui.input',
+ 'mediawiki.ui.checkbox',
+ ) );
+ }
}
/**
'Input wrapper with type and value.'
);
$this->assertEquals(
- '<input name=testname>',
+ '<input name=testname class=mw-ui-input>',
Html::input( 'testname' ),
'Input wrapper with all default values.'
);
*/
public function testElementInputCanHaveAValueOfZero() {
$this->assertEquals(
- '<input name="name" value="0" />',
+ '<input name="name" value="0" class="mw-ui-input" />',
Xml::input( 'name', false, 0 ),
'Input with a value of 0 (bug 23797)'
);
$this->assertEquals(
'<label for="year">From year (and earlier):</label> ' .
- '<input id="year" maxlength="4" size="7" type="number" value="2011" name="year" /> ' .
+ '<input id="year" maxlength="4" size="7" type="number" value="2011" name="year" class="mw-ui-input" /> ' .
'<label for="month">From month (and earlier):</label> ' .
'<select id="month" name="month" class="mw-month-selector">' .
'<option value="-1">all</option>' . "\n" .
);
$this->assertEquals(
'<label for="year">From year (and earlier):</label> ' .
- '<input id="year" maxlength="4" size="7" type="number" value="2011" name="year" /> ' .
+ '<input id="year" maxlength="4" size="7" type="number" value="2011" name="year" class="mw-ui-input" /> ' .
'<label for="month">From month (and earlier):</label> ' .
'<select id="month" name="month" class="mw-month-selector">' .
'<option value="-1">all</option>' . "\n" .
$this->assertEquals(
'<label for="year">From year (and earlier):</label> ' .
- '<input id="year" maxlength="4" size="7" type="number" name="year" /> ' .
+ '<input id="year" maxlength="4" size="7" type="number" name="year" class="mw-ui-input" /> ' .
'<label for="month">From month (and earlier):</label> ' .
'<select id="month" name="month" class="mw-month-selector">' .
'<option value="-1">all</option>' . "\n" .
*/
public function testTextareaNoContent() {
$this->assertEquals(
- '<textarea name="name" id="name" cols="40" rows="5"></textarea>',
+ '<textarea name="name" id="name" cols="40" rows="5" class="mw-ui-input"></textarea>',
Xml::textarea( 'name', '' ),
'textarea() with not content'
);
*/
public function testTextareaAttribs() {
$this->assertEquals(
- '<textarea name="name" id="name" cols="20" rows="10"><txt></textarea>',
+ '<textarea name="name" id="name" cols="20" rows="10" class="mw-ui-input"><txt></textarea>',
Xml::textarea( 'name', '<txt>', 20, 10 ),
'textarea() with custom attribs'
);