afb-client/README.md

   1 ### Sample client application for Application Framework Binder
   2
   3 ![AFB-Client screenshot](http://iot.bzh/images/afb-client.jpg)
   4
   5 _(Application Framework Binder can be found on https://github.com/iotbzh/afb-daemon)_
   6
   7 ## Installation
   8
   9 Install HTML5 development toolchain on your host
  10
  11     1. Check out this repository
  12        git clone https://github.com/iotbzh/afb-client.git
  13
  14     2) Install NodeJs [not used on target]
  15        zypper install nodejs
  16        yum install nodejs
  17
  18     3) Install building tools [bower, gulp, ....]
  19        npm install # this install all development tool chain dependencies
  20        sudo npm install --global gulp  # this is not mandatory but it will make your live simpler
  21
  22
  23 ### Overload ./app/etc/AppDefaults.js with '.noderc.js'
  24     var config= {
  25         APPNAME : 'AFBclient',   // AppName is use as main Angular Module name
  26         FRONTEND: "Frontend",    // HTML5 frontend  [no leading ./]
  27         BACKEND : "Backend",     // NodeJS Rest API [no leading ./]
  28         URLBASE : '/opa/',       // HTML basedir when running in production [should end with a /]
  29         APIBASE : '/api/',       // Api url base dir [should end with a /]
  30     };
  31     module.exports = config;
  32
  33     WARNING: in current development version Frontend/services/AppConfig.js is not updated automatically
  34     you should manually assert that backend config is in sync with frontend config.
  35
  36 ### Build project
  37     gulp help
  38     gulp build-app-dev
  39     rsync -az dist.dev xxxx@agl-target:afb-client
  40
  41 ### Test with Application
  42
  43     # Start AppFramework Binder
  44         export MYWORKSPACE=$HOME/Workspace
  45         $MYWORKSPACE/afb-daemon/build/afb-daemon --port=1234 --verbose --token=123456789 --rootdir=$MYWORKSPACE/afb-client/dist.dev
  46
  47     Point your browser onto: http://agl-target:1234/opa
  48
  49     Note:
  50       - do not forget '/opa' that should match with your config.URLBASE
  51       - if you change --token=xxxx do not forget to update ./Frontend/pages/HomeModules.js
  52       - Force HTML/OPA reload with F5 after each HTML5/OPA update or new pages may not be loaded.
  53       - When reloading HTML/OPA with F5 do not forget that your initial token wont be accepted anymore. You should either:
  54         + restart to clean existing session
  55         + cleanup AJB_session cookie
  56         + start an anonymous web page to get a fresh and clean environment.
  57
  58 ### Move to Target
  59     cd $MYWORKSPACE/afb-client
  60     gulp build-app-prod
  61     scp -r ./dist.prod/* user@mytarget:/rootdir/afb-client
  62     ssh user@mytarget "afb-daemon --port=3001 --token='' --rootdir=/rootdir/afb-client"
  63     http://mytarget:3001/opa
  64
  65 ### Directory structure
  66     /AppClient
  67     |
  68     |---- package.json
  69     |---- bower.json
  70     |---- gulpfile.js
  71     |
  72     |---- /Frontend
  73     |     |
  74     |     |---- index.html
  75     |     |---- app.js
  76     |     |
  77     |     |---- /styles
  78     |     |     |
  79     |     |     |---- _settings.scss
  80     |     |     |---- app.scss
  81     |     |
  82     |     |---- /Widgets
  83     |     |     |
  84     |     |     |--- Widget-1
  85     |     |     |...
  86     |     |
  87     |     |-----/Pages
  88     |           |--- Home-Page
  89     |           |...
  90     |
  91     |
  92     |---- (/dist.dev)
  93     |---- (/dist.prod)
  94