Customer Self-Care Web UI

Development

Please follow these steps to set up a development environment for ngcp-csc-ui.

Node and npm

First make sure you have Node.js and npm installed, and then install and build the app.

1. Install latest Node.js v6 and npm v3. It's recommended to install and use nvm to make sure you're using the right versions

2. Clone the ngcp-csc-ui repo locally

3. Run npm install

   npm install

4. Build the app for dev

   npm run dev-build

Vagrant

To run this app you also need to have a vagrant-ngcp environment up and running.

1. Go to your local vagrant-ngcp folder, for example

   cd ~/Sipwise/mr/vagrant-ngcp

2. Spin up a new vagrant box

   ./v n pro1

3. SSH into vagrant box and become root

   ./v s pro1 sudo -s

4. Edit config.yml

   vim /etc/ngcp-config/config.yml

5. Enable csc by finding the the "http_csc:" section of the file, and setting "csc_js_enable:" to yes

   csc_js_enable: yes

6. Run ngcpcfg apply

   ngcpcfg apply 'Enable http_csc'

7. Navigate into the vagrant shared local folder (configured via custom_config file in local vagrant-ngcp/users.d/ folder) and execute dev.sh script to set up symlink between local built files and vagrant files served via nginx

   cd /usr/local/devel/ngcp-csc-ui/ ./dev.sh

You can now access ngcp-csc-ui in browser by using the url provided by the vagrant script.

PBX Customer

You need a pbx subscriber to be able to access the pbx config specific modules in ngcp-csc-ui as a user. To create a pbx subscriber we first need to enable pbx in vagrant.

1. SSH into the vagrant box and become root

   ./v s pro1 sudo -s

2. Edit config.yml

   vim /etc/ngcp-config/config.yml

3. Enable csc by finding the "pbx:" section of the file, and setting "enable:" to yes

   enable: yes

4. Enable write access for subscriberadmins by adding "write" to subscriber privileges as in the following example

       www_admin
         privileges:
           subscriberadmin:
             subscribers:
             - write
   

5. Run ngcpcfg apply

   ngcpcfg apply 'Enable pbx'

6. Log in to ngcp-panel with administrator credentials

7. Go to Settings > Customers

8. Look for customer row with "Cloud PBX Account" written in "Product" column, and click "Details" for that row

9. Go to Subscribers, and click "Create Subscribers". It's good to note that the first subscriber we create becomes the "pilot" for this customer

10. In the "Domains" section, select the row with your local vagrant ip address shown in the "Domain" column

11. For E.164 Number input a dummy number, for example 43 12 34567

12. Input dummy "Display Name", "Email", "Web Username/Password", and "Sip Username/Password", and make sure to select "Administrative", then press "Save"

13. Create another subscriber. This new subscriber (and all subsequent ones) will then becomes a normal pbx subscriber

14. For normal subscribers input an extension in addition to the other fields mentioned above (including "Administrative"), then press "Save"

Now you can log in to csc with one of the normal subscriber you just created. URL for login is the same as for accessing ngcp-panel admin, except with csc suffix and no port specified:

https://<your-ip-address>/csc

How to add new npm package

1. Remove the package if you've already installed it

   npm remove <package> <--save-dev || --save>

2. Ensure that you have a clean node_modules folder rm -R node_modules/ npm install

3. Remove obsolete shrinkwrap file

   rm npm-shrinkwrap.json

4. Install new package(s)

   npm install packageA packageB --save-dev

5. Generate new shrinkwrap file including all dependencies

   npm shrinkwrap --dev

   You should see the following result in console:

   wrote npm-shrinkwrap.json

6. Add new shrinkwrap file to git

   git add .

Contributing

See our Contributing Guide file) for information on how to contribute.