From 0cdf0c238a35325db1252564e74c379fa5edbcf1 Mon Sep 17 00:00:00 2001 From: jdlrobson Date: Tue, 14 Jan 2020 10:47:30 -0800 Subject: [PATCH] Dev: Complete initial porting of Vector to Mustache Bug: T240062 Change-Id: I18cb1fda6850646a38314a7d2dd356103f04ec28 --- includes/VectorTemplate.php | 97 ++++++++++++++------------ includes/templates/Navigation.mustache | 25 +++++++ includes/templates/index.mustache | 3 +- 3 files changed, 80 insertions(+), 45 deletions(-) create mode 100644 includes/templates/Navigation.mustache diff --git a/includes/VectorTemplate.php b/includes/VectorTemplate.php index 69f4aa5..0c80f1d 100644 --- a/includes/VectorTemplate.php +++ b/includes/VectorTemplate.php @@ -126,35 +126,20 @@ class VectorTemplate extends BaseTemplate { 'html-hook-vector-before-footer' => $htmlHookVectorBeforeFooter, 'array-footer-rows' => $this->getTemplateFooterRows(), ] ), + 'html-navigation' => $this->templateParser->processTemplate( 'Navigation', [ + 'html-navigation-heading' => $this->getMsg( 'navigation-heading' ), + 'html-personal-menu' => $this->renderNavigation( [ 'PERSONAL' ] ), + 'html-navigation-left-tabs' => $this->renderNavigation( [ 'NAMESPACES', 'VARIANTS' ] ), + 'html-navigation-right-tabs' => $this->renderNavigation( [ 'VIEWS', 'ACTIONS', 'SEARCH' ] ), + 'html-logo' => '', + 'html-portals' => $this->renderPortals( $this->data['sidebar'] ), + ] ), ]; - // TODO: Convert the rest to Mustache - ob_start(); - ?> -
-

msg( 'navigation-heading' ) ?>

-
- renderNavigation( [ 'PERSONAL' ] ); ?> -
- renderNavigation( [ 'NAMESPACES', 'VARIANTS' ] ); ?> -
-
- renderNavigation( [ 'VIEWS', 'ACTIONS', 'SEARCH' ] ); ?> -
-
-
- - renderPortals( $this->data['sidebar'] ); ?> -
-
- templateParser->processTemplate( 'index', $params ); } @@ -212,8 +197,10 @@ class VectorTemplate extends BaseTemplate { * Render a series of portals * * @param array $portals + * @return string */ protected function renderPortals( array $portals ) { + $html = ''; // Force the rendering of the following portals if ( !isset( $portals['TOOLBOX'] ) ) { $portals['TOOLBOX'] = true; @@ -234,19 +221,24 @@ class VectorTemplate extends BaseTemplate { case 'SEARCH': break; case 'TOOLBOX': - $this->renderPortal( 'tb', $this->getToolbox(), 'toolbox', 'SkinTemplateToolboxEnd' ); + $html .= $this->renderPortal( 'tb', $this->getToolbox(), 'toolbox', 'SkinTemplateToolboxEnd' ); + ob_start(); Hooks::run( 'VectorAfterToolbox', [], '1.35' ); + $html .= ob_get_clean(); break; case 'LANGUAGES': if ( $this->data['language_urls'] !== false ) { - $this->renderPortal( 'lang', $this->data['language_urls'], 'otherlanguages' ); + $html .= $this->renderPortal( + 'lang', $this->data['language_urls'], 'otherlanguages' + ); } break; default: - $this->renderPortal( $name, $content ); + $html .= $this->renderPortal( $name, $content ); break; } } + return $html; } /** @@ -254,6 +246,7 @@ class VectorTemplate extends BaseTemplate { * @param array|string $content * @param null|string $msg * @param null|string|array $hook + * @return string */ protected function renderPortal( $name, $content, $msg = null, $hook = null ) { if ( $msg === null ) { @@ -291,7 +284,7 @@ class VectorTemplate extends BaseTemplate { $props['html-portal-content'] = $content; } - echo $this->templateParser->processTemplate( 'Portal', $props ); + return $this->templateParser->processTemplate( 'Portal', $props ); } /** @@ -299,31 +292,34 @@ class VectorTemplate extends BaseTemplate { * when UI is in RTL mode * * @param array $elements + * @return string */ protected function renderNavigation( array $elements ) { + $html = ''; // Render elements foreach ( $elements as $name => $element ) { switch ( $element ) { case 'NAMESPACES': - $this->renderNamespacesComponent(); + $html .= $this->renderNamespacesComponent(); break; case 'VARIANTS': - $this->renderVariantsComponent(); + $html .= $this->renderVariantsComponent(); break; case 'VIEWS': - $this->renderViewsComponent(); + $html .= $this->renderViewsComponent(); break; case 'ACTIONS': - $this->renderActionsComponent(); + $html .= $this->renderActionsComponent(); break; case 'PERSONAL': - $this->renderPersonalComponent(); + $html .= $this->renderPersonalComponent(); break; case 'SEARCH': - $this->renderSearchComponent(); + $html .= $this->renderSearchComponent(); break; } } + return $html; } /** @@ -354,6 +350,9 @@ class VectorTemplate extends BaseTemplate { return parent::makeListItem( $key, $item, $options ); } + /** + * @return string + */ private function renderNamespacesComponent() { $props = [ 'tabs-id' => 'p-namespaces', @@ -368,9 +367,12 @@ class VectorTemplate extends BaseTemplate { $props[ 'html-items' ] .= $this->makeListItem( $key, $item ); } - echo $this->templateParser->processTemplate( 'VectorTabs', $props ); + return $this->templateParser->processTemplate( 'VectorTabs', $props ); } + /** + * @return string + */ private function renderVariantsComponent() { $props = [ 'empty-portlet' => ( count( $this->data['variant_urls'] ) == 0 ) ? 'emptyPortlet' : '', @@ -392,9 +394,12 @@ class VectorTemplate extends BaseTemplate { $props['html-items'] .= $this->makeListItem( $key, $item ); } - echo $this->templateParser->processTemplate( 'VectorMenu', $props ); + return $this->templateParser->processTemplate( 'VectorMenu', $props ); } + /** + * @return string + */ private function renderViewsComponent() { $props = [ 'tabs-id' => 'p-views', @@ -411,9 +416,12 @@ class VectorTemplate extends BaseTemplate { ] ); } - echo $this->templateParser->processTemplate( 'VectorTabs', $props ); + return $this->templateParser->processTemplate( 'VectorTabs', $props ); } + /** + * @return string + */ private function renderActionsComponent() { $props = [ 'empty-portlet' => ( count( $this->data['action_urls'] ) == 0 ) ? 'emptyPortlet' : '', @@ -428,9 +436,12 @@ class VectorTemplate extends BaseTemplate { $props['html-items'] .= $this->makeListItem( $key, $item ); } - echo $this->templateParser->processTemplate( 'VectorMenu', $props ); + return $this->templateParser->processTemplate( 'VectorMenu', $props ); } + /** + * @return string + */ private function renderPersonalComponent() { $personalTools = $this->getPersonalTools(); $props = [ @@ -460,7 +471,7 @@ class VectorTemplate extends BaseTemplate { $props['html-personal-tools'] .= $this->makeListItem( $key, $item ); } - echo $this->templateParser->processTemplate( 'PersonalMenu', $props ); + return $this->templateParser->processTemplate( 'PersonalMenu', $props ); } private function renderSearchComponent() { @@ -480,6 +491,6 @@ class VectorTemplate extends BaseTemplate { ), 'searchInputLabel' => $this->getMsg( 'search' ) ]; - echo $this->templateParser->processTemplate( 'SearchBox', $props ); + return $this->templateParser->processTemplate( 'SearchBox', $props ); } } diff --git a/includes/templates/Navigation.mustache b/includes/templates/Navigation.mustache new file mode 100644 index 0000000..54568eb --- /dev/null +++ b/includes/templates/Navigation.mustache @@ -0,0 +1,25 @@ +{{! + string html-navigation-heading heading for entire navigation that is + usually hidden to screen readers + string html-personal-menu content that appears as the first child of mw-head + string html-navigation-left-tabs that appears inside #left-navigation (namespaces and variants) + string html-navigation-right-tabs that appears inside #right-navigation (page actions and search) + string html-logo for site logo + string html-portals for portal(s) that appear in the main menu for Vector +}} +
+

{{{html-navigation-heading}}}

+
+ {{{html-personal-menu}}} +
+ {{{html-navigation-left-tabs}}} +
+
+ {{{html-navigation-right-tabs}}} +
+
+
+ {{{html-logo}}} + {{{html-portals}}} +
+
diff --git a/includes/templates/index.mustache b/includes/templates/index.mustache index a46077b..572bbb5 100644 --- a/includes/templates/index.mustache +++ b/includes/templates/index.mustache @@ -29,7 +29,6 @@ {{{html-dataAfterContent}}} -{{! html-unported outputs
and