mirror of
https://github.com/TryGhost/Ghost.git
synced 2024-12-01 05:50:35 +03:00
baafe011a2
no issue - moved `@onLoad` trigger from `load` event to the `makeVisible()` task so that consumer code isn't called before load has fully finished - fixes issue with portal sometimes not being ready when we perform the resize on the membership screen - added guid as a cache-busting `?v={guid}` query param - fixes issue where preview iframe can load stale data after a settings change resulting in a blank preview after going from "nobody" to "invite/anybody" because the loaded homepage is stale and doesn't have the portal script injected
88 lines
2.8 KiB
JavaScript
88 lines
2.8 KiB
JavaScript
import Component from '@glimmer/component';
|
|
import {action} from '@ember/object';
|
|
import {inject as service} from '@ember/service';
|
|
import {task} from 'ember-concurrency-decorators';
|
|
import {timeout} from 'ember-concurrency';
|
|
import {tracked} from '@glimmer/tracking';
|
|
|
|
export default class GhSiteIframeComponent extends Component {
|
|
@service config;
|
|
|
|
@tracked isInvisible = this.args.invisibleUntilLoaded;
|
|
|
|
willDestroy() {
|
|
if (this.messageListener) {
|
|
window.removeEventListener('message', this.messageListener);
|
|
}
|
|
this.args.onDestroyed?.();
|
|
}
|
|
|
|
get srcUrl() {
|
|
const srcUrl = new URL(this.args.src || `${this.config.get('blogUrl')}/`);
|
|
|
|
if (this.args.guid) {
|
|
srcUrl.searchParams.set('v', this.args.guid);
|
|
}
|
|
|
|
return srcUrl.href;
|
|
}
|
|
|
|
@action
|
|
resetSrcAttribute(iframe) {
|
|
// reset the src attribute and force reload each time the guid changes
|
|
// - allows for a click on the navigation item to reset back to the homepage
|
|
// or a portal preview modal to force a reload so it can fetch server-side data
|
|
if (this.args.guid !== this._lastGuid) {
|
|
if (iframe) {
|
|
if (this.args.invisibleUntilLoaded) {
|
|
this.isInvisible = true;
|
|
}
|
|
if (iframe.contentWindow.location.href !== this.srcUrl) {
|
|
iframe.contentWindow.location = this.srcUrl;
|
|
} else {
|
|
iframe.contentWindow.location.reload();
|
|
}
|
|
}
|
|
}
|
|
this._lastGuid = this.args.guid;
|
|
}
|
|
|
|
@action
|
|
onLoad(event) {
|
|
this.iframe = event.target;
|
|
|
|
if (this.args.invisibleUntilLoaded && typeof this.args.invisibleUntilLoaded === 'boolean') {
|
|
this.makeVisible.perform();
|
|
} else {
|
|
this.args.onLoad?.(this.iframe);
|
|
}
|
|
}
|
|
|
|
@action
|
|
attachMessageListener() {
|
|
if (typeof this.args.invisibleUntilLoaded === 'string') {
|
|
this.messageListener = (event) => {
|
|
const srcURL = new URL(this.srcUrl);
|
|
const originURL = new URL(event.origin);
|
|
|
|
if (originURL.origin === srcURL.origin) {
|
|
if (event.data === this.args.invisibleUntilLoaded) {
|
|
this.makeVisible.perform();
|
|
}
|
|
}
|
|
};
|
|
|
|
window.addEventListener('message', this.messageListener, true);
|
|
}
|
|
}
|
|
|
|
@task
|
|
*makeVisible() {
|
|
// give any scripts a bit of time to render before making visible
|
|
// allows portal to render it's overlay and prevent site background flashes
|
|
yield timeout(100);
|
|
this.isInvisible = false;
|
|
this.args.onLoad?.(this.iframe);
|
|
}
|
|
}
|