1 files changed, 37 insertions, 5 deletions
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index fc2da18d9..01c1de137 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -50,6 +50,8 @@ import { KeyValueBox } from './KeyValueBox';
 import { LinkAnchorBox } from './LinkAnchorBox';
 import { FormattedTextBox } from './formattedText/FormattedTextBox';
 import { PresEffect, PresEffectDirection } from './trails';
+import SlideEffect, { EffectType } from './trails/SlideEffect';
+import { SpringSettings, SpringType } from './trails/SpringUtils';
 interface Window {
     MediaRecorder: MediaRecorder;
 }
@@ -1005,18 +1007,48 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
             delay: 0,
             duration: Cast(presEffectDoc?.presentation_transition, 'number', Cast(presEffectDoc?.followLinkTransitionTime, 'number', null)),
         };
+
+        let timing = StrCast(presEffectDoc?.presEffectTiming);
+        let timingConfig: SpringSettings | undefined;
+        if (timing) {
+            timingConfig = JSON.parse(timing);
+        }
+
+        if (!timingConfig) {
+            timingConfig = {
+                type: SpringType.DEFAULT,
+                stiffness: 600,
+                damping: 15,
+                mass: 1,
+            };
+        }
         //prettier-ignore
+
         switch (StrCast(presEffectDoc?.presentation_effect, StrCast(presEffectDoc?.followLinkAnimEffect))) {
-            default: 
+            default:
+            // package used: react-awesome-reveal
             case PresEffect.None:       return renderDoc;
-            case PresEffect.Zoom:       return <Zoom {...effectProps}>{renderDoc}</Zoom>;
-            case PresEffect.Fade:       return <Fade {...effectProps}>{renderDoc}</Fade>;
+            case PresEffect.Zoom:       return <SlideEffect dir={dir as PresEffectDirection} effectType={EffectType.ZOOM} tension={timingConfig.stiffness} friction={timingConfig.damping} mass={timingConfig.mass}>{renderDoc}</SlideEffect>
+            case PresEffect.Fade:       return <SlideEffect dir={dir as PresEffectDirection} effectType={EffectType.FADE} tension={timingConfig.stiffness} friction={timingConfig.damping} mass={timingConfig.mass}>{renderDoc}</SlideEffect>
             case PresEffect.Flip:       return <Flip {...effectProps}>{renderDoc}</Flip>;
-            case PresEffect.Rotate:     return <Rotate {...effectProps}>{renderDoc}</Rotate>;
-            case PresEffect.Bounce:     return <Bounce {...effectProps}>{renderDoc}</Bounce>;
+            case PresEffect.Rotate:       return <SlideEffect dir={dir as PresEffectDirection} effectType={EffectType.ROTATE} tension={timingConfig.stiffness} friction={timingConfig.damping} mass={timingConfig.mass}>{renderDoc}</SlideEffect>
+            // Changed to move in since anything can be "bouncy"
+            case PresEffect.Bounce:     return <SlideEffect dir={dir as PresEffectDirection} effectType={EffectType.BOUNCE} tension={timingConfig.stiffness} friction={timingConfig.damping} mass={timingConfig.mass}>{renderDoc}</SlideEffect>
             case PresEffect.Roll:       return <Roll {...effectProps}>{renderDoc}</Roll>;
             case PresEffect.Lightspeed: return <JackInTheBox {...effectProps}>{renderDoc}</JackInTheBox>;
         }
+        // switch (StrCast(presEffectDoc?.presentation_effect, StrCast(presEffectDoc?.followLinkAnimEffect))) {
+        //     default:
+        //     // package used: react-awesome-reveal
+        //     case PresEffect.None:       return renderDoc;
+        //     case PresEffect.Zoom:       return <Zoom {...effectProps}>{renderDoc}</Zoom>;
+        //     case PresEffect.Fade:       return <Fade {...effectProps}>{renderDoc}</Fade>;
+        //     case PresEffect.Flip:       return <Flip {...effectProps}>{renderDoc}</Flip>;
+        //     case PresEffect.Rotate:     return <Rotate {...effectProps}>{renderDoc}</Rotate>;
+        //     case PresEffect.Bounce:     return <Bounce {...effectProps}>{renderDoc}</Bounce>;
+        //     case PresEffect.Roll:       return <Roll {...effectProps}>{renderDoc}</Roll>;
+        //     case PresEffect.Lightspeed: return <JackInTheBox {...effectProps}>{renderDoc}</JackInTheBox>;
+        // }
     }
     public static recordAudioAnnotation(dataDoc: Doc, field: string, onRecording?: (stop: () => void) => void, onEnd?: () => void) {
         let gumStream: any;