# Development Guideline

## 1.Initiate TryOn instance

At first , initiate tryon instance with below 4 parameters.

@parameter1 : set canvas object

@parameter2 : set pixelRatio like windows.devicePixelRatio

@parameter3 : set sdkpath in the project directory

@parameter4 : callback method:(type,detailInfo)=>void .&#x20;

&#x20;                 type could be 1 or 2. 1 means initiation completed and 2 means asset is set up.

&#x20;                 detailInfo is the error message.

```
const renderCanvas = document.querySelector('#glcanvas');
var tryonInstance = new stARTryOn
(
　　　　　renderCanvas, 
　　　　　　window.devicePixelRatio, 
　　　　　　'/sdk/',
　　　　　　　(type, detailInfo) {console.log(type, "result: ", detailInfo.result, "info: ", detailInfo.info);
});
```

## 2.Initiate HumanAction handle

Then, initiate HumanAction handle for feet , face or wrist detection with below 4 parameters.

@parameter1 : open log

@parameter2 : license type. 1 means using license file and 2 means transfer license content.

@parameter3 : license content. Input license content if choose 2 in parameter2

@parameter4 : security key from server when choose 2 in paramter2

```
tryonInstance.initHumanActionHandle(true, 1, "", "");
```

## 3.Set Assets

There are 3 patterns for setting. Shoes , wrist watch or eyewear use the same interface.

### 3.1 setTryOn

@parameter1 : resource path

```
var materialPath = 'resources/shoes0.json';
tryonInstance.setTryOn(materialPath);
```

### 3.2 setTryOnJson

@parameter1 : json object

```
tryonInstance.setTryOnJson(jsonObject);
```

### 3.3 setTryOnPackage

@parameter1 : asset package path

```
var zipPath = 'resources/shoes0.zip';
tryonInstance.setTryOnPackage(zipPath);
```

## 4.Process Assets rendering

After asset set, use processFrame method for rendering.

@parameter1 : imagedata (need to be the same size with canvas and object type is ImageData)

@parameter2 : orientation ( Currently only 0 is available)

```
tryonInstance.processFrame(imageData, 0);
```

## 5.Remove Assets

Use removeTryOn method if need to delete asset

@parameter1 : type of TryOn

```
tryonInstance.removeTryOn(tryonInstance.tryon_shoes);
```

## 6.Stop detection

Stop for feet , face or wrist detection

@parameter1 : boolean

```
tryonInstance.pause = !tryonInstance.pause;
```

## 7. Capture screenshot

```
tryonInstance.saveImage();
```

## 8.Set tryon mode

Use setMode method to change the display mode. Currently , shoes only have TryOn mode.

```
tryonInstance.setMode(tryonInstance.mode_tryon);
```

## 9.Destroy instance

Destroy instance created for Tryon

```
tryonInstance.destroyStARTryOn();

```

## Specification

| OS      | Support   |
| ------- | --------- |
| iOS     | From 14.3 |
| Android | From 7    |

Support the latest version safari , firefox and Chrome.
