readme

# Swift Swap - JavaScript Dynamic Reload Library by ChristopherNathaniel 
(christophernathaniel.co.uk / creativenebula.co.uk)


## Typical App.js / Index.js file

import './App.scss';

import { DynamicPage } from 'swift-swap/src/PageFlow.js';
import EventListenerManager from './js/libraries/EventListenerManager';
const eventManagerListener = new EventListenerManager(); // Replace with EventListener if Library is not  used
const state = {}


 
document.querySelector('.theme-toggle').addEventListener('click', () => document.body.classList.toggle('dark-theme'));
// Components to Render on each page load. Add RenderComponent functions to the Module Classes here.
// Each time the page is loaded these functions are called
let renderList = [() => {
    eventManagerListener.removeAll();

    // Example make all A Links Dynamic (No Reload). This behaviour is customisable
    document.querySelectorAll('a').forEach(link => {
        eventManagerListener.add(link, 'click', (event) => {
            if(event.target.href.includes(window.location.origin) 
                && !event.target.href.includes('#')) {
                event.preventDefault();

                document.body.classList.add('page-transition');
                window.scrollTo({ top: 0, behavior: 'instant'});
            
                setTimeout(() => {
                    window.history.pushState({}, '', link.href);
                    dynamicPage._makeRequest(link.href); // Make Request and Render
                }, 1000);

                setTimeout(() => document.body.classList.remove('page-transition'), 1200);
            }
        });
    });  
}];

renderList = [...renderList, moduleName({ val: state, parent: '.organism-00 .function' }).RenderComponent]; // Rendering a Module

// Define DynamicPage // Source = The HTML element to grab (OuterHTML) // target = The Placement
// DynamicPage needs to load after any specified data - should technically be the last Function loaded
const dynamicPage = new DynamicPage({source: 'DynamicPage', target: 'App'}, renderList, true);
dynamicPage._makeRequest(window.location.href); // Make Request and Render index.html to the page