Template-Variablen komfortabel anzeigen: Unterschied zwischen den Versionen
Aus Contao Community Documentation
K |
K |
||
(Eine dazwischenliegende Version von einem Benutzer wird nicht angezeigt) | |||
Zeile 15: | Zeile 15: | ||
--[[Benutzer:Andreas|Andreas Burg]] ([[Benutzer Diskussion:Andreas|Diskussion]]) 17:36, 5. Jul. 2017 (CEST)}} | --[[Benutzer:Andreas|Andreas Burg]] ([[Benutzer Diskussion:Andreas|Diskussion]]) 17:36, 5. Jul. 2017 (CEST)}} | ||
+ | ; Updates | ||
+ | ; v 1.0.0 | ||
+ | : Erkennung von binären UUIDs. | ||
+ | : 00:55, 6. Jul. 2017 (CEST) | ||
+ | |||
Man erstellt eine Datei in ROOT/templates/template-vars.php | Man erstellt eine Datei in ROOT/templates/template-vars.php | ||
<source lang="php"> | <source lang="php"> | ||
Zeile 21: | Zeile 26: | ||
/** | /** | ||
* Debug template vars | * Debug template vars | ||
+ | * @version 1.0.0 | ||
+ | * @date 6. Jul. 2017 | ||
* | * | ||
* @file ROOT/templates/template-vars.php | * @file ROOT/templates/template-vars.php | ||
Zeile 43: | Zeile 50: | ||
foreach($this->arrData as $key => $value) | foreach($this->arrData as $key => $value) | ||
{ | { | ||
− | if( | + | if(is_object($value)) |
{ | { | ||
continue; | continue; | ||
Zeile 49: | Zeile 56: | ||
$date = ''; | $date = ''; | ||
+ | $datePrefix = ''; | ||
+ | $uuidPrefix = ''; | ||
// Discover a timestamp | // Discover a timestamp | ||
if(!is_array($value) && strlen($value) == 10 && preg_match('/^\d{10}/', $value)) | if(!is_array($value) && strlen($value) == 10 && preg_match('/^\d{10}/', $value)) | ||
Zeile 56: | Zeile 65: | ||
$date = str_pad($date, 48, ' ', STR_PAD_LEFT); | $date = str_pad($date, 48, ' ', STR_PAD_LEFT); | ||
$date = ' <b>'.$date.'</b>'; | $date = ' <b>'.$date.'</b>'; | ||
+ | $datePrefix = '<b>timestamp</b> '; | ||
+ | } | ||
+ | elseif(is_string($value) && \Validator::isBinaryUuid($value)) | ||
+ | { | ||
+ | $value = \StringUtil::binToUuid($value); | ||
+ | $uuidPrefix = '<b>uuid</b> '; | ||
} | } | ||
− | |||
$vars[] = array( | $vars[] = array( | ||
Zeile 63: | Zeile 77: | ||
'value' => htmlspecialchars(print_r(str_replace(' ', ' ', $value), true)), | 'value' => htmlspecialchars(print_r(str_replace(' ', ' ', $value), true)), | ||
'date' => $date, | 'date' => $date, | ||
− | 'datePrefix' => $datePrefix | + | 'datePrefix' => $datePrefix, |
+ | 'uuidPrefix' => $uuidPrefix | ||
); | ); | ||
} | } | ||
Zeile 75: | Zeile 90: | ||
foreach($vars as $key => $var) | foreach($vars as $key => $var) | ||
{ | { | ||
− | echo '<tr><td>'.$var['key'].'</td><td>'.$var['datePrefix'].$var['value'].$var['date'].'</td></tr>'."\n"; | + | echo '<tr><td>'.$var['key'].'</td><td>'.$var['uuidPrefix'].$var['datePrefix'].$var['value'].$var['date'].'</td></tr>'."\n"; |
} | } | ||
echo '</tbody></table></div>'; | echo '</tbody></table></div>'; | ||
Zeile 168: | Zeile 183: | ||
<!-- indexer::continue --> | <!-- indexer::continue --> | ||
'; | '; | ||
+ | |||
</source> | </source> | ||
In einem Template in welchem man die Variablen untersuchen möchte fügt man folgenden Code oben oder unten ein. | In einem Template in welchem man die Variablen untersuchen möchte fügt man folgenden Code oben oder unten ein. |
Aktuelle Version vom 5. Juli 2017, 23:56 Uhr
betrifft | |
---|---|
Contao Version | 3.x.x und evtl. 2.x.x |
Hinweis: Das Vorhaben war ursprünglich, die Timestamps des Event-Listen-Moduls besser debuggen zu können.
Kann aber noch ausgebaut werden, um auch in anderen Templates die Variablen komfortabler ausgeben zu können. Evtl. kann hieraus auch eine Erweiterung entstehen. --Andreas Burg (Diskussion) 17:36, 5. Jul. 2017 (CEST) |
- Updates
- v 1.0.0
- Erkennung von binären UUIDs.
- 00:55, 6. Jul. 2017 (CEST)
Man erstellt eine Datei in ROOT/templates/template-vars.php
<?php /** * Debug template vars * @version 1.0.0 * @date 6. Jul. 2017 * * @file ROOT/templates/template-vars.php * @author: info@andreasburg.de * Activate the JS tablesorter (jQuery) in your layout to make the output table sortable. * Keep attention as it did not show objects. */ echo ' <!-- indexer::stop --> <!-- '.basename(__FILE__).' - START -->'; // Build the table echo ' <div class="debug_container"> <table class="sortable"> <thead><tr><th>key</th><th>value</th></tr></thead> <tbody>'."\n"; foreach($this->arrData as $key => $value) { if(is_object($value)) { continue; } $date = ''; $datePrefix = ''; $uuidPrefix = ''; // Discover a timestamp if(!is_array($value) && strlen($value) == 10 && preg_match('/^\d{10}/', $value)) { $date = \Date::parse('l d.m.Y H:i', $value); $date = str_replace(' ', ' ', $date); $date = str_pad($date, 48, ' ', STR_PAD_LEFT); $date = ' <b>'.$date.'</b>'; $datePrefix = '<b>timestamp</b> '; } elseif(is_string($value) && \Validator::isBinaryUuid($value)) { $value = \StringUtil::binToUuid($value); $uuidPrefix = '<b>uuid</b> '; } $vars[] = array( 'key' => $key, 'value' => htmlspecialchars(print_r(str_replace(' ', ' ', $value), true)), 'date' => $date, 'datePrefix' => $datePrefix, 'uuidPrefix' => $uuidPrefix ); } // Sort by value usort($vars, function($a, $b) { return strnatcasecmp($a['value'], $b['value']); }); // Output table rows foreach($vars as $key => $var) { echo '<tr><td>'.$var['key'].'</td><td>'.$var['uuidPrefix'].$var['datePrefix'].$var['value'].$var['date'].'</td></tr>'."\n"; } echo '</tbody></table></div>'; // Add some CSS $GLOBALS['TL_HEAD'][] = ' <!-- '.basename(__FILE__).' - START --> <style> .debug_container { max-width: 1200px; margin: 0 auto 20px; } .debug_container table { width: 100%; background-color: rgba(255, 255, 255, .9); color: rgba(0, 0, 0, .9); font-family: "DejaVu Sans Mono", "Lucida Console", Consolas, "Courier New", monospace; font-size: .8125rem; } .debug_container tr > * { padding: 6px; } th.header { text-align: left; background-color: rgba(0, 0, 0, .2); color: rgba(0, 0, 0, .9); cursor: pointer; font-weight: bold; text-transform: uppercase; } th.headerSortUp, th.headerSortDown, th.header:hover { background-color: rgba(255, 99, 71, .1); } .debug_container tbody tr:nth-child(even) { background-color: rgba(0, 0, 0, .1); } .debug_container tbody tr:hover td { background-color: rgba(255, 99, 71, .05); } .debug_container td:first-child { font-weight: bold; } .debug_container td:last-child { white-space: pre-wrap; word-wrap: break-word; } .debug_container b { color: tomato; } </style> <!-- '.basename(__FILE__).' - END --> '; // Add some JS $GLOBALS['TL_BODY'][] = ' <!-- '.basename(__FILE__).' - START --> <script> (function($) { $(document).ready(function() { // Table has to be fixed, so first calculate the width of first col TH var firstTh = $(".debug_container th:first-child"), firstThWidth = firstTh.width() ; firstTh.width(firstThWidth); $(".debug_container table").css("table-layout", "fixed"); // Initialize the tablesorter (jQuery) // TODO: Check if function tablesorter() is available $(".debug_container .sortable").tablesorter({ headers: { 1: {sorter: "text"} }, debug: false }); }); })(jQuery); </script> <!-- '.basename(__FILE__).' - END --> '; echo ' <!-- '.basename(__FILE__).' - END --> <!-- indexer::continue --> ';
In einem Template in welchem man die Variablen untersuchen möchte fügt man folgenden Code oben oder unten ein.
<?php include 'template-vars.php'; ?>
Hier nochmal das CSS aus der Datei:
.debug_container { max-width: 1200px; margin: 0 auto 20px; } .debug_container table { width: 100%; background-color: rgba(255, 255, 255, .9); color: rgba(0, 0, 0, .9); font-family: "DejaVu Sans Mono", "Lucida Console", Consolas, "Courier New", monospace; font-size: .8125rem; } .debug_container tr > * { padding: 6px; } th.header { text-align: left; background-color: rgba(0, 0, 0, .2); color: rgba(0, 0, 0, .9); cursor: pointer; font-weight: bold; text-transform: uppercase; } th.headerSortUp, th.headerSortDown, th.header:hover { background-color: rgba(255, 99, 71, .1); } .debug_container tbody tr:nth-child(even) { background-color: rgba(0, 0, 0, .1); } .debug_container tbody tr:hover td { background-color: rgba(255, 99, 71, .05); } .debug_container td:first-child { font-weight: bold; } .debug_container td:last-child { white-space: pre-wrap; word-wrap: break-word; } .debug_container b { color: tomato; }
Hier nochmal das JavaScript (jQuery) aus der Datei:
(function($) { $(document).ready(function() { // Table has to be fixed, so first calculate the width of first col TH var firstTh = $(".debug_container th:first-child"), firstThWidth = firstTh.width() ; firstTh.width(firstThWidth); $(".debug_container table").css("table-layout", "fixed"); // Initialize the tablesorter (jQuery) // TODO: Check if function tablesorter() is available $(".debug_container .sortable").tablesorter({ headers: { 1: {sorter: "text"} }, debug: false }); }); })(jQuery);