diff --git a/.eslintrc b/.eslintrc
index b3caa59e110484e128762039cca9c1c5c0645099..f52b6ba28717d20a3245f10dd011f167f9f1fea9 100644
--- a/.eslintrc
+++ b/.eslintrc
@@ -26,6 +26,7 @@
     "sort-keys": ["error", "asc", {
       "caseSensitive": false,
       "natural": false
-    }]
+    }],
+    "no-underscore-dangle": "off",
   }
 }
diff --git a/__tests__/src/lib/CanvasGroupings.test.js b/__tests__/src/lib/CanvasGroupings.test.js
index 1f222d299a75fe337e4315ac703eca70461ba370..8e3a00c0e2e1452bc130ce71330587139993b22f 100644
--- a/__tests__/src/lib/CanvasGroupings.test.js
+++ b/__tests__/src/lib/CanvasGroupings.test.js
@@ -48,10 +48,21 @@ describe('CanvasGroupings', () => {
       beforeEach(() => {
         subject = new CanvasGroupings([0, 1, 2, 3], 'book');
       });
-      it('selects by index / 2', () => {
+      it('selects by index', () => {
         expect(subject.getCanvases(2)).toEqual([1, 2]);
       });
     });
+    describe('book with facing pages', () => {
+      let subject;
+      beforeEach(() => {
+        subject = new CanvasGroupings([0, 1, { getViewingHint: () => 'facing-pages', id: 2 }, 3], 'book');
+      });
+      it('selects by index', () => {
+        expect(subject.getCanvases(1)).toEqual([1]);
+        expect(subject.getCanvases(2)[0].id).toEqual(2);
+        expect(subject.getCanvases(3)).toEqual([3]);
+      });
+    });
     describe('gallery', () => {
       it('selects by index', () => {
         const subject = new CanvasGroupings([0, 1, 2, 3]);
diff --git a/src/lib/CanvasGroupings.js b/src/lib/CanvasGroupings.js
index ab348f30740da53a7985fb45b9873373b3713a82..677a8291420e1d6656a7c4df9ef156fa8387ab0c 100644
--- a/src/lib/CanvasGroupings.js
+++ b/src/lib/CanvasGroupings.js
@@ -7,15 +7,18 @@ export default class CanvasGroupings {
   constructor(canvases, viewType = 'single') {
     this.canvases = canvases;
     this.viewType = viewType;
-    this._groupings = null; // eslint-disable-line no-underscore-dangle
+    this._groupings = null;
+    this._canvasGroupingMap = null;
   }
 
   /**
    */
   getCanvases(index) {
     switch (this.viewType) {
+      case 'scroll':
+        return this.groupings()[0];
       case 'book':
-        return this.groupings()[Math.ceil(index / 2)];
+        return this.groupings()[this._canvasGroupingMap[index]];
       default:
         return this.groupings()[index];
     }
@@ -26,27 +29,55 @@ export default class CanvasGroupings {
    * of canvases, while book view creates pairs.
    */
   groupings() {
-    if (this._groupings) { // eslint-disable-line no-underscore-dangle
-      return this._groupings; // eslint-disable-line no-underscore-dangle
+    if (this._groupings) {
+      return this._groupings;
     }
     if (this.viewType !== 'book') {
       return this.canvases.map(canvas => [canvas]);
     }
     const groupings = [];
+    const canvasGroupingMap = [];
+    let groupIndex = 0;
     this.canvases.forEach((canvas, i) => {
+      if (!groupings[groupIndex]) {
+        groupings[groupIndex] = [];
+      }
+
+      canvasGroupingMap[i] = groupIndex;
+
       if (i === 0) {
-        groupings.push([canvas]);
+        canvasGroupingMap[i] = groupIndex;
+        groupings[groupIndex].push(canvas);
+        groupIndex += 1;
         return;
       }
-      // Odd page
-      if (i % 2 !== 0) {
-        groupings.push([canvas]);
-      } else {
-        // Even page
-        groupings[Math.ceil(i / 2)].push(canvas);
+
+      const hint = canvas && (
+        (canvas.getBehavior && canvas.getBehavior())
+        || (canvas.getViewingHint && canvas.getViewingHint())
+      );
+
+      if (hint === 'facing-pages' || hint === 'non-paged') {
+        if (groupings[groupIndex].length > 0) {
+          groupIndex += 1;
+          canvasGroupingMap[i] = groupIndex;
+        }
+
+        groupings[groupIndex] = [canvas];
+        groupIndex += 1;
+        return;
+      }
+
+      if (groupings[groupIndex].length < 2) {
+        groupings[groupIndex].push(canvas);
+      }
+
+      if (groupings[groupIndex].length === 2) {
+        groupIndex += 1;
       }
     });
-    this._groupings = groupings; // eslint-disable-line no-underscore-dangle
+    this._groupings = groupings;
+    this._canvasGroupingMap = canvasGroupingMap;
     return groupings;
   }
 }