Main.js
Is this file modifiable? β YES
Section titled βIs this file modifiable? β YESβWe use this file to instantiate our handlers and hook into our Core events (contentReplaced and willReplaceContent).
constructor()
Section titled βconstructor()βconstructor(payload) { super({ blazy: { enable: true, selector: "g--lazy-01", }, swup: { transition: { forceScrollTop: false, }, }, Manager: payload.Manager, boostify: payload.boostify, terraDebug: payload.terraDebug, libManager: payload.libManager, });
this.handler = { emitter: this.emitter, boostify: this.boostify, Manager: this.Manager, terraDebug: this.terraDebug, }; this.init(); this.events(); }We pass all needed information to our Core class using its super() method, including libraries we use from the start such as blazy or swup and create an object to help us pass all of our needed information into our handlers.
init() { // Loads Core init function super.init();
new MarqueeHandler({ ...this.handler, name: "MarqueeHandler" }); }Our init() method is in charge of instantiating our handlers.
Rest of the file
Section titled βRest of the fileβevents() { // Loads Core events function super.events(); }
contentReplaced() { super.contentReplaced();
this.emitter.emit("MitterContentReplaced"); }
willReplaceContent() { super.willReplaceContent();
this.emitter.emit("MitterWillReplaceContent"); }We have our events() and swup hooks coming from our master Core class and here we emit the events that can be heard from our handlers to perform actions on page transitions.
This is a simple file, but can grow. In its basic form, its purpose is to emit our lifecycle events for the rest of our application and to instantiate our handlers. Here we would perform any actions that needed to be hooked into our swup lifecycle at every transition.
Knowledge Check
Test your understanding of this section
Loading questions...