Merge "Enable configuration to supply options for Special:Search form"
[lhc/web/wiklou.git] / includes / specials / forms / PreferencesFormOOUI.php
index 81abf1c..9b86812 100644 (file)
@@ -117,45 +117,12 @@ class PreferencesFormOOUI extends OOUIHTMLForm {
        }
 
        protected function wrapFieldSetSection( $legend, $section, $attributes, $isRoot ) {
-               // to get a user visible effect, wrap the fieldset into a framed panel layout
-               if ( $isRoot ) {
-                       // Mimic TabPanelLayout
-                       $wrapper = new OOUI\PanelLayout( [
-                               'expanded' => false,
-                               'scrollable' => true,
-                               // Framed and padded for no-JS, frame hidden with CSS
-                               'framed' => true,
-                               'infusable' => false,
-                               'classes' => [ 'oo-ui-stackLayout oo-ui-indexLayout-stackLayout' ]
-                       ] );
-                       $layout = new OOUI\PanelLayout( [
-                               'expanded' => false,
-                               'scrollable' => true,
-                               'infusable' => false,
-                               'classes' => [ 'oo-ui-tabPanelLayout' ]
-                       ] );
-                       $wrapper->appendContent( $layout );
-               } else {
-                       $wrapper = $layout = new OOUI\PanelLayout( [
-                               'expanded' => false,
-                               'padded' => true,
-                               'framed' => true,
-                               'infusable' => false,
-                       ] );
-               }
+               $layout = parent::wrapFieldSetSection( $legend, $section, $attributes, $isRoot );
+
+               $layout->addClasses( [ 'mw-prefs-fieldset-wrapper' ] );
+               $layout->removeClasses( [ 'oo-ui-panelLayout-framed' ] );
 
-               $layout->appendContent(
-                       new OOUI\FieldsetLayout( [
-                               'label' => $legend,
-                               'infusable' => false,
-                               'items' => [
-                                       new OOUI\Widget( [
-                                               'content' => new OOUI\HtmlSnippet( $section )
-                                       ] ),
-                               ],
-                       ] + $attributes )
-               );
-               return $wrapper;
+               return $layout;
        }
 
        /**
@@ -163,61 +130,55 @@ class PreferencesFormOOUI extends OOUIHTMLForm {
         * @return string
         */
        function getBody() {
-               // Construct fake tabs to avoid FOUC. The structure mimics OOUI's tabPanelLayout.
-               // TODO: Consider creating an infusable TabPanelLayout in OOUI-PHP.
-               $fakeTabs = [];
-               foreach ( $this->getPreferenceSections() as $i => $key ) {
-                       $fakeTabs[] =
-                               Html::rawElement(
-                                       'div',
-                                       [
-                                               'class' =>
-                                                       'oo-ui-widget oo-ui-widget-enabled oo-ui-optionWidget ' .
-                                                       'oo-ui-tabOptionWidget oo-ui-labelElement' .
-                                                       ( $i === 0 ? ' oo-ui-optionWidget-selected' : '' )
+               $tabPanels = [];
+               foreach ( $this->mFieldTree as $key => $val ) {
+                       if ( !is_array( $val ) ) {
+                               wfDebug( __METHOD__ . " encountered a field not attached to a section: '$key'" );
+                               continue;
+                       }
+                       $label = $this->getLegend( $key );
+                       $content =
+                               $this->getHeaderText( $key ) .
+                               $this->displaySection(
+                                       $this->mFieldTree[$key],
+                                       "",
+                                       "mw-prefsection-$key-"
+                               ) .
+                               $this->getFooterText( $key );
+
+                       $tabPanels[] = new OOUI\TabPanelLayout( [
+                               'classes' => [ 'mw-htmlform-autoinfuse-lazy' ],
+                               'name' => 'mw-prefsection-' . $key,
+                               'label' => $label,
+                               'content' => new OOUI\FieldsetLayout( [
+                                       'classes' => [ 'mw-prefs-section-fieldset' ],
+                                       'id' => "mw-prefsection-$key",
+                                       'label' => $label,
+                                       'items' => [
+                                               new OOUI\Widget( [
+                                                       'content' => new OOUI\HtmlSnippet( $content )
+                                               ] ),
                                        ],
-                                       Html::element(
-                                               'a',
-                                               [
-                                                       'class' => 'oo-ui-labelElement-label',
-                                                       // Make this a usable link instead of a span so the tabs
-                                                       // can be used before JS runs
-                                                       'href' => '#mw-prefsection-' . $key
-                                               ],
-                                               $this->getLegend( $key )
-                                       )
-                               );
+                               ] ),
+                               'expanded' => false,
+                               'framed' => true,
+                       ] );
                }
-               $fakeTabsHtml = Html::rawElement(
-                       'div',
-                       [ 'class' => 'oo-ui-layout oo-ui-panelLayout oo-ui-indexLayout-tabPanel' ],
-                       Html::rawElement(
-                               'div',
-                               [ 'class' => 'oo-ui-widget oo-ui-widget-enabled oo-ui-selectWidget ' .
-                                       'oo-ui-selectWidget-depressed oo-ui-tabSelectWidget' ],
-                               implode( $fakeTabs )
-                       )
-               );
-
-               return Html::rawElement(
-                       'div',
-                       [ 'class' => 'oo-ui-layout oo-ui-panelLayout oo-ui-panelLayout-framed mw-prefs-faketabs' ],
-                       Html::rawElement(
-                               'div',
-                               [ 'class' => 'oo-ui-layout oo-ui-menuLayout oo-ui-menuLayout-static ' .
-                                       'oo-ui-menuLayout-top oo-ui-menuLayout-showMenu oo-ui-indexLayout' ],
-                               Html::rawElement(
-                                       'div',
-                                       [ 'class' => 'oo-ui-menuLayout-menu' ],
-                                       $fakeTabsHtml
-                               ) .
-                               Html::rawElement(
-                                       'div',
-                                       [ 'class' => 'oo-ui-menuLayout-content mw-htmlform-autoinfuse-lazy' ],
-                                       $this->displaySection( $this->mFieldTree, '', 'mw-prefsection-' )
-                               )
-                       )
-               );
+
+               $indexLayout = new OOUI\IndexLayout( [
+                       'infusable' => true,
+                       'expanded' => false,
+                       'autoFocus' => false,
+                       'classes' => [ 'mw-prefs-tabs' ],
+               ] );
+               $indexLayout->addTabPanels( $tabPanels );
+
+               return new OOUI\PanelLayout( [
+                       'framed' => true,
+                       'expanded' => false,
+                       'classes' => [ 'mw-prefs-tabs-wrapper' ],
+                       'content' => $indexLayout
+               ] );
        }
 
        /**
@@ -234,7 +195,7 @@ class PreferencesFormOOUI extends OOUIHTMLForm {
 
        /**
         * Get the keys of each top level preference section.
-        * @return array of section keys
+        * @return string[] List of section keys
         */
        function getPreferenceSections() {
                return array_keys( array_filter( $this->mFieldTree, 'is_array' ) );