jinql
/
blur-admin
mirror of https://github.com/akveo/blur-admin
1
0
Fork 0
Code Issues Releases Wiki Activity

fix(sidebar): use dynamic height for slimScroll

pull/3/head
alex 2016-02-04 13:47:28 +03:00
parent c83ec6ad0b
commit 9d0c04a77f
2 changed files with 12 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/app/theme/components/sidebar/SidebarCtrl.js
View File

@ -9,9 +9,10 @@
.controller('SidebarCtrl', SidebarCtrl); .controller('SidebarCtrl', SidebarCtrl);
/** @ngInject */ /** @ngInject */
function SidebarCtrl($scope, $rootScope, $timeout, $location, layoutSizes, sidebarService) { function SidebarCtrl($scope, $rootScope, $timeout, $location, layoutSizes, sidebarService, $element) {
$scope.menuItems = sidebarService.getMenuItems(); $scope.menuItems = sidebarService.getMenuItems();
$scope.menuHeight = $element[0].childNodes[0].clientHeight - 84;
function changeSelectElemTopValue() { function changeSelectElemTopValue() {
$timeout(function () { $timeout(function () {
@ -58,12 +59,21 @@
// watch window resize to change menu collapsed state if needed // watch window resize to change menu collapsed state if needed
$(window).resize(function () { $(window).resize(function () {
var isMenuShouldCollapsed = $(window).width() <= layoutSizes.resWidthCollapseSidebar; var isMenuShouldCollapsed = $(window).width() <= layoutSizes.resWidthCollapseSidebar;
var scopeApplied = false;
if ($scope.isMenuShouldCollapsed !== isMenuShouldCollapsed) { if ($scope.isMenuShouldCollapsed !== isMenuShouldCollapsed) {
$scope.$apply(function () { $scope.$apply(function () {
$scope.menuHeight = $element[0].childNodes[0].clientHeight - 84;
$scope.$isMenuCollapsed = isMenuShouldCollapsed; $scope.$isMenuCollapsed = isMenuShouldCollapsed;
scopeApplied = true;
});
}
if (!scopeApplied) {
$scope.$apply(function () {
$scope.menuHeight = $element[0].childNodes[0].clientHeight - 84;
}); });
} }
$scope.isMenuShouldCollapsed = isMenuShouldCollapsed; $scope.isMenuShouldCollapsed = isMenuShouldCollapsed;
}); });
$scope.toggleSubMenu = function ($event, item) { $scope.toggleSubMenu = function ($event, item) {

2
src/app/theme/components/sidebar/sidebar.html
View File

@ -1,6 +1,6 @@
<aside class="al-sidebar" ng-swipe-right="menuExpand()" ng-swipe-left="menuCollapse()" <aside class="al-sidebar" ng-swipe-right="menuExpand()" ng-swipe-left="menuCollapse()"
ng-mouseleave="hoverElemTop=selectElemTop"> ng-mouseleave="hoverElemTop=selectElemTop">
<ul class="al-sidebar-list" slimscroll="{height: '100%'}"> <ul class="al-sidebar-list" slimscroll="{height: '{{menuHeight}}px'}" slimscroll-watch="menuHeight" >
<li ng-repeat="item in menuItems" class="al-sidebar-list-item" <li ng-repeat="item in menuItems" class="al-sidebar-list-item"
ng-class="{'selected': item.selected, 'with-sub-menu': item.subMenu}" ng-class="{'selected': item.selected, 'with-sub-menu': item.subMenu}"
ng-mouseenter="hoverItem($event, item)"> ng-mouseenter="hoverItem($event, item)">