Locus objects have an optional componentId property.

src/book.js

@@ -53,15 +53,15 @@ Carlyle.Book = function (dataSource) {
   //  - position: string, one of "start" or "end", moves to corresponding point
   //      in the given component
   //
-  // The `componentId` is optional -- if it is not provided (or it is invalid),
-  // we default to the currently active component, and if that doesn't exist,
-  // we default to the very first component.
+  // The locus object can also specify a componentId. If it is not provided
+  // (or it is invalid), we default to the currently active component, and
+  // if that doesn't exist, we default to the very first component.
   //
-  function changePage(node, locus, componentId) {
+  function changePage(node, locus) {
     // Find the place of the node in the book, or create one.
     var place = placeFor(node) || setPlaceFor(node, componentAt(0), 1);
 
-    var cIndex = p.componentIds.indexOf(componentId);
+    var cIndex = p.componentIds.indexOf(locus.componentId);
     var component;
     if (cIndex == -1) {
       component = place.properties.component;
@@ -121,13 +121,19 @@ Carlyle.Book = function (dataSource) {
       // Moving to next component.
       pageN -= component.lastPageNumber();
       component = componentAt(cIndex + 1);
-      return changePage(node, { page: pageN }, component.properties.id);
+      return changePage(
+        node,
+        { page: pageN, componentId: component.properties.id }
+      );
     } else if (pageN < 1) {
       // Moving to previous component.
       component = componentAt(cIndex - 1);
       component.updateDimensions(node); // FIXME: no going back
       pageN += component.lastPageNumber();
-      return changePage(node, { page: pageN }, component.properties.id);
+      return changePage(
+        node,
+        { page: pageN, componentId: component.properties.id }
+      );
     }
 
     // Do it.

src/flippers/instant.js

@@ -48,14 +48,14 @@ Carlyle.Flippers.Instant = function (reader, setPageFn) {
   }
 
 
-  function moveTo(locus, componentId) {
+  function moveTo(locus) {
     var spCallback = function (offset) {
       p.page.scrollerDiv.scrollLeft = offset;
       // FIXME: a hack for webkit rendering artefacts.
       var x = Math.random() / 1000 + 1.0;
       p.page.scrollerDiv.style.webkitTransform = "scale(" + x + ")";
     }
-    return p.setPageFn(p.page, locus, componentId, spCallback);
+    return p.setPageFn(p.page, locus, spCallback);
   }
 
 

src/flippers/legacy.js

@@ -36,8 +36,8 @@ Carlyle.Flippers.Legacy = function (reader, setPageFn) {
   }
 
 
-  function moveTo(locus, componentId) {
-    return p.setPageFn(p.page, locus, componentId);
+  function moveTo(locus) {
+    return p.setPageFn(p.page, locus);
   }
 
 

src/flippers/slider.js

@@ -78,18 +78,18 @@ Carlyle.Flippers.Slider = function (reader, setPageFn) {
   }
 
 
-  function moveTo(locus, componentId) {
-    setPage(upperPage(), locus, componentId);
+  function moveTo(locus) {
+    setPage(upperPage(), locus);
     completedTurn();
   }
 
 
-  function setPage(pageDiv, locus, componentId, callback) {
+  function setPage(pageDiv, locus, callback) {
     var spCallback = function (offset) {
       pageDiv.scrollerDiv.scrollLeft = offset;
       setX(pageDiv.scrollerDiv, 0, { duration: 0 }, callback);
     }
-    return p.setPageFn(pageDiv, locus, componentId, spCallback);
+    return p.setPageFn(pageDiv, locus, spCallback);
   }
 
 
@@ -168,8 +168,7 @@ Carlyle.Flippers.Slider = function (reader, setPageFn) {
       var place = getPlace();
       var pageSetSuccessfully = setPage(
         lowerPage(),
-        { page: place.pageNumber() - 1 },
-        place.componentId(),
+        place.getLocus({ offset: -1 }),
         function () {
           p.turnData.direction = k.BACKWARDS;
           deferredCall(function() {
@@ -276,17 +275,15 @@ Carlyle.Flippers.Slider = function (reader, setPageFn) {
     if (
       !setPage(
         lowerPage(),
-        { page: place.pageNumber() + 1 },
-        place.componentId(),
+        place.getLocus({ offset: 1 }),
         function () {
           jumpIn(resetTurn);
         }
       )
     ) {
       setPage(
         lowerPage(),
-        { page: place.pageNumber() + 1 },
-        place.componentId(),
+        place.getLocus(),
         function () {
           jumpIn(resetTurn);
         }

src/place.js

@@ -69,6 +69,19 @@ Carlyle.Place = function () {
   }
 
 
+  function getLocus(options) {
+    options = options || {};
+    var locus = {
+      page: pageNumber(),
+      componentId: componentId()
+    }
+    if (options.offset) {
+      locus.page += options.offset;
+    }
+    return locus;
+  }
+
+
   API.setPlace = setPlace;
   API.setPercentageThrough = setPercentageThrough;
   API.componentId = componentId;
@@ -77,6 +90,7 @@ Carlyle.Place = function () {
   API.pageNumber = pageNumber;
   API.chapterInfo = chapterInfo;
   API.chapterTitle = chapterTitle;
+  API.getLocus = getLocus;
 
   return API;
 }

src/reader.js

@@ -241,7 +241,7 @@ Carlyle.Reader = function (node, bookData) {
       }
     }
 
-    p.flipper.moveTo({ page: pageN }, componentId);
+    p.flipper.moveTo({ page: pageN, componentId: componentId});
   }
 
 
@@ -262,7 +262,7 @@ Carlyle.Reader = function (node, bookData) {
       }
     }
 
-    p.flipper.moveTo({ percent: percent }, componentId);
+    p.flipper.moveTo({ percent: percent, componentId: componentId});
   }
 
 
@@ -272,7 +272,7 @@ Carlyle.Reader = function (node, bookData) {
     console.log("Skipping to chapter: " + src);
     //FIXME: SHOULD BE ACTIVE PAGE?
     var place = p.book.placeOfChapter(p.divs.pages[0].contentDiv, src);
-    p.flipper.moveTo({ page: place.pageNumber() }, place.componentId());
+    p.flipper.moveTo(place.getLocus());
   }
 
 
@@ -282,15 +282,15 @@ Carlyle.Reader = function (node, bookData) {
   // This method is handed over to the flipper, which calls it with a
   // callback to do the actual display change.
   //
-  function setPage(pageDiv, locus, componentId, callback) {
-    var eData = { page: pageDiv, locus: locus, componentId: componentId }
+  function setPage(pageDiv, locus, callback) {
+    var eData = { page: pageDiv, locus: locus }
 
     // Other things may disallow page change.
     if (!dispatchEvent('carlyle:pagechanging', eData)) {
       return;
     }
 
-    var rslt = p.book.changePage(pageDiv.contentDiv, locus, componentId);
+    var rslt = p.book.changePage(pageDiv.contentDiv, locus);
 
     // The book may disallow changing to the given page.
     if (!rslt) {

test/velveteen/index.html

@@ -17,7 +17,7 @@
     <script type="text/javascript" src="../../src/component.js"></script>
     <script type="text/javascript" src="../../src/place.js"></script>
     <script type="text/javascript" src="../../src/styles.js"></script>
-    <script type="text/javascript" src="../../src/flippers/standard.js"></script>
+    <script type="text/javascript" src="../../src/flippers/slider.js"></script>
     <script type="text/javascript" src="../../src/controls/scrubber.js"></script>
 
     <style type="text/css">