97eab7f35b
Previously the form was only collapsible/expandable using the small link-button on the far right. Now you can click on the entire header to do it, and it has an appropriate pretty icon. We add appropriate ARIA `role` and textual labels. Together with recently added `toggleARIA` option of jquery.makeCollapsible in Ic457bda58e56f we feature a screen reader workable output. Bug: T222904 Change-Id: I6964296bc6870550478de662d21f12a1fc084c15
29 lines
782 B
PHP
29 lines
782 B
PHP
<?php
|
|
|
|
class CollapsibleFieldsetLayout extends OOUI\FieldsetLayout {
|
|
public function __construct( array $config = [] ) {
|
|
parent::__construct( $config );
|
|
|
|
$this->addClasses( [ 'mw-collapsible' ] );
|
|
if ( isset( $config[ 'collapsed' ] ) && $config[ 'collapsed' ] ) {
|
|
$this->addClasses( [ 'mw-collapsed' ] );
|
|
}
|
|
$this->header->addClasses( [ 'mw-collapsible-toggle' ] );
|
|
$this->group->addClasses( [ 'mw-collapsible-content' ] );
|
|
|
|
$this->header->appendContent(
|
|
new OOUI\IconWidget( [
|
|
'icon' => 'expand',
|
|
'label' => wfMessage( 'collapsible-expand' )->text(),
|
|
] ),
|
|
new OOUI\IconWidget( [
|
|
'icon' => 'collapse',
|
|
'label' => wfMessage( 'collapsible-collapse' )->text(),
|
|
] )
|
|
);
|
|
|
|
$this->header->setAttributes( [
|
|
'role' => 'button',
|
|
] );
|
|
}
|
|
}
|