From bde9b7bd17a0c333b6e84fcc7f1dd83b3fd92506 Mon Sep 17 00:00:00 2001 From: Mikel Tuesta Date: Fri, 13 Jul 2018 14:06:56 +0200 Subject: [PATCH] The component (Vanilla) now dispatches a after it's initialization. --- CHANGELOG.md | 2 ++ package.json | 2 +- .../event-bus/Modal/ModalInitializedEvent.js | 27 +++++++++++++++++ .../Modal/ModalInitializedEventSubscriber.js | 29 +++++++++++++++++++ src/js/event-bus/Modal/subscriptions.js | 17 +++++++++-- src/js/ui/vanilla/components/Modal/Modal.js | 12 +++++++- tests/app/app.js | 9 ++++++ 7 files changed, 94 insertions(+), 4 deletions(-) create mode 100644 src/js/event-bus/Modal/ModalInitializedEvent.js create mode 100644 src/js/event-bus/Modal/ModalInitializedEventSubscriber.js diff --git a/CHANGELOG.md b/CHANGELOG.md index b74747c3..3c88e6b4 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -5,6 +5,8 @@ This changelog references the relevant changes done between versions. To get the diff for a specific change, go to https://github.com/LIN3S/FrontFoundation/commit/XXX where XXX is the change hash To get the diff between two versions, go to https://github.com/LIN3S/FrontFoundation/compare/v0.5.0...v0.6.0 +* 0.19.3 + * The `Modal` component (Vanilla) now dispatches a `ModalInitializedEvent` after it's initialization. * 0.19.2 * The `autocomplete` field's value is now passed as a prop and it has a "new-password" as it's default value. * 0.19.1 diff --git a/package.json b/package.json index 0810f42d..2fc9090f 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "lin3s-front-foundation", - "version": "0.19.2", + "version": "0.19.3", "author": "LIN3S", "license": "MIT", "description": "Library that provides a sort of commonly used front-end components in LIN3S projects", diff --git a/src/js/event-bus/Modal/ModalInitializedEvent.js b/src/js/event-bus/Modal/ModalInitializedEvent.js new file mode 100644 index 00000000..4f77b851 --- /dev/null +++ b/src/js/event-bus/Modal/ModalInitializedEvent.js @@ -0,0 +1,27 @@ +/* + * This file is part of the Euskaltel project. + * + * Copyright (c) 2017 LIN3S + * + * For the full copyright and license information, please view the LICENSE + * file that was distributed with this source code. + * + * @author Mikel Tuesta + */ + +import {Event} from 'lin3s-event-bus'; + +class ModalInitializedEvent extends Event { + + static NAME = 'MODAL_INITIALIZED'; + + constructor({domNode, open, close} = {}) { + super(ModalInitializedEvent.NAME); + + this.domNode = domNode; + this.open = open; + this.close = close; + } +} + +export default ModalInitializedEvent; diff --git a/src/js/event-bus/Modal/ModalInitializedEventSubscriber.js b/src/js/event-bus/Modal/ModalInitializedEventSubscriber.js new file mode 100644 index 00000000..f261d19a --- /dev/null +++ b/src/js/event-bus/Modal/ModalInitializedEventSubscriber.js @@ -0,0 +1,29 @@ +/* + * This file is part of the Euskaltel project. + * + * Copyright (c) 2017 LIN3S + * + * For the full copyright and license information, please view the LICENSE + * file that was distributed with this source code. + * + * @author Mikel Tuesta + */ + +import {EventSubscriber} from 'lin3s-event-bus'; +import ModalInitializedEvent from './ModalInitializedEvent'; + +class ModalInitializedEventSubscriber extends EventSubscriber { + constructor(modalId, aCallback, aPriority) { + super(aCallback, aPriority); + + this.modalId = modalId; + } + + isSubscribedTo(anEvent) { + const event = new ModalInitializedEvent(); + + return anEvent.getName() === event.getName() && anEvent.domNode.id === this.modalId; + } +} + +export default ModalInitializedEventSubscriber; diff --git a/src/js/event-bus/Modal/subscriptions.js b/src/js/event-bus/Modal/subscriptions.js index 56e1ccf4..c487a913 100644 --- a/src/js/event-bus/Modal/subscriptions.js +++ b/src/js/event-bus/Modal/subscriptions.js @@ -10,10 +10,22 @@ * @author Ander Rodriguez */ -import {Priority, LifeTimeEventPublisher} from 'lin3s-event-bus'; +import {Priority, OneTimeEventPublisher, LifeTimeEventPublisher} from 'lin3s-event-bus'; import ModalStateChangedEventSubscriber from './ModalStateChangedEventSubscriber'; +import ModalInitializedEventSubscriber from './ModalInitializedEventSubscriber'; const + onInitialized = (modalId, onModalInitializedCallback, priority) => { + const modalInitializedEventSubscriber = new ModalInitializedEventSubscriber( + modalId, + onModalInitializedCallback, + new Priority(priority) + ); + + OneTimeEventPublisher.subscribe(modalInitializedEventSubscriber); + + return modalInitializedEventSubscriber; + }, onStateChanged = (onModalStateChangedCallback, priority) => { const modalStateChangedEventSubscriber = new ModalStateChangedEventSubscriber( onModalStateChangedCallback, @@ -26,5 +38,6 @@ const }; export { - onStateChanged + onStateChanged, + onInitialized, }; diff --git a/src/js/ui/vanilla/components/Modal/Modal.js b/src/js/ui/vanilla/components/Modal/Modal.js index c4ffb626..d961c512 100644 --- a/src/js/ui/vanilla/components/Modal/Modal.js +++ b/src/js/ui/vanilla/components/Modal/Modal.js @@ -9,8 +9,9 @@ * @author Mikel Tuesta */ -import {LifeTimeEventPublisher} from 'lin3s-event-bus'; +import {OneTimeEventPublisher, LifeTimeEventPublisher} from 'lin3s-event-bus'; import ModalStateChangedEvent from './../../../../event-bus/Modal/ModalStateChangedEvent'; +import ModalInitializedEvent from './../../../../event-bus/Modal/ModalInitializedEvent'; class Modal { @@ -37,6 +38,7 @@ class Modal { this.onKeyDown = this.onKeyDown.bind(this); this.bindListeners(); + this.publishModalInitializedEvent(); } bindListeners() { @@ -84,6 +86,14 @@ class Modal { state: this.state })); } + + publishModalInitializedEvent() { + OneTimeEventPublisher.publish(new ModalInitializedEvent({ + open: this.open.bind(this), + close: this.close.bind(this), + domNode: this.domNode, + })); + } } export default Modal; diff --git a/tests/app/app.js b/tests/app/app.js index eb2579d3..23649838 100644 --- a/tests/app/app.js +++ b/tests/app/app.js @@ -216,6 +216,14 @@ const scrollToWithMenuLinks = () => { }); }; +const testModalInitializedEvent = () => { + console.log('Testing EventBus.Modal.onInitialized'); + + EventBus.Modal.onInitialized('modal-test', modalInitializedEvent => { + console.log('modal has been initialized!', modalInitializedEvent.domNode); + }); +}; + const onReady = () => { testAsyncCancelablePromise(); testBrowserIsIE11(); @@ -225,6 +233,7 @@ const onReady = () => { testValidatory(); testCookies(); scrollToWithMenuLinks(); + testModalInitializedEvent(); }; addAsyncValidator();