FIX: iframe wasn't loaded at specific timming

This commit is contained in:
Tony Air 2020-09-11 05:19:09 +07:00
parent e3ee9ec1ba
commit d1d75947c5
2 changed files with 36 additions and 21 deletions

View File

@ -1,6 +1,6 @@
{
"name": "@a2nt/meta-lightbox",
"version": "2.3.5",
"version": "2.3.6",
"description": "Universal Lightbox window",
"main": "meta-lightbox.js",
"author": "Tony Air <tony@twma.pro>",

View File

@ -505,12 +505,6 @@ const MetaLightboxUI = (($) => {
static loadIframe(href, classTerm) {
const ui = this;
// don't load on offline
if ($Body.hasClass('is-offline')) {
console.warn(`${NAME}: Unable to load iframe offline`);
return false;
}
const $iframe = $('<iframe>', {
src: href,
class: classTerm,
@ -524,29 +518,41 @@ const MetaLightboxUI = (($) => {
console.log(`${NAME}: loading iframe`);
$Body.append(
'<div id="IFramePreload" class="hidden d-none iframe-preload" style="display:none"></div>',
'<div id="MetaIFramePreload" class="hidden d-none iframe-preload" style="display:none"></div>',
);
const $preload = $('#IFramePreload');
const $preload = $('#MetaIFramePreload');
$preload.html($iframe);
$iframe.on('load', () => {
console.log(`${NAME}: the iframe was loaded`);
$preload.html('');
$preload.remove();
// don't load on offline
if ($Body.hasClass('is-offline')) {
console.warn(`${NAME}: Unable to load iframe offline`);
return false;
}
ui.$content.addClass('iframe-delay');
ui.$content.html($iframe);
ui.contentLoaded();
setTimeout(() => {
ui.$content.removeClass('iframe-delay');
}, 1000);
ui.finishIFrameLoading($preload, $iframe);
});
return $iframe;
}
static finishIFrameLoading() {
const ui = this;
console.log(`${NAME}: the iframe was loaded`);
$preload.html('');
$preload.remove();
ui.$content.addClass('iframe-delay');
ui.$content.html($iframe);
ui.contentLoaded();
setTimeout(() => {
ui.$content.removeClass('iframe-delay');
}, 1000);
}
static contentLoaded() {
const ui = this;
@ -617,8 +623,17 @@ const MetaLightboxUI = (($) => {
});
$W.on(`${Events.BACKONLINE}`, () => {
const $iframe = $('.meta-lightbox-content iframe');
console.log(`${NAME}: reloading iframe`);
const $preload = $('#MetaIFramePreload');
if ($preload.length) {
const $iframe = $preload.find('iframe');
if ($iframe.length) {
ui.finishIFrameLoading($preload, $iframe);
}
}
const $iframe = $('.meta-lightbox-content iframe');
$iframe.attr('src', $iframe.attr('src'));
});