=== modified file 'dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/css/menu.css' --- dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/css/menu.css 2014-04-02 13:48:42 +0000 +++ dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/css/menu.css 2014-04-02 17:19:53 +0000 @@ -305,7 +305,7 @@ height: 30px; padding-top: 10px; text-align: center; - width: 100%; + width: 360px; } .apps-menu-more a @@ -347,6 +347,24 @@ width: 100%; } +.menu-drop-down-wrap +{ + overflow: hidden; + height: 330px; +} + +.menu-drop-down-scroll +{ + height: 330px; + width: 384px; + overflow-y: auto; + overflow-x: hidden; +} + +#menuDropDown1 ul { + height: 330px; +} + #menuDropDown1 .caret-up-background, #menuDropDown1 .caret-up-border { @@ -404,7 +422,7 @@ display: block; padding: .5em 0; text-align: center; - width: 100%; + width: 358px; } .app-menu-error:hover === modified file 'dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/javascripts/dhis2/dhis2.menu.js' --- dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/javascripts/dhis2/dhis2.menu.js 2014-04-02 13:48:42 +0000 +++ dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/javascripts/dhis2/dhis2.menu.js 2014-04-02 17:19:53 +0000 @@ -364,13 +364,12 @@ function renderDropDownFavorites() { var selector = '#menuDropDown1 .menuDropDownBox', - favorites = dhis2.menu.getFavorites(); + apps = dhis2.menu.getOrderedAppList(); - $(selector).parent().addClass('app-menu-dropdown ui-helper-clearfix'); + $('#menuDropDown1').addClass('app-menu-dropdown ui-helper-clearfix'); $(selector).html(''); - $.tmpl( "appMenuItemTemplate", favorites).appendTo(selector); - - twoColumnRowFix(); + $.tmpl( "appMenuItemTemplate", apps).appendTo(selector); + $('.apps-menu-more').clone().addClass('ui-helper-clearfix').appendTo($('#menuDropDown1 .menu-drop-down-scroll')); } function renderAppManager(selector) { @@ -384,6 +383,8 @@ $('#' + selector + ' ul li').each(function (index, item) { $(item).children('a').append($('')); }); + + twoColumnRowFix(); } /** @@ -491,7 +492,40 @@ renderMenu(); }); + /** + * Check if we need to fix columns when the window resizes + */ $(window).resize(twoColumnRowFix); + + /** + * Adds a scrolling mechanism that modifies the height of the menu box to show only two rows + * Additionally it makes space for the scrollbar and shows/hides the more apps button + */ + $('.menu-drop-down-scroll').scroll(function (event) { + var self = $(this), + moreAppsElement = $('#menuDropDown1 > .apps-menu-more'); + + if (self.parent(':animated').length !== 0) + return; + + if (self.scrollTop() < 10 && self.innerHeight() === 220) { + moreAppsElement.show(); + self.parent().css('width', '370px'); + self.parent().parent().css('width', '370px'); + self.css('height', '330px'); + self.parent().clearQueue().animate( {'height': '330px'} ); + } else { + if (self.innerHeight() === 330 ) { + moreAppsElement.hide(); + self.parent().css('width', '384px'); + self.parent().parent().css('width', '384px'); + self.css('height', '220px'); + self.parent().clearQueue().animate( {'height': '220px'} ); + } + } + + }); + }); })(jQuery, dhis2.menu); === modified file 'dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/main.vm' --- dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/main.vm 2014-03-31 19:15:33 +0000 +++ dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/main.vm 2014-04-02 17:19:53 +0000 @@ -102,7 +102,11 @@