Bartosz Dziewoński has uploaded a new change for review. https://gerrit.wikimedia.org/r/170341
Change subject: OOUI PHP: Support RTL text direction
......................................................................
OOUI PHP: Support RTL text direction
Added support to the demo. Note how the GridLayout's directionality changes.
Bug: 72584
Change-Id: I4a4242d36c5765c39b37efbbddd822ac1f2d4f3b
---
M demos/widgets.php
M php/OoUiElement.php
2 files changed, 68 insertions(+), 34 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/oojs/ui refs/changes/41/170341/1
diff --git a/demos/widgets.php b/demos/widgets.php
index 3c922f6..76c068d 100644
--- a/demos/widgets.php
+++ b/demos/widgets.php
@@ -1,27 +1,47 @@
+<?php
+ $autoload = '../vendor/autoload.php';
+ if ( !file_exists( $autoload ) ) {
+ trigger_error(
+ '<h1>Did you forget to run <code>composer
install</code>?</h1>'
+ );
+ exit();
+ }
+ require_once $autoload;
+
+ OoUiTheme::setSingleton( new OoUiMediaWikiTheme() );
+
+ $direction = ( isset( $_GET['dir'] ) && $_GET['dir'] === 'rtl' ) ?
'rtl' : 'ltr';
+ OoUiElement::setDir( $direction );
+?>
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<title>OOjs UI Widget Demo</title>
- <link rel="stylesheet" href="../dist/oojs-ui-mediawiki.svg.css">
- <link rel="stylesheet" href="styles/demo.css">
+ <link rel="stylesheet" href="../dist/oojs-ui-mediawiki.svg<?php echo
$direction === 'rtl' ? '.rtl' : ''; ?>.css">
+ <link rel="stylesheet" href="styles/demo<?php echo $direction === 'rtl'
? '.rtl' : ''; ?>.css">
</head>
-<body>
+<body class="oo-ui-<?php echo $direction; ?>">
<div class="oo-ui-demo">
- <div class="oo-ui-demo-container">
+ <div class="oo-ui-demo-menu">
<?php
- $autoload = '../vendor/autoload.php';
- if ( !file_exists( $autoload ) ) {
- trigger_error(
- '<h1>Did you forget to run
<code>composer install</code>?</h1>'
- );
- exit();
- }
- require_once $autoload;
-
- OoUiTheme::setSingleton( new
OoUiMediaWikiTheme() );
+ echo new OoUiButtonGroupWidget( array(
+ 'items' => array(
+ new OoUiButtonWidget( array(
+ 'label' => 'LTR',
+ 'href' => '?dir=ltr',
+ 'target' => null,
+ ) ),
+ new OoUiButtonWidget( array(
+ 'label' => 'RTL',
+ 'href' => '?dir=rtl',
+ 'target' => null,
+ ) ),
+ )
+ ) );
?>
-
+ </div>
+ <div class="oo-ui-demo-container">
<?php
function widgetWrap( $element ) {
@@ -120,7 +140,7 @@
'items' => array(
new OoUiFieldLayout(
new ButtonWidgetTitled(
array(
- 'label' =>
'Hover me!',
+ 'label' =>
"Hover me!\xE2\x80\x8E",
) ),
array(
'label' =>
'Titled button',
@@ -129,7 +149,7 @@
),
new OoUiFieldLayout(
new OoUiButtonWidget(
array(
- 'label' =>
'Click me!',
+ 'label' =>
"Click me!\xE2\x80\x8E",
'href' =>
'http://example.com/',
) ),
array(
@@ -238,7 +258,7 @@
'title' =>
'Picture icon'
) ),
array(
- 'label' =>
'IconWidget (normal)',
+ 'label' =>
"IconWidget (normal)\xE2\x80\x8E",
'align' => 'top'
)
),
@@ -249,7 +269,7 @@
'disabled' =>
true
) ),
array(
- 'label' =>
'IconWidget (disabled)',
+ 'label' =>
"IconWidget (disabled)\xE2\x80\x8E",
'align' => 'top'
)
),
@@ -259,7 +279,7 @@
'title' =>
'Required icon'
) ),
array(
- 'label' =>
'IndicatorWidget (normal)',
+ 'label' =>
"IndicatorWidget (normal)\xE2\x80\x8E",
'align' => 'top'
)
),
@@ -270,7 +290,7 @@
'disabled' =>
true
) ),
array(
- 'label' =>
'IndicatorWidget (disabled)',
+ 'label' =>
"IndicatorWidget (disabled)\xE2\x80\x8E",
'align' => 'top'
)
),
@@ -281,7 +301,7 @@
) ),
array(
'align' =>
'top',
- 'label' =>
'ButtonInputWidget (type: submit)'
+ 'label' =>
"ButtonInputWidget (type: submit)\xE2\x80\x8E"
)
),
new OoUiFieldLayout(
@@ -292,7 +312,7 @@
) ),
array(
'align' =>
'top',
- 'label' =>
'ButtonInputWidget (type: submit, using <input/>)'
+ 'label' =>
"ButtonInputWidget (type: submit, using <input/>)\xE2\x80\x8E"
)
),
new OoUiFieldLayout(
@@ -311,7 +331,7 @@
) ),
array(
'align' =>
'inline',
- 'label' =>
'CheckboxInputWidget (disabled)'
+ 'label' =>
"CheckboxInputWidget (disabled)\xE2\x80\x8E"
)
),
new OoUiFieldLayout(
@@ -324,21 +344,21 @@
new OoUiFieldLayout(
new
OoUiTextInputWidget( array( 'icon' => 'search' ) ),
array(
- 'label' =>
'TextInputWidget (icon)',
+ 'label' =>
"TextInputWidget (icon)\xE2\x80\x8E",
'align' => 'top'
)
),
new OoUiFieldLayout(
new
OoUiTextInputWidget( array( 'indicator' => 'required' ) ),
array(
- 'label' =>
'TextInputWidget (indicator)',
+ 'label' =>
"TextInputWidget (indicator)\xE2\x80\x8E",
'align' => 'top'
)
),
new OoUiFieldLayout(
new
OoUiTextInputWidget( array( 'placeholder' => 'Placeholder' ) ),
array(
- 'label' =>
'TextInputWidget (placeholder)',
+ 'label' =>
"TextInputWidget (placeholder)\xE2\x80\x8E",
'align' => 'top'
)
),
@@ -348,7 +368,7 @@
'readOnly' =>
true
) ),
array(
- 'label' =>
'TextInputWidget (readonly)',
+ 'label' =>
"TextInputWidget (readonly)\xE2\x80\x8E",
'align' => 'top'
)
),
@@ -358,7 +378,7 @@
'disabled' =>
true
) ),
array(
- 'label' =>
'TextInputWidget (disabled)',
+ 'label' =>
"TextInputWidget (disabled)\xE2\x80\x8E",
'align' => 'top'
)
),
@@ -368,7 +388,7 @@
'value' =>
'Multiline'
) ),
array(
- 'label' =>
'TextInputWidget (multiline)',
+ 'label' =>
"TextInputWidget (multiline)\xE2\x80\x8E",
'align' => 'top'
)
),
diff --git a/php/OoUiElement.php b/php/OoUiElement.php
index a37b908..9c1c8e2 100644
--- a/php/OoUiElement.php
+++ b/php/OoUiElement.php
@@ -16,6 +16,13 @@
*/
public static $tagName = 'div';
+ /**
+ * Default text direction, used for some layout calculations. Use
setDir() to change.
+ *
+ * @var string
+ */
+ public static $dir = 'ltr';
+
/* Members */
/**
@@ -156,11 +163,18 @@
/**
* Get the direction of the user interface.
*
- * @return string Text direction, either `ltr` or `rtl`
+ * @return string Text direction, either 'ltr' or 'rtl'
*/
public static function getDir() {
- // TODO: Figure out a way to override this functionality when
used within MediaWiki, and use
- // $wgLang->getDir() to get the user interface direction
- return 'ltr';
+ return self::$dir;
+ }
+
+ /**
+ * Set the default direction of the user interface.
+ *
+ * @return string Text direction, either 'ltr' or 'rtl'
+ */
+ public static function setDir( $dir ) {
+ self::$dir = $dir === 'rtl' ? 'rtl' : 'ltr';
}
}
--
To view, visit https://gerrit.wikimedia.org/r/170341
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I4a4242d36c5765c39b37efbbddd822ac1f2d4f3b
Gerrit-PatchSet: 1
Gerrit-Project: oojs/ui
Gerrit-Branch: master
Gerrit-Owner: Bartosz Dziewoński <matma....@gmail.com>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
