Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Loading…

[1.8] Add invisible auto-scrolling regions to the top and bottom of the application list #1085

Closed
wants to merge 3 commits into from

5 participants

@mtwebster
Collaborator

Addresses #108

Each region has 3 individual sub-regions - slow, medium, fast.

Hovering the mouse in any of these regions scrolls the list up or down
at slow, medium or fast speed.

A small amount of application list real-estate is lost, but I think it's
a fair tradeoff to gain smooth scrolling. The drawback to the old method
was that you had to keep the mouse moving to generate enter/leave events
on the application buttons, otherwise the scrolling would stop.

Couple other notes/caveats:

You lose the effect of the 'selected app' constantly re-highlighting as you make your way through the list, though it immediately picks back up once you back off the auto-scroll area.

The original scroll-to-button code is still used when activating an application context menu that would result in the submenu appearing off-view, so that effect is retained.

@mdchaves

It would be great if this pull request could be committed to the master branch before 1.8.

@mdchaves

I've just tested this new auto-scrolling menu and it worked great. I suggest you guys create a new branch with these latest (working) features implemented, so that those who want to test them to do so before they are included in the master branch.

@glebihan
Collaborator

@mdchaves : each pull request is related to a branch, which allows anyone who wants to to test the changes provided by the pull request.
Putting them all together within one branch would actually make testing harder as it wouldn't allow to know for sure which pull request/commit caused a certain regression or bug.
As for when those changes will be merged, we're currently in feature freeze for 1.6, this pull request should get merged after the release of 1.6.

EDIT: Forgot to mention, there's also a decision to make at to whether this pull request should be merged as is or not (I personally wouldn't merge it without a few changes, as auto-scrolling highly annoys me)

mtwebster added some commits
@mtwebster mtwebster Add invisible auto-scrolling regions to the top and bottom of the app…
…lication list.

Each region has 3 individual sub-regions - slow, medium, fast.

Hovering the mouse in any of these regions scrolls the list up or down
at slow, medium or fast speed.

A small amount of application list real-estate is lost, but I think it's
a fair tradeoff to gain smooth scrolling.  The drawback to the old method
was that you had to keep the mouse moving to generate enter/leave events
on the application buttons, otherwise the scrolling would stop.
cf9bae9
@mtwebster mtwebster Disable by default a54e91d
@mtwebster mtwebster Menu autoscrolling: Fix logic problem when enabling/disabling 53ba0bb
@Garibaldo

@mtwebster: I tested this pull request and it really improves menu navigation. But the sliding movement is not totally smooth yet. It should be more fluid. The rolling speed often changes abruptly. Sometimes it gets too slow. Perhaps the sensitive area should be vertically extended. Maybe if more different “speed regions” were created, the scrolling would improve.
I really think this is a very useful feature. Do you have any idea if and when it would be merged?

@autarkper
Collaborator

For me, this pull request makes fewer items immediately visible in the application list:

master: http://www.autark.se/dump/menu-standard-2012-10-29%2008:00:07.png
butter: http://www.autark.se/dump/menu-with-butter-2012-10-29%2007:56:51.png

Update: the above screenshots were taken on my Ubuntu 12.04 desktop. On my laptop running LMDE I don't see any difference.

@autarkper
Collaborator

I have merged this to my master branch.

@mtwebster
Collaborator

I'm going to re-do this in the Shell toolkit layer

@mtwebster mtwebster closed this
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Commits on Sep 17, 2012
  1. @mtwebster

    Add invisible auto-scrolling regions to the top and bottom of the app…

    mtwebster authored
    …lication list.
    
    Each region has 3 individual sub-regions - slow, medium, fast.
    
    Hovering the mouse in any of these regions scrolls the list up or down
    at slow, medium or fast speed.
    
    A small amount of application list real-estate is lost, but I think it's
    a fair tradeoff to gain smooth scrolling.  The drawback to the old method
    was that you had to keep the mouse moving to generate enter/leave events
    on the application buttons, otherwise the scrolling would stop.
  2. @mtwebster

    Disable by default

    mtwebster authored
Commits on Sep 18, 2012
  1. @mtwebster
This page is out of date. Refresh to see the latest.
View
8 data/org.cinnamon.gschema.xml.in
@@ -288,6 +288,14 @@
</_description>
</key>
+ <key type="b" name="menu-enable-autoscroll">
+ <default>false</default>
+ <_summary>Enable or disable autoscrolling in application list</_summary>
+ <_description>
+ Toggles the auto-scrolling regions at the top and bottom of the app list
+ </_description>
+ </key>
+
<key type="i" name="number-workspaces">
<default>2</default>
<_summary>Number of workspaces in Cinnamon session</_summary>
View
1  files/usr/lib/cinnamon-settings/cinnamon-settings.py
@@ -1866,6 +1866,7 @@ def __init__(self):
sidePage.add_widget(GSettingsCheckButton(_("Activate menu on hover"), "org.cinnamon", "activate-menu-applet-on-hover", None))
sidePage.add_widget(GSettingsCheckButton(_("Show bookmarks and places"), "org.cinnamon", "menu-show-places", None))
sidePage.add_widget(GSettingsCheckButton(_("Show recent files"), "org.cinnamon", "menu-show-recent", None))
+ sidePage.add_widget(GSettingsCheckButton(_("Enable auto-scrolling in application list"), "org.cinnamon", "menu-enable-autoscroll", None))
sidePage = SidePage(_("Panel"), "panel.svg", self.content_box)
self.sidePages.append((sidePage, "panel"))
View
148 files/usr/share/cinnamon/applets/menu@cinnamon.org/applet.js
@@ -647,6 +647,137 @@ FavoritesBox.prototype = {
}
}
+// Couple constants for auto scroll area definition
+const UPPER = 1;
+const LOWER = 0;
+
+// Speeds - actually Mainloop delay amounts, selected
+// depending on which region you're in.
+const FAST_DELAY = 2;
+const MED_DELAY = 25;
+const SLOW_DELAY = 50;
+
+// Scroll step amount
+const FAST_STEP = 16;
+const MED_STEP = 8;
+const SLOW_STEP = 5
+
+const SUBREGION_HEIGHT_ACTIVE = "height: 7px";
+const SUBREGION_HEIGHT_INACTIVE = "height: 1px";
+
+function AutoScrollArea(position, scrollView) {
+ this._init(position, scrollView);
+}
+
+AutoScrollArea.prototype = {
+ _init: function(position, scrollView) {
+ this.position = position;
+ this.scrollBar = scrollView.get_vscroll_bar().get_adjustment();
+
+ this._inRegion = false;
+ this.actor = new St.BoxLayout({vertical: true});
+ this.slowRegion = new St.Button({reactive: true, style: SUBREGION_HEIGHT_INACTIVE});
+ this.medRegion = new St.Button({reactive: true, style: SUBREGION_HEIGHT_INACTIVE});
+ this.fastRegion = new St.Button({reactive: true, style: SUBREGION_HEIGHT_INACTIVE});
+
+ if (this.position == UPPER) {
+ this.actor.add_actor(this.fastRegion);
+ this.actor.add_actor(this.medRegion);
+ this.actor.add_actor(this.slowRegion);
+ } else {
+ this.actor.add_actor(this.slowRegion);
+ this.actor.add_actor(this.medRegion);
+ this.actor.add_actor(this.fastRegion);
+ }
+
+ this.slowRegion.delay = SLOW_DELAY;
+ this.slowRegion.step = SLOW_STEP;
+ this.medRegion.delay = MED_DELAY;
+ this.medRegion.step = MED_STEP;
+ this.fastRegion.delay = FAST_DELAY;
+ this.fastRegion.step = FAST_STEP;
+
+ this.slowRegion.inRegion = false;
+ this.medRegion.inRegion = false;
+ this.fastRegion.inRegion = false;
+
+ this.signals = { slowEnter: null,
+ slowLeave: null,
+ medEnter: null,
+ medLeave: null,
+ fastEnter: null,
+ fastLeave: null };
+
+ global.settings.connect("changed::menu-enable-autoscroll", Lang.bind(this, this.updateEnabled));
+ this._enabled = false;
+ this.updateEnabled();
+ },
+
+ _onEnterRegion: function(region) {
+ region.inRegion = true;
+ this._doScroll(region);
+ },
+
+ _onLeaveRegion: function(region) {
+ region.inRegion = false;
+ },
+
+ _doScroll: function(region) {
+ if (region.inRegion) {
+ let new_pos;
+ let cur_pos = this.scrollBar.get_value();
+ if (this.position == UPPER) {
+ new_pos = cur_pos - region.step;
+ } else {
+ new_pos = cur_pos + region.step;
+ }
+ this.scrollBar.set_value(new_pos);
+ Mainloop.timeout_add(region.delay, Lang.bind(this, function() {
+ this._doScroll(region);
+ }));
+ }
+ },
+
+ updateEnabled: function() {
+ let enabled = global.settings.get_boolean("menu-enable-autoscroll");
+ if (enabled) {
+ this.enable();
+ } else {
+ this.disable();
+ }
+ },
+
+ disable: function() {
+ if (this._enabled) {
+ this.slowRegion.disconnect(this.signals.slowEnter);
+ this.slowRegion.disconnect(this.signals.slowLeave);
+ this.medRegion.disconnect(this.signals.medEnter);
+ this.medRegion.disconnect(this.signals.medLeave);
+ this.fastRegion.disconnect(this.signals.fastEnter);
+ this.fastRegion.disconnect(this.signals.fastLeave);
+ this.slowRegion.set_style(SUBREGION_HEIGHT_INACTIVE);
+ this.medRegion.set_style(SUBREGION_HEIGHT_INACTIVE);
+ this.fastRegion.set_style(SUBREGION_HEIGHT_INACTIVE);
+ this._enabled = false;
+ }
+ },
+
+ enable: function() {
+ if (!this._enabled) {
+ this.signals.slowEnter = this.slowRegion.connect('enter-event', Lang.bind(this, this._onEnterRegion));
+ this.signals.medEnter = this.medRegion.connect('enter-event', Lang.bind(this, this._onEnterRegion));
+ this.signals.fastEnter = this.fastRegion.connect('enter-event', Lang.bind(this, this._onEnterRegion));
+ this.signals.slowLeave = this.slowRegion.connect('leave-event', Lang.bind(this, this._onLeaveRegion));
+ this.signals.medLeave = this.medRegion.connect('leave-event', Lang.bind(this, this._onLeaveRegion));
+ this.signals.fastLeave = this.fastRegion.connect('leave-event', Lang.bind(this, this._onLeaveRegion));
+ this.slowRegion.set_style(SUBREGION_HEIGHT_ACTIVE);
+ this.medRegion.set_style(SUBREGION_HEIGHT_ACTIVE);
+ this.fastRegion.set_style(SUBREGION_HEIGHT_ACTIVE);
+ this._enabled = true;
+ }
+ }
+}
+
function MyApplet(orientation, panel_height) {
this._init(orientation, panel_height);
}
@@ -1098,7 +1229,6 @@ MyApplet.prototype = {
this._addEnterEvent(button, Lang.bind(this, function() {
this._clearPrevAppSelection(button.actor);
button.actor.style_class = "menu-application-button-selected";
- this._scrollToButton(button);
this.selectedAppDescription.set_text(button.place.id.slice(16));
}));
button.actor.connect('leave-event', Lang.bind(this, function() {
@@ -1142,7 +1272,6 @@ MyApplet.prototype = {
this._addEnterEvent(button, Lang.bind(this, function() {
this._clearPrevAppSelection(button.actor);
button.actor.style_class = "menu-application-button-selected";
- this._scrollToButton(button);
this.selectedAppDescription.set_text(button.file.uri.slice(7));
}));
button.actor.connect('leave-event', Lang.bind(this, function() {
@@ -1317,7 +1446,6 @@ MyApplet.prototype = {
this.selectedAppDescription.set_text("");
this._clearPrevAppSelection(applicationButton.actor);
applicationButton.actor.style_class = "menu-application-button-selected";
- this._scrollToButton(applicationButton);
},
find_dupe: function(app) {
@@ -1375,6 +1503,7 @@ MyApplet.prototype = {
this.categoriesApplicationsBox = new CategoriesApplicationsBox();
rightPane.add_actor(this.categoriesApplicationsBox.actor);
this.categoriesBox = new St.BoxLayout({ style_class: 'menu-categories-box', vertical: true });
+ this.autoScrollBox = new St.BoxLayout({ vertical: true });
this.applicationsScrollBox = new St.ScrollView({ x_fill: true, y_fill: false, y_align: St.Align.START, style_class: 'vfade menu-applications-scrollbox' });
let vscroll = this.applicationsScrollBox.get_vscroll_bar();
@@ -1391,10 +1520,17 @@ MyApplet.prototype = {
this.applicationsScrollBox.add_actor(this.applicationsBox);
this.applicationsScrollBox.set_policy(Gtk.PolicyType.NEVER, Gtk.PolicyType.AUTOMATIC);
this.categoriesApplicationsBox.actor.add_actor(this.categoriesBox);
- this.categoriesApplicationsBox.actor.add_actor(this.applicationsScrollBox);
-
+
+ this.upperScrollRegion = new AutoScrollArea(UPPER, this.applicationsScrollBox);
+ this.lowerScrollRegion = new AutoScrollArea(LOWER, this.applicationsScrollBox);
+
+ this.autoScrollBox.add_actor(this.upperScrollRegion.actor);
+ this.autoScrollBox.add_actor(this.applicationsScrollBox);
+ this.autoScrollBox.add_actor(this.lowerScrollRegion.actor);
+ this.categoriesApplicationsBox.actor.add_actor(this.autoScrollBox);
+
this._refreshFavs();
-
+
this.mainBox = new St.BoxLayout({ style_class: 'menu-applications-box', vertical:false });
this.mainBox.add_actor(leftPane, { span: 1 });
Something went wrong with that request. Please try again.