demoway-sdk v0.5.0

Demoway SDK

Install

pnpm

pnpm add demoway-sdk

npm

npm install demoway-sdk --save

yarn

yarn add demoway-sdk

Initialize DemoWay SDK

Initialize DemoWay SDK before application rendering

Vue Example

import { initialize, IUserInfo } from 'demoway-sdk';
import { createApp } from 'vue';

initialize({
  accessToken: '', 
  appId: '',
  userInfo: {
    openId: '',
    userName: '',
    nickName: ''
    xxx: '',
    company: { 
      id: ''  
      name: '' 
    }
  } as IUserInfo, // IUserInfo is TS interface, you can remove it if you are not using TS
})
/**
* render your app
*/
createApp(App).mount();

React Example

import { initialize, IUserInfo } from 'demoway-sdk';
import { createRoot } from 'react-dom/client';

initialize({
  accessToken: '', 
  appId: '',
  userInfo: {
    openId: '',
    userName: '',
    nickName: ''
    xxx: '',
    company: { 
      id: ''  
      name: '' 
    }
  } as IUserInfo, // IUserInfo is TS interface, you can remove it if you are not using TS
})

/**
* render your app
*/
const domNode = document.getElementById('root');
const root = createRoot(domNode);
root.render(<App />);

When a user accesses the demo, Demoway will create an anonymous user for them. If you provide the "userInfo" field when initializing the SDK, this information will be associated with the anonymous user. In the Demoway dashboard, when viewing the user's access records, you may also see this information. This makes it convenient to identify different users. If the "userInfo" includes the "openId" field, you can associate each user with the users in your own system when retrieving access records through the API.

Usage

Open Demo in Dialog

Open a demo in dialog, which can switch to full screen mode.

import { openDemoDialog } from 'demoway-sdk';

openDemoDialog('demo-id'); // demo-id can be got from DemoWay dashboard

Open CheckList in Dialog

Open a checklist in dialog, which can switch to full screen mode.

import { openDemoDialog } from 'demoway-sdk';

openDemoDialog('demo-id', {checklistId: 'checklist-id'}); // demo-id and checklist-id can be got from DemoWay dashboard

Record a New Demo

Enable recording feature and show recording board by calling enableRecord function.

import { enableRecord } from 'demoway-sdk';

// enable recording feature and show recording board
enableRecord();

Enable recording feature and show recording board by rage click.

import { enableRecord, rageClick } from 'demoway-sdk';

const button = document.querySelector('button');

// rage click button 5 times with 1000ms interval
rageClick(button, 5, 1000).then(() => {
  // enable recording feature and show recording board
  return enableRecord();
});