Izenda Angular2Starterkit (Unsupported)

Overview

The Angular2Starterkit illustrates the concepts of integrating Izenda into Angular2 applications.

Q. What is in this repository?

A. This is a simple example using a project template with Izenda Embedded into it. This repository is only an example of integrating Izenda into another application. The project template used in this scenario is used as a substitute for your application. This repository shows examples of how you might embed Izenda into your application.

⚠️ The Angular2Starterkit is designed for demonstration purposes and should not be used as an “as-is” fully-integrated solution. You can use the kit for reference or a baseline but ensure that security and customization meet the standards of your company.

⚠️ The Izenda configuration database script provided is currently configured for version 3.7.0 of Izenda.

Installation

Deploying the Izenda API & Database

• Create a database named 'IzendaAngular2' (This is the database for the Izenda configuration. It contains report definitions, dashboards,etc.). You may use any name of your choosing, just be sure to modify the script below to use the new database name.

• Download and execute the Izenda.sql script. Please note, the database version can be found in the IzendaDBVersion table of this database. This will be necessary when obtaining the proper resources in the following steps.

• Download and deploy the Izenda API to IIS. The API can be found on our Downloads Page in our version directories. Select the version directory that corresponds Izenda configuration database version and click the "API" resource in the directory.

• Deploy the Izenda API to IIS. The instructions for installing the Izenda API will follow the same instructions for installing a standalone version of the Izenda's API.

• Download a copy of the izendadb.config file and copy it to the root of your API deployment. Then modify the file with a valid connection string to this new database.

Deploying the WebAPI & Database

• Create a database named 'IzendaAngular2_WebApi'. This is the database for the WebApi application. It contains the users, roles, tenants used to login. You may use any name of your choosing, just be sure to modify the script below to use the new database name.
• Download the Starterkit_Api.sql script.
• Modify the web.config (Line 75) file with a valid connection string to this new database.

  <connectionStrings>
    <add name="DefaultConnection" connectionString="[your connection string here]" providerName="System.Data.SqlClient" />
  </connectionStrings>

• Modify the 'IzendaApiUrl' value in the web.config (Line 80) file with the url of the Izenda API.

<add key="IzendaApiUrl" value="http://localhost:9999/api/" />

Deploying the Retail Database (optional)

Create the Retail database with the RetailDbScript.sql file.

Configuring Angular2StarterKitWeb

• Change the 'WebApiUrl' value in the izendaintegrate.js (Line 16) file with the URL for the Izenda API.

"WebApiUrl": "http://localhost:9999/api/",

• Open the config.ts (Line 4) file and ensure 'apiEndPoint' is set. This will default to http://localhost:3358/ and can be left as is.

let apiEndPoint = "http://localhost:3358/";

• Download a copy of the EmbeddedUI. The EmbeddedUI can be found on our Downloads Page in our version directories. Select the version directory that corresponds Izenda configuration database version and click the "EmbeddedUI" resource in the directory.

• Extract the files of the EmbeddedUI and place them in the Angular2StarterKitWeb/assets/izenda folder of your Angular 2 Kit.

• Open a command-line window at root folder Angular2StarterKitWeb and run the following commands:

npm install or yarn install

npm start or yarn start

• Use the following commands to build deployment package:

npm install or yarn install

npm run build or yarn run build

Run WebApi2StarterKit in Visual Studio

• Build and run the WebApi2StarterKit project and login with the System Admin account below:
  Tenant:
  Username: IzendaAdmin@system.com
  Password: Izenda@123
  

• Once you have logged in successfully, navigate to the Settings tab and enter your Izenda License Key .

• Now navigate to Settings > Data Setup > Connection String and replace the current connection string with the one you created for the Retail Database.

• Click Reconnect and then save

Post Installation

⚠️ In order to ensure smooth operation of this kit, the items below should be reviewed.

Exporting

Update the WebUrl value in the IzendaSystemSetting table with the URL for your front-end. You can use the script below to accomplish this. As general best practice, we recommend backing up your database before making any manual updates.

UPDATE [IzendaSystemSetting]
SET [Value] = '<your url here including the trailing slash>'
WHERE [Name] = 'WebUrl'

If you do not update this setting, charts and other visualizations may not render correctly when emailed or exported. This will also be evident in the log files as shown below:

[ERROR][ExportingLogic ] Convert to image: System.Exception: HTML load error. The remote content was not found at the server - HTTP error 404

Authentication Routes

Ensure that the AuthValidateAccessTokenUrl and AuthGetAccessTokenUrl values in the IzendaSystemSetting table use the fully qualified path to those API endpoints.

Examples:

Name	Value
AuthValidateAccessTokenUrl	http://localhost:3358/api/account/validateIzendaAuthToken
AuthGetAccessTokenUrl	http://localhost:3358/api/account/GetIzendaAccessToken

You can use the script below to accomplish this. As general best practice, we recommend backing up your database before making any manual updates.

UPDATE [IzendaSystemSetting]
SET [Value] = '<your url here>'
WHERE [Name] = 'AuthValidateAccessTokenUrl'

UPDATE [IzendaSystemSetting]
SET [Value] = '<your url here>'
WHERE [Name] = 'AuthGetAccessTokenUrl'

⛔ If these values are not set, the authentication will not work properly.

Further details about Izenda integration

• Installation and Maintenance Guide
• Developer Guide
• Developer Guide for Integrated Scenarios