'speechBubbles',
'id' => 'ca-talk-sticky-header',
'event' => 'talk-sticky-header'
];
private const SUBJECT_ICON = [
'icon' => 'article',
'id' => 'ca-subject-sticky-header',
'event' => 'subject-sticky-header'
];
private const HISTORY_ICON = [
'icon' => 'wikimedia-history',
'id' => 'ca-history-sticky-header',
'event' => 'history-sticky-header',
];
// Event and icon will be updated depending on watchstar state
private const WATCHSTAR_ICON = [
'id' => 'ca-watchstar-sticky-header',
'event' => 'watch-sticky-header',
'icon' => 'wikimedia-star',
'is-quiet' => true,
'tabindex' => '-1',
// With the original watchstar, this class is applied to the
element
// thats the parent of the actual watchlink. In the sticky header we dont use
// the same markup, so its directly applied to the watchlink element
'class' => 'mw-watchlink'
];
private const EDIT_VE_ICON = [
'id' => 'ca-ve-edit-sticky-header',
'event' => 've-edit-sticky-header',
'icon' => 'wikimedia-edit',
];
private const EDIT_WIKITEXT_ICON = [
'id' => 'ca-edit-sticky-header',
'event' => 'wikitext-edit-sticky-header',
'icon' => 'wikimedia-wikiText',
];
private const EDIT_PROTECTED_ICON = [
'href' => '#',
'id' => 'ca-viewsource-sticky-header',
'event' => 've-edit-protected-sticky-header',
'icon' => 'wikimedia-editLock',
];
/** @var MessageLocalizer */
private $localizer;
/** @var VectorComponent */
private $search;
/** @var VectorComponent|null */
private $langButton;
/** @var bool */
private $includeEditIcons;
/**
* @param MessageLocalizer $localizer
* @param VectorComponent $searchBox
* @param VectorComponent|null $langButton
* @param bool $includeEditIcons whether to include edit icons in the result
*/
public function __construct(
MessageLocalizer $localizer,
VectorComponent $searchBox,
$langButton = null,
$includeEditIcons = false
) {
$this->search = $searchBox;
$this->langButton = $langButton;
$this->includeEditIcons = $includeEditIcons;
$this->localizer = $localizer;
}
/**
* @param mixed $key
* @return Message
*/
private function msg( $key ): Message {
return $this->localizer->msg( $key );
}
/**
* Creates array of Button components in the sticky header
*
* @return array
*/
private function getIconButtons() {
$icons = [
self::TALK_ICON,
self::SUBJECT_ICON,
self::HISTORY_ICON,
self::WATCHSTAR_ICON,
];
if ( $this->includeEditIcons ) {
$icons[] = self::EDIT_WIKITEXT_ICON;
$icons[] = self::EDIT_PROTECTED_ICON;
$icons[] = self::EDIT_VE_ICON;
}
$iconButtons = [];
foreach ( $icons as $icon ) {
$iconButtons[] = new VectorComponentButton(
// Button labels will be populated in stickyHeader.js
"",
$icon[ 'icon' ],
$icon[ 'id' ],
$icon[ 'class' ] ?? '',
[
'tabindex' => '-1',
'data-event-name' => $icon[ 'event' ],
],
'quiet',
'default',
true,
'#'
);
}
return $iconButtons;
}
/**
* Creates button data for the "Add section" button in the sticky header
*
* @return VectorComponentButton
*/
private function getAddSectionButton() {
return new VectorComponentButton(
$this->msg( [ 'vector-2022-action-addsection', 'skin-action-addsection' ] )->text(),
'speechBubbleAdd-progressive',
'ca-addsection-sticky-header',
'',
[
'tabindex' => '-1',
'data-event-name' => 'addsection-sticky-header'
],
'quiet',
'progressive',
false,
'#'
);
}
/**
* Creates button data for the "search" button in the sticky header
*
* @param array $searchBoxData
* @return VectorComponentButton
*/
private function getSearchButton( $searchBoxData ) {
return new VectorComponentButton(
$this->msg( 'search' ),
'search',
'',
'vector-sticky-header-search-toggle',
[
'tabindex' => '-1',
'data-event-name' => 'ui.' . $searchBoxData['form-id'] . '.icon'
],
'quiet',
'default',
true
);
}
/**
* @inheritDoc
*/
public function getTemplateData(): array {
$iconButtonData = array_map( static function ( $btn ) {
return $btn->getTemplateData();
}, $this->getIconButtons() );
$buttonData = $this->langButton ? [ $this->langButton->getTemplateData() ] : [];
$buttonData[] = $this->getAddSectionButton()->getTemplateData();
$searchBoxData = $this->search->getTemplateData();
$searchButtonData = $this->getSearchButton( $searchBoxData )->getTemplateData();
return [
'array-icon-buttons' => $iconButtonData,
'array-buttons' => $buttonData,
'data-button-start' => $searchButtonData,
'data-search' => $searchBoxData,
];
}
}