forked from deblan/side_menu
Merge branch 'feature/menu-position' into develop
This commit is contained in:
commit
fdbeaf6677
|
@ -39,7 +39,7 @@ $ unzip -d side_menu /path/to/side_menu_vX.Y.Z.zip
|
|||
|
||||
![](https://upload.deblan.org/u/2020-03/5e81b219.jpg)
|
||||
|
||||
![](https://upload.deblan.org/u/2020-04/5e8ee1f7.jpg)
|
||||
![](https://upload.deblan.org/u/2020-04/5e9998b5.png)
|
||||
|
||||
|
||||
How to contribute?
|
||||
|
|
|
@ -24,6 +24,11 @@ use OCP\Util;
|
|||
|
||||
$config = \OC::$server->getConfig();
|
||||
$cspnm = \OC::$server->getContentSecurityPolicyNonceManager();
|
||||
|
||||
|
||||
Util::addScript('side_menu', 'sideMenu');
|
||||
Util::addStyle('side_menu', 'sideMenu');
|
||||
|
||||
$stylesheet = \OC::$server->getURLGenerator()->linkToRoute(
|
||||
'side_menu.Css.stylesheet',
|
||||
[
|
||||
|
@ -31,6 +36,13 @@ $stylesheet = \OC::$server->getURLGenerator()->linkToRoute(
|
|||
]
|
||||
);
|
||||
|
||||
$script = \OC::$server->getURLGenerator()->linkToRoute(
|
||||
'side_menu.Js.script',
|
||||
[
|
||||
'v' => $config->getAppValue('side_menu', 'cache', '0'),
|
||||
]
|
||||
);
|
||||
|
||||
Util::addHeader(
|
||||
'link',
|
||||
[
|
||||
|
@ -40,13 +52,11 @@ Util::addHeader(
|
|||
''
|
||||
);
|
||||
|
||||
Util::addScript('side_menu', 'main');
|
||||
Util::addScript('side_menu', 'sideMenu');
|
||||
Util::addStyle('side_menu', 'sideMenu');
|
||||
// whitelist the URL to allow loading JS from this external domain
|
||||
// $CSPManager = \OC::$server->getContentSecurityPolicyManager();
|
||||
// $policy = new ContentSecurityPolicy();
|
||||
// $policy->addAllowedScriptDomain($url);
|
||||
// $policy->addAllowedImageDomain($url);
|
||||
// $policy->addAllowedConnectDomain($url);
|
||||
// $CSPManager->addDefaultPolicy($policy);
|
||||
Util::addHeader(
|
||||
'script',
|
||||
[
|
||||
'src' => $script,
|
||||
'nonce' => $cspnm->getNonce(),
|
||||
],
|
||||
''
|
||||
);
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
<repository type="git">https://gitnet.fr/deblan/side_menu</repository>
|
||||
<screenshot>https://upload.deblan.org/u/2020-03/5e7fab2b.jpg</screenshot>
|
||||
<screenshot>https://upload.deblan.org/u/2020-03/5e81b219.jpg</screenshot>
|
||||
<screenshot>https://upload.deblan.org/u/2020-04/5e8ee1f7.jpg</screenshot>
|
||||
<screenshot>https://upload.deblan.org/u/2020-04/5e9998b5.png</screenshot>
|
||||
<dependencies>
|
||||
<nextcloud min-version="18" max-version="18"/>
|
||||
</dependencies>
|
||||
|
|
|
@ -20,5 +20,6 @@
|
|||
return [
|
||||
'routes' => [
|
||||
['name' => 'Css#stylesheet', 'url' => '/css/stylesheet.css', 'verb' => 'GET'],
|
||||
['name' => 'Js#script', 'url' => '/js/script.js', 'verb' => 'GET'],
|
||||
],
|
||||
];
|
||||
|
|
|
@ -45,6 +45,10 @@
|
|||
border: 0;
|
||||
}
|
||||
|
||||
#side-menu.hide-opener .side-menu-opener {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.side-menu-apps-list {
|
||||
height: calc(100vh - 150px);
|
||||
z-index: 2200;
|
||||
|
@ -94,3 +98,7 @@
|
|||
padding-top: 2px;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
#side-menu.hide-opener .side-menu-logo {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
|
63
lib/Controller/JsController.php
Normal file
63
lib/Controller/JsController.php
Normal file
|
@ -0,0 +1,63 @@
|
|||
<?php
|
||||
/**
|
||||
* @license GNU AGPL version 3 or any later version
|
||||
*
|
||||
* This program is free software: you can redistribute it and/or modify
|
||||
* it under the terms of the GNU Affero General Public License as
|
||||
* published by the Free Software Foundation, either version 3 of the
|
||||
* License, or (at your option) any later version.
|
||||
*
|
||||
* This program is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU Affero General Public License for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU Affero General Public License
|
||||
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
namespace OCA\SideMenu\Controller;
|
||||
|
||||
use OCP\AppFramework\Controller;
|
||||
use OCP\AppFramework\Http\TemplateResponse;
|
||||
use OCP\AppFramework\Http\Response;
|
||||
use OCP\IConfig;
|
||||
use OCP\IRequest;
|
||||
|
||||
class JsController extends Controller
|
||||
{
|
||||
|
||||
/** @var \OCP\IConfig */
|
||||
protected $config;
|
||||
|
||||
/**
|
||||
* @param string $appName
|
||||
* @param IRequest $request
|
||||
* @param IConfig $config
|
||||
*/
|
||||
public function __construct($appName, IRequest $request, IConfig $config)
|
||||
{
|
||||
parent::__construct($appName, $request);
|
||||
|
||||
$this->config = $config;
|
||||
}
|
||||
|
||||
/**
|
||||
* @NoAdminRequired
|
||||
* @NoCSRFRequired
|
||||
* @PublicPage
|
||||
*
|
||||
* @return Response
|
||||
*/
|
||||
public function script()
|
||||
{
|
||||
$parameters = [
|
||||
'opener-hover' => (bool) $this->config->getAppValue('side_menu', 'opener-hover', '0'),
|
||||
];
|
||||
|
||||
$response = new TemplateResponse('side_menu', 'js/script', $parameters, 'blank');
|
||||
$response->addHeader('Content-Type', 'text/javascript');
|
||||
|
||||
return $response;
|
||||
}
|
||||
}
|
|
@ -54,6 +54,7 @@ class Admin implements ISettings
|
|||
'cache' => $this->config->getAppValue('side_menu', 'cache', '0'),
|
||||
'opener' => $this->config->getAppValue('side_menu', 'opener', 'side-menu-opener'),
|
||||
'display-logo' => $this->config->getAppValue('side_menu', 'display-logo', '1'),
|
||||
'opener-hover' => $this->config->getAppValue('side_menu', 'opener-hover', '0'),
|
||||
];
|
||||
|
||||
return new TemplateResponse('side_menu', 'settings/admin-form', $parameters, '');
|
||||
|
|
|
@ -30,6 +30,7 @@ const mountSideMenuComponent = () => {
|
|||
|
||||
if (sideMenuContainer) {
|
||||
sideMenu.$mount('#side-menu')
|
||||
$('body').trigger('side-menu.ready')
|
||||
} else {
|
||||
window.setTimeout(mountSideMenuComponent, 50)
|
||||
}
|
||||
|
|
|
@ -20,6 +20,7 @@ const elements = [
|
|||
'side-menu-current-app-background-color',
|
||||
'side-menu-text-color',
|
||||
'side-menu-opener',
|
||||
'side-menu-opener-hover',
|
||||
'side-menu-display-logo',
|
||||
'side-menu-cache',
|
||||
];
|
||||
|
|
30
src/main.js
30
src/main.js
|
@ -1,30 +0,0 @@
|
|||
/**
|
||||
* @license GNU AGPL version 3 or any later version
|
||||
*
|
||||
* This program is free software: you can redistribute it and/or modify
|
||||
* it under the terms of the GNU Affero General Public License as
|
||||
* published by the Free Software Foundation, either version 3 of the
|
||||
* License, or (at your option) any later version.
|
||||
*
|
||||
* This program is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU Affero General Public License for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU Affero General Public License
|
||||
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
const sideMenuContainer = $('<div id="side-menu-container">')
|
||||
const sideMenuOpener = $('<button class="side-menu-opener"></button>')
|
||||
const sideMenu = $('<div id="side-menu">')
|
||||
|
||||
sideMenuContainer.append(sideMenu);
|
||||
|
||||
$('body').append(sideMenuContainer);
|
||||
|
||||
sideMenuOpener.insertBefore('#nextcloud');
|
||||
|
||||
$('body').on('click', '.side-menu-opener', () => {
|
||||
$('#side-menu').toggleClass('open');
|
||||
})
|
|
@ -21,4 +21,13 @@
|
|||
height: calc(100vh - 60px);
|
||||
top: 60px;
|
||||
}
|
||||
|
||||
#side-menu.hide-opener .side-menu-header {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#side-menu.hide-opener .side-menu-apps-list {
|
||||
height: calc(100vh);
|
||||
top: 0;
|
||||
}
|
||||
<?php endif; ?>
|
||||
|
|
52
templates/js/script.php
Normal file
52
templates/js/script.php
Normal file
|
@ -0,0 +1,52 @@
|
|||
(function() {
|
||||
var sideMenuContainer = $('<div id="side-menu-container">')
|
||||
var sideMenuOpener = $('<button class="side-menu-opener"></button>')
|
||||
var sideMenu = $('<div id="side-menu">')
|
||||
var body = $('body')
|
||||
|
||||
body.append(sideMenuContainer)
|
||||
|
||||
sideMenuContainer.append(sideMenu)
|
||||
sideMenuOpener.insertBefore('#nextcloud')
|
||||
|
||||
var isTouchDevice = window.matchMedia("(pointer: coarse)").matches
|
||||
|
||||
body.on('side-menu.ready', function() {
|
||||
sideMenu = $('#side-menu')
|
||||
|
||||
var headerMenuOpener = $('#header .side-menu-opener')
|
||||
var sideMenuOpener = $('#side-menu .side-menu-opener')
|
||||
|
||||
<?php if ($_['opener-hover']): ?>
|
||||
var sideMenuMouseLeave = function() {
|
||||
sideMenu
|
||||
.removeClass('open')
|
||||
.off('mouseleave', sideMenuMouseLeave)
|
||||
}
|
||||
|
||||
var sideMenuMouseEnter = function() {
|
||||
sideMenu.on('mouseleave', sideMenuMouseLeave)
|
||||
}
|
||||
|
||||
var sideMenuOpenerMouseEnter = function() {
|
||||
sideMenu
|
||||
.addClass('open')
|
||||
.on('mouseenter', sideMenuMouseEnter)
|
||||
}
|
||||
|
||||
if (!isTouchDevice) {
|
||||
headerMenuOpener.on('mouseenter', sideMenuOpenerMouseEnter)
|
||||
|
||||
sideMenu.addClass('hide-opener')
|
||||
}
|
||||
<?php endif; ?>
|
||||
|
||||
headerMenuOpener.on('click', function() {
|
||||
sideMenu.addClass('open');
|
||||
})
|
||||
|
||||
sideMenuOpener.on('click', function() {
|
||||
sideMenu.removeClass('open');
|
||||
})
|
||||
})
|
||||
})();
|
|
@ -63,12 +63,6 @@ style('side_menu', 'admin');
|
|||
value="<?php print_unescaped($_['text-color']); ?>">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label for="side-menu-opener" class="settings-hint">
|
||||
<?php p($l->t('Opener icon')); ?>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<?php
|
||||
$choices = [
|
||||
'Default' => 'side-menu-opener',
|
||||
|
@ -76,6 +70,12 @@ style('side_menu', 'admin');
|
|||
];
|
||||
?>
|
||||
|
||||
<div>
|
||||
<label for="side-menu-opener" class="settings-hint">
|
||||
<?php p($l->t('Opener icon')); ?>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<select id="side-menu-opener" name="opener">
|
||||
<?php foreach ($choices as $label => $value): ?>
|
||||
|
@ -86,19 +86,19 @@ style('side_menu', 'admin');
|
|||
</select>
|
||||
</div>
|
||||
|
||||
<?php
|
||||
$choices = [
|
||||
'No' => '0',
|
||||
'Yes' => '1',
|
||||
];
|
||||
?>
|
||||
|
||||
<div>
|
||||
<label for="side-menu-opener" class="settings-hint">
|
||||
<?php p($l->t('Display the logo')); ?>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<?php
|
||||
$choices = [
|
||||
'Yes' => '1',
|
||||
'No' => '0',
|
||||
];
|
||||
?>
|
||||
|
||||
<div>
|
||||
<select id="side-menu-display-logo" name="display-logo">
|
||||
<?php foreach ($choices as $label => $value): ?>
|
||||
|
@ -109,6 +109,22 @@ style('side_menu', 'admin');
|
|||
</select>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label for="side-menu-opener" class="settings-hint">
|
||||
<?php p($l->t('Open the menu with the mouse is hover the opener (automatically disabled on touch screens)')); ?>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<select id="side-menu-opener-hover" name="opener-hover">
|
||||
<?php foreach ($choices as $label => $value): ?>
|
||||
<option value="<?php echo $value ?>" <?php if ($value === $_['opener-hover']): ?>selected<?php endif; ?>>
|
||||
<?php echo $l->t($label); ?>
|
||||
</option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<input type="hidden" id="side-menu-cache" name="cache" value="<?php print_unescaped($_['cache']); ?>">
|
||||
|
||||
<button id="side-menu-save" class="btn btn-primary"><?php p($l->t('Save')); ?></button>
|
||||
|
|
|
@ -4,7 +4,6 @@ const StyleLintPlugin = require('stylelint-webpack-plugin')
|
|||
|
||||
module.exports = {
|
||||
entry: {
|
||||
'main': path.join(__dirname, 'src', 'main.js'),
|
||||
'admin': path.join(__dirname, 'src', 'admin.js'),
|
||||
'sideMenu': path.join(__dirname, 'src', 'SideMenu.js'),
|
||||
},
|
||||
|
|
Loading…
Reference in a new issue