aboutsummaryrefslogtreecommitdiff
path: root/ext/mixed/js/display-history.js
diff options
context:
space:
mode:
authortoasted-nutbread <toasted-nutbread@users.noreply.github.com>2020-07-26 16:51:54 -0400
committerGitHub <noreply@github.com>2020-07-26 16:51:54 -0400
commit208217198e9228699e7299f06d3701899d44d8bb (patch)
treeaae11d6af70bac0c61774b8f611d9117101a288f /ext/mixed/js/display-history.js
parente153971cd4a5768a6c7dc9df36cf446cf298227d (diff)
Display history refactor (#691)
* Create DisplayHistory * Change arguments for _setContentTermsOrKanji * Set up history-driven content updates * Use new history only * Load definitions if missing * Refactor definitions getting * Add support for wildcards * Move definitions setup * Add events * Allow state change even if there is no history state * Update search page to use history * Fix history overwriting * Fix search page not seeing state chang events during prepare * Update state if necessary * Don't reassign query text if the same * Remove DisplayContext * Initialize with real history state * Track URL * Update DisplayHistory to support pseudo-history * Configure history settings on search page * Fix state * Use full URL * Change data format of setContent * Rename details to content * Update event arguments * Fix animation * Remove old state changes * Clear content properly * Remove set/clear content overrides * Fix setting up event listeners for content clear * Make clearContent private * Make focus opt-in * Validate source * Add unloaded type * Generalize content params * Update how extension unload content is assigned * Restore query blurring
Diffstat (limited to 'ext/mixed/js/display-history.js')
-rw-r--r--ext/mixed/js/display-history.js178
1 files changed, 178 insertions, 0 deletions
diff --git a/ext/mixed/js/display-history.js b/ext/mixed/js/display-history.js
new file mode 100644
index 00000000..cf2db8d5
--- /dev/null
+++ b/ext/mixed/js/display-history.js
@@ -0,0 +1,178 @@
+/*
+ * Copyright (C) 2020 Yomichan Authors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+
+class DisplayHistory extends EventDispatcher {
+ constructor({clearable=true, useBrowserHistory=false}) {
+ super();
+ this._clearable = clearable;
+ this._useBrowserHistory = useBrowserHistory;
+ this._historyMap = new Map();
+
+ const historyState = history.state;
+ const {id, state} = isObject(historyState) ? historyState : {id: null, state: null};
+ this._current = this._createHistoryEntry(id, location.href, state, null, null);
+ }
+
+ get state() {
+ return this._current.state;
+ }
+
+ get content() {
+ return this._current.content;
+ }
+
+ get useBrowserHistory() {
+ return this._useBrowserHistory;
+ }
+
+ set useBrowserHistory(value) {
+ this._useBrowserHistory = value;
+ }
+
+ prepare() {
+ window.addEventListener('popstate', this._onPopState.bind(this), false);
+ }
+
+ hasNext() {
+ return this._current.next !== null;
+ }
+
+ hasPrevious() {
+ return this._current.previous !== null;
+ }
+
+ clear() {
+ if (!this._clearable) { return; }
+ this._clear();
+ }
+
+ back() {
+ return this._go(false);
+ }
+
+ forward() {
+ return this._go(true);
+ }
+
+ pushState(state, content, url) {
+ if (typeof url === 'undefined') { url = location.href; }
+
+ const entry = this._createHistoryEntry(null, url, state, content, this._current);
+ this._current.next = entry;
+ this._current = entry;
+ this._updateHistoryFromCurrent(!this._useBrowserHistory);
+ }
+
+ replaceState(state, content, url) {
+ if (typeof url === 'undefined') { url = location.href; }
+
+ this._current.url = url;
+ this._current.state = state;
+ this._current.content = content;
+ this._updateHistoryFromCurrent(true);
+ }
+
+ _onPopState() {
+ this._updateStateFromHistory();
+ this._triggerStateChanged(false);
+ }
+
+ _go(forward) {
+ const target = forward ? this._current.next : this._current.previous;
+ if (target === null) {
+ return false;
+ }
+
+ if (this._useBrowserHistory) {
+ if (forward) {
+ history.forward();
+ } else {
+ history.back();
+ }
+ } else {
+ this._current = target;
+ this._updateHistoryFromCurrent(true);
+ }
+
+ return true;
+ }
+
+ _triggerStateChanged(synthetic) {
+ this.trigger('stateChanged', {history: this, synthetic});
+ }
+
+ _updateHistoryFromCurrent(replace) {
+ const {id, state, url} = this._current;
+ if (replace) {
+ history.replaceState({id, state}, '', url);
+ } else {
+ history.pushState({id, state}, '', url);
+ }
+ this._triggerStateChanged(true);
+ }
+
+ _updateStateFromHistory() {
+ let state = history.state;
+ let id = null;
+ if (isObject(state)) {
+ id = state.id;
+ if (typeof id === 'string') {
+ const entry = this._historyMap.get(id);
+ if (typeof entry !== 'undefined') {
+ // Valid
+ this._current = entry;
+ return;
+ }
+ }
+ // Partial state recovery
+ state = state.state;
+ } else {
+ state = null;
+ }
+
+ // Fallback
+ this._current.id = (typeof id === 'string' ? id : this._generateId());
+ this._current.state = state;
+ this._current.content = null;
+ this._clear();
+ }
+
+ _createHistoryEntry(id, url, state, content, previous) {
+ if (typeof id !== 'string') { id = this._generateId(); }
+ const entry = {
+ id,
+ url,
+ next: null,
+ previous,
+ state,
+ content
+ };
+ this._historyMap.set(id, entry);
+ return entry;
+ }
+
+ _generateId() {
+ return yomichan.generateId(16);
+ }
+
+ _clear() {
+ this._historyMap.clear();
+ this._historyMap.set(this._current.id, this._current);
+ this._current.next = null;
+ this._current.previous = null;
+ }
+}