diff --git a/src/managers/helpers/views.js b/src/managers/helpers/views.js index 4368da2..45ccf31 100644 --- a/src/managers/helpers/views.js +++ b/src/managers/helpers/views.js @@ -77,9 +77,8 @@ class Views { } destroy(view) { - if(view.displayed){ - view.destroy(); - } + // Just destroy it. + view.destroy(); if(this.container){ this.container.removeChild(view.element); diff --git a/src/managers/views/iframe.js b/src/managers/views/iframe.js index e20e54d..bb1ef82 100644 --- a/src/managers/views/iframe.js +++ b/src/managers/views/iframe.js @@ -6,7 +6,16 @@ import { EVENTS } from "../../utils/constants"; import { Pane, Highlight, Underline } from "marks-pane"; class IframeView { + /** + * One section only have one View, + * we can put them into the map to destroy the old one. + */ + static ViewMap = new Map(); constructor(section, options) { + const oldView = IframeView.ViewMap.get(section.href); + if (oldView) oldView.destroy(); + IframeView.ViewMap.set(section.href, this); + this.settings = extend({ ignoreClass : "", axis: undefined, //options.layout && options.layout.props.flow === "scrolled" ? "vertical" : "horizontal", @@ -48,6 +57,7 @@ class IframeView { this.highlights = {}; this.underlines = {}; this.marks = {}; + this.loading = undefined; } @@ -98,7 +108,7 @@ class IframeView { if (this.settings.allowPopups) { this.iframe.sandbox += " allow-popups"; } - + this.iframe.setAttribute("enable-annotation", "true"); this.resizing = true; @@ -158,7 +168,6 @@ class IframeView { return this.load(contents); }.bind(this)) .then(function(){ - // find and report the writingMode axis let writingMode = this.contents.writingMode(); @@ -382,7 +391,8 @@ class IframeView { load(contents) { - var loading = new defer(); + this.loading && this.loading.reject('cancel'); + var loading = this.loading = new defer(); var loaded = loading.promise; if(!this.iframe) { @@ -841,6 +851,14 @@ class IframeView { this._height = null; } + /** + * Make sure the promise doesn't get stuck in pending, + * This avoids queue blocking. + */ + if (this.loading) { + this.loading.reject('cancel'); + } + // this.element.style.height = "0px"; // this.element.style.width = "0px"; }