Introduction

A server is to be setup for migrating the application control to cloud. Client-Server Setup for Application Customization is described below.

It is mandatory to setup the application server to configure the applications for the box.
Only the applications configured against a box Tata Elxsi Accelerator UI Application can be customized based on the operator requirement using our CustomUI application (Customer Login Page ) .Only the applications and contents configured against a particular operator id will be available to that boxoperator.  

Overview

This document provides the following details: 

• Prepare the environment (Pre-requisite)  
• Configure the web server and database for application configuration 
• Configure the box to connect to serverLogin to CustomUI Application 
• Customize the application

Server Setup 

• Box configuration

Login

The steps to login as a new operator to the CustomUI Application The server setup is listed here:

...

Steps to Login 

Follow the steps listed here to setup the environment for application server. 

1. Install Java JDK in your system (check “java –version” in command prompt).
   (TE tested using java 15.0.1 2020-10-20)
2. Download the Xampp installer (xampp-win32-1.8.2-2-VC9-installer.exe).
3. Follow steps 1 to 10 from the link: https://www.ionos.com/digitalguide/server/tools/xampp-tutorial-create-your-own-local-test-server/#c42765.
4. After successful installation execute xampp-control.exe in XAMPP folder from c://<pathtoXampp>/ xampp-control.exe  and then the Xampp control panel appears. 
5. Download the attached war file (CustomUI.war) and database (accelerator.sql).

           accelerator.sql.zip

CustomUI.war(updated on July 2021)

Initial Settings

Ensure the following are set before proceeding further:

1. Copy the Tata Elxsi Accelerator UI build folder to the box into /opt/www/ .
2. Application server address and serial number is configured in the box inside /opt/www/build/static/server/Serverconfig.json as described in section 3 of the document.
3. Firewalls are configured (or disabled) in the server machine to allow access from box.

 XAMPP Server Setup 

Start the Apache server and MySQL server components as described below:  

...

1. Copy the war file attached (CustomUI.war) and paste the same inside  “xampp\tomcat\webapps”
2. Start Tomcat in XAMPP Control Panel and click on the Admin button next to the start button to view the tomcat server home page in the browser 
   Image Removed

login as an existing Operator

1. Click on Customer Login Page or Enter the URL (http://121.244.192.84:9999/CustomUI) in the address bar of browser (Chrome), and press Enter. 
2. Below login page will be loaded.
   
   Image Added
3. Enter a valid username and password(sampleuser:- username: elxsi password: elxsi123) 
4. Click on Login.

Follow the steps below to login as a new operator

1. Click on the sign-up link to create a new operator.
2. Once clicked below page will be loaded.
   Image Added
3. Enter the operator name, Username, Password and select the OEM. 
4. Note down the Username since the same value should be given in the OPERATOR_ID in box configuration discussed later. 
5. Once all values are entered click on the submit button. 
6. Dashboard screen will be displayed on successful login. 
   
   Image Added

Client setup 

The steps to connect to the server is given below: 

Box Configuration 

1. Open /opt/www/build/static/server/Serverconfig.json in box. 
2. Serverconfig.json contains 3 fields: 
   

   "SERVER_URL":URL of the CustomUI ( http://121.244.192.84:9999/CustomUI/) 

   "OPERATOR_ID": Username given while creating  a newoperator  (for default user :operator_id : teuser) 

   "ASSET_URL ":  URL of the server from which assets are to be loaded (http://121.224.192.84:9999/)

3. Save and reboot the box.

Customize the Application 

Note: The configuration is to be done against each operator and each operator is identified by a unique operator_id . This operator_id should be same as operator_id in /opt/www/build/static/server/Serverconfig.json in box. 

1. Home

Client setup 

The steps to connect to the server is given below: 

Box Configuration 

...

"Server_port": port of Tomcat server 

"serial_number": unique id of the box. 

...

The following command can be used to identify the ‘serial number’ in the box which is to be used in the database for its unique ID. 

...

Customize the Application 

The steps to add a new box in database table are listed in this section. A default configuration is already given in the provided database. 

General procedure is: 

1. Enable/disable the menu item category in the Accelerator UI application home screen.  
   1. E.g., Enable/disable Premium Apps category home page 
2. Enable/disable individual application.
   1. E.g., Enable/disable Netflix within the Premium Apps category 
3. Enable/disable individual icons in InfoBar. 
   1. E.g., Enable/disable weather icon in the InfoBar 
4. Customize Home screen and Settings Screen Theme. 
   1. E.g., Customize Background Image/Color 
   2. E.g., Customize Background Image/Color 
   3. E.g., Customize Font Color and Font Face 

Note: The configuration is to be done against each box and each box is identified by a unique customer_id (representing boxid), which is the box serial number. This serial number should be same as serial number in /opt/www/build/static/server/Serverconfig.json in box. 

1. Steps to add a new customer/box into the server 

Follow the steps below to add a new box information to the server: 

1. Click on the customer_list Table from the list of tables available inside accelerator database as shown below.Image Removed
2. Click the Insert button to insert the contents in the Table and enter the data in the respective fields.

...

Image Removed

...

• The order of the sections in the home screen can be customized by the operator.  
• Click the Home button on the top bar of dashboard, below page will be displayed

1. Click on the customer_menu_app_list table through phpMyAdmin page.
2. 
   
   
   
3. Click on the Insert button to add Customer data.
4. Premium apps feature in main menu of Accelerator UI app can be enabled by setting 6 in the menu_id field.
   [6 here refers to the Premium app content against that customer id]
5. Individual Premium apps in the Accelerator UI app can be enabled by setting the app_id field.
   [values for app_id can be referred from app_list table, see picture below with YouTube is 1, Netflix is 2 etc]
   
    

...