# H5 WebIQ Installation Guide

# Setup Developing Tools & install Software
*** Dev tools install path:
A> Visual Studio code Editor: https://code.visualstudio.com/ VSCodeUserSetup-x64-1.48.2.exe {Visual Studio Code - H5 SrcCode Editor IDE & Run Engine "gulp"}

B> Git: https://git-scm.com/download/win
v2.28.0 64-bit version of Git for Windows update: July 28th 2020 { git command prompt }

C> Nodejs: https://nodejs.org/dist/latest-v10.x/
Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. {JavaScript engine}
node-v10.22.1-x64.msi (64 bit)
node-v10.22.1-x86.msi (32 bit)

D> Fork: https://git-fork.com/
{Remote & Local src management, branching / Taging} ForkInstaller.exe Latest release: 1.54.1.0

And developers need a GitHub account: https://github.com/
([e-mail] or Id: etnet-xxx) and Grand access right in Git for below projects
WebIQ src: https://github.com/etnetapp/webiq/
Webiq-ng src: https://github.com/etnetapp/webiq-ng/

## WebIQ Project Download & Installation Steps:
1. need create a H5_WebIQ workspace folder in local PC:
\workspaceH5\

2. go inside \workspaceH5\ folder & Download web iq git src:
2.1 Open a power shell or git shell
2.2 C:\> cd c:\workspaceH5
2.3 C:\workspaceH5> git clone https://github.com/etnetapp/webiq.git
to download src from Git server (first time need input git ID & pwd)
To configure git ID & pwd cmd:
workspaceH5\>git config user.name
workspaceH5\>git config user.email

*** install runner dependence in project folder:
3. C:\workspaceH5>cd webiq
4. C:\workspaceH5\webiq> npm install -g bower
5. C:\workspaceH5\webiq> npm install -g gulp (intall runner)
6. C:\workspaceH5\webiq> npm install (intall all dependence)
7. C:\workspaceH5\webiq> cd src/asset/lib/html2canvas/
>npm install
>npm run build

*** Run H5 project by open gulp command prompt:
8. ..> cd C:\workspaceH5\webiq\
10. C:\workspaceH5\webiq> gulp watch

*** local Web: Watch result using Chrome browser H5 url:
If there are no error or warning message, you local http server is starting:
go to Chrome browser to type below to open webiq system:
http://localhost:8007/

Samilar procedure to open & run WebIQ-NG project by open Yarn command prompt:
1. power shell type: cd C:\workspaceH5\
2. C:\workspaceH5\> git clone https://github.com/etnetapp/webiq-ng.git
3. C:\workspaceH5\> cd webiq-ng/
4. workspaceH5\webiq-ng\> npm install -g yarn
5. workspaceH5\webiq-ng\> npm install typescript@^3.4.3
6. workspaceH5\webiq-ng\> npm install
7. open powershell with admin mode (right click and run as admin)
8. exec this command:
"Set-ExecutionPolicy -Scope CurrentUser -ExecutionPolicy Unrestricted"
9. workspaceH5\webiq-ng\> yarn start

git remote add upstream:
https://github.com/etnetapp/webiq-ng.git

* fix cannot startup in package.json:
node --max-old-space-size=4096 node_modules/@angular/cli/bin/ng
"start": "node --max-old-space-size=3072 node_modules/@angular/cli/bin/ng serve --host 0.0.0.0 --proxy-config proxy.conf.json",

*** local Web: Watch result using Chrome browser webiq-ng url:
If there are no error or warning message, you local http server is starting for webiq-ng:
go to Chrome browser to type below to open webiq-ng system:
http://localhost:4200/

Deployment
# yarn build:prod

## WebIQ-NG Core Download & Installation Steps:
make sure you have .npmrc config before install packages

*** set auth Token for github src submit:
C:\Users\steph\.npmrc
registry=https://registry.npmjs.org/
@etnetapp:registry=https://npm.pkg.github.com/
//npm.pkg.github.com/:_authToken=<PTA from github>

C:\workspaceH5> git clone https://github.com/etnetapp/core-ng.git
C:\workspaceH5> cd core-ng
> git remote add upstream https://github.com/etnetapp/core-ng.git
> npm install -g yarn
> yarn install

open vscode to start developing the project
update ‘core-ng\projects\demo\src\environments’, add user name & pwd: username: 'h5fdsz5',
update ‘core-ng\projects\demo\src\app\service\main.service.ts’, websocket as below:
wss: 'wss://ws01.etnet.com.hk/websocket',

update app.component.ts, change //this.screen = 'welcome'; --> 'news';
yarn start
visit http://localhost:4200/

# Git helpful check remote status command line cmd:
>git status
>git log
>git log --oneline
>git branch -a
>git rebase origin/master

# Develop Guide/System Access & useful links

Remote pc to deploy H5 Developing branch in Git:
npm run release
FileZilla webiq.zip to .28, then .31 iq6pilot /var/www/http/WebIQ/ folder

ET Net Projects Guideline: https://hackmd.io/gf5nki3YS-azdK9RXS6_wQ?view

H5 WebIQ Weekly Schedule:
\\LAPWONG-HP\Share\IQ\Html5\Schedule\H5WebIQ_Weekly_Tasks_Schedule.xls

Visual Studio Code in Action: https://code.visualstudio.com/docs/?dv=win

H5 WebIQ Design Images Google drive links:
https://drive.google.com/open?id=0B5eODPJ0z6hFM1UxQ2lhaUhaQWs
Google Drive\HTML 5 design Docs\Design Guide\05. Sub Menu

H5 WebIQ-NG Task Schedule Google Document links:
https://docs.google.com/spreadsheets/d/1hpY7QmOuXRdmZXNzdkUpzzF9rBuhG_D4i5vrQ7zydq4/edit?usp=sharing

WebIQ UAT/Pilot Full IQ link:
http://iq6pilot.etnet.com.hk/WebIQ/index.html

WebIQ UAT/Pilot MIQ link:
http://iq6pilot.etnet.com.hk/WebIQ/miqDemo.html

========= End of Document =========