Fix menu issues

Signed-off-by: Julius Haertl <jus@bitgrid.net>
This commit is contained in:
Julius Haertl 2017-03-01 23:21:38 +01:00 committed by Julius Härtl
parent a630e4629f
commit 61dc78e6dc
No known key found for this signature in database
GPG Key ID: 4C614C6ED2CDE6DF
4 changed files with 101 additions and 61 deletions

View File

@ -109,11 +109,10 @@
height: 34px;
}
.header-appname-container {
display: inline-block;
display: none;
padding-top: 22px;
padding-right: 10px;
flex-shrink: 0;
display: none !important;
}
/* show caret indicator next to logo to make clear it is tappable */
.icon-caret {
@ -176,7 +175,6 @@
/* show appname next to logo */
.header-appname {
display: inline-block;
position: relative;
color: #fff;
font-size: 16px;
@ -196,9 +194,9 @@
/* NAVIGATION --------------------------------------------------------------- */
#navigation {
position: fixed;
top: 45px;
left: 10px;
position: relative;
top: 69px;
left: -100%;
width: 265px;
max-height: 85%;
margin-top: 0;
@ -246,7 +244,7 @@
/* position of dropdown arrow */
#navigation:after {
left: 214px;
left: 242px;
}
#expanddiv:after {
@ -568,3 +566,28 @@
#appmenu:hover li:not(:hover) a:before {
display:none;
}
@media only screen and (max-width: 768px) {
#header .header-appname-container {
display: inline-block !important;
}
#appmenu {
display: none;
}
#apps {
.in-header {
display: inline-block;
}
}
#navigation {
position: fixed;
top: 45px;
left: 10px;
}
#navigation:after {
left: 214px;
}
}

View File

@ -1369,8 +1369,11 @@ function initCore() {
* If the screen is bigger, the main menu is not a toggle any more.
*/
function setupMainMenu() {
// init the more-apps menu
OC.registerMenu($('#more-apps'), $('#navigation'));
// toggle the navigation
var $toggle = $('#more-apps');
var $toggle = $('#header .header-appname-container');
var $navigation = $('#navigation');
// init the menu

View File

@ -61,6 +61,7 @@
<div id="appmenu">
<ul>
<?php $headerIconCount = 8; ?>
<?php foreach($_['headernavigation'] as $entry): ?>
<li data-id="<?php p($entry['id']); ?>">
<a href="<?php print_unescaped($entry['href']); ?>" tabindex="3"
@ -73,7 +74,7 @@
</a>
</li>
<?php endforeach; ?>
<?php if (count($_['navigation'])>4): ?>
<?php if (count($_['navigation'])>$headerIconCount): ?>
<li id="more-apps" class="menutoggle">
<a href="#">
<div class="icon-more-white"></div>
@ -82,7 +83,7 @@
</a>
</li>
<?php endif; ?>
<?php if (count($_['navigation'])<=4): ?>
<?php if (count($_['navigation'])<=$headerIconCount): ?>
<?php
/* show "More apps" link to app administration directly in app navigation, as last entry */
if(OC_User::isAdminUser(OC_User::getUser())):
@ -103,6 +104,51 @@
</ul>
</div>
<nav role="navigation"><div id="navigation">
<div id="apps">
<ul>
<?php foreach($_['navigation'] as $entry): ?>
<?php if($entry['showInHeader']): ?>
<li data-id="<?php p($entry['id']); ?>" class="in-header">
<?php else: ?>
<li data-id="<?php p($entry['id']); ?>">
<?php endif; ?>
<a href="<?php print_unescaped($entry['href']); ?>" tabindex="3"
<?php if( $entry['active'] ): ?> class="active"<?php endif; ?>>
<svg width="32" height="32" viewBox="0 0 32 32">
<defs><filter id="invert"><feColorMatrix in="SourceGraphic" type="matrix" values="-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0"></feColorMatrix></filter></defs>
<image x="0" y="0" width="32" height="32" preserveAspectRatio="xMinYMin meet" filter="url(#invert)" xlink:href="<?php print_unescaped($entry['icon'] . '?v=' . $_['versionHash']); ?>" class="app-icon"></image>
</svg>
<div class="icon-loading-dark" style="display:none;"></div>
<span>
<?php p($entry['name']); ?>
</span>
</a>
</li>
<?php endforeach; ?>
<?php
/* show "More apps" link to app administration directly in app navigation, as last entry */
if(OC_User::isAdminUser(OC_User::getUser())):
?>
<li id="apps-management">
<a href="<?php print_unescaped(\OC::$server->getURLGenerator()->linkToRoute('settings.AppSettings.viewApps')); ?>" tabindex="4"
<?php if( $_['appsmanagement_active'] ): ?> class="active"<?php endif; ?>>
<svg width="32" height="32" viewBox="0 0 32 32" class="app-icon">
<defs><filter id="invert"><feColorMatrix in="SourceGraphic" type="matrix" values="-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0"></feColorMatrix></filter></defs>
<image x="0" y="0" width="32" height="32" preserveAspectRatio="xMinYMin meet" filter="url(#invert)" xlink:href="<?php print_unescaped(image_path('settings', 'apps.svg') . '?v=' . $_['versionHash']); ?>"></image>
</svg>
<div class="icon-loading-dark" style="display:none;"></div>
<span>
<?php p($l->t('Apps')); ?>
</span>
</a>
</li>
<?php endif; ?>
</ul>
</div>
</div></nav>
</div>
<div id="header-right">
@ -152,51 +198,6 @@
</div>
</div></header>
<nav role="navigation"><div id="navigation">
<div id="apps">
<ul>
<?php foreach($_['navigation'] as $entry): ?>
<?php if($entry['showInHeader']): ?>
<li data-id="<?php p($entry['id']); ?>" class="in-header">
<?php else: ?>
<li data-id="<?php p($entry['id']); ?>">
<?php endif; ?>
<a href="<?php print_unescaped($entry['href']); ?>" tabindex="3"
<?php if( $entry['active'] ): ?> class="active"<?php endif; ?>>
<svg width="32" height="32" viewBox="0 0 32 32">
<defs><filter id="invert"><feColorMatrix in="SourceGraphic" type="matrix" values="-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0"></feColorMatrix></filter></defs>
<image x="0" y="0" width="32" height="32" preserveAspectRatio="xMinYMin meet" filter="url(#invert)" xlink:href="<?php print_unescaped($entry['icon'] . '?v=' . $_['versionHash']); ?>" class="app-icon"></image>
</svg>
<div class="icon-loading-dark" style="display:none;"></div>
<span>
<?php p($entry['name']); ?>
</span>
</a>
</li>
<?php endforeach; ?>
<?php
/* show "More apps" link to app administration directly in app navigation, as last entry */
if(OC_User::isAdminUser(OC_User::getUser())):
?>
<li id="apps-management">
<a href="<?php print_unescaped(\OC::$server->getURLGenerator()->linkToRoute('settings.AppSettings.viewApps')); ?>" tabindex="4"
<?php if( $_['appsmanagement_active'] ): ?> class="active"<?php endif; ?>>
<svg width="32" height="32" viewBox="0 0 32 32" class="app-icon">
<defs><filter id="invert"><feColorMatrix in="SourceGraphic" type="matrix" values="-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0"></feColorMatrix></filter></defs>
<image x="0" y="0" width="32" height="32" preserveAspectRatio="xMinYMin meet" filter="url(#invert)" xlink:href="<?php print_unescaped(image_path('settings', 'apps.svg') . '?v=' . $_['versionHash']); ?>"></image>
</svg>
<div class="icon-loading-dark" style="display:none;"></div>
<span>
<?php p($l->t('Apps')); ?>
</span>
</a>
</li>
<?php endif; ?>
</ul>
</div>
</div></nav>
<div id="sudo-login-background" class="hidden"></div>
<form id="sudo-login-form" class="hidden">
<?php p($l->t('This action requires you to confirm your password:')); ?><br>

View File

@ -529,7 +529,7 @@ class OC_App {
// This is private as well. It simply works, so don't ask for more details
private static function proceedNavigation($list) {
$headerIconCount = 8;
usort($list, function($a, $b) {
if (isset($a['order']) && isset($b['order'])) {
return ($a['order'] < $b['order']) ? -1 : 1;
@ -540,6 +540,7 @@ class OC_App {
}
});
$activeAppIndex = -1;
$activeApp = OC::$server->getNavigationManager()->getActiveEntry();
foreach ($list as $index => &$navEntry) {
if ($navEntry['id'] == $activeApp) {
@ -551,18 +552,28 @@ class OC_App {
}
unset($navEntry);
if($activeAppIndex > ($headerIconCount-1)) {
$active = $list[$activeAppIndex];
$lastInHeader = $list[$headerIconCount-1];
$list[$headerIconCount-1] = $active;
$list[$activeAppIndex] = $lastInHeader;
}
foreach ($list as $index => &$navEntry) {
$navEntry['showInHeader'] = false;
if($index < 4) {
if($index < $headerIconCount) {
$navEntry['showInHeader'] = true;
}
}
return $list;
}
public static function proceedAppNavigation($entries) {
$headerIconCount = 8;
$activeAppIndex = -1;
$list = self::proceedNavigation($entries);
$activeApp = OC::$server->getNavigationManager()->getActiveEntry();
@ -574,13 +585,15 @@ class OC_App {
$navEntry['active'] = false;
}
}
$list = array_slice($list, 0, 4);
// move active item to last position
if($activeAppIndex > 2) {
if($activeAppIndex > ($headerIconCount-1)) {
$active = $list[$activeAppIndex];
unset($list[$activeAppIndex]);
array_unshift($list, $active);
$lastInHeader = $list[$headerIconCount-1];
$list[$headerIconCount-1] = $active;
$list[$activeAppIndex] = $lastInHeader;
}
$list = array_slice($list, 0, $headerIconCount);
return $list;
}