cerebrate-project
/
cerebrate
mirror of https://github.com/cerebrate-project/cerebrate
1
0
Fork 0
Code Issues Releases Wiki Activity

chg: [genericElements:index_table] Moved description to a tooltip 

Description describing indexes are great when discovering an app for the first time but start taking important place and become useless when users gets to know the app better. Moving it to a tooltip makes sense in that regard.
pull/93/head
Sami Mokaddem 2021-11-15 08:29:16 +01:00
parent 509b203591
commit 7cf7363009
No known key found for this signature in database
GPG Key ID: 164C473F627A06FA
2 changed files with 136 additions and 118 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/View/Helper/BootstrapHelper.php
View File

@ -999,6 +999,8 @@ class BoostrapIcon extends BootstrapGeneric {
private $icon = ''; private $icon = '';
private $defaultOptions = [ private $defaultOptions = [
'class' => [], 'class' => [],
'title' => '',
'params' => [],
]; ];
function __construct($icon, $options=[]) { function __construct($icon, $options=[]) {
@ -1019,12 +1021,13 @@ class BoostrapIcon extends BootstrapGeneric {
private function genIcon() private function genIcon()
{ {
$html = $this->genNode('span', [ $html = $this->genNode('span', array_merge([
'class' => array_merge( 'class' => array_merge(
is_array($this->options['class']) ? $this->options['class'] : [$this->options['class']], is_array($this->options['class']) ? $this->options['class'] : [$this->options['class']],
["fa fa-{$this->icon}"] ["fa fa-{$this->icon}"]
), ),
]); 'title' => h($this->options['title'])
], $this->options['params']));
return $html; return $html;
} }
} }

247
templates/element/genericElements/IndexTable/index_table.php
View File

@ -1,4 +1,6 @@
<?php <?php
use Cake\Utility\Text;
/* /*
* echo $this->element('/genericElements/IndexTable/index_table', [ * echo $this->element('/genericElements/IndexTable/index_table', [
* 'top_bar' => ( * 'top_bar' => (
@ -17,131 +19,137 @@
* *
*/ */
$newMetaFields = []; $newMetaFields = [];
if (!empty($requestedMetaFields)) { // Create mapping for new index table fields on the fly if (!empty($requestedMetaFields)) { // Create mapping for new index table fields on the fly
foreach ($requestedMetaFields as $requestedMetaField) { foreach ($requestedMetaFields as $requestedMetaField) {
$template_id = $requestedMetaField['template_id']; $template_id = $requestedMetaField['template_id'];
$meta_template_field_id = $requestedMetaField['meta_template_field_id']; $meta_template_field_id = $requestedMetaField['meta_template_field_id'];
$newMetaFields[] = [ $newMetaFields[] = [
'name' => $meta_templates[$template_id]['meta_template_fields'][$meta_template_field_id]['field'], 'name' => $meta_templates[$template_id]['meta_template_fields'][$meta_template_field_id]['field'],
'data_path' => "MetaTemplates.{$template_id}.meta_template_fields.{$meta_template_field_id}.metaFields.{n}.value", 'data_path' => "MetaTemplates.{$template_id}.meta_template_fields.{$meta_template_field_id}.metaFields.{n}.value",
'element' => 'generic_field', 'element' => 'generic_field',
'_metafield' => true, '_metafield' => true,
'_automatic_field' => true, '_automatic_field' => true,
];
}
}
$data['fields'] = array_merge($data['fields'], $newMetaFields);
$tableRandomValue = Cake\Utility\Security::randomString(8);
echo '<div id="table-container-' . h($tableRandomValue) . '">';
if (!empty($data['title'])) {
echo sprintf('<h2 class="fw-light">%s</h2>', h($data['title']));
}
if (!empty($data['description'])) {
echo sprintf(
'<div class="fw-light">%s</div>',
empty($data['description']) ? '' : h($data['description'])
);
}
echo '<div class="panel">';
if (!empty($data['html'])) {
echo sprintf('<div>%s</div>', $data['html']);
}
$skipPagination = isset($data['skip_pagination']) ? $data['skip_pagination'] : 0;
if (!$skipPagination) {
$paginationData = !empty($data['paginatorOptions']) ? $data['paginatorOptions'] : [];
echo $this->element(
'/genericElements/IndexTable/pagination',
[
'paginationOptions' => $paginationData,
'tableRandomValue' => $tableRandomValue
]
);
echo $this->element(
'/genericElements/IndexTable/pagination_links'
);
}
$multiSelectData = getMultiSelectData($data['top_bar']);
if (!empty($multiSelectData)) {
$multiSelectField = [
'element' => 'selector',
'class' => 'short',
'data' => $multiSelectData['data']
]; ];
array_unshift($data['fields'], $multiSelectField);
} }
if (!empty($data['top_bar'])) { }
echo $this->element( $data['fields'] = array_merge($data['fields'], $newMetaFields);
'/genericElements/ListTopBar/scaffold',
[ $tableRandomValue = Cake\Utility\Security::randomString(8);
'data' => $data['top_bar'], echo '<div id="table-container-' . h($tableRandomValue) . '">';
'table_data' => $data, if (!empty($data['title'])) {
'tableRandomValue' => $tableRandomValue echo Text::insert(
] '<h2 class="fw-light">:title :help</h2>',
); [
} 'title' => h($data['title']),
$rows = ''; 'help' => $this->Bootstrap->icon('info', [
$row_element = isset($data['row_element']) ? $data['row_element'] : 'row'; 'class' => ['fs-6', 'align-text-top',],
$options = isset($data['options']) ? $data['options'] : []; 'title' => empty($data['description']) ? '' : h($data['description']),
$actions = isset($data['actions']) ? $data['actions'] : []; 'params' => [
if ($this->request->getParam('prefix') === 'Open') { 'data-bs-toggle' => 'tooltip',
$actions = [];
}
$dblclickActionArray = !empty($actions) ? $this->Hash->extract($actions, '{n}[dbclickAction]') : [];
$dbclickAction = '';
foreach ($data['data'] as $k => $data_row) {
$primary = null;
if (!empty($data['primary_id_path'])) {
$primary = $this->Hash->extract($data_row, $data['primary_id_path'])[0];
}
if (!empty($dblclickActionArray)) {
$dbclickAction = sprintf("changeLocationFromIndexDblclick(%s)", $k);
}
$rows .= sprintf(
'<tr data-row-id="%s" %s %s class="%s %s">%s</tr>',
h($k),
empty($dbclickAction) ? '' : 'ondblclick="' . $dbclickAction . '"',
empty($primary) ? '' : 'data-primary-id="' . $primary . '"',
empty($data['row_modifier']) ? '' : h($data['row_modifier']($data_row)),
empty($data['class']) ? '' : h($data['row_class']),
$this->element(
'/genericElements/IndexTable/' . $row_element,
[
'k' => $k,
'row' => $data_row,
'fields' => $data['fields'],
'options' => $options,
'actions' => $actions,
'primary' => $primary,
'tableRandomValue' => $tableRandomValue
] ]
) ]),
); ]
);
}
echo '<div class="panel">';
if (!empty($data['html'])) {
echo sprintf('<div>%s</div>', $data['html']);
}
$skipPagination = isset($data['skip_pagination']) ? $data['skip_pagination'] : 0;
if (!$skipPagination) {
$paginationData = !empty($data['paginatorOptions']) ? $data['paginatorOptions'] : [];
echo $this->element(
'/genericElements/IndexTable/pagination',
[
'paginationOptions' => $paginationData,
'tableRandomValue' => $tableRandomValue
]
);
echo $this->element(
'/genericElements/IndexTable/pagination_links'
);
}
$multiSelectData = getMultiSelectData($data['top_bar']);
if (!empty($multiSelectData)) {
$multiSelectField = [
'element' => 'selector',
'class' => 'short',
'data' => $multiSelectData['data']
];
array_unshift($data['fields'], $multiSelectField);
}
if (!empty($data['top_bar'])) {
echo $this->element(
'/genericElements/ListTopBar/scaffold',
[
'data' => $data['top_bar'],
'table_data' => $data,
'tableRandomValue' => $tableRandomValue
]
);
}
$rows = '';
$row_element = isset($data['row_element']) ? $data['row_element'] : 'row';
$options = isset($data['options']) ? $data['options'] : [];
$actions = isset($data['actions']) ? $data['actions'] : [];
if ($this->request->getParam('prefix') === 'Open') {
$actions = [];
}
$dblclickActionArray = !empty($actions) ? $this->Hash->extract($actions, '{n}[dbclickAction]') : [];
$dbclickAction = '';
foreach ($data['data'] as $k => $data_row) {
$primary = null;
if (!empty($data['primary_id_path'])) {
$primary = $this->Hash->extract($data_row, $data['primary_id_path'])[0];
} }
$tbody = '<tbody>' . $rows . '</tbody>'; if (!empty($dblclickActionArray)) {
echo sprintf( $dbclickAction = sprintf("changeLocationFromIndexDblclick(%s)", $k);
'<table class="table table-hover" id="index-table-%s" data-table-random-value="%s" data-reload-url="%s">%s%s</table>', }
$tableRandomValue, $rows .= sprintf(
$tableRandomValue, '<tr data-row-id="%s" %s %s class="%s %s">%s</tr>',
h($this->Url->build(['action' => $this->request->getParam('action'),])), h($k),
empty($dbclickAction) ? '' : 'ondblclick="' . $dbclickAction . '"',
empty($primary) ? '' : 'data-primary-id="' . $primary . '"',
empty($data['row_modifier']) ? '' : h($data['row_modifier']($data_row)),
empty($data['class']) ? '' : h($data['row_class']),
$this->element( $this->element(
'/genericElements/IndexTable/headers', '/genericElements/IndexTable/' . $row_element,
[ [
'k' => $k,
'row' => $data_row,
'fields' => $data['fields'], 'fields' => $data['fields'],
'paginator' => $this->Paginator, 'options' => $options,
'actions' => (empty($actions) ? false : true), 'actions' => $actions,
'primary' => $primary,
'tableRandomValue' => $tableRandomValue 'tableRandomValue' => $tableRandomValue
] ]
), )
$tbody
); );
if (!$skipPagination) { }
echo $this->element('/genericElements/IndexTable/pagination_counter', $paginationData); $tbody = '<tbody>' . $rows . '</tbody>';
echo $this->element('/genericElements/IndexTable/pagination_links'); echo sprintf(
} '<table class="table table-hover" id="index-table-%s" data-table-random-value="%s" data-reload-url="%s">%s%s</table>',
echo '</div>'; $tableRandomValue,
echo '</div>'; $tableRandomValue,
h($this->Url->build(['action' => $this->request->getParam('action'),])),
$this->element(
'/genericElements/IndexTable/headers',
[
'fields' => $data['fields'],
'paginator' => $this->Paginator,
'actions' => (empty($actions) ? false : true),
'tableRandomValue' => $tableRandomValue
]
),
$tbody
);
if (!$skipPagination) {
echo $this->element('/genericElements/IndexTable/pagination_counter', $paginationData);
echo $this->element('/genericElements/IndexTable/pagination_links');
}
echo '</div>';
echo '</div>';
?> ?>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() { $(document).ready(function() {
@ -158,11 +166,18 @@
$(this).addClass('fa-eye'); $(this).addClass('fa-eye');
} }
}); });
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
var tooltipList = tooltipTriggerList.map(function(tooltipTriggerEl) {
return new bootstrap.Tooltip(tooltipTriggerEl)
})
}); });
</script> </script>
<?php <?php
function getMultiSelectData($topbar) { function getMultiSelectData($topbar)
{
foreach ($topbar['children'] as $child) { foreach ($topbar['children'] as $child) {
if (!empty($child['type']) && $child['type'] == 'multi_select_actions') { if (!empty($child['type']) && $child['type'] == 'multi_select_actions') {
return $child; return $child;