geico-design-kit 7.0.0

package/dist/components/ConsolidatedSummary.js

@@ -0,0 +1,489 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _baseComponent = _interopRequireDefault(require("../../src/baseComponent"));
+var _UserAgentService = _interopRequireDefault(require("../../src/services/UserAgentService"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
+function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
+function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+var PromiseIE = require('es6-promise-polyfill').Promise;
+// get the correct click event
+var clickEventName = _UserAgentService["default"]._clickEventName();
+var validateSettings = [{
+  setting: "content",
+  isRequired: true,
+  validate: "type",
+  possibleValues: ["string", "object"],
+  errorMessage: ["GDK Consolidated Summary : Content must be defined and set to a DOM selector or Node"]
+}, {
+  setting: "autoLoad",
+  isRequired: false,
+  validate: "type",
+  possibleValues: ["boolean"],
+  errorMessage: ["GDK Consolidated Summary : autoLoad must be a boolean"]
+}, {
+  setting: "loadPlog",
+  isRequired: false,
+  validate: "type",
+  possibleValues: ["function"],
+  errorMessage: ["GDK Consolidated Summary : loadPlog must be a function"]
+}];
+
+/**
+ * Consolidated Summary Component: This is integrated informative component for GEICO Counselors. Main purpose is to ease counselors
+ * work by displaying various information on selected policy holder.
+ */
+var ConsolidatedSummary = /*#__PURE__*/function () {
+  /**
+   *
+   * @param options
+   */
+  function ConsolidatedSummary(options) {
+    _classCallCheck(this, ConsolidatedSummary);
+    this._internalVars = {
+      node: null,
+      //used for the current node
+      consolidatedSummary: null //holds reference to the consolidated Summary node;
+    };
+    this._defaults = {
+      initialTabOpen: 1,
+      autoLoad: true,
+      loadPlog: function loadPlog() {
+        //Return an empty promise
+        return new PromiseIE(function (resolve, reject) {
+          resolve();
+        });
+      }
+    };
+    if (options && _typeof(options) === "object") {
+      this._options = _baseComponent["default"].extendDefaults(this._defaults, options);
+    }
+    if (_baseComponent["default"].validateSettings(this._options, validateSettings)) {
+      this._internalVars.contentType = _baseComponent["default"].getContentType(this);
+      setLocalVars.call(this);
+      setEvents.call(this);
+      init.call(this);
+    }
+  }
+
+  /**
+   * This method cleans up all Consolidated Summary tracks in the DOM, but does NOT destroy
+   * the Consolidated Summary Object.
+   */
+  return _createClass(ConsolidatedSummary, [{
+    key: "hide",
+    value: function hide() {
+      hideComponent.call(this);
+    }
+
+    /**
+     * This global method displays consolodated summary.
+     * @param initFix
+     */
+  }, {
+    key: "show",
+    value: function show(initFix) {
+      var node = this._internalVars.node;
+      if (initFix) {
+        this._internalVars.pageWrapper.classList.add('consolidated-summary-enabled');
+        if (this._internalVars.toTop !== null) {
+          this._internalVars.toTop.classList.add('consolidated-summary-enabled');
+        }
+      } else {
+        displayComponent.call(this);
+      }
+    }
+
+    /**
+     * Destroy the Consolidated Summary component.
+     */
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      removeEvents.call(this);
+      delete this._internalVars;
+    }
+  }]);
+}();
+/**
+ * Initializing method
+ */
+function init() {
+  // make sure the #wrapper don't have the .pinned-consolidated-summary class;
+  this._internalVars.csWrapper.classList.remove('pinned-consolidated-summary');
+  if (this._options.autoLoad && this._internalVars.node.classList.contains('hidden')) {
+    this.show();
+  } else if (!this._options.autoLoad && !this._internalVars.node.classList.contains('hidden')) {
+    this.hide();
+  } else if (this._options.autoLoad && !this._internalVars.node.classList.contains('hidden')) {
+    this.show(true);
+  }
+  this._internalVars.node.classList.remove('extended');
+  if (this._internalVars.plogComponent && (!this._internalVars.plogComponent.classList || !this._internalVars.plogComponent.classList.contains('extended'))) {
+    this._internalVars.plogComponent.classList.add('hidden');
+  }
+
+  /* Instantiate the tabs */
+  openInitialTab.call(this);
+}
+
+/**
+ * method to set events for the component
+ */
+function setEvents() {
+  /* Tabs */
+  var tabs = this._internalVars.verticalTabs.querySelectorAll('.tab');
+  var plogBtn, plogResizeBtn, plogMinimizeBtn;
+
+  /* PLOG Controls */
+  if (this._internalVars.plogComponent !== null && this._internalVars.plogBtn !== null) {
+    plogBtn = this._internalVars.plogBtn;
+    /*PLOG Window Controls */
+    plogResizeBtn = this._internalVars.plogComponent.querySelector(".plogResizeBtn");
+    plogMinimizeBtn = this._internalVars.plogComponent.querySelector(".plogMinimizeBtn");
+  }
+
+  // On mouse click behavior
+  this._internalVars.csWrapper.addEventListener(clickEventName, extendCSHandler.bind(this));
+  // this._internalVars.csWrapper.addEventListener(clickEventName, function () {
+  //   console.log("opa opa");
+  // });
+  // On mouse leave behavior
+  // this._internalVars.csWrapper.addEventListener("mouseleave", retractCSHandler.call(this));
+  this._internalVars.csWrapper.addEventListener("mouseleave", retractCSHandler.bind(this));
+
+  // implement "pinned" functionality
+  this._internalVars.node.querySelector(".consolidated-summary-pin").addEventListener(clickEventName, pinHandler.bind(this));
+  Array.prototype.map.call(tabs, function (element) {
+    element.addEventListener(clickEventName, tabClickHandler.bind(this));
+  }.bind(this));
+  if (plogBtn) {
+    plogBtn.addEventListener(clickEventName, pLogToggleHandler.bind(this));
+  }
+  if (plogMinimizeBtn) {
+    plogMinimizeBtn.addEventListener(clickEventName, minimizePlogHandler.bind(this));
+  }
+  if (plogResizeBtn) {
+    plogResizeBtn.addEventListener(clickEventName, resizePlogHandler.bind(this));
+  }
+  if (this._internalVars.delete_switch !== null) {
+    this._internalVars.delete_switch.addEventListener(clickEventName, toggleNotesDeleteButtons.bind(this));
+  }
+}
+
+/**
+ * method to remove events for the component
+ */
+function removeEvents() {
+  /* Tabs */
+  var tabs = this._internalVars.verticalTabs.querySelectorAll('.tab');
+  var plogBtn, plogResizeBtn, plogMinimizeBtn;
+
+  /* PLOG Controls */
+  if (this._internalVars.plogComponent !== null && this._internalVars.plogBtn !== null) {
+    plogBtn = this._internalVars.plogBtn;
+    /*PLOG Window Controls */
+    plogResizeBtn = this._internalVars.plogComponent.querySelector(".plogResizeBtn");
+    plogMinimizeBtn = this._internalVars.plogComponent.querySelector(".plogMinimizeBtn");
+  }
+
+  // On mouse click behavior
+  this._internalVars.csWrapper.removeEventListener(clickEventName, extendCSHandler.bind(this));
+  // On mouse leave behavior
+  this._internalVars.csWrapper.removeEventListener("mouseleave", retractCSHandler.bind(this));
+  // implement "pinned" functionality
+  this._internalVars.node.querySelector(".consolidated-summary-pin").removeEventListener(clickEventName, pinHandler.bind(this));
+  Array.prototype.map.call(tabs, function (element) {
+    element.removeEventListener(clickEventName, tabClickHandler.bind(this));
+  }.bind(this));
+  if (plogBtn) {
+    plogBtn.removeEventListener(clickEventName, pLogToggleHandler.bind(this));
+  }
+  if (plogMinimizeBtn) {
+    plogMinimizeBtn.removeEventListener(clickEventName, minimizePlogHandler.bind(this));
+  }
+  if (plogResizeBtn) {
+    plogResizeBtn.removeEventListener(clickEventName, resizePlogHandler.bind(this));
+  }
+}
+function extendCSHandler() {
+  console.log('Wrapper is clicked');
+  this._internalVars.node.classList.add("extended");
+  if (this._internalVars.toTop !== null) {
+    this._internalVars.toTop.classList.add('consolidated-summary-extended');
+  }
+}
+function retractCSHandler() {
+  this._internalVars.node.classList.remove("extended");
+  if (this._internalVars.toTop !== null) {
+    this._internalVars.toTop.classList.remove('consolidated-summary-extended');
+  }
+}
+function pinHandler() {
+  if (!this._internalVars.node.classList.contains("pinned")) {
+    this._internalVars.pageWrapper.classList.add('pinned-consolidated-summary');
+    if (this._internalVars.toTop !== null) {
+      this._internalVars.toTop.classList.add('consolidated-summary-pinned');
+    }
+    if (this._internalVars.drtMessage !== null) {
+      var dockedMsgArray = document.querySelectorAll('.docked-real-time-message-wrapper');
+      Array.prototype.forEach.call(dockedMsgArray, function (element) {
+        if (!element.classList.contains('con-sum-pinned')) {
+          if (element.hasAttribute('id')) {
+            element.classList.add('con-sum-three-hundred-fix');
+          }
+          element.classList.add('con-sum-pinned');
+        }
+      });
+    }
+    this._internalVars.node.classList.add("pinned");
+  } else {
+    this._internalVars.pageWrapper.classList.remove('pinned-consolidated-summary');
+    if (this._internalVars.toTop !== null) {
+      if (this._internalVars.toTop.classList.contains('consolidated-summary-pinned')) {
+        this._internalVars.toTop.classList.remove('consolidated-summary-pinned');
+      }
+    }
+    if (this._internalVars.drtMessage !== null) {
+      var _dockedMsgArray = document.querySelectorAll('.docked-real-time-message-wrapper');
+      Array.prototype.forEach.call(_dockedMsgArray, function (element) {
+        if (element.classList.contains('con-sum-pinned')) {
+          if (element.hasAttribute('id')) {
+            element.classList.remove('con-sum-three-hundred-fix');
+          }
+          element.classList.remove('con-sum-pinned');
+        }
+      });
+    }
+    this._internalVars.node.classList.remove("pinned");
+  }
+}
+function pLogToggleHandler() {
+  this._options.loadPlog().then(plogToggle.call(this));
+  function plogToggle() {
+    // hide Policy Notes
+    if (!this._internalVars.plogComponent.classList.contains("hidden")) {
+      this._internalVars.plogComponent.classList.add("hidden");
+      if (this._internalVars.toTop !== null) {
+        this._internalVars.toTop.classList.remove('plog-enabled');
+      }
+    } else {
+      // Display Policy Notes
+      this._internalVars.plogComponent.classList.remove("hidden");
+      if (this._internalVars.toTop !== null) {
+        this._internalVars.toTop.classList.add('plog-enabled');
+      }
+    }
+  }
+}
+function toggleNotesDeleteButtons(e) {
+  e.target.parentElement.parentElement.parentElement.classList.add('admin-on');
+  var notes = this._internalVars.plogComponent.querySelectorAll('.policy-note>.note-details>.delete-note');
+  for (var note in notes) {
+    if (_typeof(notes[note]) === 'object') {
+      notes[note].classList.remove('hidden');
+    }
+  }
+}
+function minimizePlogHandler() {
+  if (!this._internalVars.plogComponent.classList.contains("hidden")) {
+    this._internalVars.plogComponent.classList.remove("maximized");
+    if (this._internalVars.toTop !== null) {
+      if (!this._internalVars.node.classList.contains('extended') && this._internalVars.toTop.classList.contains('consolidated-summary-extended')) {
+        this._internalVars.toTop.classList.remove('consolidated-summary-extended');
+      }
+      if (!this._internalVars.node.classList.contains("pinned") && this._internalVars.toTop.classList.contains('consolidated-summary-pinned')) {
+        this._internalVars.toTop.classList.remove('consolidated-summary-pinned');
+      }
+      this._internalVars.toTop.classList.remove('plog-enabled');
+    }
+    this._internalVars.plogComponent.classList.add("hidden");
+  } else {
+    this._internalVars.plogComponent.classList.remove("hidden");
+  }
+}
+function resizePlogHandler() {
+  if (!this._internalVars.plogComponent.classList.contains("maximized")) {
+    if (this._internalVars.node.classList && this._internalVars.node.classList.contains("extended")) {
+      this._internalVars.node.classList.remove("extended");
+    }
+    if (this._internalVars.node.classList && this._internalVars.node.classList.contains("pinned")) {
+      this._internalVars.pageWrapper.classList.remove('pinned-consolidated-summary');
+      this._internalVars.node.classList.remove("pinned");
+    }
+    this._internalVars.plogComponent.classList.add("maximized");
+  } else {
+    this._internalVars.plogComponent.classList.remove("maximized");
+  }
+}
+
+/* Tabs Methods */
+
+/**
+ * tabClickHandler()
+ * Opens tab content for clicked tab and hides the rest
+ */
+function tabClickHandler(element) {
+  var _this = this;
+  var currentNode = element.currentTarget;
+  //get index of clicked tab
+  var index = [].indexOf.call(this._internalVars.tabs, currentNode);
+  if (this._options.tabClicked) if (this._options.tabClicked(currentNode) === false) return false;
+  Array.prototype.map.call(this._internalVars.tabs, function (element) {
+    if (element === currentNode) {
+      element.classList.add("active");
+    } else {
+      element.classList.remove("active");
+    }
+  });
+  Array.prototype.map.call(this._internalVars.panels, function (element, i) {
+    if (i === index) {
+      openPanel.call(_this, element);
+    } else {
+      closePanel.call(_this, element);
+    }
+  });
+}
+
+/**
+ * openInitialTab()
+ * Opens tab content for tab set by initialTabOpen
+ */
+function openInitialTab() {
+  var _this2 = this;
+  var tabIndex = this._options.initialTabOpen - 1;
+  Array.prototype.map.call(this._internalVars.tabs, function (element, i) {
+    if (i === tabIndex) {
+      element.classList.add("active");
+    } else {
+      element.classList.remove("active");
+    }
+  });
+  Array.prototype.map.call(this._internalVars.panels, function (element, i) {
+    if (i === tabIndex) {
+      openPanel.call(_this2, element);
+    } else {
+      closePanel.call(_this2, element);
+    }
+  });
+}
+
+/**
+ * openPanel()
+ * Opens panel at the same index as the clicked tab and hides the other panels
+ */
+function openPanel(element) {
+  element.classList.add("active");
+}
+
+/**
+ * closePanel()
+ * closes the past in panel
+ */
+function closePanel(element) {
+  element.classList.remove("active");
+}
+
+/**
+ * Displays the component (display).
+ */
+function displayComponent() {
+  var node = this._internalVars.node;
+  /* con-sum-on */
+  if (this._internalVars.node.classList) {
+    if (this._internalVars.node.classList.contains('hidden')) {
+      this._internalVars.node.classList.remove("hidden");
+      if (!this._internalVars.pageWrapper.classList.contains('consolidated-summary-enabled')) {
+        this._internalVars.pageWrapper.classList.add('consolidated-summary-enabled');
+      }
+      if (this._internalVars.toTop !== null) {
+        if (!this._internalVars.toTop.classList.contains('consolidated-summary-enabled')) {
+          this._internalVars.toTop.classList.add('consolidated-summary-enabled');
+        }
+      }
+      if (this._internalVars.drtMessage !== null) {
+        var dockedMsgArray = document.querySelectorAll('.docked-real-time-message-wrapper');
+        Array.prototype.forEach.call(dockedMsgArray, function (element) {
+          if (!element.classList.contains('con-sum-on')) {
+            if (element.hasAttribute('id')) {
+              element.classList.add('con-sum-fifty-fix');
+            }
+            element.classList.add('con-sum-on');
+          }
+        });
+      }
+    }
+  }
+}
+
+/**
+ * Hides the component (hide)
+ */
+function hideComponent() {
+  var node = this._internalVars.node;
+  // Hide Consolidated Summary if exists on the DOM
+  if (this._internalVars.node.classList.contains('extended')) {
+    this._internalVars.node.classList.remove('extended');
+  }
+  if (this._internalVars.node.classList.contains('pinned')) {
+    this._internalVars.node.classList.remove('pinned');
+  }
+  if (!this._internalVars.node.classList.contains('hidden')) {
+    this._internalVars.node.classList.add('hidden');
+  }
+
+  // Clean up any Docked Real Time Message classes
+  //   const drtMessage = document.querySelector('.docked-real-time-message-wrapper') || null;
+  if (this._internalVars.drtMessage !== null) {
+    var dockedMsgArray = document.querySelectorAll('.docked-real-time-message-wrapper');
+    Array.prototype.forEach.call(dockedMsgArray, function (element) {
+      if (element.classList.contains('con-sum-pinned')) {
+        if (element.hasAttribute('id')) {
+          element.classList.remove('con-sum-three-hundred-fix');
+        }
+        element.classList.remove('con-sum-pinned');
+      }
+    });
+  }
+  // Remove classes of the HTML DOM elements #wrapper and #to-top
+  this._internalVars.pageWrapper.classList.remove('consolidated-summary-enabled');
+  this._internalVars.pageWrapper.classList.remove('pinned-consolidated-summary');
+  this._internalVars.node.classList.remove('pinned');
+  if (this._internalVars.toTop !== null) {
+    this._internalVars.toTop.classList.remove('consolidated-summary-enabled');
+    this._internalVars.toTop.classList.remove('consolidated-summary-pinned');
+  }
+}
+
+/**
+ * Method to set local variables.
+ */
+function setLocalVars() {
+  if (this._internalVars.contentType === 'string') {
+    this._internalVars.node = document.querySelector(this._options.content);
+  } else if (this._internalVars.contentType === 'domNode') {
+    this._internalVars.node = this._options.content;
+  }
+  this._internalVars.csWrapper = this._internalVars.node.querySelector(".consolidated-summary-wrapper");
+  this._internalVars.verticalTabs = this._internalVars.node.querySelector('.consolidated-summary-content-tabs');
+  this._internalVars.tabs = this._internalVars.verticalTabs.querySelectorAll('.tab');
+  this._internalVars.panels = this._internalVars.verticalTabs.querySelectorAll('.panel');
+  // Check if Policy Log exists, then create local vars;
+  this._internalVars.plogComponent = this._internalVars.node.querySelector(".plog") || null;
+  this._internalVars.plogBtn = this._internalVars.node.querySelector(".plog-btn") || null;
+  this._internalVars.plogForm = this._internalVars.node.querySelector(".policy-note-input-form") || null;
+  this._internalVars.plogSendBtn = this._internalVars.node.querySelector(".plog-input-bar .send-btn") || null;
+  // External DOM Elements
+  this._internalVars.toTop = document.querySelector('#to-top') || null;
+  this._internalVars.pageWrapper = document.querySelector('#wrapper') || null;
+  this._internalVars.drtMessage = document.querySelector('.docked-real-time-message-wrapper') || null;
+  this._internalVars.delete_switch = document.querySelector('.admin-delete-switch') || null;
+}
+var _default = exports["default"] = ConsolidatedSummary;

package/dist/components/CoverageGraph.js

@@ -0,0 +1,201 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _baseComponent = _interopRequireDefault(require("../../src/baseComponent"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
+function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
+function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+var validateSettings = [{
+  setting: 'content',
+  isRequired: true,
+  validate: 'type',
+  possibleValues: ['string', 'object'],
+  errorMessage: ['GDK Alert : Content must be defined and set to a DOM selector or Node']
+}];
+var CoverageGraph = /*#__PURE__*/function () {
+  /**
+   * These are settings for the instantiation. Refer to the design kit section of this component for JS setting examples.
+   * @param {string|Object} content
+   *  A reference to the coverage graph node
+   */
+  function CoverageGraph(options) {
+    _classCallCheck(this, CoverageGraph);
+    this._internalVars = {
+      node: null,
+      //used for current node
+      breakdownNode: null,
+      legendNode: null,
+      labelArray: null,
+      costArray: null,
+      percentArray: [],
+      totalSum: 0,
+      percentSum: 0,
+      centerCircle: null
+    };
+
+    //options with defaults set
+    this._defaults = {};
+
+    // Create options by extending defaults with the passed in arugments
+    if (options && _typeof(options) === "object") {
+      this._options = _baseComponent["default"].extendDefaults(this._defaults, options);
+    }
+
+    //if the required options are valid set up the environment
+    if (_baseComponent["default"].validateSettings(this._options, validateSettings)) {
+      this._internalVars.contentType = _baseComponent["default"].getContentType(this);
+      setLocalVars.call(this);
+      setEvents.call(this);
+      appendCenterCost.call(this);
+      createSlices.call(this);
+      createLegend.call(this);
+    }
+  }
+
+  //Public Methods
+
+  /**
+   * destroy()
+   * removes the node from the dom and any events attached
+   */
+  return _createClass(CoverageGraph, [{
+    key: "destroy",
+    value: function destroy() {
+      $(this._internalVars.node).datepicker("destroy");
+      this._internalVars.node.parentNode.removeChild(this._internalVars.node);
+
+      //a little garbage collection
+      for (var variableKey in this) {
+        if (this.hasOwnProperty(variableKey)) {
+          delete this[variableKey];
+        }
+      }
+    }
+  }]);
+}(); // Private Methods
+function setLocalVars() {
+  if (this._internalVars.contentType === 'string') {
+    this._internalVars.node = document.querySelector(this._options.content);
+  } else if (this._internalVars.contentType === 'domNode') {
+    this._internalVars.node = this._options.content;
+  }
+  this._internalVars.breakdownNode = this._internalVars.node.querySelector('.coverage-graph-breakdown');
+  if (this._internalVars.breakdownNode.dataset !== undefined) {
+    this._internalVars.costArray = this._internalVars.breakdownNode.dataset.costbreakdown.split(" ");
+    this._internalVars.labelArray = this._internalVars.breakdownNode.dataset.labels.split(",");
+  } else {
+    this._internalVars.labelArray = this._internalVars.breakdownNode.getAttribute('data-labels').split(",");
+    this._internalVars.costArray = this._internalVars.breakdownNode.getAttribute('data-costbreakdown').split(" ");
+  }
+  this._internalVars.centerCircle = this._internalVars.breakdownNode.querySelector('.circle');
+  this._internalVars.legendNode = this._internalVars.node.querySelector('.legend');
+}
+
+/**
+ * setEvents()
+ * Sets all the events needed for the component
+ */
+function setEvents() {}
+function appendCenterCost() {
+  var monetary = this._internalVars.centerCircle.querySelector('.monetary');
+  var sumText = getCostSum.call(this);
+  var costBreakdownArray = sumText.toString().split(".");
+  var textNodeSum = document.createTextNode(costBreakdownArray[0]);
+  monetary.appendChild(textNodeSum);
+  var supElement = document.createElement('SUP');
+  var textNodeSumDecimal = document.createTextNode("." + costBreakdownArray[1]);
+  supElement.appendChild(textNodeSumDecimal);
+  monetary.appendChild(supElement);
+}
+function createSlices() {
+  var percentarray = createPercentageArray.call(this);
+  var sheet = function () {
+    var style = document.createElement('STYLE');
+    style.appendChild(document.createTextNode(""));
+    document.head.appendChild(style);
+    return style.sheet;
+  }();
+  for (var j = 0; j < percentarray.length; j++) {
+    var newDiv = document.createElement('DIV');
+    this._internalVars.breakdownNode.appendChild(newDiv);
+    if (percentarray[j] >= 180) {
+      newDiv.setAttribute('class', 'pie big');
+    } else {
+      newDiv.setAttribute('class', 'pie');
+    }
+    newDiv.setAttribute('data-start', this._internalVars.percentSum.toFixed(1));
+    if (j !== 0) {
+      setPrefixes(newDiv, "Transform", "rotate(" + this._internalVars.percentSum + "deg)");
+      sheet.insertRule(insertDataStartCSS(this._internalVars.percentSum), 0);
+    }
+    this._internalVars.percentSum += parseFloat(percentarray[j]);
+    newDiv.setAttribute('data-value', percentarray[j]);
+    sheet.insertRule(insertDataValueCSS(percentarray[j], percentarray.length, j), 0);
+  }
+}
+function insertDataValueCSS(degree, length, index) {
+  degree = parseFloat(degree);
+  var degree1 = degree;
+  if (index != length - 1) {
+    degree1 = parseFloat(degree + 1);
+  }
+  var cssString = ".pie[data-value='" + degree + "']:BEFORE { -moz-transform: rotate(" + degree1 + "deg); -ms-transform: rotate(" + degree1 + "deg); -webkit-transform: rotate(" + degree1 + "deg); -o-transform: rotate(" + degree1 + "deg); transform:rotate(" + degree1 + "deg);}";
+  return cssString;
+}
+function insertDataStartCSS(degree) {
+  degree = parseFloat(degree).toFixed(1);
+  var cssString = ".pie[data-start='" + degree + "'] { -moz-transform: rotate(" + degree + "deg); /* Firefox */ -ms-transform: rotate(" + degree + "deg); /* IE */ -webkit-transform: rotate(" + degree + "deg); /* Safari and Chrome */ -o-transform: rotate(" + degree + "deg); /* Opera */transform:rotate(" + degree + "deg);}";
+  return cssString;
+}
+function setPrefixes(element, property, value) {
+  element.style["webkit" + property] = value;
+  element.style["moz" + property] = value;
+  element.style["ms" + property] = value;
+  element.style["o" + property] = value;
+}
+function getCostSum() {
+  var costArray = this._internalVars.costArray;
+  var sum = this._internalVars.totalSum;
+  for (var i = 0; i < costArray.length; i++) {
+    sum += parseFloat(costArray[i]);
+  }
+  sum = sum.toFixed(2);
+  return sum;
+}
+function createLegend() {
+  var costArray = this._internalVars.costArray;
+  var labelArray = this._internalVars.labelArray;
+  for (var i = 0; i < costArray.length; i++) {
+    this._internalVars.legendNode.querySelector('ul').appendChild(createLi(labelArray[i], parseFloat(costArray[i])));
+  }
+}
+function createPercentageArray() {
+  var costArray = this._internalVars.costArray;
+  var costSum = getCostSum.call(this);
+  for (var j = 0; j < costArray.length; j++) {
+    this._internalVars.percentArray.push(costToPercentage(costArray[j], costSum));
+  }
+  return this._internalVars.percentArray;
+}
+function costToPercentage(cost, sum) {
+  var percent = cost / sum * 360;
+  return percent;
+}
+function createLi(item, cost) {
+  var liEl = document.createElement("LI");
+  var divEl = document.createElement("DIV");
+  divEl.setAttribute('class', 'legend-item');
+  liEl.appendChild(divEl);
+  var labelString = item + " ($" + cost.toFixed(2) + ")";
+  var hello = document.createTextNode(labelString);
+  liEl.appendChild(hello);
+  return liEl;
+}
+var _default = exports["default"] = CoverageGraph;