TPS
/
ORIENT
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Added support for counter and counterLabel to main menu. 

Refs: #16, Refs: 7bcec1bd99, Replaces: #4061
This commit is contained in:
Luke Towers 2019-02-13 14:54:13 -06:00
parent 1fc8dc6fd4
commit cb87802080
5 changed files with 70 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
modules/backend/assets/css/october.css
View File

@ -655,6 +655,10 @@ body.slim-container .layout .layout-container {padding-left:0 !important;padding
.flex-layout-item.layout-container {max-width:none}
body.mainmenu-open {overflow:hidden;position:fixed}
.mainmenu-tooltip .tooltip-inner {font-size:13px;padding:6px 16px}
ul.mainmenu-nav {font-size:14px}
ul.mainmenu-nav li .svg-icon {-webkit-backface-visibility:hidden;backface-visibility:hidden}
ul.mainmenu-nav li span.counter {display:block;position:absolute;top:.143em;right:0;padding:.143em .429em .214em .286em;background-color:#d9350f;color:#fff;font-size:.786em;line-height:100%;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;opacity:1;filter:alpha(opacity=100);-webkit-transform:scale(1,);-ms-transform:scale(1,);transform:scale(1,);-webkit-transition:all 0.3s;transition:all 0.3s}
ul.mainmenu-nav li span.counter.empty {opacity:0;filter:alpha(opacity=0);-webkit-transform:scale(0,);-ms-transform:scale(0,);transform:scale(0,)}
nav#layout-mainmenu {background-color:#000;padding:0 0 0 20px;line-height:0;white-space:nowrap;vertical-align:top}
nav#layout-mainmenu a {text-decoration:none}
nav#layout-mainmenu a:focus {background:transparent}

33
modules/backend/assets/less/layout/mainmenu.less
View File

@ -75,6 +75,39 @@ body.mainmenu-open {
}
}
ul.mainmenu-nav {
font-size: @font-size-base;
li {
/* Fix for SVG icons not rendering on initial page load until repaint (hover, move, etc) */
.svg-icon {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
span.counter {
display: block;
position: absolute;
top: .143em;
right: 0;
padding: .143em .429em .214em .286em;
background-color: @color-sidebarnav-counter-bg;
color: @color-sidebarnav-counter-text;
font-size: .786em;
line-height: 100%;
.border-radius(3px);
.opacity(1);
.scale(1);
.transition(all 0.3s);
&.empty {
.opacity(0);
.scale(0);
}
}
}
}
nav#layout-mainmenu {
background-color: @color-mainmenu;
padding: 0 0 0 20px;

33
modules/backend/classes/NavigationManager.php
View File

@ -35,6 +35,8 @@ class NavigationManager
'label' => null,
'icon' => null,
'iconSvg' => null,
'counter' => null,
'counterLabel'=> null,
'url' => null,
'permissions' => [],
'order' => 500,
@ -168,17 +170,20 @@ class NavigationManager
* - permissions - an array of permissions the back-end user should have, optional.
* The item will be displayed if the user has any of the specified permissions.
* - order - a position of the item in the menu, optional.
* - sideMenu - an array of side menu items, optional. If provided, the array items
* should represent the side menu item code, and each value should be an associative
* array with the following keys:
* - label - specifies the menu label localization string key, required.
* - icon - an icon name from the Font Awesome icon collection, required.
* - url - the back-end relative URL the menu item should point to, required.
* - attributes - an array of attributes and values to apply to the menu item, optional.
* - permissions - an array of permissions the back-end user should have, optional.
* - counter - an optional numeric value to output near the menu icon. The value should be
* a number or a callable returning a number.
* - counterLabel - an optional string value to describe the numeric reference in counter.
* - sideMenu - an array of side menu items, optional. If provided, the array items
* should represent the side menu item code, and each value should be an associative
* array with the following keys:
* - label - specifies the menu label localization string key, required.
* - icon - an icon name from the Font Awesome icon collection, required.
* - url - the back-end relative URL the menu item should point to, required.
* - attributes - an array of attributes and values to apply to the menu item, optional.
* - permissions - an array of permissions the back-end user should have, optional.
* - counter - an optional numeric value to output near the menu icon. The value should be
* a number or a callable returning a number.
* - counterLabel - an optional string value to describe the numeric reference in counter.
* @param string $owner Specifies the menu items owner plugin or module in the format Author.Plugin.
* @param array $definitions An array of the menu item definitions.
*/
@ -306,6 +311,15 @@ class NavigationManager
$this->loadItems();
}
foreach ($this->items as $item) {
if ($item->counter !== null && is_callable($item->counter)) {
$item->counter = call_user_func($item->counter, $item);
if (empty($item->counter)) {
$item->counter = null;
}
}
}
return $this->items;
}
@ -337,6 +351,9 @@ class NavigationManager
foreach ($items as $item) {
if ($item->counter !== null && is_callable($item->counter)) {
$item->counter = call_user_func($item->counter, $item);
if (empty($item->counter)) {
$item->counter = null;
}
}
}

7
modules/backend/layouts/_mainmenu.htm
View File

@ -33,6 +33,13 @@
<?= e(trans($item->label)) ?>
</span>
</a>
<span
class="counter <?= $item->counter === null ? 'empty' : null ?>"
data-menu-id="<?= e($item->code) ?>"
<?php if ($item->counterLabel): ?>title="<?= e(trans($item->counterLabel)) ?>"<?php endif ?>
>
<?= e($item->counter) ?>
</span>
</li>
<?php endforeach ?>
</ul>

2
modules/backend/layouts/_sidenav.htm
View File

@ -36,7 +36,7 @@
class="counter <?= $item->counter === null ? 'empty' : null ?>"
data-menu-id="<?= e($context->mainMenuCode.'/'.$sideItemCode) ?>"
<?php if ($item->counterLabel): ?>title="<?= e(trans($item->counterLabel)) ?>"<?php endif ?>
>
>
<?= e($item->counter) ?>
</span>
</li>