Skip to content

Commit

Permalink
Added data events
Browse files Browse the repository at this point in the history
  • Loading branch information
validide committed Apr 24, 2020
1 parent 674eb22 commit 118b769
Show file tree
Hide file tree
Showing 14 changed files with 222 additions and 19 deletions.
5 changes: 5 additions & 0 deletions docs/demo/embeded-nav-bar.html
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,9 @@
manager.initialize();
var contentMethods = new ufe.ContentCommunicationHandlerMethods();
contentMethods.dispose = function() { dispose(); };
contentMethods.handleDataEvent = function(data) {
console.log('Iframe recevied data: \n\n' + JSON.stringify(data));
};
communicationHandler = new ufe.CrossWindowContentCommunicationHandler(
manager,
contentMethods
Expand Down Expand Up @@ -104,6 +107,7 @@
} else {
if (communicationHandler) {
communicationHandler.dispatchBeforeUpdate();

setTimeout(() => {
communicationHandler.dispatchUpdated();
}, 1000);
Expand All @@ -123,6 +127,7 @@
// Simulate a delay to consider exts processing
window.setTimeout(() => {
communicationHandler.dispatchMounted();
communicationHandler.sendData(['Data from content!']);
}, 1000);
}
}
Expand Down
10 changes: 9 additions & 1 deletion docs/demo/js/app.js
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,10 @@
case 'error':
console.error(evt.error);
break;
default:
case 'data':
console.log('Data from child:\n' + JSON.stringify(evt.data));
break;
default:
alert('Unknown event: ' + evt.type);
}
}
Expand All @@ -43,6 +46,7 @@
globalHandlers['beforeDestroy'] = mfeEventHadler;
globalHandlers['destroyed'] = mfeEventHadler;
globalHandlers['error'] = mfeEventHadler;
globalHandlers['data'] = mfeEventHadler;


var configuration = new ufe.RootComponentOptions();
Expand Down Expand Up @@ -206,6 +210,10 @@
if (!navbarIframeId)
return;

mfe.getChild(navbarIframeId).sendData({
'foo': 'bar'
})

await mfe.removeChild(navbarIframeId);
navbarIframeId = '';
}
Expand Down
64 changes: 54 additions & 10 deletions docs/demo/lib/bundle/index.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion docs/demo/lib/bundle/index.js.map

Large diffs are not rendered by default.

9 changes: 9 additions & 0 deletions src/core/children/childComponent.ts
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,7 @@ export abstract class ChildComponent extends Component {
methods.mounted = () => this.callHandler(ComponentEventType.Mounted);
methods.beforeUpdate = () => this.callHandler(ComponentEventType.BeforeUpdate);
methods.updated = () => this.callHandler(ComponentEventType.Updated);
methods.data = (data: any) => this.callHandler(ComponentEventType.Data, data);
methods.beforeDispose = () => this.contentBeginDisposed();
methods.disposed = () => this.contentDisposed();
return this.getCommunicationHandlerCore(methods);
Expand Down Expand Up @@ -139,4 +140,12 @@ export abstract class ChildComponent extends Component {
this.contentDisposePromise = null;
await super.disposeCore();
}

/**
* Send data.
* @param data The data to send.
*/
public sendData(data: any): void{
this.communicationHandler?.sendData(data);
}
}
16 changes: 15 additions & 1 deletion src/core/children/communications/containerHandler.ts
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,10 @@ export class ContainerCommunicationHandlerMethods {
* Call the container to signal the component has disposed(almost).
*/
public [CommunicationsEventKind.Disposed]: () => void = noop;
/**
* Call the container to signal the component has disposed(almost).
*/
public [CommunicationsEventKind.Data]: (data: any) => void = noop;
}

/**
Expand Down Expand Up @@ -65,7 +69,7 @@ export abstract class ContainerCommunicationHandler {
if (!method)
return;

method();
method(e.data);
}

/**
Expand Down Expand Up @@ -97,6 +101,16 @@ export abstract class ContainerCommunicationHandler {
this.communicationsManager?.send(event);
}

/**
* Send data.
* @param data The data to send.
*/
public sendData(data: any): void{
const event = new CommunicationsEvent(CommunicationsEventKind.Data);
event.data = data;
this.communicationsManager?.send(event);
}

/**
* Reuest that the content begins disposing.
*/
Expand Down
18 changes: 18 additions & 0 deletions src/core/children/communications/contentHandler.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,10 @@ export class ContentCommunicationHandlerMethods {
* Method to dispose the content.
*/
public dispose: () => void = noop;
/**
* Method to dispose the content.
*/
public handleDataEvent: (data: any) => void = noop;
}

/**
Expand Down Expand Up @@ -49,6 +53,11 @@ export abstract class ContentCommunicationHandler {
this.methods.dispose();
}
break;
case CommunicationsEventKind.Data:
if (this.methods) {
this.methods.handleDataEvent(e.data);
}
break;
default:
throw new Error(`The "${e.kind}" event is not configured.`);
}
Expand Down Expand Up @@ -76,6 +85,15 @@ export abstract class ContentCommunicationHandler {
this.communicationsManager?.send(event);
}

/**
* Dispatch event to signal mounting finished.
*/
public sendData(data: any): void {
const evt = new CommunicationsEvent(CommunicationsEventKind.Data);
evt.data = data;
this.send(evt);
}

/**
* Dispatch event to signal mounting finished.
*/
Expand Down
3 changes: 2 additions & 1 deletion src/core/children/communications/event.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,8 @@ export enum CommunicationsEventKind {
BeforeUpdate = 'beforeUpdate',
Updated = 'updated',
BeforeDispose = 'beforeDispose',
Disposed = 'disposed'
Disposed = 'disposed',
Data = 'data'
}

/**
Expand Down
8 changes: 5 additions & 3 deletions src/core/component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -160,7 +160,7 @@ export abstract class Component {
* Call a specific event handler.
* @param type The type of handler to call.
*/
protected callHandler(type: ComponentEventType): void {
protected callHandler(type: ComponentEventType, data?: any): void {
if (type === ComponentEventType.Error)
throw new Error(`For calling the "${ComponentEventType.Error}" handler use the "callErrorHandler" method.`);

Expand All @@ -170,13 +170,15 @@ export abstract class Component {

if (handler) {
try {
handler(new ComponentEvent(
const event = new ComponentEvent(
this.id,
type,
this.rootElement,
this.getParentElement(),
null
));
);
event.data = data;
handler(event);
} catch (error) {
this.callErrorHandler(error);
}
Expand Down
4 changes: 3 additions & 1 deletion src/core/componentEvent.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,8 @@ export enum ComponentEventType {
Updated = 'updated',
BeforeDestroy = 'beforeDestroy',
Destroyed = 'destroyed',
Error = 'error'
Error = 'error',
Data = 'data'
}

/**
Expand All @@ -28,6 +29,7 @@ export class ComponentEvent {
public parentEl: HTMLElement;
public error: Error | null;
public timestamp: Date;
public data: any;

/**
* COnstructor.
Expand Down
1 change: 1 addition & 0 deletions src/core/componentOptions.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ export class ComponentEventHandlers {
[ComponentEventType.BeforeDestroy]?: ComponentEventHandler;
[ComponentEventType.Destroyed]?: ComponentEventHandler;
[ComponentEventType.Error]?: ComponentEventHandler;
[ComponentEventType.Data]?: ComponentEventHandler;
}

/**
Expand Down
Loading

0 comments on commit 118b769

Please sign in to comment.