Merge pull request #4 from HejdesGit/feature/classNames

Be able to set class names for gauge.

Author: naikus

.gitignore

@@ -1,2 +1,54 @@
 /nbproject/
 /node_modules/
+
+### JetBrains IDEs ###
+# Covers JetBrains IDEs: IntelliJ, RubyMine, PhpStorm, AppCode, PyCharm, CLion, Android Studio and Webstorm
+# Reference: https://intellij-support.jetbrains.com/hc/en-us/articles/206544839
+
+# User-specific stuff:
+.idea/workspace.xml
+.idea/tasks.xml
+
+# Sensitive or high-churn files:
+.idea/dataSources.ids
+.idea/dataSources.xml
+.idea/dataSources.local.xml
+.idea/sqlDataSources.xml
+.idea/dynamic.xml
+.idea/uiDesigner.xml
+
+# Gradle:
+.idea/gradle.xml
+.idea/libraries
+
+# Mongo Explorer plugin:
+.idea/mongoSettings.xml
+
+## File-based project format:
+*.iws
+
+## Plugin-specific files:
+
+# IntelliJ
+/out/
+
+# mpeltonen/sbt-idea plugin
+.idea_modules/
+
+# JIRA plugin
+atlassian-ide-plugin.xml
+
+# Crashlytics plugin (for Android Studio and IntelliJ)
+com_crashlytics_export_strings.xml
+crashlytics.properties
+crashlytics-build.properties
+fabric.properties
+
+### WebStorm Patch ###
+# Comment Reason: https://github.com/joeblau/gitignore.io/issues/186#issuecomment-215987721
+
+# *.iml
+# modules.xml
+# .idea/misc.xml
+# *.ipr
+.idea/

README.md

@@ -72,6 +72,11 @@ cpuGauge.setValueAnimated(90, 1);
 | ```max```            | The maximum value for the gauge (```100```)  |
 | ```label```          | Optional function that returns a string label that will be rendered in the center. This function will be passed the current value |
 | ```showValue```      | Whether to show the value at the center of the gauge (```true```) |
+| ```gaugeClass```     | The gauge class of the gauge (```gauge```) |
+| ```valueClass```     | The value class of the gauge (```value```) |
+| ```valueTextClass``` | The value text class of the gauge (```value-text```) |
+| ```dialClass```      | The dail class of the gauge (```dial```) |
+
 
 
 

src/gauge.js

@@ -171,6 +171,10 @@
           valueLabelRender = typeof (opts.label) === "function" ? opts.label : defaultLabelRenderer,
           startAngle = typeof (opts.dialStartAngle) === "undefined" ? 135 : opts.dialStartAngle,
           endAngle = typeof (opts.dialEndAngle) === "undefined" ? 45 : opts.dialEndAngle,
+          valueClass = typeof (opts.valueClass) === "undefined" ? 'value' : opts.valueClass,
+          valueTextClass = typeof (opts.valueTextClass) === "undefined" ? 'value-text' : opts.valueTextClass,
+          dialClass = typeof (opts.dialClass) === "undefined" ? 'dial' : opts.dialClass,
+          gaugeClass = typeof (opts.gaugeClass) === "undefined" ? 'gauge' : opts.gaugeClass,
           gaugeTextElem,
           gaugeValuePath,
           instance;
@@ -193,15 +197,15 @@
 
       function initializeGauge(elem) {
         gaugeTextElem = svg("text", {
-          "class": "value-text",
+          "class": valueTextClass,
           "x": 500,
           "y": 550,
           "font-size": "300%",
           "stroke": "#666",
           "text-anchor": "middle"
         });
         gaugeValuePath = svg("path", {
-          "class": "value",
+          "class": valueClass,
           "fill": "transparent",
           "stroke": "#666",
           "stroke-width": 20,
@@ -210,10 +214,10 @@
 
         var angle = getAngle(100, 360 - Math.abs(startAngle - endAngle));
         var flag = angle <= 180 ? 0 : 1;
-        var gaugeElement = svg("svg", {"viewBox": "0 0 1000 1000", "class": "gauge"}, 
+        var gaugeElement = svg("svg", {"viewBox": "0 0 1000 1000", "class": gaugeClass},
           [
             svg("path", {
-              "class": "dial",
+              "class": dialClass,
               "fill": "transparent",
               "stroke": "#eee",
               "stroke-width": 20,