@asfsl/cubu-elements NPM

cubu Elements

Serve Locally

$ npm start

Local testing pages:

http://localhost:3333/pages/service-button

http://localhost:3333/pages/service-panel?serviceId=e1cc4e1b-1454-474c-af07-1b0d520e66fd&lang=he

http://localhost:3333/pages/queue-info?serviceId=e1cc4e1b-1454-474c-af07-1b0d520e66fd&lang=he

Deploy to NPM

Log in to NPM (npm login)
Update the package version number in package.json
Build the package (npm run build)
Publish to NPM (npm publish --access public)

Using the package in an HTML page

Add the script tag:

<script
  type="module"
  src="https://unpkg.com/@asfsl/cubu-elements/dist/cubu/cubu.esm.js"
></script>
<script
  nomodule=""
  src="https://unpkg.com/@asfsl/cubu-elements/dist/cubu/cubu.js"
></script>

Add the cubu element tag in the HTML page

Overriding Firebase configuration

If you want the elements to connect to different environments (other than Prod), you must override the Firebase configuration. This is done by setting the global variable __cubu_config__ on the page hosting the element.

For example, to use the Dev environment, put the following script in the page section:

<script type="text/javascript">
  window.__cubu_config__ = {
    apiKey: 'AIzaSyBndsCXxIsI5T5CYJDmpUtgXUoefmrICQw',
    authDomain: 'cubu-dev-161b0.firebaseapp.com',
    databaseURL: 'https://cubu-dev-161b0.firebaseio.com',
    projectId: 'cubu-dev-161b0',
    storageBucket: 'cubu-dev-161b0.appspot.com',
    messagingSenderId: '1029635667820',
    appId: '1:1029635667820:web:4386f4f25b7bdddb326549',
    measurementId: 'G-CFRWPD6V74',
  };
</script>