Mobile

1. Importing Plugin

Integrating the plugin is as easy as opening a website in the app. Our plugin is a responsive web site. Unlike iframe integration, you can run javascript commands directly. Therefore, the functions to be used in integration will be mentioned in this page. You must take a glance at platforms section for platforms specific codes and settings.

We will provide you unique id that matches with your products. It can be usable for only your app package. Therefore we need to get package name of your app to start integretion process.

2. Structure

Basically we need one webviewand color buttons. Any design can be created with this plugin. We uses product names or product codes to apply them. Product informations are stored in our CMS system. To apply any product, The only information you need is product name. To ensure product name is unique, product name is consist of three name.

productname = brandname + " " + "product name" + "color_name";

When webview loaded some informations are must be provided. Comminication between webview and your app provided by "injectJS" or "evaluateJS" commands. Your products only usable with your id. It can be tested on temporary package name that we give you. But you need to give us your package name for production. Unrecorded packages are not allowed for security issues.

3. Functions

To integrate plugin, you must open web site and inject some js commands after page loaded. There are many functions under different purposes like ui, applying product.

Will be used on iframe load

initProducts(String unique_id,String origin);

//sample code

origin = '';//It must be package name recorded on our cms

initProducts("unique_id", origin);//unique id that provided

You can set first product in 2 different ways.

1. You can use product name

   set_active_products(String jsonString)

   //Sample code

   activeProduct = {"Lipstick": "Pulpoar Lipstick 3", "makeupType":["Lipstick"], "makeupMode":0 }

   set_active_products(JSON.stringify(activeProduct))

   set_active_productstakes json string parameter. Active product dictionary consist of least three keys and values.

   First key value pair is "category" as a key and productname as a value. "Lipstick", "Blusher", "Eyeliner", "Foundation", "Eyeshadow", "Eyepencil" : productname

2. You can use product code

   set_active_products_by_code(String jsonString);

   //Sample code

   activeProduct = {"code": "********", "makeupType":["Lipstick"], "makeupMode":0 }

   set_active_products_by_code(JSON.stringify(activeProduct));

   set_active_products_by codetakes json string parameter. Active product dictionary consist of least three keys and values.

   makeupType: It is basically makeup category. It can be "Lipstick", "Blusher", "Eyeliner", "Foundation", "Eyeshadow", "Eyepencil" and "All". makeupType must be same as for 'singleApply' makeup mode
   makeupMode: There is two makeup mode. singleApply(0) is applies only one product same time. multiApply(1) is applies one or more product same time.

!!! info "Info" There is option to use and design your own camera ui. In this scenario you can create camera ui. And only result is shown by our ui.

Only use result screen

In this scenario when page loaded or photo captured, photo must be provided with below function.

loadimgBase64takes one argument which is base64 representation of captured photo.

loadimgBase64( String bese64String);

Will be used on product selection
There is two option to apply any product. You can use product code or product name that consist of brand name, product name and color name.

• applyProduct takes two argument. Category is can be "Lipstick", "Blusher", "Eyeliner", "Foundation", "Eyeshadow", "Eyepencil". Key must be name of product that recorded on our pms.

applyProduct(String category,String name)

• applyProductWithCode takes one argument. Product code is unique id that matches with product. You should integrate our product code list to your app or website. Product code list will be shared.

applyProductWithCode(String code)

• removeProducttakes only category name.

removeProduct(String category);

Will be used for UI integration
You can decide to choose your own icons for back button and slider button. Simply hide our button and put your icon. Post message when clicked your button.

1. Hide slider button.

hideSlider();

2. Click slider button.

clickSlider();

1. Hide back button.

hideBackButton();

2. Click back button.

clickBackButton();

Plugin files

Mail us to to get website-id and our plugin URL. You can get contact from [here](mailto: [email protected])