Merge branch 'pagenation-and-navigation'
This commit is contained in:
commit
78233b25b7
7 changed files with 155 additions and 20 deletions
|
@ -38,8 +38,9 @@ Firefox by WebExtensions API.
|
|||
- [ ] find a keyword in the page
|
||||
- [ ] navigations
|
||||
- [ ] yank/paste page
|
||||
- [ ] pagenation
|
||||
- [ ] open parent page
|
||||
- [x] pagenation
|
||||
- [x] open parent page
|
||||
- [x] open root page
|
||||
- [ ] hints
|
||||
- [x] open a link
|
||||
- [ ] open a link in new tab
|
||||
|
|
|
@ -28,8 +28,12 @@ const defaultKeymap = {
|
|||
'zz': { type: operations.ZOOM_NEUTRAL },
|
||||
'f': { type: operations.FOLLOW_START, newTab: false },
|
||||
'F': { type: operations.FOLLOW_START, newTab: true },
|
||||
'H': { type: operations.HISTORY_PREV },
|
||||
'L': { type: operations.HISTORY_NEXT },
|
||||
'H': { type: operations.NAVIGATE_HISTORY_PREV },
|
||||
'L': { type: operations.NAVIGATE_HISTORY_NEXT },
|
||||
'[[': { type: operations.NAVIGATE_LINK_PREV },
|
||||
']]': { type: operations.NAVIGATE_LINK_NEXT },
|
||||
'gu': { type: operations.NAVIGATE_PARENT },
|
||||
'gU': { type: operations.NAVIGATE_ROOT },
|
||||
};
|
||||
|
||||
const asKeymapChars = (keys) => {
|
||||
|
|
|
@ -1,8 +0,0 @@
|
|||
const prev = (win) => {
|
||||
win.history.back();
|
||||
};
|
||||
const next = (win) => {
|
||||
win.history.forward();
|
||||
};
|
||||
|
||||
export { prev, next };
|
|
@ -1,7 +1,7 @@
|
|||
import '../console/console-frame.scss';
|
||||
import * as consoleFrames from '../console/frames';
|
||||
import * as scrolls from '../content/scrolls';
|
||||
import * as histories from '../content/histories';
|
||||
import * as navigates from '../content/navigates';
|
||||
import Follow from '../content/follow';
|
||||
import operations from '../operations';
|
||||
import messages from '../messages';
|
||||
|
@ -15,7 +15,7 @@ window.addEventListener('keypress', (e) => {
|
|||
browser.runtime.sendMessage({
|
||||
type: messages.KEYDOWN,
|
||||
code: e.which,
|
||||
ctrl: e.ctrl
|
||||
ctrl: e.ctrlKey
|
||||
});
|
||||
});
|
||||
|
||||
|
@ -35,10 +35,18 @@ const execOperation = (operation) => {
|
|||
return scrolls.scrollRight(window);
|
||||
case operations.FOLLOW_START:
|
||||
return new Follow(window.document, operation.newTab);
|
||||
case operations.HISTORY_PREV:
|
||||
return histories.prev(window);
|
||||
case operations.HISTORY_NEXT:
|
||||
return histories.next(window);
|
||||
case operations.NAVIGATE_HISTORY_PREV:
|
||||
return navigates.historyPrev(window);
|
||||
case operations.NAVIGATE_HISTORY_NEXT:
|
||||
return navigates.historyNext(window);
|
||||
case operations.NAVIGATE_LINK_PREV:
|
||||
return navigates.linkPrev(window);
|
||||
case operations.NAVIGATE_LINK_NEXT:
|
||||
return navigates.linkNext(window);
|
||||
case operations.NAVIGATE_PARENT:
|
||||
return navigates.parent(window);
|
||||
case operations.NAVIGATE_ROOT:
|
||||
return navigates.root(window);
|
||||
}
|
||||
};
|
||||
|
||||
|
|
70
src/content/navigates.js
Normal file
70
src/content/navigates.js
Normal file
|
@ -0,0 +1,70 @@
|
|||
const PREV_LINK_PATTERNS = [
|
||||
/\bprev\b/i, /\bprevious\b/i, /\bback\b/i,
|
||||
/</, /\u2039/, /\u2190/, /\xab/, /\u226a/, /<</
|
||||
];
|
||||
const NEXT_LINK_PATTERNS = [
|
||||
/\bnext\b/i,
|
||||
/>/, /\u203a/, /\u2192/, /\xbb/, /\u226b/, />>/
|
||||
];
|
||||
|
||||
const findLinkByPatterns = (win, patterns) => {
|
||||
let links = win.document.getElementsByTagName('a');
|
||||
return Array.prototype.find.call(links, (link) => {
|
||||
return patterns.some(ptn => ptn.test(link.textContent));
|
||||
});
|
||||
};
|
||||
|
||||
const historyPrev = (win) => {
|
||||
win.history.back();
|
||||
};
|
||||
|
||||
const historyNext = (win) => {
|
||||
win.history.forward();
|
||||
};
|
||||
|
||||
const linkPrev = (win) => {
|
||||
let link = win.document.querySelector('a[rel=prev]');
|
||||
if (link) {
|
||||
return link.click();
|
||||
}
|
||||
link = findLinkByPatterns(win, PREV_LINK_PATTERNS);
|
||||
if (link) {
|
||||
link.click();
|
||||
}
|
||||
};
|
||||
|
||||
const linkNext = (win) => {
|
||||
let link = win.document.querySelector('a[rel=next]');
|
||||
if (link) {
|
||||
return link.click();
|
||||
}
|
||||
link = findLinkByPatterns(win, NEXT_LINK_PATTERNS);
|
||||
if (link) {
|
||||
link.click();
|
||||
}
|
||||
};
|
||||
|
||||
const parent = (win) => {
|
||||
let loc = win.location;
|
||||
if (loc.hash !== '') {
|
||||
loc.hash = '';
|
||||
return;
|
||||
} else if (loc.search !== '') {
|
||||
loc.search = '';
|
||||
return;
|
||||
}
|
||||
|
||||
const basenamePattern = /\/[^/]+$/;
|
||||
const lastDirPattern = /\/[^/]+\/$/;
|
||||
if (basenamePattern.test(loc.pathname)) {
|
||||
loc.pathname = loc.pathname.replace(basenamePattern, '/');
|
||||
} else if (lastDirPattern.test(loc.pathname)) {
|
||||
loc.pathname = loc.pathname.replace(lastDirPattern, '/');
|
||||
}
|
||||
};
|
||||
|
||||
const root = (win) => {
|
||||
win.location = win.location.origin;
|
||||
};
|
||||
|
||||
export { historyPrev, historyNext, linkPrev, linkNext, parent, root };
|
|
@ -11,8 +11,12 @@ export default {
|
|||
SCROLL_LEFT: 'scroll.left',
|
||||
SCROLL_RIGHT: 'scroll.right',
|
||||
FOLLOW_START: 'follow.start',
|
||||
HISTORY_PREV: 'history.prev',
|
||||
HISTORY_NEXT: 'history.next',
|
||||
NAVIGATE_HISTORY_PREV: 'navigate.history.prev',
|
||||
NAVIGATE_HISTORY_NEXT: 'navigate.history.next',
|
||||
NAVIGATE_LINK_PREV: 'navigate.link.prev',
|
||||
NAVIGATE_LINK_NEXT: 'navigate.link.next',
|
||||
NAVIGATE_PARENT: 'navigate.parent',
|
||||
NAVIGATE_ROOT: 'navigate.root',
|
||||
|
||||
// Background
|
||||
TABS_CLOSE: 'tabs.close',
|
||||
|
|
56
test/content/navigates.test.js
Normal file
56
test/content/navigates.test.js
Normal file
|
@ -0,0 +1,56 @@
|
|||
import { expect } from "chai";
|
||||
import * as navigates from '../../src/content/navigates';
|
||||
|
||||
describe('navigates module', () => {
|
||||
describe('#linkPrev', () => {
|
||||
it('clicks prev link by text content', (done) => {
|
||||
document.body.innerHTML = '<a href="#dummy">xprevx</a> <a href="#prev">go to prev</a>';
|
||||
navigates.linkPrev(window);
|
||||
setTimeout(() => {
|
||||
expect(document.location.hash).to.equal('#prev');
|
||||
done();
|
||||
}, 0);
|
||||
});
|
||||
|
||||
it('clicks a[rel=prev] element preferentially', (done) => {
|
||||
document.body.innerHTML = '<a href="#dummy">prev</a> <a rel="prev" href="#prev">rel</a>';
|
||||
navigates.linkPrev(window);
|
||||
setTimeout(() => {
|
||||
expect(document.location.hash).to.equal('#prev');
|
||||
done();
|
||||
}, 0);
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
describe('#linkNext', () => {
|
||||
it('clicks next link by text content', (done) => {
|
||||
document.body.innerHTML = '<a href="#dummy">xnextx</a> <a href="#next">go to next</a>';
|
||||
navigates.linkNext(window);
|
||||
setTimeout(() => {
|
||||
expect(document.location.hash).to.equal('#next');
|
||||
done();
|
||||
}, 0);
|
||||
});
|
||||
|
||||
it('clicks a[rel=next] element preferentially', (done) => {
|
||||
document.body.innerHTML = '<a href="#dummy">next</a> <a rel="next" href="#next">rel</a>';
|
||||
navigates.linkNext(window);
|
||||
setTimeout(() => {
|
||||
expect(document.location.hash).to.equal('#next');
|
||||
done();
|
||||
}, 0);
|
||||
});
|
||||
});
|
||||
|
||||
describe('#parent', () => {
|
||||
// NOTE: not able to test location
|
||||
it('removes hash', () => {
|
||||
window.location.hash = "#section-1";
|
||||
navigates.parent(window);
|
||||
expect(document.location.hash).to.be.empty;
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
|
Reference in a new issue