• Installer should provide more verbose feedback when installing packages
• Figlet for logo
• Usage

I have 2 different environments. 1 is Ubuntu 14.04 2 is Mac

First i tried with ubuntu.

Installed vudash
create sample dashboard and it works.
I changed default dashboard with this:

{
  "name": "Happy",
  "layout": {
    "columns": 5,
    "rows": 4
  },
  "datasources": {
    "datasource-exchange-rates": { 
      "module": "@vudash/datasource-rest",
      "schedule": 30000,
      "options": {
        "url": "https://blockchain.info/ticker",
        "method": "get",
        "graph": "USD.last" 
      }
    }
  },
  "widgets": [
    {
      "position": {
        "x": 1,
        "y": 0,
        "w": 3,
        "h": 1
      },
      "widget": "vudash-widget-statistic",
      "datasource": "datasource-exchange-rates",
      "history": 100
    }
  ]
}

And got this error:

Module @vudash/datasource-rest could not be resolved as an NPM module or a local module

I also tried to start vudash with NODE_PATH=. vudash

but it didn't resolve my problem.

Than i decided to run it on Mac

Installed vudash. create a default dashboard and start vudash

And i got this error even with the default dashboard:

Module vudash-widget-time could not be resolved as an NPM module or a local module

Is there a problem with the module installer?

• Increase font size for visibility
• Slightly dim font colour

It would be useful to have an extension point to load dashboards from an external source. I'd like to add and updates dashboards without a redeploy.

• Single entrypoint for rollup should be generated dashboard javascript

Is there any way to customise the look of Vudash using a css file? Adding it inline in the json file is a bit awkward :) Thanks!

Create a widget which lists X number of tasks from any of the above task-tracking systems, along with completion etc.

When using the Jq transformer, its documented that one should use the following config for a transformation

"transformations": [
    {
      "transformer": "@vudash/transformer-jq",
      "options": ".a.big.json | [\"empty\", .[1], \"useless\", .[3]] | join(\" \")"
    }
  ],

However, this results in a invalid configuration, as there should be a value key in the options object.
I propose to change the configuration of the JQ transformer to

"transformations": [
    {
      "transformer": "@vudash/transformer-jq",
      "options": {
            value: ".a.big.json | [\"empty\", .[1], \"useless\", .[3]] | join(\" \")"
        }
    }
  ],

And then in the transformer.js use this.transformation = transformation.value

Another solution would be to remove the required value from the configuration validation.

Right now, the widget -> datasource relationship is back to front.

From version 8, datasources should manage polling of data and emit events when that data changes. Widgets can then update data if required.

Might be a nice way to tie the various components of a widget together without having to force people into the learning curve of react.

• http://riotjs.com/
• Preact

Once transports are finished, pull out internal widgets into separate widget modules.

• Gauge
• Progress
• Health

Not sure if I am doing something wrong, but I have followed the quick install and tried to open default dashboard and got following:

npm run-script start

> my-vudash-dashboard@ start C:\_WWW\ipp-vudash
> vudash

Loading dashboards from C:\_WWW\ipp-vudash
Server running
Dashboards available:
simple-dashboard at http://ipushpull1:3300/default.dashboard
after
'C:_WWWipp-vudash
ode_modules�udash-widget-timesrcclientmarkup.html' is imported by dashboard.js, but could not be resolved – treating it as an external dependency
No name was provided for external module 'C:_WWWipp-vudash
ode_modules�udash-widget-timesrcclientmarkup.html' in options.globals – guessing 'VudashWidgetTime'

It seems that when loading widget markup all slashes disappear from the file path

Basically allows a user to push data to the dashboard rather than have the dashboard poll.

The widgets would still poll, therefore the fetch method would simply retrieve data from a cache that is updated by events pushed to the datasource's connector.

I see this as a sort of spike, to determine feasibility.

• Datasource should allow configurable port for events
• Datasource should cache data ephermally
• Datasource should allow reading from a queue
• Datasource should have some method of defining data structure

Hey there,

we have vudash running on a Raspberry PI connected to a TV. (kiosk mode)
This works pretty nice so far. However the connection gets lost from time to time (due to dashboard server restarts or deployments of a new dashboard version). This means we need to refresh the browser manually.
It would be really great to have a page reload triggered whenever a new connection was made after the connection has been lost.

Cheers

Doesn't seem to work, probably because the client side of the widget hasn't connected yet. Is there a callback for when that happens, so that I can propagate static data to the client? The widget has a config option 'foo' and I want that to be reflected in the client widget's data.

Setting up a repeating timer to push the static data again and again to the client is a workaround I've seen, but that feels wrong :)

After removing node_modules folder and installing all dependencies again, CSS animation doesn't work in my widget.

After investigation i found out that @ symbol is removed from beginning of animation declaration

it has to be @keyframes ...

There appears to be some sort of memory leak - not sure if it's widget specific or the dashboard itself, but over time, the memory usage grows.

• Diagnose source of memory leak
• Fix memory leak

Hi!

Just tried it out on Windows, but i'm having some issues with vudash create.

You are using template literals, but I haven't seen ``` before (except for Markdown on Github) in cli/src/create.js

const dockerFileContents =
^
...
TypeError: "" is not a function
at Object. (C:\Projects\dashboard-test\node_modules\vudash\src\cli\create.js:10:30)
at Module._compile (module.js:643:30)
at Object.Module._extensions..js (module.js:654:10)
at Module.load (module.js:556:32)
at tryModuleLoad (module.js:499:12)
at Function.Module._load (module.js:491:3)
at Module.require (module.js:587:17)
at require (internal/module.js:11:18)
at Object. (C:\Users\l19550635\Documents\Projects\lindex-dashboard\node_modules\vudash\bin\vudash.js:3:16)
at Module._compile (module.js:643:30)
at Object.Module._extensions..js (module.js:654:10)
at Module.load (module.js:556:32)
at tryModuleLoad (module.js:499:12)
at Function.Module._load (module.js:491:3)
at Function.Module.runMain (module.js:684:10)
at startup (bootstrap_node.js:187:16)```

When use single literals it seems to start working. Is there any special reason for this?

const dockerFileContents = `
FROM node:9-alpine

COPY . /app

WORKDIR /app
RUN npm install

EXPOSE 3300

ENV SERVER_URL http://localhost:3300

CMD npm start
`

We have a dashboard with about 10 datasource using the datasource-rest module.

They are all defined like that:

{
    "datasource-version-latest": {
        "module": "@vudash/datasource-rest",
        "schedule": 10000,
        "options": {
            "url": "https://some.url.to/file.json",
            "method": "get",
            "headers": {
                "Cookie": "some-key=value"
            }
        }
    }
}

For the first hours it works fine but then we always get a message like that:

Error updating datasource datasource-version-latest Too many open files
Error
    at new lQ.ErrnoError.lQ.ErrnoError (/dashboard/node_modules/jq-web/jq.min.js:5:11456)
    at Object.nextfd (/dashboard/node_modules/jq-web/jq.min.js:4:29016)
    at Object.createStream (/dashboard/node_modules/jq-web/jq.min.js:4:29527)
    at Object.open (/dashboard/node_modules/jq-web/jq.min.js:5:5784)
    at iB (/dashboard/node_modules/jq-web/jq.min.js:1:31192)
    at gB (/dashboard/node_modules/jq-web/jq.min.js:1:31413)
    at JqTransformer.transform (/dashboard/node_modules/@vudash/transformer-jq/transformer.js:11:12)
    at transformers.reduce (/dashboard/node_modules/vudash/src/modules/widget-datasource-binding/widget-datasource-binding.js:7:17)
    at Array.reduce (<anonymous>)
    at transform (/dashboard/node_modules/vudash/src/modules/widget-datasource-binding/widget-datasource-binding.js:6:23)
    at DatasourceEmitter.datasource.emitter.on.value (/dashboard/node_modules/vudash/src/modules/widget-datasource-binding/widget-datasource-binding.js:15:43)
    at DatasourceEmitter.emit (events.js:180:13)
    at DatasourceEmitter.emit (domain.js:439:23)
    at datasource.fetch.then.data (/dashboard/node_modules/vudash/src/modules/datasource-binder/datasource-binder.js:13:15)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:118:7)

The values are not updated anymore. The widgets look like this:

{
    "position": {
        "x": 3,
        "y": 4,
        "w": 1,
        "h": 2
    },
    "widget": "vudash-widget-statistic",
    "options": {
        "description": "",
        "colour": "transparent"
    },
    "datasource": "datasource-version-latest",
    "transformations": [
        {
            "transformer": "@vudash/transformer-jq",
            "options": {
                "value": ".version"
            }
        }
    ]
}

But the normal widget-time module for example still keeps ticking. We are using latest versions of all vudash stuff.

Alarm is played in endless loop after it was trigged the first time.

The widget is configured like this:

{
  "position": {
    "x": 8,
    "y": 0,
    "w": 2,
    "h": 2
  },
  "widget": "vudash-widget-time",
  "options": {
    "timezone": "Europe/Berlin",
    "alarms": [
      {
        "expression": "00 28 10 * * 1-5",
        "actions": [
          {
            "action": "sound",
            "options": {
              "data": "data:audio/ogg;base64,<...>"
            }
          }
        ]
      }
    ]
  }
}

We just experienced the following issue when a URL is temporary not available:

ParseError: Unexpected token < in JSON at position 0 in "https://some.url.com/version.json":
<html>
<head><title>404 Not Found</title></head>
<body bgcolor="white">
<c...
    at stream.catch.then.data (/Users/dashboard/node_modules/got/index.js:118:14)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:118:7)
  message: 'Unexpected token < in JSON at position 0 in "https://some.url.com/version.json": \n<html>\r\n<head><title>404 Not Found</title></head>\r\n<body bgcolor="white">\r\n<c...',
  host: 'some.url.com',
  hostname: 'some.url.com',
  method: 'GET',
  path: '/version.json',
  statusCode: 404,
  statusMessage: 'Not Found' }
node.js exiting due to unhandled promise rejection

Would be nice to make this failsafe to not crash the whole dashboard. It should rather get the values in the next fetching iteration (when the source is available again).

Something prettier than the hapi 404 json!

See vudash/vudash-demo#2

Is it just creating a .vue file? The existing widgets seem to be node modules with quite a bit of boilerplate, is all that needed to create a widget?

Thanks!

Hi there,

Vudash looks amazing. Unfortunately i cant get it to work properly.
After a install with vudash create, when i tried running vudash, it gave a error that the clock-module could not be found. Then when i started it with npm start it worked.

Then i installed the datasource-rest module, but when i start it (with vudash or npm start), and visit the dashboard. I get Module @vudash/datasource-rest could not be resolved as an NPM module or a local module.

Am i doing something wrong? tried it multiple times now.

thanks in advance for your help!

• Allows changing of fonts
• Allows changing of colours
• Allows changing of rounding

I tried to create a new dashboard following the steps specified.

1. npm install -g vudash
2. vudash create

The above generated the below error:
Error: Cannot find module 'fs-extra' at Function.Module._resolveFilename (module.js:325:15) at Function.Module._load (module.js:276:25) at Module.require (module.js:353:17) at require (internal/module.js:12:17) at Object.<anonymous>

I installed fs-extra manually and it started working.

Please add fs-extra to the dependencies list.

• Add documentation for the svelte repl gist which can be used to quickly prototype vudash widgets.

Hey there,

I just noticed that it's currently not possible to get anything else than JSON back in the REST datasource. It would be handy if more formats could be supported. (I have an RSS feed here which I would like to read)

Cheers

Useful for widgets which graph things

Update method can then become

update({ data, meta, history }) ...

• Datasources can specify a history length in update-length (i.e. keep last 8 values)
• Widgets can take 'history'
• Statistics widget observes history rather than creating its own
• Old history items are removed from history

Compile svelte components, and bundle them with their imported dependencies.

I receive the following error message when I try to view a dashboard:

TypeError: Cannot read property 'Symbol(Symbol.iterator)' of undefined
at enhance (/[path]/vudash-example/node_modules/vudash/node_modules/rollup/dist/rollup.js:7567:21)
at Module.analyse (/[path]/vudash-example/node_modules/vudash/node_modules/rollup/dist/rollup.js:7931:2)
at new Module (/[path]/vudash-example/node_modules/vudash/node_modules/rollup/dist/rollup.js:7791:7)
at /[path]/vudash-example/node_modules/vudash/node_modules/rollup/dist/rollup.js:9495:17

Steps to reproduce:

1. npm install -g vudash
2. vudash create
3. npm start
4. browse to http://localhost:3300/default.dashboard
5. page does not load and the above error is displayed in the terminal.

I can also reproduce the issue when cloning the example repo: https://github.com/vudash/vudash-demo

Versions:
vudash: occurs from v7 -> v7.6.2
os: macOs Sierra v10.12.5
node: v6.10.1

Right now, vudash-transport is included in plugins, but actually what should happen is that there should be a bunch of plugins:

@vudash/data-source-google-sheets
@vudash/data-source-homebridge
@vudash/data-source-rest
@vudash/data-source-value
@vudash/data-source-random

Each plugin should 'decorate' the dashboard with a 'data-source', along with validation for that transport's config, and widgets should have a default configuration variable outside of options called 'data-source' which holds the configuration for the data-source

• Extract plugins from transports into individual data sources
• Allow decoration of the dashboard with data sources
• Update demo project
• Make validation an automatic method on data-source registration (but optional)
• Create new section in docs for data sources
• Move all data source configuration info to data-sources section
• Remove shared config
• Rename datasources to plugins

Hi everyone,
I just wanted to report, that I'm not able to get the basic setup running.

npm i -g vudash
vudash create
vudash

Loading dashboards from /Users/mathiasschopmans/Sites/om3-common/oms-dashboard
Server running
Dashboards available:
simple-dashboard at http://aoe-schopmans.local:3300/default.dashboard

Everything seems fine, but once I visit the logged URL I get the following error:

TypeError: Cannot read property 'Symbol(Symbol.iterator)' of undefined
    at enhance (/Users/mathiasschopmans/Sites/oms-dashboard/node_modules/rollup/dist/rollup.js:7567:23)
    at Module.analyse (/Users/mathiasschopmans/Sites/oms-dashboard/node_modules/rollup/dist/rollup.js:7931:2)
    at new Module (/Users/mathiasschopmans/Sites/oms-dashboard/node_modules/rollup/dist/rollup.js:7791:7)
    at /Users/mathiasschopmans/Sites/oms-dashboard/node_modules/rollup/dist/rollup.js:9495:17
    at <anonymous>

System information

• Add transpiler to rollup

I have updated to the latest version 7.11.0 and have following error
Module dependency widgets/vudash-chartjs declared in widget could not be located
this is my local widget and it can't be found anymore.

I guess reason is this change d617f83#diff-573418c3c4b7a3f5236ad3e02d0b58d7L11

Suggest something like

{ widget def ...
  transform: {
    reach: 'some.path.to.xyz',
    format: '%2f'
  }
}

and removing all previous ability to do this on a per-widget basis.

This would mean declaring only one datasource for an API and then plucking different values for different widgets

• Can specify optional transform clause
• Can specify optional transform 'reach'
• Can specify optional transform 'format'
• Functionality to format and transform is removed from stock widgets

Does Vudash support saving history between restarts? Dashing saves a history.yml, and has an option when scheduling jobs to not run the job at startup, eg: SCHEDULER.every '1h', :first_in => 0 do.

I have a data source I would prefer to not fetch too often, but even if I set the schedule for the source to a high number, it will still be fetched every time I restart Vudash during development of my dashboard.

Do you have plans to add such a feature, or ideas on how to work around it? I could create a custom datasource, that fetches from a file the first time, but since my data source is JSON i would have to reimplement the existing JSON source I guess?

There doesn't seem to be any hot-reload of the dashboards. Changing e.g. the width or height of a widget.

I don't know if this limitation also applies to widgets. Coming from Dashing/Smashing, the ability to quickly change a widget was very handy.

Annyone tried running it on a raspberry pi 3? When i run a dashboard with +- 10 charts on a raspberry, it is really slow to boot up (around a minute) and when it boots, the clock for example updates only every 10 seconds. Is there something i might do wrong, that requires a lot of power from the raspberry? or is the dashboard simply heavy to run?

• Should be able to declare default configuration for widgets (or use joi defaults)
• Should be able to declare a joi validation schema
• Hook should be automatically called to validate
• Defaults should be merged with passed options

I had

datasources: {
  datasources: {
    ...
  }
}

We should check that datasources have the correct format when the dashboard is loaded.

The icon fonts used in our widgets are kinda ugly. Icomoon will provide a smaller filesize and better control over our icon sets.

Which doesn't sound great!

The HTML5 Audio API fires events such as 'playing' and 'ended' which should be used in order to queue sounds so that they don't play in parallel.

• When a sound is played, set current audio state to playing
• When a sound finishes, set current audio state to playing
• If a second sound starts to play whilst a sound is playing, add it to a queue.
• Play all sounds in queue until there are none left