Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <?php
- $staticGroups = array();
- foreach($this->plxMotor->aStats as $staticId=>$staticPage) {
- if(
- intval($staticPage['active']) === 1 and
- // $staticPage['menu'] !== 'oui' and
- !empty(trim($staticPage['group']))
- ) {
- $group = $staticPage['group'];
- if(!array_key_exists($group, $staticGroups)) {
- $staticGroups[$group] = array();
- }
- $staticGroups[$group][] = array(
- 'url' => $this->plxMotor->urlRewrite('?static'.intval($staticId).'/'.$staticPage['url']),
- 'title' => $staticPage['name']
- );
- }
- }
- if(!empty($staticGroups)) {
- $content = implode("\n", array_map(
- function($group) {
- return <<< EOT
- <li><label for="id-stat-group-$group">$group</label></li>
- EOT;
- },
- array_keys($staticGroups)
- ));
- echo <<< EOT
- <ul class="tabs">
- $content
- </ul>\n
- EOT;
- ?>
- <div class="static-groups">
- <?php
- foreach($staticGroups as $group=>$pages) {
- $content = implode("\n", array_map(
- function($page) {
- return <<< EOT
- <li><a href="${page['url']}">${page['title']}</a></li>
- EOT;
- },
- $pages
- ));
- echo <<< EOT
- <input type="radio" id="id-stat-group-$group" name="static-groups" />
- <ul>
- $content
- </ul>\n
- EOT;
- }
- ?>
- </div>
- <style type="text/css">
- ul.tabs,
- div.static-groups > ul { list-style: none; }
- ul.tabs { display: flex; }
- ul.tabs li { padding: 0; }
- ul.tabs label { padding: 0 1rem; background-color: #ddd; }
- ul.tabs label.active { background-color: #444; color: #fff; }
- ul.tabs li:not(:first-of-type) { margin-left: 1rem; }
- div.static-groups > input[type="radio"],
- div.static-groups > input[type="radio"]:not(:checked) + ul { display: none; }
- </style>
- <script type="text/javascript">
- (function() {
- 'use strict'
- const container = document.querySelector('div.static-groups');
- if(container != null) {
- container.addEventListener('change', function(event) {
- if(event.target.tagName == 'INPUT') {
- const activeTabs = document.querySelectorAll('ul.tabs label.active');
- for(var i=0, iMax=activeTabs.length; i<iMax; i++) {
- activeTabs[i].classList.remove('active');
- }
- document.querySelector('ul.tabs label[for="' + event.target.id + '"]').classList.add('active');
- }
- });
- document.querySelector('ul.tabs label:first-of-type').click();
- }
- })();
- </script>
- <?php
- }
- ?>
Add Comment
Please, Sign In to add comment