* UiUx: Implement applications list up/down scroll buttons (as an user preference feature)

This commit is contained in:
Hadi Nategh 2019-09-24 11:41:06 +02:00
parent 21a44891ed
commit ff9b3c1c03
7 changed files with 114 additions and 20 deletions

View File

@ -858,6 +858,8 @@ function egw_fw_ui_scrollarea(_contDiv)
this.buttonsVisible = true; this.buttonsVisible = true;
this.mouseOver = false; this.mouseOver = false;
this.scrollTime = 0.0; this.scrollTime = 0.0;
this.btnUpEnabled = true;
this.btnDownEnabled = true;
//Wrap a new "scroll" div around the content of the content div //Wrap a new "scroll" div around the content of the content div
this.scrollDiv = document.createElement("div"); this.scrollDiv = document.createElement("div");
@ -943,17 +945,54 @@ function egw_fw_ui_scrollarea(_contDiv)
egw_fw_ui_scrollarea.prototype.setScrollPos = function(_pos) egw_fw_ui_scrollarea.prototype.setScrollPos = function(_pos)
{ {
var scrollArea = egw.preference('scroll_area', 'common') == 1 ? true : false;
if (this.buttonsVisible) if (this.buttonsVisible)
{ {
if (_pos <= 0) if (scrollArea)
{ {
_pos = 0; 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;
_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;
}
} }
else if (_pos >= this.maxScrollPos) else
{ {
_pos = this.maxScrollPos; if (_pos <= 0)
{
_pos = 0;
}
else if (_pos >= this.maxScrollPos)
{
_pos = this.maxScrollPos;
}
jQuery(this.btnUp).addClass("egw_fw_ui_scrollarea_button_disabled");
jQuery(this.btnDown).addClass("egw_fw_ui_scrollarea_button_disabled");
} }
this.scrollPos = _pos; this.scrollPos = _pos;
//Apply the calculated scroll position to the scrollDiv //Apply the calculated scroll position to the scrollDiv

View File

@ -4858,11 +4858,10 @@ td.message span.message {
width: 100%; width: 100%;
height: 12px; height: 12px;
z-index: 2; z-index: 2;
display: none !important;
} }
.egw_fw_ui_scrollarea_button_up.egw_fw_ui_scrollarea_button_hover, .egw_fw_ui_scrollarea_button_up.egw_fw_ui_scrollarea_button_hover,
.egw_fw_ui_scrollarea_button_down.egw_fw_ui_scrollarea_button_hover { .egw_fw_ui_scrollarea_button_down.egw_fw_ui_scrollarea_button_hover {
background-image: none; background-color: silver;
} }
.egw_fw_ui_scrollarea_button_disabled { .egw_fw_ui_scrollarea_button_disabled {
display: none !important; display: none !important;
@ -4885,12 +4884,22 @@ td.message span.message {
background-position: center; background-position: center;
} }
.egw_fw_ui_scrollarea_button_up { .egw_fw_ui_scrollarea_button_up {
height: 37px; height: 35px;
top: 0px; top: 0px;
border-bottom: 1px solid silver; border-bottom: 1px solid silver;
background-image: url(../images/up_pointer.png);
background-position: center;
background-repeat: no-repeat;
background-position-y: -1px;
} }
.egw_fw_ui_scrollarea_button_down { .egw_fw_ui_scrollarea_button_down {
bottom: 0px; bottom: 0px;
height: 35px;
border-top: 1px solid silver;
background-image: url(../images/down_pointer.png);
background-repeat: no-repeat;
background-position: center;
background-position-y: 1px;
} }
.egw_fw_ui_scrollarea_outerdiv { .egw_fw_ui_scrollarea_outerdiv {
height: 100%; height: 100%;

View File

@ -4847,11 +4847,10 @@ td.message span.message {
width: 100%; width: 100%;
height: 12px; height: 12px;
z-index: 2; z-index: 2;
display: none !important;
} }
.egw_fw_ui_scrollarea_button_up.egw_fw_ui_scrollarea_button_hover, .egw_fw_ui_scrollarea_button_up.egw_fw_ui_scrollarea_button_hover,
.egw_fw_ui_scrollarea_button_down.egw_fw_ui_scrollarea_button_hover { .egw_fw_ui_scrollarea_button_down.egw_fw_ui_scrollarea_button_hover {
background-image: none; background-color: silver;
} }
.egw_fw_ui_scrollarea_button_disabled { .egw_fw_ui_scrollarea_button_disabled {
display: none !important; display: none !important;
@ -4874,12 +4873,22 @@ td.message span.message {
background-position: center; background-position: center;
} }
.egw_fw_ui_scrollarea_button_up { .egw_fw_ui_scrollarea_button_up {
height: 37px; height: 35px;
top: 0px; top: 0px;
border-bottom: 1px solid silver; border-bottom: 1px solid silver;
background-image: url(../images/up_pointer.png);
background-position: center;
background-repeat: no-repeat;
background-position-y: -1px;
} }
.egw_fw_ui_scrollarea_button_down { .egw_fw_ui_scrollarea_button_down {
bottom: 0px; bottom: 0px;
height: 35px;
border-top: 1px solid silver;
background-image: url(../images/down_pointer.png);
background-repeat: no-repeat;
background-position: center;
background-position-y: 1px;
} }
.egw_fw_ui_scrollarea_outerdiv { .egw_fw_ui_scrollarea_outerdiv {
height: 100%; height: 100%;

View File

@ -4858,11 +4858,10 @@ td.message span.message {
width: 100%; width: 100%;
height: 12px; height: 12px;
z-index: 2; z-index: 2;
display: none !important;
} }
.egw_fw_ui_scrollarea_button_up.egw_fw_ui_scrollarea_button_hover, .egw_fw_ui_scrollarea_button_up.egw_fw_ui_scrollarea_button_hover,
.egw_fw_ui_scrollarea_button_down.egw_fw_ui_scrollarea_button_hover { .egw_fw_ui_scrollarea_button_down.egw_fw_ui_scrollarea_button_hover {
background-image: none; background-color: silver;
} }
.egw_fw_ui_scrollarea_button_disabled { .egw_fw_ui_scrollarea_button_disabled {
display: none !important; display: none !important;
@ -4885,12 +4884,22 @@ td.message span.message {
background-position: center; background-position: center;
} }
.egw_fw_ui_scrollarea_button_up { .egw_fw_ui_scrollarea_button_up {
height: 37px; height: 35px;
top: 0px; top: 0px;
border-bottom: 1px solid silver; border-bottom: 1px solid silver;
background-image: url(../images/up_pointer.png);
background-position: center;
background-repeat: no-repeat;
background-position-y: -1px;
} }
.egw_fw_ui_scrollarea_button_down { .egw_fw_ui_scrollarea_button_down {
bottom: 0px; bottom: 0px;
height: 35px;
border-top: 1px solid silver;
background-image: url(../images/down_pointer.png);
background-repeat: no-repeat;
background-position: center;
background-position-y: 1px;
} }
.egw_fw_ui_scrollarea_outerdiv { .egw_fw_ui_scrollarea_outerdiv {
height: 100%; height: 100%;

View File

@ -37,13 +37,12 @@
width: 100%; width: 100%;
height: 12px; height: 12px;
z-index: 2; z-index: 2;
display: none !important;
} }
.egw_fw_ui_scrollarea_button_up.egw_fw_ui_scrollarea_button_hover, .egw_fw_ui_scrollarea_button_up.egw_fw_ui_scrollarea_button_hover,
.egw_fw_ui_scrollarea_button_down.egw_fw_ui_scrollarea_button_hover .egw_fw_ui_scrollarea_button_down.egw_fw_ui_scrollarea_button_hover
{ {
background-image:none; background-color: silver;
} }
.egw_fw_ui_scrollarea_button_disabled .egw_fw_ui_scrollarea_button_disabled
@ -72,14 +71,24 @@
.egw_fw_ui_scrollarea_button_up .egw_fw_ui_scrollarea_button_up
{ {
height: 37px; height: 35px;
top: 0px; top: 0px;
border-bottom: 1px solid silver; border-bottom: 1px solid silver;
background-image: url(../images/up_pointer.png);
background-position: center;
background-repeat: no-repeat;
background-position-y: -1px;
} }
.egw_fw_ui_scrollarea_button_down .egw_fw_ui_scrollarea_button_down
{ {
bottom: 0px; bottom: 0px;
height: 35px;
border-top: 1px solid silver;
background-image: url(../images/down_pointer.png);
background-repeat: no-repeat;
background-position: center;
background-position-y: 1px;
} }
.egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_scrollarea_outerdiv

View File

@ -4869,11 +4869,10 @@ td.message span.message {
width: 100%; width: 100%;
height: 12px; height: 12px;
z-index: 2; z-index: 2;
display: none !important;
} }
.egw_fw_ui_scrollarea_button_up.egw_fw_ui_scrollarea_button_hover, .egw_fw_ui_scrollarea_button_up.egw_fw_ui_scrollarea_button_hover,
.egw_fw_ui_scrollarea_button_down.egw_fw_ui_scrollarea_button_hover { .egw_fw_ui_scrollarea_button_down.egw_fw_ui_scrollarea_button_hover {
background-image: none; background-color: silver;
} }
.egw_fw_ui_scrollarea_button_disabled { .egw_fw_ui_scrollarea_button_disabled {
display: none !important; display: none !important;
@ -4896,12 +4895,22 @@ td.message span.message {
background-position: center; background-position: center;
} }
.egw_fw_ui_scrollarea_button_up { .egw_fw_ui_scrollarea_button_up {
height: 37px; height: 35px;
top: 0px; top: 0px;
border-bottom: 1px solid silver; border-bottom: 1px solid silver;
background-image: url(../images/up_pointer.png);
background-position: center;
background-repeat: no-repeat;
background-position-y: -1px;
} }
.egw_fw_ui_scrollarea_button_down { .egw_fw_ui_scrollarea_button_down {
bottom: 0px; bottom: 0px;
height: 35px;
border-top: 1px solid silver;
background-image: url(../images/down_pointer.png);
background-repeat: no-repeat;
background-position: center;
background-position-y: 1px;
} }
.egw_fw_ui_scrollarea_outerdiv { .egw_fw_ui_scrollarea_outerdiv {
height: 100%; height: 100%;

View File

@ -269,6 +269,16 @@ class preferences_hooks
'admin' => True, 'admin' => True,
'forced' => true, 'forced' => true,
), ),
'scroll_area'=> array(
'type' => 'select',
'label' => 'Applications list scroll area',
'name' => 'scroll_area',
'values' => array('0'=>lang('Disable'),'1'=>lang('Enable')),
'help' => 'Make applications list scrollable with up/down scroll buttons (usefull for users working with mouse with no scrollwheel)',
'xmlrpc' => True,
'admin' => False,
'default' => '0',
),
array( array(
'type' => 'section', 'type' => 'section',
'title' => 'Formatting & general settings' 'title' => 'Formatting & general settings'