Wizart Deployment KIT
Introduction
A JavaScript library for seamless integration of Wizart solutions into customer software. This library provides a set of tools and APIs to facilitate the incorporation of Wizart's innovative visualization and product management capabilities into any application, enhancing user experience and operational efficiency.
Getting started
Installation
The Wizart Deployment KIT library can be integrated into your project as a script. Add the following script to your HTML file:
<script src="https://d18jpdcj6p6zg6.cloudfront.net/wizart-deployment-kit-v1.0.x.min.js"></script>
Quick usage
The following examples demonstrate how to initialize and use the Wizart Deployment KIT Visualizer in your project.
const targetElementVisualizer = document.getElementById('visualizer');
const visualizer = new WizartDeploymentKit.Visualizer({
token: 'ANSUhEUgAA...', // Your access token
layoutSettings: {
targetElement: targetElementVisualizer // Parent element for Visualizer
}
});
await visualizer.load(); // Load the visualizer
visualizer.show(); // Display the visualizer
Explore Configuration Options
The library provides extensive configuration options to customize the visualizer for your use case. Refer to the VisualizerOptions documentation for more details.
Create and Use Buttons
You can create a button using the Wizart library or use your own button to bind Visualizer methods.
const targetElement = document.getElementById('button-open');
const openVisualizerButton = WizartDeploymentKit.createButton({
targetElement: targetElement,
text: 'See product in your room'
});
// Add click handler: load Visualizer if not loaded, then show
openVisualizerButton.onClick(async () => {
try {
if (!visualizer.isLoaded) {
await visualizer.load();
}
visualizer.show();
} catch (error) {
console.error('Visualizer failed to load.');
}
});
- Use your own Button
let visualizer = null;
// Initialize the Visualizer instance (not loaded yet)
visualizer = new WizartDeploymentKit.Visualizer({
token: 'ANSUhEUgAA...', // Your access token
load: false, // Do not load immediately
layoutSettings: {
targetElement: targetElementVisualizer
}
});
// Find your custom HTML button
const openVisualizerButton = document.getElementById('visualizer-button');
// Add click handler: load Visualizer if not loaded, then show
openVisualizerButton.onclick = async () => {
try {
if (!visualizer.isLoaded) {
await visualizer.load();
}
visualizer.show();
} catch (error) {
console.error('Visualizer failed to load');
}
};
Subscribing to Visualizer Events
The Wizart library allows you to subscribe to events emitted by the Visualizer for advanced interactions. Refer to the VISUALIZER_EVENTS documentation for more details.
const subscriptionId = WizartDeploymentKit.EventBus.subscribe(
(event) => {
console.log(event); // Handle the event
},
// Specify the event type to listen for
WizartDeploymentKit.VISUALIZER_EVENTS.ADD_TO_CART,
// Optionally, scope the subscription to a specific visualizer instance
visualizer
);
Versioning Guide
To ensure a smooth and predictable experience with our library, we follow a structured versioning approach: MAJOR.MINOR.PATCH (e.g., 1.2.3). This system allows us to release updates that are easy to integrate while also giving customers flexibility in managing their versions. Here’s what each version level means and how it might impact your integration:
1. MAJOR (1.x.x) – Breaking Changes
Major version updates may contain significant changes to the library’s core functionality or API, which could require adjustments to your integration. These updates are released infrequently and are accompanied by extensive documentation. For customers without dedicated engineers, our team will provide guidance and support for these updates.
2. MINOR (x.2.x) – Feature Additions and Enhancements
Minor updates include improvements and new features that may affect integration behavior, though they are designed to minimize disruption. We recommend testing minor version updates in your environment before full deployment, especially if you manage the integration yourself.
3. PATCH (x.x.3) – Bug Fixes and Performance Improvements
Patch updates address critical bugs or optimizations that do not affect the integration’s functionality. These updates are backward-compatible, so they are safe to apply without additional testing. We sometimes apply patch updates automatically, ensuring the stability and reliability of the library without impacting your integration.
Versioning Options for Your Integration
The Wizart Deployment KIT library allows for two approaches to versioning:
- Specific Version Lock: For clients who want strict control, you can specify an exact version (e.g.,
1.2.3) in your integration to maintain a stable setup. - Dynamic Patch Updates: By using a flexible patch (e.g.,
1.2.x), your integration will automatically benefit from the latest bug fixes and improvements within the specified major and minor versions.
Release Timeline
v1.1.1 (2026-04-28)
- Highlights:
- Added parameter laying_pattern_code for panorama
v1.1.0 (2026-04-24)
- Highlights:
- New Feature: Added Panorama class to support panorama viewing.
- Extended WizartDeploymentKit global object with the Panorama module.
v1.0.4 (2026-03-30)
- Highlights:
- Fixed incorrect download domain for QR codes on iOS (white-label/private-label).
v1.0.3 (2025-12-24)
- Highlights:
- Fixed incorrect download domain for renders on iOS (white-label/private-label).
- Optimized console logs.
- Fixed empty screen on IOS-based devices.
- Fixed analytics events.
v1.0.2 (2024-12-24)
- Highlights:
- Fixed issue with token iframe parameter.
v1.0.1 (2024-12-19)
- Highlights:
- Added the ability to pass brand_name, collection_name properties to CustomProduct. These fields are displayed in the catalog in the product card section.
v1.0.0 (2024-11-18)
- Highlights:
- Initial release with core functionalities.
- Integrated APIs for visualization.
- Basic documentation provided.