How do I use edge commons composition loader to load multiple compositions with a next and back button?

Question

I am working on an interactive book and have set up each page as a separate composition in edge.
I am using  the edge commons JS library to load multiple compositions into a main composition.
You can see how this works here: Edge Commons - Extension Library for Edge Animate and Edge Reflow | EdgeDocks.com
The way the edge commons tutorial is set up requires a button for each composition i want to load. I am interested in loading multiple compositions with a "next" and "back" button, and a "swipe left, "swipe right" gesture on the content symbol that each composition is loaded into. I also need the swipe features on the content symbol not to interfere with the interactive elements on the loaded composition.
Please suggest a solution that will work without adding additional scripts beyond edge commons and jquery.

Answer 1

Sort of. I'm using this code inside an action for a button symbol. But it doesn't work perfectly. Trying to debug it.
Let me know if you have any luck.
//Check to see if pageCounter already exists
if (typeof EC.pageCounter === 'undefined') {
  // it doesn't exist so initialize it to first page
    EC.pageCounter = 2;
//check if the page is only 1 digit -- patch for single digit
if (EC.pageCounter < 9) {
   // it is, so we need to pad a 0 on the front.
  EC.pageCounterString = "0" + EC.pageCounter;
  //e.g.  01 ...09,11,12,13....115,222352,,....
else {
  EC.pageCounterString = EC.pageCounter;
EC.loadComposition(EC.pageCounterString + "/publish/web/" + EC.pageCounterString + ".html", sym.$("container"));
EC.pageCounter = EC.pageCounter + 1;
//TODO for back  -1