Slack widgets to Mozaik dashboard
JavaScript CSS


Module provides some Slack widgets for Mozaïk dashboard.



Follow the steps to install and configure widget into dashboard


  • Install module in dashboard directory:

    npm install -S mozaik-ext-slack
  • Register client api by adding to dashboard src/server.js:

    // NOTE: Widget uses push method to delivery messages!
    import slack from 'mozaik-ext-slack/client';
    mozaik.bus.registerApi('slack', slack, 'push');
  • Register widgets by adding to dashboard src/App.jsx:

    import slack from 'mozaik-ext-slack';
    mozaik.addBatch('slack', slack);
  • Build the dashboard:

    npm run build-assets




Set api and widget configuration values in dashboard config.js. See followup sections for details.

module.exports = {
  // Configure api
  api: {
    slack: {
      // Slack api token
      // $SLACK_TOKEN
      token: 'valuefromslack',

      // NOTE: Following config parameters are OPTIONAL!
      // Download the uploaded images and show them in dashboard
      showImages: true,
      // Directory where the static files are hosted from. Needed for images. Defaults to cwd() + './build'
      publicDir: '/path/to/mozai-demo/build',
      // The age of temp images to delete
      maxImageAge: '8 hours',

  // Set widgets
  dashboards: [
    columns: 2,
    rows: 2,
    // See next sections for details
    widgets: [
        type: '',
        channel: 'general',
        showPulse: true,
        columns: 1, rows: 1,
        x: 0, y: 0
        type: 'slack.pulse',
        columns: 1, rows: 1,
        x: 1, y: 0

Finally, start the dashboard with command:

node app.js


Show pulsating circle for each message sent in Slack channel(s)




key required description
title no Textual title to show. Example: '#mychannel'.
channel no Name of the channel to follow. Defaults to all public channels where token has permissions to
imageSize no Scaling of image: initial, cover, contain. Default to initial
showImages no Show images or not. Defaults to true
showPulse no Show pulse visualisation on each message or not. Defaults to false
keyword no Show only message containing the defined keyword. Supports regexp like ^foo. For file upload, the match is done against initial comment or title
config no Override default pulse config parameters or colors. See source code for details


  type: 'slack.pulse',
  channel: 'general',
  columns: 2, rows: 1,
  x: 1, y: 0

Widget: slack.pulse

Show pulsating circle from each message sent in Slack channel(s)



key required description
channel no Name of the channel to follow. Defaults to all public channels where token has permissions to
title no Textual title to show. Example: '#mychannel'.


  type: 'slack.pulse',
  channel: 'general',
  columns: 2, rows: 1,
  x: 1, y: 0


Distributed under the MIT license


Release 0.8.0

  • Added support for restoring latest message from browser storage

Release 0.7.2

  • Updated documentation

Release 0.7.1

  • Show pulse only on new API data

Release 0.7.0

  • Add support for keywords: Show only messages matching with the rule

Release 0.6.0

  • Add support to show pulse within channel widget

Release 0.5.0

  • Adjust font size automatically: Based on given size and length of text
  • Improved ripple to have random location and more configurable outcome
  • Fixed #7: Show bot messages
  • Created echoMessage for testing purpsoses

Release 0.4.0

  • Added support for pulse configuration
  • Multiple ripples per message

Release 0.3.1

  • Improved error cases and logging

Release 0.3.0

  • Added support for showing images
  • Added support for showing emojis
  • Added duration info since previous message
  • Improved message formatting

Release 0.2.0

  • Added since time information
  • Fixed issue when having multiple pulse widgets
  • Improved style

Release 0.1.0

  • Initial somewhat working version