blob: cab879e72f8be76d2983f12d1a33743863bdbdf6 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
|
# Template HTML5 Application for Application Framework Binder
## Setup
Install HTML5 development toolchain on your host
```
$ curl -sL https://deb.nodesource.com/setup_6.x | sudo -E bash -
$ sudo apt-get install nodejs
$ sudo npm install --global gulp
```
Then install NodeJS dependencies
```
$ cd html5 # or the project directory
$ npm install
```
## Overload ./app/etc/AppDefaults.js with '.noderc.js'
```
var config= {
APPNAME : 'xxxxxx-html5', // AppName is use as main Angular Module name
FRONTEND: "Frontend", // HTML5 frontend [no leading ./]
BACKEND : "Backend", // NodeJS Rest API [no leading ./]
URLBASE : '/opa/', // HTML basedir when running in production [should end with a /]
APIBASE : '/api/', // Api url base dir [should end with a /]
};
module.exports = config;
```
WARNING: in current development version Frontend/services/AppConfig.js is not updated automatically
you should manually assert that backend config is in sync with frontend config.
## Development build and deployment (development phase)
```
$ gulp help
$ gulp build-app-dev
$ BOARDIP=1.2.3.4 # change by your board IP address
$ rsync -Pav dist.dev/ root@$BOARDIP:xxxxxx-html5-dev/
```
## Test Application
Start AppFramework Binder:
```
$ ssh root@$BOARDIP
# afb-daemon --port=1234 --verbose --token=123456789 --rootdir=~/xxxxxx-html5-dev
```
Point your browser onto: http://$BOARDIP:1234/opa?token=123456789
Note:
- do not forget '/opa' that should match with your config.URLBASE
- if you change --token=xxxx do not forget to update ./Frontend/pages/HomeModules.js
- Force HTML/OPA reload with F5 after each HTML5/OPA update or new pages may not be loaded.
- When reloading HTML/OPA with F5 do not forget that your initial token wont be accepted anymore. You should either:
+ restart to clean existing session
+ cleanup AJB_session cookie
+ start an anonymous web page to get a fresh and clean environment.
## Create application package and install on target
Simply run:
```
$ gulp widget-prod
```
This should produce a .wgt file in the current directory. You can then install the widget file onto the target and run the application using application framework utilities:
```
$ scp *.wgt root@$BOARDIP:~/
$ ssh root@$BOARDIP
# afm-util install xxxxxx-html5.wgt
# afm-util start xxxxxx-html5@0.1
```
## Directory structure
/AppClient
|
|---- package.json
|---- bower.json
|---- gulpfile.js
|
|---- /Frontend
| |
| |---- index.html
| |---- app.js
| |
| |---- /styles
| | |
| | |---- _settings.scss
| | |---- app.scss
| |
| |---- /Widgets
| | |
| | |--- Widget-1
| | |...
| |
| |-----/Pages
| |--- Home-Page
| |...
|
|
|---- (/dist.dev)
|---- (/dist.prod)
|