chg: [helpers:bootstrap] General improvements

pull/39/head
mokaddem 2021-02-23 08:45:35 +01:00
parent ebb388ae60
commit ccf95361dd
1 changed files with 55 additions and 63 deletions

View File

@ -84,11 +84,21 @@ class BootstrapGeneric
} }
} }
protected static function genNode($node, $params=[]) protected static function genNode($node, $params=[], $content="")
{
return sprintf('<%s %s>%s</%s>', $node, BootstrapGeneric::genHTMLParams($params), $content, $node);
}
protected static function openNode($node, $params=[])
{ {
return sprintf('<%s %s>', $node, BootstrapGeneric::genHTMLParams($params)); return sprintf('<%s %s>', $node, BootstrapGeneric::genHTMLParams($params));
} }
protected static function closeNode($node)
{
return sprintf('</%s>', $node);
}
protected static function genHTMLParams($params) protected static function genHTMLParams($params)
{ {
$html = ''; $html = '';
@ -230,55 +240,55 @@ class BootstrapTabs extends BootstrapGeneric
{ {
$html = ''; $html = '';
if ($this->options['card']) { if ($this->options['card']) {
$html .= $this->genNode('div', ['class' => array_merge(['card'], ["border-{$this->options['header-border-variant']}"])]); $html .= $this->openNode('div', ['class' => array_merge(['card'], ["border-{$this->options['header-border-variant']}"])]);
$html .= $this->genNode('div', ['class' => array_merge(['card-header'], ["bg-{$this->options['header-variant']}", "text-{$this->options['header-text-variant']}"])]); $html .= $this->openNode('div', ['class' => array_merge(['card-header'], ["bg-{$this->options['header-variant']}", "text-{$this->options['header-text-variant']}"])]);
} }
$html .= $this->genNav(); $html .= $this->genNav();
if ($this->options['card']) { if ($this->options['card']) {
$html .= '</div>'; $html .= $this->closeNode('div');
$html .= $this->genNode('div', ['class' => array_merge(['card-body'], ["bg-{$this->options['body-variant']}", "text-{$this->options['body-text-variant']}"])]); $html .= $this->openNode('div', ['class' => array_merge(['card-body'], ["bg-{$this->options['body-variant']}", "text-{$this->options['body-text-variant']}"])]);
} }
$html .= $this->genContent(); $html .= $this->genContent();
if ($this->options['card']) { if ($this->options['card']) {
$html .= '</div>'; $html .= $this->closeNode('div');
$html .= '</div>'; $html .= $this->closeNode('div');
} }
return $html; return $html;
} }
private function genVerticalTabs() private function genVerticalTabs()
{ {
$html = $this->genNode('div', ['class' => array_merge(['row', ($this->options['card'] ? 'card flex-row' : '')], ["border-{$this->options['header-border-variant']}"])]); $html = $this->openNode('div', ['class' => array_merge(['row', ($this->options['card'] ? 'card flex-row' : '')], ["border-{$this->options['header-border-variant']}"])]);
$html .= $this->genNode('div', ['class' => array_merge(['col-' . $this->options['vertical-size'], ($this->options['card'] ? 'card-header border-right' : '')], ["bg-{$this->options['header-variant']}", "text-{$this->options['header-text-variant']}", "border-{$this->options['header-border-variant']}"])]); $html .= $this->openNode('div', ['class' => array_merge(['col-' . $this->options['vertical-size'], ($this->options['card'] ? 'card-header border-right' : '')], ["bg-{$this->options['header-variant']}", "text-{$this->options['header-text-variant']}", "border-{$this->options['header-border-variant']}"])]);
$html .= $this->genNav(); $html .= $this->genNav();
$html .= '</div>'; $html .= $this->closeNode('div');
$html .= $this->genNode('div', ['class' => array_merge(['col-' . (12 - $this->options['vertical-size']), ($this->options['card'] ? 'card-body2' : '')], ["bg-{$this->options['body-variant']}", "text-{$this->options['body-text-variant']}"])]); $html .= $this->openNode('div', ['class' => array_merge(['col-' . (12 - $this->options['vertical-size']), ($this->options['card'] ? 'card-body2' : '')], ["bg-{$this->options['body-variant']}", "text-{$this->options['body-text-variant']}"])]);
$html .= $this->genContent(); $html .= $this->genContent();
$html .= '</div>'; $html .= $this->closeNode('div');
$html .= '</div>'; $html .= $this->closeNode('div');
return $html; return $html;
} }
private function genNav() private function genNav()
{ {
$html = $this->genNode('ul', [ $html = $this->openNode('ul', [
'class' => array_merge(['nav'], $this->bsClasses['nav'], $this->options['nav-class']), 'class' => array_merge(['nav'], $this->bsClasses['nav'], $this->options['nav-class']),
'role' => 'tablist', 'role' => 'tablist',
]); ]);
foreach ($this->data['navs'] as $navItem) { foreach ($this->data['navs'] as $navItem) {
$html .= $this->genNavItem($navItem); $html .= $this->genNavItem($navItem);
} }
$html .= '</ul>'; $html .= $this->closeNode('ul');
return $html; return $html;
} }
private function genNavItem($navItem) private function genNavItem($navItem)
{ {
$html = $this->genNode('li', [ $html = $this->openNode('li', [
'class' => array_merge(['nav-item'], $this->bsClasses['nav-item'], $this->options['nav-item-class']), 'class' => array_merge(['nav-item'], $this->bsClasses['nav-item'], $this->options['nav-item-class']),
'role' => 'presentation', 'role' => 'presentation',
]); ]);
$html .= $this->genNode('a', [ $html .= $this->openNode('a', [
'class' => array_merge( 'class' => array_merge(
['nav-link'], ['nav-link'],
[!empty($navItem['active']) ? 'active' : ''], [!empty($navItem['active']) ? 'active' : ''],
@ -296,34 +306,32 @@ class BootstrapTabs extends BootstrapGeneric
} else { } else {
$html .= h($navItem['text']); $html .= h($navItem['text']);
} }
$html .= '</a></li>'; $html .= $this->closeNode('a');
$html .= $this->closeNode('li');
return $html; return $html;
} }
private function genContent() private function genContent()
{ {
$html = $this->genNode('div', [ $html = $this->openNode('div', [
'class' => array_merge(['tab-content'], $this->options['content-class']), 'class' => array_merge(['tab-content'], $this->options['content-class']),
]); ]);
foreach ($this->data['content'] as $i => $content) { foreach ($this->data['content'] as $i => $content) {
$navItem = $this->data['navs'][$i]; $navItem = $this->data['navs'][$i];
$html .= $this->genContentItem($navItem, $content); $html .= $this->genContentItem($navItem, $content);
} }
$html .= '</div>'; $html .= $this->closeNode('div');
return $html; return $html;
} }
private function genContentItem($navItem, $content) private function genContentItem($navItem, $content)
{ {
$html = $this->genNode('div', [ return $this->genNode('div', [
'class' => array_merge(['tab-pane', 'fade'], [!empty($navItem['active']) ? 'show active' : '']), 'class' => array_merge(['tab-pane', 'fade'], [!empty($navItem['active']) ? 'show active' : '']),
'role' => 'tabpanel', 'role' => 'tabpanel',
'id' => $navItem['id'], 'id' => $navItem['id'],
'aria-labelledby' => $navItem['id'] . '-tab' 'aria-labelledby' => $navItem['id'] . '-tab'
]); ], $content);
$html .= $content;
$html .= '</div>';
return $html;
} }
} }
@ -358,7 +366,7 @@ class BoostrapAlert extends BootstrapGeneric {
private function genAlert() private function genAlert()
{ {
$html = BootstrapGeneric::genNode('div', [ $html = $this->openNode('div', [
'class' => [ 'class' => [
'alert', 'alert',
"alert-{$this->options['variant']}", "alert-{$this->options['variant']}",
@ -370,7 +378,7 @@ class BoostrapAlert extends BootstrapGeneric {
$html .= $this->genContent(); $html .= $this->genContent();
$html .= $this->genCloseButton(); $html .= $this->genCloseButton();
$html .= '</div>'; $html .= $this->closeNode('div');
return $html; return $html;
} }
@ -378,30 +386,23 @@ class BoostrapAlert extends BootstrapGeneric {
{ {
$html = ''; $html = '';
if ($this->options['dismissible']) { if ($this->options['dismissible']) {
$html .= BootstrapGeneric::genNode('button', [ $html .= $this->openNode('button', [
'type' => 'button', 'type' => 'button',
'class' => 'close', 'class' => 'close',
'data-dismiss' => 'alert', 'data-dismiss' => 'alert',
'arial-label' => 'close' 'arial-label' => 'close'
]); ]);
$html .= BootstrapGeneric::genNode('span', [ $html .= $this->genNode('span', [
'arial-hidden' => 'true' 'arial-hidden' => 'true'
]); ], '&times;');
$html .= '&times;'; $html .= $this->closeNode('button');
$html .= '</span></button>';
} }
return $html; return $html;
} }
private function genContent() private function genContent()
{ {
$html = ''; return !is_null($this->options['html']) ? $this->options['html'] : $this->options['text'];
if (!is_null($this->options['html'])) {
$html .= $this->options['html'];
} else {
$html .= h($this->options['text']);
}
return $html;
} }
} }
@ -443,7 +444,7 @@ class BoostrapTable extends BootstrapGeneric {
private function genTable() private function genTable()
{ {
$html = BootstrapGeneric::genNode('table', [ $html = $this->openNode('table', [
'class' => [ 'class' => [
'table', 'table',
"table-{$this->options['variant']}", "table-{$this->options['variant']}",
@ -461,43 +462,40 @@ class BoostrapTable extends BootstrapGeneric {
$html .= $this->genHeader(); $html .= $this->genHeader();
$html .= $this->genBody(); $html .= $this->genBody();
$html .= '</table>'; $html .= $this->closeNode('table');
return $html; return $html;
} }
private function genHeader() private function genHeader()
{ {
$head = BootstrapGeneric::genNode('thead', [ $head = $this->openNode('thead', [
'class' => [ 'class' => [
!empty($this->options['headerClass']) ? $this->options['headerClass'] : '' !empty($this->options['headerClass']) ? $this->options['headerClass'] : ''
], ],
]); ]);
$head .= BootstrapGeneric::genNode('tr'); $head .= $this->openNode('tr');
foreach ($this->fields as $i => $field) { foreach ($this->fields as $i => $field) {
if (is_array($field)) { if (is_array($field)) {
$label = !empty($field['label']) ? $field['label'] : Inflector::humanize($field['key']); $label = !empty($field['label']) ? $field['label'] : Inflector::humanize($field['key']);
} else { } else {
$label = Inflector::humanize($field); $label = Inflector::humanize($field);
} }
$head .= BootstrapGeneric::genNode('th', [ $head .= $this->genNode('th', [], h($label));
]);
$head .= h($label);
$head .= '</th>';
} }
$head .= '</tr>'; $head .= $this->closeNode('tr');
$head .= '</head>'; $head .= $this->closeNode('thead');
return $head; return $head;
} }
private function genBody() private function genBody()
{ {
$body = BootstrapGeneric::genNode('tbody', [ $body = $this->openNode('tbody', [
'class' => [ 'class' => [
!empty($this->options['bodyClass']) ? $this->options['bodyClass'] : '' !empty($this->options['bodyClass']) ? $this->options['bodyClass'] : ''
], ],
]); ]);
foreach ($this->items as $i => $row) { foreach ($this->items as $i => $row) {
$body .= BootstrapGeneric::genNode('tr',[ $body .= $this->openNode('tr',[
'class' => [ 'class' => [
!empty($row['_rowVariant']) ? "table-{$row['_rowVariant']}" : '' !empty($row['_rowVariant']) ? "table-{$row['_rowVariant']}" : ''
] ]
@ -510,27 +508,21 @@ class BoostrapTable extends BootstrapGeneric {
$key = $field; $key = $field;
} }
$cellValue = $row[$key]; $cellValue = $row[$key];
$body .= BootstrapGeneric::genNode('td', [ $body .= $this->genNode('td', [], h($cellValue));
]);
$body .= h($cellValue);
$body .= '</td>';
} }
} else { } else {
foreach ($row as $cellValue) { foreach ($row as $cellValue) {
$body .= BootstrapGeneric::genNode('td', [ $body .= $this->genNode('td', [], h($cellValue));
]);
$body .= h($cellValue);
$body .= '</td>';
} }
} }
$body .= '</tr>'; $body .= $this->closeNode('tr');;
} }
$body .= '</tbody'; $body .= $this->closeNode('tbody');;
return $body; return $body;
} }
private function genCaption() private function genCaption()
{ {
return "<caption>{$this->caption}</caption>"; return $this->genNode('caption', [], h($this->caption));
} }
} }