{"_id":"@arvato-crm/acai-chatwidget","_rev":"3-9a60252c970bd428b1a951a22a6a5983","name":"@arvato-crm/acai-chatwidget","dist-tags":{"latest":"0.2.4"},"versions":{"0.2.2":{"name":"@arvato-crm/acai-chatwidget","version":"0.2.2","description":"ACAI Chat Widget for BotFramework-WebChat","files":["dist","botframework-webchat-license.txt"],"main":"dist/acai-chatwidget.js","scripts":{"build":"rimraf dist && webpack -d","build:watch":"rimraf dist && webpack -w","build:release":"rimraf dist && webpack -p","deploy":"npm run build:release && npm publish && npm --no-git-tag-version version patch"},"author":{"name":"Uwe Mannl","email":"uwe.mannl@bertelsmann.de"},"license":"SEE LICENSE IN license.md","dependencies":{},"devDependencies":{"babel-core":"^6.26.0","babel-loader":"^7.1.2","babel-preset-env":"^1.6.1","botframework-webchat":"0.11.4","css-loader":"^0.28.9","ejs-compiled-loader":"^1.1.0","extract-text-webpack-plugin":"^3.0.2","file-loader":"^1.1.6","node-sass":"^4.7.2","rimraf":"^2.6.2","sass-loader":"^6.0.6","style-loader":"^0.20.1","url-loader":"^0.6.2","webpack":"^3.10.0"},"_id":"@arvato-crm/acai-chatwidget@0.2.2","_npmVersion":"5.6.0","_nodeVersion":"8.9.4","_npmUser":{"name":"uwem","email":"uwe.mannl@bertelsmann.de"},"dist":{"integrity":"sha512-i2hXh4MluQy9LGSU8YYAmROAIQvPudeEa4KhN1tgicPX5QetMmtUJHBHFnlkFffVfJkKaT7rlqnbzgREwWr00A==","shasum":"bd06ddbc770c57fc241c4f124fba30c35ef2c2ee","tarball":"https://registry.npmjs.org/@arvato-crm/acai-chatwidget/-/acai-chatwidget-0.2.2.tgz","fileCount":7,"unpackedSize":518798,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAIDtVYvi7Au0e1CNkcqkXX1trVlnXYNdb4efxeLe8LtAiBkXtnnnR6m5frxHRXzdfsD2gO/aaAJ6YtInSfiuEIneA=="}]},"maintainers":[{"name":"ogeisser","email":"oliver.geisser@gmail.com"},{"name":"uwem","email":"uwe.mannl@bertelsmann.de"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/acai-chatwidget_0.2.2_1519030333948_0.46384723041929177"},"_hasShrinkwrap":false},"0.2.4":{"name":"@arvato-crm/acai-chatwidget","version":"0.2.4","description":"ACAI Chat Widget for BotFramework-WebChat","files":["dist","botframework-webchat-license.txt","demo"],"main":"dist/acai-chatwidget.js","scripts":{"build":"rimraf dist && webpack -d","build:watch":"rimraf dist && webpack -w","build:release":"rimraf dist && webpack -p","deploy":"npm run build:release && npm publish --access public && npm --no-git-tag-version version patch"},"author":{"name":"Uwe Mannl","email":"uwe.mannl@bertelsmann.de"},"license":"SEE LICENSE IN license.md","dependencies":{"botframework-webchat":"0.12.1"},"devDependencies":{"babel-core":"^6.26.0","babel-loader":"^7.1.2","babel-preset-env":"^1.6.1","css-loader":"^0.28.9","ejs-compiled-loader":"^1.1.0","extract-text-webpack-plugin":"^3.0.2","file-loader":"^1.1.6","node-sass":"^4.7.2","rimraf":"^2.6.2","sass-loader":"^6.0.6","style-loader":"^0.20.1","url-loader":"^0.6.2","webpack":"^3.10.0"},"_id":"@arvato-crm/acai-chatwidget@0.2.4","_npmVersion":"5.6.0","_nodeVersion":"9.11.1","_npmUser":{"name":"uwem","email":"uwe.mannl@bertelsmann.de"},"dist":{"integrity":"sha512-zeVQzkHQiU0pCJ8bFwHOPuJbFBmUOgboNlJa5cDyFjTHGgSkqXgSu0pjH5DudQ8LAWsDQxjhhAIAy3k2r8S6sg==","shasum":"923739a0d6f124a118dd08185fc2cd09e82962cf","tarball":"https://registry.npmjs.org/@arvato-crm/acai-chatwidget/-/acai-chatwidget-0.2.4.tgz","fileCount":8,"unpackedSize":561043,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJa4cRHCRA9TVsSAnZWagAA/CsP/0DubCwsLpIlL2TQj1pO\nkLBrdsZzUjQA2VYPQKpcgaQJ0JgSqBxSwxurVTFtussxBD/HpxVfXZCnbQ+r\nuc0gn1C5MqXkX6/Fw9PtlGvcA6GNyVF3gLr3rfDvia4DEk1K2zrUDzWDLM50\nyxDXEeM5qT2vUyS5uMGAbzTyYkM7uB3eIfRU3mo7OChdOk6uKueXrwgB7qPY\nta5qSHPJ8oKuXKvy3S9Y0dgJFomPv2lZPmSNIxdBay+/rhtyQXJqUU3UThEH\no/wjpequMx/Im7ujGDmVDueNG56wTlRP5TVJAXxGPk79N94+D1KYpPn5eGIM\nnH37OM8o5xLECIvQFbdcCJs4PGZXlO53bpzvYcw668/A0gjf2TgVBE+Rnf5L\niydXubM9XVv/cAoGPJSc1Cruuc6y0ua3ow/ySspagId9k0IGl1JR/WoVhb+8\nLFVefZG+1Gab/8Ufe54NgS5Wsp06fy+CJbRgGbBJGTkLgZV4EgR+Wawo5ptW\nvJl/2HAdFb/oDv+0HiCX9ptNA4TGdd+IlyFqDs9K4ad1JsBAJ4BLZ8u0iiav\nLkKMJFhcMPAJSVswULS75hCT+tKMFPMTOVI1wVmDoMe7haKLKc20TCaq86Hg\nFWxRQSbsZMzoWaggVtbPrpGoO+XRcm4wAGgi7VQak5WB7eWN4AMsCb8x5T3o\n4bfJ\r\n=vPcr\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAlmZAKP2Z9Chp+vVnvRXrRLsu4k09wxjXGCN2RSvH3dAiBSUXIVLSe/U3rO+d/Ehsdec0WekV3KVB1WPtWfwltzxg=="}]},"maintainers":[{"name":"ogeisser","email":"oliver.geisser@gmail.com"},{"name":"uwem","email":"uwe.mannl@bertelsmann.de"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/acai-chatwidget_0.2.4_1524745286314_0.9804777295747027"},"_hasShrinkwrap":false}},"time":{"created":"2018-02-19T08:52:13.851Z","0.2.2":"2018-02-19T08:52:14.059Z","modified":"2022-04-04T15:41:12.566Z","0.2.4":"2018-04-26T12:21:26.480Z"},"maintainers":[{"name":"ogeisser","email":"oliver.geisser@gmail.com"},{"name":"uwem","email":"uwe.mannl@bertelsmann.de"}],"description":"ACAI Chat Widget for BotFramework-WebChat","author":{"name":"Uwe Mannl","email":"uwe.mannl@bertelsmann.de"},"license":"SEE LICENSE IN license.md","readme":"# ACAI-ChatWidget\n\n![Built with love](http://forthebadge.com/images/badges/built-with-love.svg)\n\n**An easy to use web widget for the [Microsoft Bot Framework Web Chat](https://github.com/Microsoft/BotFramework-WebChat)**\n\n## Usage\n\nThe **ACAI-ChatWidget** can be used in two ways:\n* in a pure HTML website (no webpack/npm or any other module system)\n* in a web application as npm package\n\n### HTML page\n\nCurrently there is no CDN to deliver the bundle. You can build a **ACAI-ChatWidget** release (see below) and use the js and css file from *./dist/* folder.\n\nPlace the files on your server and link to them:\n\n```html\n<head>\n    <script src=\"acai-chatwidget.js\"></script>\n    <link href=\"acai-chatwidget.css\" rel=\"stylesheet\" />\n</head>\n<body>\n    ...\n    <!-- DIV tag must be above initialization script -->\n    <div id=\"BotChatGoesHere\"></div>\n\n    <script>\n        var botChatDiv = document.getElementById('BotChatGoesHere');\n\n        var config = {\n            // use example config from section Configuration below\n            ...\n        }\n\n        ACAI.ChatWidget(config, botChatDiv);\n    </script>\n    ...\n</body>\n```\n\n#### Build release\n\n* Checkout from acai repository\n* Change into *acai/acai-chatwidget*\n* Run `npm install` to download all dependencies\n* Run `npm run build:release` to build a release\n* Release will be available at *./dist/*\n\n#### Example\n\nYou can find a complete example in *./demo/index.html*. You only have to set directLineSecret and botId.  \nRun `npm run build:watch` to build a **ACAI-ChatWidget** release and open the HTML in your Browser.\n\n### npm package\n\nYou need to use our own Nexus server https://nexus.iaas-at-mit.de/ and one of the following repositories in your *.npmrc*\n* https://nexus.iaas-at-mit.de/content/groups/npm-all/ (preferred)\n* https://nexus.iaas-at-mit.de/content/groups/npm-internal/\n\n**.npmrc**\n```Makefile\n...\nregistry=https://nexus.iaas-at-mit.de/content/groups/npm-all/\n...\n```\n\nInstall the ACAI-ChatWidget via `npm install --save @arvato-crm/acai-chatwidget` and use following code to include it in your JavaScript:\n\n```javascript\nimport * as ACAI from 'acai-chatwidget';\nimport 'acai-chatwidget/dist/acai-chatwidget.css';\n\nvar botChatDiv = document.getElementById('BotChatGoesHere');\n\nvar config = {\n    // use example config from section Configuration below\n    ...\n}\n\nACAI.ChatWidget(config, botChatDiv);\n```\n\n#### Example\n\nYou can find a complete example in the acai git repository under *acai/acai-chatwidget-npm-example*. Open the `readme.md` to find information how the example works.\n\n### Configuration\n\nThe necessary configuration contains following entries:\n```javascript\nvar config = {\n    botChat: {\n        directLineSecret: '<secret>', // Direct Line Secret for Microsoft Bot Framework Web Chat\n        botId: 'MyBot', // ID of this bot\n        userId: '0815', // [optional] ID of user, if not set a random userId will be used\n        userName: 'Customer', // [optional] name of user, it not set the userId will  be used\n        initialMessage: '42' // [optional] initial message to trigger response from bot\n    },\n    ui: {\n        bubbleDelay: 2000, // delay until bubble is shown\n        bubbleTextDelay: 2500, // delay until text at bubble is shown\n        bubbleText: 'Whazaaaap?!', // label in bubble text\n        chatTitle: 'Your ad here' // label in sidebar chat title\n    }\n}\n```\n\n### Styling\n\nThe easiest way to create a custom style for **ACAI-ChatWidget** is to use the `acai-chatwidget.scss` file from *./res/*:\n* Copy the SASS file from this repo to your own project and call it `acai-chatwidget-override.scss`\n* Modify the file at your wishes\n  * You can define font, colors and spaces easily with variables\n  * Don't forget to create your own icons and set the icon files in the corresponding variables\n* Depending on your usage of **ACAI-ChatWidget** use one of the following ways to include the new style file to your page\n\n#### HTML page\n\nCompile the new sass file `acai-chatwidget-override.scss` to css with a tool of your choice and link to it in your HTML after `acai-chatwidget.css`:\n\n```html\n<head>\n    <script src=\"acai-chatwidget.js\"></script>\n    <link href=\"acai-chatwidget.css\" rel=\"stylesheet\" />\n    <link href=\"acai-chatwidget-override.css\" rel=\"stylesheet\" />\n</head>\n```\n\n#### npm package\n\nAdd `sass-loader` to your project if not present and configure webpack to load `.scss` files.\nImport the `acai-chatwidget-override.scss` after  `acai-chatwidget.css`:\n\n```javascript\nimport * as ACAI from 'acai-chatwidget';\nimport 'acai-chatwidget/dist/acai-chatwidget.css';\nimport '<path>/acai-chatwidget-override.scss';\n```\n\n## Development\n\nSource code needed 😉\n\n### on-the-fly development\n\nUseful to develop the default web design.\n\nRun `npm run build:watch` to build the release in *./dist/* with regarding of changes in source files (js and scss, latter will be compiled to css).\nOpen *./demo/index.html* with any web browser. Reload page after changes are made (no auto reload yet).\n\n### npm scripts\n\n| script | effect |\n| ------ | ------ |\n| `npm run build` | delete old release and build new dev release in *./dist/* |\n| `npm run build:watch` | delete old release and build new dev release in *./dist/*, watches the filesystem for changes |\n| `npm run build:release` | delete old release and build new release in *./dist/*, ready to publish |\n| `npm run deploy` |  build release and publish to npmjs to org @arvato-crm, afterwards increment build number |\n\n### Library for Microsoft Bot Framework Web Chat\n\nThere are three ways to include Microsoft Bot Framework Web Chat into this npm package:\n* use Microsoft Bot Framework Web Chat npm package `botframework-webchat`\n  * import via `import * as BotChat from 'botframework-webchat/botchat.js;` and `import 'botframework-webchat/botchat.css';` in *index.js*\n  * **HINT**: framework version should be set to a fixed value in *package.json*!\n  * **!!! THIS IS HOW IT IS CURRENTLY DONE !!!**\n* use prebuilt library from github release page https://github.com/Microsoft/BotFramework-WebChat/releases and place it in *./lib/* folder\n  * import via `import * as BotChat from '../lib/botchat.js';` and `import '../lib/botchat.css';` in *index.js*\n* clone repo from github https://github.com/Microsoft/BotFramework-WebChat.git, use instructions to build a botframework-webchat release (https://github.com/Microsoft/BotFramework-WebChat, chapter Building Web Chat) and place the release files in *./lib/* folder\n  * import via `import * as BotChat from '../lib/botchat.js';` and `import '../lib/botchat.css';` in *index.js*\n\n## Folders and files\n\n### Dev files in *./src/*\n* `ACAI.js` - code to provide ACAI-JS-module\n* `ChatWidget.js` - module to start BotChat\n* `acai-chatwidget.ejs` - html template to embedd in given DOM element\n\n### Ressource files in *./res/*\n* `bot.svg`, `bot-bubble.svg` - icons for chat bubble and sidebar title\n* `acai-chatwidget.scss` - styling for chat bubble and style override for CSS of Microsoft Bot Framework Web Chat\n\n### Library files in *./lib/*\n* `botchat.js`, `botchat.css` - code from Microsoft Bot Framework Web Chat, downloaded from github oder built from github code via npm\n\n### Release in *./dist/*\n* release files (built with `npm run build[:watch|:release]`)\n  * to include in HTML (when used without wepback/npm)\n  * to publish to NPM\n\n### Demo in *./demo/*\n*  `index.html` - open in browser, see chapter **on-the-fly development**\n","readmeFilename":"readme.md"}