yujunjun/datahub
2
0
Fork 0
mirror of https://github.com/datahub-project/datahub.git synced 2025-08-31 04:25:29 +00:00
Code Issues Packages Projects Releases Wiki Activity

slight modification of proposed changes - change js to ts file and reallow right and left arrow keys

Browse Source
This commit is contained in:
Charlie Tran 2018-03-28 19:24:49 -07:00
parent 92c9df160b
commit 37e2bfb89a
3 changed files with 46 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
wherehows-web/app/components/ivy-tabs-tablist.js
View File

@ -1,12 +0,0 @@
import IvyTabsTablistComponent from 'ivy-tabs/components/ivy-tabs-tablist';
export default IvyTabsTablistComponent.extend({
/**
* Overwrites the original ivy-tabs-tablist component's keyDown method, which lets the user
* navigate through the tabs using the arrow keys. As we don't want that functionality, this
* empty function replaces the event handler and does nothing instead
*/
keyDown() {
// Do nothing
}
});

37
wherehows-web/app/components/ivy-tabs-tablist.ts Normal file
View File

@ -0,0 +1,37 @@
import IvyTabsTablistComponent from 'ivy-tabs/components/ivy-tabs-tablist';
import noop from 'wherehows-web/utils/noop';
import { scheduleOnce } from '@ember/runloop';
const LEFT_ARROW = 37;
const RIGHT_ARROW = 39;
export default IvyTabsTablistComponent.extend({
/**
* Overwrites the ofiginal ivy-tabs-tablist component's on('keydown') method, which lets the
* user navigate through the tabs using the arrow keys. As we don't want up and down arrows
* to interfere with page scroll, we change this to a noop function.
*/
navigateOnKeyDown: noop,
/**
* Using the more modern approach to handling component events, we include the functionality
* to scroll between tabs with the left and right arrow keys. This way, the user can scroll
* between tabs with the left/right keys and use the up/down keys to scroll the page, without
* interruption
*/
keyDown(event: KeyboardEvent) {
switch (event.keyCode) {
case LEFT_ARROW:
this.selectPreviousTab();
break;
case RIGHT_ARROW:
this.selectNextTab();
break;
default:
return;
}
event.preventDefault();
scheduleOnce('afterRender', this, this.focusSelectedTab);
}
});

9
wherehows-web/app/typings/untyped-js-module.d.ts vendored
View File

@ -5,6 +5,15 @@ declare module 'ember-simple-auth/mixins/authenticated-route-mixin' {
export default Mixin;
}
declare module 'ivy-tabs/components/ivy-tabs-tablist' {
import Component from '@ember/component';
export default class IvyTabsTablistComponent extends Component {
focusSelectedTab: () => void;
selectPreviousTab: () => void;
selectNextTab: () => void;
}
}
declare module 'ember-simple-auth/authenticators/base' {
import EmberObject from '@ember/object';
export default EmberObject;