var blessed = require('blessed') , contrib = require('../index') var screen = blessed.screen() //create layout and widgets var grid = new contrib.grid({rows: 12, cols: 12, screen: screen}) /** * Donut Options self.options.radius = options.radius || 14; // how wide is it? over 5 is best self.options.arcWidth = options.arcWidth || 4; //width of the donut self.options.yPadding = options.yPadding || 2; //padding from the top */ var donut = grid.set(8, 8, 4, 2, contrib.donut, { label: 'Percent Donut', radius: 16, arcWidth: 4, yPadding: 2, data: [{label: 'Storage', percent: 87}] }) // var latencyLine = grid.set(8, 8, 4, 2, contrib.line, // { style: // { line: "yellow" // , text: "green" // , baseline: "black"} // , xLabelPadding: 3 // , xPadding: 5 // , label: 'Network Latency (sec)'}) var gauge = grid.set(8, 10, 2, 2, contrib.gauge, {label: 'Storage', percent: [80,20]}) var gauge_two = grid.set(2, 9, 2, 3, contrib.gauge, {label: 'Deployment Progress', percent: 80}) var sparkline = grid.set(10, 10, 2, 2, contrib.sparkline, { label: 'Throughput (bits/sec)' , tags: true , style: { fg: 'blue', titleFg: 'white' }}) var bar = grid.set(4, 6, 4, 3, contrib.bar, { label: 'Server Utilization (%)' , barWidth: 4 , barSpacing: 6 , xOffset: 2 , maxHeight: 9}) var table = grid.set(4, 9, 4, 3, contrib.table, { keys: true , fg: 'green' , label: 'Active Processes' , columnSpacing: 1 , columnWidth: [24, 10, 10]}) /* * * LCD Options //these options need to be modified epending on the resulting positioning/size options.segmentWidth = options.segmentWidth || 0.06; // how wide are the segments in % so 50% = 0.5 options.segmentInterval = options.segmentInterval || 0.11; // spacing between the segments in % so 50% = 0.5 options.strokeWidth = options.strokeWidth || 0.11; // spacing between the segments in % so 50% = 0.5 //default display settings options.elements = options.elements || 3; // how many elements in the display. or how many characters can be displayed. options.display = options.display || 321; // what should be displayed before anything is set options.elementSpacing = options.spacing || 4; // spacing between each element options.elementPadding = options.padding || 2; // how far away from the edges to put the elements //coloring options.color = options.color || "white"; */ var lcdLineOne = grid.set(0,9,2,3, contrib.lcd, { label: "LCD Test", segmentWidth: 0.06, segmentInterval: 0.11, strokeWidth: 0.1, elements: 5, display: 3210, elementSpacing: 4, elementPadding: 2 } ); var errorsLine = grid.set(0, 6, 4, 3, contrib.line, { style: { line: "red" , text: "white" , baseline: "black"} , label: 'Errors Rate' , maxY: 60 , showLegend: true }) var transactionsLine = grid.set(0, 0, 6, 6, contrib.line, { showNthLabel: 5 , maxY: 100 , label: 'Total Transactions' , showLegend: true , legend: {width: 10}}) var map = grid.set(6, 0, 6, 6, contrib.map, {label: 'Servers Location'}) var log = grid.set(8, 6, 4, 2, contrib.log, { fg: "green" , selectedFg: "green" , label: 'Server Log'}) //dummy data var servers = ['US1', 'US2', 'EU1', 'AU1', 'AS1', 'JP1'] var commands = ['grep', 'node', 'java', 'timer', '~/ls -l', 'netns', 'watchdog', 'gulp', 'tar -xvf', 'awk', 'npm install'] //set dummy data on gauge var gauge_percent = 0 setInterval(function() { gauge.setData([gauge_percent, 100-gauge_percent]); gauge_percent++; if (gauge_percent>=100) gauge_percent = 0 }, 200) var gauge_percent_two = 0 setInterval(function() { gauge_two.setData(gauge_percent_two); gauge_percent_two++; if (gauge_percent_two>=100) gauge_percent_two = 0 }, 200); //set dummy data on bar chart function fillBar() { var arr = [] for (var i=0; i 0.99) pct = 0.00; var color = "green"; if (pct >= 0.25) color = "cyan"; if (pct >= 0.5) color = "yellow"; if (pct >= 0.75) color = "red"; donut.setData([ {percent: parseFloat((pct+0.00) % 1).toFixed(2), label: 'storage', 'color': color} ]); pct += 0.01; } setInterval(function() { updateDonut(); screen.render() }, 500) function setLineData(mockData, line) { for (var i=0; i