nativescript-globalevents1.2.2 • Public • Published
A NativeScript plugin to deal with Global events
This is released under the MIT License, meaning you are free to include this in any type of program -- However for entities that need support or a support contract, changes, enhancements and/or a commercial license please contact me at http://nativescript.tools.
I also do contract work; so if you have a module you want built for NativeScript (or any other software projects) feel free to contact me email@example.com.
tns plugin add nativescript-globalevents
To use the module you just
Notice: You do NOT need to keep a reference to it; and you only need to load it once.
It will automatically attach its methods to all the proper classes in the NativeScript library making it act as if they are built in.
What this does is automatically add support to allow you to setup events on all the page events globally. For example; if you need a pageLoaded event to occur on every page; you can use this library to get a global pageLoaded event.
Events currently on the Page globally that are supported are:
All these events list above run AFTER the normal page's equivalent event. So the Page's navigatingTo will run before the Global navigatingTo event.
- Page.createdPageEvent = When a new Page is created.
- Page.loadedFirst = Runs before the page's load
- Page.unloadedFirst = Runs before the page's unload
- Page.navigatingToFirst = Runs before the page's navigatingTo
- Page.navigatingFromFirst = Runs before the page's navigatingFrom
These First events will run BEFORE the normal page's equivalent event. Please note; parts of the page MAY not be setup at this point in time, so be warned!
So basically the events goes:
- Page Created Event - Global Navigating to FIRST - Page.OnNavigatingTo - Global Navigating to - Global Page Loaded FIRST - Page.onLoaded - Global Page Loaded - Global Navigated to FIRST! - Page.OnNavigatedTo - Global Navigated to
If you have any other global events you would like supported please open an issue on the github issue tracker and I will investigate its relevance.
You ask, how exactly does this help?
Well, my usage is I have several plugins that need to be notified when a new page is loaded/unloaded to allow custom handling to occur automatically. It could be useful for your own app if you need to do something globally when every page is loaded or unloaded.
; // need only once in the application totalvar Page = Page;Page;
Why use this?
If you need to track globally an event and you don't want to put a handler in each separate page.xml/page.js file.
Commands and functions
Static Page class now has four new STATIC functions
Page.on / Page.addEventHandler (eventName, callback[, thisArg])
Page.off / Page.removeEventHandler (eventName[[, callback], thisArg])
If thisArg is null/undefined it will use the current page's "this".
If callback is null on the off/removePageHandler it will remove ALL handlers.
Angular and VueJS support
Angular and VueJS has their own event systems, however both of them create a underlying NativeScript page(s) to do things. So in those cases you can use these events to actually tie in before the Angular or Vue framework events occur. This is probably rarely needed; but it is a option if you find you need it.
Do to the fact that the nativescript-angular plugin actually gets a reference to the "Page" variable, you have two choice for using this in Angular
- You put the require('nativescript-globalevents') as the VERY first statement of the
- You put it anywhere BUT, the pageCreated event will never be called, as is to late to monkey patch the creation part of the class after Angular has got a reference.
app.module.ts has an example of how to tie into the events in Angular.