expediagroup / cyclotron Goto Github PK

View Code? Open in Web Editor NEW

1.6K 63.0 120.0 8.7 MB

A web platform for constructing dashboards.

Home Page: https://www.cyclotron.io/

License: MIT License

CoffeeScript 58.49% JavaScript 14.04% Shell 0.10% Pug 19.46% Less 7.91%

dashboards cyclotron widgets hacktoberfest

cyclotron's Introduction

Cyclotron

📻 News and updates

Cyclotron is no longer being maintained. The tech stack is over a decade old and has not aged well, so it basically needs a complete rewrite to modernize it. Feel free to fork and continue development.

About

Cyclotron is a browser-based platform for creating dashboards. It provides standard boilerplate and plumbing, allowing non-programmers to easily create and edit dashboards using customizable components. It has a built-in dashboard editor, and hosts the dashboards directly.

Dashboards are defined declaratively as a JSON document, which contains all the properties required to render the Dashboard.

Key Concepts
Features
Should I Use Cyclotron?
Requirements
Installation
- MongoDB
- Node.js
- REST API
- Website
Docker
Deployment
Extending Cyclotron
Contributing
Licensing

Key Concepts

Dashboard: a series of Pages, as well as Data Sources, Scripts, Styles, and other configurations; stored as a JSON document, it contains all the properties required to render itself
Page: one or more Widgets combined in various sizes and layout; one Page is displayed at a time
Widget: reusable component that displays on the Dashboard; different types are available
Data Source: reusable component that retrieves data for use by Widgets; different types are available

Features

Declarative definition of Dashboards, requiring no HTML or JavaScript (although it's optionally available)
Included Widgets: Annotation Chart, Chart, Header, HTML, iFrame, Image, Javascript, JSON, Number, QRCode, Stoplight, Table, Treemap, Youtube
Included Data Sources: CyclotronData, Elasticsearch, Graphite, InfluxDB, Javascript, JSON, Prometheus, Splunk
Built-in data loading, filtering, and sorting
LDAP/Active Directory Integration
Permissions for viewing and editing Dashboards
Built-in analytics for Dashboards
Mobile support
REST API access

Should I Use Cyclotron?

Cyclotron is best thought of as an alternative to custom, light-weight websites that visualize data. It provides the web hosting, page layout, data loading, and assorted widgets—all without writing code. In contrast, building a comparable website from scratch would require provisioning a server/VM, choosing the appropriate web frameworks and libraries, and writing the code for the site. Cyclotron simplifies this process dramatically, making it ideal for rapid prototyping.

However, Cyclotron has a limited set of built-in Widgets and Data Sources. The HTML and JavaScript Widgets do allow for a wide degree of customization, but require some web development. Cyclotron lacks built-in interactivity, so it may not be ideal for building highly interactive websites. Additionally, it is designed for building full-screen dashboards, not reports.

In regards to data, Cyclotron does not store or cache any data for Dashboards. Dashboards can load external data through various Data Sources, but it is done on-the-fly when Dashboards are viewed. Cyclotron can do filtering/sorting and custom transformations, but this should not be considered a replacement for ETL jobs. In this regard, Cyclotron is ideal as a front-end for an existing database or web service.

Requirements

Node.js
- Requires >= 6.x to run cyclotron-site tests
- Requires >= 0.10 to run
MongoDB (2.6+)
(Optional) Any web server--Nginx, Apache, IIS, etc

Node.js and MongoDB are available on Linux, OS X, and Windows, so it should be possible to run Cyclotron on any of these platforms, although the specific steps may vary.

MongoDB 2.6 or above is required to use all functionality of the service.

Installation

These installation instructions are primarily intended for development and testing purposes. Refer to the Deployment section for more details on server deployment.

Start by cloning this git repository locally onto your computer. If you don't have git installed, GitHub has a nice guide: Set Up Git. On Windows, GitHub for Windows is an easy way to install git.

Alternatively, download a ZIP archive of the repository contents and extract it.

MongoDB

Install MongoDB according to the installation instructions for your system. Cyclotron automatically creates the MongoDB database on startup MongoDB server, so no other configuration needs to be done.

MongoDB does not have to be installed on the same system as the Cyclotron website or service, as long as the connection property is updated accordingly. Replica sets and authentication are also supported.

Ensure MongoDB is running before continuing:

mongod --config /usr/local/etc/mongod.conf

Node.js

Install the latest stable version of Node.js for your system. This should install npm as well.

Packages may be available separately for your system, depending on the OS and package manager.

REST API

The cyclotron-svc/ folder contains the REST API for Cyclotron, which interfaces with MongoDB.

Open the cyclotron-svc/ folder in the shell
Install dependencies using npm:
```
 npm install
```
Windows: this may need to be run as an Administrator. Open the Node.js Command Prompt as an Administrator and run the command there.

Windows/OSX/Linux: node-gyp may require certain dependencies to be installed. See platform-specific instructions here.
Create a configuration file at cyclotron-svc/config/config.js. A sample configuration file sample.config.js is provided:
```
 cp config/sample.config.js config/config.js
```
The sample config defaults to using a local MongoDB instance, with authentication disabled. If using a remote MongoDB server or cluster, update the mongodb property accordingly.

If using Active Directory or LDAP, ensure that the property enableAuth is set to true, and that all the ldap properties are filled in correctly, including the service account username and password used to validate logins.
Start the service in node:
```
 node app.js
```
To verify the service is running, open the API documentation in a browser at http://localhost:8077

For more information on the REST API and its configuration, please refer to cyclotron-svc/README.md.

Website

The cyclotron-site/ folder contains the website for Cyclotron.

Open the cyclotron-site/ folder in the shell
Install all dependencies using npm:
```
 npm install
```
Windows: this may need to be run as an Administrator. Open the Node.js Command Prompt as an Administrator and run the command there.
Install Gulp globally. This is the build system for the website, and only has to be done once.
```
 npm install --global gulp
```
Windows/Linux/OSX: this may need to be run as an Administrator or with sudo privileges.
Build and run the service:
```
 gulp server
```
This compiles the website into the _public folder and starts a local development web server. The website should automatically open: http://localhost:8080.

"unable to connect to github.com": this may be due to a firewall blocking the git:// protocol. Run this:
```
 git config --global url."https://".insteadOf git://
```
Windows: Git must be in the PATH to successfully build the website; if using GitHub for Windows, just open the Git Shell which automatically adds it.
Update the configuration file at _public/js/conf/configService.js as needed. Gulp automatically populates this file from sample.configService.js if it does not exist.

The sample config defaults to using a local cyclotron-svc instance, with authentication disabled. If authentication has been enabled in the REST API, it must be enabled in this config as well.

For more information on the Cyclotron website, please refer to cyclotron-site/README.md.

Docker

A Dockerfile and docker-compose.yml example can be found here: https://github.com/baumandm/cyclotron-docker.

Deployment

For specific details on deployment, please refer to cyclotron-site/README.md and cyclotron-svc/README.md.

Extending Cyclotron

More information on extending Cyclotron is available in EXTENDING.md

Contributing

We gladly accept contributions to Cyclotron in the form of issues, feature requests, and pull requests! Check out CONTRIBUTING.md for more information.

Licensing

Cyclotron is licensed under the MIT license; refer to LICENSE for the complete text.

Cyclotron has a dependency on Highcharts, a commercial JavaScript charting library. Highcharts offers both a commercial license as well as a free non-commercial license. Please review the licensing options and terms before using this software, as the Cyclotron license neither provides nor implies a license for Highcharts.

The only feature depending on Highcharts is the Chart widget, so both can be removed if necessary.

cyclotron's People

Contributors

Stargazers

Watchers

Forkers

brett-miller chriszacny baumandm aixagon josejamilena hwkongsgaard velebak saiongole msylvia dodermatt jezgomez ryanmcgary hbcbh1999 mjunaidi gisairo qvin luisfx qianxueseng-com rkaramc kggayo desmondmorris backupmanager mapennell vyraun chosen1 jakeatwork dodolooking emrul mengyou658 99plus2 joseroubert08 yanlinaung nilayan chandantiwari anilprasad netinmax waykospankaj cdfpaz hankywang alpc32 mbuffet cuulee ksinkar fengweijp benjamesbabala hhy5277 bradparks watech skynode viktor-evdokimov panbhatt thomasleveil kurtdegreeff ajinkyakulkarni sreenadhp verchol mariotristan lshahar cube3power kompisapp umarmughal fstfwd chaabni billthebest mar0on maniacs-oss massimiliano76 lc2a khaled-ansary msny derstraeter ashleyjiang28 elduddz keithleo9008 obonyojimmy decode-india scc-digitalhub jmillena xxxvxxx melonnmediatech weedkiller blazehub pratiks adhambaouz pks-os abdulazizali77 aarvee11 cjbarnes lanphan jwarni narendran1560 datacabbage anhhai986 hassaananjum dougsillars dnalob cvpreddy kamalcharan wudehua2016 narproje

cyclotron's Issues

Time Zone Capabilities for Clock Widget

Is there anyway we can add a time zone capability for the clock widget?

Excel / PDF export is using local ip address not domain address

When trying to export reports, cyclotron is providing the correct path to the file location for download but has the improper ip address / domain.

the address given by cyclotron is:

http://10.0.1.208:8077/exports/personnel_data-l1iKoujhzI.xlsx

the domain address it should be returning is something like:

http://my.domain.com:8077/exports/personnel_data-l1iKoujhzI.xlsx

Is this configurable?

Issue with connecting to Mongodb

Hi,
I just installed cyclotron on OSX El Capitan and I am trying to run app.js from inside cyclotron-svc. I keep getting this error related to connecting to port 27017. I have checked using netstat that mongod is running and listening on port 27017.

Thanks in advance!

Needs latest SSL Root Certificate Authority data /Users/sriram/Documents/dashboards/cyclotron/cyclotron-svc/node_modules/ssl-root-cas/ssl-root-cas-latest.js
Loading latest certificates from https://mxr.mozilla.org/nss/source/lib/ckfw/builtins/certdata.txt?raw=1
Cyclotron running on port 8077

/Users/sriram/Documents/dashboards/cyclotron/cyclotron-svc/node_modules/mongoose/node_modules/mongodb/lib/server.js:242
        process.nextTick(function() { throw err; })
                                      ^
Error: connect ECONNREFUSED ::1:27017
    at Object.exports._errnoException (util.js:1033:11)
    at exports._exceptionWithHostPort (util.js:1056:20)
    at TCPConnectWrap.afterConnect [as oncomplete] (net.js:1105:14)```

Updating data inside the widgets

Is there any additional documentation for updating widget data. I have been using the json data source and querying a middle-ware API, the middle-ware is connecting to a WebSocket to get information when available.

I cannot seem to use the API to update the widget data, any help would be appreciated!

Promive a docker image

It would be great if you could provide Docker image or more simply a Docker Compose file for an easy setup/test.

Recommended OS or guidance on API

I'm using Ubuntu 14.04 LTS and followed installation instructions for cyclotron. Many things are working, but not everything. What build of what distro is known to work with cyclotron?

I can load the api pages and dashboard admin interface, create dashboards, and view them. However I cannot successfully test any of the API. A simple one such as Get /dashboards returns 404 "Cannot GET /api/dashboards?session=api_key

Should I try installling on a different version of linux? Where do I get/set the api_key anyway?

Configuring numeral js language

I am trying to change the numeralJS default settings (to pt-br BTW) but until now all my efforts has been in vain. I am assuming that the table and number widgets use numeralJS functions to format numbers. If not, please advise me how to do so.

Thanks.

dataSource value passed to moment function does not render properly

I created an HTML widget and in the HTML section, I put the following code:

<p>Date: #{openingDate}</p>
<p>Date: ${moment(#{openingDate}).format('YYYY-MM-DD')}</p>

Expected Output:

Date: 2015-10-15T00:05:32.000Z
Date: 2015-10-15

Actual Output:

Date: 2015-10-15T00:05:32.000Z
Date: ${moment(#{openingDate}).format('YYYY-MM-DD')}

"My Dashboard" Functionality

So on the front page, we have "New Dashboard" and "Help." It would be nice if next to those two, there was another option that said "My Dashboards" that when clicked on would show all the dashboards I have made. That way I don't have to search for each one.

cyclotron-svc> npm install fails. Can't find Python executable.

I'm installing cyclotron on Windows, and it seems there is a dependency on Python for the 'dtrace-provider' module.

C:\git\cyclotron\cyclotron-svc>npm install

> [email protected] install C:\git\cyclotron\cyclotron-svc\node_modules\dtrace-provider
> node-gyp rebuild


C:\git\cyclotron\cyclotron-svc\node_modules\dtrace-provider>if not defined npm_config_node_gyp (node "C:\Program Files\nodejs\node_modules\npm\bin\node-gyp-bin\\..\..\node_modules\node-gyp\bin\node-gyp.js" rebuild )  else (node "" rebuild )
gyp ERR! configure error
gyp ERR! stack Error: Can't find Python executable "python", you can set the PYTHON env variable.
gyp ERR! stack     at failNoPython (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\configure.js:449:14)
gyp ERR! stack     at C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\configure.js:404:11
gyp ERR! stack     at C:\Program Files\nodejs\node_modules\npm\node_modules\graceful-fs\polyfills.js:284:29
gyp ERR! stack     at FSReqWrap.oncomplete (fs.js:112:15)
gyp ERR! System Windows_NT 10.0.14393
gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild"
gyp ERR! cwd C:\git\cyclotron\cyclotron-svc\node_modules\dtrace-provider
gyp ERR! node -v v7.4.0
gyp ERR! node-gyp -v v3.4.0
gyp ERR! not ok
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\dtrace-provider):
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] install: `node-gyp rebuild`
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: Exit status 1

Cyclotron Installation on node v7.2 npm 3.10.9

I have try to install cyclotron on Debian Jessie
npm -v 3.10.9
node -v v7.2.0

I got the following error:
root@15e0daa602b2:~/cyclotron-1.43.0/cyclotron-site# gulp server
[11:27:02] Requiring external module coffee-script/register
/root/cyclotron-1.43.0/cyclotron-site/node_modules/socket.io/lib/store.js:35
Store.prototype.proto = EventEmitter.prototype;
^

TypeError: Cannot read property 'prototype' of undefined
at Object. (/root/cyclotron-1.43.0/cyclotron-site/node_modules/socket.io/lib/store.js:35:41)
at Module._compile (module.js:571:32)
at Object.Module._extensions..js (module.js:580:10)
at Module.load (/root/cyclotron-1.43.0/cyclotron-site/node_modules/coffee-script/lib/coffee-script/register.js:45:36)
at tryModuleLoad (module.js:447:12)
at Function.Module._load (module.js:439:3)
at Module.require (module.js:498:17)
at require (internal/module.js:20:19)
at Object. (/root/cyclotron-1.43.0/cyclotron-site/node_modules/socket.io/lib/manager.js:16:13)
at Module._compile (module.js:571:32)
at Object.Module._extensions..js (module.js:580:10)
at Module.load (/root/cyclotron-1.43.0/cyclotron-site/node_modules/coffee-script/lib/coffee-script/register.js:45:36)
at tryModuleLoad (module.js:447:12)
at Function.Module._load (module.js:439:3)
at Module.require (module.js:498:17)
at require (internal/module.js:20:19)
at Object. (/root/cyclotron-1.43.0/cyclotron-site/node_modules/socket.io/lib/socket.io.js:87:19)
at Module._compile (module.js:571:32)
at Object.Module._extensions..js (module.js:580:10)
at Module.load (/root/cyclotron-1.43.0/cyclotron-site/node_modules/coffee-script/lib/coffee-script/register.js:45:36)
at tryModuleLoad (module.js:447:12)
at Function.Module._load (module.js:439:3)
at Module.require (module.js:498:17)
at require (internal/module.js:20:19)
at Object. (/root/cyclotron-1.43.0/cyclotron-site/node_modules/socket.io/index.js:8:18)
at Module._compile (module.js:571:32)
at Object.Module._extensions..js (module.js:580:10)
at Module.load (/root/cyclotron-1.43.0/cyclotron-site/node_modules/coffee-script/lib/coffee-script/register.js:45:36)
at tryModuleLoad (module.js:447:12)
at Function.Module._load (module.js:439:3)
at Module.require (module.js:498:17)
at require (internal/module.js:20:19)
at Object. (/root/cyclotron-1.43.0/cyclotron-site/node_modules/karma/lib/server.js:1:72)
at Module._compile (module.js:571:32)
at Object.Module._extensions..js (module.js:580:10)
at Module.load (/root/cyclotron-1.43.0/cyclotron-site/node_modules/coffee-script/lib/coffee-script/register.js:45:36)
at tryModuleLoad (module.js:447:12)
at Function.Module._load (module.js:439:3)
at Module.require (module.js:498:17)
at require (internal/module.js:20:19)
at Object. (/root/cyclotron-1.43.0/cyclotron-site/node_modules/karma/lib/index.js:3:18)
at Module._compile (module.js:571:32)
at Object.Module._extensions..js (module.js:580:10)
at Module.load (/root/cyclotron-1.43.0/cyclotron-site/node_modules/coffee-script/lib/coffee-script/register.js:45:36)
at tryModuleLoad (module.js:447:12)
at Function.Module._load (module.js:439:3)
at Module.require (module.js:498:17)
at require (internal/module.js:20:19)
at Object. (/root/cyclotron-1.43.0/cyclotron-site/gulpfile.coffee:50:9)
at Object. (/root/cyclotron-1.43.0/cyclotron-site/gulpfile.coffee:1:1)
at Module._compile (module.js:571:32)
at Object.loadFile (/root/cyclotron-1.43.0/cyclotron-site/node_modules/coffee-script/lib/coffee-script/register.js:16:19)
at Module.load (/root/cyclotron-1.43.0/cyclotron-site/node_modules/coffee-script/lib/coffee-script/register.js:45:36)
at tryModuleLoad (module.js:447:12)
at Function.Module._load (module.js:439:3)
at Module.require (module.js:498:17)
at require (internal/module.js:20:19)
at Liftoff.handleArguments (/usr/lib/node_modules/gulp/bin/gulp.js:116:3)
at Liftoff. (/usr/lib/node_modules/gulp/node_modules/liftoff/index.js:198:16)
at module.exports (/usr/lib/node_modules/gulp/node_modules/flagged-respawn/index.js:17:3)
at Liftoff. (/usr/lib/node_modules/gulp/node_modules/liftoff/index.js:190:9)
at /usr/lib/node_modules/gulp/node_modules/liftoff/index.js:164:9
at /usr/lib/node_modules/gulp/node_modules/v8flags/index.js:108:14
at /usr/lib/node_modules/gulp/node_modules/v8flags/index.js:36:12
at /usr/lib/node_modules/gulp/node_modules/v8flags/index.js:47:7
at _combinedTickCallback (internal/process/next_tick.js:67:7)
at process._tickCallback (internal/process/next_tick.js:98:9)
at Module.runMain (module.js:607:11)
at run (bootstrap_node.js:420:7)
at startup (bootstrap_node.js:139:9)
at bootstrap_node.js:535:3

Supporting Right to Left Languages

Dear's
did any one try the platform in Right to Left Languages ?

External JSON data loading

I am working on deploying a dashboard to my office and have everything from Cyclotron setup and running just fine on our local server, however I can not load JSON data from an external source (i.e Jira) I have verified that the REST API with JIRA is correct and actually provides the JSON data I expect, however when I added the URL to the Data Sources, it never loads anything.

I have verified that JSON data can be read locally by placing a sample.json file in the /cyclotron-site/_public directory and it loads as expected.

What should I be doing to load external JSON data? Am I missing something around the Proxy settings?

Chart widget - numeric data "converted" to text, and then fails

Good day,

i'm trying to set up a chart widget for the number of errors reported per hour for the last 24 hours.

I've set up a chart widget and pointed it to a data source with the following splunk query:
Environment="Production" Level="ERROR" |bucket _time span=1h | stats count by _time

This leads to an empty chart widget, with a javascript error logged to the console pointing to highchart errors #14: String value sent to series.data, expected Number ( https://www.highcharts.com/errors/14 )

I feel like what I'm doing is rather basic - how can I fix this? I 'm pretty sure the count values returned form the query are actually numbers.

Dependency of [email protected] causes failure

cyclotron-site/package.json requires [email protected] indirectly and this package is suspended because of a security vulnerability. You can have a look at npm blog. How can we solve this dependency problem? It causes failure when npm install is run.

MacBook-Pro:cyclotron-site $ sudo npm install
npm ERR! code E404
npm ERR! 404 Not Found: [email protected]

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/***/.npm/_logs/2018-12-10T12_27_08_401Z-debug.log

Connecting to influxdb with ssl

I Have a influxdb with ssl. When I'm connect to influx with user and password, I'm using insecure_skip_verify = true.
But, when I configure a DataSource I'm does not have option to configure ssl.
It's possible ?

API requests don't work

API requests don't work for me.

GET /dashboard starts working after the fix in routes/api.js
app.get('/api/dashboards', dashboards.get);

I've added '/api' on the start.
It seems to me others will start working after the same fix.

I've used the quickstart guide, but apparently something went wrong.

Cannot connect to cyclotron-svc (getTopDashboards)

cyclotron-site$ npm start`

> [email protected] start /home/nightshade/projects/heroku-apps/sars22/cyclotron-site
> npx gulp server

[04:19:31] Requiring external module coffeescript/register
[04:19:32] Using gulpfile ~/projects/heroku-apps/sars22/cyclotron-site/gulpfile.coffee
[04:19:32] Starting 'server'...
[04:19:32] Starting 'build'...
[04:19:32] Starting 'vendor'...
[04:19:32] Starting 'assets'...
[04:19:32] Starting 'pug'...
[04:19:32] Starting 'styles'...
[04:19:32] Starting 'scripts'...
[04:19:32] Starting 'bower-install'...
[04:19:32] Using cwd: /home/nightshade/projects/heroku-apps/sars22/cyclotron-site
[04:19:32] Using bower dir: ./bower_components
[04:19:34] Finished 'styles' after 2.2 s
[04:19:34] Finished 'assets' after 2.28 s
[04:19:35] Finished 'scripts' after 3.01 s
[04:19:36] Finished 'pug' after 3.58 s
[04:19:39] Finished 'bower-install' after 6.45 s
[04:19:39] Starting 'vendor-fonts'...
[04:19:39] Starting 'vendor-scripts'...
[04:19:39] Starting 'vendor-styles'...
[04:19:39] Starting 'vendor-img'...
[04:19:40] Finished 'vendor-img' after 996 ms
[04:19:40] Finished 'vendor-styles' after 1.02 s
[04:19:40] Finished 'vendor-fonts' after 1.02 s
[04:19:40] Finished 'vendor-scripts' after 1.02 s
[04:19:40] Finished 'vendor' after 7.47 s
[04:19:40] Finished 'build' after 7.47 s
[04:19:40] Starting 'watch'...
[04:19:40] Starting 'webserver'...
[04:19:40] Option open does not work in gulp-connect v 2.*. Please read "readme" https://github.com/AveVlad/gulp-connect
[04:19:40] Starting server...
[04:19:40] Server started http://0.0.0.0:8080
[04:19:40] Running server

I am unable to get connect the site to the svc. I am able to see the http://localhost:8077 api page. But somehow site is not getting connected.
Shows error Cannot connect to cyclotron-svc (getTopDashboards)

Mongodb as datasource - how to do that?

Hi,

I am trying to use cyclotron([http://www.cyclotron.io][1]) to work with my database in mongodb.
The configuration settings doc seems to ask for custom mongodb.

But while creating data source there is no option to select mongodb.

I would like to
a) Select my database
b) Select collection
c) Set parameters for widgets to know what to plot.

Previously I had a custom stack running nodejs + mongodb + jquery to do the plotting. Wherein nodejs has the business logic as to exchange data based on query send from frontend.
I am looking to replace the whole stack so that with minimum programming plots can be created.

Regards

Cannot connect to cyclotron-svc

After I set everything up and load up the web page, I try to click on examples and get three errors that are like, "Cannot connect to cyclotron-svc (getTags)" or getDashboard, etc. Any idea why this is happening?

Two more dependencies needed

Hi Fellow Expedian ,
For me after installing gulp(3.8) globally it needed two more steps .

npm install coffee-script
npm install gulp-concat

Cyclotron-site doesn't work with node 7

This deprecation warning in node 6:

DeprecationWarning: process.EventEmitter is deprecated. Use require('events') instead.

Is an error in node 7

edit: Also the api seems to hang on /tags in node 7, but works fine in 6

Keep code and configs in Source/Version control system?

Hello team,

I am working on creating several dashboards using Cyclotron with great success!
Now it is time to store my code/configurations, so I tried to find if there is a way to "build" the tool and to get files with my datasources and/or the configurations for the pages, widgets, etc but without luck.

So could you please guide me with the best approach to put all my work (code) for the dashboards (datasources, configurations) to some version control system (like GitHub)?

Thank you in advance and regards
Hristo

Elastic search examples

Any plans to provide an elastic search example?

Google Maps Embedding

Hey there!
Great project and very easy to use so far. I stumbled over an issue though.
I'm trying to embed Google Maps, but the content is not shown.

I use a 2x2 HTML Grid and added the following HTML-Code:

    <div id="map"></div>
    <style>
      /* Always set the map height explicitly to define the size of the div
       * element that contains the map. */
      #map {
        height: 100%;
      }
      /* Optional: Makes the sample page fill the window. */
      html, body {
        height: 100%;
        margin: 0;
        padding: 0;
      }
    </style>
    <script>
      function initMap() {
        var map = new google.maps.Map(document.getElementById('map'), {
          zoom: 12,
          center: {lat: 50.1111111, lng: 6.111111},
          disableDefaultUI: true,
          scrollwheel: false,
          disableDoubleClickZoom: true,
          draggable: false
        });

        var trafficLayer = new google.maps.TrafficLayer();
        trafficLayer.setMap(map);
      }
    </script>
    <script async defer
    src="https://maps.googleapis.com/maps/api/js?key=AIzblablaa4&callback=initMap">
    </script>

I tried it in a sample.html site first and it works there. However I cannot get it working in a Cyclotron HTML widget.

Is there a proper way to embed Maps?

Thank you in advance!

Cannot connect to cyclotron-svc

Hiya,

I'm getting this on a fresh install on a new Centos 7 VM (Linode)

I think it's an IP6 thing -

netstat -nl
Active Internet connections (only servers)
Proto Recv-Q Send-Q Local Address Foreign Address State
tcp 0 0 127.0.0.1:27017 0.0.0.0:* LISTEN
tcp 0 0 0.0.0.0:22 0.0.0.0:* LISTEN
tcp6 0 0 :::8077 :::* LISTEN
tcp6 0 0 :::22 :::* LISTEN

It's only listening on ip6, and ping6 localhost doesn't resolve. I can go

lynx http://[::1]:8077

and get the Cyclotron doc page, and the cyclotron-svc stdout lists the connection. But if I put that URL into cyclotron-site/_public/js/conf/configService.js I still get the error. The cyclotron-svc stdout doesn't list any connection when cyclotron-site fails to connect so I don't think it's an auth thing.

Do you have any advice? I can't see where to tell svc where to bind, and I read that disabling ipv6 on Centos 7 causes issues.

Many thanks
Neil

"Incompatible Browser" when dashboard in reverse proxy

Hello,

When the dashboard is behind a reverse proxy, a "Incompatible Browser" error message is shown.

Nginx example:

server { 
    listen       81;
    server_name  some.local;
    access_log /tmp/some.log combined;

    location / {
        proxy_set_header X-Forwarded-Host $host:$server_port;
        proxy_set_header X-Forwarded-Server $host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_pass         http://dashboard.local:8070/team-sprint-tasks;
    }
}

Apache example:

<VirtualHost *:80>
    ServerName some.local
    
    ProxyRequests off
    ProxyPreserveHost on
    
    <Location />
        ProxyPass http://dashboard.local:8070/team-sprint-tasks
        ProxyPassReverse http://dashboard.local:8070/team-sprint-tasks
        Order allow,deny
        Allow from all
    </Location>
</VirtualHost>

This should work as the FAQ (http://www.cyclotron.io/faq.html) says "Can I Host My Dashboard on a Separate Domain?" that a reverse nginx proxy can be configured.

Do you have any ideas how can I set the dashboard behind the front server?

Thank you!

[question] on ingesting and visualizing Prometheus metrics

Excuse my ignorance in this, I'm not sure because this might go beyond what I as a user need to know about Cyclotron. But you might help so thanks in advance.

I have a Prometheus exporter which generates metrics like the following:

(#)HELP process_cpu_user_seconds_total Total user CPU time spent in seconds.
(#)TYPE process_cpu_user_seconds_total counter
process_cpu_user_seconds_total 0.6868070000000001

(#)HELP process_cpu_system_seconds_total Total system CPU time spent in seconds.
(#)TYPE process_cpu_system_seconds_total counter
process_cpu_system_seconds_total 0.060002

(#)HELP process_cpu_seconds_total Total user and system CPU time spent in seconds.
(#)TYPE process_cpu_seconds_total counter
process_cpu_seconds_total 0.746809

(#)HELP process_start_time_seconds Start time of the process since unix epoch in seconds.
(#)TYPE process_start_time_seconds gauge
process_start_time_seconds 1648551285
(#)and so on ...

So having this, I couldn't directly ingest as a Prometheus datasource

So I'm having an error ERROR: Prometheus Data Source "fastify_metrics_JSON" Failed app.common.js:7128:28.
Do I need Prometheus again to be able to ingest these metrics in Cyclotron ??

Thanks a lot !

WIKI - Tutorial

Hi Team,
This seems to be an excellent project however it lacks a lot on tutorial front. I set it up and navigate through the swagger/UI of the project. It would be great if we can have an example how to set it up for a normal usage.
Ex-> how to use JSON to populate widgets on a SALES dashboard.
I am ready to contribute in the tutorial part, if required and being provided with little help here n there. Let me know your viewpoints, it would be extremely useful for all the open source projects. Cheers.

Installation error occured at cyclotron-site

After "npm install" command, "gulp server" command generates an exception.
Exception:

...
[11:00:26] bower install desandro-matches-selector#2.0.2
[11:00:26] bower install angular-cookies#1.4.9
[11:00:26] bower install angular-mocks#1.4.9
[11:00:32] 'bower-install' errored after 27 s
[11:00:32] Error: calling transform done when ws.length != 0
    at done (.../cyclotron-master/cyclotron-site/node_modules/gulp-bower/node_modules/readable-stream/lib/_stream_transform.js:204:11)
    at DestroyableTransform.<anonymous> (.../cyclotron-master/cyclotron-site/node_modules/gulp-bower/node_modules/readable-stream/lib/_stream_transform.js:139:7)
    at Object.onceWrapper (events.js:313:30)
    at emitNone (events.js:106:13)
    at DestroyableTransform.emit (events.js:208:7)
    at Walker.<anonymous> (.../cyclotron-master/cyclotron-site/node_modules/gulp-bower/index.js:245:16)
    at emitNone (events.js:106:13)
    at Walker.emit (events.js:208:7)
    at Walker._wNext (.../cyclotron-master/cyclotron-site/node_modules/walk/lib/walk.js:252:10)
    at Walker._wNext (.../cyclotron-master/cyclotron-site/node_modules/walk/lib/walk.js:247:17)
    at Walker._wNext (.../cyclotron-master/cyclotron-site/node_modules/walk/lib/walk.js:247:17)
    at Walker._wNext (.../cyclotron-master/cyclotron-site/node_modules/walk/lib/walk.js:247:17)
    at Walker._wNext (.../cyclotron-master/cyclotron-site/node_modules/walk/lib/walk.js:247:17)
    at Walker._wNext (.../cyclotron-master/cyclotron-site/node_modules/walk/lib/walk.js:247:17)
    at Walker._wOnEmitDone (.../cyclotron-master/cyclotron-site/node_modules/walk/lib/walk.js:122:8)
    at nextWhenReady (.../cyclotron-master/cyclotron-site/node_modules/walk/lib/node-type-emitter.js:69:29)
    at Object.emitPluralEvents [as emitNodeTypeGroups] (.../cyclotron-master/cyclotron-site/node_modules/walk/lib/node-type-emitter.js:77:5)
    at Walker._wPostFilesHandler (.../cyclotron-master/cyclotron-site/node_modules/walk/lib/walk.js:132:17)
    at .../cyclotron-master/cyclotron-site/node_modules/foreachasync/forEachAsync.js:15:16
    at Array.forEach (<anonymous>:null:null)
    at Walker.next [as _wCurFileCallback] (.../cyclotron-master/cyclotron-site/node_modules/foreachasync/forEachAsync.js:14:15)
    at nextWhenReady (.../cyclotron-master/cyclotron-site/node_modules/walk/lib/node-type-emitter.js:52:29)
    at .../cyclotron-master/cyclotron-site/node_modules/gulp-bower/index.js:239:13
    at FSReqWrap.readFileAfterClose [as oncomplete] (fs.js:511:3)

[11:00:32] 'vendor' errored after 27 s
[11:00:32] 'build' errored after 27 s
[11:00:32] 'server' errored after 27 s

OS: Ubuntu 18.04
Nodejs: 8.10.0~dfsg-2ubuntu0.4
npm: 3.5.2-0ubuntu4

What could be the reason? Thanks for your attention. I’m looking forward to your reply.

Server Side Events in dataSource

Hi,

Were trying to create a dataSource using SSE / data push, but guessing that its not supported, what we see is that there is no API to update data directly eg dataSourceFactory.broadcastData(newDataSet)
and all of the data sources do a polling data pull by starting runner on each interval, or maybe were mising something, havent looked at using dataService nor looking at the $rootScope yet, can you confirm our doubts?

If we wanted to integrate SSE/ data push, what would you recommend is the best way as an interface in dataSourceFactory ?

Is this project still maintained?

This project hasn't been updated in a while. Is this project still maintained?

Annotation chart doesn't automatically expand when using auto-update

Instead the timeline pushes forward out of the selection area. I think it would make sense for it to push the selection area forward alongside the update, so you can see the new data without manually changing the selection window. Thoughts?

CORS errors on latest Chrome

Thank you @baumandm for delivering and maintaining this ! this might be the best lightweight solution to have a taste of "administration" 😄 🚀

I just wanted to raise the issue particularly on latest Chrome on Ubuntu (where tested) but I believe it would be all over, it has to do with cross domain requests (domain:PORT1) => (domain:PORT2) where in cyclotron 'http://localhost:8077/tags' from origin 'http://0.0.0.0:8080'

in Firefox, it is a different story, an error but still I can see pre-feed example dashboards:

Final note if I may, there is an extensive documentation on the app itself, but not in README (maybe README is for developers), despite a small section on the website

For more information on creating Dashboards with Cyclotron, click on the Help button on the home page, or in the site header.

It would be very attractive to add same documentation now in the app to the website at least, because why not ? This is a nice solution !

Many thanks !

online demo

hi, could you please add a online test demo for playing with.
just like grafana

json datasource authentication

Hi cyclotron team,
first, thank you very much for the great software! I value very much the speed with which a dashboard can be built and the flexibility I have to extract and transform data from other systems.

I'm planning to try it out and build dashboard for my team exposing important information which we need to monitor regularly.

To do that I need to find a solution for important question ( I know that it is not an issue and filing GitHub issue is not the best way to ask but I didn't found other way).
In my company we are using central Jira instance. One of the widgets I plan to build should expose information from this Jira using the cyclotron json data source and Jira REST API.
This central Jira can be accessed only by authenticated users maintained in central LDAP. To authenticate themselves every user has certificate installed on its browser or he/she has to provide user credentials when connecting to Jira on via the standard Jira login page.

As there is no option to register service user (in the central LDAP) especially for cyclotron backend I'm searching for an option the json datasource to authenticate with the credentials/certificate/authentication cookies stored in the browser for the user which opens the dashboard. And my question is: is that achievable and how?

Thank you in advance!
atod

Req. Advanced Filters

Give the ability to change filter type include/exclude and connect between two or more filter together

Dashboard Navigation UI

I just started using Cyclotron and for the most part am quite impressed. Lots of great functionality and decently easy to configure. However there's one glaring gap that I'm still in disbelief isn't there, and that's some UI for navigating pages on a dashboard. As far as I can tell, the only way to move between pages on a dashboard is to set them to auto-rotate, or to use arrow keys. I can't find any way to add like a ribbon on the bottom or a tree-list in the sidebar that automatically lists the pages by name and lets you browse and navigate to them. This seems an obvious limitation, and one that really hurts usability. I was even playing with some of the built-in example dashboards and it wasn't until I edited one that I realized it had 8 pages!

I have figured out a workaround by adding a sidebar section with HTML that contains links to the different pages (e.g. <a href="/dashboardname?page=1">Page Name</a>), but this is brittle since anytime the page list is modified, the links will need to be updated, and it's annoying that I have to manually create this in the first place. I also tried a link like <a href="/dashboardname/pagename">Page Name</a> which would at least handle page re-orders (though not renames), but it appears the app ignores changes to the pagename in the url so this doesn't work.

The nice thing about putting this in the sidebar (as opposed to a header widget) is you only only have to configure it once per dashboard. But AFAIK there's no way to make the sidebar open by default, so it's still not great for discoverability (adding an open-by-default sidebar option would be great).

Like I said, I'm impressed overall, but it's surprising that a tool that's otherwise so feature-rich would not have solved this already. Or am I missing something?

Integrating cyclotron with an existing web app

Hi.
I've just read the documentation and I have a question (although I didn't actually install it yet)...
Would it be possible to integrate it with an existing app? I mean, could I use it inside my own application just as a simple page?!

I suppose not since it's a node app, but I want to make sure before I start playing with it.

Thank you very much.