Skip to content

Provided Mixins

riccomediamonks edited this page May 23, 2018 · 15 revisions

mubanTransitionMixin

This mixin extends the mubanTransitionCoreMixin.

Methods:

After extending this mixin a couple of methods are added to your component, you can see all of them in the generated documentation. See below for the most common ones!

transitionIn

  • Description: This method allows you to trigger a transitionIn on your component.
  • Parameters
    • forceTransition
      • type: boolean
      • required: false
      • description: If you trigger a transitionIn when the transitionOut is still running by default it will wait for the transitionOut to be complete, if you provide this flag it will force your new transition.
  • Returns
    • Promise<void>

transitionOut

  • Description: This method allows you to trigger a transitionOut on your component.
  • Parameters
    • forceTransition
      • type: boolean
      • required: false
      • description: If you trigger a transitionOut when the transitionIn is still running by default it will wait for the transitionIn to be complete, if you provide this flag it will force your new transiton.
  • Returns
    • Promise<void>

enterView

  • Description: This method is triggered when a data-scroll-component component enters the view.
  • Returns
    • <void>

leaveView

  • Description: This method is triggered when a data-scroll-component component leaves the view.
  • Returns
    • <void>

beyondView

  • Description: This method is triggered when the scrollbar is dragged down super fast the default enter view event might not be triggered therefor we have a beyondView event! If it's already transitioned in it will do nothing! But if it's not transitioned in it will still try to transitionIn
  • Returns
    • <void>

startLoopingAnimation

  • Description: Starts the main loopingAnimation for the component
  • Returns
    • <void>

stopLoopingAnimation

  • Description: Stops the main loopingAnimation for the component
  • Returns
    • <void>

Properties

After extending this mixin a couple of properties are added to your component, you can see all of them in the generated documentation. See below for the most common ones!

enterViewThreshold

  • Type: number
  • Description: Contains a number between 0 - 1. Setting this number to for example 0.5 will trigger the enterView method when the data-scroll-component component is already visible for 50% within your viewport.

mubanTransitionCoreMixin

Methods:

Clone this wiki locally