nocebo/diaspora
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix stream shortcuts on small screens

Browse source
This commit is contained in:
Steffen van Bergerem 2016-08-21 10:02:20 +02:00
parent 08c6d485e4
commit 002a7ff984
No known key found for this signature in database
GPG key ID: 2F08F75F9525C7E0
4 changed files with 31 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
app/assets/javascripts/app/views/stream/shortcuts.js
View file

@ -1,7 +1,7 @@
// @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL-v3-or-Later // @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL-v3-or-Later
app.views.StreamShortcuts = Backbone.View.extend({ app.views.StreamShortcuts = Backbone.View.extend({
_headerSize: 50, _headerSize: 60,
events: { events: {
"keydown": "_onHotkeyDown", "keydown": "_onHotkeyDown",
@ -57,35 +57,35 @@ app.views.StreamShortcuts = Backbone.View.extend({
gotoNext: function() { gotoNext: function() {
// select next post: take the first post under the header // select next post: take the first post under the header
var stream_elements = this.$('div.stream_element.loaded'); var streamElements = this.$("div.stream_element.loaded");
var posUser = window.pageYOffset; var posUser = window.pageYOffset;
for (var i = 0; i < stream_elements.length; i++) { for (var i = 0; i < streamElements.length; i++) {
if(stream_elements[i].offsetTop>posUser+this._headerSize){ if (Math.round($(streamElements[i]).offset().top) > posUser + this._headerSize) {
this.selectPost(stream_elements[i]); this.selectPost(streamElements[i]);
return; return;
} }
} }
// standard: last post // standard: last post
if(stream_elements[stream_elements.length-1]){ if (streamElements[streamElements.length - 1]) {
this.selectPost(stream_elements[stream_elements.length-1]); this.selectPost(streamElements[streamElements.length - 1]);
} }
}, },
gotoPrev: function() { gotoPrev: function() {
// select previous post: take the first post above the header // select previous post: take the first post above the header
var stream_elements = this.$('div.stream_element.loaded'); var streamElements = this.$("div.stream_element.loaded");
var posUser = window.pageYOffset; var posUser = window.pageYOffset;
for (var i = stream_elements.length-1; i >=0; i--) { for (var i = streamElements.length - 1; i >= 0; i--) {
if(stream_elements[i].offsetTop<posUser+this._headerSize){ if (Math.round($(streamElements[i]).offset().top) < posUser + this._headerSize) {
this.selectPost(stream_elements[i]); this.selectPost(streamElements[i]);
return; return;
} }
} }
// standard: first post // standard: first post
if(stream_elements[0]){ if (streamElements[0]) {
this.selectPost(stream_elements[0]); this.selectPost(streamElements[0]);
} }
}, },
@ -118,7 +118,7 @@ app.views.StreamShortcuts = Backbone.View.extend({
var selected=this.$('div.stream_element.loaded.shortcut_selected'); var selected=this.$('div.stream_element.loaded.shortcut_selected');
selected.removeClass('shortcut_selected').removeClass('highlighted'); selected.removeClass('shortcut_selected').removeClass('highlighted');
//move to new post //move to new post
window.scrollTo(window.pageXOffset, element.offsetTop-this._headerSize); window.scrollTo(window.pageXOffset, Math.round($(element).offset().top - this._headerSize));
//add the selection and selected-class to new post //add the selection and selected-class to new post
element.className+=" shortcut_selected highlighted"; element.className+=" shortcut_selected highlighted";
}, },

15
features/desktop/keyboard_navigation.feature
View file

@ -60,3 +60,18 @@ Feature: Keyboard navigation
When I press the "J" key somewhere When I press the "J" key somewhere
Then post 2 should be highlighted Then post 2 should be highlighted
And I should have navigated to the highlighted post And I should have navigated to the highlighted post
Scenario: navigate downwards on a small screen
When I resize my window to 800x600
And I press the "J" key somewhere
Then post 1 should be highlighted
And I should have navigated to the highlighted post
When I press the "J" key somewhere
Then post 2 should be highlighted
And I should have navigated to the highlighted post
Given I expand the publisher
When I press the "J" key in the publisher
Then post 2 should be highlighted
And I close the publisher

4
features/step_definitions/custom_web_steps.rb
View file

@ -241,9 +241,7 @@ And "I wait for notifications to load" do
end end
When /^I resize my window to 800x600$/ do When /^I resize my window to 800x600$/ do
page.execute_script <<-JS page.driver.resize(800, 600)
window.resizeTo(800,600);
JS
end end
Then 'I should see an image attached to the post' do Then 'I should see an image attached to the post' do

2
features/step_definitions/keyboard_navigation_steps.rb
View file

@ -13,5 +13,5 @@ Then /^post (\d+) should be highlighted$/ do |position|
end end
And /^I should have navigated to the highlighted post$/ do And /^I should have navigated to the highlighted post$/ do
find(".shortcut_selected")["offsetTop"].to_i.should == page.evaluate_script("window.pageYOffset + 50").to_i expect(page.evaluate_script("window.pageYOffset + 60 - $('.shortcut_selected').offset().top").to_i).to be(0)
end end