v1.0.0 (#64)

* v1.0.0 release
yesoreyeram · Feb 26, 2019 · d14e1e0 · d14e1e0
1 parent 06dcdcc
commit d14e1e0
Show file tree

Hide file tree

Showing 50 changed files with 2,796 additions and 2,442 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -7,7 +7,7 @@ jobs:
   build:
     docker:
       # specify the version you desire here
-      - image: circleci/node:7.10
+      - image: circleci/node:latest
 
       # Specify service dependencies here if necessary
       # CircleCI maintains a library of pre-built images

diff --git a/.gitignore b/.gitignore
@@ -1,2 +1,4 @@
 node_modules/
-package-lock.json
+package-lock.json
+.tscache/
+*.tmp.txt
diff --git a/GruntFile.js b/GruntFile.js
@@ -1,18 +1,17 @@
+const sass = require('node-sass');
+
 module.exports = grunt => {
   require("load-grunt-tasks")(grunt);
 
-  grunt.loadNpmTasks("grunt-execute");
-  grunt.loadNpmTasks("grunt-contrib-clean");
-  grunt.loadNpmTasks('grunt-typescript');
-
   grunt.initConfig({
+
     clean: ["dist"],
 
     copy: {
       src_to_dist: {
         cwd: "src",
         expand: true,
-        src: ["**/*", "css/*.css", "!**/*.ts", "!**/*.js", "!**/*.scss", "!img/**/*"],
+        src: ["**/*", "!**/*.ts", "!**/*.js", "!**/*.scss", "!img/**/*"],
         dest: "dist"
       },
       pluginDef: {
@@ -38,29 +37,59 @@ module.exports = grunt => {
       }
     },
 
-    typescript: {
+    sass: {
       build: {
-        src: ['src/**/*.ts', '!**/*.d.ts'],
-        dest: 'dist/',
         options: {
-          module: 'system',
-          target: 'es5',
-          declaration: false,
-          emitDecoratorMetadata: true,
-          experimentalDecorators: true,
-          sourceMap: true,
-          noImplicitAny: false,
+          debugInfo: true,
+          check: true,
+          implementation: sass,
+          sourceMap: false
+        },
+        files: {
+          'dist/css/default.dark.css': 'src/css/default.dark.scss',
+          'dist/css/default.light.css': 'src/css/default.light.scss'
         }
       }
+    },
+
+    tslint : {
+      options: {
+        configuration: "tslint.json"
+      },
+      files: {
+        src: ['src/**/*.ts'],
+      },
+    },
+
+    ts: {
+      default: {
+        tsconfig: './tsconfig.json'
+      }
+    },
+
+    run: {
+      options: {
+      },
+      tests: {
+        exec: "npm run test"
+      }
     }
 
   });
 
+  grunt.registerTask("test", [
+    "run:tests",
+    "tslint"
+  ]);
+
   grunt.registerTask("default", [
     "clean",
+    "run:tests",
+    "tslint",
+    "ts:default",
+    "sass:build",
     "copy:src_to_dist",
     "copy:pluginDef",
-    "copy:img_to_dist",
-    "typescript"
+    "copy:img_to_dist"
   ]);
 };
diff --git a/README.md b/README.md
@@ -9,7 +9,6 @@ Boom Table Panel for Grafana. Table/MultiStat plugin with multiple columns for G
 
 ![Boom Table - Panel with Font Awesome icons](https://raw.githubusercontent.com/yesoreyeram/yesoreyeram-boomtable-panel/master/dist/src/img/panels-fa.png)
 
-![Image transform](https://raw.githubusercontent.com/yesoreyeram/yesoreyeram-boomtable-panel/master/dist/src/img/img-transform-example.png)
 
 Features :
 ----------
@@ -41,30 +40,24 @@ Tested Grafana versions :
 
 * Grafana version 4.5.2
 * Grafana version 5.0.2
+* Grafana version 6.0.0
 
 
 Screenshots :
 -------------
 
 Pattern Editors Sample screenshots
 
-![Boom Table - Editor 1 Screenshot](https://raw.githubusercontent.com/yesoreyeram/yesoreyeram-boomtable-panel/master/dist/src/img/editor-1.png)
+![image](https://user-images.githubusercontent.com/153843/53409051-e973f580-39b7-11e9-83e3-e1b6306abafb.png)
 
-![Boom Table - Editor 2 Screenshot](https://raw.githubusercontent.com/yesoreyeram/yesoreyeram-boomtable-panel/master/dist/src/img/editor-2.png)
+![image](https://user-images.githubusercontent.com/153843/53409071-fa246b80-39b7-11e9-9e8e-05baa8fc1531.png)
 
-![Boom Table - Editor Default Screenshot](https://raw.githubusercontent.com/yesoreyeram/yesoreyeram-boomtable-panel/master/dist/src/img/editor-default.png)
+![image](https://user-images.githubusercontent.com/153843/53409114-13c5b300-39b8-11e9-9227-339dcd110276.png)
 
 Debug UI Sample screenshots
 
-![Boom Table - Debug UI Screenshot](https://raw.githubusercontent.com/yesoreyeram/yesoreyeram-boomtable-panel/master/dist/src/img/debug-ui.png)
-
-Metrics screenshots
-
-![Boom Table - Metrics Screenshot](https://raw.githubusercontent.com/yesoreyeram/yesoreyeram-boomtable-panel/master/dist/src/img/metrics.png)
+![image](https://user-images.githubusercontent.com/153843/53409376-acf4c980-39b8-11e9-89bc-363822fe370d.png)
 
-Version 5 screenshots
-
-![Boom Table - Version 5 support Screenshot](https://raw.githubusercontent.com/yesoreyeram/yesoreyeram-boomtable-panel/master/dist/src/img/version-5.0.2.png)
 
 # Setup
 
@@ -108,7 +101,7 @@ patterns and matching metrics
 Row and Column name guidelines
 ------------------------------
 
-Row and Col names are derived from series name. If n is wrapped by "_", then that will be replaced by n-th column in graphite/influxdb/prometheus metric (seperated by delimiter). Refer below examples and screenshots to get more idea. Or use debug mode to try.
+Row and Col names are derived from series name. If n is wrapped by "_", then that will be replaced by n-th column in graphite/influxdb/prometheus metric (seperated by delimiter). Refer below examples and screenshots to get more idea. Or use debug mode to try. (n starts from index 0)
 
 Sample graphite series / Influx / Prometheus Metrics
 
@@ -220,6 +213,8 @@ Logic is same as background color. But the value to be displayed can be altered
 
 `_col_name_` will be replaced by col name. This will be useful when you hide the table header.
 
+`_n_` will be replaced by nth part of the series using `_` delimiter. Same rule as row_name and col_name
+
 Example transformation patterns :
 
     _value_|_value_|_value_
@@ -329,6 +324,21 @@ If your row name / col name / transform metrics contains strings that starts wit
 
 Note : When using images from other domains, please take care of CORS policy, legal and copyright polices.
 
+Options
+-------
+
+`Text alignment for first column` -> This option specify the text alignment of first column cells in the table. Can be `left`,`right` or `center`. Default is left. 
+
+`Text alignment for table header` -> This option specify the text alignment of table headers excluding first column. Can be `left`,`right` or `center`. Default is left.
+
+`Text alignment for values` -> This option specify the text alignment of value cells in the table. Can be `left`,`right` or `center`. Default is left.
+
+`Non matching cells text` -> If no series matches for the given row and col match, the corresponding text can be specified using this option. This option can also contain font awesome and image replacement tokens.
+
+`Non matching cells BG Color` -> If no series matches for the given row and col match, the corresponding bg color can be specified using this option
+
+`Non matching cells Text Color` -> If no series matches for the given row and col match, the corresponding text color can be specified using this option
+
 Prometheus Guidelines
 ---------------------
 
@@ -354,6 +364,11 @@ Same as other time series data sources. You need to properly format your legend
 
 | Version | Changes |
 | --------|-----------|
+| 1.0.0   | Typescript & TSLint implementation |
+|         | Jest testcases implemented |
+|         | SASS implementation for stylesheets |
+|         | Display options improved |
+|         | Display values can have part of series name |
 | 0.5.1   | Images as values based on thresholds |
 | 0.5.0   | Background Color & Transform value overrides |
 |         | Bug fixes #43 #44 #45 |

diff --git a/dist/README.md b/dist/README.md
@@ -9,7 +9,6 @@ Boom Table Panel for Grafana. Table/MultiStat plugin with multiple columns for G
 
 ![Boom Table - Panel with Font Awesome icons](https://raw.githubusercontent.com/yesoreyeram/yesoreyeram-boomtable-panel/master/dist/src/img/panels-fa.png)
 
-![Image transform](https://raw.githubusercontent.com/yesoreyeram/yesoreyeram-boomtable-panel/master/dist/src/img/img-transform-example.png)
 
 Features :
 ----------
@@ -41,30 +40,24 @@ Tested Grafana versions :
 
 * Grafana version 4.5.2
 * Grafana version 5.0.2
+* Grafana version 6.0.0
 
 
 Screenshots :
 -------------
 
 Pattern Editors Sample screenshots
 
-![Boom Table - Editor 1 Screenshot](https://raw.githubusercontent.com/yesoreyeram/yesoreyeram-boomtable-panel/master/dist/src/img/editor-1.png)
+![image](https://user-images.githubusercontent.com/153843/53409051-e973f580-39b7-11e9-83e3-e1b6306abafb.png)
 
-![Boom Table - Editor 2 Screenshot](https://raw.githubusercontent.com/yesoreyeram/yesoreyeram-boomtable-panel/master/dist/src/img/editor-2.png)
+![image](https://user-images.githubusercontent.com/153843/53409071-fa246b80-39b7-11e9-9e8e-05baa8fc1531.png)
 
-![Boom Table - Editor Default Screenshot](https://raw.githubusercontent.com/yesoreyeram/yesoreyeram-boomtable-panel/master/dist/src/img/editor-default.png)
+![image](https://user-images.githubusercontent.com/153843/53409114-13c5b300-39b8-11e9-9227-339dcd110276.png)
 
 Debug UI Sample screenshots
 
-![Boom Table - Debug UI Screenshot](https://raw.githubusercontent.com/yesoreyeram/yesoreyeram-boomtable-panel/master/dist/src/img/debug-ui.png)
-
-Metrics screenshots
-
-![Boom Table - Metrics Screenshot](https://raw.githubusercontent.com/yesoreyeram/yesoreyeram-boomtable-panel/master/dist/src/img/metrics.png)
+![image](https://user-images.githubusercontent.com/153843/53409376-acf4c980-39b8-11e9-89bc-363822fe370d.png)
 
-Version 5 screenshots
-
-![Boom Table - Version 5 support Screenshot](https://raw.githubusercontent.com/yesoreyeram/yesoreyeram-boomtable-panel/master/dist/src/img/version-5.0.2.png)
 
 # Setup
 
@@ -108,7 +101,7 @@ patterns and matching metrics
 Row and Column name guidelines
 ------------------------------
 
-Row and Col names are derived from series name. If n is wrapped by "_", then that will be replaced by n-th column in graphite/influxdb/prometheus metric (seperated by delimiter). Refer below examples and screenshots to get more idea. Or use debug mode to try.
+Row and Col names are derived from series name. If n is wrapped by "_", then that will be replaced by n-th column in graphite/influxdb/prometheus metric (seperated by delimiter). Refer below examples and screenshots to get more idea. Or use debug mode to try. (n starts from index 0)
 
 Sample graphite series / Influx / Prometheus Metrics
 
@@ -220,6 +213,8 @@ Logic is same as background color. But the value to be displayed can be altered
 
 `_col_name_` will be replaced by col name. This will be useful when you hide the table header.
 
+`_n_` will be replaced by nth part of the series using `_` delimiter. Same rule as row_name and col_name
+
 Example transformation patterns :
 
     _value_|_value_|_value_
@@ -329,6 +324,21 @@ If your row name / col name / transform metrics contains strings that starts wit
 
 Note : When using images from other domains, please take care of CORS policy, legal and copyright polices.
 
+Options
+-------
+
+`Text alignment for first column` -> This option specify the text alignment of first column cells in the table. Can be `left`,`right` or `center`. Default is left. 
+
+`Text alignment for table header` -> This option specify the text alignment of table headers excluding first column. Can be `left`,`right` or `center`. Default is left.
+
+`Text alignment for values` -> This option specify the text alignment of value cells in the table. Can be `left`,`right` or `center`. Default is left.
+
+`Non matching cells text` -> If no series matches for the given row and col match, the corresponding text can be specified using this option. This option can also contain font awesome and image replacement tokens.
+
+`Non matching cells BG Color` -> If no series matches for the given row and col match, the corresponding bg color can be specified using this option
+
+`Non matching cells Text Color` -> If no series matches for the given row and col match, the corresponding text color can be specified using this option
+
 Prometheus Guidelines
 ---------------------
 
@@ -354,6 +364,11 @@ Same as other time series data sources. You need to properly format your legend
 
 | Version | Changes |
 | --------|-----------|
+| 1.0.0   | Typescript & TSLint implementation |
+|         | Jest testcases implemented |
+|         | SASS implementation for stylesheets |
+|         | Display options improved |
+|         | Display values can have part of series name |
 | 0.5.1   | Images as values based on thresholds |
 | 0.5.0   | Background Color & Transform value overrides |
 |         | Bug fixes #43 #44 #45 |