Getting Started
The Flipbook JavaScript API allows you to interact with flipbooks, executing commands and subscribing to events.
The Flipbook JavaScript API makes it easy to execute commands in flipbooks as well as listen/subscribe to events happening inside these. The JS API is available both for embedded flipbooks as well as directly in the flipbook viewer through custom scripting.
Below are some guides to get you set up and ready to start exploring the possibilities of the JS API.
In order to use the JS API you must include the API script on your page. The API script can be seen below:
<script src='https://cdn.ipaper.io/flipbooks/api/v3/latest.js'></script>
Once you have included this script on your page, you will need to instantiate a new instance of the API. When doing so you specify an iframe to target (your embedded flipbook) as well as an API version to use (version 3 is the latest and only version currently available):
<script>
const iframe = document.getElementById('myFlipbook');
const instance = iPaperJsApi(iframe, 3);
</script>
Once this has been done, you're ready to start using the JS API. You can explore the available commands and events here. You will be able to call/use these on the instance you set up above (i.e.
instance.[Category Name].[Command/Event name]).When using the JS API with embedded flipbooks, it is possible to have multiple flipbooks where each of them has their own API instance set up. Please refer to this page on an example of this usage.
Using the JS API through the Flipbook Custom Scripting module is simple. The API script is already included in the flipbook viewer, so all you need to do is add a script that instantiates a new instance of the API. When doing so you will need to specify a version to use (version 3 is the latest and only version currently available):
<script>
const instance = iPaperJsApi(3);
</script>
Once this has been done, you're ready to start using the JS API. You can explore the available commands and events here. You will be able to call/use these on the instance you set up above (i.e.
instance.[Category Name].[Command/Event name]).