Home

Loyalty Plugin

Technology stack:

• AngularJS
• BuildFire APIs

1. Control Panel(CP) :

All the changes in control panel will reflect dynamically on widget section. Its further divide into three sections :-

• Content: In this section, user enters the reward points details like points per purchase, points per dollar, daily limit etc. User can add new reward, view a list of rewards, edit them, delete them and sort them. Content section also have image carousel and WYSIWYG editor.

• Design: This section lets user to choose the appearance of the data in widget section. How the list of categories, list of products and single product will be displayed. There are 3 options which user can modify for look and feel of the widget(Item details layout will be common for all):

  • Item list Layout
  • Item list background image
  • Item details background image

• Settings: This section shows a simple currency drop down from which user can choose. Pre Select default value($).

2. Widget(App) :

All the data added in the control panel reflects on the widget section. Home page shows image carousel(Optional), WYSIWYG(Optional) and a list of rewards. Clicking of each reward will further show particular reward details. There user is given an option to redeem points corresponding to that reward.

There will be two views when user is LOGGED IN and when not. Sample list view. Clicking on “Get more points” will ask the user to Enter amount and Confirm passcodw.

As soon as amount and passcode are entered, it is verified and if it matches the points are added to user’s account . Similarly points are added in case user make any purchase. In case user is logged in, clicking on redeem points will open the confirmation view. Otherwise user is directed to login or register page.

Loyalty APIS

https://docs.google.com/document/d/1nCZNDFQ3gkoARck6Ypbq_ddvJzjcy23U-ux13o-VpHE/edit

Apart from Loyalty APIs, we will be using Datastore to save some user related data. Tag name “loyaltyInfo” with following structure:

{
“design” : 	{
	     	“listLayout” : “”,
	    	“listBgImage” : “”,
	    	“itemDetailsBgImage” : “”
             },
"settings” :  {
  		      “currency” : “”
              }

}

Miscellaneous references:

1. https://github.com/BuildFire/sdk/wiki/How-to-use-Datastore
2. https://github.com/BuildFire/sdk/wiki/BuildFire-Thumbnail-Component
3. https://github.com/BuildFire/sdk/wiki/Spinners
4. https://github.com/BuildFire/sdk/wiki/How-to-use-Navigation
5. https://github.com/BuildFire/sdk/wiki/How-to-use-auth
6. https://github.com/BuildFire/sdk/wiki/How-to-use-Messaging-to-sync-your-Control-to-Widget