Creating a Theme

To create your own theme, you just have to follow these steps:

• create a directory with the name of your theme in the "_theme" directory;
• inside your theme directory, create a manifest.json file;
• create all your scripts and styles inside this directory;

Your manifest.json file must look like this:

{
    "name": "default",
    "dependencies": {
        "css": [
            "styles/default.css"
        ],
        "js": [
            "scripts/default.js"
        ]
    }
}

All the dependences will be automatically loaded by PowerPolygin, and once they are all loaded, the event onthemeloaded will be triggered.

You can use the basic class PowerPolygon adds to the slides:

• .ppw-slide-element: Every slide in the page
• .ppw-active-slide-element: the current slide
• .ppw-previous-slide-element: the previous slide(right before the current slide)
• .ppw-next-slide-element: the next slide(right after the current slide)
• .ppw-clickable or .ppw-focusable: Elements that can be clicked or focused
• .ppw-fullscreen: added to the body element when in fullscreen
• .ppw-slide-not-in-profile: All the slides that will not be shown because they are not set to the current profile
• .ppw-slide-type-opening: The slides with type=opening
• .ppw-slide-type-content: The slides with type=content
• .ppw-slide-type-section: The slides with type=section
• .ppw-slide-type-title: The slides with type=title
• .ppw-slide-type-closing: The slides with type=closing
• .ppw-slide-type-CUSTOM-NAME: The slides with a custom type
• .animated: every item that is animated via CSS3
• .ppw-anim-ANIMATION-NAME: elements that have just been animated via PPW.animate method

You can Add listeners to PowerPolygon at any time by using the addListener API method. PPW.addListener('event', callback);

The list of currently supported events can be found here.