From 8d7ec84a805919af6a1cfc44f63fcb7779d8c7d8 Mon Sep 17 00:00:00 2001 From: Hadi Nategh Date: Tue, 2 Apr 2019 12:02:28 +0200 Subject: [PATCH] Make active header fixed inside sidebox while scrolling --- api/js/framework/fw_ui.js | 29 +++++---------------- pixelegg/css/mobile.css | 13 +++++++++ pixelegg/css/monochrome.css | 13 +++++++++ pixelegg/css/pixelegg.css | 13 +++++++++ pixelegg/less/layout_raster_scrollarea.less | 12 +++++++++ pixelegg/mobile/fw_mobile.css | 13 +++++++++ 6 files changed, 71 insertions(+), 22 deletions(-) diff --git a/api/js/framework/fw_ui.js b/api/js/framework/fw_ui.js index 0973c6755f..963d5314cb 100644 --- a/api/js/framework/fw_ui.js +++ b/api/js/framework/fw_ui.js @@ -840,8 +840,6 @@ function egw_fw_ui_scrollarea(_contDiv) this.buttonsVisible = true; this.mouseOver = false; this.scrollTime = 0.0; - this.btnUpEnabled = true; - this.btnDownEnabled = true; //Wrap a new "scroll" div around the content of the content div this.scrollDiv = document.createElement("div"); @@ -927,38 +925,25 @@ function egw_fw_ui_scrollarea(_contDiv) egw_fw_ui_scrollarea.prototype.setScrollPos = function(_pos) { + var $activeHeader = jQuery('.egw_fw_ui_sidemenu_entry_header_active'); if (this.buttonsVisible) { if (_pos <= 0) { - if (this.btnUpEnabled) - jQuery(this.btnUp).addClass("egw_fw_ui_scrollarea_button_disabled"); - if (!this.btnDownEnabled) - jQuery(this.btnDown).removeClass("egw_fw_ui_scrollarea_button_disabled"); - this.btnDownEnabled = true; - this.btnUpEnabled = false; - + if (window.framework) jQuery(framework.sidemenuDiv).removeClass("egw_fw_ui_scrollarea_enabled"); _pos = 0; } else if (_pos >= this.maxScrollPos) { - if (this.btnDownEnabled) - jQuery(this.btnDown).addClass("egw_fw_ui_scrollarea_button_disabled"); - if (!this.btnUpEnabled) - jQuery(this.btnUp).removeClass("egw_fw_ui_scrollarea_button_disabled"); - this.btnDownEnabled = false; - this.btnUpEnabled = true; - _pos = this.maxScrollPos; } else { - if (!this.btnUpEnabled) - jQuery(this.btnUp).removeClass("egw_fw_ui_scrollarea_button_disabled"); - if (!this.btnDownEnabled) - jQuery(this.btnDown).removeClass("egw_fw_ui_scrollarea_button_disabled"); - this.btnUpEnabled = true; - this.btnDownEnabled = true; + if (egw.preference('toggleSidebar',framework.activeApp.appName) != 'on') + { + $activeHeader.width($activeHeader.width()); + if (window.framework) jQuery(framework.sidemenuDiv).addClass("egw_fw_ui_scrollarea_enabled"); + } } this.scrollPos = _pos; diff --git a/pixelegg/css/mobile.css b/pixelegg/css/mobile.css index 367b007bc3..0145130c81 100644 --- a/pixelegg/css/mobile.css +++ b/pixelegg/css/mobile.css @@ -4862,6 +4862,7 @@ td.message span.message { width: 100%; height: 12px; z-index: 2; + display: none !important; } .egw_fw_ui_scrollarea_button_up.egw_fw_ui_scrollarea_button_hover, .egw_fw_ui_scrollarea_button_down.egw_fw_ui_scrollarea_button_hover { @@ -4870,6 +4871,18 @@ td.message span.message { .egw_fw_ui_scrollarea_button_disabled { display: none !important; } +#egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled { + top: 7px !important; +} +#egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled #egw_fw_toggler { + top: 1px; +} +#egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled .egw_fw_ui_sidemenu_entry_header_active { + position: fixed; + top: 50px; + background: white; + z-index: 1; +} .egw_fw_ui_scrollarea_button_up, .egw_fw_ui_scrollarea_button_down { height: 14px; diff --git a/pixelegg/css/monochrome.css b/pixelegg/css/monochrome.css index 276767829e..0cda148d76 100644 --- a/pixelegg/css/monochrome.css +++ b/pixelegg/css/monochrome.css @@ -4851,6 +4851,7 @@ td.message span.message { width: 100%; height: 12px; z-index: 2; + display: none !important; } .egw_fw_ui_scrollarea_button_up.egw_fw_ui_scrollarea_button_hover, .egw_fw_ui_scrollarea_button_down.egw_fw_ui_scrollarea_button_hover { @@ -4859,6 +4860,18 @@ td.message span.message { .egw_fw_ui_scrollarea_button_disabled { display: none !important; } +#egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled { + top: 7px !important; +} +#egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled #egw_fw_toggler { + top: 1px; +} +#egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled .egw_fw_ui_sidemenu_entry_header_active { + position: fixed; + top: 50px; + background: white; + z-index: 1; +} .egw_fw_ui_scrollarea_button_up, .egw_fw_ui_scrollarea_button_down { height: 14px; diff --git a/pixelegg/css/pixelegg.css b/pixelegg/css/pixelegg.css index 9d65c08545..b3b20e1492 100644 --- a/pixelegg/css/pixelegg.css +++ b/pixelegg/css/pixelegg.css @@ -4862,6 +4862,7 @@ td.message span.message { width: 100%; height: 12px; z-index: 2; + display: none !important; } .egw_fw_ui_scrollarea_button_up.egw_fw_ui_scrollarea_button_hover, .egw_fw_ui_scrollarea_button_down.egw_fw_ui_scrollarea_button_hover { @@ -4870,6 +4871,18 @@ td.message span.message { .egw_fw_ui_scrollarea_button_disabled { display: none !important; } +#egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled { + top: 7px !important; +} +#egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled #egw_fw_toggler { + top: 1px; +} +#egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled .egw_fw_ui_sidemenu_entry_header_active { + position: fixed; + top: 50px; + background: white; + z-index: 1; +} .egw_fw_ui_scrollarea_button_up, .egw_fw_ui_scrollarea_button_down { height: 14px; diff --git a/pixelegg/less/layout_raster_scrollarea.less b/pixelegg/less/layout_raster_scrollarea.less index 4aa7b69c1f..9e786fbc2c 100644 --- a/pixelegg/less/layout_raster_scrollarea.less +++ b/pixelegg/less/layout_raster_scrollarea.less @@ -37,6 +37,7 @@ width: 100%; height: 12px; z-index: 2; + display: none !important; } .egw_fw_ui_scrollarea_button_up.egw_fw_ui_scrollarea_button_hover, @@ -50,6 +51,17 @@ display: none !important; } +#egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled { + top: 7px !important; + #egw_fw_toggler {top:1px;} + .egw_fw_ui_sidemenu_entry_header_active { + position: fixed; + top: 50px; + background: white; + z-index: 1; + } +} + .egw_fw_ui_scrollarea_button_up, .egw_fw_ui_scrollarea_button_down { height: 14px; diff --git a/pixelegg/mobile/fw_mobile.css b/pixelegg/mobile/fw_mobile.css index 0165d7d9ae..999eafddc9 100644 --- a/pixelegg/mobile/fw_mobile.css +++ b/pixelegg/mobile/fw_mobile.css @@ -4873,6 +4873,7 @@ td.message span.message { width: 100%; height: 12px; z-index: 2; + display: none !important; } .egw_fw_ui_scrollarea_button_up.egw_fw_ui_scrollarea_button_hover, .egw_fw_ui_scrollarea_button_down.egw_fw_ui_scrollarea_button_hover { @@ -4881,6 +4882,18 @@ td.message span.message { .egw_fw_ui_scrollarea_button_disabled { display: none !important; } +#egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled { + top: 7px !important; +} +#egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled #egw_fw_toggler { + top: 1px; +} +#egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled .egw_fw_ui_sidemenu_entry_header_active { + position: fixed; + top: 50px; + background: white; + z-index: 1; +} .egw_fw_ui_scrollarea_button_up, .egw_fw_ui_scrollarea_button_down { height: 14px;