IMPR: Add some options to Accordion element

This commit is contained in:
Tony Air 2022-02-28 14:23:43 +02:00
parent 2135329f4f
commit 27c7539f6f
2 changed files with 23 additions and 3 deletions

View File

@ -9,6 +9,7 @@
namespace A2nt\ElementalBasics\Elements; namespace A2nt\ElementalBasics\Elements;
use DNADesign\ElementalList\Model\ElementList; use DNADesign\ElementalList\Model\ElementList;
use SilverStripe\Forms\CheckboxField;
class AccordionElement extends ElementList class AccordionElement extends ElementList
{ {
@ -21,6 +22,11 @@ class AccordionElement extends ElementList
private static $table_name = 'AccordionElement'; private static $table_name = 'AccordionElement';
private static $db = [
'OpenFirst' => 'Boolean(0)',
'KeepOpenned' => 'Boolean(0)',
];
public function getType() public function getType()
{ {
return self::$singular_name; return self::$singular_name;
@ -30,4 +36,16 @@ class AccordionElement extends ElementList
{ {
return $this->Elements()->renderWith(static::class.'_AccordionArea'); return $this->Elements()->renderWith(static::class.'_AccordionArea');
} }
public function getCMSFields()
{
$fields = parent::getCMSFields();
$fields->addFieldsToTab('Root.Main', [
CheckboxField::create('OpenFirst', 'Open first accordion element on page load'),
CheckboxField::create('KeepOpenned', 'Keep elements oppened'),
]);
return $fields;
}
} }

View File

@ -6,7 +6,7 @@
<button <button
data-bs-toggle="collapse" data-bs-toggle="collapse"
data-bs-target="#ElementContent{$ID}" data-bs-target="#ElementContent{$ID}"
aria-expanded="false" aria-expanded="<% if $First && $OpenFirst %>true<% else %>false<% end_if %>"
aria-controls="ElementContent{$ID}" aria-controls="ElementContent{$ID}"
class="accordion-button collapsed" class="accordion-button collapsed"
>$Title</button> >$Title</button>
@ -14,9 +14,11 @@
<div <div
id="ElementContent{$ID}" id="ElementContent{$ID}"
class="accordion-collapse collapse" class="accordion-collapse collapse<% if $First && $OpenFirst %> show<% end_if %>"
aria-labelledby="ElementHeader{$ID}" aria-labelledby="ElementHeader{$ID}"
<% if not $Up.KeepOpenned %>
data-bs-parent="#ElementAccordion{$Parent.ID}" data-bs-parent="#ElementAccordion{$Parent.ID}"
<% end_if %>
> >
<div class="accordion-body">$Me</div> <div class="accordion-body">$Me</div>
</div> </div>