import { ReferenceData } from "./common"; import { AssetReference } from "./virtual-styling"; export type AnlyticComponentProperty = { /** * Identifies the component as the modal dressing room component */ component: "mdrc"; } | { /** * Identifies the component as the virtual styling component */ component: "vsc"; /** * The collection that is currently shown */ collection: ReferenceData; }; export interface VdrState { /** * The avatar reference that is currently shown */ avatar: ReferenceData; /** * The scene reference that is currently shown */ scene: ReferenceData; /** * The garments that are currently shown */ garments: Array; } /** * Contains all available analytic information for a product in the virtual styling component */ export interface ProductDescription { /** * The ID of the product */ id: string; /** * The garment group id */ group_id: number; /** * The garment group name */ group_name: string; /** * Is this product tryonable * * usually true means it is a garment, false means this is * an accessory */ tryonable?: boolean; /** * The price of this product if available */ price?: number; /** * The currency of the product */ currency?: string; /** * The strike price if available */ strike_price?: number; /** * The garment reference */ reference: AssetReference; /** * The name of the product */ name?: string; /** * The brand of the product */ brand?: string; /** * The size_id of the product if available */ size_id?: string; } export type ProductProperties = { /** * The product that this event is about */ product: ProductDescription; /** * The current state of the virtual dressing room */ vdrstate: VdrState; /** * Determines the origin of the event. For example the outfit of the outfit preview where the * shopper pressed the “style it” button, a share linke or the menu with the categorised products. */ product_origin: null | "outfit" | "share_link" | "product_category"; } & AnlyticComponentProperty; export type StateProperties = { /** * The current state of the virtual dressing room */ vdrstate: VdrState; } & AnlyticComponentProperty; export type CartProperties = { /** * The current state of the virtual dressing room */ vdrstate: VdrState; /** * The products that are added to the cart */ products: Array; } & AnlyticComponentProperty; export type OpenComponentProperties = { /** * Identifies the component as the modal dressing room component */ component: "mdrc"; } | { /** * Identifies the component as the virtual styling component */ component: "vsc"; /** * The collection that is currently opened in the virtual styling component */ collection: ReferenceData; }; export type CloseComponentProperties = { /** * Identifies the component as the modal dressing room component */ component: "mdrc"; } | { /** * Identifies the component as the virtual styling component */ component: "vsc"; /** * The collection that is currently opened in the virtual styling component */ collection: ReferenceData; /** * The time in milliseconds the component was open */ sessionLength: number | null; }; export type OutfitShownProperties = { /** * Identifies the component as the modal dressing room component */ component: "mdrc"; } | { /** * Identifies the component as the virtual styling component */ component: "vsc"; /** * The collection that is currently opened in the virtual styling component */ collection: ReferenceData; /** * The avatar that is part of this outfit */ avatar: ReferenceData; /** * The scene that is part of this outfit */ scene: ReferenceData; /** * The garments that are part of this outfit in the order they are rendered in the outfit */ garments: Array; }; export type OpenStylingViewProperties = { /** * Identifies the component as the modal dressing room component */ component: "mdrc"; } | { /** * Identifies the component as the virtual styling component */ component: "vsc"; /** * The collection that is currently opened in the virtual styling component */ collection: ReferenceData; /** * The avatar that is part of this outfit */ avatar: ReferenceData; /** * The scene that is part of this outfit */ scene: ReferenceData; /** * The garments that are part of this outfit in the order they are rendered in the outfit */ garments: Array; /** * The outfit that is part of this outfit */ outfit: string; }; export type CloseStylingViewProperties = { /** * Identifies the component as the modal dressing room component */ component: "mdrc"; } | { /** * Identifies the component as the virtual styling component */ component: "vsc"; /** * The collection that is currently opened in the virtual styling component */ collection: ReferenceData; }; /** * This interface defines the events that are available for analytics, each method explains, * when it is called and what properties are available. * * @group VSC * @group Host Providers */ export interface IAnalyticProvider { /** * This event signifies that an outfit was shown * * @param properties The properties that are available for this event */ OutfitShown(properties: OutfitShownProperties): Promise; /** * This event signifies that the styling view was opened. * * A shopper pressed the “style it” button below an outfit or the styling view was the destination of are shared link. * * @param properties The properties that are available for this event */ OpenStylingView(properties: OpenStylingViewProperties): Promise; /** * This event signifies that the styling view was opened. A shopper pressed the “up” button or the component was closed. * * @param properties The properties that are available for this event */ CloseStylingView(properties: CloseStylingViewProperties): Promise; /** * This event signifies that the component was opened. * * @param properties The properties that are available for this event */ OpenComponent(properties: OpenComponentProperties): Promise; /** * This event signifies that the component was closed. * * @param properties The properties that are available for this event */ CloseComponent(properties: CloseComponentProperties): Promise; /** * This event signifies that a product has been added to the virtual dressing room. * Either as a garment on the avatar or in one of the accessory slots. * This can be triggered by clicking on “style it” in the outfits screen or from the product menus. * * @param properties The properties that are available for this event */ AddProductToVdr(properties: ProductProperties): Promise; /** * This event signifies that an avatar has been selected to be shown in the virtual dressing room. * * @param properties The properties that are available for this event */ ChangeAvatarInVdr(properties: StateProperties): Promise; /** * This event signifies that a scene has been selected to be shown in the virtual dressing room. * * @param properties The properties that are available for this event */ ChangeSceneInVdr(properties: StateProperties): Promise; /** * This event signifies that product has been presented to the shopper. Either as product image, name and price or in an outfit. * * @param properties The properties that are available for this event */ ProductImpression(properties: ProductProperties): Promise; /** * This event signifies that a product has been shared as a part of a shared outfit. * For each product shown in the virtual dressing room (tried-on garments and accessories in the slots) * this event will be triggered at the moment when the share button got pressed. * * @param properties The properties that are available for this event */ ProductShared(properties: ProductProperties): Promise; /** * This event signifies that the shopper pressed the share button. * * @param properties The properties that are available for this event */ LinkShared(properties: StateProperties): Promise; /** * This event signifies that a shopper wants to add a specific product to the shopping cart. * If bundle sale got pressed this event gets triggered for each product in * the virtual dressing room (tried-on garments and accessories in the slots). * * @param properties The properties that are available for this event */ AddProductToCart(properties: ProductProperties): Promise; /** * This event signifies that the shopper pressed the bundle sale button got pressed * (only visible when bundle selling is activated). * * @param properties The properties that are available for this event */ AddBundleToCart(properties: CartProperties): Promise; } /** * This type provides backwards compatible type. * * @deprecated Use the new {@link IAnalyticProvider} interface instead. */ export type IAnalyticEvents = IAnalyticProvider;