Fix transition direction of slides with string based hashes (#339)

Use the manager’s slide reference to properly look up the route’s slide index.
Update test snapshot of manager and markdown slide.

Author: philipphenkel

src/components/__snapshots__/manager.test.js.snap

@@ -110,6 +110,18 @@ exports[`<Manager /> should render correctly. 1`] = `
             lastSlideIndex={0}
             print={false}
             slideIndex={0}
+            slideReference={
+              Array [
+                Object {
+                  "id": 0,
+                  "rootIndex": 0,
+                },
+                Object {
+                  "id": 1,
+                  "rootIndex": 1,
+                },
+              ]
+            }
             transition={
               Array [
                 "zoom",
@@ -655,6 +667,24 @@ exports[`<Manager /> should render with slideset slides 1`] = `
             lastSlideIndex={1}
             print={false}
             slideIndex={1}
+            slideReference={
+              Array [
+                Object {
+                  "id": 0,
+                  "rootIndex": 0,
+                },
+                Object {
+                  "id": 1,
+                  "rootIndex": 1,
+                  "setIndex": 0,
+                },
+                Object {
+                  "id": 2,
+                  "rootIndex": 1,
+                  "setIndex": 1,
+                },
+              ]
+            }
             transition={Array []}
             transitionDuration={500}
           >

src/components/manager.js

@@ -462,6 +462,7 @@ export default class Manager extends Component {
       transitionDuration: (slide.props.transition || {}).transitionDuration
         ? slide.props.transitionDuration
         : this.props.transitionDuration,
+      slideReference: this.state.slideReference
     });
   }
   render() {

src/components/transitionable.js

@@ -1,6 +1,7 @@
 /*eslint new-cap:0, max-statements:0*/
 import React, { cloneElement } from 'react';
 import { VictoryAnimation } from 'victory-core';
+import findIndex from 'lodash/findIndex';
 
 /**
  * Decorator for adding Spectacle transition support
@@ -36,8 +37,8 @@ const Transitionable = function (target) {
 
     transitionDirection() {
       const { slideIndex, lastSlideIndex } = this.props;
-      const slide = this.context.store.getState().route.slide || 0;
-      return this.state.reverse ? slideIndex > slide : slideIndex > lastSlideIndex;
+      const routeSlideIndex = this._getRouteSlideIndex();
+      return this.state.reverse ? slideIndex > routeSlideIndex : slideIndex > lastSlideIndex;
     },
 
     getTransitionStyles() {
@@ -68,7 +69,16 @@ const Transitionable = function (target) {
       }
 
       return { ...styles, transform: transformValue };
-    }
+    },
+
+    _getRouteSlideIndex() {
+      const { slideReference } = this.props;
+      const slide = this.context.store.getState().route.slide;
+      const slideIndex = findIndex(slideReference, reference => {
+         return slide === String(reference.id);
+      });
+      return Math.max(0, slideIndex);
+    },
   };
 
   Object.assign(target.prototype, transitionable);