@hmcts/ctsc-web-chat

    0.3.12 • Public • Published

    ctsc-web-chat

    Node module for CTSC web chat service

    Quick start

    # Add this module as a dependency to your web application using Yarn: 
    yarn add @hmcts/ctsc-web-chat

    Table of Contents

    Usage

    This node module packages the CSS and javascript required to support the HMCTS CTSC web chat service. Once the node module has been added into your own web application, you should ensure that the assets/css and assets/javascript directories are added to your web server configuration for serving static files. For example, if using Express:

    app.use('/webchat', express.static(path.join(__dirname, '/node_modules/@hmcts/ctsc-web-chat/assets')));

    This allows the CSS to be accessed via /webchat/css/hmcts-webchat.css and the javascript to be accessed via /webchat/javascript/hmcts-webchat.js.

    In the page where you want the chat link to appear, you need to create an empty div element with id ctsc-web-chat:

    <div id="ctsc-web-chat"></div>

    And at the end of the page, include the javascript, and finally call the webchat_init function, for example:

    <script src="/webchat/javascript/hmcts-webchat.js"></script>
    <script nonce="{{ nonce }}">
        webchat_init({
            uuid: 'script_12345678',
            tenant: 'abc123',
            channel: 'My service',
            stylesheetURL: '/webchat/css/hmcts-webchat.css'
        });
    </script> 

    The webchat_init function takes a dictionary consisting of the following parameters:

    Parameter Default Description
    uuid n/a UUID value (obtain this from CTSC team)
    tenant n/a tenant ID value (obtain this from CTSC team)
    channel n/a Channel name (obtain this from CTSC team)
    stylesheetURL n/a URL of the webchat stylesheet (from this node module). This should either be absolute and starting 'https:', or a path relative to root. The CSS must be served over CSS; if it isn't (for instance running locally for development), a URL pointing to the github master CSS mirrored in jsdelivr (to deliver the correct MIME type) will be used instead
    busPublishInfo n/a Optional dictionary object of information to be passed to agent e.g. { 'Logged in ID': sLoginId, 'Case ID': sCaseId }
    busPublishLanguage 'en' Language to display text in web chat window. 'en' is English, 'cy' is Welsh.
    domain 'https://vcc-eu4.8x8.com' 8x8 domain (this should not need to be changed)
    path '/.' Path to 8x8 javascript (this should not need to be changed)
    buttonContainerId 'ctsc-web-chat' The ID of the div element where the link should be rendered
    linkText 'Chat online with an agent', The text to be displayed in the link that activates the web chat
    additionalText '(Monday to Friday, 9.00am to 5.00pm)' Additional text to be displayed under the link that activates the web chat

    LICENCE

    This project is licensed under the MIT License - see the LICENSE file for details.

    Install

    npm i @hmcts/ctsc-web-chat

    DownloadsWeekly Downloads

    216

    Version

    0.3.12

    License

    MIT

    Unpacked Size

    101 kB

    Total Files

    13

    Last publish

    Collaborators

    • adamsilver
    • adrianc
    • andrewwa-kainos
    • bendiggle
    • damdun
    • dharmendrak
    • ellie-harrison
    • hemantt
    • jenkins-reform-hmcts
    • p.jar
    • pragnesh
    • robertparkinson
    • sabah.irfan
    • timja
    • timja-hmcts
    • trevorsaint