Function requestInitCardBrandingAnimation

  • Function to render Visa or MasterCard branding animation

    Parameters

    Returns Promise<void>

    • On complete animation

    Throws

    • if opts is not valid or animation process fails, then throw ERRORS | ERRORS.E022

    Examples

    Visa Animation with opts

    Define the animation container

    <!DOCTYPE html>
    <html lang="en">
    <body>
      <div id="visa-sensory-branding"/>
    </body>
    </html>

    Call the method with opts for Visa

    import {
      requestInitCardBrandingAnimation,
      CardBrandingRequest
    } from "@kushki/js-sdk/CardAnimation";

    const onRequestInitCardBrandingAnimation = async () => {
        try {
          const opts: CardBrandingRequest = {
            brand: "visa"
            color: "blue"
            constrained: true,
            sound: true,
            checkmark: "checkmarkWithText",
            checkmarkTextOption:  "complete",
            languageCode: "es"
          };

          await requestInitCardBrandingAnimation(opts);
          // On Success, the animation displayed according the opts into the container defined in the html
        } catch (error: any) {
          // On Error, catch response, ex. {code:"E022", message: "Error al generar animación"}
          console.error(error.message);
        }
      };

    MasterCard Animation with opts

    Define the animation container

    <!DOCTYPE html>
    <html lang="en">
    <body>
      <div id="mastercard-sensory-branding"/>
    </body>
    </html>

    Call the method with opts for MasterCard

    import {
      requestInitCardBrandingAnimation,
      CardBrandingRequest
    } from "@kushki/js-sdk/CardAnimation";

    const onRequestInitCardBrandingAnimation = async () => {
        try {
          const opts: CardBrandingRequest = {
            brand: "mastercard"
            type: "animation-only",
            background: "white",
            sonicCue: "securedby",
          };

          await requestInitCardBrandingAnimation(opts);
          // On Success, the animation displayed according the opts into the container defined in the html
        } catch (error: any) {
          // On Error, catch response, ex. {code:"E022", message: "Error al generar animación"}
          console.error(error.message);
        }
      };

Settings

Member Visibility

Theme

On This Page

Generated using TypeDoc