Move HTML construction to Minerva template and simplify

Right now the HTML construction is split between MinervaTemplate
and minerva.mustache

I'd like to move all of this to mustache to make it easier to see
how to make changes.

Additional changes:
* footer-site-heading-html was previously mapped to headinghtml
The template variable has been renamed to avoid confusion.

Change-Id: I1dfe15f6f74b51b152c206e2ea63ae460d704ab6
This commit is contained in:
jdlrobson 2019-01-10 13:41:55 -08:00
parent b4edf0cf23
commit 41b59d4a2b
3 changed files with 35 additions and 62 deletions

View File

@ -168,12 +168,9 @@ class MinervaTemplate extends BaseTemplate {
*/
protected function getSecondaryActionsHtml() {
$baseClass = MinervaUI::buttonClass( '', 'button' );
$html = Html::openElement( 'div', [
'class' => 'post-content',
'id' => 'page-secondary-actions'
] );
/** @var $skin SkinMinerva $skin */
$skin = $this->getSkin();
$html = '';
// no secondary actions on the user page
if ( $skin instanceof SkinMinerva && !$skin->getUserPageHelper()->isUserPage() ) {
foreach ( $this->getSecondaryActions() as $el ) {
@ -186,7 +183,7 @@ class MinervaTemplate extends BaseTemplate {
}
}
return $html . Html::closeElement( 'div' );
return $html;
}
/**
@ -210,56 +207,6 @@ class MinervaTemplate extends BaseTemplate {
}
}
/**
* Get the HTML for rendering pre-content (e.g. heading)
* @param array $data Data used to build the page
* @return string HTML
*/
protected function getPreContentHtml( $data ) {
$internalBanner = $data[ 'internalBanner' ];
$preBodyHtml = isset( $data['prebodyhtml'] ) ? $data['prebodyhtml'] : '';
$headingHtml = isset( $data['headinghtml'] ) ? $data['headinghtml'] : '';
$postHeadingHtml = isset( $data['postheadinghtml'] ) ? $data['postheadinghtml'] : '';
$html = '';
if ( $internalBanner || $preBodyHtml || isset( $data['page_actions'] ) ) {
$html .= $preBodyHtml
. Html::openElement( 'div', [ 'class' => 'pre-content heading-holder' ] );
if ( !$this->isSpecialPage ) {
$html .= $this->getPageActionsHtml( $data );
}
$html .= $headingHtml;
$html .= $postHeadingHtml;
$html .= $data['subtitle'];
$html .= $internalBanner;
$html .= '</div>';
}
return $html;
}
/**
* Gets HTML that needs to come after the main content and before the secondary actions.
*
* @param array $data The data used to build the page
* @return string
*/
protected function getPostContentHtml( $data ) {
return $this->getSecondaryActionsHtml();
}
/**
* Get the HTML for rendering the wrapper for loading content
* @param array $data Data used to build the page
* @return string HTML
*/
protected function getContentWrapperHtml( $data ) {
return $this->getPreContentHtml( $data ) .
$this->getContentHtml( $data ) .
$this->getPostContentHtml( $data );
}
/**
* Gets the main menu only on Special:MobileMenu.
* On other pages the menu is rendered via JS.
@ -284,6 +231,9 @@ class MinervaTemplate extends BaseTemplate {
*/
protected function render( $data ) {
$templateParser = new TemplateParser( __DIR__ );
$internalBanner = $data[ 'internalBanner' ];
$preBodyHtml = isset( $data['prebodyhtml'] ) ? $data['prebodyhtml'] : '';
$hasHeadingHolder = $internalBanner || $preBodyHtml || isset( $data['page_actions'] );
// prepare template data
$templateData = [
@ -294,7 +244,7 @@ class MinervaTemplate extends BaseTemplate {
'placeholder' => wfMessage( 'mobile-frontend-placeholder' ),
'headelement' => $data[ 'headelement' ],
'menuButton' => $data['menuButton'],
'headinghtml' => $data['footer-site-heading-html'],
'siteheading' => $data['footer-site-heading-html'],
'mainPageURL' => Title::newMainPage()->getLocalUrl(),
// A button when clicked will submit the form
// This is used so that on tablet devices with JS disabled the search button
@ -307,7 +257,16 @@ class MinervaTemplate extends BaseTemplate {
], wfMessage( 'searchbutton' ) ),
'secondaryButtonData' => $data['secondaryButtonData'],
'mainmenuhtml' => $this->getMainMenuHtml( $data ),
'contenthtml' => $this->getContentWrapperHtml( $data ),
'hasheadingholder' => $hasHeadingHolder,
'taglinehtml' => $data['taglinehtml'],
'internalBanner' => $internalBanner,
'prebodyhtml' => $preBodyHtml,
'headinghtml' => isset( $data['headinghtml'] ) ? $data['headinghtml'] : '',
'postheadinghtml' => isset( $data['postheadinghtml'] ) ? $data['postheadinghtml'] : '',
'pageactionshtml' => $this->isSpecialPage ? '' : $this->getPageActionsHtml( $data ),
'subtitle' => $data['subtitle'],
'contenthtml' => $this->getContentHtml( $data ),
'secondaryactionshtml' => $this->getSecondaryActionsHtml(),
'footer' => $this->getFooterTemplateData( $data ),
'isBeta' => $this->getSkin()->getSkinOption( SkinMinerva::OPTIONS_MOBILE_BETA ),
];

View File

@ -897,7 +897,7 @@ class SkinMinerva extends SkinTemplate {
$title = $this->getTitle();
$user = $this->getUser();
$out = $this->getOutput();
$postHeadingHtml = $this->getTaglineHtml();
$tpl->set( 'taglinehtml', $this->getTaglineHtml() );
if ( $this->getUserPageHelper()->isUserPage() ) {
$pageUser = $this->getUserPageHelper()->getPageUser();
$talkPage = $pageUser->getTalkPage();
@ -918,8 +918,9 @@ class SkinMinerva extends SkinTemplate {
'mobile-frontend-user-page-uploads' )->escaped(),
];
$templateParser = new TemplateParser( __DIR__ );
$postHeadingHtml .=
$templateParser->processTemplate( 'user_page_links', $data );
$tpl->set( 'postheadinghtml',
$templateParser->processTemplate( 'user_page_links', $data )
);
} elseif ( $title->isMainPage() ) {
if ( $user->isLoggedIn() ) {
$pageTitle = $this->msg(
@ -929,7 +930,6 @@ class SkinMinerva extends SkinTemplate {
}
$out->setPageTitle( $pageTitle );
}
$tpl->set( 'postheadinghtml', $postHeadingHtml );
if ( $this->canUseWikiPage() ) {
// If it's a page that exists, add last edited timestamp

View File

@ -12,7 +12,7 @@
<div>{{{menuButton}}}</div>
<div class="branding-box">
<a href="{{mainPageURL}}">
<span>{{{headinghtml}}}</span>
<span>{{{siteheading}}}</span>
{{#isBeta}}<sup>&beta;</sup>{{/isBeta}}
</a>
</div>
@ -26,7 +26,21 @@
</form>
</header>
<main id="content" class="mw-body">
{{#hasheadingholder}}
<div class="pre-content heading-holder">
{{{pageactionshtml}}}
{{{headinghtml}}}
{{{taglinehtml}}}
{{{postheadinghtml}}}
{{{subtitle}}}
{{{internalBanner}}}
</div>
{{/hasheadingholder}}
{{{precontenthtml}}}
{{{contenthtml}}}
<div class="post-content" id="page-secondary-actions">
{{{secondaryactionshtml}}}
</div>
</main>
{{>footer}}
</div>