This is a sample project using Genesys Cloud Embeddable Framework. This project is written in Javascript using Ember Framework.
Different methods of the Genesys Cloud Embeddable Framework are used in this project such as Click to Dial, Screen Pop Up, Process Call Logs and Contact Search.
This sample contains dynamic setting of the framework.js configuration items.
/public/framework.jsContains modified framework.js file from Genesys Cloud Embeddable Framework example. This file will get dynamic values from URL parameters./app/templates/application.hbsHTML template for the web app. Includes the embedded iframe for the softphone. The 'src' attribute is dynamically generated from data stored in the localStorage. This value could also be generated server side or by any means where the iframe's property can be modified./app/components/framework-config.jsContains the actions for events when the user changes any settings in the configuration page. This calls the service framework-config which handles the actual logic of storing and updating the values to the browser's localStorage./app/services/framework-config.jsContains the logic behind saving/loading the configuration values to and from the localStorage. In production, this is recommended to be put into a proper backend storage/database.
When there is an incoming interaction, the PEF_SearchValue and PEF_URLPop attributes would determine which page the user will be redirected to.
/public/framework.jsscreenPop method should be included in this file./app/components/windows-event-listener.jsThis file contains the implementation of the screenPop method.
/public/framework.jsaddCustomAttributes method should be included in the window.addEventListener of this file./app/components/contact/contact-details.jsThis file contains the implementation of the addCustomAttributes method.
/public/framework.jsaddAssociation method should be included in the window.addEventListener of this file./app/components/contact/contact-details.jsThis file contains the implementation of the addAssociation method.
/public/framework.jsclickToDial method should be included in the window.addEventListener of this file./app/components/phone-number.jsThis file contains the implementation of the clickToDial method.
/public/framework.jscontactSearch method should be included in this file./app/components/windows-event-listener.jsThis file contains the implementation of the contactSearch method. As an example, Weather Line is added as an external contact for this application.
/public/framework.jsaddTransferContext method should be included in the window.addEventListener of this file./app/components/windows-event-listener.jsThis file contains the implementation of the addTransferContext method.
/public/framework.jsprocessCallLog method should be included in this file./app/components/windows-event-listener.jsThis file contains the implementation of the processCallLog method.
/public/framework.jsupdateStatus method should be included in the window.addEventListener of this file./app/controllers/application.jsThis file contains the implementation of the updateStatus method.
/public/framework.jsgetTranscript method should be included in the window.addEventListener of this file./app/components/windows-event-listener.jsThis file contains the implementation of the getTranscript method.
You will need the following things properly installed on your computer.
- Git
- Node.js (with npm)
- Ember CLI
- Google Chrome
git clone <repository-url>this repositorycd pefnpm install
ember serve- Visit your app at https://localhost.
- Visit your tests at https://localhost/tests.
Make use of the many generators for code, try ember help generate for more details
ember testember test --server
npm run lint:hbsnpm run lint:jsnpm run lint:js -- --fix
ember build(development)ember build --environment production(production)
Specify what it takes to deploy your app.