pageflow 0.9.2 → 0.10.0

data/app/assets/javascripts/pageflow/entry_data.js

@@ -7,29 +7,63 @@ pageflow.EntryData = pageflow.Object.extend({
     throw 'Not implemented';
   },
 
+  getPagePosition: function(permaId) {
+    throw 'Not implemented';
+  },
+
   getChapterConfiguration: function(id) {
     throw 'Not implemented';
   },
 
+  getStorylineConfiguration: function(id) {
+    throw 'Not implemented';
+  },
+
   getChapterIdByPagePermaId: function(permaId) {
     throw 'Not implemented';
   },
 
+  getStorylineIdByChapterId: function(permaId) {
+    throw 'Not implemented';
+  },
+
   getChapterPagePermaIds: function(id) {
     throw 'Not implemented';
   },
 
   getParentPagePermaIdByPagePermaId: function(permaId) {
+    var storylineId = this.getStorylineIdByPagePermaId(permaId);
+    return this.getParentPagePermaId(storylineId);
+  },
+
+  getStorylineIdByPagePermaId: function(permaId) {
     var chapterId = this.getChapterIdByPagePermaId(permaId);
-    return this.getParentPagePermaId(chapterId);
+    return this.getStorylineIdByChapterId(chapterId);
+  },
+
+  getParentStorylineId: function(storylineId) {
+    var parentPagePermaId = this.getParentPagePermaId(storylineId);
+    return parentPagePermaId && this.getStorylineIdByPagePermaId(parentPagePermaId);
   },
 
   getParentChapterId: function(chapterId) {
-    var pagePermaId = this.getParentPagePermaId(chapterId);
+    var storylineId = this.getStorylineIdByChapterId(chapterId);
+    var pagePermaId = this.getParentPagePermaId(storylineId);
     return pagePermaId && this.getChapterIdByPagePermaId(pagePermaId);
   },
 
-  getParentPagePermaId: function(chapterId) {
-    return this.getChapterConfiguration(chapterId).parent_page_perma_id;
+  getParentPagePermaId: function(storylineId) {
+    return this.getStorylineConfiguration(storylineId).parent_page_perma_id;
+  },
+
+  getStorylineLevel: function(storylineId) {
+    var parentStorylineId = this.getParentStorylineId(storylineId);
+
+    if (parentStorylineId) {
+      return this.getStorylineLevel(parentStorylineId) + 1;
+    }
+    else {
+      return 0;
+    }
   }
 });

data/app/assets/javascripts/pageflow/highlighted_page.js

@@ -4,10 +4,10 @@ pageflow.HighlightedPage = pageflow.Object.extend({
   },
 
   getPagePermaId: function(currentPagePermaId) {
-    var chapterId = this.entry.getChapterIdByPagePermaId(currentPagePermaId);
+    var storylineId = this.entry.getStorylineIdByPagePermaId(currentPagePermaId);
 
-    if (this.getNavigationBarMode(chapterId) === 'inherit_from_parent') {
-      var parentPagePermaId = this.entry.getParentPagePermaId(chapterId);
+    if (this.getNavigationBarMode(storylineId) === 'inherit_from_parent') {
+      var parentPagePermaId = this.entry.getParentPagePermaId(storylineId);
 
       return parentPagePermaId &&
         this.getPagePermaId(parentPagePermaId);
@@ -27,8 +27,8 @@ pageflow.HighlightedPage = pageflow.Object.extend({
     return this.entry.getPageConfiguration(permaId).display_in_navigation !== false;
   },
 
-  getNavigationBarMode: function(chapterId) {
-    return this.entry.getChapterConfiguration(chapterId).navigation_bar_mode;
+  getNavigationBarMode: function(storylineId) {
+    return this.entry.getStorylineConfiguration(storylineId).navigation_bar_mode;
   },
 
   getChapterPagesUntil: function(pagePermaId) {

data/app/assets/javascripts/pageflow/history.js

@@ -46,7 +46,7 @@ pageflow.History.create = function(slideshow, options) {
 
   var adapter;
 
-  if (options.simulate || !pageflow.browser.has('hashchange support')) {
+  if (options.simulate) {
     adapter = new pageflow.History.SimulatedAdapter();
   }
   else if (pageflow.browser.has('pushstate support')) {

data/app/assets/javascripts/pageflow/native_scrolling.js

@@ -0,0 +1,14 @@
+pageflow.nativeScrolling = {
+  preventScrollBouncing: function(slideshow) {
+    slideshow.on('touchmove', function (e) {
+      e.preventDefault();
+    });
+  },
+
+  preventScrollingOnEmbed: function(slideshow) {
+    slideshow.on('wheel mousewheel DOMMouseScroll', function(e) {
+      e.stopPropagation();
+      e.preventDefault();
+    });
+  }
+};

data/app/assets/javascripts/pageflow/page_transitions.js

@@ -24,4 +24,6 @@ pageflow.pageTransitions.register('fade_to_black', {duration: 2100});
 pageflow.pageTransitions.register('cut', {duration: 1100});
 pageflow.pageTransitions.register('scroll', {duration: 1100});
 pageflow.pageTransitions.register('scroll_right', {duration: 1100});
-pageflow.pageTransitions.register('scroll_left', {duration: 1100});
+pageflow.pageTransitions.register('scroll_left', {duration: 1100});
+pageflow.pageTransitions.register('scroll_over_from_right', {duration: 1100});
+pageflow.pageTransitions.register('scroll_over_from_left', {duration: 1100});

data/app/assets/javascripts/pageflow/page_type.js

@@ -14,6 +14,8 @@ pageflow.pageType = (function() {
     deactivating: function(pageElement, configuarion) {},
     deactivated: function(pageElement, configuarion) {},
     update: function(pageElement, configuarion) {},
+    cleanup: function(pageElement, configuarion) {},
+
     embeddedEditorViews: function() {},
 
     linkedPages: function() {

data/app/assets/javascripts/pageflow/ready.js

@@ -1,11 +1,13 @@
 pageflow.ready = new $.Deferred(function(readyDeferred) {
   window.onload = function() {
     pageflow.browser.detectFeatures().then(function() {
+      var slideshow = $('[data-role=slideshow]');
+
       $('body').one('pagepreloaded', function() {
         readyDeferred.resolve();
       });
 
-      $('[data-role=slideshow]').each(function() {
+      slideshow.each(function() {
         pageflow.entryData = new pageflow.SeedEntryData(
           pageflow.seed
         );
@@ -30,6 +32,7 @@ pageflow.ready = new $.Deferred(function(readyDeferred) {
       });
 
       pageflow.links.setup();
+      pageflow.nativeScrolling.preventScrollingOnEmbed(slideshow);
     });
   };
 }).promise();

data/app/assets/javascripts/pageflow/seed_entry_data.js

@@ -2,7 +2,17 @@ pageflow.SeedEntryData = pageflow.EntryData.extend({
   initialize: function(options) {
     this.theming = options.theming;
 
-    this.chapterConfigurations = options.chapter_configurations;
+    this.storylineConfigurations = options.storyline_configurations;
+
+    this.storylineIdsByChapterIds = _(options.chapters).reduce(function(memo, chapter) {
+      memo[chapter.id] = chapter.storyline_id;
+      return memo;
+    }, {});
+
+    this.chapterConfigurations = _.reduce(options.chapters, function(memo, chapter) {
+      memo[chapter.id] = chapter.configuration;
+      return memo;
+    }, {});
 
     this.chapterPagePermaIds = _(options.pages).reduce(function(memo, page) {
       memo[page.chapter_id] = memo[page.chapter_id] || [];
@@ -19,6 +29,11 @@ pageflow.SeedEntryData = pageflow.EntryData.extend({
       memo[page.perma_id] = page.configuration;
       return memo;
     }, {});
+
+    this.pagePositions = _.reduce(options.pages, function(memo, page, index) {
+      memo[page.perma_id] = index;
+      return memo;
+    }, {});
   },
 
   getThemingOption: function(name) {
@@ -37,7 +52,19 @@ pageflow.SeedEntryData = pageflow.EntryData.extend({
     return this.pageConfigurations[permaId] || {};
   },
 
+  getPagePosition: function(permaId) {
+    return this.pagePositions[permaId];
+  },
+
   getChapterIdByPagePermaId: function(permaId) {
     return this.chapterIdsByPagePermaIds[permaId];
+  },
+
+  getStorylineConfiguration: function(id) {
+    return this.storylineConfigurations[id] || {};
+  },
+
+  getStorylineIdByChapterId: function(id) {
+    return this.storylineIdsByChapterIds[id];
   }
 });

data/app/assets/javascripts/pageflow/slideshow.js

@@ -63,11 +63,11 @@ pageflow.Slideshow = function($el, configurations) {
   };
 
   this.back = function() {
-    this.scrollNavigator.back(currentPage);
+    this.scrollNavigator.back(currentPage, pages);
   };
 
   this.next = function() {
-    this.scrollNavigator.next(currentPage);
+    this.scrollNavigator.next(currentPage, pages);
   };
 
   this.parentPageExists = function() {
@@ -97,17 +97,21 @@ pageflow.Slideshow = function($el, configurations) {
         currentPage = page;
         currentPageIndex = currentPage.index();
 
-        var direction = this.scrollNavigator.getTransitionDirection(previousPage, currentPage, options);
+        var transition = options.transition ||
+          this.scrollNavigator.getDefaultTransition(previousPage, currentPage, pages);
+
+        var direction =
+          this.scrollNavigator.getTransitionDirection(previousPage, currentPage, options);
 
         var outDuration = previousPage.page('deactivate', {
           direction: direction,
-          transition: options.transition
+          transition: transition
         });
 
         var inDuration = currentPage.page('activate', {
           direction: direction,
           position: options.position,
-          transition: options.transition
+          transition: transition
         });
 
         preload.start(currentPage);
@@ -190,8 +194,7 @@ pageflow.Slideshow = function($el, configurations) {
 
   $(window).on('resize', this.triggerResizeHooks);
 
-  // prevent page from bouncing in modern browsers
-  $(document).on('touchmove', function (e) { e.preventDefault(); });
+  pageflow.nativeScrolling.preventScrollBouncing($el);
 
   $el.addClass('slideshow');
 
@@ -202,7 +205,7 @@ pageflow.Slideshow = function($el, configurations) {
 
   $el.find('.scroll_indicator').scrollIndicator({parent: this});
 
-  this.scrollNavigator = new pageflow.DomOrderScrollNavigator(this);
+  this.scrollNavigator = new pageflow.DomOrderScrollNavigator(this, pageflow.entryData);
   this.preparer = pageflow.AdjacentPreparer.create(function() { return pages; }, this.scrollNavigator).attach(pageflow.events);
 };
 

data/app/assets/javascripts/pageflow/slideshow/dom_order_scroll_navigator.js

@@ -1,29 +1,114 @@
-pageflow.DomOrderScrollNavigator = function(slideshow) {
+pageflow.DomOrderScrollNavigator = function(slideshow, entryData) {
   this.getLandingPage = function(pages) {
     return pages.first();
   };
 
-  this.back = function(currentPage) {
-    slideshow.goTo(currentPage.prev('.page'), {position: 'bottom'});
+  this.back = function(currentPage, pages) {
+    var position = 'bottom';
+    var previousPage = this.getPreviousPage(currentPage, pages);
+
+    if (previousPage.is(getParentPage(currentPage, pages))) {
+      position = null;
+    }
+
+    slideshow.goTo(previousPage, {
+      position: position
+    });
   };
 
-  this.next = function(currentPage) {
-    slideshow.goTo(currentPage.next('.page'));
+  this.next = function(currentPage, pages) {
+    slideshow.goTo(this.getNextPage(currentPage, pages));
   };
 
   this.nextPageExists = function(currentPage, pages) {
-    return !currentPage.is(pages.last());
+    return !!this.getNextPage(currentPage, pages).length;
   };
 
   this.previousPageExists = function(currentPage, pages) {
-    return !currentPage.is(pages.first());
+    return !!this.getPreviousPage(currentPage, pages).length;
   };
 
   this.getNextPage = function(currentPage, pages) {
-    return currentPage.next('.page');
+    var nextPage = currentPage.next('.page');
+
+    if (sameStoryline(currentPage, nextPage)) {
+      return nextPage;
+    }
+
+    var scrollSuccessor = getScrollSuccessor(currentPage, pages);
+
+    if (scrollSuccessor.length) {
+      return scrollSuccessor;
+    }
+
+    return getParentPage(currentPage, pages);
+  };
+
+  this.getPreviousPage = function(currentPage, pages) {
+    var previousPage =  currentPage.prev('.page');
+
+    if (sameStoryline(currentPage, previousPage)) {
+      return previousPage;
+    }
+
+    return getParentPage(currentPage, pages);
   };
 
   this.getTransitionDirection = function(previousPage, currentPage, options) {
     return (currentPage.index() > previousPage.index() ? 'forwards' : 'backwards');
   };
+
+  this.getDefaultTransition = function(previousPage, currentPage, pages) {
+    if (inParentStorylineOf(currentPage, previousPage, pages)) {
+      return getStorylinePageTransition(currentPage);
+    }
+    else if (inParentStorylineOf(previousPage, currentPage, pages)) {
+      return getStorylinePageTransition(previousPage);
+    }
+  };
+
+  function inParentStorylineOf(page, otherPage, pages) {
+    var parentPage = getParentPage(page, pages);
+
+    return entryData.getStorylineIdByPagePermaId(parentPage.page('getPermaId')) ==
+      entryData.getStorylineIdByPagePermaId(otherPage.page('getPermaId'));
+  }
+
+  function sameStoryline(page1, page2) {
+    return entryData.getStorylineIdByPagePermaId(page1.page('getPermaId')) ==
+      entryData.getStorylineIdByPagePermaId(page2.page('getPermaId'));
+  }
+
+  function getParentPage(page, pages) {
+    var storylineConfiguration = getStorylineConfiguration(page);
+
+    if ('parent_page_perma_id' in storylineConfiguration &&
+        entryData.getThemingOption('change_to_parent_page_at_storyline_boundary')) {
+
+      return pages.filter('#' + storylineConfiguration.parent_page_perma_id);
+    }
+
+    return $();
+  }
+
+  function getStorylinePageTransition(page) {
+    var storylineConfiguration = getStorylineConfiguration(page);
+    return storylineConfiguration.page_transition || 'scroll_over_from_right';
+  }
+
+  function getScrollSuccessor(page, pages) {
+    var storylineConfiguration = getStorylineConfiguration(page);
+
+    if ('scroll_successor_id' in storylineConfiguration) {
+      return pages.filter('#' + storylineConfiguration.scroll_successor_id);
+    }
+
+    return $();
+  }
+
+  function getStorylineConfiguration(page) {
+    var permaId = page.page('getPermaId');
+    var storylineId = entryData.getStorylineIdByPagePermaId(permaId);
+    return entryData.getStorylineConfiguration(storylineId);
+  }
 };

data/app/assets/javascripts/pageflow/slideshow/hidden_text_indicator_widget.js

@@ -6,10 +6,12 @@
 
       parent.on('pageactivate', function(event) {
         that.element.toggleClass('invert', $(event.target).hasClass('invert'));
-        that.element.toggleClass('hidden', $(event.target).hasClass('hide_content_with_text'));
+        that.element.toggleClass('hidden',
+                                 $(event.target).hasClass('hide_content_with_text') ||
+                                 $(event.target).hasClass('no_hidden_text_indicator'));
       });
 
-      parent.on('hidetextactivate', function(event) {
+      parent.on('hidetextactivate', function() {
         that.element.addClass('visible');
       });
 
@@ -18,4 +20,4 @@
       });
     }
   });
-}(jQuery));
+}(jQuery));

data/app/assets/javascripts/pageflow/slideshow/lazy_page_widget.js

@@ -16,6 +16,10 @@
       return this.element.nonLazyPage.apply(this.element, [method].concat([].slice.call(args)));
     },
 
+    getPermaId: function() {
+      return parseInt(this.element.attr('id'), 10);
+    },
+
     getConfiguration: function() {
       return this.configuration;
     },

data/app/assets/javascripts/pageflow/slideshow/page_widget.js

@@ -5,7 +5,6 @@
       this.configuration = this.element.data('configuration') || this.options.configuration;
       this.index = this.options.index;
 
-      this.preloaded = false;
       this.reinit();
     },
 
@@ -25,8 +24,15 @@
     reinit: function() {
       this.pageType = pageflow.pageType.get(this.element.data('template'));
       this.element.data('pageType', this.pageType);
+      this.preloaded = false;
+
+      if (this.pageType.scroller === false) {
+        this.content = $();
+      }
+      else {
+        this.content = this.element.find('.scroller');
+      }
 
-      this.content = this.element.find('.scroller');
       this.content.scroller(this.pageType.scrollerOptions || {});
       this.pageType.scroller = this.content.scroller('instance');
 
@@ -38,6 +44,8 @@
 
     reactivate: function() {
       if (this.element.hasClass('active')) {
+        this.preload();
+
         this.content.scroller('enable');
         this.content.scroller('resetPosition');
         this.content.scroller('afterAnimationHook');
@@ -50,6 +58,7 @@
     cleanup: function() {
       this._triggerPageTypeHook('deactivating');
       this._triggerDelayedPageTypeHook('deactivated');
+      this._triggerPageTypeHook('cleanup');
     },
 
     refreshScroller: function() {
@@ -116,7 +125,7 @@
 
       this.content.scroller('resetPosition', {position: options.position});
       this._trigger('activate', null, {page: this});
-      this._triggerPageTypeHook('activating');
+      this._triggerPageTypeHook('activating', {position: options.position});
 
       return duration;
     },
@@ -161,13 +170,13 @@
         that._triggerPageTypeHook(name);
       });
 
-      this.element.one('deactivate', function() {
+      this.element.one('pagedeactivate', function() {
         handle.cancel();
       });
     },
 
-    _triggerPageTypeHook: function(name) {
-      return this.pageType[name](this.element, this.configuration);
+    _triggerPageTypeHook: function(name, options) {
+      return this.pageType[name](this.element, this.configuration, options || {});
     },
 
     _setupHideTextOnSwipe: function() {