catworks-swapper

A simple JS package to create swappable parts of a webpage. Extremely lightweight.


Keywords
javascript, lightweight, node-module, xmlhttprequest
License
GPL-3.0
Install
npm install catworks-swapper@0.2.0

Documentation

Catworks Swapper

A simple JS package to create swappable parts of a webpage. Extremely lightweight. If you're a proffesional JS developer, maybe skip this one, it's undoubetly amateurish, maybe use React?

Setting up

Firstly , import the Swapper class.

import Swapper from 'catworks-swapper'

Then create the element, like you would. You'll have to bind it to a DOM element, so:

<html>
    <head>...</head>
    <body>
        <main id="root"></main>
    </body>
</html>
var swapper = new Swapper('./path/to/html/files/', '#root')

As you can see swapper expects your html files to be present in a single folder.
For instance

root/
    node_modules/
    pages/
        home.html
        about.html
    package.json
    index.html

Now setting your htmlPath to './pages/', you can swap to either home or about by using the swap method, namely:

swapper.swap('home')

If you wish you can also provide a callback to swap, which fires if the swap was succesful.

swapper.swap('home', () => { /* do something */ })

That's all for now folks!