Skip to content

README.md

Latest commit

 

History

History
59 lines (40 loc) · 1.57 KB

README.md

File metadata and controls

59 lines (40 loc) · 1.57 KB
Raw

widget-example

This project highlights the usage of the designhubz makeup web SDK.

import * as Designhubz from 'designhubz-widget';

Designhubz.createMakeupWidget(someDivElement)
.then( widget => widget.loadProduct(SKU) );

Roadmap

Eventually, Eyewear & Makeup try-on widgets will be available through the same designhubz-widget web SDK.

During initial releases however designhubz-widget for 'makeup/' uses a separate deployment path:

"dependencies": {
  "designhubz-widget": "https://widget.designhubz.com/makeup/designhubz-widget-1.0.1.tgz"
}

Changelog

1.0.2

  • Assign variation = product in widget object.
  • Fix Cors bug.
  • Kickstart recommendations: Mock.
  • Stability improved.
  • Add feature widget.takeDoubleSnapshotAsync: it captures 2 Snapshot objects with & without makeup applied.

1.0.1 (Initial release)

  • Introduces makeup widget functionality
  • Introduces widget.loadProduct(id) which replaces fetchProduct + loadVariation

Setup

  1. Clone project and open command prompt in root project folder
  2. Install libraries by running the following command:
npm install
  1. Run the project:
npm run start

Main files Description

  1. This project uses our web SDK package: designhubz-widget
  2. index.html : shows an HTMLDivElement where the widget (iFrame) will be contained.
  3. src/index.ts : In this example, we are fetching a specific product, creating and interacting with a widget.

Live demo: https://dg0iszzfyf3bz.cloudfront.net/widget/makeup/1.0.2/index.html