summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--debian/missing-sources/bootstrap-toggle.css83
-rw-r--r--debian/missing-sources/bootstrap-toggle.js180
-rw-r--r--debian/missing-sources/bootstrap.slate.css7271
-rw-r--r--debian/missing-sources/c3.css163
-rw-r--r--debian/missing-sources/c3.js7315
-rw-r--r--debian/missing-sources/dygraph-combined.js11219
-rw-r--r--debian/missing-sources/gauge.coffee542
-rw-r--r--debian/missing-sources/jquery.easypiechart.js364
-rw-r--r--debian/missing-sources/jquery.nanoscroller.js1000
-rw-r--r--debian/missing-sources/jquery.peity.js383
-rw-r--r--debian/missing-sources/jquery.sparkline.js3054
-rw-r--r--debian/missing-sources/morris.css2
-rw-r--r--debian/missing-sources/morris.js1895
-rw-r--r--debian/source/lintian-overrides3
14 files changed, 33474 insertions, 0 deletions
diff --git a/debian/missing-sources/bootstrap-toggle.css b/debian/missing-sources/bootstrap-toggle.css
new file mode 100644
index 00000000..057d08b3
--- /dev/null
+++ b/debian/missing-sources/bootstrap-toggle.css
@@ -0,0 +1,83 @@
+/*! ========================================================================
+ * Bootstrap Toggle: bootstrap-toggle.css v2.2.0
+ * http://www.bootstraptoggle.com
+ * ========================================================================
+ * Copyright 2014 Min Hur, The New York Times Company
+ * Licensed under MIT
+ * ======================================================================== */
+
+
+.checkbox label .toggle,
+.checkbox-inline .toggle {
+ margin-left: -20px;
+ margin-right: 5px;
+}
+
+.toggle {
+ position: relative;
+ overflow: hidden;
+}
+.toggle input[type="checkbox"] {
+ display: none;
+}
+.toggle-group {
+ position: absolute;
+ width: 200%;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ transition: left 0.35s;
+ -webkit-transition: left 0.35s;
+ -moz-user-select: none;
+ -webkit-user-select: none;
+}
+.toggle.off .toggle-group {
+ left: -100%;
+}
+.toggle-on {
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 50%;
+ margin: 0;
+ border: 0;
+ border-radius: 0;
+}
+.toggle-off {
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 50%;
+ right: 0;
+ margin: 0;
+ border: 0;
+ border-radius: 0;
+}
+.toggle-handle {
+ position: relative;
+ margin: 0 auto;
+ padding-top: 0px;
+ padding-bottom: 0px;
+ height: 100%;
+ width: 0px;
+ border-width: 0 1px;
+}
+
+.toggle.btn { min-width: 59px; min-height: 34px; }
+.toggle-on.btn { padding-right: 24px; }
+.toggle-off.btn { padding-left: 24px; }
+
+.toggle.btn-lg { min-width: 79px; min-height: 45px; }
+.toggle-on.btn-lg { padding-right: 31px; }
+.toggle-off.btn-lg { padding-left: 31px; }
+.toggle-handle.btn-lg { width: 40px; }
+
+.toggle.btn-sm { min-width: 50px; min-height: 30px;}
+.toggle-on.btn-sm { padding-right: 20px; }
+.toggle-off.btn-sm { padding-left: 20px; }
+
+.toggle.btn-xs { min-width: 35px; min-height: 22px;}
+.toggle-on.btn-xs { padding-right: 12px; }
+.toggle-off.btn-xs { padding-left: 12px; }
+
diff --git a/debian/missing-sources/bootstrap-toggle.js b/debian/missing-sources/bootstrap-toggle.js
new file mode 100644
index 00000000..533914ed
--- /dev/null
+++ b/debian/missing-sources/bootstrap-toggle.js
@@ -0,0 +1,180 @@
+/*! ========================================================================
+ * Bootstrap Toggle: bootstrap-toggle.js v2.2.0
+ * http://www.bootstraptoggle.com
+ * ========================================================================
+ * Copyright 2014 Min Hur, The New York Times Company
+ * Licensed under MIT
+ * ======================================================================== */
+
+
+ +function ($) {
+ 'use strict';
+
+ // TOGGLE PUBLIC CLASS DEFINITION
+ // ==============================
+
+ var Toggle = function (element, options) {
+ this.$element = $(element)
+ this.options = $.extend({}, this.defaults(), options)
+ this.render()
+ }
+
+ Toggle.VERSION = '2.2.0'
+
+ Toggle.DEFAULTS = {
+ on: 'On',
+ off: 'Off',
+ onstyle: 'primary',
+ offstyle: 'default',
+ size: 'normal',
+ style: '',
+ width: null,
+ height: null
+ }
+
+ Toggle.prototype.defaults = function() {
+ return {
+ on: this.$element.attr('data-on') || Toggle.DEFAULTS.on,
+ off: this.$element.attr('data-off') || Toggle.DEFAULTS.off,
+ onstyle: this.$element.attr('data-onstyle') || Toggle.DEFAULTS.onstyle,
+ offstyle: this.$element.attr('data-offstyle') || Toggle.DEFAULTS.offstyle,
+ size: this.$element.attr('data-size') || Toggle.DEFAULTS.size,
+ style: this.$element.attr('data-style') || Toggle.DEFAULTS.style,
+ width: this.$element.attr('data-width') || Toggle.DEFAULTS.width,
+ height: this.$element.attr('data-height') || Toggle.DEFAULTS.height
+ }
+ }
+
+ Toggle.prototype.render = function () {
+ this._onstyle = 'btn-' + this.options.onstyle
+ this._offstyle = 'btn-' + this.options.offstyle
+ var size = this.options.size === 'large' ? 'btn-lg'
+ : this.options.size === 'small' ? 'btn-sm'
+ : this.options.size === 'mini' ? 'btn-xs'
+ : ''
+ var $toggleOn = $('<label class="btn">').html(this.options.on)
+ .addClass(this._onstyle + ' ' + size)
+ var $toggleOff = $('<label class="btn">').html(this.options.off)
+ .addClass(this._offstyle + ' ' + size + ' active')
+ var $toggleHandle = $('<span class="toggle-handle btn btn-default">')
+ .addClass(size)
+ var $toggleGroup = $('<div class="toggle-group">')
+ .append($toggleOn, $toggleOff, $toggleHandle)
+ var $toggle = $('<div class="toggle btn" data-toggle="toggle">')
+ .addClass( this.$element.prop('checked') ? this._onstyle : this._offstyle+' off' )
+ .addClass(size).addClass(this.options.style)
+
+ this.$element.wrap($toggle)
+ $.extend(this, {
+ $toggle: this.$element.parent(),
+ $toggleOn: $toggleOn,
+ $toggleOff: $toggleOff,
+ $toggleGroup: $toggleGroup
+ })
+ this.$toggle.append($toggleGroup)
+
+ var width = this.options.width || Math.max($toggleOn.outerWidth(), $toggleOff.outerWidth())+($toggleHandle.outerWidth()/2)
+ var height = this.options.height || Math.max($toggleOn.outerHeight(), $toggleOff.outerHeight())
+ $toggleOn.addClass('toggle-on')
+ $toggleOff.addClass('toggle-off')
+ this.$toggle.css({ width: width, height: height })
+ if (this.options.height) {
+ $toggleOn.css('line-height', $toggleOn.height() + 'px')
+ $toggleOff.css('line-height', $toggleOff.height() + 'px')
+ }
+ this.update(true)
+ this.trigger(true)
+ }
+
+ Toggle.prototype.toggle = function () {
+ if (this.$element.prop('checked')) this.off()
+ else this.on()
+ }
+
+ Toggle.prototype.on = function (silent) {
+ if (this.$element.prop('disabled')) return false
+ this.$toggle.removeClass(this._offstyle + ' off').addClass(this._onstyle)
+ this.$element.prop('checked', true)
+ if (!silent) this.trigger()
+ }
+
+ Toggle.prototype.off = function (silent) {
+ if (this.$element.prop('disabled')) return false
+ this.$toggle.removeClass(this._onstyle).addClass(this._offstyle + ' off')
+ this.$element.prop('checked', false)
+ if (!silent) this.trigger()
+ }
+
+ Toggle.prototype.enable = function () {
+ this.$toggle.removeAttr('disabled')
+ this.$element.prop('disabled', false)
+ }
+
+ Toggle.prototype.disable = function () {
+ this.$toggle.attr('disabled', 'disabled')
+ this.$element.prop('disabled', true)
+ }
+
+ Toggle.prototype.update = function (silent) {
+ if (this.$element.prop('disabled')) this.disable()
+ else this.enable()
+ if (this.$element.prop('checked')) this.on(silent)
+ else this.off(silent)
+ }
+
+ Toggle.prototype.trigger = function (silent) {
+ this.$element.off('change.bs.toggle')
+ if (!silent) this.$element.change()
+ this.$element.on('change.bs.toggle', $.proxy(function() {
+ this.update()
+ }, this))
+ }
+
+ Toggle.prototype.destroy = function() {
+ this.$element.off('change.bs.toggle')
+ this.$toggleGroup.remove()
+ this.$element.removeData('bs.toggle')
+ this.$element.unwrap()
+ }
+
+ // TOGGLE PLUGIN DEFINITION
+ // ========================
+
+ function Plugin(option) {
+ return this.each(function () {
+ var $this = $(this)
+ var data = $this.data('bs.toggle')
+ var options = typeof option == 'object' && option
+
+ if (!data) $this.data('bs.toggle', (data = new Toggle(this, options)))
+ if (typeof option == 'string' && data[option]) data[option]()
+ })
+ }
+
+ var old = $.fn.bootstrapToggle
+
+ $.fn.bootstrapToggle = Plugin
+ $.fn.bootstrapToggle.Constructor = Toggle
+
+ // TOGGLE NO CONFLICT
+ // ==================
+
+ $.fn.toggle.noConflict = function () {
+ $.fn.bootstrapToggle = old
+ return this
+ }
+
+ // TOGGLE DATA-API
+ // ===============
+
+ $(function() {
+ $('input[type=checkbox][data-toggle^=toggle]').bootstrapToggle()
+ })
+
+ $(document).on('click.bs.toggle', 'div[data-toggle^=toggle]', function(e) {
+ var $checkbox = $(this).find('input[type=checkbox]')
+ $checkbox.bootstrapToggle('toggle')
+ e.preventDefault()
+ })
+
+}(jQuery);
diff --git a/debian/missing-sources/bootstrap.slate.css b/debian/missing-sources/bootstrap.slate.css
new file mode 100644
index 00000000..1e255597
--- /dev/null
+++ b/debian/missing-sources/bootstrap.slate.css
@@ -0,0 +1,7271 @@
+/*!
+ * bootswatch v3.3.6
+ * Homepage: http://bootswatch.com
+ * Copyright 2012-2016 Thomas Park
+ * Licensed under MIT
+ * Based on Bootstrap
+*/
+/*!
+ * Bootstrap v3.3.6 (http://getbootstrap.com)
+ * Copyright 2011-2015 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+ */
+/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
+html {
+ font-family: sans-serif;
+ -ms-text-size-adjust: 100%;
+ -webkit-text-size-adjust: 100%;
+}
+body {
+ margin: 0;
+}
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+main,
+menu,
+nav,
+section,
+summary {
+ display: block;
+}
+audio,
+canvas,
+progress,
+video {
+ display: inline-block;
+ vertical-align: baseline;
+}
+audio:not([controls]) {
+ display: none;
+ height: 0;
+}
+[hidden],
+template {
+ display: none;
+}
+a {
+ background-color: transparent;
+}
+a:active,
+a:hover {
+ outline: 0;
+}
+abbr[title] {
+ border-bottom: 1px dotted;
+}
+b,
+strong {
+ font-weight: bold;
+}
+dfn {
+ font-style: italic;
+}
+h1 {
+ font-size: 2em;
+ margin: 0.67em 0;
+}
+mark {
+ background: #ff0;
+ color: #000;
+}
+small {
+ font-size: 80%;
+}
+sub,
+sup {
+ font-size: 75%;
+ line-height: 0;
+ position: relative;
+ vertical-align: baseline;
+}
+sup {
+ top: -0.5em;
+}
+sub {
+ bottom: -0.25em;
+}
+img {
+ border: 0;
+}
+svg:not(:root) {
+ overflow: hidden;
+}
+figure {
+ margin: 1em 40px;
+}
+hr {
+ -webkit-box-sizing: content-box;
+ -moz-box-sizing: content-box;
+ box-sizing: content-box;
+ height: 0;
+}
+pre {
+ overflow: auto;
+}
+code,
+kbd,
+pre,
+samp {
+ font-family: monospace, monospace;
+ font-size: 1em;
+}
+button,
+input,
+optgroup,
+select,
+textarea {
+ color: inherit;
+ font: inherit;
+ margin: 0;
+}
+button {
+ overflow: visible;
+}
+button,
+select {
+ text-transform: none;
+}
+button,
+html input[type="button"],
+input[type="reset"],
+input[type="submit"] {
+ -webkit-appearance: button;
+ cursor: pointer;
+}
+button[disabled],
+html input[disabled] {
+ cursor: default;
+}
+button::-moz-focus-inner,
+input::-moz-focus-inner {
+ border: 0;
+ padding: 0;
+}
+input {
+ line-height: normal;
+}
+input[type="checkbox"],
+input[type="radio"] {
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+ padding: 0;
+}
+input[type="number"]::-webkit-inner-spin-button,
+input[type="number"]::-webkit-outer-spin-button {
+ height: auto;
+}
+input[type="search"] {
+ -webkit-appearance: textfield;
+ -webkit-box-sizing: content-box;
+ -moz-box-sizing: content-box;
+ box-sizing: content-box;
+}
+input[type="search"]::-webkit-search-cancel-button,
+input[type="search"]::-webkit-search-decoration {
+ -webkit-appearance: none;
+}
+fieldset {
+ border: 1px solid #c0c0c0;
+ margin: 0 2px;
+ padding: 0.35em 0.625em 0.75em;
+}
+legend {
+ border: 0;
+ padding: 0;
+}
+textarea {
+ overflow: auto;
+}
+optgroup {
+ font-weight: bold;
+}
+table {
+ border-collapse: collapse;
+ border-spacing: 0;
+}
+td,
+th {
+ padding: 0;
+}
+/*! Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css */
+@media print {
+ *,
+ *:before,
+ *:after {
+ background: transparent !important;
+ color: #000 !important;
+ -webkit-box-shadow: none !important;
+ box-shadow: none !important;
+ text-shadow: none !important;
+ }
+ a,
+ a:visited {
+ text-decoration: underline;
+ }
+ a[href]:after {
+ content: " (" attr(href) ")";
+ }
+ abbr[title]:after {
+ content: " (" attr(title) ")";
+ }
+ a[href^="#"]:after,
+ a[href^="javascript:"]:after {
+ content: "";
+ }
+ pre,
+ blockquote {
+ border: 1px solid #999;
+ page-break-inside: avoid;
+ }
+ thead {
+ display: table-header-group;
+ }
+ tr,
+ img {
+ page-break-inside: avoid;
+ }
+ img {
+ max-width: 100% !important;
+ }
+ p,
+ h2,
+ h3 {
+ orphans: 3;
+ widows: 3;
+ }
+ h2,
+ h3 {
+ page-break-after: avoid;
+ }
+ .navbar {
+ display: none;
+ }
+ .btn > .caret,
+ .dropup > .btn > .caret {
+ border-top-color: #000 !important;
+ }
+ .label {
+ border: 1px solid #000;
+ }
+ .table {
+ border-collapse: collapse !important;
+ }
+ .table td,
+ .table th {
+ background-color: #fff !important;
+ }
+ .table-bordered th,
+ .table-bordered td {
+ border: 1px solid #ddd !important;
+ }
+}
+@font-face {
+ font-family: 'Glyphicons Halflings';
+ src: url('../fonts/glyphicons-halflings-regular.eot');
+ src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
+}
+.glyphicon {
+ position: relative;
+ top: 1px;
+ display: inline-block;
+ font-family: 'Glyphicons Halflings';
+ font-style: normal;
+ font-weight: normal;
+ line-height: 1;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+}
+.glyphicon-asterisk:before {
+ content: "\002a";
+}
+.glyphicon-plus:before {
+ content: "\002b";
+}
+.glyphicon-euro:before,
+.glyphicon-eur:before {
+ content: "\20ac";
+}
+.glyphicon-minus:before {
+ content: "\2212";
+}
+.glyphicon-cloud:before {
+ content: "\2601";
+}
+.glyphicon-envelope:before {
+ content: "\2709";
+}
+.glyphicon-pencil:before {
+ content: "\270f";
+}
+.glyphicon-glass:before {
+ content: "\e001";
+}
+.glyphicon-music:before {
+ content: "\e002";
+}
+.glyphicon-search:before {
+ content: "\e003";
+}
+.glyphicon-heart:before {
+ content: "\e005";
+}
+.glyphicon-star:before {
+ content: "\e006";
+}
+.glyphicon-star-empty:before {
+ content: "\e007";
+}
+.glyphicon-user:before {
+ content: "\e008";
+}
+.glyphicon-film:before {
+ content: "\e009";
+}
+.glyphicon-th-large:before {
+ content: "\e010";
+}
+.glyphicon-th:before {
+ content: "\e011";
+}
+.glyphicon-th-list:before {
+ content: "\e012";
+}
+.glyphicon-ok:before {
+ content: "\e013";
+}
+.glyphicon-remove:before {
+ content: "\e014";
+}
+.glyphicon-zoom-in:before {
+ content: "\e015";
+}
+.glyphicon-zoom-out:before {
+ content: "\e016";
+}
+.glyphicon-off:before {
+ content: "\e017";
+}
+.glyphicon-signal:before {
+ content: "\e018";
+}
+.glyphicon-cog:before {
+ content: "\e019";
+}
+.glyphicon-trash:before {
+ content: "\e020";
+}
+.glyphicon-home:before {
+ content: "\e021";
+}
+.glyphicon-file:before {
+ content: "\e022";
+}
+.glyphicon-time:before {
+ content: "\e023";
+}
+.glyphicon-road:before {
+ content: "\e024";
+}
+.glyphicon-download-alt:before {
+ content: "\e025";
+}
+.glyphicon-download:before {
+ content: "\e026";
+}
+.glyphicon-upload:before {
+ content: "\e027";
+}
+.glyphicon-inbox:before {
+ content: "\e028";
+}
+.glyphicon-play-circle:before {
+ content: "\e029";
+}
+.glyphicon-repeat:before {
+ content: "\e030";
+}
+.glyphicon-refresh:before {
+ content: "\e031";
+}
+.glyphicon-list-alt:before {
+ content: "\e032";
+}
+.glyphicon-lock:before {
+ content: "\e033";
+}
+.glyphicon-flag:before {
+ content: "\e034";
+}
+.glyphicon-headphones:before {
+ content: "\e035";
+}
+.glyphicon-volume-off:before {
+ content: "\e036";
+}
+.glyphicon-volume-down:before {
+ content: "\e037";
+}
+.glyphicon-volume-up:before {
+ content: "\e038";
+}
+.glyphicon-qrcode:before {
+ content: "\e039";
+}
+.glyphicon-barcode:before {
+ content: "\e040";
+}
+.glyphicon-tag:before {
+ content: "\e041";
+}
+.glyphicon-tags:before {
+ content: "\e042";
+}
+.glyphicon-book:before {
+ content: "\e043";
+}
+.glyphicon-bookmark:before {
+ content: "\e044";
+}
+.glyphicon-print:before {
+ content: "\e045";
+}
+.glyphicon-camera:before {
+ content: "\e046";
+}
+.glyphicon-font:before {
+ content: "\e047";
+}
+.glyphicon-bold:before {
+ content: "\e048";
+}
+.glyphicon-italic:before {
+ content: "\e049";
+}
+.glyphicon-text-height:before {
+ content: "\e050";
+}
+.glyphicon-text-width:before {
+ content: "\e051";
+}
+.glyphicon-align-left:before {
+ content: "\e052";
+}
+.glyphicon-align-center:before {
+ content: "\e053";
+}
+.glyphicon-align-right:before {
+ content: "\e054";
+}
+.glyphicon-align-justify:before {
+ content: "\e055";
+}
+.glyphicon-list:before {
+ content: "\e056";
+}
+.glyphicon-indent-left:before {
+ content: "\e057";
+}
+.glyphicon-indent-right:before {
+ content: "\e058";
+}
+.glyphicon-facetime-video:before {
+ content: "\e059";
+}
+.glyphicon-picture:before {
+ content: "\e060";
+}
+.glyphicon-map-marker:before {
+ content: "\e062";
+}
+.glyphicon-adjust:before {
+ content: "\e063";
+}
+.glyphicon-tint:before {
+ content: "\e064";
+}
+.glyphicon-edit:before {
+ content: "\e065";
+}
+.glyphicon-share:before {
+ content: "\e066";
+}
+.glyphicon-check:before {
+ content: "\e067";
+}
+.glyphicon-move:before {
+ content: "\e068";
+}
+.glyphicon-step-backward:before {
+ content: "\e069";
+}
+.glyphicon-fast-backward:before {
+ content: "\e070";
+}
+.glyphicon-backward:before {
+ content: "\e071";
+}
+.glyphicon-play:before {
+ content: "\e072";
+}
+.glyphicon-pause:before {
+ content: "\e073";
+}
+.glyphicon-stop:before {
+ content: "\e074";
+}
+.glyphicon-forward:before {
+ content: "\e075";
+}
+.glyphicon-fast-forward:before {
+ content: "\e076";
+}
+.glyphicon-step-forward:before {
+ content: "\e077";
+}
+.glyphicon-eject:before {
+ content: "\e078";
+}
+.glyphicon-chevron-left:before {
+ content: "\e079";
+}
+.glyphicon-chevron-right:before {
+ content: "\e080";
+}
+.glyphicon-plus-sign:before {
+ content: "\e081";
+}
+.glyphicon-minus-sign:before {
+ content: "\e082";
+}
+.glyphicon-remove-sign:before {
+ content: "\e083";
+}
+.glyphicon-ok-sign:before {
+ content: "\e084";
+}
+.glyphicon-question-sign:before {
+ content: "\e085";
+}
+.glyphicon-info-sign:before {
+ content: "\e086";
+}
+.glyphicon-screenshot:before {
+ content: "\e087";
+}
+.glyphicon-remove-circle:before {
+ content: "\e088";
+}
+.glyphicon-ok-circle:before {
+ content: "\e089";
+}
+.glyphicon-ban-circle:before {
+ content: "\e090";
+}
+.glyphicon-arrow-left:before {
+ content: "\e091";
+}
+.glyphicon-arrow-right:before {
+ content: "\e092";
+}
+.glyphicon-arrow-up:before {
+ content: "\e093";
+}
+.glyphicon-arrow-down:before {
+ content: "\e094";
+}
+.glyphicon-share-alt:before {
+ content: "\e095";
+}
+.glyphicon-resize-full:before {
+ content: "\e096";
+}
+.glyphicon-resize-small:before {
+ content: "\e097";
+}
+.glyphicon-exclamation-sign:before {
+ content: "\e101";
+}
+.glyphicon-gift:before {
+ content: "\e102";
+}
+.glyphicon-leaf:before {
+ content: "\e103";
+}
+.glyphicon-fire:before {
+ content: "\e104";
+}
+.glyphicon-eye-open:before {
+ content: "\e105";
+}
+.glyphicon-eye-close:before {
+ content: "\e106";
+}
+.glyphicon-warning-sign:before {
+ content: "\e107";
+}
+.glyphicon-plane:before {
+ content: "\e108";
+}
+.glyphicon-calendar:before {
+ content: "\e109";
+}
+.glyphicon-random:before {
+ content: "\e110";
+}
+.glyphicon-comment:before {
+ content: "\e111";
+}
+.glyphicon-magnet:before {
+ content: "\e112";
+}
+.glyphicon-chevron-up:before {
+ content: "\e113";
+}
+.glyphicon-chevron-down:before {
+ content: "\e114";
+}
+.glyphicon-retweet:before {
+ content: "\e115";
+}
+.glyphicon-shopping-cart:before {
+ content: "\e116";
+}
+.glyphicon-folder-close:before {
+ content: "\e117";
+}
+.glyphicon-folder-open:before {
+ content: "\e118";
+}
+.glyphicon-resize-vertical:before {
+ content: "\e119";
+}
+.glyphicon-resize-horizontal:before {
+ content: "\e120";
+}
+.glyphicon-hdd:before {
+ content: "\e121";
+}
+.glyphicon-bullhorn:before {
+ content: "\e122";
+}
+.glyphicon-bell:before {
+ content: "\e123";
+}
+.glyphicon-certificate:before {
+ content: "\e124";
+}
+.glyphicon-thumbs-up:before {
+ content: "\e125";
+}
+.glyphicon-thumbs-down:before {
+ content: "\e126";
+}
+.glyphicon-hand-right:before {
+ content: "\e127";
+}
+.glyphicon-hand-left:before {
+ content: "\e128";
+}
+.glyphicon-hand-up:before {
+ content: "\e129";
+}
+.glyphicon-hand-down:before {
+ content: "\e130";
+}
+.glyphicon-circle-arrow-right:before {
+ content: "\e131";
+}
+.glyphicon-circle-arrow-left:before {
+ content: "\e132";
+}
+.glyphicon-circle-arrow-up:before {
+ content: "\e133";
+}
+.glyphicon-circle-arrow-down:before {
+ content: "\e134";
+}
+.glyphicon-globe:before {
+ content: "\e135";
+}
+.glyphicon-wrench:before {
+ content: "\e136";
+}
+.glyphicon-tasks:before {
+ content: "\e137";
+}
+.glyphicon-filter:before {
+ content: "\e138";
+}
+.glyphicon-briefcase:before {
+ content: "\e139";
+}
+.glyphicon-fullscreen:before {
+ content: "\e140";
+}
+.glyphicon-dashboard:before {
+ content: "\e141";
+}
+.glyphicon-paperclip:before {
+ content: "\e142";
+}
+.glyphicon-heart-empty:before {
+ content: "\e143";
+}
+.glyphicon-link:before {
+ content: "\e144";
+}
+.glyphicon-phone:before {
+ content: "\e145";
+}
+.glyphicon-pushpin:before {
+ content: "\e146";
+}
+.glyphicon-usd:before {
+ content: "\e148";
+}
+.glyphicon-gbp:before {
+ content: "\e149";
+}
+.glyphicon-sort:before {
+ content: "\e150";
+}
+.glyphicon-sort-by-alphabet:before {
+ content: "\e151";
+}
+.glyphicon-sort-by-alphabet-alt:before {
+ content: "\e152";
+}
+.glyphicon-sort-by-order:before {
+ content: "\e153";
+}
+.glyphicon-sort-by-order-alt:before {
+ content: "\e154";
+}
+.glyphicon-sort-by-attributes:before {
+ content: "\e155";
+}
+.glyphicon-sort-by-attributes-alt:before {
+ content: "\e156";
+}
+.glyphicon-unchecked:before {
+ content: "\e157";
+}
+.glyphicon-expand:before {
+ content: "\e158";
+}
+.glyphicon-collapse-down:before {
+ content: "\e159";
+}
+.glyphicon-collapse-up:before {
+ content: "\e160";
+}
+.glyphicon-log-in:before {
+ content: "\e161";
+}
+.glyphicon-flash:before {
+ content: "\e162";
+}
+.glyphicon-log-out:before {
+ content: "\e163";
+}
+.glyphicon-new-window:before {
+ content: "\e164";
+}
+.glyphicon-record:before {
+ content: "\e165";
+}
+.glyphicon-save:before {
+ content: "\e166";
+}
+.glyphicon-open:before {
+ content: "\e167";
+}
+.glyphicon-saved:before {
+ content: "\e168";
+}
+.glyphicon-import:before {
+ content: "\e169";
+}
+.glyphicon-export:before {
+ content: "\e170";
+}
+.glyphicon-send:before {
+ content: "\e171";
+}
+.glyphicon-floppy-disk:before {
+ content: "\e172";
+}
+.glyphicon-floppy-saved:before {
+ content: "\e173";
+}
+.glyphicon-floppy-remove:before {
+ content: "\e174";
+}
+.glyphicon-floppy-save:before {
+ content: "\e175";
+}
+.glyphicon-floppy-open:before {
+ content: "\e176";
+}
+.glyphicon-credit-card:before {
+ content: "\e177";
+}
+.glyphicon-transfer:before {
+ content: "\e178";
+}
+.glyphicon-cutlery:before {
+ content: "\e179";
+}
+.glyphicon-header:before {
+ content: "\e180";
+}
+.glyphicon-compressed:before {
+ content: "\e181";
+}
+.glyphicon-earphone:before {
+ content: "\e182";
+}
+.glyphicon-phone-alt:before {
+ content: "\e183";
+}
+.glyphicon-tower:before {
+ content: "\e184";
+}
+.glyphicon-stats:before {
+ content: "\e185";
+}
+.glyphicon-sd-video:before {
+ content: "\e186";
+}
+.glyphicon-hd-video:before {
+ content: "\e187";
+}
+.glyphicon-subtitles:before {
+ content: "\e188";
+}
+.glyphicon-sound-stereo:before {
+ content: "\e189";
+}
+.glyphicon-sound-dolby:before {
+ content: "\e190";
+}
+.glyphicon-sound-5-1:before {
+ content: "\e191";
+}
+.glyphicon-sound-6-1:before {
+ content: "\e192";
+}
+.glyphicon-sound-7-1:before {
+ content: "\e193";
+}
+.glyphicon-copyright-mark:before {
+ content: "\e194";
+}
+.glyphicon-registration-mark:before {
+ content: "\e195";
+}
+.glyphicon-cloud-download:before {
+ content: "\e197";
+}
+.glyphicon-cloud-upload:before {
+ content: "\e198";
+}
+.glyphicon-tree-conifer:before {
+ content: "\e199";
+}
+.glyphicon-tree-deciduous:before {
+ content: "\e200";
+}
+.glyphicon-cd:before {
+ content: "\e201";
+}
+.glyphicon-save-file:before {
+ content: "\e202";
+}
+.glyphicon-open-file:before {
+ content: "\e203";
+}
+.glyphicon-level-up:before {
+ content: "\e204";
+}
+.glyphicon-copy:before {
+ content: "\e205";
+}
+.glyphicon-paste:before {
+ content: "\e206";
+}
+.glyphicon-alert:before {
+ content: "\e209";
+}
+.glyphicon-equalizer:before {
+ content: "\e210";
+}
+.glyphicon-king:before {
+ content: "\e211";
+}
+.glyphicon-queen:before {
+ content: "\e212";
+}
+.glyphicon-pawn:before {
+ content: "\e213";
+}
+.glyphicon-bishop:before {
+ content: "\e214";
+}
+.glyphicon-knight:before {
+ content: "\e215";
+}
+.glyphicon-baby-formula:before {
+ content: "\e216";
+}
+.glyphicon-tent:before {
+ content: "\26fa";
+}
+.glyphicon-blackboard:before {
+ content: "\e218";
+}
+.glyphicon-bed:before {
+ content: "\e219";
+}
+.glyphicon-apple:before {
+ content: "\f8ff";
+}
+.glyphicon-erase:before {
+ content: "\e221";
+}
+.glyphicon-hourglass:before {
+ content: "\231b";
+}
+.glyphicon-lamp:before {
+ content: "\e223";
+}
+.glyphicon-duplicate:before {
+ content: "\e224";
+}
+.glyphicon-piggy-bank:before {
+ content: "\e225";
+}
+.glyphicon-scissors:before {
+ content: "\e226";
+}
+.glyphicon-bitcoin:before {
+ content: "\e227";
+}
+.glyphicon-btc:before {
+ content: "\e227";
+}
+.glyphicon-xbt:before {
+ content: "\e227";
+}
+.glyphicon-yen:before {
+ content: "\00a5";
+}
+.glyphicon-jpy:before {
+ content: "\00a5";
+}
+.glyphicon-ruble:before {
+ content: "\20bd";
+}
+.glyphicon-rub:before {
+ content: "\20bd";
+}
+.glyphicon-scale:before {
+ content: "\e230";
+}
+.glyphicon-ice-lolly:before {
+ content: "\e231";
+}
+.glyphicon-ice-lolly-tasted:before {
+ content: "\e232";
+}
+.glyphicon-education:before {
+ content: "\e233";
+}
+.glyphicon-option-horizontal:before {
+ content: "\e234";
+}
+.glyphicon-option-vertical:before {
+ content: "\e235";
+}
+.glyphicon-menu-hamburger:before {
+ content: "\e236";
+}
+.glyphicon-modal-window:before {
+ content: "\e237";
+}
+.glyphicon-oil:before {
+ content: "\e238";
+}
+.glyphicon-grain:before {
+ content: "\e239";
+}
+.glyphicon-sunglasses:before {
+ content: "\e240";
+}
+.glyphicon-text-size:before {
+ content: "\e241";
+}
+.glyphicon-text-color:before {
+ content: "\e242";
+}
+.glyphicon-text-background:before {
+ content: "\e243";
+}
+.glyphicon-object-align-top:before {
+ content: "\e244";
+}
+.glyphicon-object-align-bottom:before {
+ content: "\e245";
+}
+.glyphicon-object-align-horizontal:before {
+ content: "\e246";
+}
+.glyphicon-object-align-left:before {
+ content: "\e247";
+}
+.glyphicon-object-align-vertical:before {
+ content: "\e248";
+}
+.glyphicon-object-align-right:before {
+ content: "\e249";
+}
+.glyphicon-triangle-right:before {
+ content: "\e250";
+}
+.glyphicon-triangle-left:before {
+ content: "\e251";
+}
+.glyphicon-triangle-bottom:before {
+ content: "\e252";
+}
+.glyphicon-triangle-top:before {
+ content: "\e253";
+}
+.glyphicon-console:before {
+ content: "\e254";
+}
+.glyphicon-superscript:before {
+ content: "\e255";
+}
+.glyphicon-subscript:before {
+ content: "\e256";
+}
+.glyphicon-menu-left:before {
+ content: "\e257";
+}
+.glyphicon-menu-right:before {
+ content: "\e258";
+}
+.glyphicon-menu-down:before {
+ content: "\e259";
+}
+.glyphicon-menu-up:before {
+ content: "\e260";
+}
+* {
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+}
+*:before,
+*:after {
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+}
+html {
+ font-size: 10px;
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+}
+body {
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+ font-size: 14px;
+ line-height: 1.42857143;
+ color: #c8c8c8;
+ background-color: #272b30;
+}
+input,
+button,
+select,
+textarea {
+ font-family: inherit;
+ font-size: inherit;
+ line-height: inherit;
+}
+a {
+ color: #ffffff;
+ text-decoration: none;
+}
+a:hover,
+a:focus {
+ color: #ffffff;
+ text-decoration: underline;
+}
+a:focus {
+ outline: thin dotted;
+ outline: 5px auto -webkit-focus-ring-color;
+ outline-offset: -2px;
+}
+figure {
+ margin: 0;
+}
+img {
+ vertical-align: middle;
+}
+.img-responsive,
+.thumbnail > img,
+.thumbnail a > img,
+.carousel-inner > .item > img,
+.carousel-inner > .item > a > img {
+ display: block;
+ max-width: 100%;
+ height: auto;
+}
+.img-rounded {
+ border-radius: 6px;
+}
+.img-thumbnail {
+ padding: 4px;
+ line-height: 1.42857143;
+ background-color: #1c1e22;
+ border: 1px solid #0c0d0e;
+ border-radius: 4px;
+ -webkit-transition: all 0.2s ease-in-out;
+ -o-transition: all 0.2s ease-in-out;
+ transition: all 0.2s ease-in-out;
+ display: inline-block;
+ max-width: 100%;
+ height: auto;
+}
+.img-circle {
+ border-radius: 50%;
+}
+hr {
+ margin-top: 20px;
+ margin-bottom: 20px;
+ border: 0;
+ border-top: 1px solid #1c1e22;
+}
+.sr-only {
+ position: absolute;
+ width: 1px;
+ height: 1px;
+ margin: -1px;
+ padding: 0;
+ overflow: hidden;
+ clip: rect(0, 0, 0, 0);
+ border: 0;
+}
+.sr-only-focusable:active,
+.sr-only-focusable:focus {
+ position: static;
+ width: auto;
+ height: auto;
+ margin: 0;
+ overflow: visible;
+ clip: auto;
+}
+[role="button"] {
+ cursor: pointer;
+}
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+.h1,
+.h2,
+.h3,
+.h4,
+.h5,
+.h6 {
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+ font-weight: 500;
+ line-height: 1.1;
+ color: inherit;
+}
+h1 small,
+h2 small,
+h3 small,
+h4 small,
+h5 small,
+h6 small,
+.h1 small,
+.h2 small,
+.h3 small,
+.h4 small,
+.h5 small,
+.h6 small,
+h1 .small,
+h2 .small,
+h3 .small,
+h4 .small,
+h5 .small,
+h6 .small,
+.h1 .small,
+.h2 .small,
+.h3 .small,
+.h4 .small,
+.h5 .small,
+.h6 .small {
+ font-weight: normal;
+ line-height: 1;
+ color: #7a8288;
+}
+h1,
+.h1,
+h2,
+.h2,
+h3,
+.h3 {
+ margin-top: 20px;
+ margin-bottom: 10px;
+}
+h1 small,
+.h1 small,
+h2 small,
+.h2 small,
+h3 small,
+.h3 small,
+h1 .small,
+.h1 .small,
+h2 .small,
+.h2 .small,
+h3 .small,
+.h3 .small {
+ font-size: 65%;
+}
+h4,
+.h4,
+h5,
+.h5,
+h6,
+.h6 {
+ margin-top: 10px;
+ margin-bottom: 10px;
+}
+h4 small,
+.h4 small,
+h5 small,
+.h5 small,
+h6 small,
+.h6 small,
+h4 .small,
+.h4 .small,
+h5 .small,
+.h5 .small,
+h6 .small,
+.h6 .small {
+ font-size: 75%;
+}
+h1,
+.h1 {
+ font-size: 36px;
+}
+h2,
+.h2 {
+ font-size: 30px;
+}
+h3,
+.h3 {
+ font-size: 24px;
+}
+h4,
+.h4 {
+ font-size: 18px;
+}
+h5,
+.h5 {
+ font-size: 14px;
+}
+h6,
+.h6 {
+ font-size: 12px;
+}
+p {
+ margin: 0 0 10px;
+}
+.lead {
+ margin-bottom: 20px;
+ font-size: 16px;
+ font-weight: 300;
+ line-height: 1.4;
+}
+@media (min-width: 768px) {
+ .lead {
+ font-size: 21px;
+ }
+}
+small,
+.small {
+ font-size: 85%;
+}
+mark,
+.mark {
+ background-color: #f89406;
+ padding: .2em;
+}
+.text-left {
+ text-align: left;
+}
+.text-right {
+ text-align: right;
+}
+.text-center {
+ text-align: center;
+}
+.text-justify {
+ text-align: justify;
+}
+.text-nowrap {
+ white-space: nowrap;
+}
+.text-lowercase {
+ text-transform: lowercase;
+}
+.text-uppercase {
+ text-transform: uppercase;
+}
+.text-capitalize {
+ text-transform: capitalize;
+}
+.text-muted {
+ color: #7a8288;
+}
+.text-primary {
+ color: #7a8288;
+}
+a.text-primary:hover,
+a.text-primary:focus {
+ color: #62686d;
+}
+.text-success {
+ color: #ffffff;
+}
+a.text-success:hover,
+a.text-success:focus {
+ color: #e6e6e6;
+}
+.text-info {
+ color: #ffffff;
+}
+a.text-info:hover,
+a.text-info:focus {
+ color: #e6e6e6;
+}
+.text-warning {
+ color: #ffffff;
+}
+a.text-warning:hover,
+a.text-warning:focus {
+ color: #e6e6e6;
+}
+.text-danger {
+ color: #ffffff;
+}
+a.text-danger:hover,
+a.text-danger:focus {
+ color: #e6e6e6;
+}
+.bg-primary {
+ color: #fff;
+ background-color: #7a8288;
+}
+a.bg-primary:hover,
+a.bg-primary:focus {
+ background-color: #62686d;
+}
+.bg-success {
+ background-color: #62c462;
+}
+a.bg-success:hover,
+a.bg-success:focus {
+ background-color: #42b142;
+}
+.bg-info {
+ background-color: #5bc0de;
+}
+a.bg-info:hover,
+a.bg-info:focus {
+ background-color: #31b0d5;
+}
+.bg-warning {
+ background-color: #f89406;
+}
+a.bg-warning:hover,
+a.bg-warning:focus {
+ background-color: #c67605;
+}
+.bg-danger {
+ background-color: #ee5f5b;
+}
+a.bg-danger:hover,
+a.bg-danger:focus {
+ background-color: #e9322d;
+}
+.page-header {
+ padding-bottom: 9px;
+ margin: 40px 0 20px;
+ border-bottom: 1px solid #1c1e22;
+}
+ul,
+ol {
+ margin-top: 0;
+ margin-bottom: 10px;
+}
+ul ul,
+ol ul,
+ul ol,
+ol ol {
+ margin-bottom: 0;
+}
+.list-unstyled {
+ padding-left: 0;
+ list-style: none;
+}
+.list-inline {
+ padding-left: 0;
+ list-style: none;
+ margin-left: -5px;
+}
+.list-inline > li {
+ display: inline-block;
+ padding-left: 5px;
+ padding-right: 5px;
+}
+dl {
+ margin-top: 0;
+ margin-bottom: 20px;
+}
+dt,
+dd {
+ line-height: 1.42857143;
+}
+dt {
+ font-weight: bold;
+}
+dd {
+ margin-left: 0;
+}
+@media (min-width: 768px) {
+ .dl-horizontal dt {
+ float: left;
+ width: 160px;
+ clear: left;
+ text-align: right;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+ .dl-horizontal dd {
+ margin-left: 180px;
+ }
+}
+abbr[title],
+abbr[data-original-title] {
+ cursor: help;
+ border-bottom: 1px dotted #7a8288;
+}
+.initialism {
+ font-size: 90%;
+ text-transform: uppercase;
+}
+blockquote {
+ padding: 10px 20px;
+ margin: 0 0 20px;
+ font-size: 17.5px;
+ border-left: 5px solid #7a8288;
+}
+blockquote p:last-child,
+blockquote ul:last-child,
+blockquote ol:last-child {
+ margin-bottom: 0;
+}
+blockquote footer,
+blockquote small,
+blockquote .small {
+ display: block;
+ font-size: 80%;
+ line-height: 1.42857143;
+ color: #7a8288;
+}
+blockquote footer:before,
+blockquote small:before,
+blockquote .small:before {
+ content: '\2014 \00A0';
+}
+.blockquote-reverse,
+blockquote.pull-right {
+ padding-right: 15px;
+ padding-left: 0;
+ border-right: 5px solid #7a8288;
+ border-left: 0;
+ text-align: right;
+}
+.blockquote-reverse footer:before,
+blockquote.pull-right footer:before,
+.blockquote-reverse small:before,
+blockquote.pull-right small:before,
+.blockquote-reverse .small:before,
+blockquote.pull-right .small:before {
+ content: '';
+}
+.blockquote-reverse footer:after,
+blockquote.pull-right footer:after,
+.blockquote-reverse small:after,
+blockquote.pull-right small:after,
+.blockquote-reverse .small:after,
+blockquote.pull-right .small:after {
+ content: '\00A0 \2014';
+}
+address {
+ margin-bottom: 20px;
+ font-style: normal;
+ line-height: 1.42857143;
+}
+code,
+kbd,
+pre,
+samp {
+ font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
+}
+code {
+ padding: 2px 4px;
+ font-size: 90%;
+ color: #c7254e;
+ background-color: #f9f2f4;
+ border-radius: 4px;
+}
+kbd {
+ padding: 2px 4px;
+ font-size: 90%;
+ color: #ffffff;
+ background-color: #333333;
+ border-radius: 3px;
+ -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25);
+ box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25);
+}
+kbd kbd {
+ padding: 0;
+ font-size: 100%;
+ font-weight: bold;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+pre {
+ display: block;
+ padding: 9.5px;
+ margin: 0 0 10px;
+ font-size: 13px;
+ line-height: 1.42857143;
+ word-break: break-all;
+ word-wrap: break-word;
+ color: #3a3f44;
+ background-color: #f5f5f5;
+ border: 1px solid #cccccc;
+ border-radius: 4px;
+}
+pre code {
+ padding: 0;
+ font-size: inherit;
+ color: inherit;
+ white-space: pre-wrap;
+ background-color: transparent;
+ border-radius: 0;
+}
+.pre-scrollable {
+ max-height: 340px;
+ overflow-y: scroll;
+}
+.container {
+ margin-right: auto;
+ margin-left: auto;
+ padding-left: 15px;
+ padding-right: 15px;
+}
+@media (min-width: 768px) {
+ .container {
+ width: 750px;
+ }
+}
+@media (min-width: 992px) {
+ .container {
+ width: 970px;
+ }
+}
+@media (min-width: 1200px) {
+ .container {
+ width: 1170px;
+ }
+}
+.container-fluid {
+ margin-right: auto;
+ margin-left: auto;
+ padding-left: 15px;
+ padding-right: 15px;
+}
+.row {
+ margin-left: -15px;
+ margin-right: -15px;
+}
+.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
+ position: relative;
+ min-height: 1px;
+ padding-left: 15px;
+ padding-right: 15px;
+}
+.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
+ float: left;
+}
+.col-xs-12 {
+ width: 100%;
+}
+.col-xs-11 {
+ width: 91.66666667%;
+}
+.col-xs-10 {
+ width: 83.33333333%;
+}
+.col-xs-9 {
+ width: 75%;
+}
+.col-xs-8 {
+ width: 66.66666667%;
+}
+.col-xs-7 {
+ width: 58.33333333%;
+}
+.col-xs-6 {
+ width: 50%;
+}
+.col-xs-5 {
+ width: 41.66666667%;
+}
+.col-xs-4 {
+ width: 33.33333333%;
+}
+.col-xs-3 {
+ width: 25%;
+}
+.col-xs-2 {
+ width: 16.66666667%;
+}
+.col-xs-1 {
+ width: 8.33333333%;
+}
+.col-xs-pull-12 {
+ right: 100%;
+}
+.col-xs-pull-11 {
+ right: 91.66666667%;
+}
+.col-xs-pull-10 {
+ right: 83.33333333%;
+}
+.col-xs-pull-9 {
+ right: 75%;
+}
+.col-xs-pull-8 {
+ right: 66.66666667%;
+}
+.col-xs-pull-7 {
+ right: 58.33333333%;
+}
+.col-xs-pull-6 {
+ right: 50%;
+}
+.col-xs-pull-5 {
+ right: 41.66666667%;
+}
+.col-xs-pull-4 {
+ right: 33.33333333%;
+}
+.col-xs-pull-3 {
+ right: 25%;
+}
+.col-xs-pull-2 {
+ right: 16.66666667%;
+}
+.col-xs-pull-1 {
+ right: 8.33333333%;
+}
+.col-xs-pull-0 {
+ right: auto;
+}
+.col-xs-push-12 {
+ left: 100%;
+}
+.col-xs-push-11 {
+ left: 91.66666667%;
+}
+.col-xs-push-10 {
+ left: 83.33333333%;
+}
+.col-xs-push-9 {
+ left: 75%;
+}
+.col-xs-push-8 {
+ left: 66.66666667%;
+}
+.col-xs-push-7 {
+ left: 58.33333333%;
+}
+.col-xs-push-6 {
+ left: 50%;
+}
+.col-xs-push-5 {
+ left: 41.66666667%;
+}
+.col-xs-push-4 {
+ left: 33.33333333%;
+}
+.col-xs-push-3 {
+ left: 25%;
+}
+.col-xs-push-2 {
+ left: 16.66666667%;
+}
+.col-xs-push-1 {
+ left: 8.33333333%;
+}
+.col-xs-push-0 {
+ left: auto;
+}
+.col-xs-offset-12 {
+ margin-left: 100%;
+}
+.col-xs-offset-11 {
+ margin-left: 91.66666667%;
+}
+.col-xs-offset-10 {
+ margin-left: 83.33333333%;
+}
+.col-xs-offset-9 {
+ margin-left: 75%;
+}
+.col-xs-offset-8 {
+ margin-left: 66.66666667%;
+}
+.col-xs-offset-7 {
+ margin-left: 58.33333333%;
+}
+.col-xs-offset-6 {
+ margin-left: 50%;
+}
+.col-xs-offset-5 {
+ margin-left: 41.66666667%;
+}
+.col-xs-offset-4 {
+ margin-left: 33.33333333%;
+}
+.col-xs-offset-3 {
+ margin-left: 25%;
+}
+.col-xs-offset-2 {
+ margin-left: 16.66666667%;
+}
+.col-xs-offset-1 {
+ margin-left: 8.33333333%;
+}
+.col-xs-offset-0 {
+ margin-left: 0%;
+}
+@media (min-width: 768px) {
+ .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
+ float: left;
+ }
+ .col-sm-12 {
+ width: 100%;
+ }
+ .col-sm-11 {
+ width: 91.66666667%;
+ }
+ .col-sm-10 {
+ width: 83.33333333%;
+ }
+ .col-sm-9 {
+ width: 75%;
+ }
+ .col-sm-8 {
+ width: 66.66666667%;
+ }
+ .col-sm-7 {
+ width: 58.33333333%;
+ }
+ .col-sm-6 {
+ width: 50%;
+ }
+ .col-sm-5 {
+ width: 41.66666667%;
+ }
+ .col-sm-4 {
+ width: 33.33333333%;
+ }
+ .col-sm-3 {
+ width: 25%;
+ }
+ .col-sm-2 {
+ width: 16.66666667%;
+ }
+ .col-sm-1 {
+ width: 8.33333333%;
+ }
+ .col-sm-pull-12 {
+ right: 100%;
+ }
+ .col-sm-pull-11 {
+ right: 91.66666667%;
+ }
+ .col-sm-pull-10 {
+ right: 83.33333333%;
+ }
+ .col-sm-pull-9 {
+ right: 75%;
+ }
+ .col-sm-pull-8 {
+ right: 66.66666667%;
+ }
+ .col-sm-pull-7 {
+ right: 58.33333333%;
+ }
+ .col-sm-pull-6 {
+ right: 50%;
+ }
+ .col-sm-pull-5 {
+ right: 41.66666667%;
+ }
+ .col-sm-pull-4 {
+ right: 33.33333333%;
+ }
+ .col-sm-pull-3 {
+ right: 25%;
+ }
+ .col-sm-pull-2 {
+ right: 16.66666667%;
+ }
+ .col-sm-pull-1 {
+ right: 8.33333333%;
+ }
+ .col-sm-pull-0 {
+ right: auto;
+ }
+ .col-sm-push-12 {
+ left: 100%;
+ }
+ .col-sm-push-11 {
+ left: 91.66666667%;
+ }
+ .col-sm-push-10 {
+ left: 83.33333333%;
+ }
+ .col-sm-push-9 {
+ left: 75%;
+ }
+ .col-sm-push-8 {
+ left: 66.66666667%;
+ }
+ .col-sm-push-7 {
+ left: 58.33333333%;
+ }
+ .col-sm-push-6 {
+ left: 50%;
+ }
+ .col-sm-push-5 {
+ left: 41.66666667%;
+ }
+ .col-sm-push-4 {
+ left: 33.33333333%;
+ }
+ .col-sm-push-3 {
+ left: 25%;
+ }
+ .col-sm-push-2 {
+ left: 16.66666667%;
+ }
+ .col-sm-push-1 {
+ left: 8.33333333%;
+ }
+ .col-sm-push-0 {
+ left: auto;
+ }
+ .col-sm-offset-12 {
+ margin-left: 100%;
+ }
+ .col-sm-offset-11 {
+ margin-left: 91.66666667%;
+ }
+ .col-sm-offset-10 {
+ margin-left: 83.33333333%;
+ }
+ .col-sm-offset-9 {
+ margin-left: 75%;
+ }
+ .col-sm-offset-8 {
+ margin-left: 66.66666667%;
+ }
+ .col-sm-offset-7 {
+ margin-left: 58.33333333%;
+ }
+ .col-sm-offset-6 {
+ margin-left: 50%;
+ }
+ .col-sm-offset-5 {
+ margin-left: 41.66666667%;
+ }
+ .col-sm-offset-4 {
+ margin-left: 33.33333333%;
+ }
+ .col-sm-offset-3 {
+ margin-left: 25%;
+ }
+ .col-sm-offset-2 {
+ margin-left: 16.66666667%;
+ }
+ .col-sm-offset-1 {
+ margin-left: 8.33333333%;
+ }
+ .col-sm-offset-0 {
+ margin-left: 0%;
+ }
+}
+@media (min-width: 992px) {
+ .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
+ float: left;
+ }
+ .col-md-12 {
+ width: 100%;
+ }
+ .col-md-11 {
+ width: 91.66666667%;
+ }
+ .col-md-10 {
+ width: 83.33333333%;
+ }
+ .col-md-9 {
+ width: 75%;
+ }
+ .col-md-8 {
+ width: 66.66666667%;
+ }
+ .col-md-7 {
+ width: 58.33333333%;
+ }
+ .col-md-6 {
+ width: 50%;
+ }
+ .col-md-5 {
+ width: 41.66666667%;
+ }
+ .col-md-4 {
+ width: 33.33333333%;
+ }
+ .col-md-3 {
+ width: 25%;
+ }
+ .col-md-2 {
+ width: 16.66666667%;
+ }
+ .col-md-1 {
+ width: 8.33333333%;
+ }
+ .col-md-pull-12 {
+ right: 100%;
+ }
+ .col-md-pull-11 {
+ right: 91.66666667%;
+ }
+ .col-md-pull-10 {
+ right: 83.33333333%;
+ }
+ .col-md-pull-9 {
+ right: 75%;
+ }
+ .col-md-pull-8 {
+ right: 66.66666667%;
+ }
+ .col-md-pull-7 {
+ right: 58.33333333%;
+ }
+ .col-md-pull-6 {
+ right: 50%;
+ }
+ .col-md-pull-5 {
+ right: 41.66666667%;
+ }
+ .col-md-pull-4 {
+ right: 33.33333333%;
+ }
+ .col-md-pull-3 {
+ right: 25%;
+ }
+ .col-md-pull-2 {
+ right: 16.66666667%;
+ }
+ .col-md-pull-1 {
+ right: 8.33333333%;
+ }
+ .col-md-pull-0 {
+ right: auto;
+ }
+ .col-md-push-12 {
+ left: 100%;
+ }
+ .col-md-push-11 {
+ left: 91.66666667%;
+ }
+ .col-md-push-10 {
+ left: 83.33333333%;
+ }
+ .col-md-push-9 {
+ left: 75%;
+ }
+ .col-md-push-8 {
+ left: 66.66666667%;
+ }
+ .col-md-push-7 {
+ left: 58.33333333%;
+ }
+ .col-md-push-6 {
+ left: 50%;
+ }
+ .col-md-push-5 {
+ left: 41.66666667%;
+ }
+ .col-md-push-4 {
+ left: 33.33333333%;
+ }
+ .col-md-push-3 {
+ left: 25%;
+ }
+ .col-md-push-2 {
+ left: 16.66666667%;
+ }
+ .col-md-push-1 {
+ left: 8.33333333%;
+ }
+ .col-md-push-0 {
+ left: auto;
+ }
+ .col-md-offset-12 {
+ margin-left: 100%;
+ }
+ .col-md-offset-11 {
+ margin-left: 91.66666667%;
+ }
+ .col-md-offset-10 {
+ margin-left: 83.33333333%;
+ }
+ .col-md-offset-9 {
+ margin-left: 75%;
+ }
+ .col-md-offset-8 {
+ margin-left: 66.66666667%;
+ }
+ .col-md-offset-7 {
+ margin-left: 58.33333333%;
+ }
+ .col-md-offset-6 {
+ margin-left: 50%;
+ }
+ .col-md-offset-5 {
+ margin-left: 41.66666667%;
+ }
+ .col-md-offset-4 {
+ margin-left: 33.33333333%;
+ }
+ .col-md-offset-3 {
+ margin-left: 25%;
+ }
+ .col-md-offset-2 {
+ margin-left: 16.66666667%;
+ }
+ .col-md-offset-1 {
+ margin-left: 8.33333333%;
+ }
+ .col-md-offset-0 {
+ margin-left: 0%;
+ }
+}
+@media (min-width: 1200px) {
+ .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
+ float: left;
+ }
+ .col-lg-12 {
+ width: 100%;
+ }
+ .col-lg-11 {
+ width: 91.66666667%;
+ }
+ .col-lg-10 {
+ width: 83.33333333%;
+ }
+ .col-lg-9 {
+ width: 75%;
+ }
+ .col-lg-8 {
+ width: 66.66666667%;
+ }
+ .col-lg-7 {
+ width: 58.33333333%;
+ }
+ .col-lg-6 {
+ width: 50%;
+ }
+ .col-lg-5 {
+ width: 41.66666667%;
+ }
+ .col-lg-4 {
+ width: 33.33333333%;
+ }
+ .col-lg-3 {
+ width: 25%;
+ }
+ .col-lg-2 {
+ width: 16.66666667%;
+ }
+ .col-lg-1 {
+ width: 8.33333333%;
+ }
+ .col-lg-pull-12 {
+ right: 100%;
+ }
+ .col-lg-pull-11 {
+ right: 91.66666667%;
+ }
+ .col-lg-pull-10 {
+ right: 83.33333333%;
+ }
+ .col-lg-pull-9 {
+ right: 75%;
+ }
+ .col-lg-pull-8 {
+ right: 66.66666667%;
+ }
+ .col-lg-pull-7 {
+ right: 58.33333333%;
+ }
+ .col-lg-pull-6 {
+ right: 50%;
+ }
+ .col-lg-pull-5 {
+ right: 41.66666667%;
+ }
+ .col-lg-pull-4 {
+ right: 33.33333333%;
+ }
+ .col-lg-pull-3 {
+ right: 25%;
+ }
+ .col-lg-pull-2 {
+ right: 16.66666667%;
+ }
+ .col-lg-pull-1 {
+ right: 8.33333333%;
+ }
+ .col-lg-pull-0 {
+ right: auto;
+ }
+ .col-lg-push-12 {
+ left: 100%;
+ }
+ .col-lg-push-11 {
+ left: 91.66666667%;
+ }
+ .col-lg-push-10 {
+ left: 83.33333333%;
+ }
+ .col-lg-push-9 {
+ left: 75%;
+ }
+ .col-lg-push-8 {
+ left: 66.66666667%;
+ }
+ .col-lg-push-7 {
+ left: 58.33333333%;
+ }
+ .col-lg-push-6 {
+ left: 50%;
+ }
+ .col-lg-push-5 {
+ left: 41.66666667%;
+ }
+ .col-lg-push-4 {
+ left: 33.33333333%;
+ }
+ .col-lg-push-3 {
+ left: 25%;
+ }
+ .col-lg-push-2 {
+ left: 16.66666667%;
+ }
+ .col-lg-push-1 {
+ left: 8.33333333%;
+ }
+ .col-lg-push-0 {
+ left: auto;
+ }
+ .col-lg-offset-12 {
+ margin-left: 100%;
+ }
+ .col-lg-offset-11 {
+ margin-left: 91.66666667%;
+ }
+ .col-lg-offset-10 {
+ margin-left: 83.33333333%;
+ }
+ .col-lg-offset-9 {
+ margin-left: 75%;
+ }
+ .col-lg-offset-8 {
+ margin-left: 66.66666667%;
+ }
+ .col-lg-offset-7 {
+ margin-left: 58.33333333%;
+ }
+ .col-lg-offset-6 {
+ margin-left: 50%;
+ }
+ .col-lg-offset-5 {
+ margin-left: 41.66666667%;
+ }
+ .col-lg-offset-4 {
+ margin-left: 33.33333333%;
+ }
+ .col-lg-offset-3 {
+ margin-left: 25%;
+ }
+ .col-lg-offset-2 {
+ margin-left: 16.66666667%;
+ }
+ .col-lg-offset-1 {
+ margin-left: 8.33333333%;
+ }
+ .col-lg-offset-0 {
+ margin-left: 0%;
+ }
+}
+table {
+ background-color: #2e3338;
+}
+caption {
+ padding-top: 8px;
+ padding-bottom: 8px;
+ color: #7a8288;
+ text-align: left;
+}
+th {
+ text-align: left;
+}
+.table {
+ width: 100%;
+ max-width: 100%;
+ margin-bottom: 20px;
+}
+.table > thead > tr > th,
+.table > tbody > tr > th,
+.table > tfoot > tr > th,
+.table > thead > tr > td,
+.table > tbody > tr > td,
+.table > tfoot > tr > td {
+ padding: 8px;
+ line-height: 1.42857143;
+ vertical-align: top;
+ border-top: 1px solid #1c1e22;
+}
+.table > thead > tr > th {
+ vertical-align: bottom;
+ border-bottom: 2px solid #1c1e22;
+}
+.table > caption + thead > tr:first-child > th,
+.table > colgroup + thead > tr:first-child > th,
+.table > thead:first-child > tr:first-child > th,
+.table > caption + thead > tr:first-child > td,
+.table > colgroup + thead > tr:first-child > td,
+.table > thead:first-child > tr:first-child > td {
+ border-top: 0;
+}
+.table > tbody + tbody {
+ border-top: 2px solid #1c1e22;
+}
+.table .table {
+ background-color: #272b30;
+}
+.table-condensed > thead > tr > th,
+.table-condensed > tbody > tr > th,
+.table-condensed > tfoot > tr > th,
+.table-condensed > thead > tr > td,
+.table-condensed > tbody > tr > td,
+.table-condensed > tfoot > tr > td {
+ padding: 5px;
+}
+.table-bordered {
+ border: 1px solid #1c1e22;
+}
+.table-bordered > thead > tr > th,
+.table-bordered > tbody > tr > th,
+.table-bordered > tfoot > tr > th,
+.table-bordered > thead > tr > td,
+.table-bordered > tbody > tr > td,
+.table-bordered > tfoot > tr > td {
+ border: 1px solid #1c1e22;
+}
+.table-bordered > thead > tr > th,
+.table-bordered > thead > tr > td {
+ border-bottom-width: 2px;
+}
+.table-striped > tbody > tr:nth-of-type(odd) {
+ background-color: #353a41;
+}
+.table-hover > tbody > tr:hover {
+ background-color: #49515a;
+}
+table col[class*="col-"] {
+ position: static;
+ float: none;
+ display: table-column;
+}
+table td[class*="col-"],
+table th[class*="col-"] {
+ position: static;
+ float: none;
+ display: table-cell;
+}
+.table > thead > tr > td.active,
+.table > tbody > tr > td.active,
+.table > tfoot > tr > td.active,
+.table > thead > tr > th.active,
+.table > tbody > tr > th.active,
+.table > tfoot > tr > th.active,
+.table > thead > tr.active > td,
+.table > tbody > tr.active > td,
+.table > tfoot > tr.active > td,
+.table > thead > tr.active > th,
+.table > tbody > tr.active > th,
+.table > tfoot > tr.active > th {
+ background-color: #49515a;
+}
+.table-hover > tbody > tr > td.active:hover,
+.table-hover > tbody > tr > th.active:hover,
+.table-hover > tbody > tr.active:hover > td,
+.table-hover > tbody > tr:hover > .active,
+.table-hover > tbody > tr.active:hover > th {
+ background-color: #3e444c;
+}
+.table > thead > tr > td.success,
+.table > tbody > tr > td.success,
+.table > tfoot > tr > td.success,
+.table > thead > tr > th.success,
+.table > tbody > tr > th.success,
+.table > tfoot > tr > th.success,
+.table > thead > tr.success > td,
+.table > tbody > tr.success > td,
+.table > tfoot > tr.success > td,
+.table > thead > tr.success > th,
+.table > tbody > tr.success > th,
+.table > tfoot > tr.success > th {
+ background-color: #62c462;
+}
+.table-hover > tbody > tr > td.success:hover,
+.table-hover > tbody > tr > th.success:hover,
+.table-hover > tbody > tr.success:hover > td,
+.table-hover > tbody > tr:hover > .success,
+.table-hover > tbody > tr.success:hover > th {
+ background-color: #4fbd4f;
+}
+.table > thead > tr > td.info,
+.table > tbody > tr > td.info,
+.table > tfoot > tr > td.info,
+.table > thead > tr > th.info,
+.table > tbody > tr > th.info,
+.table > tfoot > tr > th.info,
+.table > thead > tr.info > td,
+.table > tbody > tr.info > td,
+.table > tfoot > tr.info > td,
+.table > thead > tr.info > th,
+.table > tbody > tr.info > th,
+.table > tfoot > tr.info > th {
+ background-color: #5bc0de;
+}
+.table-hover > tbody > tr > td.info:hover,
+.table-hover > tbody > tr > th.info:hover,
+.table-hover > tbody > tr.info:hover > td,
+.table-hover > tbody > tr:hover > .info,
+.table-hover > tbody > tr.info:hover > th {
+ background-color: #46b8da;
+}
+.table > thead > tr > td.warning,
+.table > tbody > tr > td.warning,
+.table > tfoot > tr > td.warning,
+.table > thead > tr > th.warning,
+.table > tbody > tr > th.warning,
+.table > tfoot > tr > th.warning,
+.table > thead > tr.warning > td,
+.table > tbody > tr.warning > td,
+.table > tfoot > tr.warning > td,
+.table > thead > tr.warning > th,
+.table > tbody > tr.warning > th,
+.table > tfoot > tr.warning > th {
+ background-color: #f89406;
+}
+.table-hover > tbody > tr > td.warning:hover,
+.table-hover > tbody > tr > th.warning:hover,
+.table-hover > tbody > tr.warning:hover > td,
+.table-hover > tbody > tr:hover > .warning,
+.table-hover > tbody > tr.warning:hover > th {
+ background-color: #df8505;
+}
+.table > thead > tr > td.danger,
+.table > tbody > tr > td.danger,
+.table > tfoot > tr > td.danger,
+.table > thead > tr > th.danger,
+.table > tbody > tr > th.danger,
+.table > tfoot > tr > th.danger,
+.table > thead > tr.danger > td,
+.table > tbody > tr.danger > td,
+.table > tfoot > tr.danger > td,
+.table > thead > tr.danger > th,
+.table > tbody > tr.danger > th,
+.table > tfoot > tr.danger > th {
+ background-color: #ee5f5b;
+}
+.table-hover > tbody > tr > td.danger:hover,
+.table-hover > tbody > tr > th.danger:hover,
+.table-hover > tbody > tr.danger:hover > td,
+.table-hover > tbody > tr:hover > .danger,
+.table-hover > tbody > tr.danger:hover > th {
+ background-color: #ec4844;
+}
+.table-responsive {
+ overflow-x: auto;
+ min-height: 0.01%;
+}
+@media screen and (max-width: 767px) {
+ .table-responsive {
+ width: 100%;
+ margin-bottom: 15px;
+ overflow-y: hidden;
+ -ms-overflow-style: -ms-autohiding-scrollbar;
+ border: 1px solid #1c1e22;
+ }
+ .table-responsive > .table {
+ margin-bottom: 0;
+ }
+ .table-responsive > .table > thead > tr > th,
+ .table-responsive > .table > tbody > tr > th,
+ .table-responsive > .table > tfoot > tr > th,
+ .table-responsive > .table > thead > tr > td,
+ .table-responsive > .table > tbody > tr > td,
+ .table-responsive > .table > tfoot > tr > td {
+ white-space: nowrap;
+ }
+ .table-responsive > .table-bordered {
+ border: 0;
+ }
+ .table-responsive > .table-bordered > thead > tr > th:first-child,
+ .table-responsive > .table-bordered > tbody > tr > th:first-child,
+ .table-responsive > .table-bordered > tfoot > tr > th:first-child,
+ .table-responsive > .table-bordered > thead > tr > td:first-child,
+ .table-responsive > .table-bordered > tbody > tr > td:first-child,
+ .table-responsive > .table-bordered > tfoot > tr > td:first-child {
+ border-left: 0;
+ }
+ .table-responsive > .table-bordered > thead > tr > th:last-child,
+ .table-responsive > .table-bordered > tbody > tr > th:last-child,
+ .table-responsive > .table-bordered > tfoot > tr > th:last-child,
+ .table-responsive > .table-bordered > thead > tr > td:last-child,
+ .table-responsive > .table-bordered > tbody > tr > td:last-child,
+ .table-responsive > .table-bordered > tfoot > tr > td:last-child {
+ border-right: 0;
+ }
+ .table-responsive > .table-bordered > tbody > tr:last-child > th,
+ .table-responsive > .table-bordered > tfoot > tr:last-child > th,
+ .table-responsive > .table-bordered > tbody > tr:last-child > td,
+ .table-responsive > .table-bordered > tfoot > tr:last-child > td {
+ border-bottom: 0;
+ }
+}
+fieldset {
+ padding: 0;
+ margin: 0;
+ border: 0;
+ min-width: 0;
+}
+legend {
+ display: block;
+ width: 100%;
+ padding: 0;
+ margin-bottom: 20px;
+ font-size: 21px;
+ line-height: inherit;
+ color: #c8c8c8;
+ border: 0;
+ border-bottom: 1px solid #1c1e22;
+}
+label {
+ display: inline-block;
+ max-width: 100%;
+ margin-bottom: 5px;
+ font-weight: bold;
+}
+input[type="search"] {
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+}
+input[type="radio"],
+input[type="checkbox"] {
+ margin: 4px 0 0;
+ margin-top: 1px \9;
+ line-height: normal;
+}
+input[type="file"] {
+ display: block;
+}
+input[type="range"] {
+ display: block;
+ width: 100%;
+}
+select[multiple],
+select[size] {
+ height: auto;
+}
+input[type="file"]:focus,
+input[type="radio"]:focus,
+input[type="checkbox"]:focus {
+ outline: thin dotted;
+ outline: 5px auto -webkit-focus-ring-color;
+ outline-offset: -2px;
+}
+output {
+ display: block;
+ padding-top: 9px;
+ font-size: 14px;
+ line-height: 1.42857143;
+ color: #272b30;
+}
+.form-control {
+ display: block;
+ width: 100%;
+ height: 38px;
+ padding: 8px 12px;
+ font-size: 14px;
+ line-height: 1.42857143;
+ color: #272b30;
+ background-color: #ffffff;
+ background-image: none;
+ border: 1px solid #000000;
+ border-radius: 4px;
+ -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+ -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
+ -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
+ transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
+}
+.form-control:focus {
+ border-color: #66afe9;
+ outline: 0;
+ -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
+ box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);
+}
+.form-control::-moz-placeholder {
+ color: #7a8288;
+ opacity: 1;
+}
+.form-control:-ms-input-placeholder {
+ color: #7a8288;
+}
+.form-control::-webkit-input-placeholder {
+ color: #7a8288;
+}
+.form-control::-ms-expand {
+ border: 0;
+ background-color: transparent;
+}
+.form-control[disabled],
+.form-control[readonly],
+fieldset[disabled] .form-control {
+ background-color: #999999;
+ opacity: 1;
+}
+.form-control[disabled],
+fieldset[disabled] .form-control {
+ cursor: not-allowed;
+}
+textarea.form-control {
+ height: auto;
+}
+input[type="search"] {
+ -webkit-appearance: none;
+}
+@media screen and (-webkit-min-device-pixel-ratio: 0) {
+ input[type="date"].form-control,
+ input[type="time"].form-control,
+ input[type="datetime-local"].form-control,
+ input[type="month"].form-control {
+ line-height: 38px;
+ }
+ input[type="date"].input-sm,
+ input[type="time"].input-sm,
+ input[type="datetime-local"].input-sm,
+ input[type="month"].input-sm,
+ .input-group-sm input[type="date"],
+ .input-group-sm input[type="time"],
+ .input-group-sm input[type="datetime-local"],
+ .input-group-sm input[type="month"] {
+ line-height: 30px;
+ }
+ input[type="date"].input-lg,
+ input[type="time"].input-lg,
+ input[type="datetime-local"].input-lg,
+ input[type="month"].input-lg,
+ .input-group-lg input[type="date"],
+ .input-group-lg input[type="time"],
+ .input-group-lg input[type="datetime-local"],
+ .input-group-lg input[type="month"] {
+ line-height: 54px;
+ }
+}
+.form-group {
+ margin-bottom: 15px;
+}
+.radio,
+.checkbox {
+ position: relative;
+ display: block;
+ margin-top: 10px;
+ margin-bottom: 10px;
+}
+.radio label,
+.checkbox label {
+ min-height: 20px;
+ padding-left: 20px;
+ margin-bottom: 0;
+ font-weight: normal;
+ cursor: pointer;
+}
+.radio input[type="radio"],
+.radio-inline input[type="radio"],
+.checkbox input[type="checkbox"],
+.checkbox-inline input[type="checkbox"] {
+ position: absolute;
+ margin-left: -20px;
+ margin-top: 4px \9;
+}
+.radio + .radio,
+.checkbox + .checkbox {
+ margin-top: -5px;
+}
+.radio-inline,
+.checkbox-inline {
+ position: relative;
+ display: inline-block;
+ padding-left: 20px;
+ margin-bottom: 0;
+ vertical-align: middle;
+ font-weight: normal;
+ cursor: pointer;
+}
+.radio-inline + .radio-inline,
+.checkbox-inline + .checkbox-inline {
+ margin-top: 0;
+ margin-left: 10px;
+}
+input[type="radio"][disabled],
+input[type="checkbox"][disabled],
+input[type="radio"].disabled,
+input[type="checkbox"].disabled,
+fieldset[disabled] input[type="radio"],
+fieldset[disabled] input[type="checkbox"] {
+ cursor: not-allowed;
+}
+.radio-inline.disabled,
+.checkbox-inline.disabled,
+fieldset[disabled] .radio-inline,
+fieldset[disabled] .checkbox-inline {
+ cursor: not-allowed;
+}
+.radio.disabled label,
+.checkbox.disabled label,
+fieldset[disabled] .radio label,
+fieldset[disabled] .checkbox label {
+ cursor: not-allowed;
+}
+.form-control-static {
+ padding-top: 9px;
+ padding-bottom: 9px;
+ margin-bottom: 0;
+ min-height: 34px;
+}
+.form-control-static.input-lg,
+.form-control-static.input-sm {
+ padding-left: 0;
+ padding-right: 0;
+}
+.input-sm {
+ height: 30px;
+ padding: 5px 10px;
+ font-size: 12px;
+ line-height: 1.5;
+ border-radius: 3px;
+}
+select.input-sm {
+ height: 30px;
+ line-height: 30px;
+}
+textarea.input-sm,
+select[multiple].input-sm {
+ height: auto;
+}
+.form-group-sm .form-control {
+ height: 30px;
+ padding: 5px 10px;
+ font-size: 12px;
+ line-height: 1.5;
+ border-radius: 3px;
+}
+.form-group-sm select.form-control {
+ height: 30px;
+ line-height: 30px;
+}
+.form-group-sm textarea.form-control,
+.form-group-sm select[multiple].form-control {
+ height: auto;
+}
+.form-group-sm .form-control-static {
+ height: 30px;
+ min-height: 32px;
+ padding: 6px 10px;
+ font-size: 12px;
+ line-height: 1.5;
+}
+.input-lg {
+ height: 54px;
+ padding: 14px 16px;
+ font-size: 18px;
+ line-height: 1.3333333;
+ border-radius: 6px;
+}
+select.input-lg {
+ height: 54px;
+ line-height: 54px;
+}
+textarea.input-lg,
+select[multiple].input-lg {
+ height: auto;
+}
+.form-group-lg .form-control {
+ height: 54px;
+ padding: 14px 16px;
+ font-size: 18px;
+ line-height: 1.3333333;
+ border-radius: 6px;
+}
+.form-group-lg select.form-control {
+ height: 54px;
+ line-height: 54px;
+}
+.form-group-lg textarea.form-control,
+.form-group-lg select[multiple].form-control {
+ height: auto;
+}
+.form-group-lg .form-control-static {
+ height: 54px;
+ min-height: 38px;
+ padding: 15px 16px;
+ font-size: 18px;
+ line-height: 1.3333333;
+}
+.has-feedback {
+ position: relative;
+}
+.has-feedback .form-control {
+ padding-right: 47.5px;
+}
+.form-control-feedback {
+ position: absolute;
+ top: 0;
+ right: 0;
+ z-index: 2;
+ display: block;
+ width: 38px;
+ height: 38px;
+ line-height: 38px;
+ text-align: center;
+ pointer-events: none;
+}
+.input-lg + .form-control-feedback,
+.input-group-lg + .form-control-feedback,
+.form-group-lg .form-control + .form-control-feedback {
+ width: 54px;
+ height: 54px;
+ line-height: 54px;
+}
+.input-sm + .form-control-feedback,
+.input-group-sm + .form-control-feedback,
+.form-group-sm .form-control + .form-control-feedback {
+ width: 30px;
+ height: 30px;
+ line-height: 30px;
+}
+.has-success .help-block,
+.has-success .control-label,
+.has-success .radio,
+.has-success .checkbox,
+.has-success .radio-inline,
+.has-success .checkbox-inline,
+.has-success.radio label,
+.has-success.checkbox label,
+.has-success.radio-inline label,
+.has-success.checkbox-inline label {
+ color: #ffffff;
+}
+.has-success .form-control {
+ border-color: #ffffff;
+ -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+}
+.has-success .form-control:focus {
+ border-color: #e6e6e6;
+ -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ffffff;
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ffffff;
+}
+.has-success .input-group-addon {
+ color: #ffffff;
+ border-color: #ffffff;
+ background-color: #62c462;
+}
+.has-success .form-control-feedback {
+ color: #ffffff;
+}
+.has-warning .help-block,
+.has-warning .control-label,
+.has-warning .radio,
+.has-warning .checkbox,
+.has-warning .radio-inline,
+.has-warning .checkbox-inline,
+.has-warning.radio label,
+.has-warning.checkbox label,
+.has-warning.radio-inline label,
+.has-warning.checkbox-inline label {
+ color: #ffffff;
+}
+.has-warning .form-control {
+ border-color: #ffffff;
+ -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+}
+.has-warning .form-control:focus {
+ border-color: #e6e6e6;
+ -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ffffff;
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ffffff;
+}
+.has-warning .input-group-addon {
+ color: #ffffff;
+ border-color: #ffffff;
+ background-color: #f89406;
+}
+.has-warning .form-control-feedback {
+ color: #ffffff;
+}
+.has-error .help-block,
+.has-error .control-label,
+.has-error .radio,
+.has-error .checkbox,
+.has-error .radio-inline,
+.has-error .checkbox-inline,
+.has-error.radio label,
+.has-error.checkbox label,
+.has-error.radio-inline label,
+.has-error.checkbox-inline label {
+ color: #ffffff;
+}
+.has-error .form-control {
+ border-color: #ffffff;
+ -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+}
+.has-error .form-control:focus {
+ border-color: #e6e6e6;
+ -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ffffff;
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ffffff;
+}
+.has-error .input-group-addon {
+ color: #ffffff;
+ border-color: #ffffff;
+ background-color: #ee5f5b;
+}
+.has-error .form-control-feedback {
+ color: #ffffff;
+}
+.has-feedback label ~ .form-control-feedback {
+ top: 25px;
+}
+.has-feedback label.sr-only ~ .form-control-feedback {
+ top: 0;
+}
+.help-block {
+ display: block;
+ margin-top: 5px;
+ margin-bottom: 10px;
+ color: #ffffff;
+}
+@media (min-width: 768px) {
+ .form-inline .form-group {
+ display: inline-block;
+ margin-bottom: 0;
+ vertical-align: middle;
+ }
+ .form-inline .form-control {
+ display: inline-block;
+ width: auto;
+ vertical-align: middle;
+ }
+ .form-inline .form-control-static {
+ display: inline-block;
+ }
+ .form-inline .input-group {
+ display: inline-table;
+ vertical-align: middle;
+ }
+ .form-inline .input-group .input-group-addon,
+ .form-inline .input-group .input-group-btn,
+ .form-inline .input-group .form-control {
+ width: auto;
+ }
+ .form-inline .input-group > .form-control {
+ width: 100%;
+ }
+ .form-inline .control-label {
+ margin-bottom: 0;
+ vertical-align: middle;
+ }
+ .form-inline .radio,
+ .form-inline .checkbox {
+ display: inline-block;
+ margin-top: 0;
+ margin-bottom: 0;
+ vertical-align: middle;
+ }
+ .form-inline .radio label,
+ .form-inline .checkbox label {
+ padding-left: 0;
+ }
+ .form-inline .radio input[type="radio"],
+ .form-inline .checkbox input[type="checkbox"] {
+ position: relative;
+ margin-left: 0;
+ }
+ .form-inline .has-feedback .form-control-feedback {
+ top: 0;
+ }
+}
+.form-horizontal .radio,
+.form-horizontal .checkbox,
+.form-horizontal .radio-inline,
+.form-horizontal .checkbox-inline {
+ margin-top: 0;
+ margin-bottom: 0;
+ padding-top: 9px;
+}
+.form-horizontal .radio,
+.form-horizontal .checkbox {
+ min-height: 29px;
+}
+.form-horizontal .form-group {
+ margin-left: -15px;
+ margin-right: -15px;
+}
+@media (min-width: 768px) {
+ .form-horizontal .control-label {
+ text-align: right;
+ margin-bottom: 0;
+ padding-top: 9px;
+ }
+}
+.form-horizontal .has-feedback .form-control-feedback {
+ right: 15px;
+}
+@media (min-width: 768px) {
+ .form-horizontal .form-group-lg .control-label {
+ padding-top: 15px;
+ font-size: 18px;
+ }
+}
+@media (min-width: 768px) {
+ .form-horizontal .form-group-sm .control-label {
+ padding-top: 6px;
+ font-size: 12px;
+ }
+}
+.btn {
+ display: inline-block;
+ margin-bottom: 0;
+ font-weight: normal;
+ text-align: center;
+ vertical-align: middle;
+ -ms-touch-action: manipulation;
+ touch-action: manipulation;
+ cursor: pointer;
+ background-image: none;
+ border: 1px solid transparent;
+ white-space: nowrap;
+ padding: 8px 12px;
+ font-size: 14px;
+ line-height: 1.42857143;
+ border-radius: 4px;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+.btn:focus,
+.btn:active:focus,
+.btn.active:focus,
+.btn.focus,
+.btn:active.focus,
+.btn.active.focus {
+ outline: thin dotted;
+ outline: 5px auto -webkit-focus-ring-color;
+ outline-offset: -2px;
+}
+.btn:hover,
+.btn:focus,
+.btn.focus {
+ color: #ffffff;
+ text-decoration: none;
+}
+.btn:active,
+.btn.active {
+ outline: 0;
+ background-image: none;
+ -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
+ box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
+}
+.btn.disabled,
+.btn[disabled],
+fieldset[disabled] .btn {
+ cursor: not-allowed;
+ opacity: 0.65;
+ filter: alpha(opacity=65);
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+a.btn.disabled,
+fieldset[disabled] a.btn {
+ pointer-events: none;
+}
+.btn-default {
+ color: #ffffff;
+ background-color: #3a3f44;
+ border-color: #3a3f44;
+}
+.btn-default:focus,
+.btn-default.focus {
+ color: #ffffff;
+ background-color: #232628;
+ border-color: #000000;
+}
+.btn-default:hover {
+ color: #ffffff;
+ background-color: #232628;
+ border-color: #1e2023;
+}
+.btn-default:active,
+.btn-default.active,
+.open > .dropdown-toggle.btn-default {
+ color: #ffffff;
+ background-color: #232628;
+ border-color: #1e2023;
+}
+.btn-default:active:hover,
+.btn-default.active:hover,
+.open > .dropdown-toggle.btn-default:hover,
+.btn-default:active:focus,
+.btn-default.active:focus,
+.open > .dropdown-toggle.btn-default:focus,
+.btn-default:active.focus,
+.btn-default.active.focus,
+.open > .dropdown-toggle.btn-default.focus {
+ color: #ffffff;
+ background-color: #121415;
+ border-color: #000000;
+}
+.btn-default:active,
+.btn-default.active,
+.open > .dropdown-toggle.btn-default {
+ background-image: none;
+}
+.btn-default.disabled:hover,
+.btn-default[disabled]:hover,
+fieldset[disabled] .btn-default:hover,
+.btn-default.disabled:focus,
+.btn-default[disabled]:focus,
+fieldset[disabled] .btn-default:focus,
+.btn-default.disabled.focus,
+.btn-default[disabled].focus,
+fieldset[disabled] .btn-default.focus {
+ background-color: #3a3f44;
+ border-color: #3a3f44;
+}
+.btn-default .badge {
+ color: #3a3f44;
+ background-color: #ffffff;
+}
+.btn-primary {
+ color: #ffffff;
+ background-color: #7a8288;
+ border-color: #7a8288;
+}
+.btn-primary:focus,
+.btn-primary.focus {
+ color: #ffffff;
+ background-color: #62686d;
+ border-color: #3e4245;
+}
+.btn-primary:hover {
+ color: #ffffff;
+ background-color: #62686d;
+ border-color: #5d6368;
+}
+.btn-primary:active,
+.btn-primary.active,
+.open > .dropdown-toggle.btn-primary {
+ color: #ffffff;
+ background-color: #62686d;
+ border-color: #5d6368;
+}
+.btn-primary:active:hover,
+.btn-primary.active:hover,
+.open > .dropdown-toggle.btn-primary:hover,
+.btn-primary:active:focus,
+.btn-primary.active:focus,
+.open > .dropdown-toggle.btn-primary:focus,
+.btn-primary:active.focus,
+.btn-primary.active.focus,
+.open > .dropdown-toggle.btn-primary.focus {
+ color: #ffffff;
+ background-color: #51565a;
+ border-color: #3e4245;
+}
+.btn-primary:active,
+.btn-primary.active,
+.open > .dropdown-toggle.btn-primary {
+ background-image: none;
+}
+.btn-primary.disabled:hover,
+.btn-primary[disabled]:hover,
+fieldset[disabled] .btn-primary:hover,
+.btn-primary.disabled:focus,
+.btn-primary[disabled]:focus,
+fieldset[disabled] .btn-primary:focus,
+.btn-primary.disabled.focus,
+.btn-primary[disabled].focus,
+fieldset[disabled] .btn-primary.focus {
+ background-color: #7a8288;
+ border-color: #7a8288;
+}
+.btn-primary .badge {
+ color: #7a8288;
+ background-color: #ffffff;
+}
+.btn-success {
+ color: #ffffff;
+ background-color: #62c462;
+ border-color: #62c462;
+}
+.btn-success:focus,
+.btn-success.focus {
+ color: #ffffff;
+ background-color: #42b142;
+ border-color: #2d792d;
+}
+.btn-success:hover {
+ color: #ffffff;
+ background-color: #42b142;
+ border-color: #40a940;
+}
+.btn-success:active,
+.btn-success.active,
+.open > .dropdown-toggle.btn-success {
+ color: #ffffff;
+ background-color: #42b142;
+ border-color: #40a940;
+}
+.btn-success:active:hover,
+.btn-success.active:hover,
+.open > .dropdown-toggle.btn-success:hover,
+.btn-success:active:focus,
+.btn-success.active:focus,
+.open > .dropdown-toggle.btn-success:focus,
+.btn-success:active.focus,
+.btn-success.active.focus,
+.open > .dropdown-toggle.btn-success.focus {
+ color: #ffffff;
+ background-color: #399739;
+ border-color: #2d792d;
+}
+.btn-success:active,
+.btn-success.active,
+.open > .dropdown-toggle.btn-success {
+ background-image: none;
+}
+.btn-success.disabled:hover,
+.btn-success[disabled]:hover,
+fieldset[disabled] .btn-success:hover,
+.btn-success.disabled:focus,
+.btn-success[disabled]:focus,
+fieldset[disabled] .btn-success:focus,
+.btn-success.disabled.focus,
+.btn-success[disabled].focus,
+fieldset[disabled] .btn-success.focus {
+ background-color: #62c462;
+ border-color: #62c462;
+}
+.btn-success .badge {
+ color: #62c462;
+ background-color: #ffffff;
+}
+.btn-info {
+ color: #ffffff;
+ background-color: #5bc0de;
+ border-color: #5bc0de;
+}
+.btn-info:focus,
+.btn-info.focus {
+ color: #ffffff;
+ background-color: #31b0d5;
+ border-color: #1f7e9a;
+}
+.btn-info:hover {
+ color: #ffffff;
+ background-color: #31b0d5;
+ border-color: #2aabd2;
+}
+.btn-info:active,
+.btn-info.active,
+.open > .dropdown-toggle.btn-info {
+ color: #ffffff;
+ background-color: #31b0d5;
+ border-color: #2aabd2;
+}
+.btn-info:active:hover,
+.btn-info.active:hover,
+.open > .dropdown-toggle.btn-info:hover,
+.btn-info:active:focus,
+.btn-info.active:focus,
+.open > .dropdown-toggle.btn-info:focus,
+.btn-info:active.focus,
+.btn-info.active.focus,
+.open > .dropdown-toggle.btn-info.focus {
+ color: #ffffff;
+ background-color: #269abc;
+ border-color: #1f7e9a;
+}
+.btn-info:active,
+.btn-info.active,
+.open > .dropdown-toggle.btn-info {
+ background-image: none;
+}
+.btn-info.disabled:hover,
+.btn-info[disabled]:hover,
+fieldset[disabled] .btn-info:hover,
+.btn-info.disabled:focus,
+.btn-info[disabled]:focus,
+fieldset[disabled] .btn-info:focus,
+.btn-info.disabled.focus,
+.btn-info[disabled].focus,
+fieldset[disabled] .btn-info.focus {
+ background-color: #5bc0de;
+ border-color: #5bc0de;
+}
+.btn-info .badge {
+ color: #5bc0de;
+ background-color: #ffffff;
+}
+.btn-warning {
+ color: #ffffff;
+ background-color: #f89406;
+ border-color: #f89406;
+}
+.btn-warning:focus,
+.btn-warning.focus {
+ color: #ffffff;
+ background-color: #c67605;
+ border-color: #7c4a03;
+}
+.btn-warning:hover {
+ color: #ffffff;
+ background-color: #c67605;
+ border-color: #bc7005;
+}
+.btn-warning:active,
+.btn-warning.active,
+.open > .dropdown-toggle.btn-warning {
+ color: #ffffff;
+ background-color: #c67605;
+ border-color: #bc7005;
+}
+.btn-warning:active:hover,
+.btn-warning.active:hover,
+.open > .dropdown-toggle.btn-warning:hover,
+.btn-warning:active:focus,
+.btn-warning.active:focus,
+.open > .dropdown-toggle.btn-warning:focus,
+.btn-warning:active.focus,
+.btn-warning.active.focus,
+.open > .dropdown-toggle.btn-warning.focus {
+ color: #ffffff;
+ background-color: #a36104;
+ border-color: #7c4a03;
+}
+.btn-warning:active,
+.btn-warning.active,
+.open > .dropdown-toggle.btn-warning {
+ background-image: none;
+}
+.btn-warning.disabled:hover,
+.btn-warning[disabled]:hover,
+fieldset[disabled] .btn-warning:hover,
+.btn-warning.disabled:focus,
+.btn-warning[disabled]:focus,
+fieldset[disabled] .btn-warning:focus,
+.btn-warning.disabled.focus,
+.btn-warning[disabled].focus,
+fieldset[disabled] .btn-warning.focus {
+ background-color: #f89406;
+ border-color: #f89406;
+}
+.btn-warning .badge {
+ color: #f89406;
+ background-color: #ffffff;
+}
+.btn-danger {
+ color: #ffffff;
+ background-color: #ee5f5b;
+ border-color: #ee5f5b;
+}
+.btn-danger:focus,
+.btn-danger.focus {
+ color: #ffffff;
+ background-color: #e9322d;
+ border-color: #b71713;
+}
+.btn-danger:hover {
+ color: #ffffff;
+ background-color: #e9322d;
+ border-color: #e82924;
+}
+.btn-danger:active,
+.btn-danger.active,
+.open > .dropdown-toggle.btn-danger {
+ color: #ffffff;
+ background-color: #e9322d;
+ border-color: #e82924;
+}
+.btn-danger:active:hover,
+.btn-danger.active:hover,
+.open > .dropdown-toggle.btn-danger:hover,
+.btn-danger:active:focus,
+.btn-danger.active:focus,
+.open > .dropdown-toggle.btn-danger:focus,
+.btn-danger:active.focus,
+.btn-danger.active.focus,
+.open > .dropdown-toggle.btn-danger.focus {
+ color: #ffffff;
+ background-color: #dc1c17;
+ border-color: #b71713;
+}
+.btn-danger:active,
+.btn-danger.active,
+.open > .dropdown-toggle.btn-danger {
+ background-image: none;
+}
+.btn-danger.disabled:hover,
+.btn-danger[disabled]:hover,
+fieldset[disabled] .btn-danger:hover,
+.btn-danger.disabled:focus,
+.btn-danger[disabled]:focus,
+fieldset[disabled] .btn-danger:focus,
+.btn-danger.disabled.focus,
+.btn-danger[disabled].focus,
+fieldset[disabled] .btn-danger.focus {
+ background-color: #ee5f5b;
+ border-color: #ee5f5b;
+}
+.btn-danger .badge {
+ color: #ee5f5b;
+ background-color: #ffffff;
+}
+.btn-link {
+ color: #ffffff;
+ font-weight: normal;
+ border-radius: 0;
+}
+.btn-link,
+.btn-link:active,
+.btn-link.active,
+.btn-link[disabled],
+fieldset[disabled] .btn-link {
+ background-color: transparent;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+.btn-link,
+.btn-link:hover,
+.btn-link:focus,
+.btn-link:active {
+ border-color: transparent;
+}
+.btn-link:hover,
+.btn-link:focus {
+ color: #ffffff;
+ text-decoration: underline;
+ background-color: transparent;
+}
+.btn-link[disabled]:hover,
+fieldset[disabled] .btn-link:hover,
+.btn-link[disabled]:focus,
+fieldset[disabled] .btn-link:focus {
+ color: #7a8288;
+ text-decoration: none;
+}
+.btn-lg,
+.btn-group-lg > .btn {
+ padding: 14px 16px;
+ font-size: 18px;
+ line-height: 1.3333333;
+ border-radius: 6px;
+}
+.btn-sm,
+.btn-group-sm > .btn {
+ padding: 5px 10px;
+ font-size: 12px;
+ line-height: 1.5;
+ border-radius: 3px;
+}
+.btn-xs,
+.btn-group-xs > .btn {
+ padding: 1px 5px;
+ font-size: 12px;
+ line-height: 1.5;
+ border-radius: 3px;
+}
+.btn-block {
+ display: block;
+ width: 100%;
+}
+.btn-block + .btn-block {
+ margin-top: 5px;
+}
+input[type="submit"].btn-block,
+input[type="reset"].btn-block,
+input[type="button"].btn-block {
+ width: 100%;
+}
+.fade {
+ opacity: 0;
+ -webkit-transition: opacity 0.15s linear;
+ -o-transition: opacity 0.15s linear;
+ transition: opacity 0.15s linear;
+}
+.fade.in {
+ opacity: 1;
+}
+.collapse {
+ display: none;
+}
+.collapse.in {
+ display: block;
+}
+tr.collapse.in {
+ display: table-row;
+}
+tbody.collapse.in {
+ display: table-row-group;
+}
+.collapsing {
+ position: relative;
+ height: 0;
+ overflow: hidden;
+ -webkit-transition-property: height, visibility;
+ -o-transition-property: height, visibility;
+ transition-property: height, visibility;
+ -webkit-transition-duration: 0.35s;
+ -o-transition-duration: 0.35s;
+ transition-duration: 0.35s;
+ -webkit-transition-timing-function: ease;
+ -o-transition-timing-function: ease;
+ transition-timing-function: ease;
+}
+.caret {
+ display: inline-block;
+ width: 0;
+ height: 0;
+ margin-left: 2px;
+ vertical-align: middle;
+ border-top: 4px dashed;
+ border-top: 4px solid \9;
+ border-right: 4px solid transparent;
+ border-left: 4px solid transparent;
+}
+.dropup,
+.dropdown {
+ position: relative;
+}
+.dropdown-toggle:focus {
+ outline: 0;
+}
+.dropdown-menu {
+ position: absolute;
+ top: 100%;
+ left: 0;
+ z-index: 1000;
+ display: none;
+ float: left;
+ min-width: 160px;
+ padding: 5px 0;
+ margin: 2px 0 0;
+ list-style: none;
+ font-size: 14px;
+ text-align: left;
+ background-color: #3a3f44;
+ border: 1px solid #272b30;
+ border: 1px solid rgba(0, 0, 0, 0.15);
+ border-radius: 4px;
+ -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+ box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+ -webkit-background-clip: padding-box;
+ background-clip: padding-box;
+}
+.dropdown-menu.pull-right {
+ right: 0;
+ left: auto;
+}
+.dropdown-menu .divider {
+ height: 1px;
+ margin: 9px 0;
+ overflow: hidden;
+ background-color: #272b30;
+}
+.dropdown-menu > li > a {
+ display: block;
+ padding: 3px 20px;
+ clear: both;
+ font-weight: normal;
+ line-height: 1.42857143;
+ color: #c8c8c8;
+ white-space: nowrap;
+}
+.dropdown-menu > li > a:hover,
+.dropdown-menu > li > a:focus {
+ text-decoration: none;
+ color: #ffffff;
+ background-color: #272b30;
+}
+.dropdown-menu > .active > a,
+.dropdown-menu > .active > a:hover,
+.dropdown-menu > .active > a:focus {
+ color: #ffffff;
+ text-decoration: none;
+ outline: 0;
+ background-color: #272b30;
+}
+.dropdown-menu > .disabled > a,
+.dropdown-menu > .disabled > a:hover,
+.dropdown-menu > .disabled > a:focus {
+ color: #7a8288;
+}
+.dropdown-menu > .disabled > a:hover,
+.dropdown-menu > .disabled > a:focus {
+ text-decoration: none;
+ background-color: transparent;
+ background-image: none;
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+ cursor: not-allowed;
+}
+.open > .dropdown-menu {
+ display: block;
+}
+.open > a {
+ outline: 0;
+}
+.dropdown-menu-right {
+ left: auto;
+ right: 0;
+}
+.dropdown-menu-left {
+ left: 0;
+ right: auto;
+}
+.dropdown-header {
+ display: block;
+ padding: 3px 20px;
+ font-size: 12px;
+ line-height: 1.42857143;
+ color: #7a8288;
+ white-space: nowrap;
+}
+.dropdown-backdrop {
+ position: fixed;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ top: 0;
+ z-index: 990;
+}
+.pull-right > .dropdown-menu {
+ right: 0;
+ left: auto;
+}
+.dropup .caret,
+.navbar-fixed-bottom .dropdown .caret {
+ border-top: 0;
+ border-bottom: 4px dashed;
+ border-bottom: 4px solid \9;
+ content: "";
+}
+.dropup .dropdown-menu,
+.navbar-fixed-bottom .dropdown .dropdown-menu {
+ top: auto;
+ bottom: 100%;
+ margin-bottom: 2px;
+}
+@media (min-width: 768px) {
+ .navbar-right .dropdown-menu {
+ left: auto;
+ right: 0;
+ }
+ .navbar-right .dropdown-menu-left {
+ left: 0;
+ right: auto;
+ }
+}
+.btn-group,
+.btn-group-vertical {
+ position: relative;
+ display: inline-block;
+ vertical-align: middle;
+}
+.btn-group > .btn,
+.btn-group-vertical > .btn {
+ position: relative;
+ float: left;
+}
+.btn-group > .btn:hover,
+.btn-group-vertical > .btn:hover,
+.btn-group > .btn:focus,
+.btn-group-vertical > .btn:focus,
+.btn-group > .btn:active,
+.btn-group-vertical > .btn:active,
+.btn-group > .btn.active,
+.btn-group-vertical > .btn.active {
+ z-index: 2;
+}
+.btn-group .btn + .btn,
+.btn-group .btn + .btn-group,
+.btn-group .btn-group + .btn,
+.btn-group .btn-group + .btn-group {
+ margin-left: -1px;
+}
+.btn-toolbar {
+ margin-left: -5px;
+}
+.btn-toolbar .btn,
+.btn-toolbar .btn-group,
+.btn-toolbar .input-group {
+ float: left;
+}
+.btn-toolbar > .btn,
+.btn-toolbar > .btn-group,
+.btn-toolbar > .input-group {
+ margin-left: 5px;
+}
+.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
+ border-radius: 0;
+}
+.btn-group > .btn:first-child {
+ margin-left: 0;
+}
+.btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) {
+ border-bottom-right-radius: 0;
+ border-top-right-radius: 0;
+}
+.btn-group > .btn:last-child:not(:first-child),
+.btn-group > .dropdown-toggle:not(:first-child) {
+ border-bottom-left-radius: 0;
+ border-top-left-radius: 0;
+}
+.btn-group > .btn-group {
+ float: left;
+}
+.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn {
+ border-radius: 0;
+}
+.btn-group > .btn-group:first-child:not(:last-child) > .btn:last-child,
+.btn-group > .btn-group:first-child:not(:last-child) > .dropdown-toggle {
+ border-bottom-right-radius: 0;
+ border-top-right-radius: 0;
+}
+.btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child {
+ border-bottom-left-radius: 0;
+ border-top-left-radius: 0;
+}
+.btn-group .dropdown-toggle:active,
+.btn-group.open .dropdown-toggle {
+ outline: 0;
+}
+.btn-group > .btn + .dropdown-toggle {
+ padding-left: 8px;
+ padding-right: 8px;
+}
+.btn-group > .btn-lg + .dropdown-toggle {
+ padding-left: 12px;
+ padding-right: 12px;
+}
+.btn-group.open .dropdown-toggle {
+ -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
+ box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
+}
+.btn-group.open .dropdown-toggle.btn-link {
+ -webkit-box-shadow: none;
+ box-shadow: none;
+}
+.btn .caret {
+ margin-left: 0;
+}
+.btn-lg .caret {
+ border-width: 5px 5px 0;
+ border-bottom-width: 0;
+}
+.dropup .btn-lg .caret {
+ border-width: 0 5px 5px;
+}
+.btn-group-vertical > .btn,
+.btn-group-vertical > .btn-group,
+.btn-group-vertical > .btn-group > .btn {
+ display: block;
+ float: none;
+ width: 100%;
+ max-width: 100%;
+}
+.btn-group-vertical > .btn-group > .btn {
+ float: none;
+}
+.btn-group-vertical > .btn + .btn,
+.btn-group-vertical > .btn + .btn-group,
+.btn-group-vertical > .btn-group + .btn,
+.btn-group-vertical > .btn-group + .btn-group {
+ margin-top: -1px;
+ margin-left: 0;
+}
+.btn-group-vertical > .btn:not(:first-child):not(:last-child) {
+ border-radius: 0;
+}
+.btn-group-vertical > .btn:first-child:not(:last-child) {
+ border-top-right-radius: 4px;
+ border-top-left-radius: 4px;
+ border-bottom-right-radius: 0;
+ border-bottom-left-radius: 0;
+}
+.btn-group-vertical > .btn:last-child:not(:first-child) {
+ border-top-right-radius: 0;
+ border-top-left-radius: 0;
+ border-bottom-right-radius: 4px;
+ border-bottom-left-radius: 4px;
+}
+.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn {
+ border-radius: 0;
+}
+.btn-group-vertical > .btn-group:first-child:not(:last-child) > .btn:last-child,
+.btn-group-vertical > .btn-group:first-child:not(:last-child) > .dropdown-toggle {
+ border-bottom-right-radius: 0;
+ border-bottom-left-radius: 0;
+}
+.btn-group-vertical > .btn-group:last-child:not(:first-child) > .btn:first-child {
+ border-top-right-radius: 0;
+ border-top-left-radius: 0;
+}
+.btn-group-justified {
+ display: table;
+ width: 100%;
+ table-layout: fixed;
+ border-collapse: separate;
+}
+.btn-group-justified > .btn,
+.btn-group-justified > .btn-group {
+ float: none;
+ display: table-cell;
+ width: 1%;
+}
+.btn-group-justified > .btn-group .btn {
+ width: 100%;
+}
+.btn-group-justified > .btn-group .dropdown-menu {
+ left: auto;
+}
+[data-toggle="buttons"] > .btn input[type="radio"],
+[data-toggle="buttons"] > .btn-group > .btn input[type="radio"],
+[data-toggle="buttons"] > .btn input[type="checkbox"],
+[data-toggle="buttons"] > .btn-group > .btn input[type="checkbox"] {
+ position: absolute;
+ clip: rect(0, 0, 0, 0);
+ pointer-events: none;
+}
+.input-group {
+ position: relative;
+ display: table;
+ border-collapse: separate;
+}
+.input-group[class*="col-"] {
+ float: none;
+ padding-left: 0;
+ padding-right: 0;
+}
+.input-group .form-control {
+ position: relative;
+ z-index: 2;
+ float: left;
+ width: 100%;
+ margin-bottom: 0;
+}
+.input-group .form-control:focus {
+ z-index: 3;
+}
+.input-group-lg > .form-control,
+.input-group-lg > .input-group-addon,
+.input-group-lg > .input-group-btn > .btn {
+ height: 54px;
+ padding: 14px 16px;
+ font-size: 18px;
+ line-height: 1.3333333;
+ border-radius: 6px;
+}
+select.input-group-lg > .form-control,
+select.input-group-lg > .input-group-addon,
+select.input-group-lg > .input-group-btn > .btn {
+ height: 54px;
+ line-height: 54px;
+}
+textarea.input-group-lg > .form-control,
+textarea.input-group-lg > .input-group-addon,
+textarea.input-group-lg > .input-group-btn > .btn,
+select[multiple].input-group-lg > .form-control,
+select[multiple].input-group-lg > .input-group-addon,
+select[multiple].input-group-lg > .input-group-btn > .btn {
+ height: auto;
+}
+.input-group-sm > .form-control,
+.input-group-sm > .input-group-addon,
+.input-group-sm > .input-group-btn > .btn {
+ height: 30px;
+ padding: 5px 10px;
+ font-size: 12px;
+ line-height: 1.5;
+ border-radius: 3px;
+}
+select.input-group-sm > .form-control,
+select.input-group-sm > .input-group-addon,
+select.input-group-sm > .input-group-btn > .btn {
+ height: 30px;
+ line-height: 30px;
+}
+textarea.input-group-sm > .form-control,
+textarea.input-group-sm > .input-group-addon,
+textarea.input-group-sm > .input-group-btn > .btn,
+select[multiple].input-group-sm > .form-control,
+select[multiple].input-group-sm > .input-group-addon,
+select[multiple].input-group-sm > .input-group-btn > .btn {
+ height: auto;
+}
+.input-group-addon,
+.input-group-btn,
+.input-group .form-control {
+ display: table-cell;
+}
+.input-group-addon:not(:first-child):not(:last-child),
+.input-group-btn:not(:first-child):not(:last-child),
+.input-group .form-control:not(:first-child):not(:last-child) {
+ border-radius: 0;
+}
+.input-group-addon,
+.input-group-btn {
+ width: 1%;
+ white-space: nowrap;
+ vertical-align: middle;
+}
+.input-group-addon {
+ padding: 8px 12px;
+ font-size: 14px;
+ font-weight: normal;
+ line-height: 1;
+ color: #272b30;
+ text-align: center;
+ background-color: #999999;
+ border: 1px solid rgba(0, 0, 0, 0.6);
+ border-radius: 4px;
+}
+.input-group-addon.input-sm {
+ padding: 5px 10px;
+ font-size: 12px;
+ border-radius: 3px;
+}
+.input-group-addon.input-lg {
+ padding: 14px 16px;
+ font-size: 18px;
+ border-radius: 6px;
+}
+.input-group-addon input[type="radio"],
+.input-group-addon input[type="checkbox"] {
+ margin-top: 0;
+}
+.input-group .form-control:first-child,
+.input-group-addon:first-child,
+.input-group-btn:first-child > .btn,
+.input-group-btn:first-child > .btn-group > .btn,
+.input-group-btn:first-child > .dropdown-toggle,
+.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle),
+.input-group-btn:last-child > .btn-group:not(:last-child) > .btn {
+ border-bottom-right-radius: 0;
+ border-top-right-radius: 0;
+}
+.input-group-addon:first-child {
+ border-right: 0;
+}
+.input-group .form-control:last-child,
+.input-group-addon:last-child,
+.input-group-btn:last-child > .btn,
+.input-group-btn:last-child > .btn-group > .btn,
+.input-group-btn:last-child > .dropdown-toggle,
+.input-group-btn:first-child > .btn:not(:first-child),
+.input-group-btn:first-child > .btn-group:not(:first-child) > .btn {
+ border-bottom-left-radius: 0;
+ border-top-left-radius: 0;
+}
+.input-group-addon:last-child {
+ border-left: 0;
+}
+.input-group-btn {
+ position: relative;
+ font-size: 0;
+ white-space: nowrap;
+}
+.input-group-btn > .btn {
+ position: relative;
+}
+.input-group-btn > .btn + .btn {
+ margin-left: -1px;
+}
+.input-group-btn > .btn:hover,
+.input-group-btn > .btn:focus,
+.input-group-btn > .btn:active {
+ z-index: 2;
+}
+.input-group-btn:first-child > .btn,
+.input-group-btn:first-child > .btn-group {
+ margin-right: -1px;
+}
+.input-group-btn:last-child > .btn,
+.input-group-btn:last-child > .btn-group {
+ z-index: 2;
+ margin-left: -1px;
+}
+.nav {
+ margin-bottom: 0;
+ padding-left: 0;
+ list-style: none;
+}
+.nav > li {
+ position: relative;
+ display: block;
+}
+.nav > li > a {
+ position: relative;
+ display: block;
+ padding: 10px 15px;
+}
+.nav > li > a:hover,
+.nav > li > a:focus {
+ text-decoration: none;
+ background-color: #3e444c;
+}
+.nav > li.disabled > a {
+ color: #7a8288;
+}
+.nav > li.disabled > a:hover,
+.nav > li.disabled > a:focus {
+ color: #7a8288;
+ text-decoration: none;
+ background-color: transparent;
+ cursor: not-allowed;
+}
+.nav .open > a,
+.nav .open > a:hover,
+.nav .open > a:focus {
+ background-color: #3e444c;
+ border-color: #ffffff;
+}
+.nav .nav-divider {
+ height: 1px;
+ margin: 9px 0;
+ overflow: hidden;
+ background-color: #e5e5e5;
+}
+.nav > li > a > img {
+ max-width: none;
+}
+.nav-tabs {
+ border-bottom: 1px solid #1c1e22;
+}
+.nav-tabs > li {
+ float: left;
+ margin-bottom: -1px;
+}
+.nav-tabs > li > a {
+ margin-right: 2px;
+ line-height: 1.42857143;
+ border: 1px solid transparent;
+ border-radius: 4px 4px 0 0;
+}
+.nav-tabs > li > a:hover {
+ border-color: #1c1e22 #1c1e22 #1c1e22;
+}
+.nav-tabs > li.active > a,
+.nav-tabs > li.active > a:hover,
+.nav-tabs > li.active > a:focus {
+ color: #ffffff;
+ background-color: #3e444c;
+ border: 1px solid #1c1e22;
+ border-bottom-color: transparent;
+ cursor: default;
+}
+.nav-tabs.nav-justified {
+ width: 100%;
+ border-bottom: 0;
+}
+.nav-tabs.nav-justified > li {
+ float: none;
+}
+.nav-tabs.nav-justified > li > a {
+ text-align: center;
+ margin-bottom: 5px;
+}
+.nav-tabs.nav-justified > .dropdown .dropdown-menu {
+ top: auto;
+ left: auto;
+}
+@media (min-width: 768px) {
+ .nav-tabs.nav-justified > li {
+ display: table-cell;
+ width: 1%;
+ }
+ .nav-tabs.nav-justified > li > a {
+ margin-bottom: 0;
+ }
+}
+.nav-tabs.nav-justified > li > a {
+ margin-right: 0;
+ border-radius: 4px;
+}
+.nav-tabs.nav-justified > .active > a,
+.nav-tabs.nav-justified > .active > a:hover,
+.nav-tabs.nav-justified > .active > a:focus {
+ border: 1px solid #1c1e22;
+}
+@media (min-width: 768px) {
+ .nav-tabs.nav-justified > li > a {
+ border-bottom: 1px solid #1c1e22;
+ border-radius: 4px 4px 0 0;
+ }
+ .nav-tabs.nav-justified > .active > a,
+ .nav-tabs.nav-justified > .active > a:hover,
+ .nav-tabs.nav-justified > .active > a:focus {
+ border-bottom-color: #272b30;
+ }
+}
+.nav-pills > li {
+ float: left;
+}
+.nav-pills > li > a {
+ border-radius: 4px;
+}
+.nav-pills > li + li {
+ margin-left: 2px;
+}
+.nav-pills > li.active > a,
+.nav-pills > li.active > a:hover,
+.nav-pills > li.active > a:focus {
+ color: #ffffff;
+ background-color: transparent;
+}
+.nav-stacked > li {
+ float: none;
+}
+.nav-stacked > li + li {
+ margin-top: 2px;
+ margin-left: 0;
+}
+.nav-justified {
+ width: 100%;
+}
+.nav-justified > li {
+ float: none;
+}
+.nav-justified > li > a {
+ text-align: center;
+ margin-bottom: 5px;
+}
+.nav-justified > .dropdown .dropdown-menu {
+ top: auto;
+ left: auto;
+}
+@media (min-width: 768px) {
+ .nav-justified > li {
+ display: table-cell;
+ width: 1%;
+ }
+ .nav-justified > li > a {
+ margin-bottom: 0;
+ }
+}
+.nav-tabs-justified {
+ border-bottom: 0;
+}
+.nav-tabs-justified > li > a {
+ margin-right: 0;
+ border-radius: 4px;
+}
+.nav-tabs-justified > .active > a,
+.nav-tabs-justified > .active > a:hover,
+.nav-tabs-justified > .active > a:focus {
+ border: 1px solid #1c1e22;
+}
+@media (min-width: 768px) {
+ .nav-tabs-justified > li > a {
+ border-bottom: 1px solid #1c1e22;
+ border-radius: 4px 4px 0 0;
+ }
+ .nav-tabs-justified > .active > a,
+ .nav-tabs-justified > .active > a:hover,
+ .nav-tabs-justified > .active > a:focus {
+ border-bottom-color: #272b30;
+ }
+}
+.tab-content > .tab-pane {
+ display: none;
+}
+.tab-content > .active {
+ display: block;
+}
+.nav-tabs .dropdown-menu {
+ margin-top: -1px;
+ border-top-right-radius: 0;
+ border-top-left-radius: 0;
+}
+.navbar {
+ position: relative;
+ min-height: 50px;
+ margin-bottom: 20px;
+ border: 1px solid transparent;
+}
+@media (min-width: 768px) {
+ .navbar {
+ border-radius: 4px;
+ }
+}
+@media (min-width: 768px) {
+ .navbar-header {
+ float: left;
+ }
+}
+.navbar-collapse {
+ overflow-x: visible;
+ padding-right: 15px;
+ padding-left: 15px;
+ border-top: 1px solid transparent;
+ -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
+ box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
+ -webkit-overflow-scrolling: touch;
+}
+.navbar-collapse.in {
+ overflow-y: auto;
+}
+@media (min-width: 768px) {
+ .navbar-collapse {
+ width: auto;
+ border-top: 0;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ }
+ .navbar-collapse.collapse {
+ display: block !important;
+ height: auto !important;
+ padding-bottom: 0;
+ overflow: visible !important;
+ }
+ .navbar-collapse.in {
+ overflow-y: visible;
+ }
+ .navbar-fixed-top .navbar-collapse,
+ .navbar-static-top .navbar-collapse,
+ .navbar-fixed-bottom .navbar-collapse {
+ padding-left: 0;
+ padding-right: 0;
+ }
+}
+.navbar-fixed-top .navbar-collapse,
+.navbar-fixed-bottom .navbar-collapse {
+ max-height: 340px;
+}
+@media (max-device-width: 480px) and (orientation: landscape) {
+ .navbar-fixed-top .navbar-collapse,
+ .navbar-fixed-bottom .navbar-collapse {
+ max-height: 200px;
+ }
+}
+.container > .navbar-header,
+.container-fluid > .navbar-header,
+.container > .navbar-collapse,
+.container-fluid > .navbar-collapse {
+ margin-right: -15px;
+ margin-left: -15px;
+}
+@media (min-width: 768px) {
+ .container > .navbar-header,
+ .container-fluid > .navbar-header,
+ .container > .navbar-collapse,
+ .container-fluid > .navbar-collapse {
+ margin-right: 0;
+ margin-left: 0;
+ }
+}
+.navbar-static-top {
+ z-index: 1000;
+ border-width: 0 0 1px;
+}
+@media (min-width: 768px) {
+ .navbar-static-top {
+ border-radius: 0;
+ }
+}
+.navbar-fixed-top,
+.navbar-fixed-bottom {
+ position: fixed;
+ right: 0;
+ left: 0;
+ z-index: 1030;
+}
+@media (min-width: 768px) {
+ .navbar-fixed-top,
+ .navbar-fixed-bottom {
+ border-radius: 0;
+ }
+}
+.navbar-fixed-top {
+ top: 0;
+ border-width: 0 0 1px;
+}
+.navbar-fixed-bottom {
+ bottom: 0;
+ margin-bottom: 0;
+ border-width: 1px 0 0;
+}
+.navbar-brand {
+ float: left;
+ padding: 15px 15px;
+ font-size: 18px;
+ line-height: 20px;
+ height: 50px;
+}
+.navbar-brand:hover,
+.navbar-brand:focus {
+ text-decoration: none;
+}
+.navbar-brand > img {
+ display: block;
+}
+@media (min-width: 768px) {
+ .navbar > .container .navbar-brand,
+ .navbar > .container-fluid .navbar-brand {
+ margin-left: -15px;
+ }
+}
+.navbar-toggle {
+ position: relative;
+ float: right;
+ margin-right: 15px;
+ padding: 9px 10px;
+ margin-top: 8px;
+ margin-bottom: 8px;
+ background-color: transparent;
+ background-image: none;
+ border: 1px solid transparent;
+ border-radius: 4px;
+}
+.navbar-toggle:focus {
+ outline: 0;
+}
+.navbar-toggle .icon-bar {
+ display: block;
+ width: 22px;
+ height: 2px;
+ border-radius: 1px;
+}
+.navbar-toggle .icon-bar + .icon-bar {
+ margin-top: 4px;
+}
+@media (min-width: 768px) {
+ .navbar-toggle {
+ display: none;
+ }
+}
+.navbar-nav {
+ margin: 7.5px -15px;
+}
+.navbar-nav > li > a {
+ padding-top: 10px;
+ padding-bottom: 10px;
+ line-height: 20px;
+}
+@media (max-width: 767px) {
+ .navbar-nav .open .dropdown-menu {
+ position: static;
+ float: none;
+ width: auto;
+ margin-top: 0;
+ background-color: transparent;
+ border: 0;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ }
+ .navbar-nav .open .dropdown-menu > li > a,
+ .navbar-nav .open .dropdown-menu .dropdown-header {
+ padding: 5px 15px 5px 25px;
+ }
+ .navbar-nav .open .dropdown-menu > li > a {
+ line-height: 20px;
+ }
+ .navbar-nav .open .dropdown-menu > li > a:hover,
+ .navbar-nav .open .dropdown-menu > li > a:focus {
+ background-image: none;
+ }
+}
+@media (min-width: 768px) {
+ .navbar-nav {
+ float: left;
+ margin: 0;
+ }
+ .navbar-nav > li {
+ float: left;
+ }
+ .navbar-nav > li > a {
+ padding-top: 15px;
+ padding-bottom: 15px;
+ }
+}
+.navbar-form {
+ margin-left: -15px;
+ margin-right: -15px;
+ padding: 10px 15px;
+ border-top: 1px solid transparent;
+ border-bottom: 1px solid transparent;
+ -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
+ box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
+ margin-top: 6px;
+ margin-bottom: 6px;
+}
+@media (min-width: 768px) {
+ .navbar-form .form-group {
+ display: inline-block;
+ margin-bottom: 0;
+ vertical-align: middle;
+ }
+ .navbar-form .form-control {
+ display: inline-block;
+ width: auto;
+ vertical-align: middle;
+ }
+ .navbar-form .form-control-static {
+ display: inline-block;
+ }
+ .navbar-form .input-group {
+ display: inline-table;
+ vertical-align: middle;
+ }
+ .navbar-form .input-group .input-group-addon,
+ .navbar-form .input-group .input-group-btn,
+ .navbar-form .input-group .form-control {
+ width: auto;
+ }
+ .navbar-form .input-group > .form-control {
+ width: 100%;
+ }
+ .navbar-form .control-label {
+ margin-bottom: 0;
+ vertical-align: middle;
+ }
+ .navbar-form .radio,
+ .navbar-form .checkbox {
+ display: inline-block;
+ margin-top: 0;
+ margin-bottom: 0;
+ vertical-align: middle;
+ }
+ .navbar-form .radio label,
+ .navbar-form .checkbox label {
+ padding-left: 0;
+ }
+ .navbar-form .radio input[type="radio"],
+ .navbar-form .checkbox input[type="checkbox"] {
+ position: relative;
+ margin-left: 0;
+ }
+ .navbar-form .has-feedback .form-control-feedback {
+ top: 0;
+ }
+}
+@media (max-width: 767px) {
+ .navbar-form .form-group {
+ margin-bottom: 5px;
+ }
+ .navbar-form .form-group:last-child {
+ margin-bottom: 0;
+ }
+}
+@media (min-width: 768px) {
+ .navbar-form {
+ width: auto;
+ border: 0;
+ margin-left: 0;
+ margin-right: 0;
+ padding-top: 0;
+ padding-bottom: 0;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ }
+}
+.navbar-nav > li > .dropdown-menu {
+ margin-top: 0;
+ border-top-right-radius: 0;
+ border-top-left-radius: 0;
+}
+.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu {
+ margin-bottom: 0;
+ border-top-right-radius: 4px;
+ border-top-left-radius: 4px;
+ border-bottom-right-radius: 0;
+ border-bottom-left-radius: 0;
+}
+.navbar-btn {
+ margin-top: 6px;
+ margin-bottom: 6px;
+}
+.navbar-btn.btn-sm {
+ margin-top: 10px;
+ margin-bottom: 10px;
+}
+.navbar-btn.btn-xs {
+ margin-top: 14px;
+ margin-bottom: 14px;
+}
+.navbar-text {
+ margin-top: 15px;
+ margin-bottom: 15px;
+}
+@media (min-width: 768px) {
+ .navbar-text {
+ float: left;
+ margin-left: 15px;
+ margin-right: 15px;
+ }
+}
+@media (min-width: 768px) {
+ .navbar-left {
+ float: left !important;
+ }
+ .navbar-right {
+ float: right !important;
+ margin-right: -15px;
+ }
+ .navbar-right ~ .navbar-right {
+ margin-right: 0;
+ }
+}
+.navbar-default {
+ background-color: #3a3f44;
+ border-color: #2b2e32;
+}
+.navbar-default .navbar-brand {
+ color: #c8c8c8;
+}
+.navbar-default .navbar-brand:hover,
+.navbar-default .navbar-brand:focus {
+ color: #ffffff;
+ background-color: none;
+}
+.navbar-default .navbar-text {
+ color: #c8c8c8;
+}
+.navbar-default .navbar-nav > li > a {
+ color: #c8c8c8;
+}
+.navbar-default .navbar-nav > li > a:hover,
+.navbar-default .navbar-nav > li > a:focus {
+ color: #ffffff;
+ background-color: #272b2e;
+}
+.navbar-default .navbar-nav > .active > a,
+.navbar-default .navbar-nav > .active > a:hover,
+.navbar-default .navbar-nav > .active > a:focus {
+ color: #ffffff;
+ background-color: #272b2e;
+}
+.navbar-default .navbar-nav > .disabled > a,
+.navbar-default .navbar-nav > .disabled > a:hover,
+.navbar-default .navbar-nav > .disabled > a:focus {
+ color: #cccccc;
+ background-color: transparent;
+}
+.navbar-default .navbar-toggle {
+ border-color: #272b2e;
+}
+.navbar-default .navbar-toggle:hover,
+.navbar-default .navbar-toggle:focus {
+ background-color: #272b2e;
+}
+.navbar-default .navbar-toggle .icon-bar {
+ background-color: #c8c8c8;
+}
+.navbar-default .navbar-collapse,
+.navbar-default .navbar-form {
+ border-color: #2b2e32;
+}
+.navbar-default .navbar-nav > .open > a,
+.navbar-default .navbar-nav > .open > a:hover,
+.navbar-default .navbar-nav > .open > a:focus {
+ background-color: #272b2e;
+ color: #ffffff;
+}
+@media (max-width: 767px) {
+ .navbar-default .navbar-nav .open .dropdown-menu > li > a {
+ color: #c8c8c8;
+ }
+ .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
+ .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
+ color: #ffffff;
+ background-color: #272b2e;
+ }
+ .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
+ .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
+ .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
+ color: #ffffff;
+ background-color: #272b2e;
+ }
+ .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a,
+ .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover,
+ .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus {
+ color: #cccccc;
+ background-color: transparent;
+ }
+}
+.navbar-default .navbar-link {
+ color: #c8c8c8;
+}
+.navbar-default .navbar-link:hover {
+ color: #ffffff;
+}
+.navbar-default .btn-link {
+ color: #c8c8c8;
+}
+.navbar-default .btn-link:hover,
+.navbar-default .btn-link:focus {
+ color: #ffffff;
+}
+.navbar-default .btn-link[disabled]:hover,
+fieldset[disabled] .navbar-default .btn-link:hover,
+.navbar-default .btn-link[disabled]:focus,
+fieldset[disabled] .navbar-default .btn-link:focus {
+ color: #cccccc;
+}
+.navbar-inverse {
+ background-color: #7a8288;
+ border-color: #62686d;
+}
+.navbar-inverse .navbar-brand {
+ color: #cccccc;
+}
+.navbar-inverse .navbar-brand:hover,
+.navbar-inverse .navbar-brand:focus {
+ color: #ffffff;
+ background-color: none;
+}
+.navbar-inverse .navbar-text {
+ color: #cccccc;
+}
+.navbar-inverse .navbar-nav > li > a {
+ color: #cccccc;
+}
+.navbar-inverse .navbar-nav > li > a:hover,
+.navbar-inverse .navbar-nav > li > a:focus {
+ color: #ffffff;
+ background-color: #5d6368;
+}
+.navbar-inverse .navbar-nav > .active > a,
+.navbar-inverse .navbar-nav > .active > a:hover,
+.navbar-inverse .navbar-nav > .active > a:focus {
+ color: #ffffff;
+ background-color: #5d6368;
+}
+.navbar-inverse .navbar-nav > .disabled > a,
+.navbar-inverse .navbar-nav > .disabled > a:hover,
+.navbar-inverse .navbar-nav > .disabled > a:focus {
+ color: #cccccc;
+ background-color: transparent;
+}
+.navbar-inverse .navbar-toggle {
+ border-color: #5d6368;
+}
+.navbar-inverse .navbar-toggle:hover,
+.navbar-inverse .navbar-toggle:focus {
+ background-color: #5d6368;
+}
+.navbar-inverse .navbar-toggle .icon-bar {
+ background-color: #ffffff;
+}
+.navbar-inverse .navbar-collapse,
+.navbar-inverse .navbar-form {
+ border-color: #697075;
+}
+.navbar-inverse .navbar-nav > .open > a,
+.navbar-inverse .navbar-nav > .open > a:hover,
+.navbar-inverse .navbar-nav > .open > a:focus {
+ background-color: #5d6368;
+ color: #ffffff;
+}
+@media (max-width: 767px) {
+ .navbar-inverse .navbar-nav .open .dropdown-menu > .dropdown-header {
+ border-color: #62686d;
+ }
+ .navbar-inverse .navbar-nav .open .dropdown-menu .divider {
+ background-color: #62686d;
+ }
+ .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
+ color: #cccccc;
+ }
+ .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover,
+ .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus {
+ color: #ffffff;
+ background-color: #5d6368;
+ }
+ .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a,
+ .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:hover,
+ .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:focus {
+ color: #ffffff;
+ background-color: #5d6368;
+ }
+ .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a,
+ .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:hover,
+ .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:focus {
+ color: #cccccc;
+ background-color: transparent;
+ }
+}
+.navbar-inverse .navbar-link {
+ color: #cccccc;
+}
+.navbar-inverse .navbar-link:hover {
+ color: #ffffff;
+}
+.navbar-inverse .btn-link {
+ color: #cccccc;
+}
+.navbar-inverse .btn-link:hover,
+.navbar-inverse .btn-link:focus {
+ color: #ffffff;
+}
+.navbar-inverse .btn-link[disabled]:hover,
+fieldset[disabled] .navbar-inverse .btn-link:hover,
+.navbar-inverse .btn-link[disabled]:focus,
+fieldset[disabled] .navbar-inverse .btn-link:focus {
+ color: #cccccc;
+}
+.breadcrumb {
+ padding: 8px 15px;
+ margin-bottom: 20px;
+ list-style: none;
+ background-color: transparent;
+ border-radius: 4px;
+}
+.breadcrumb > li {
+ display: inline-block;
+}
+.breadcrumb > li + li:before {
+ content: "/\00a0";
+ padding: 0 5px;
+ color: #cccccc;
+}
+.breadcrumb > .active {
+ color: #7a8288;
+}
+.pagination {
+ display: inline-block;
+ padding-left: 0;
+ margin: 20px 0;
+ border-radius: 4px;
+}
+.pagination > li {
+ display: inline;
+}
+.pagination > li > a,
+.pagination > li > span {
+ position: relative;
+ float: left;
+ padding: 8px 12px;
+ line-height: 1.42857143;
+ text-decoration: none;
+ color: #ffffff;
+ background-color: #3a3f44;
+ border: 1px solid rgba(0, 0, 0, 0.6);
+ margin-left: -1px;
+}
+.pagination > li:first-child > a,
+.pagination > li:first-child > span {
+ margin-left: 0;
+ border-bottom-left-radius: 4px;
+ border-top-left-radius: 4px;
+}
+.pagination > li:last-child > a,
+.pagination > li:last-child > span {
+ border-bottom-right-radius: 4px;
+ border-top-right-radius: 4px;
+}
+.pagination > li > a:hover,
+.pagination > li > span:hover,
+.pagination > li > a:focus,
+.pagination > li > span:focus {
+ z-index: 2;
+ color: #ffffff;
+ background-color: transparent;
+ border-color: rgba(0, 0, 0, 0.6);
+}
+.pagination > .active > a,
+.pagination > .active > span,
+.pagination > .active > a:hover,
+.pagination > .active > span:hover,
+.pagination > .active > a:focus,
+.pagination > .active > span:focus {
+ z-index: 3;
+ color: #ffffff;
+ background-color: #232628;
+ border-color: rgba(0, 0, 0, 0.6);
+ cursor: default;
+}
+.pagination > .disabled > span,
+.pagination > .disabled > span:hover,
+.pagination > .disabled > span:focus,
+.pagination > .disabled > a,
+.pagination > .disabled > a:hover,
+.pagination > .disabled > a:focus {
+ color: #7a8288;
+ background-color: #ffffff;
+ border-color: rgba(0, 0, 0, 0.6);
+ cursor: not-allowed;
+}
+.pagination-lg > li > a,
+.pagination-lg > li > span {
+ padding: 14px 16px;
+ font-size: 18px;
+ line-height: 1.3333333;
+}
+.pagination-lg > li:first-child > a,
+.pagination-lg > li:first-child > span {
+ border-bottom-left-radius: 6px;
+ border-top-left-radius: 6px;
+}
+.pagination-lg > li:last-child > a,
+.pagination-lg > li:last-child > span {
+ border-bottom-right-radius: 6px;
+ border-top-right-radius: 6px;
+}
+.pagination-sm > li > a,
+.pagination-sm > li > span {
+ padding: 5px 10px;
+ font-size: 12px;
+ line-height: 1.5;
+}
+.pagination-sm > li:first-child > a,
+.pagination-sm > li:first-child > span {
+ border-bottom-left-radius: 3px;
+ border-top-left-radius: 3px;
+}
+.pagination-sm > li:last-child > a,
+.pagination-sm > li:last-child > span {
+ border-bottom-right-radius: 3px;
+ border-top-right-radius: 3px;
+}
+.pager {
+ padding-left: 0;
+ margin: 20px 0;
+ list-style: none;
+ text-align: center;
+}
+.pager li {
+ display: inline;
+}
+.pager li > a,
+.pager li > span {
+ display: inline-block;
+ padding: 5px 14px;
+ background-color: #3a3f44;
+ border: 1px solid rgba(0, 0, 0, 0.6);
+ border-radius: 15px;
+}
+.pager li > a:hover,
+.pager li > a:focus {
+ text-decoration: none;
+ background-color: transparent;
+}
+.pager .next > a,
+.pager .next > span {
+ float: right;
+}
+.pager .previous > a,
+.pager .previous > span {
+ float: left;
+}
+.pager .disabled > a,
+.pager .disabled > a:hover,
+.pager .disabled > a:focus,
+.pager .disabled > span {
+ color: #7a8288;
+ background-color: #3a3f44;
+ cursor: not-allowed;
+}
+.label {
+ display: inline;
+ padding: .2em .6em .3em;
+ font-size: 75%;
+ font-weight: bold;
+ line-height: 1;
+ color: #ffffff;
+ text-align: center;
+ white-space: nowrap;
+ vertical-align: baseline;
+ border-radius: .25em;
+}
+a.label:hover,
+a.label:focus {
+ color: #ffffff;
+ text-decoration: none;
+ cursor: pointer;
+}
+.label:empty {
+ display: none;
+}
+.btn .label {
+ position: relative;
+ top: -1px;
+}
+.label-default {
+ background-color: #3a3f44;
+}
+.label-default[href]:hover,
+.label-default[href]:focus {
+ background-color: #232628;
+}
+.label-primary {
+ background-color: #7a8288;
+}
+.label-primary[href]:hover,
+.label-primary[href]:focus {
+ background-color: #62686d;
+}
+.label-success {
+ background-color: #62c462;
+}
+.label-success[href]:hover,
+.label-success[href]:focus {
+ background-color: #42b142;
+}
+.label-info {
+ background-color: #5bc0de;
+}
+.label-info[href]:hover,
+.label-info[href]:focus {
+ background-color: #31b0d5;
+}
+.label-warning {
+ background-color: #f89406;
+}
+.label-warning[href]:hover,
+.label-warning[href]:focus {
+ background-color: #c67605;
+}
+.label-danger {
+ background-color: #ee5f5b;
+}
+.label-danger[href]:hover,
+.label-danger[href]:focus {
+ background-color: #e9322d;
+}
+.badge {
+ display: inline-block;
+ min-width: 10px;
+ padding: 3px 7px;
+ font-size: 12px;
+ font-weight: bold;
+ color: #ffffff;
+ line-height: 1;
+ vertical-align: middle;
+ white-space: nowrap;
+ text-align: center;
+ background-color: #7a8288;
+ border-radius: 10px;
+}
+.badge:empty {
+ display: none;
+}
+.btn .badge {
+ position: relative;
+ top: -1px;
+}
+.btn-xs .badge,
+.btn-group-xs > .btn .badge {
+ top: 0;
+ padding: 1px 5px;
+}
+a.badge:hover,
+a.badge:focus {
+ color: #ffffff;
+ text-decoration: none;
+ cursor: pointer;
+}
+.list-group-item.active > .badge,
+.nav-pills > .active > a > .badge {
+ color: #ffffff;
+ background-color: #7a8288;
+}
+.list-group-item > .badge {
+ float: right;
+}
+.list-group-item > .badge + .badge {
+ margin-right: 5px;
+}
+.nav-pills > li > a > .badge {
+ margin-left: 3px;
+}
+.jumbotron {
+ padding-top: 30px;
+ padding-bottom: 30px;
+ margin-bottom: 30px;
+ color: inherit;
+ background-color: #1c1e22;
+}
+.jumbotron h1,
+.jumbotron .h1 {
+ color: inherit;
+}
+.jumbotron p {
+ margin-bottom: 15px;
+ font-size: 21px;
+ font-weight: 200;
+}
+.jumbotron > hr {
+ border-top-color: #050506;
+}
+.container .jumbotron,
+.container-fluid .jumbotron {
+ border-radius: 6px;
+ padding-left: 15px;
+ padding-right: 15px;
+}
+.jumbotron .container {
+ max-width: 100%;
+}
+@media screen and (min-width: 768px) {
+ .jumbotron {
+ padding-top: 48px;
+ padding-bottom: 48px;
+ }
+ .container .jumbotron,
+ .container-fluid .jumbotron {
+ padding-left: 60px;
+ padding-right: 60px;
+ }
+ .jumbotron h1,
+ .jumbotron .h1 {
+ font-size: 63px;
+ }
+}
+.thumbnail {
+ display: block;
+ padding: 4px;
+ margin-bottom: 20px;
+ line-height: 1.42857143;
+ background-color: #1c1e22;
+ border: 1px solid #0c0d0e;
+ border-radius: 4px;
+ -webkit-transition: border 0.2s ease-in-out;
+ -o-transition: border 0.2s ease-in-out;
+ transition: border 0.2s ease-in-out;
+}
+.thumbnail > img,
+.thumbnail a > img {
+ margin-left: auto;
+ margin-right: auto;
+}
+a.thumbnail:hover,
+a.thumbnail:focus,
+a.thumbnail.active {
+ border-color: #ffffff;
+}
+.thumbnail .caption {
+ padding: 9px;
+ color: #c8c8c8;
+}
+.alert {
+ padding: 15px;
+ margin-bottom: 20px;
+ border: 1px solid transparent;
+ border-radius: 4px;
+}
+.alert h4 {
+ margin-top: 0;
+ color: inherit;
+}
+.alert .alert-link {
+ font-weight: bold;
+}
+.alert > p,
+.alert > ul {
+ margin-bottom: 0;
+}
+.alert > p + p {
+ margin-top: 5px;
+}
+.alert-dismissable,
+.alert-dismissible {
+ padding-right: 35px;
+}
+.alert-dismissable .close,
+.alert-dismissible .close {
+ position: relative;
+ top: -2px;
+ right: -21px;
+ color: inherit;
+}
+.alert-success {
+ background-color: #62c462;
+ border-color: #62bd4f;
+ color: #ffffff;
+}
+.alert-success hr {
+ border-top-color: #55b142;
+}
+.alert-success .alert-link {
+ color: #e6e6e6;
+}
+.alert-info {
+ background-color: #5bc0de;
+ border-color: #3dced8;
+ color: #ffffff;
+}
+.alert-info hr {
+ border-top-color: #2ac7d2;
+}
+.alert-info .alert-link {
+ color: #e6e6e6;
+}
+.alert-warning {
+ background-color: #f89406;
+ border-color: #e96506;
+ color: #ffffff;
+}
+.alert-warning hr {
+ border-top-color: #d05a05;
+}
+.alert-warning .alert-link {
+ color: #e6e6e6;
+}
+.alert-danger {
+ background-color: #ee5f5b;
+ border-color: #ed4d63;
+ color: #ffffff;
+}
+.alert-danger hr {
+ border-top-color: #ea364f;
+}
+.alert-danger .alert-link {
+ color: #e6e6e6;
+}
+@-webkit-keyframes progress-bar-stripes {
+ from {
+ background-position: 40px 0;
+ }
+ to {
+ background-position: 0 0;
+ }
+}
+@-o-keyframes progress-bar-stripes {
+ from {
+ background-position: 40px 0;
+ }
+ to {
+ background-position: 0 0;
+ }
+}
+@keyframes progress-bar-stripes {
+ from {
+ background-position: 40px 0;
+ }
+ to {
+ background-position: 0 0;
+ }
+}
+.progress {
+ overflow: hidden;
+ height: 20px;
+ margin-bottom: 20px;
+ background-color: #1c1e22;
+ border-radius: 4px;
+ -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
+ box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
+}
+.progress-bar {
+ float: left;
+ width: 0%;
+ height: 100%;
+ font-size: 12px;
+ line-height: 20px;
+ color: #ffffff;
+ text-align: center;
+ background-color: #7a8288;
+ -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
+ box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
+ -webkit-transition: width 0.6s ease;
+ -o-transition: width 0.6s ease;
+ transition: width 0.6s ease;
+}
+.progress-striped .progress-bar,
+.progress-bar-striped {
+ background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+ background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+ background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+ -webkit-background-size: 40px 40px;
+ background-size: 40px 40px;
+}
+.progress.active .progress-bar,
+.progress-bar.active {
+ -webkit-animation: progress-bar-stripes 2s linear infinite;
+ -o-animation: progress-bar-stripes 2s linear infinite;
+ animation: progress-bar-stripes 2s linear infinite;
+}
+.progress-bar-success {
+ background-color: #62c462;
+}
+.progress-striped .progress-bar-success {
+ background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+ background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+ background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+}
+.progress-bar-info {
+ background-color: #5bc0de;
+}
+.progress-striped .progress-bar-info {
+ background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+ background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+ background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+}
+.progress-bar-warning {
+ background-color: #f89406;
+}
+.progress-striped .progress-bar-warning {
+ background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+ background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+ background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+}
+.progress-bar-danger {
+ background-color: #ee5f5b;
+}
+.progress-striped .progress-bar-danger {
+ background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+ background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+ background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+}
+.media {
+ margin-top: 15px;
+}
+.media:first-child {
+ margin-top: 0;
+}
+.media,
+.media-body {
+ zoom: 1;
+ overflow: hidden;
+}
+.media-body {
+ width: 10000px;
+}
+.media-object {
+ display: block;
+}
+.media-object.img-thumbnail {
+ max-width: none;
+}
+.media-right,
+.media > .pull-right {
+ padding-left: 10px;
+}
+.media-left,
+.media > .pull-left {
+ padding-right: 10px;
+}
+.media-left,
+.media-right,
+.media-body {
+ display: table-cell;
+ vertical-align: top;
+}
+.media-middle {
+ vertical-align: middle;
+}
+.media-bottom {
+ vertical-align: bottom;
+}
+.media-heading {
+ margin-top: 0;
+ margin-bottom: 5px;
+}
+.media-list {
+ padding-left: 0;
+ list-style: none;
+}
+.list-group {
+ margin-bottom: 20px;
+ padding-left: 0;
+}
+.list-group-item {
+ position: relative;
+ display: block;
+ padding: 10px 15px;
+ margin-bottom: -1px;
+ background-color: #32383e;
+ border: 1px solid rgba(0, 0, 0, 0.6);
+}
+.list-group-item:first-child {
+ border-top-right-radius: 4px;
+ border-top-left-radius: 4px;
+}
+.list-group-item:last-child {
+ margin-bottom: 0;
+ border-bottom-right-radius: 4px;
+ border-bottom-left-radius: 4px;
+}
+a.list-group-item,
+button.list-group-item {
+ color: #c8c8c8;
+}
+a.list-group-item .list-group-item-heading,
+button.list-group-item .list-group-item-heading {
+ color: #ffffff;
+}
+a.list-group-item:hover,
+button.list-group-item:hover,
+a.list-group-item:focus,
+button.list-group-item:focus {
+ text-decoration: none;
+ color: #c8c8c8;
+ background-color: #3e444c;
+}
+button.list-group-item {
+ width: 100%;
+ text-align: left;
+}
+.list-group-item.disabled,
+.list-group-item.disabled:hover,
+.list-group-item.disabled:focus {
+ background-color: #999999;
+ color: #7a8288;
+ cursor: not-allowed;
+}
+.list-group-item.disabled .list-group-item-heading,
+.list-group-item.disabled:hover .list-group-item-heading,
+.list-group-item.disabled:focus .list-group-item-heading {
+ color: inherit;
+}
+.list-group-item.disabled .list-group-item-text,
+.list-group-item.disabled:hover .list-group-item-text,
+.list-group-item.disabled:focus .list-group-item-text {
+ color: #7a8288;
+}
+.list-group-item.active,
+.list-group-item.active:hover,
+.list-group-item.active:focus {
+ z-index: 2;
+ color: #ffffff;
+ background-color: #3e444c;
+ border-color: rgba(0, 0, 0, 0.6);
+}
+.list-group-item.active .list-group-item-heading,
+.list-group-item.active:hover .list-group-item-heading,
+.list-group-item.active:focus .list-group-item-heading,
+.list-group-item.active .list-group-item-heading > small,
+.list-group-item.active:hover .list-group-item-heading > small,
+.list-group-item.active:focus .list-group-item-heading > small,
+.list-group-item.active .list-group-item-heading > .small,
+.list-group-item.active:hover .list-group-item-heading > .small,
+.list-group-item.active:focus .list-group-item-heading > .small {
+ color: inherit;
+}
+.list-group-item.active .list-group-item-text,
+.list-group-item.active:hover .list-group-item-text,
+.list-group-item.active:focus .list-group-item-text {
+ color: #a2aab4;
+}
+.list-group-item-success {
+ color: #ffffff;
+ background-color: #62c462;
+}
+a.list-group-item-success,
+button.list-group-item-success {
+ color: #ffffff;
+}
+a.list-group-item-success .list-group-item-heading,
+button.list-group-item-success .list-group-item-heading {
+ color: inherit;
+}
+a.list-group-item-success:hover,
+button.list-group-item-success:hover,
+a.list-group-item-success:focus,
+button.list-group-item-success:focus {
+ color: #ffffff;
+ background-color: #4fbd4f;
+}
+a.list-group-item-success.active,
+button.list-group-item-success.active,
+a.list-group-item-success.active:hover,
+button.list-group-item-success.active:hover,
+a.list-group-item-success.active:focus,
+button.list-group-item-success.active:focus {
+ color: #fff;
+ background-color: #ffffff;
+ border-color: #ffffff;
+}
+.list-group-item-info {
+ color: #ffffff;
+ background-color: #5bc0de;
+}
+a.list-group-item-info,
+button.list-group-item-info {
+ color: #ffffff;
+}
+a.list-group-item-info .list-group-item-heading,
+button.list-group-item-info .list-group-item-heading {
+ color: inherit;
+}
+a.list-group-item-info:hover,
+button.list-group-item-info:hover,
+a.list-group-item-info:focus,
+button.list-group-item-info:focus {
+ color: #ffffff;
+ background-color: #46b8da;
+}
+a.list-group-item-info.active,
+button.list-group-item-info.active,
+a.list-group-item-info.active:hover,
+button.list-group-item-info.active:hover,
+a.list-group-item-info.active:focus,
+button.list-group-item-info.active:focus {
+ color: #fff;
+ background-color: #ffffff;
+ border-color: #ffffff;
+}
+.list-group-item-warning {
+ color: #ffffff;
+ background-color: #f89406;
+}
+a.list-group-item-warning,
+button.list-group-item-warning {
+ color: #ffffff;
+}
+a.list-group-item-warning .list-group-item-heading,
+button.list-group-item-warning .list-group-item-heading {
+ color: inherit;
+}
+a.list-group-item-warning:hover,
+button.list-group-item-warning:hover,
+a.list-group-item-warning:focus,
+button.list-group-item-warning:focus {
+ color: #ffffff;
+ background-color: #df8505;
+}
+a.list-group-item-warning.active,
+button.list-group-item-warning.active,
+a.list-group-item-warning.active:hover,
+button.list-group-item-warning.active:hover,
+a.list-group-item-warning.active:focus,
+button.list-group-item-warning.active:focus {
+ color: #fff;
+ background-color: #ffffff;
+ border-color: #ffffff;
+}
+.list-group-item-danger {
+ color: #ffffff;
+ background-color: #ee5f5b;
+}
+a.list-group-item-danger,
+button.list-group-item-danger {
+ color: #ffffff;
+}
+a.list-group-item-danger .list-group-item-heading,
+button.list-group-item-danger .list-group-item-heading {
+ color: inherit;
+}
+a.list-group-item-danger:hover,
+button.list-group-item-danger:hover,
+a.list-group-item-danger:focus,
+button.list-group-item-danger:focus {
+ color: #ffffff;
+ background-color: #ec4844;
+}
+a.list-group-item-danger.active,
+button.list-group-item-danger.active,
+a.list-group-item-danger.active:hover,
+button.list-group-item-danger.active:hover,
+a.list-group-item-danger.active:focus,
+button.list-group-item-danger.active:focus {
+ color: #fff;
+ background-color: #ffffff;
+ border-color: #ffffff;
+}
+.list-group-item-heading {
+ margin-top: 0;
+ margin-bottom: 5px;
+}
+.list-group-item-text {
+ margin-bottom: 0;
+ line-height: 1.3;
+}
+.panel {
+ margin-bottom: 20px;
+ background-color: #2e3338;
+ border: 1px solid transparent;
+ border-radius: 4px;
+ -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
+ box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
+}
+.panel-body {
+ padding: 15px;
+}
+.panel-heading {
+ padding: 10px 15px;
+ border-bottom: 1px solid transparent;
+ border-top-right-radius: 3px;
+ border-top-left-radius: 3px;
+}
+.panel-heading > .dropdown .dropdown-toggle {
+ color: inherit;
+}
+.panel-title {
+ margin-top: 0;
+ margin-bottom: 0;
+ font-size: 16px;
+ color: inherit;
+}
+.panel-title > a,
+.panel-title > small,
+.panel-title > .small,
+.panel-title > small > a,
+.panel-title > .small > a {
+ color: inherit;
+}
+.panel-footer {
+ padding: 10px 15px;
+ background-color: #3e444c;
+ border-top: 1px solid rgba(0, 0, 0, 0.6);
+ border-bottom-right-radius: 3px;
+ border-bottom-left-radius: 3px;
+}
+.panel > .list-group,
+.panel > .panel-collapse > .list-group {
+ margin-bottom: 0;
+}
+.panel > .list-group .list-group-item,
+.panel > .panel-collapse > .list-group .list-group-item {
+ border-width: 1px 0;
+ border-radius: 0;
+}
+.panel > .list-group:first-child .list-group-item:first-child,
+.panel > .panel-collapse > .list-group:first-child .list-group-item:first-child {
+ border-top: 0;
+ border-top-right-radius: 3px;
+ border-top-left-radius: 3px;
+}
+.panel > .list-group:last-child .list-group-item:last-child,
+.panel > .panel-collapse > .list-group:last-child .list-group-item:last-child {
+ border-bottom: 0;
+ border-bottom-right-radius: 3px;
+ border-bottom-left-radius: 3px;
+}
+.panel > .panel-heading + .panel-collapse > .list-group .list-group-item:first-child {
+ border-top-right-radius: 0;
+ border-top-left-radius: 0;
+}
+.panel-heading + .list-group .list-group-item:first-child {
+ border-top-width: 0;
+}
+.list-group + .panel-footer {
+ border-top-width: 0;
+}
+.panel > .table,
+.panel > .table-responsive > .table,
+.panel > .panel-collapse > .table {
+ margin-bottom: 0;
+}
+.panel > .table caption,
+.panel > .table-responsive > .table caption,
+.panel > .panel-collapse > .table caption {
+ padding-left: 15px;
+ padding-right: 15px;
+}
+.panel > .table:first-child,
+.panel > .table-responsive:first-child > .table:first-child {
+ border-top-right-radius: 3px;
+ border-top-left-radius: 3px;
+}
+.panel > .table:first-child > thead:first-child > tr:first-child,
+.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child,
+.panel > .table:first-child > tbody:first-child > tr:first-child,
+.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child {
+ border-top-left-radius: 3px;
+ border-top-right-radius: 3px;
+}
+.panel > .table:first-child > thead:first-child > tr:first-child td:first-child,
+.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:first-child,
+.panel > .table:first-child > tbody:first-child > tr:first-child td:first-child,
+.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:first-child,
+.panel > .table:first-child > thead:first-child > tr:first-child th:first-child,
+.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:first-child,
+.panel > .table:first-child > tbody:first-child > tr:first-child th:first-child,
+.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:first-child {
+ border-top-left-radius: 3px;
+}
+.panel > .table:first-child > thead:first-child > tr:first-child td:last-child,
+.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:last-child,
+.panel > .table:first-child > tbody:first-child > tr:first-child td:last-child,
+.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:last-child,
+.panel > .table:first-child > thead:first-child > tr:first-child th:last-child,
+.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:last-child,
+.panel > .table:first-child > tbody:first-child > tr:first-child th:last-child,
+.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:last-child {
+ border-top-right-radius: 3px;
+}
+.panel > .table:last-child,
+.panel > .table-responsive:last-child > .table:last-child {
+ border-bottom-right-radius: 3px;
+ border-bottom-left-radius: 3px;
+}
+.panel > .table:last-child > tbody:last-child > tr:last-child,
+.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child,
+.panel > .table:last-child > tfoot:last-child > tr:last-child,
+.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child {
+ border-bottom-left-radius: 3px;
+ border-bottom-right-radius: 3px;
+}
+.panel > .table:last-child > tbody:last-child > tr:last-child td:first-child,
+.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:first-child,
+.panel > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
+.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
+.panel > .table:last-child > tbody:last-child > tr:last-child th:first-child,
+.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:first-child,
+.panel > .table:last-child > tfoot:last-child > tr:last-child th:first-child,
+.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:first-child {
+ border-bottom-left-radius: 3px;
+}
+.panel > .table:last-child > tbody:last-child > tr:last-child td:last-child,
+.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:last-child,
+.panel > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
+.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
+.panel > .table:last-child > tbody:last-child > tr:last-child th:last-child,
+.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:last-child,
+.panel > .table:last-child > tfoot:last-child > tr:last-child th:last-child,
+.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:last-child {
+ border-bottom-right-radius: 3px;
+}
+.panel > .panel-body + .table,
+.panel > .panel-body + .table-responsive,
+.panel > .table + .panel-body,
+.panel > .table-responsive + .panel-body {
+ border-top: 1px solid #1c1e22;
+}
+.panel > .table > tbody:first-child > tr:first-child th,
+.panel > .table > tbody:first-child > tr:first-child td {
+ border-top: 0;
+}
+.panel > .table-bordered,
+.panel > .table-responsive > .table-bordered {
+ border: 0;
+}
+.panel > .table-bordered > thead > tr > th:first-child,
+.panel > .table-responsive > .table-bordered > thead > tr > th:first-child,
+.panel > .table-bordered > tbody > tr > th:first-child,
+.panel > .table-responsive > .table-bordered > tbody > tr > th:first-child,
+.panel > .table-bordered > tfoot > tr > th:first-child,
+.panel > .table-responsive > .table-bordered > tfoot > tr > th:first-child,
+.panel > .table-bordered > thead > tr > td:first-child,
+.panel > .table-responsive > .table-bordered > thead > tr > td:first-child,
+.panel > .table-bordered > tbody > tr > td:first-child,
+.panel > .table-responsive > .table-bordered > tbody > tr > td:first-child,
+.panel > .table-bordered > tfoot > tr > td:first-child,
+.panel > .table-responsive > .table-bordered > tfoot > tr > td:first-child {
+ border-left: 0;
+}
+.panel > .table-bordered > thead > tr > th:last-child,
+.panel > .table-responsive > .table-bordered > thead > tr > th:last-child,
+.panel > .table-bordered > tbody > tr > th:last-child,
+.panel > .table-responsive > .table-bordered > tbody > tr > th:last-child,
+.panel > .table-bordered > tfoot > tr > th:last-child,
+.panel > .table-responsive > .table-bordered > tfoot > tr > th:last-child,
+.panel > .table-bordered > thead > tr > td:last-child,
+.panel > .table-responsive > .table-bordered > thead > tr > td:last-child,
+.panel > .table-bordered > tbody > tr > td:last-child,
+.panel > .table-responsive > .table-bordered > tbody > tr > td:last-child,
+.panel > .table-bordered > tfoot > tr > td:last-child,
+.panel > .table-responsive > .table-bordered > tfoot > tr > td:last-child {
+ border-right: 0;
+}
+.panel > .table-bordered > thead > tr:first-child > td,
+.panel > .table-responsive > .table-bordered > thead > tr:first-child > td,
+.panel > .table-bordered > tbody > tr:first-child > td,
+.panel > .table-responsive > .table-bordered > tbody > tr:first-child > td,
+.panel > .table-bordered > thead > tr:first-child > th,
+.panel > .table-responsive > .table-bordered > thead > tr:first-child > th,
+.panel > .table-bordered > tbody > tr:first-child > th,
+.panel > .table-responsive > .table-bordered > tbody > tr:first-child > th {
+ border-bottom: 0;
+}
+.panel > .table-bordered > tbody > tr:last-child > td,
+.panel > .table-responsive > .table-bordered > tbody > tr:last-child > td,
+.panel > .table-bordered > tfoot > tr:last-child > td,
+.panel > .table-responsive > .table-bordered > tfoot > tr:last-child > td,
+.panel > .table-bordered > tbody > tr:last-child > th,
+.panel > .table-responsive > .table-bordered > tbody > tr:last-child > th,
+.panel > .table-bordered > tfoot > tr:last-child > th,
+.panel > .table-responsive > .table-bordered > tfoot > tr:last-child > th {
+ border-bottom: 0;
+}
+.panel > .table-responsive {
+ border: 0;
+ margin-bottom: 0;
+}
+.panel-group {
+ margin-bottom: 20px;
+}
+.panel-group .panel {
+ margin-bottom: 0;
+ border-radius: 4px;
+}
+.panel-group .panel + .panel {
+ margin-top: 5px;
+}
+.panel-group .panel-heading {
+ border-bottom: 0;
+}
+.panel-group .panel-heading + .panel-collapse > .panel-body,
+.panel-group .panel-heading + .panel-collapse > .list-group {
+ border-top: 1px solid rgba(0, 0, 0, 0.6);
+}
+.panel-group .panel-footer {
+ border-top: 0;
+}
+.panel-group .panel-footer + .panel-collapse .panel-body {
+ border-bottom: 1px solid rgba(0, 0, 0, 0.6);
+}
+.panel-default {
+ border-color: rgba(0, 0, 0, 0.6);
+}
+.panel-default > .panel-heading {
+ color: #c8c8c8;
+ background-color: #3e444c;
+ border-color: rgba(0, 0, 0, 0.6);
+}
+.panel-default > .panel-heading + .panel-collapse > .panel-body {
+ border-top-color: rgba(0, 0, 0, 0.6);
+}
+.panel-default > .panel-heading .badge {
+ color: #3e444c;
+ background-color: #c8c8c8;
+}
+.panel-default > .panel-footer + .panel-collapse > .panel-body {
+ border-bottom-color: rgba(0, 0, 0, 0.6);
+}
+.panel-primary {
+ border-color: rgba(0, 0, 0, 0.6);
+}
+.panel-primary > .panel-heading {
+ color: #ffffff;
+ background-color: #7a8288;
+ border-color: rgba(0, 0, 0, 0.6);
+}
+.panel-primary > .panel-heading + .panel-collapse > .panel-body {
+ border-top-color: rgba(0, 0, 0, 0.6);
+}
+.panel-primary > .panel-heading .badge {
+ color: #7a8288;
+ background-color: #ffffff;
+}
+.panel-primary > .panel-footer + .panel-collapse > .panel-body {
+ border-bottom-color: rgba(0, 0, 0, 0.6);
+}
+.panel-success {
+ border-color: rgba(0, 0, 0, 0.6);
+}
+.panel-success > .panel-heading {
+ color: #ffffff;
+ background-color: #62c462;
+ border-color: rgba(0, 0, 0, 0.6);
+}
+.panel-success > .panel-heading + .panel-collapse > .panel-body {
+ border-top-color: rgba(0, 0, 0, 0.6);
+}
+.panel-success > .panel-heading .badge {
+ color: #62c462;
+ background-color: #ffffff;
+}
+.panel-success > .panel-footer + .panel-collapse > .panel-body {
+ border-bottom-color: rgba(0, 0, 0, 0.6);
+}
+.panel-info {
+ border-color: rgba(0, 0, 0, 0.6);
+}
+.panel-info > .panel-heading {
+ color: #ffffff;
+ background-color: #5bc0de;
+ border-color: rgba(0, 0, 0, 0.6);
+}
+.panel-info > .panel-heading + .panel-collapse > .panel-body {
+ border-top-color: rgba(0, 0, 0, 0.6);
+}
+.panel-info > .panel-heading .badge {
+ color: #5bc0de;
+ background-color: #ffffff;
+}
+.panel-info > .panel-footer + .panel-collapse > .panel-body {
+ border-bottom-color: rgba(0, 0, 0, 0.6);
+}
+.panel-warning {
+ border-color: rgba(0, 0, 0, 0.6);
+}
+.panel-warning > .panel-heading {
+ color: #ffffff;
+ background-color: #f89406;
+ border-color: rgba(0, 0, 0, 0.6);
+}
+.panel-warning > .panel-heading + .panel-collapse > .panel-body {
+ border-top-color: rgba(0, 0, 0, 0.6);
+}
+.panel-warning > .panel-heading .badge {
+ color: #f89406;
+ background-color: #ffffff;
+}
+.panel-warning > .panel-footer + .panel-collapse > .panel-body {
+ border-bottom-color: rgba(0, 0, 0, 0.6);
+}
+.panel-danger {
+ border-color: rgba(0, 0, 0, 0.6);
+}
+.panel-danger > .panel-heading {
+ color: #ffffff;
+ background-color: #ee5f5b;
+ border-color: rgba(0, 0, 0, 0.6);
+}
+.panel-danger > .panel-heading + .panel-collapse > .panel-body {
+ border-top-color: rgba(0, 0, 0, 0.6);
+}
+.panel-danger > .panel-heading .badge {
+ color: #ee5f5b;
+ background-color: #ffffff;
+}
+.panel-danger > .panel-footer + .panel-collapse > .panel-body {
+ border-bottom-color: rgba(0, 0, 0, 0.6);
+}
+.embed-responsive {
+ position: relative;
+ display: block;
+ height: 0;
+ padding: 0;
+ overflow: hidden;
+}
+.embed-responsive .embed-responsive-item,
+.embed-responsive iframe,
+.embed-responsive embed,
+.embed-responsive object,
+.embed-responsive video {
+ position: absolute;
+ top: 0;
+ left: 0;
+ bottom: 0;
+ height: 100%;
+ width: 100%;
+ border: 0;
+}
+.embed-responsive-16by9 {
+ padding-bottom: 56.25%;
+}
+.embed-responsive-4by3 {
+ padding-bottom: 75%;
+}
+.well {
+ min-height: 20px;
+ padding: 19px;
+ margin-bottom: 20px;
+ background-color: #1c1e22;
+ border: 1px solid #0c0d0e;
+ border-radius: 4px;
+ -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
+}
+.well blockquote {
+ border-color: #ddd;
+ border-color: rgba(0, 0, 0, 0.15);
+}
+.well-lg {
+ padding: 24px;
+ border-radius: 6px;
+}
+.well-sm {
+ padding: 9px;
+ border-radius: 3px;
+}
+.close {
+ float: right;
+ font-size: 21px;
+ font-weight: bold;
+ line-height: 1;
+ color: #000000;
+ text-shadow: 0 1px 0 #ffffff;
+ opacity: 0.2;
+ filter: alpha(opacity=20);
+}
+.close:hover,
+.close:focus {
+ color: #000000;
+ text-decoration: none;
+ cursor: pointer;
+ opacity: 0.5;
+ filter: alpha(opacity=50);
+}
+button.close {
+ padding: 0;
+ cursor: pointer;
+ background: transparent;
+ border: 0;
+ -webkit-appearance: none;
+}
+.modal-open {
+ overflow: hidden;
+}
+.modal {
+ display: none;
+ overflow: hidden;
+ position: fixed;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ z-index: 1050;
+ -webkit-overflow-scrolling: touch;
+ outline: 0;
+}
+.modal.fade .modal-dialog {
+ -webkit-transform: translate(0, -25%);
+ -ms-transform: translate(0, -25%);
+ -o-transform: translate(0, -25%);
+ transform: translate(0, -25%);
+ -webkit-transition: -webkit-transform 0.3s ease-out;
+ -o-transition: -o-transform 0.3s ease-out;
+ transition: transform 0.3s ease-out;
+}
+.modal.in .modal-dialog {
+ -webkit-transform: translate(0, 0);
+ -ms-transform: translate(0, 0);
+ -o-transform: translate(0, 0);
+ transform: translate(0, 0);
+}
+.modal-open .modal {
+ overflow-x: hidden;
+ overflow-y: auto;
+}
+.modal-dialog {
+ position: relative;
+ width: auto;
+ margin: 10px;
+}
+.modal-content {
+ position: relative;
+ background-color: #2e3338;
+ border: 1px solid #999999;
+ border: 1px solid rgba(0, 0, 0, 0.2);
+ border-radius: 6px;
+ -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
+ box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
+ -webkit-background-clip: padding-box;
+ background-clip: padding-box;
+ outline: 0;
+}
+.modal-backdrop {
+ position: fixed;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ z-index: 1040;
+ background-color: #000000;
+}
+.modal-backdrop.fade {
+ opacity: 0;
+ filter: alpha(opacity=0);
+}
+.modal-backdrop.in {
+ opacity: 0.5;
+ filter: alpha(opacity=50);
+}
+.modal-header {
+ padding: 15px;
+ border-bottom: 1px solid #1c1e22;
+}
+.modal-header .close {
+ margin-top: -2px;
+}
+.modal-title {
+ margin: 0;
+ line-height: 1.42857143;
+}
+.modal-body {
+ position: relative;
+ padding: 20px;
+}
+.modal-footer {
+ padding: 20px;
+ text-align: right;
+ border-top: 1px solid #1c1e22;
+}
+.modal-footer .btn + .btn {
+ margin-left: 5px;
+ margin-bottom: 0;
+}
+.modal-footer .btn-group .btn + .btn {
+ margin-left: -1px;
+}
+.modal-footer .btn-block + .btn-block {
+ margin-left: 0;
+}
+.modal-scrollbar-measure {
+ position: absolute;
+ top: -9999px;
+ width: 50px;
+ height: 50px;
+ overflow: scroll;
+}
+@media (min-width: 768px) {
+ .modal-dialog {
+ width: 600px;
+ margin: 30px auto;
+ }
+ .modal-content {
+ -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
+ box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
+ }
+ .modal-sm {
+ width: 300px;
+ }
+}
+@media (min-width: 992px) {
+ .modal-lg {
+ width: 900px;
+ }
+}
+.tooltip {
+ position: absolute;
+ z-index: 1070;
+ display: block;
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+ font-style: normal;
+ font-weight: normal;
+ letter-spacing: normal;
+ line-break: auto;
+ line-height: 1.42857143;
+ text-align: left;
+ text-align: start;
+ text-decoration: none;
+ text-shadow: none;
+ text-transform: none;
+ white-space: normal;
+ word-break: normal;
+ word-spacing: normal;
+ word-wrap: normal;
+ font-size: 12px;
+ opacity: 0;
+ filter: alpha(opacity=0);
+}
+.tooltip.in {
+ opacity: 0.9;
+ filter: alpha(opacity=90);
+}
+.tooltip.top {
+ margin-top: -3px;
+ padding: 5px 0;
+}
+.tooltip.right {
+ margin-left: 3px;
+ padding: 0 5px;
+}
+.tooltip.bottom {
+ margin-top: 3px;
+ padding: 5px 0;
+}
+.tooltip.left {
+ margin-left: -3px;
+ padding: 0 5px;
+}
+.tooltip-inner {
+ max-width: 200px;
+ padding: 3px 8px;
+ color: #ffffff;
+ text-align: center;
+ background-color: #000000;
+ border-radius: 4px;
+}
+.tooltip-arrow {
+ position: absolute;
+ width: 0;
+ height: 0;
+ border-color: transparent;
+ border-style: solid;
+}
+.tooltip.top .tooltip-arrow {
+ bottom: 0;
+ left: 50%;
+ margin-left: -5px;
+ border-width: 5px 5px 0;
+ border-top-color: #000000;
+}
+.tooltip.top-left .tooltip-arrow {
+ bottom: 0;
+ right: 5px;
+ margin-bottom: -5px;
+ border-width: 5px 5px 0;
+ border-top-color: #000000;
+}
+.tooltip.top-right .tooltip-arrow {
+ bottom: 0;
+ left: 5px;
+ margin-bottom: -5px;
+ border-width: 5px 5px 0;
+ border-top-color: #000000;
+}
+.tooltip.right .tooltip-arrow {
+ top: 50%;
+ left: 0;
+ margin-top: -5px;
+ border-width: 5px 5px 5px 0;
+ border-right-color: #000000;
+}
+.tooltip.left .tooltip-arrow {
+ top: 50%;
+ right: 0;
+ margin-top: -5px;
+ border-width: 5px 0 5px 5px;
+ border-left-color: #000000;
+}
+.tooltip.bottom .tooltip-arrow {
+ top: 0;
+ left: 50%;
+ margin-left: -5px;
+ border-width: 0 5px 5px;
+ border-bottom-color: #000000;
+}
+.tooltip.bottom-left .tooltip-arrow {
+ top: 0;
+ right: 5px;
+ margin-top: -5px;
+ border-width: 0 5px 5px;
+ border-bottom-color: #000000;
+}
+.tooltip.bottom-right .tooltip-arrow {
+ top: 0;
+ left: 5px;
+ margin-top: -5px;
+ border-width: 0 5px 5px;
+ border-bottom-color: #000000;
+}
+.popover {
+ position: absolute;
+ top: 0;
+ left: 0;
+ z-index: 1060;
+ display: none;
+ max-width: 276px;
+ padding: 1px;
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+ font-style: normal;
+ font-weight: normal;
+ letter-spacing: normal;
+ line-break: auto;
+ line-height: 1.42857143;
+ text-align: left;
+ text-align: start;
+ text-decoration: none;
+ text-shadow: none;
+ text-transform: none;
+ white-space: normal;
+ word-break: normal;
+ word-spacing: normal;
+ word-wrap: normal;
+ font-size: 14px;
+ background-color: #2e3338;
+ -webkit-background-clip: padding-box;
+ background-clip: padding-box;
+ border: 1px solid #999999;
+ border: 1px solid rgba(0, 0, 0, 0.2);
+ border-radius: 6px;
+ -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
+ box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
+}
+.popover.top {
+ margin-top: -10px;
+}
+.popover.right {
+ margin-left: 10px;
+}
+.popover.bottom {
+ margin-top: 10px;
+}
+.popover.left {
+ margin-left: -10px;
+}
+.popover-title {
+ margin: 0;
+ padding: 8px 14px;
+ font-size: 14px;
+ background-color: #2e3338;
+ border-bottom: 1px solid #22262a;
+ border-radius: 5px 5px 0 0;
+}
+.popover-content {
+ padding: 9px 14px;
+}
+.popover > .arrow,
+.popover > .arrow:after {
+ position: absolute;
+ display: block;
+ width: 0;
+ height: 0;
+ border-color: transparent;
+ border-style: solid;
+}
+.popover > .arrow {
+ border-width: 11px;
+}
+.popover > .arrow:after {
+ border-width: 10px;
+ content: "";
+}
+.popover.top > .arrow {
+ left: 50%;
+ margin-left: -11px;
+ border-bottom-width: 0;
+ border-top-color: #666666;
+ border-top-color: rgba(0, 0, 0, 0.25);
+ bottom: -11px;
+}
+.popover.top > .arrow:after {
+ content: " ";
+ bottom: 1px;
+ margin-left: -10px;
+ border-bottom-width: 0;
+ border-top-color: #2e3338;
+}
+.popover.right > .arrow {
+ top: 50%;
+ left: -11px;
+ margin-top: -11px;
+ border-left-width: 0;
+ border-right-color: #666666;
+ border-right-color: rgba(0, 0, 0, 0.25);
+}
+.popover.right > .arrow:after {
+ content: " ";
+ left: 1px;
+ bottom: -10px;
+ border-left-width: 0;
+ border-right-color: #2e3338;
+}
+.popover.bottom > .arrow {
+ left: 50%;
+ margin-left: -11px;
+ border-top-width: 0;
+ border-bottom-color: #666666;
+ border-bottom-color: rgba(0, 0, 0, 0.25);
+ top: -11px;
+}
+.popover.bottom > .arrow:after {
+ content: " ";
+ top: 1px;
+ margin-left: -10px;
+ border-top-width: 0;
+ border-bottom-color: #2e3338;
+}
+.popover.left > .arrow {
+ top: 50%;
+ right: -11px;
+ margin-top: -11px;
+ border-right-width: 0;
+ border-left-color: #666666;
+ border-left-color: rgba(0, 0, 0, 0.25);
+}
+.popover.left > .arrow:after {
+ content: " ";
+ right: 1px;
+ border-right-width: 0;
+ border-left-color: #2e3338;
+ bottom: -10px;
+}
+.carousel {
+ position: relative;
+}
+.carousel-inner {
+ position: relative;
+ overflow: hidden;
+ width: 100%;
+}
+.carousel-inner > .item {
+ display: none;
+ position: relative;
+ -webkit-transition: 0.6s ease-in-out left;
+ -o-transition: 0.6s ease-in-out left;
+ transition: 0.6s ease-in-out left;
+}
+.carousel-inner > .item > img,
+.carousel-inner > .item > a > img {
+ line-height: 1;
+}
+@media all and (transform-3d), (-webkit-transform-3d) {
+ .carousel-inner > .item {
+ -webkit-transition: -webkit-transform 0.6s ease-in-out;
+ -o-transition: -o-transform 0.6s ease-in-out;
+ transition: transform 0.6s ease-in-out;
+ -webkit-backface-visibility: hidden;
+ backface-visibility: hidden;
+ -webkit-perspective: 1000px;
+ perspective: 1000px;
+ }
+ .carousel-inner > .item.next,
+ .carousel-inner > .item.active.right {
+ -webkit-transform: translate3d(100%, 0, 0);
+ transform: translate3d(100%, 0, 0);
+ left: 0;
+ }
+ .carousel-inner > .item.prev,
+ .carousel-inner > .item.active.left {
+ -webkit-transform: translate3d(-100%, 0, 0);
+ transform: translate3d(-100%, 0, 0);
+ left: 0;
+ }
+ .carousel-inner > .item.next.left,
+ .carousel-inner > .item.prev.right,
+ .carousel-inner > .item.active {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0);
+ left: 0;
+ }
+}
+.carousel-inner > .active,
+.carousel-inner > .next,
+.carousel-inner > .prev {
+ display: block;
+}
+.carousel-inner > .active {
+ left: 0;
+}
+.carousel-inner > .next,
+.carousel-inner > .prev {
+ position: absolute;
+ top: 0;
+ width: 100%;
+}
+.carousel-inner > .next {
+ left: 100%;
+}
+.carousel-inner > .prev {
+ left: -100%;
+}
+.carousel-inner > .next.left,
+.carousel-inner > .prev.right {
+ left: 0;
+}
+.carousel-inner > .active.left {
+ left: -100%;
+}
+.carousel-inner > .active.right {
+ left: 100%;
+}
+.carousel-control {
+ position: absolute;
+ top: 0;
+ left: 0;
+ bottom: 0;
+ width: 15%;
+ opacity: 0.5;
+ filter: alpha(opacity=50);
+ font-size: 20px;
+ color: #ffffff;
+ text-align: center;
+ text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
+ background-color: rgba(0, 0, 0, 0);
+}
+.carousel-control.left {
+ background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
+ background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
+ background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0.0001)));
+ background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
+ background-repeat: repeat-x;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
+}
+.carousel-control.right {
+ left: auto;
+ right: 0;
+ background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
+ background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
+ background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.0001)), to(rgba(0, 0, 0, 0.5)));
+ background-image: linear-gradient(to right, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
+ background-repeat: repeat-x;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1);
+}
+.carousel-control:hover,
+.carousel-control:focus {
+ outline: 0;
+ color: #ffffff;
+ text-decoration: none;
+ opacity: 0.9;
+ filter: alpha(opacity=90);
+}
+.carousel-control .icon-prev,
+.carousel-control .icon-next,
+.carousel-control .glyphicon-chevron-left,
+.carousel-control .glyphicon-chevron-right {
+ position: absolute;
+ top: 50%;
+ margin-top: -10px;
+ z-index: 5;
+ display: inline-block;
+}
+.carousel-control .icon-prev,
+.carousel-control .glyphicon-chevron-left {
+ left: 50%;
+ margin-left: -10px;
+}
+.carousel-control .icon-next,
+.carousel-control .glyphicon-chevron-right {
+ right: 50%;
+ margin-right: -10px;
+}
+.carousel-control .icon-prev,
+.carousel-control .icon-next {
+ width: 20px;
+ height: 20px;
+ line-height: 1;
+ font-family: serif;
+}
+.carousel-control .icon-prev:before {
+ content: '\2039';
+}
+.carousel-control .icon-next:before {
+ content: '\203a';
+}
+.carousel-indicators {
+ position: absolute;
+ bottom: 10px;
+ left: 50%;
+ z-index: 15;
+ width: 60%;
+ margin-left: -30%;
+ padding-left: 0;
+ list-style: none;
+ text-align: center;
+}
+.carousel-indicators li {
+ display: inline-block;
+ width: 10px;
+ height: 10px;
+ margin: 1px;
+ text-indent: -999px;
+ border: 1px solid #ffffff;
+ border-radius: 10px;
+ cursor: pointer;
+ background-color: #000 \9;
+ background-color: rgba(0, 0, 0, 0);
+}
+.carousel-indicators .active {
+ margin: 0;
+ width: 12px;
+ height: 12px;
+ background-color: #ffffff;
+}
+.carousel-caption {
+ position: absolute;
+ left: 15%;
+ right: 15%;
+ bottom: 20px;
+ z-index: 10;
+ padding-top: 20px;
+ padding-bottom: 20px;
+ color: #ffffff;
+ text-align: center;
+ text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
+}
+.carousel-caption .btn {
+ text-shadow: none;
+}
+@media screen and (min-width: 768px) {
+ .carousel-control .glyphicon-chevron-left,
+ .carousel-control .glyphicon-chevron-right,
+ .carousel-control .icon-prev,
+ .carousel-control .icon-next {
+ width: 30px;
+ height: 30px;
+ margin-top: -10px;
+ font-size: 30px;
+ }
+ .carousel-control .glyphicon-chevron-left,
+ .carousel-control .icon-prev {
+ margin-left: -10px;
+ }
+ .carousel-control .glyphicon-chevron-right,
+ .carousel-control .icon-next {
+ margin-right: -10px;
+ }
+ .carousel-caption {
+ left: 20%;
+ right: 20%;
+ padding-bottom: 30px;
+ }
+ .carousel-indicators {
+ bottom: 20px;
+ }
+}
+.clearfix:before,
+.clearfix:after,
+.dl-horizontal dd:before,
+.dl-horizontal dd:after,
+.container:before,
+.container:after,
+.container-fluid:before,
+.container-fluid:after,
+.row:before,
+.row:after,
+.form-horizontal .form-group:before,
+.form-horizontal .form-group:after,
+.btn-toolbar:before,
+.btn-toolbar:after,
+.btn-group-vertical > .btn-group:before,
+.btn-group-vertical > .btn-group:after,
+.nav:before,
+.nav:after,
+.navbar:before,
+.navbar:after,
+.navbar-header:before,
+.navbar-header:after,
+.navbar-collapse:before,
+.navbar-collapse:after,
+.pager:before,
+.pager:after,
+.panel-body:before,
+.panel-body:after,
+.modal-header:before,
+.modal-header:after,
+.modal-footer:before,
+.modal-footer:after {
+ content: " ";
+ display: table;
+}
+.clearfix:after,
+.dl-horizontal dd:after,
+.container:after,
+.container-fluid:after,
+.row:after,
+.form-horizontal .form-group:after,
+.btn-toolbar:after,
+.btn-group-vertical > .btn-group:after,
+.nav:after,
+.navbar:after,
+.navbar-header:after,
+.navbar-collapse:after,
+.pager:after,
+.panel-body:after,
+.modal-header:after,
+.modal-footer:after {
+ clear: both;
+}
+.center-block {
+ display: block;
+ margin-left: auto;
+ margin-right: auto;
+}
+.pull-right {
+ float: right !important;
+}
+.pull-left {
+ float: left !important;
+}
+.hide {
+ display: none !important;
+}
+.show {
+ display: block !important;
+}
+.invisible {
+ visibility: hidden;
+}
+.text-hide {
+ font: 0/0 a;
+ color: transparent;
+ text-shadow: none;
+ background-color: transparent;
+ border: 0;
+}
+.hidden {
+ display: none !important;
+}
+.affix {
+ position: fixed;
+}
+@-ms-viewport {
+ width: device-width;
+}
+.visible-xs,
+.visible-sm,
+.visible-md,
+.visible-lg {
+ display: none !important;
+}
+.visible-xs-block,
+.visible-xs-inline,
+.visible-xs-inline-block,
+.visible-sm-block,
+.visible-sm-inline,
+.visible-sm-inline-block,
+.visible-md-block,
+.visible-md-inline,
+.visible-md-inline-block,
+.visible-lg-block,
+.visible-lg-inline,
+.visible-lg-inline-block {
+ display: none !important;
+}
+@media (max-width: 767px) {
+ .visible-xs {
+ display: block !important;
+ }
+ table.visible-xs {
+ display: table !important;
+ }
+ tr.visible-xs {
+ display: table-row !important;
+ }
+ th.visible-xs,
+ td.visible-xs {
+ display: table-cell !important;
+ }
+}
+@media (max-width: 767px) {
+ .visible-xs-block {
+ display: block !important;
+ }
+}
+@media (max-width: 767px) {
+ .visible-xs-inline {
+ display: inline !important;
+ }
+}
+@media (max-width: 767px) {
+ .visible-xs-inline-block {
+ display: inline-block !important;
+ }
+}
+@media (min-width: 768px) and (max-width: 991px) {
+ .visible-sm {
+ display: block !important;
+ }
+ table.visible-sm {
+ display: table !important;
+ }
+ tr.visible-sm {
+ display: table-row !important;
+ }
+ th.visible-sm,
+ td.visible-sm {
+ display: table-cell !important;
+ }
+}
+@media (min-width: 768px) and (max-width: 991px) {
+ .visible-sm-block {
+ display: block !important;
+ }
+}
+@media (min-width: 768px) and (max-width: 991px) {
+ .visible-sm-inline {
+ display: inline !important;
+ }
+}
+@media (min-width: 768px) and (max-width: 991px) {
+ .visible-sm-inline-block {
+ display: inline-block !important;
+ }
+}
+@media (min-width: 992px) and (max-width: 1199px) {
+ .visible-md {
+ display: block !important;
+ }
+ table.visible-md {
+ display: table !important;
+ }
+ tr.visible-md {
+ display: table-row !important;
+ }
+ th.visible-md,
+ td.visible-md {
+ display: table-cell !important;
+ }
+}
+@media (min-width: 992px) and (max-width: 1199px) {
+ .visible-md-block {
+ display: block !important;
+ }
+}
+@media (min-width: 992px) and (max-width: 1199px) {
+ .visible-md-inline {
+ display: inline !important;
+ }
+}
+@media (min-width: 992px) and (max-width: 1199px) {
+ .visible-md-inline-block {
+ display: inline-block !important;
+ }
+}
+@media (min-width: 1200px) {
+ .visible-lg {
+ display: block !important;
+ }
+ table.visible-lg {
+ display: table !important;
+ }
+ tr.visible-lg {
+ display: table-row !important;
+ }
+ th.visible-lg,
+ td.visible-lg {
+ display: table-cell !important;
+ }
+}
+@media (min-width: 1200px) {
+ .visible-lg-block {
+ display: block !important;
+ }
+}
+@media (min-width: 1200px) {
+ .visible-lg-inline {
+ display: inline !important;
+ }
+}
+@media (min-width: 1200px) {
+ .visible-lg-inline-block {
+ display: inline-block !important;
+ }
+}
+@media (max-width: 767px) {
+ .hidden-xs {
+ display: none !important;
+ }
+}
+@media (min-width: 768px) and (max-width: 991px) {
+ .hidden-sm {
+ display: none !important;
+ }
+}
+@media (min-width: 992px) and (max-width: 1199px) {
+ .hidden-md {
+ display: none !important;
+ }
+}
+@media (min-width: 1200px) {
+ .hidden-lg {
+ display: none !important;
+ }
+}
+.visible-print {
+ display: none !important;
+}
+@media print {
+ .visible-print {
+ display: block !important;
+ }
+ table.visible-print {
+ display: table !important;
+ }
+ tr.visible-print {
+ display: table-row !important;
+ }
+ th.visible-print,
+ td.visible-print {
+ display: table-cell !important;
+ }
+}
+.visible-print-block {
+ display: none !important;
+}
+@media print {
+ .visible-print-block {
+ display: block !important;
+ }
+}
+.visible-print-inline {
+ display: none !important;
+}
+@media print {
+ .visible-print-inline {
+ display: inline !important;
+ }
+}
+.visible-print-inline-block {
+ display: none !important;
+}
+@media print {
+ .visible-print-inline-block {
+ display: inline-block !important;
+ }
+}
+@media print {
+ .hidden-print {
+ display: none !important;
+ }
+}
+.navbar {
+ background-image: -webkit-linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-image: -o-linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#484e55), color-stop(60%, #3a3f44), to(#313539));
+ background-image: linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff484e55', endColorstr='#ff313539', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+ border: 1px solid rgba(0, 0, 0, 0.6);
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
+}
+.navbar .navbar-nav > li > a {
+ border-right: 1px solid rgba(0, 0, 0, 0.2);
+ border-left: 1px solid rgba(255, 255, 255, 0.1);
+}
+.navbar .navbar-nav > li > a:hover {
+ background-image: -webkit-linear-gradient(#020202, #101112 40%, #141618);
+ background-image: -o-linear-gradient(#020202, #101112 40%, #141618);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#020202), color-stop(40%, #101112), to(#141618));
+ background-image: linear-gradient(#020202, #101112 40%, #141618);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff020202', endColorstr='#ff141618', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+ border-left-color: transparent;
+}
+.navbar-inverse {
+ background-image: -webkit-linear-gradient(#8a9196, #7a8288 60%, #70787d);
+ background-image: -o-linear-gradient(#8a9196, #7a8288 60%, #70787d);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#8a9196), color-stop(60%, #7a8288), to(#70787d));
+ background-image: linear-gradient(#8a9196, #7a8288 60%, #70787d);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff8a9196', endColorstr='#ff70787d', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.navbar-inverse .badge {
+ background-color: #5d6368;
+}
+.navbar-inverse .navbar-nav > li > a:hover {
+ background-image: -webkit-linear-gradient(#404448, #4e5458 40%, #53595d);
+ background-image: -o-linear-gradient(#404448, #4e5458 40%, #53595d);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#404448), color-stop(40%, #4e5458), to(#53595d));
+ background-image: linear-gradient(#404448, #4e5458 40%, #53595d);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff404448', endColorstr='#ff53595d', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.navbar .nav .open > a {
+ border-color: transparent;
+}
+.navbar-nav > li.active > a {
+ border-left-color: transparent;
+}
+.navbar-form {
+ margin-left: 5px;
+ margin-right: 5px;
+}
+.btn,
+.btn:hover {
+ border-color: rgba(0, 0, 0, 0.6);
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
+}
+.btn-default {
+ background-image: -webkit-linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-image: -o-linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#484e55), color-stop(60%, #3a3f44), to(#313539));
+ background-image: linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff484e55', endColorstr='#ff313539', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.btn-default:hover {
+ background-image: -webkit-linear-gradient(#020202, #101112 40%, #141618);
+ background-image: -o-linear-gradient(#020202, #101112 40%, #141618);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#020202), color-stop(40%, #101112), to(#141618));
+ background-image: linear-gradient(#020202, #101112 40%, #141618);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff020202', endColorstr='#ff141618', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.btn-primary {
+ background-image: -webkit-linear-gradient(#8a9196, #7a8288 60%, #70787d);
+ background-image: -o-linear-gradient(#8a9196, #7a8288 60%, #70787d);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#8a9196), color-stop(60%, #7a8288), to(#70787d));
+ background-image: linear-gradient(#8a9196, #7a8288 60%, #70787d);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff8a9196', endColorstr='#ff70787d', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.btn-primary:hover {
+ background-image: -webkit-linear-gradient(#404448, #4e5458 40%, #53595d);
+ background-image: -o-linear-gradient(#404448, #4e5458 40%, #53595d);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#404448), color-stop(40%, #4e5458), to(#53595d));
+ background-image: linear-gradient(#404448, #4e5458 40%, #53595d);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff404448', endColorstr='#ff53595d', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.btn-success {
+ background-image: -webkit-linear-gradient(#78cc78, #62c462 60%, #53be53);
+ background-image: -o-linear-gradient(#78cc78, #62c462 60%, #53be53);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#78cc78), color-stop(60%, #62c462), to(#53be53));
+ background-image: linear-gradient(#78cc78, #62c462 60%, #53be53);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff78cc78', endColorstr='#ff53be53', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.btn-success:hover {
+ background-image: -webkit-linear-gradient(#2f7d2f, #379337 40%, #3a9a3a);
+ background-image: -o-linear-gradient(#2f7d2f, #379337 40%, #3a9a3a);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#2f7d2f), color-stop(40%, #379337), to(#3a9a3a));
+ background-image: linear-gradient(#2f7d2f, #379337 40%, #3a9a3a);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff2f7d2f', endColorstr='#ff3a9a3a', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.btn-info {
+ background-image: -webkit-linear-gradient(#74cae3, #5bc0de 60%, #4ab9db);
+ background-image: -o-linear-gradient(#74cae3, #5bc0de 60%, #4ab9db);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#74cae3), color-stop(60%, #5bc0de), to(#4ab9db));
+ background-image: linear-gradient(#74cae3, #5bc0de 60%, #4ab9db);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff74cae3', endColorstr='#ff4ab9db', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.btn-info:hover {
+ background-image: -webkit-linear-gradient(#20829f, #2596b8 40%, #279dc1);
+ background-image: -o-linear-gradient(#20829f, #2596b8 40%, #279dc1);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#20829f), color-stop(40%, #2596b8), to(#279dc1));
+ background-image: linear-gradient(#20829f, #2596b8 40%, #279dc1);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff20829f', endColorstr='#ff279dc1', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.btn-warning {
+ background-image: -webkit-linear-gradient(#faa123, #f89406 60%, #e48806);
+ background-image: -o-linear-gradient(#faa123, #f89406 60%, #e48806);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#faa123), color-stop(60%, #f89406), to(#e48806));
+ background-image: linear-gradient(#faa123, #f89406 60%, #e48806);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffaa123', endColorstr='#ffe48806', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.btn-warning:hover {
+ background-image: -webkit-linear-gradient(#804d03, #9e5f04 40%, #a86404);
+ background-image: -o-linear-gradient(#804d03, #9e5f04 40%, #a86404);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#804d03), color-stop(40%, #9e5f04), to(#a86404));
+ background-image: linear-gradient(#804d03, #9e5f04 40%, #a86404);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff804d03', endColorstr='#ffa86404', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.btn-danger {
+ background-image: -webkit-linear-gradient(#f17a77, #ee5f5b 60%, #ec4d49);
+ background-image: -o-linear-gradient(#f17a77, #ee5f5b 60%, #ec4d49);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#f17a77), color-stop(60%, #ee5f5b), to(#ec4d49));
+ background-image: linear-gradient(#f17a77, #ee5f5b 60%, #ec4d49);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff17a77', endColorstr='#ffec4d49', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.btn-danger:hover {
+ background-image: -webkit-linear-gradient(#bb1813, #d71c16 40%, #e01d17);
+ background-image: -o-linear-gradient(#bb1813, #d71c16 40%, #e01d17);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#bb1813), color-stop(40%, #d71c16), to(#e01d17));
+ background-image: linear-gradient(#bb1813, #d71c16 40%, #e01d17);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffbb1813', endColorstr='#ffe01d17', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.btn-link,
+.btn-link:hover {
+ border-color: transparent;
+}
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+ text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.3);
+}
+.text-primary,
+.text-primary:hover {
+ color: #7a8288;
+}
+.text-success,
+.text-success:hover {
+ color: #62c462;
+}
+.text-danger,
+.text-danger:hover {
+ color: #ee5f5b;
+}
+.text-warning,
+.text-warning:hover {
+ color: #f89406;
+}
+.text-info,
+.text-info:hover {
+ color: #5bc0de;
+}
+.table .success,
+.table .warning,
+.table .danger,
+.table .info {
+ color: #fff;
+}
+.table-bordered tbody tr.success td,
+.table-bordered tbody tr.warning td,
+.table-bordered tbody tr.danger td,
+.table-bordered tbody tr.success:hover td,
+.table-bordered tbody tr.warning:hover td,
+.table-bordered tbody tr.danger:hover td {
+ border-color: #1c1e22;
+}
+.table-responsive > .table {
+ background-color: #2e3338;
+}
+input,
+textarea {
+ color: #272b30;
+}
+.has-warning .help-block,
+.has-warning .control-label,
+.has-warning .radio,
+.has-warning .checkbox,
+.has-warning .radio-inline,
+.has-warning .checkbox-inline,
+.has-warning.radio label,
+.has-warning.checkbox label,
+.has-warning.radio-inline label,
+.has-warning.checkbox-inline label,
+.has-warning .form-control-feedback {
+ color: #f89406;
+}
+.has-warning .form-control,
+.has-warning .form-control:focus {
+ border-color: #f89406;
+}
+.has-warning .input-group-addon {
+ background-color: #3a3f44;
+ border-color: rgba(0, 0, 0, 0.6);
+}
+.has-error .help-block,
+.has-error .control-label,
+.has-error .radio,
+.has-error .checkbox,
+.has-error .radio-inline,
+.has-error .checkbox-inline,
+.has-error.radio label,
+.has-error.checkbox label,
+.has-error.radio-inline label,
+.has-error.checkbox-inline label,
+.has-error .form-control-feedback {
+ color: #ee5f5b;
+}
+.has-error .form-control,
+.has-error .form-control:focus {
+ border-color: #ee5f5b;
+}
+.has-error .input-group-addon {
+ background-color: #3a3f44;
+ border-color: rgba(0, 0, 0, 0.6);
+}
+.has-success .help-block,
+.has-success .control-label,
+.has-success .radio,
+.has-success .checkbox,
+.has-success .radio-inline,
+.has-success .checkbox-inline,
+.has-success.radio label,
+.has-success.checkbox label,
+.has-success.radio-inline label,
+.has-success.checkbox-inline label,
+.has-success .form-control-feedback {
+ color: #62c462;
+}
+.has-success .form-control,
+.has-success .form-control:focus {
+ border-color: #62c462;
+}
+.has-success .input-group-addon {
+ background-color: #3a3f44;
+ border-color: rgba(0, 0, 0, 0.6);
+}
+legend {
+ color: #fff;
+}
+.input-group-addon {
+ background-color: #3a3f44;
+ background-image: -webkit-linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-image: -o-linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#484e55), color-stop(60%, #3a3f44), to(#313539));
+ background-image: linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff484e55', endColorstr='#ff313539', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
+ color: #ffffff;
+}
+.nav .open > a,
+.nav .open > a:hover,
+.nav .open > a:focus {
+ border-color: rgba(0, 0, 0, 0.6);
+}
+.nav-pills > li > a {
+ background-image: -webkit-linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-image: -o-linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#484e55), color-stop(60%, #3a3f44), to(#313539));
+ background-image: linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff484e55', endColorstr='#ff313539', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+ border: 1px solid rgba(0, 0, 0, 0.6);
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
+}
+.nav-pills > li > a:hover {
+ background-image: -webkit-linear-gradient(#020202, #101112 40%, #141618);
+ background-image: -o-linear-gradient(#020202, #101112 40%, #141618);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#020202), color-stop(40%, #101112), to(#141618));
+ background-image: linear-gradient(#020202, #101112 40%, #141618);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff020202', endColorstr='#ff141618', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+ border: 1px solid rgba(0, 0, 0, 0.6);
+}
+.nav-pills > li.active > a,
+.nav-pills > li.active > a:hover {
+ background-color: none;
+ background-image: -webkit-linear-gradient(#020202, #101112 40%, #141618);
+ background-image: -o-linear-gradient(#020202, #101112 40%, #141618);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#020202), color-stop(40%, #101112), to(#141618));
+ background-image: linear-gradient(#020202, #101112 40%, #141618);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff020202', endColorstr='#ff141618', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+ border: 1px solid rgba(0, 0, 0, 0.6);
+}
+.nav-pills > li.disabled > a,
+.nav-pills > li.disabled > a:hover {
+ background-image: -webkit-linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-image: -o-linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#484e55), color-stop(60%, #3a3f44), to(#313539));
+ background-image: linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff484e55', endColorstr='#ff313539', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.pagination > li > a,
+.pagination > li > span {
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
+ background-image: -webkit-linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-image: -o-linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#484e55), color-stop(60%, #3a3f44), to(#313539));
+ background-image: linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff484e55', endColorstr='#ff313539', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.pagination > li > a:hover,
+.pagination > li > span:hover {
+ background-image: -webkit-linear-gradient(#020202, #101112 40%, #141618);
+ background-image: -o-linear-gradient(#020202, #101112 40%, #141618);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#020202), color-stop(40%, #101112), to(#141618));
+ background-image: linear-gradient(#020202, #101112 40%, #141618);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff020202', endColorstr='#ff141618', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.pagination > li.active > a,
+.pagination > li.active > span {
+ background-image: -webkit-linear-gradient(#020202, #101112 40%, #141618);
+ background-image: -o-linear-gradient(#020202, #101112 40%, #141618);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#020202), color-stop(40%, #101112), to(#141618));
+ background-image: linear-gradient(#020202, #101112 40%, #141618);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff020202', endColorstr='#ff141618', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.pagination > li.disabled > a,
+.pagination > li.disabled > a:hover,
+.pagination > li.disabled > span,
+.pagination > li.disabled > span:hover {
+ background-color: transparent;
+ background-image: -webkit-linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-image: -o-linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#484e55), color-stop(60%, #3a3f44), to(#313539));
+ background-image: linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff484e55', endColorstr='#ff313539', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.pager > li > a {
+ background-image: -webkit-linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-image: -o-linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#484e55), color-stop(60%, #3a3f44), to(#313539));
+ background-image: linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff484e55', endColorstr='#ff313539', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
+}
+.pager > li > a:hover {
+ background-image: -webkit-linear-gradient(#020202, #101112 40%, #141618);
+ background-image: -o-linear-gradient(#020202, #101112 40%, #141618);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#020202), color-stop(40%, #101112), to(#141618));
+ background-image: linear-gradient(#020202, #101112 40%, #141618);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff020202', endColorstr='#ff141618', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.pager > li.disabled > a,
+.pager > li.disabled > a:hover {
+ background-color: transparent;
+ background-image: -webkit-linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-image: -o-linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#484e55), color-stop(60%, #3a3f44), to(#313539));
+ background-image: linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff484e55', endColorstr='#ff313539', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.breadcrumb {
+ border: 1px solid rgba(0, 0, 0, 0.6);
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
+ background-image: -webkit-linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-image: -o-linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#484e55), color-stop(60%, #3a3f44), to(#313539));
+ background-image: linear-gradient(#484e55, #3a3f44 60%, #313539);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff484e55', endColorstr='#ff313539', GradientType=0);
+ -webkit-filter: none;
+ filter: none;
+}
+.alert .alert-link,
+.alert a {
+ color: #fff;
+ text-decoration: underline;
+}
+.alert .close {
+ color: #000000;
+ text-decoration: none;
+}
+a.thumbnail:hover,
+a.thumbnail:focus,
+a.thumbnail.active {
+ border-color: #0c0d0e;
+}
+a.list-group-item.active,
+a.list-group-item.active:hover,
+a.list-group-item.active:focus {
+ border-color: rgba(0, 0, 0, 0.6);
+}
+a.list-group-item-success.active {
+ background-color: #62c462;
+}
+a.list-group-item-success.active:hover,
+a.list-group-item-success.active:focus {
+ background-color: #4fbd4f;
+}
+a.list-group-item-warning.active {
+ background-color: #f89406;
+}
+a.list-group-item-warning.active:hover,
+a.list-group-item-warning.active:focus {
+ background-color: #df8505;
+}
+a.list-group-item-danger.active {
+ background-color: #ee5f5b;
+}
+a.list-group-item-danger.active:hover,
+a.list-group-item-danger.active:focus {
+ background-color: #ec4844;
+}
+.jumbotron {
+ border: 1px solid rgba(0, 0, 0, 0.6);
+}
+.panel-primary .panel-heading,
+.panel-success .panel-heading,
+.panel-danger .panel-heading,
+.panel-warning .panel-heading,
+.panel-info .panel-heading {
+ border-color: #000;
+}
diff --git a/debian/missing-sources/c3.css b/debian/missing-sources/c3.css
new file mode 100644
index 00000000..5de1edfa
--- /dev/null
+++ b/debian/missing-sources/c3.css
@@ -0,0 +1,163 @@
+/*-- Chart --*/
+.c3 svg {
+ font: 10px sans-serif;
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
+
+.c3 path, .c3 line {
+ fill: none;
+ stroke: #000; }
+
+.c3 text {
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ user-select: none; }
+
+.c3-legend-item-tile, .c3-xgrid-focus, .c3-ygrid, .c3-event-rect, .c3-bars path {
+ shape-rendering: crispEdges; }
+
+.c3-chart-arc path {
+ stroke: #fff; }
+
+.c3-chart-arc text {
+ fill: #fff;
+ font-size: 13px; }
+
+/*-- Axis --*/
+/*-- Grid --*/
+.c3-grid line {
+ stroke: #aaa; }
+
+.c3-grid text {
+ fill: #aaa; }
+
+.c3-xgrid, .c3-ygrid {
+ stroke-dasharray: 3 3; }
+
+/*-- Text on Chart --*/
+.c3-text.c3-empty {
+ fill: #808080;
+ font-size: 2em; }
+
+/*-- Line --*/
+.c3-line {
+ stroke-width: 1px; }
+
+/*-- Point --*/
+.c3-circle._expanded_ {
+ stroke-width: 1px;
+ stroke: white; }
+
+.c3-selected-circle {
+ fill: white;
+ stroke-width: 2px; }
+
+/*-- Bar --*/
+.c3-bar {
+ stroke-width: 0; }
+
+.c3-bar._expanded_ {
+ fill-opacity: 0.75; }
+
+/*-- Focus --*/
+.c3-target.c3-focused {
+ opacity: 1; }
+
+.c3-target.c3-focused path.c3-line, .c3-target.c3-focused path.c3-step {
+ stroke-width: 2px; }
+
+.c3-target.c3-defocused {
+ opacity: 0.3 !important; }
+
+/*-- Region --*/
+.c3-region {
+ fill: steelblue;
+ fill-opacity: 0.1; }
+
+/*-- Brush --*/
+.c3-brush .extent {
+ fill-opacity: 0.1; }
+
+/*-- Select - Drag --*/
+/*-- Legend --*/
+.c3-legend-item {
+ font-size: 12px; }
+
+.c3-legend-item-hidden {
+ opacity: 0.15; }
+
+.c3-legend-background {
+ opacity: 0.75;
+ fill: white;
+ stroke: lightgray;
+ stroke-width: 1; }
+
+/*-- Title --*/
+.c3-title {
+ font: 14px sans-serif; }
+
+/*-- Tooltip --*/
+.c3-tooltip-container {
+ z-index: 10; }
+
+.c3-tooltip {
+ border-collapse: collapse;
+ border-spacing: 0;
+ background-color: #fff;
+ empty-cells: show;
+ -webkit-box-shadow: 7px 7px 12px -9px #777777;
+ -moz-box-shadow: 7px 7px 12px -9px #777777;
+ box-shadow: 7px 7px 12px -9px #777777;
+ opacity: 0.9; }
+
+.c3-tooltip tr {
+ border: 1px solid #CCC; }
+
+.c3-tooltip th {
+ background-color: #aaa;
+ font-size: 14px;
+ padding: 2px 5px;
+ text-align: left;
+ color: #FFF; }
+
+.c3-tooltip td {
+ font-size: 13px;
+ padding: 3px 6px;
+ background-color: #fff;
+ border-left: 1px dotted #999; }
+
+.c3-tooltip td > span {
+ display: inline-block;
+ width: 10px;
+ height: 10px;
+ margin-right: 6px; }
+
+.c3-tooltip td.value {
+ text-align: right; }
+
+/*-- Area --*/
+.c3-area {
+ stroke-width: 0;
+ opacity: 0.2; }
+
+/*-- Arc --*/
+.c3-chart-arcs-title {
+ dominant-baseline: middle;
+ font-size: 1.3em; }
+
+.c3-chart-arcs .c3-chart-arcs-background {
+ fill: #e0e0e0;
+ stroke: none; }
+
+.c3-chart-arcs .c3-chart-arcs-gauge-unit {
+ fill: #000;
+ font-size: 16px; }
+
+.c3-chart-arcs .c3-chart-arcs-gauge-max {
+ fill: #777; }
+
+.c3-chart-arcs .c3-chart-arcs-gauge-min {
+ fill: #777; }
+
+.c3-chart-arc .c3-gauge-value {
+ fill: #000;
+ /* font-size: 28px !important;*/ }
diff --git a/debian/missing-sources/c3.js b/debian/missing-sources/c3.js
new file mode 100644
index 00000000..aca979c0
--- /dev/null
+++ b/debian/missing-sources/c3.js
@@ -0,0 +1,7315 @@
+(function (window) {
+ 'use strict';
+
+ /*global define, module, exports, require */
+
+ var c3 = { version: "0.4.11-rc4" };
+
+ var c3_chart_fn,
+ c3_chart_internal_fn,
+ c3_chart_internal_axis_fn;
+
+ function API(owner) {
+ this.owner = owner;
+ }
+
+ function inherit(base, derived) {
+
+ if (Object.create) {
+ derived.prototype = Object.create(base.prototype);
+ } else {
+ var f = function f() {};
+ f.prototype = base.prototype;
+ derived.prototype = new f();
+ }
+
+ derived.prototype.constructor = derived;
+
+ return derived;
+ }
+
+ function Chart(config) {
+ var $$ = this.internal = new ChartInternal(this);
+ $$.loadConfig(config);
+
+ $$.beforeInit(config);
+ $$.init();
+ $$.afterInit(config);
+
+ // bind "this" to nested API
+ (function bindThis(fn, target, argThis) {
+ Object.keys(fn).forEach(function (key) {
+ target[key] = fn[key].bind(argThis);
+ if (Object.keys(fn[key]).length > 0) {
+ bindThis(fn[key], target[key], argThis);
+ }
+ });
+ })(c3_chart_fn, this, this);
+ }
+
+ function ChartInternal(api) {
+ var $$ = this;
+ $$.d3 = window.d3 ? window.d3 : typeof require !== 'undefined' ? require("d3") : undefined;
+ $$.api = api;
+ $$.config = $$.getDefaultConfig();
+ $$.data = {};
+ $$.cache = {};
+ $$.axes = {};
+ }
+
+ c3.generate = function (config) {
+ return new Chart(config);
+ };
+
+ c3.chart = {
+ fn: Chart.prototype,
+ internal: {
+ fn: ChartInternal.prototype,
+ axis: {
+ fn: Axis.prototype
+ }
+ }
+ };
+ c3_chart_fn = c3.chart.fn;
+ c3_chart_internal_fn = c3.chart.internal.fn;
+ c3_chart_internal_axis_fn = c3.chart.internal.axis.fn;
+
+ c3_chart_internal_fn.beforeInit = function () {
+ // can do something
+ };
+ c3_chart_internal_fn.afterInit = function () {
+ // can do something
+ };
+ c3_chart_internal_fn.init = function () {
+ var $$ = this, config = $$.config;
+
+ $$.initParams();
+
+ if (config.data_url) {
+ $$.convertUrlToData(config.data_url, config.data_mimeType, config.data_keys, $$.initWithData);
+ }
+ else if (config.data_json) {
+ $$.initWithData($$.convertJsonToData(config.data_json, config.data_keys));
+ }
+ else if (config.data_rows) {
+ $$.initWithData($$.convertRowsToData(config.data_rows));
+ }
+ else if (config.data_columns) {
+ $$.initWithData($$.convertColumnsToData(config.data_columns));
+ }
+ else {
+ throw Error('url or json or rows or columns is required.');
+ }
+ };
+
+ c3_chart_internal_fn.initParams = function () {
+ var $$ = this, d3 = $$.d3, config = $$.config;
+
+ // MEMO: clipId needs to be unique because it conflicts when multiple charts exist
+ $$.clipId = "c3-" + (+new Date()) + '-clip',
+ $$.clipIdForXAxis = $$.clipId + '-xaxis',
+ $$.clipIdForYAxis = $$.clipId + '-yaxis',
+ $$.clipIdForGrid = $$.clipId + '-grid',
+ $$.clipIdForSubchart = $$.clipId + '-subchart',
+ $$.clipPath = $$.getClipPath($$.clipId),
+ $$.clipPathForXAxis = $$.getClipPath($$.clipIdForXAxis),
+ $$.clipPathForYAxis = $$.getClipPath($$.clipIdForYAxis);
+ $$.clipPathForGrid = $$.getClipPath($$.clipIdForGrid),
+ $$.clipPathForSubchart = $$.getClipPath($$.clipIdForSubchart),
+
+ $$.dragStart = null;
+ $$.dragging = false;
+ $$.flowing = false;
+ $$.cancelClick = false;
+ $$.mouseover = false;
+ $$.transiting = false;
+
+ $$.color = $$.generateColor();
+ $$.levelColor = $$.generateLevelColor();
+
+ $$.dataTimeFormat = config.data_xLocaltime ? d3.time.format : d3.time.format.utc;
+ $$.axisTimeFormat = config.axis_x_localtime ? d3.time.format : d3.time.format.utc;
+ $$.defaultAxisTimeFormat = $$.axisTimeFormat.multi([
+ [".%L", function (d) { return d.getMilliseconds(); }],
+ [":%S", function (d) { return d.getSeconds(); }],
+ ["%I:%M", function (d) { return d.getMinutes(); }],
+ ["%I %p", function (d) { return d.getHours(); }],
+ ["%-m/%-d", function (d) { return d.getDay() && d.getDate() !== 1; }],
+ ["%-m/%-d", function (d) { return d.getDate() !== 1; }],
+ ["%-m/%-d", function (d) { return d.getMonth(); }],
+ ["%Y/%-m/%-d", function () { return true; }]
+ ]);
+
+ $$.hiddenTargetIds = [];
+ $$.hiddenLegendIds = [];
+ $$.focusedTargetIds = [];
+ $$.defocusedTargetIds = [];
+
+ $$.xOrient = config.axis_rotated ? "left" : "bottom";
+ $$.yOrient = config.axis_rotated ? (config.axis_y_inner ? "top" : "bottom") : (config.axis_y_inner ? "right" : "left");
+ $$.y2Orient = config.axis_rotated ? (config.axis_y2_inner ? "bottom" : "top") : (config.axis_y2_inner ? "left" : "right");
+ $$.subXOrient = config.axis_rotated ? "left" : "bottom";
+
+ $$.isLegendRight = config.legend_position === 'right';
+ $$.isLegendInset = config.legend_position === 'inset';
+ $$.isLegendTop = config.legend_inset_anchor === 'top-left' || config.legend_inset_anchor === 'top-right';
+ $$.isLegendLeft = config.legend_inset_anchor === 'top-left' || config.legend_inset_anchor === 'bottom-left';
+ $$.legendStep = 0;
+ $$.legendItemWidth = 0;
+ $$.legendItemHeight = 0;
+
+ $$.currentMaxTickWidths = {
+ x: 0,
+ y: 0,
+ y2: 0
+ };
+
+ $$.rotated_padding_left = 30;
+ $$.rotated_padding_right = config.axis_rotated && !config.axis_x_show ? 0 : 30;
+ $$.rotated_padding_top = 5;
+
+ $$.withoutFadeIn = {};
+
+ $$.intervalForObserveInserted = undefined;
+
+ $$.axes.subx = d3.selectAll([]); // needs when excluding subchart.js
+ };
+
+ c3_chart_internal_fn.initChartElements = function () {
+ if (this.initBar) { this.initBar(); }
+ if (this.initLine) { this.initLine(); }
+ if (this.initArc) { this.initArc(); }
+ if (this.initGauge) { this.initGauge(); }
+ if (this.initText) { this.initText(); }
+ };
+
+ c3_chart_internal_fn.initWithData = function (data) {
+ var $$ = this, d3 = $$.d3, config = $$.config;
+ var defs, main, binding = true;
+
+ $$.axis = new Axis($$);
+
+ if ($$.initPie) { $$.initPie(); }
+ if ($$.initBrush) { $$.initBrush(); }
+ if ($$.initZoom) { $$.initZoom(); }
+
+ if (!config.bindto) {
+ $$.selectChart = d3.selectAll([]);
+ }
+ else if (typeof config.bindto.node === 'function') {
+ $$.selectChart = config.bindto;
+ }
+ else {
+ $$.selectChart = d3.select(config.bindto);
+ }
+ if ($$.selectChart.empty()) {
+ $$.selectChart = d3.select(document.createElement('div')).style('opacity', 0);
+ $$.observeInserted($$.selectChart);
+ binding = false;
+ }
+ $$.selectChart.html("").classed("c3", true);
+
+ // Init data as targets
+ $$.data.xs = {};
+ $$.data.targets = $$.convertDataToTargets(data);
+
+ if (config.data_filter) {
+ $$.data.targets = $$.data.targets.filter(config.data_filter);
+ }
+
+ // Set targets to hide if needed
+ if (config.data_hide) {
+ $$.addHiddenTargetIds(config.data_hide === true ? $$.mapToIds($$.data.targets) : config.data_hide);
+ }
+ if (config.legend_hide) {
+ $$.addHiddenLegendIds(config.legend_hide === true ? $$.mapToIds($$.data.targets) : config.legend_hide);
+ }
+
+ // when gauge, hide legend // TODO: fix
+ if ($$.hasType('gauge')) {
+ config.legend_show = false;
+ }
+
+ // Init sizes and scales
+ $$.updateSizes();
+ $$.updateScales();
+
+ // Set domains for each scale
+ $$.x.domain(d3.extent($$.getXDomain($$.data.targets)));
+ $$.y.domain($$.getYDomain($$.data.targets, 'y'));
+ $$.y2.domain($$.getYDomain($$.data.targets, 'y2'));
+ $$.subX.domain($$.x.domain());
+ $$.subY.domain($$.y.domain());
+ $$.subY2.domain($$.y2.domain());
+
+ // Save original x domain for zoom update
+ $$.orgXDomain = $$.x.domain();
+
+ // Set initialized scales to brush and zoom
+ if ($$.brush) { $$.brush.scale($$.subX); }
+ if (config.zoom_enabled) { $$.zoom.scale($$.x); }
+
+ /*-- Basic Elements --*/
+
+ // Define svgs
+ $$.svg = $$.selectChart.append("svg")
+ .style("overflow", "hidden")
+ .on('mouseenter', function () { return config.onmouseover.call($$); })
+ .on('mouseleave', function () { return config.onmouseout.call($$); });
+
+ if ($$.config.svg_classname) {
+ $$.svg.attr('class', $$.config.svg_classname);
+ }
+
+ // Define defs
+ defs = $$.svg.append("defs");
+ $$.clipChart = $$.appendClip(defs, $$.clipId);
+ $$.clipXAxis = $$.appendClip(defs, $$.clipIdForXAxis);
+ $$.clipYAxis = $$.appendClip(defs, $$.clipIdForYAxis);
+ $$.clipGrid = $$.appendClip(defs, $$.clipIdForGrid);
+ $$.clipSubchart = $$.appendClip(defs, $$.clipIdForSubchart);
+ $$.updateSvgSize();
+
+ // Define regions
+ main = $$.main = $$.svg.append("g").attr("transform", $$.getTranslate('main'));
+
+ if ($$.initSubchart) { $$.initSubchart(); }
+ if ($$.initTooltip) { $$.initTooltip(); }
+ if ($$.initLegend) { $$.initLegend(); }
+ if ($$.initTitle) { $$.initTitle(); }
+
+ /*-- Main Region --*/
+
+ // text when empty
+ main.append("text")
+ .attr("class", CLASS.text + ' ' + CLASS.empty)
+ .attr("text-anchor", "middle") // horizontal centering of text at x position in all browsers.
+ .attr("dominant-baseline", "middle"); // vertical centering of text at y position in all browsers, except IE.
+
+ // Regions
+ $$.initRegion();
+
+ // Grids
+ $$.initGrid();
+
+ // Define g for chart area
+ main.append('g')
+ .attr("clip-path", $$.clipPath)
+ .attr('class', CLASS.chart);
+
+ // Grid lines
+ if (config.grid_lines_front) { $$.initGridLines(); }
+
+ // Cover whole with rects for events
+ $$.initEventRect();
+
+ // Define g for chart
+ $$.initChartElements();
+
+ // if zoom privileged, insert rect to forefront
+ // TODO: is this needed?
+ main.insert('rect', config.zoom_privileged ? null : 'g.' + CLASS.regions)
+ .attr('class', CLASS.zoomRect)
+ .attr('width', $$.width)
+ .attr('height', $$.height)
+ .style('opacity', 0)
+ .on("dblclick.zoom", null);
+
+ // Set default extent if defined
+ if (config.axis_x_extent) { $$.brush.extent($$.getDefaultExtent()); }
+
+ // Add Axis
+ $$.axis.init();
+
+ // Set targets
+ $$.updateTargets($$.data.targets);
+
+ // Draw with targets
+ if (binding) {
+ $$.updateDimension();
+ $$.config.oninit.call($$);
+ $$.redraw({
+ withTransition: false,
+ withTransform: true,
+ withUpdateXDomain: true,
+ withUpdateOrgXDomain: true,
+ withTransitionForAxis: false
+ });
+ }
+
+ // Bind resize event
+ $$.bindResize();
+
+ // export element of the chart
+ $$.api.element = $$.selectChart.node();
+ };
+
+ c3_chart_internal_fn.smoothLines = function (el, type) {
+ var $$ = this;
+ if (type === 'grid') {
+ el.each(function () {
+ var g = $$.d3.select(this),
+ x1 = g.attr('x1'),
+ x2 = g.attr('x2'),
+ y1 = g.attr('y1'),
+ y2 = g.attr('y2');
+ g.attr({
+ 'x1': Math.ceil(x1),
+ 'x2': Math.ceil(x2),
+ 'y1': Math.ceil(y1),
+ 'y2': Math.ceil(y2)
+ });
+ });
+ }
+ };
+
+
+ c3_chart_internal_fn.updateSizes = function () {
+ var $$ = this, config = $$.config;
+ var legendHeight = $$.legend ? $$.getLegendHeight() : 0,
+ legendWidth = $$.legend ? $$.getLegendWidth() : 0,
+ legendHeightForBottom = $$.isLegendRight || $$.isLegendInset ? 0 : legendHeight,
+ hasArc = $$.hasArcType(),
+ xAxisHeight = config.axis_rotated || hasArc ? 0 : $$.getHorizontalAxisHeight('x'),
+ subchartHeight = config.subchart_show && !hasArc ? (config.subchart_size_height + xAxisHeight) : 0;
+
+ $$.currentWidth = $$.getCurrentWidth();
+ $$.currentHeight = $$.getCurrentHeight();
+
+ // for main
+ $$.margin = config.axis_rotated ? {
+ top: $$.getHorizontalAxisHeight('y2') + $$.getCurrentPaddingTop(),
+ right: hasArc ? 0 : $$.getCurrentPaddingRight(),
+ bottom: $$.getHorizontalAxisHeight('y') + legendHeightForBottom + $$.getCurrentPaddingBottom(),
+ left: subchartHeight + (hasArc ? 0 : $$.getCurrentPaddingLeft())
+ } : {
+ top: 4 + $$.getCurrentPaddingTop(), // for top tick text
+ right: hasArc ? 0 : $$.getCurrentPaddingRight(),
+ bottom: xAxisHeight + subchartHeight + legendHeightForBottom + $$.getCurrentPaddingBottom(),
+ left: hasArc ? 0 : $$.getCurrentPaddingLeft()
+ };
+
+ // for subchart
+ $$.margin2 = config.axis_rotated ? {
+ top: $$.margin.top,
+ right: NaN,
+ bottom: 20 + legendHeightForBottom,
+ left: $$.rotated_padding_left
+ } : {
+ top: $$.currentHeight - subchartHeight - legendHeightForBottom,
+ right: NaN,
+ bottom: xAxisHeight + legendHeightForBottom,
+ left: $$.margin.left
+ };
+
+ // for legend
+ $$.margin3 = {
+ top: 0,
+ right: NaN,
+ bottom: 0,
+ left: 0
+ };
+ if ($$.updateSizeForLegend) { $$.updateSizeForLegend(legendHeight, legendWidth); }
+
+ $$.width = $$.currentWidth - $$.margin.left - $$.margin.right;
+ $$.height = $$.currentHeight - $$.margin.top - $$.margin.bottom;
+ if ($$.width < 0) { $$.width = 0; }
+ if ($$.height < 0) { $$.height = 0; }
+
+ $$.width2 = config.axis_rotated ? $$.margin.left - $$.rotated_padding_left - $$.rotated_padding_right : $$.width;
+ $$.height2 = config.axis_rotated ? $$.height : $$.currentHeight - $$.margin2.top - $$.margin2.bottom;
+ if ($$.width2 < 0) { $$.width2 = 0; }
+ if ($$.height2 < 0) { $$.height2 = 0; }
+
+ // for arc
+ $$.arcWidth = $$.width - ($$.isLegendRight ? legendWidth + 10 : 0);
+ $$.arcHeight = $$.height - ($$.isLegendRight ? 0 : 10);
+ if ($$.hasType('gauge')) {
+ $$.arcHeight += $$.height - $$.getGaugeLabelHeight();
+ }
+ if ($$.updateRadius) { $$.updateRadius(); }
+
+ if ($$.isLegendRight && hasArc) {
+ $$.margin3.left = $$.arcWidth / 2 + $$.radiusExpanded * 1.1;
+ }
+ };
+
+ c3_chart_internal_fn.updateTargets = function (targets) {
+ var $$ = this;
+
+ /*-- Main --*/
+
+ //-- Text --//
+ $$.updateTargetsForText(targets);
+
+ //-- Bar --//
+ $$.updateTargetsForBar(targets);
+
+ //-- Line --//
+ $$.updateTargetsForLine(targets);
+
+ //-- Arc --//
+ if ($$.hasArcType() && $$.updateTargetsForArc) { $$.updateTargetsForArc(targets); }
+
+ /*-- Sub --*/
+
+ if ($$.updateTargetsForSubchart) { $$.updateTargetsForSubchart(targets); }
+
+ // Fade-in each chart
+ $$.showTargets();
+ };
+ c3_chart_internal_fn.showTargets = function () {
+ var $$ = this;
+ $$.svg.selectAll('.' + CLASS.target).filter(function (d) { return $$.isTargetToShow(d.id); })
+ .transition().duration($$.config.transition_duration)
+ .style("opacity", 1);
+ };
+
+ c3_chart_internal_fn.redraw = function (options, transitions) {
+ var $$ = this, main = $$.main, d3 = $$.d3, config = $$.config;
+ var areaIndices = $$.getShapeIndices($$.isAreaType), barIndices = $$.getShapeIndices($$.isBarType), lineIndices = $$.getShapeIndices($$.isLineType);
+ var withY, withSubchart, withTransition, withTransitionForExit, withTransitionForAxis,
+ withTransform, withUpdateXDomain, withUpdateOrgXDomain, withTrimXDomain, withLegend,
+ withEventRect, withDimension, withUpdateXAxis;
+ var hideAxis = $$.hasArcType();
+ var drawArea, drawBar, drawLine, xForText, yForText;
+ var duration, durationForExit, durationForAxis;
+ var waitForDraw, flow;
+ var targetsToShow = $$.filterTargetsToShow($$.data.targets), tickValues, i, intervalForCulling, xDomainForZoom;
+ var xv = $$.xv.bind($$), cx, cy;
+
+ options = options || {};
+ withY = getOption(options, "withY", true);
+ withSubchart = getOption(options, "withSubchart", true);
+ withTransition = getOption(options, "withTransition", true);
+ withTransform = getOption(options, "withTransform", false);
+ withUpdateXDomain = getOption(options, "withUpdateXDomain", false);
+ withUpdateOrgXDomain = getOption(options, "withUpdateOrgXDomain", false);
+ withTrimXDomain = getOption(options, "withTrimXDomain", true);
+ withUpdateXAxis = getOption(options, "withUpdateXAxis", withUpdateXDomain);
+ withLegend = getOption(options, "withLegend", false);
+ withEventRect = getOption(options, "withEventRect", true);
+ withDimension = getOption(options, "withDimension", true);
+ withTransitionForExit = getOption(options, "withTransitionForExit", withTransition);
+ withTransitionForAxis = getOption(options, "withTransitionForAxis", withTransition);
+
+ duration = withTransition ? config.transition_duration : 0;
+ durationForExit = withTransitionForExit ? duration : 0;
+ durationForAxis = withTransitionForAxis ? duration : 0;
+
+ transitions = transitions || $$.axis.generateTransitions(durationForAxis);
+
+ // update legend and transform each g
+ if (withLegend && config.legend_show) {
+ $$.updateLegend($$.mapToIds($$.data.targets), options, transitions);
+ } else if (withDimension) {
+ // need to update dimension (e.g. axis.y.tick.values) because y tick values should change
+ // no need to update axis in it because they will be updated in redraw()
+ $$.updateDimension(true);
+ }
+
+ // MEMO: needed for grids calculation
+ if ($$.isCategorized() && targetsToShow.length === 0) {
+ $$.x.domain([0, $$.axes.x.selectAll('.tick').size()]);
+ }
+
+ if (targetsToShow.length) {
+ $$.updateXDomain(targetsToShow, withUpdateXDomain, withUpdateOrgXDomain, withTrimXDomain);
+ if (!config.axis_x_tick_values) {
+ tickValues = $$.axis.updateXAxisTickValues(targetsToShow);
+ }
+ } else {
+ $$.xAxis.tickValues([]);
+ $$.subXAxis.tickValues([]);
+ }
+
+ if (config.zoom_rescale && !options.flow) {
+ xDomainForZoom = $$.x.orgDomain();
+ }
+
+ $$.y.domain($$.getYDomain(targetsToShow, 'y', xDomainForZoom));
+ $$.y2.domain($$.getYDomain(targetsToShow, 'y2', xDomainForZoom));
+
+ if (!config.axis_y_tick_values && config.axis_y_tick_count) {
+ $$.yAxis.tickValues($$.axis.generateTickValues($$.y.domain(), config.axis_y_tick_count));
+ }
+ if (!config.axis_y2_tick_values && config.axis_y2_tick_count) {
+ $$.y2Axis.tickValues($$.axis.generateTickValues($$.y2.domain(), config.axis_y2_tick_count));
+ }
+
+ // axes
+ $$.axis.redraw(transitions, hideAxis);
+
+ // Update axis label
+ $$.axis.updateLabels(withTransition);
+
+ // show/hide if manual culling needed
+ if ((withUpdateXDomain || withUpdateXAxis) && targetsToShow.length) {
+ if (config.axis_x_tick_culling && tickValues) {
+ for (i = 1; i < tickValues.length; i++) {
+ if (tickValues.length / i < config.axis_x_tick_culling_max) {
+ intervalForCulling = i;
+ break;
+ }
+ }
+ $$.svg.selectAll('.' + CLASS.axisX + ' .tick text').each(function (e) {
+ var index = tickValues.indexOf(e);
+ if (index >= 0) {
+ d3.select(this).style('display', index % intervalForCulling ? 'none' : 'block');
+ }
+ });
+ } else {
+ $$.svg.selectAll('.' + CLASS.axisX + ' .tick text').style('display', 'block');
+ }
+ }
+
+ // setup drawer - MEMO: these must be called after axis updated
+ drawArea = $$.generateDrawArea ? $$.generateDrawArea(areaIndices, false) : undefined;
+ drawBar = $$.generateDrawBar ? $$.generateDrawBar(barIndices) : undefined;
+ drawLine = $$.generateDrawLine ? $$.generateDrawLine(lineIndices, false) : undefined;
+ xForText = $$.generateXYForText(areaIndices, barIndices, lineIndices, true);
+ yForText = $$.generateXYForText(areaIndices, barIndices, lineIndices, false);
+
+ // Update sub domain
+ if (withY) {
+ $$.subY.domain($$.getYDomain(targetsToShow, 'y'));
+ $$.subY2.domain($$.getYDomain(targetsToShow, 'y2'));
+ }
+
+ // xgrid focus
+ $$.updateXgridFocus();
+
+ // Data empty label positioning and text.
+ main.select("text." + CLASS.text + '.' + CLASS.empty)
+ .attr("x", $$.width / 2)
+ .attr("y", $$.height / 2)
+ .text(config.data_empty_label_text)
+ .transition()
+ .style('opacity', targetsToShow.length ? 0 : 1);
+
+ // grid
+ $$.updateGrid(duration);
+
+ // rect for regions
+ $$.updateRegion(duration);
+
+ // bars
+ $$.updateBar(durationForExit);
+
+ // lines, areas and cricles
+ $$.updateLine(durationForExit);
+ $$.updateArea(durationForExit);
+ $$.updateCircle();
+
+ // text
+ if ($$.hasDataLabel()) {
+ $$.updateText(durationForExit);
+ }
+
+ // title
+ if ($$.redrawTitle) { $$.redrawTitle(); }
+
+ // arc
+ if ($$.redrawArc) { $$.redrawArc(duration, durationForExit, withTransform); }
+
+ // subchart
+ if ($$.redrawSubchart) {
+ $$.redrawSubchart(withSubchart, transitions, duration, durationForExit, areaIndices, barIndices, lineIndices);
+ }
+
+ // circles for select
+ main.selectAll('.' + CLASS.selectedCircles)
+ .filter($$.isBarType.bind($$))
+ .selectAll('circle')
+ .remove();
+
+ // event rects will redrawn when flow called
+ if (config.interaction_enabled && !options.flow && withEventRect) {
+ $$.redrawEventRect();
+ if ($$.updateZoom) { $$.updateZoom(); }
+ }
+
+ // update circleY based on updated parameters
+ $$.updateCircleY();
+
+ // generate circle x/y functions depending on updated params
+ cx = ($$.config.axis_rotated ? $$.circleY : $$.circleX).bind($$);
+ cy = ($$.config.axis_rotated ? $$.circleX : $$.circleY).bind($$);
+
+ if (options.flow) {
+ flow = $$.generateFlow({
+ targets: targetsToShow,
+ flow: options.flow,
+ duration: options.flow.duration,
+ drawBar: drawBar,
+ drawLine: drawLine,
+ drawArea: drawArea,
+ cx: cx,
+ cy: cy,
+ xv: xv,
+ xForText: xForText,
+ yForText: yForText
+ });
+ }
+
+ if ((duration || flow) && $$.isTabVisible()) { // Only use transition if tab visible. See #938.
+ // transition should be derived from one transition
+ d3.transition().duration(duration).each(function () {
+ var transitionsToWait = [];
+
+ // redraw and gather transitions
+ [
+ $$.redrawBar(drawBar, true),
+ $$.redrawLine(drawLine, true),
+ $$.redrawArea(drawArea, true),
+ $$.redrawCircle(cx, cy, true),
+ $$.redrawText(xForText, yForText, options.flow, true),
+ $$.redrawRegion(true),
+ $$.redrawGrid(true),
+ ].forEach(function (transitions) {
+ transitions.forEach(function (transition) {
+ transitionsToWait.push(transition);
+ });
+ });
+
+ // Wait for end of transitions to call flow and onrendered callback
+ waitForDraw = $$.generateWait();
+ transitionsToWait.forEach(function (t) {
+ waitForDraw.add(t);
+ });
+ })
+ .call(waitForDraw, function () {
+ if (flow) {
+ flow();
+ }
+ if (config.onrendered) {
+ config.onrendered.call($$);
+ }
+ });
+ }
+ else {
+ $$.redrawBar(drawBar);
+ $$.redrawLine(drawLine);
+ $$.redrawArea(drawArea);
+ $$.redrawCircle(cx, cy);
+ $$.redrawText(xForText, yForText, options.flow);
+ $$.redrawRegion();
+ $$.redrawGrid();
+ if (config.onrendered) {
+ config.onrendered.call($$);
+ }
+ }
+
+ // update fadein condition
+ $$.mapToIds($$.data.targets).forEach(function (id) {
+ $$.withoutFadeIn[id] = true;
+ });
+ };
+
+ c3_chart_internal_fn.updateAndRedraw = function (options) {
+ var $$ = this, config = $$.config, transitions;
+ options = options || {};
+ // same with redraw
+ options.withTransition = getOption(options, "withTransition", true);
+ options.withTransform = getOption(options, "withTransform", false);
+ options.withLegend = getOption(options, "withLegend", false);
+ // NOT same with redraw
+ options.withUpdateXDomain = true;
+ options.withUpdateOrgXDomain = true;
+ options.withTransitionForExit = false;
+ options.withTransitionForTransform = getOption(options, "withTransitionForTransform", options.withTransition);
+ // MEMO: this needs to be called before updateLegend and it means this ALWAYS needs to be called)
+ $$.updateSizes();
+ // MEMO: called in updateLegend in redraw if withLegend
+ if (!(options.withLegend && config.legend_show)) {
+ transitions = $$.axis.generateTransitions(options.withTransitionForAxis ? config.transition_duration : 0);
+ // Update scales
+ $$.updateScales();
+ $$.updateSvgSize();
+ // Update g positions
+ $$.transformAll(options.withTransitionForTransform, transitions);
+ }
+ // Draw with new sizes & scales
+ $$.redraw(options, transitions);
+ };
+ c3_chart_internal_fn.redrawWithoutRescale = function () {
+ this.redraw({
+ withY: false,
+ withSubchart: false,
+ withEventRect: false,
+ withTransitionForAxis: false
+ });
+ };
+
+ c3_chart_internal_fn.isTimeSeries = function () {
+ return this.config.axis_x_type === 'timeseries';
+ };
+ c3_chart_internal_fn.isCategorized = function () {
+ return this.config.axis_x_type.indexOf('categor') >= 0;
+ };
+ c3_chart_internal_fn.isCustomX = function () {
+ var $$ = this, config = $$.config;
+ return !$$.isTimeSeries() && (config.data_x || notEmpty(config.data_xs));
+ };
+
+ c3_chart_internal_fn.isTimeSeriesY = function () {
+ return this.config.axis_y_type === 'timeseries';
+ };
+
+ c3_chart_internal_fn.getTranslate = function (target) {
+ var $$ = this, config = $$.config, x, y;
+ if (target === 'main') {
+ x = asHalfPixel($$.margin.left);
+ y = asHalfPixel($$.margin.top);
+ } else if (target === 'context') {
+ x = asHalfPixel($$.margin2.left);
+ y = asHalfPixel($$.margin2.top);
+ } else if (target === 'legend') {
+ x = $$.margin3.left;
+ y = $$.margin3.top;
+ } else if (target === 'x') {
+ x = 0;
+ y = config.axis_rotated ? 0 : $$.height;
+ } else if (target === 'y') {
+ x = 0;
+ y = config.axis_rotated ? $$.height : 0;
+ } else if (target === 'y2') {
+ x = config.axis_rotated ? 0 : $$.width;
+ y = config.axis_rotated ? 1 : 0;
+ } else if (target === 'subx') {
+ x = 0;
+ y = config.axis_rotated ? 0 : $$.height2;
+ } else if (target === 'arc') {
+ x = $$.arcWidth / 2;
+ y = $$.arcHeight / 2;
+ }
+ return "translate(" + x + "," + y + ")";
+ };
+ c3_chart_internal_fn.initialOpacity = function (d) {
+ return d.value !== null && this.withoutFadeIn[d.id] ? 1 : 0;
+ };
+ c3_chart_internal_fn.initialOpacityForCircle = function (d) {
+ return d.value !== null && this.withoutFadeIn[d.id] ? this.opacityForCircle(d) : 0;
+ };
+ c3_chart_internal_fn.opacityForCircle = function (d) {
+ var opacity = this.config.point_show ? 1 : 0;
+ return isValue(d.value) ? (this.isScatterType(d) ? 0.5 : opacity) : 0;
+ };
+ c3_chart_internal_fn.opacityForText = function () {
+ return this.hasDataLabel() ? 1 : 0;
+ };
+ c3_chart_internal_fn.xx = function (d) {
+ return d ? this.x(d.x) : null;
+ };
+ c3_chart_internal_fn.xv = function (d) {
+ var $$ = this, value = d.value;
+ if ($$.isTimeSeries()) {
+ value = $$.parseDate(d.value);
+ }
+ else if ($$.isCategorized() && typeof d.value === 'string') {
+ value = $$.config.axis_x_categories.indexOf(d.value);
+ }
+ return Math.ceil($$.x(value));
+ };
+ c3_chart_internal_fn.yv = function (d) {
+ var $$ = this,
+ yScale = d.axis && d.axis === 'y2' ? $$.y2 : $$.y;
+ return Math.ceil(yScale(d.value));
+ };
+ c3_chart_internal_fn.subxx = function (d) {
+ return d ? this.subX(d.x) : null;
+ };
+
+ c3_chart_internal_fn.transformMain = function (withTransition, transitions) {
+ var $$ = this,
+ xAxis, yAxis, y2Axis;
+ if (transitions && transitions.axisX) {
+ xAxis = transitions.axisX;
+ } else {
+ xAxis = $$.main.select('.' + CLASS.axisX);
+ if (withTransition) { xAxis = xAxis.transition(); }
+ }
+ if (transitions && transitions.axisY) {
+ yAxis = transitions.axisY;
+ } else {
+ yAxis = $$.main.select('.' + CLASS.axisY);
+ if (withTransition) { yAxis = yAxis.transition(); }
+ }
+ if (transitions && transitions.axisY2) {
+ y2Axis = transitions.axisY2;
+ } else {
+ y2Axis = $$.main.select('.' + CLASS.axisY2);
+ if (withTransition) { y2Axis = y2Axis.transition(); }
+ }
+ (withTransition ? $$.main.transition() : $$.main).attr("transform", $$.getTranslate('main'));
+ xAxis.attr("transform", $$.getTranslate('x'));
+ yAxis.attr("transform", $$.getTranslate('y'));
+ y2Axis.attr("transform", $$.getTranslate('y2'));
+ $$.main.select('.' + CLASS.chartArcs).attr("transform", $$.getTranslate('arc'));
+ };
+ c3_chart_internal_fn.transformAll = function (withTransition, transitions) {
+ var $$ = this;
+ $$.transformMain(withTransition, transitions);
+ if ($$.config.subchart_show) { $$.transformContext(withTransition, transitions); }
+ if ($$.legend) { $$.transformLegend(withTransition); }
+ };
+
+ c3_chart_internal_fn.updateSvgSize = function () {
+ var $$ = this,
+ brush = $$.svg.select(".c3-brush .background");
+ $$.svg.attr('width', $$.currentWidth).attr('height', $$.currentHeight);
+ $$.svg.selectAll(['#' + $$.clipId, '#' + $$.clipIdForGrid]).select('rect')
+ .attr('width', $$.width)
+ .attr('height', $$.height);
+ $$.svg.select('#' + $$.clipIdForXAxis).select('rect')
+ .attr('x', $$.getXAxisClipX.bind($$))
+ .attr('y', $$.getXAxisClipY.bind($$))
+ .attr('width', $$.getXAxisClipWidth.bind($$))
+ .attr('height', $$.getXAxisClipHeight.bind($$));
+ $$.svg.select('#' + $$.clipIdForYAxis).select('rect')
+ .attr('x', $$.getYAxisClipX.bind($$))
+ .attr('y', $$.getYAxisClipY.bind($$))
+ .attr('width', $$.getYAxisClipWidth.bind($$))
+ .attr('height', $$.getYAxisClipHeight.bind($$));
+ $$.svg.select('#' + $$.clipIdForSubchart).select('rect')
+ .attr('width', $$.width)
+ .attr('height', brush.size() ? brush.attr('height') : 0);
+ $$.svg.select('.' + CLASS.zoomRect)
+ .attr('width', $$.width)
+ .attr('height', $$.height);
+ // MEMO: parent div's height will be bigger than svg when <!DOCTYPE html>
+ $$.selectChart.style('max-height', $$.currentHeight + "px");
+ };
+
+
+ c3_chart_internal_fn.updateDimension = function (withoutAxis) {
+ var $$ = this;
+ if (!withoutAxis) {
+ if ($$.config.axis_rotated) {
+ $$.axes.x.call($$.xAxis);
+ $$.axes.subx.call($$.subXAxis);
+ } else {
+ $$.axes.y.call($$.yAxis);
+ $$.axes.y2.call($$.y2Axis);
+ }
+ }
+ $$.updateSizes();
+ $$.updateScales();
+ $$.updateSvgSize();
+ $$.transformAll(false);
+ };
+
+ c3_chart_internal_fn.observeInserted = function (selection) {
+ var $$ = this, observer;
+ if (typeof MutationObserver === 'undefined') {
+ window.console.error("MutationObserver not defined.");
+ return;
+ }
+ observer= new MutationObserver(function (mutations) {
+ mutations.forEach(function (mutation) {
+ if (mutation.type === 'childList' && mutation.previousSibling) {
+ observer.disconnect();
+ // need to wait for completion of load because size calculation requires the actual sizes determined after that completion
+ $$.intervalForObserveInserted = window.setInterval(function () {
+ // parentNode will NOT be null when completed
+ if (selection.node().parentNode) {
+ window.clearInterval($$.intervalForObserveInserted);
+ $$.updateDimension();
+ if ($$.brush) { $$.brush.update(); }
+ $$.config.oninit.call($$);
+ $$.redraw({
+ withTransform: true,
+ withUpdateXDomain: true,
+ withUpdateOrgXDomain: true,
+ withTransition: false,
+ withTransitionForTransform: false,
+ withLegend: true
+ });
+ selection.transition().style('opacity', 1);
+ }
+ }, 10);
+ }
+ });
+ });
+ observer.observe(selection.node(), {attributes: true, childList: true, characterData: true});
+ };
+
+ c3_chart_internal_fn.bindResize = function () {
+ var $$ = this, config = $$.config;
+
+ $$.resizeFunction = $$.generateResize();
+
+ $$.resizeFunction.add(function () {
+ config.onresize.call($$);
+ });
+ if (config.resize_auto) {
+ $$.resizeFunction.add(function () {
+ if ($$.resizeTimeout !== undefined) {
+ window.clearTimeout($$.resizeTimeout);
+ }
+ $$.resizeTimeout = window.setTimeout(function () {
+ delete $$.resizeTimeout;
+ $$.api.flush();
+ }, 100);
+ });
+ }
+ $$.resizeFunction.add(function () {
+ config.onresized.call($$);
+ });
+
+ if (window.attachEvent) {
+ window.attachEvent('onresize', $$.resizeFunction);
+ } else if (window.addEventListener) {
+ window.addEventListener('resize', $$.resizeFunction, false);
+ } else {
+ // fallback to this, if this is a very old browser
+ var wrapper = window.onresize;
+ if (!wrapper) {
+ // create a wrapper that will call all charts
+ wrapper = $$.generateResize();
+ } else if (!wrapper.add || !wrapper.remove) {
+ // there is already a handler registered, make sure we call it too
+ wrapper = $$.generateResize();
+ wrapper.add(window.onresize);
+ }
+ // add this graph to the wrapper, we will be removed if the user calls destroy
+ wrapper.add($$.resizeFunction);
+ window.onresize = wrapper;
+ }
+ };
+
+ c3_chart_internal_fn.generateResize = function () {
+ var resizeFunctions = [];
+ function callResizeFunctions() {
+ resizeFunctions.forEach(function (f) {
+ f();
+ });
+ }
+ callResizeFunctions.add = function (f) {
+ resizeFunctions.push(f);
+ };
+ callResizeFunctions.remove = function (f) {
+ for (var i = 0; i < resizeFunctions.length; i++) {
+ if (resizeFunctions[i] === f) {
+ resizeFunctions.splice(i, 1);
+ break;
+ }
+ }
+ };
+ return callResizeFunctions;
+ };
+
+ c3_chart_internal_fn.endall = function (transition, callback) {
+ var n = 0;
+ transition
+ .each(function () { ++n; })
+ .each("end", function () {
+ if (!--n) { callback.apply(this, arguments); }
+ });
+ };
+ c3_chart_internal_fn.generateWait = function () {
+ var transitionsToWait = [],
+ f = function (transition, callback) {
+ var timer = setInterval(function () {
+ var done = 0;
+ transitionsToWait.forEach(function (t) {
+ if (t.empty()) {
+ done += 1;
+ return;
+ }
+ try {
+ t.transition();
+ } catch (e) {
+ done += 1;
+ }
+ });
+ if (done === transitionsToWait.length) {
+ clearInterval(timer);
+ if (callback) { callback(); }
+ }
+ }, 10);
+ };
+ f.add = function (transition) {
+ transitionsToWait.push(transition);
+ };
+ return f;
+ };
+
+ c3_chart_internal_fn.parseDate = function (date) {
+ var $$ = this, parsedDate;
+ if (date instanceof Date) {
+ parsedDate = date;
+ } else if (typeof date === 'string') {
+ parsedDate = $$.dataTimeFormat($$.config.data_xFormat).parse(date);
+ } else if (typeof date === 'number' && !isNaN(date)) {
+ parsedDate = new Date(+date);
+ }
+ if (!parsedDate || isNaN(+parsedDate)) {
+ window.console.error("Failed to parse x '" + date + "' to Date object");
+ }
+ return parsedDate;
+ };
+
+ c3_chart_internal_fn.isTabVisible = function () {
+ var hidden;
+ if (typeof document.hidden !== "undefined") { // Opera 12.10 and Firefox 18 and later support
+ hidden = "hidden";
+ } else if (typeof document.mozHidden !== "undefined") {
+ hidden = "mozHidden";
+ } else if (typeof document.msHidden !== "undefined") {
+ hidden = "msHidden";
+ } else if (typeof document.webkitHidden !== "undefined") {
+ hidden = "webkitHidden";
+ }
+
+ return document[hidden] ? false : true;
+ };
+
+ c3_chart_internal_fn.getDefaultConfig = function () {
+ var config = {
+ bindto: '#chart',
+ svg_classname: undefined,
+ size_width: undefined,
+ size_height: undefined,
+ padding_left: undefined,
+ padding_right: undefined,
+ padding_top: undefined,
+ padding_bottom: undefined,
+ resize_auto: true,
+ zoom_enabled: false,
+ zoom_extent: undefined,
+ zoom_privileged: false,
+ zoom_rescale: false,
+ zoom_onzoom: function () {},
+ zoom_onzoomstart: function () {},
+ zoom_onzoomend: function () {},
+ zoom_x_min: undefined,
+ zoom_x_max: undefined,
+ interaction_enabled: true,
+ onmouseover: function () {},
+ onmouseout: function () {},
+ onresize: function () {},
+ onresized: function () {},
+ oninit: function () {},
+ onrendered: function () {},
+ transition_duration: 350,
+ data_x: undefined,
+ data_xs: {},
+ data_xFormat: '%Y-%m-%d',
+ data_xLocaltime: true,
+ data_xSort: true,
+ data_idConverter: function (id) { return id; },
+ data_names: {},
+ data_classes: {},
+ data_groups: [],
+ data_axes: {},
+ data_type: undefined,
+ data_types: {},
+ data_labels: {},
+ data_order: 'desc',
+ data_regions: {},
+ data_color: undefined,
+ data_colors: {},
+ data_hide: false,
+ data_filter: undefined,
+ data_selection_enabled: false,
+ data_selection_grouped: false,
+ data_selection_isselectable: function () { return true; },
+ data_selection_multiple: true,
+ data_selection_draggable: false,
+ data_onclick: function () {},
+ data_onmouseover: function () {},
+ data_onmouseout: function () {},
+ data_onselected: function () {},
+ data_onunselected: function () {},
+ data_url: undefined,
+ data_json: undefined,
+ data_rows: undefined,
+ data_columns: undefined,
+ data_mimeType: undefined,
+ data_keys: undefined,
+ // configuration for no plot-able data supplied.
+ data_empty_label_text: "",
+ // subchart
+ subchart_show: false,
+ subchart_size_height: 60,
+ subchart_axis_x_show: true,
+ subchart_onbrush: function () {},
+ // color
+ color_pattern: [],
+ color_threshold: {},
+ // legend
+ legend_show: true,
+ legend_hide: false,
+ legend_position: 'bottom',
+ legend_inset_anchor: 'top-left',
+ legend_inset_x: 10,
+ legend_inset_y: 0,
+ legend_inset_step: undefined,
+ legend_item_onclick: undefined,
+ legend_item_onmouseover: undefined,
+ legend_item_onmouseout: undefined,
+ legend_equally: false,
+ legend_padding: 0,
+ legend_item_tile_width: 10,
+ legend_item_tile_height: 10,
+ // axis
+ axis_rotated: false,
+ axis_x_show: true,
+ axis_x_type: 'indexed',
+ axis_x_localtime: true,
+ axis_x_categories: [],
+ axis_x_tick_centered: false,
+ axis_x_tick_format: undefined,
+ axis_x_tick_culling: {},
+ axis_x_tick_culling_max: 10,
+ axis_x_tick_count: undefined,
+ axis_x_tick_fit: true,
+ axis_x_tick_values: null,
+ axis_x_tick_rotate: 0,
+ axis_x_tick_outer: true,
+ axis_x_tick_multiline: true,
+ axis_x_tick_width: null,
+ axis_x_max: undefined,
+ axis_x_min: undefined,
+ axis_x_padding: {},
+ axis_x_height: undefined,
+ axis_x_extent: undefined,
+ axis_x_label: {},
+ axis_y_show: true,
+ axis_y_type: undefined,
+ axis_y_max: undefined,
+ axis_y_min: undefined,
+ axis_y_inverted: false,
+ axis_y_center: undefined,
+ axis_y_inner: undefined,
+ axis_y_label: {},
+ axis_y_tick_format: undefined,
+ axis_y_tick_outer: true,
+ axis_y_tick_values: null,
+ axis_y_tick_count: undefined,
+ axis_y_tick_time_value: undefined,
+ axis_y_tick_time_interval: undefined,
+ axis_y_padding: {},
+ axis_y_default: undefined,
+ axis_y2_show: false,
+ axis_y2_max: undefined,
+ axis_y2_min: undefined,
+ axis_y2_inverted: false,
+ axis_y2_center: undefined,
+ axis_y2_inner: undefined,
+ axis_y2_label: {},
+ axis_y2_tick_format: undefined,
+ axis_y2_tick_outer: true,
+ axis_y2_tick_values: null,
+ axis_y2_tick_count: undefined,
+ axis_y2_padding: {},
+ axis_y2_default: undefined,
+ // grid
+ grid_x_show: false,
+ grid_x_type: 'tick',
+ grid_x_lines: [],
+ grid_y_show: false,
+ // not used
+ // grid_y_type: 'tick',
+ grid_y_lines: [],
+ grid_y_ticks: 10,
+ grid_focus_show: true,
+ grid_lines_front: true,
+ // point - point of each data
+ point_show: true,
+ point_r: 2.5,
+ point_sensitivity: 10,
+ point_focus_expand_enabled: true,
+ point_focus_expand_r: undefined,
+ point_select_r: undefined,
+ // line
+ line_connectNull: false,
+ line_step_type: 'step',
+ // bar
+ bar_width: undefined,
+ bar_width_ratio: 0.6,
+ bar_width_max: undefined,
+ bar_zerobased: true,
+ // area
+ area_zerobased: true,
+ // pie
+ pie_label_show: true,
+ pie_label_format: undefined,
+ pie_label_threshold: 0.05,
+ pie_expand: {},
+ pie_expand_duration: 50,
+ // gauge
+ gauge_label_show: true,
+ gauge_label_format: undefined,
+ gauge_min: 0,
+ gauge_max: 100,
+ gauge_units: undefined,
+ gauge_width: undefined,
+ gauge_expand: {},
+ gauge_expand_duration: 50,
+ // donut
+ donut_label_show: true,
+ donut_label_format: undefined,
+ donut_label_threshold: 0.05,
+ donut_width: undefined,
+ donut_title: "",
+ donut_expand: {},
+ donut_expand_duration: 50,
+ // spline
+ spline_interpolation_type: 'cardinal',
+ // region - region to change style
+ regions: [],
+ // tooltip - show when mouseover on each data
+ tooltip_show: true,
+ tooltip_grouped: true,
+ tooltip_format_title: undefined,
+ tooltip_format_name: undefined,
+ tooltip_format_value: undefined,
+ tooltip_position: undefined,
+ tooltip_contents: function (d, defaultTitleFormat, defaultValueFormat, color) {
+ return this.getTooltipContent ? this.getTooltipContent(d, defaultTitleFormat, defaultValueFormat, color) : '';
+ },
+ tooltip_init_show: false,
+ tooltip_init_x: 0,
+ tooltip_init_position: {top: '0px', left: '50px'},
+ tooltip_onshow: function () {},
+ tooltip_onhide: function () {},
+ // title
+ title_text: undefined,
+ title_padding: {
+ top: 0,
+ right: 0,
+ bottom: 0,
+ left: 0
+ },
+ title_position: 'top-center',
+ };
+
+ Object.keys(this.additionalConfig).forEach(function (key) {
+ config[key] = this.additionalConfig[key];
+ }, this);
+
+ return config;
+ };
+ c3_chart_internal_fn.additionalConfig = {};
+
+ c3_chart_internal_fn.loadConfig = function (config) {
+ var this_config = this.config, target, keys, read;
+ function find() {
+ var key = keys.shift();
+ // console.log("key =>", key, ", target =>", target);
+ if (key && target && typeof target === 'object' && key in target) {
+ target = target[key];
+ return find();
+ }
+ else if (!key) {
+ return target;
+ }
+ else {
+ return undefined;
+ }
+ }
+ Object.keys(this_config).forEach(function (key) {
+ target = config;
+ keys = key.split('_');
+ read = find();
+ // console.log("CONFIG : ", key, read);
+ if (isDefined(read)) {
+ this_config[key] = read;
+ }
+ });
+ };
+
+ c3_chart_internal_fn.getScale = function (min, max, forTimeseries) {
+ return (forTimeseries ? this.d3.time.scale() : this.d3.scale.linear()).range([min, max]);
+ };
+ c3_chart_internal_fn.getX = function (min, max, domain, offset) {
+ var $$ = this,
+ scale = $$.getScale(min, max, $$.isTimeSeries()),
+ _scale = domain ? scale.domain(domain) : scale, key;
+ // Define customized scale if categorized axis
+ if ($$.isCategorized()) {
+ offset = offset || function () { return 0; };
+ scale = function (d, raw) {
+ var v = _scale(d) + offset(d);
+ return raw ? v : Math.ceil(v);
+ };
+ } else {
+ scale = function (d, raw) {
+ var v = _scale(d);
+ return raw ? v : Math.ceil(v);
+ };
+ }
+ // define functions
+ for (key in _scale) {
+ scale[key] = _scale[key];
+ }
+ scale.orgDomain = function () {
+ return _scale.domain();
+ };
+ // define custom domain() for categorized axis
+ if ($$.isCategorized()) {
+ scale.domain = function (domain) {
+ if (!arguments.length) {
+ domain = this.orgDomain();
+ return [domain[0], domain[1] + 1];
+ }
+ _scale.domain(domain);
+ return scale;
+ };
+ }
+ return scale;
+ };
+ c3_chart_internal_fn.getY = function (min, max, domain) {
+ var scale = this.getScale(min, max, this.isTimeSeriesY());
+ if (domain) { scale.domain(domain); }
+ return scale;
+ };
+ c3_chart_internal_fn.getYScale = function (id) {
+ return this.axis.getId(id) === 'y2' ? this.y2 : this.y;
+ };
+ c3_chart_internal_fn.getSubYScale = function (id) {
+ return this.axis.getId(id) === 'y2' ? this.subY2 : this.subY;
+ };
+ c3_chart_internal_fn.updateScales = function () {
+ var $$ = this, config = $$.config,
+ forInit = !$$.x;
+ // update edges
+ $$.xMin = config.axis_rotated ? 1 : 0;
+ $$.xMax = config.axis_rotated ? $$.height : $$.width;
+ $$.yMin = config.axis_rotated ? 0 : $$.height;
+ $$.yMax = config.axis_rotated ? $$.width : 1;
+ $$.subXMin = $$.xMin;
+ $$.subXMax = $$.xMax;
+ $$.subYMin = config.axis_rotated ? 0 : $$.height2;
+ $$.subYMax = config.axis_rotated ? $$.width2 : 1;
+ // update scales
+ $$.x = $$.getX($$.xMin, $$.xMax, forInit ? undefined : $$.x.orgDomain(), function () { return $$.xAxis.tickOffset(); });
+ $$.y = $$.getY($$.yMin, $$.yMax, forInit ? config.axis_y_default : $$.y.domain());
+ $$.y2 = $$.getY($$.yMin, $$.yMax, forInit ? config.axis_y2_default : $$.y2.domain());
+ $$.subX = $$.getX($$.xMin, $$.xMax, $$.orgXDomain, function (d) { return d % 1 ? 0 : $$.subXAxis.tickOffset(); });
+ $$.subY = $$.getY($$.subYMin, $$.subYMax, forInit ? config.axis_y_default : $$.subY.domain());
+ $$.subY2 = $$.getY($$.subYMin, $$.subYMax, forInit ? config.axis_y2_default : $$.subY2.domain());
+ // update axes
+ $$.xAxisTickFormat = $$.axis.getXAxisTickFormat();
+ $$.xAxisTickValues = $$.axis.getXAxisTickValues();
+ $$.yAxisTickValues = $$.axis.getYAxisTickValues();
+ $$.y2AxisTickValues = $$.axis.getY2AxisTickValues();
+
+ $$.xAxis = $$.axis.getXAxis($$.x, $$.xOrient, $$.xAxisTickFormat, $$.xAxisTickValues, config.axis_x_tick_outer);
+ $$.subXAxis = $$.axis.getXAxis($$.subX, $$.subXOrient, $$.xAxisTickFormat, $$.xAxisTickValues, config.axis_x_tick_outer);
+ $$.yAxis = $$.axis.getYAxis($$.y, $$.yOrient, config.axis_y_tick_format, $$.yAxisTickValues, config.axis_y_tick_outer);
+ $$.y2Axis = $$.axis.getYAxis($$.y2, $$.y2Orient, config.axis_y2_tick_format, $$.y2AxisTickValues, config.axis_y2_tick_outer);
+
+ // Set initialized scales to brush and zoom
+ if (!forInit) {
+ if ($$.brush) { $$.brush.scale($$.subX); }
+ if (config.zoom_enabled) { $$.zoom.scale($$.x); }
+ }
+ // update for arc
+ if ($$.updateArc) { $$.updateArc(); }
+ };
+
+ c3_chart_internal_fn.getYDomainMin = function (targets) {
+ var $$ = this, config = $$.config,
+ ids = $$.mapToIds(targets), ys = $$.getValuesAsIdKeyed(targets),
+ j, k, baseId, idsInGroup, id, hasNegativeValue;
+ if (config.data_groups.length > 0) {
+ hasNegativeValue = $$.hasNegativeValueInTargets(targets);
+ for (j = 0; j < config.data_groups.length; j++) {
+ // Determine baseId
+ idsInGroup = config.data_groups[j].filter(function (id) { return ids.indexOf(id) >= 0; });
+ if (idsInGroup.length === 0) { continue; }
+ baseId = idsInGroup[0];
+ // Consider negative values
+ if (hasNegativeValue && ys[baseId]) {
+ ys[baseId].forEach(function (v, i) {
+ ys[baseId][i] = v < 0 ? v : 0;
+ });
+ }
+ // Compute min
+ for (k = 1; k < idsInGroup.length; k++) {
+ id = idsInGroup[k];
+ if (! ys[id]) { continue; }
+ ys[id].forEach(function (v, i) {
+ if ($$.axis.getId(id) === $$.axis.getId(baseId) && ys[baseId] && !(hasNegativeValue && +v > 0)) {
+ ys[baseId][i] += +v;
+ }
+ });
+ }
+ }
+ }
+ return $$.d3.min(Object.keys(ys).map(function (key) { return $$.d3.min(ys[key]); }));
+ };
+ c3_chart_internal_fn.getYDomainMax = function (targets) {
+ var $$ = this, config = $$.config,
+ ids = $$.mapToIds(targets), ys = $$.getValuesAsIdKeyed(targets),
+ j, k, baseId, idsInGroup, id, hasPositiveValue;
+ if (config.data_groups.length > 0) {
+ hasPositiveValue = $$.hasPositiveValueInTargets(targets);
+ for (j = 0; j < config.data_groups.length; j++) {
+ // Determine baseId
+ idsInGroup = config.data_groups[j].filter(function (id) { return ids.indexOf(id) >= 0; });
+ if (idsInGroup.length === 0) { continue; }
+ baseId = idsInGroup[0];
+ // Consider positive values
+ if (hasPositiveValue && ys[baseId]) {
+ ys[baseId].forEach(function (v, i) {
+ ys[baseId][i] = v > 0 ? v : 0;
+ });
+ }
+ // Compute max
+ for (k = 1; k < idsInGroup.length; k++) {
+ id = idsInGroup[k];
+ if (! ys[id]) { continue; }
+ ys[id].forEach(function (v, i) {
+ if ($$.axis.getId(id) === $$.axis.getId(baseId) && ys[baseId] && !(hasPositiveValue && +v < 0)) {
+ ys[baseId][i] += +v;
+ }
+ });
+ }
+ }
+ }
+ return $$.d3.max(Object.keys(ys).map(function (key) { return $$.d3.max(ys[key]); }));
+ };
+ c3_chart_internal_fn.getYDomain = function (targets, axisId, xDomain) {
+ var $$ = this, config = $$.config,
+ targetsByAxisId = targets.filter(function (t) { return $$.axis.getId(t.id) === axisId; }),
+ yTargets = xDomain ? $$.filterByXDomain(targetsByAxisId, xDomain) : targetsByAxisId,
+ yMin = axisId === 'y2' ? config.axis_y2_min : config.axis_y_min,
+ yMax = axisId === 'y2' ? config.axis_y2_max : config.axis_y_max,
+ yDomainMin = $$.getYDomainMin(yTargets),
+ yDomainMax = $$.getYDomainMax(yTargets),
+ domain, domainLength, padding, padding_top, padding_bottom,
+ center = axisId === 'y2' ? config.axis_y2_center : config.axis_y_center,
+ yDomainAbs, lengths, diff, ratio, isAllPositive, isAllNegative,
+ isZeroBased = ($$.hasType('bar', yTargets) && config.bar_zerobased) || ($$.hasType('area', yTargets) && config.area_zerobased),
+ isInverted = axisId === 'y2' ? config.axis_y2_inverted : config.axis_y_inverted,
+ showHorizontalDataLabel = $$.hasDataLabel() && config.axis_rotated,
+ showVerticalDataLabel = $$.hasDataLabel() && !config.axis_rotated;
+
+ // MEMO: avoid inverting domain unexpectedly
+ yDomainMin = isValue(yMin) ? yMin : isValue(yMax) ? (yDomainMin < yMax ? yDomainMin : yMax - 10) : yDomainMin;
+ yDomainMax = isValue(yMax) ? yMax : isValue(yMin) ? (yMin < yDomainMax ? yDomainMax : yMin + 10) : yDomainMax;
+
+ if (yTargets.length === 0) { // use current domain if target of axisId is none
+ return axisId === 'y2' ? $$.y2.domain() : $$.y.domain();
+ }
+ if (isNaN(yDomainMin)) { // set minimum to zero when not number
+ yDomainMin = 0;
+ }
+ if (isNaN(yDomainMax)) { // set maximum to have same value as yDomainMin
+ yDomainMax = yDomainMin;
+ }
+ if (yDomainMin === yDomainMax) {
+ yDomainMin < 0 ? yDomainMax = 0 : yDomainMin = 0;
+ }
+ isAllPositive = yDomainMin >= 0 && yDomainMax >= 0;
+ isAllNegative = yDomainMin <= 0 && yDomainMax <= 0;
+
+ // Cancel zerobased if axis_*_min / axis_*_max specified
+ if ((isValue(yMin) && isAllPositive) || (isValue(yMax) && isAllNegative)) {
+ isZeroBased = false;
+ }
+
+ // Bar/Area chart should be 0-based if all positive|negative
+ if (isZeroBased) {
+ if (isAllPositive) { yDomainMin = 0; }
+ if (isAllNegative) { yDomainMax = 0; }
+ }
+
+ domainLength = Math.abs(yDomainMax - yDomainMin);
+ padding = padding_top = padding_bottom = domainLength * 0.1;
+
+ if (typeof center !== 'undefined') {
+ yDomainAbs = Math.max(Math.abs(yDomainMin), Math.abs(yDomainMax));
+ yDomainMax = center + yDomainAbs;
+ yDomainMin = center - yDomainAbs;
+ }
+ // add padding for data label
+ if (showHorizontalDataLabel) {
+ lengths = $$.getDataLabelLength(yDomainMin, yDomainMax, 'width');
+ diff = diffDomain($$.y.range());
+ ratio = [lengths[0] / diff, lengths[1] / diff];
+ padding_top += domainLength * (ratio[1] / (1 - ratio[0] - ratio[1]));
+ padding_bottom += domainLength * (ratio[0] / (1 - ratio[0] - ratio[1]));
+ } else if (showVerticalDataLabel) {
+ lengths = $$.getDataLabelLength(yDomainMin, yDomainMax, 'height');
+ padding_top += $$.axis.convertPixelsToAxisPadding(lengths[1], domainLength);
+ padding_bottom += $$.axis.convertPixelsToAxisPadding(lengths[0], domainLength);
+ }
+ if (axisId === 'y' && notEmpty(config.axis_y_padding)) {
+ padding_top = $$.axis.getPadding(config.axis_y_padding, 'top', padding_top, domainLength);
+ padding_bottom = $$.axis.getPadding(config.axis_y_padding, 'bottom', padding_bottom, domainLength);
+ }
+ if (axisId === 'y2' && notEmpty(config.axis_y2_padding)) {
+ padding_top = $$.axis.getPadding(config.axis_y2_padding, 'top', padding_top, domainLength);
+ padding_bottom = $$.axis.getPadding(config.axis_y2_padding, 'bottom', padding_bottom, domainLength);
+ }
+ // Bar/Area chart should be 0-based if all positive|negative
+ if (isZeroBased) {
+ if (isAllPositive) { padding_bottom = yDomainMin; }
+ if (isAllNegative) { padding_top = -yDomainMax; }
+ }
+ domain = [yDomainMin - padding_bottom, yDomainMax + padding_top];
+ return isInverted ? domain.reverse() : domain;
+ };
+ c3_chart_internal_fn.getXDomainMin = function (targets) {
+ var $$ = this, config = $$.config;
+ return isDefined(config.axis_x_min) ?
+ ($$.isTimeSeries() ? this.parseDate(config.axis_x_min) : config.axis_x_min) :
+ $$.d3.min(targets, function (t) { return $$.d3.min(t.values, function (v) { return v.x; }); });
+ };
+ c3_chart_internal_fn.getXDomainMax = function (targets) {
+ var $$ = this, config = $$.config;
+ return isDefined(config.axis_x_max) ?
+ ($$.isTimeSeries() ? this.parseDate(config.axis_x_max) : config.axis_x_max) :
+ $$.d3.max(targets, function (t) { return $$.d3.max(t.values, function (v) { return v.x; }); });
+ };
+ c3_chart_internal_fn.getXDomainPadding = function (domain) {
+ var $$ = this, config = $$.config,
+ diff = domain[1] - domain[0],
+ maxDataCount, padding, paddingLeft, paddingRight;
+ if ($$.isCategorized()) {
+ padding = 0;
+ } else if ($$.hasType('bar')) {
+ maxDataCount = $$.getMaxDataCount();
+ padding = maxDataCount > 1 ? (diff / (maxDataCount - 1)) / 2 : 0.5;
+ } else {
+ padding = diff * 0.01;
+ }
+ if (typeof config.axis_x_padding === 'object' && notEmpty(config.axis_x_padding)) {
+ paddingLeft = isValue(config.axis_x_padding.left) ? config.axis_x_padding.left : padding;
+ paddingRight = isValue(config.axis_x_padding.right) ? config.axis_x_padding.right : padding;
+ } else if (typeof config.axis_x_padding === 'number') {
+ paddingLeft = paddingRight = config.axis_x_padding;
+ } else {
+ paddingLeft = paddingRight = padding;
+ }
+ return {left: paddingLeft, right: paddingRight};
+ };
+ c3_chart_internal_fn.getXDomain = function (targets) {
+ var $$ = this,
+ xDomain = [$$.getXDomainMin(targets), $$.getXDomainMax(targets)],
+ firstX = xDomain[0], lastX = xDomain[1],
+ padding = $$.getXDomainPadding(xDomain),
+ min = 0, max = 0;
+ // show center of x domain if min and max are the same
+ if ((firstX - lastX) === 0 && !$$.isCategorized()) {
+ if ($$.isTimeSeries()) {
+ firstX = new Date(firstX.getTime() * 0.5);
+ lastX = new Date(lastX.getTime() * 1.5);
+ } else {
+ firstX = firstX === 0 ? 1 : (firstX * 0.5);
+ lastX = lastX === 0 ? -1 : (lastX * 1.5);
+ }
+ }
+ if (firstX || firstX === 0) {
+ min = $$.isTimeSeries() ? new Date(firstX.getTime() - padding.left) : firstX - padding.left;
+ }
+ if (lastX || lastX === 0) {
+ max = $$.isTimeSeries() ? new Date(lastX.getTime() + padding.right) : lastX + padding.right;
+ }
+ return [min, max];
+ };
+ c3_chart_internal_fn.updateXDomain = function (targets, withUpdateXDomain, withUpdateOrgXDomain, withTrim, domain) {
+ var $$ = this, config = $$.config;
+
+ if (withUpdateOrgXDomain) {
+ $$.x.domain(domain ? domain : $$.d3.extent($$.getXDomain(targets)));
+ $$.orgXDomain = $$.x.domain();
+ if (config.zoom_enabled) { $$.zoom.scale($$.x).updateScaleExtent(); }
+ $$.subX.domain($$.x.domain());
+ if ($$.brush) { $$.brush.scale($$.subX); }
+ }
+ if (withUpdateXDomain) {
+ $$.x.domain(domain ? domain : (!$$.brush || $$.brush.empty()) ? $$.orgXDomain : $$.brush.extent());
+ if (config.zoom_enabled) { $$.zoom.scale($$.x).updateScaleExtent(); }
+ }
+
+ // Trim domain when too big by zoom mousemove event
+ if (withTrim) { $$.x.domain($$.trimXDomain($$.x.orgDomain())); }
+
+ return $$.x.domain();
+ };
+ c3_chart_internal_fn.trimXDomain = function (domain) {
+ var zoomDomain = this.getZoomDomain(),
+ min = zoomDomain[0], max = zoomDomain[1];
+ if (domain[0] <= min) {
+ domain[1] = +domain[1] + (min - domain[0]);
+ domain[0] = min;
+ }
+ if (max <= domain[1]) {
+ domain[0] = +domain[0] - (domain[1] - max);
+ domain[1] = max;
+ }
+ return domain;
+ };
+
+ c3_chart_internal_fn.isX = function (key) {
+ var $$ = this, config = $$.config;
+ return (config.data_x && key === config.data_x) || (notEmpty(config.data_xs) && hasValue(config.data_xs, key));
+ };
+ c3_chart_internal_fn.isNotX = function (key) {
+ return !this.isX(key);
+ };
+ c3_chart_internal_fn.getXKey = function (id) {
+ var $$ = this, config = $$.config;
+ return config.data_x ? config.data_x : notEmpty(config.data_xs) ? config.data_xs[id] : null;
+ };
+ c3_chart_internal_fn.getXValuesOfXKey = function (key, targets) {
+ var $$ = this,
+ xValues, ids = targets && notEmpty(targets) ? $$.mapToIds(targets) : [];
+ ids.forEach(function (id) {
+ if ($$.getXKey(id) === key) {
+ xValues = $$.data.xs[id];
+ }
+ });
+ return xValues;
+ };
+ c3_chart_internal_fn.getIndexByX = function (x) {
+ var $$ = this,
+ data = $$.filterByX($$.data.targets, x);
+ return data.length ? data[0].index : null;
+ };
+ c3_chart_internal_fn.getXValue = function (id, i) {
+ var $$ = this;
+ return id in $$.data.xs && $$.data.xs[id] && isValue($$.data.xs[id][i]) ? $$.data.xs[id][i] : i;
+ };
+ c3_chart_internal_fn.getOtherTargetXs = function () {
+ var $$ = this,
+ idsForX = Object.keys($$.data.xs);
+ return idsForX.length ? $$.data.xs[idsForX[0]] : null;
+ };
+ c3_chart_internal_fn.getOtherTargetX = function (index) {
+ var xs = this.getOtherTargetXs();
+ return xs && index < xs.length ? xs[index] : null;
+ };
+ c3_chart_internal_fn.addXs = function (xs) {
+ var $$ = this;
+ Object.keys(xs).forEach(function (id) {
+ $$.config.data_xs[id] = xs[id];
+ });
+ };
+ c3_chart_internal_fn.hasMultipleX = function (xs) {
+ return this.d3.set(Object.keys(xs).map(function (id) { return xs[id]; })).size() > 1;
+ };
+ c3_chart_internal_fn.isMultipleX = function () {
+ return notEmpty(this.config.data_xs) || !this.config.data_xSort || this.hasType('scatter');
+ };
+ c3_chart_internal_fn.addName = function (data) {
+ var $$ = this, name;
+ if (data) {
+ name = $$.config.data_names[data.id];
+ data.name = name !== undefined ? name : data.id;
+ }
+ return data;
+ };
+ c3_chart_internal_fn.getValueOnIndex = function (values, index) {
+ var valueOnIndex = values.filter(function (v) { return v.index === index; });
+ return valueOnIndex.length ? valueOnIndex[0] : null;
+ };
+ c3_chart_internal_fn.updateTargetX = function (targets, x) {
+ var $$ = this;
+ targets.forEach(function (t) {
+ t.values.forEach(function (v, i) {
+ v.x = $$.generateTargetX(x[i], t.id, i);
+ });
+ $$.data.xs[t.id] = x;
+ });
+ };
+ c3_chart_internal_fn.updateTargetXs = function (targets, xs) {
+ var $$ = this;
+ targets.forEach(function (t) {
+ if (xs[t.id]) {
+ $$.updateTargetX([t], xs[t.id]);
+ }
+ });
+ };
+ c3_chart_internal_fn.generateTargetX = function (rawX, id, index) {
+ var $$ = this, x;
+ if ($$.isTimeSeries()) {
+ x = rawX ? $$.parseDate(rawX) : $$.parseDate($$.getXValue(id, index));
+ }
+ else if ($$.isCustomX() && !$$.isCategorized()) {
+ x = isValue(rawX) ? +rawX : $$.getXValue(id, index);
+ }
+ else {
+ x = index;
+ }
+ return x;
+ };
+ c3_chart_internal_fn.cloneTarget = function (target) {
+ return {
+ id : target.id,
+ id_org : target.id_org,
+ values : target.values.map(function (d) {
+ return {x: d.x, value: d.value, id: d.id};
+ })
+ };
+ };
+ c3_chart_internal_fn.updateXs = function () {
+ var $$ = this;
+ if ($$.data.targets.length) {
+ $$.xs = [];
+ $$.data.targets[0].values.forEach(function (v) {
+ $$.xs[v.index] = v.x;
+ });
+ }
+ };
+ c3_chart_internal_fn.getPrevX = function (i) {
+ var x = this.xs[i - 1];
+ return typeof x !== 'undefined' ? x : null;
+ };
+ c3_chart_internal_fn.getNextX = function (i) {
+ var x = this.xs[i + 1];
+ return typeof x !== 'undefined' ? x : null;
+ };
+ c3_chart_internal_fn.getMaxDataCount = function () {
+ var $$ = this;
+ return $$.d3.max($$.data.targets, function (t) { return t.values.length; });
+ };
+ c3_chart_internal_fn.getMaxDataCountTarget = function (targets) {
+ var length = targets.length, max = 0, maxTarget;
+ if (length > 1) {
+ targets.forEach(function (t) {
+ if (t.values.length > max) {
+ maxTarget = t;
+ max = t.values.length;
+ }
+ });
+ } else {
+ maxTarget = length ? targets[0] : null;
+ }
+ return maxTarget;
+ };
+ c3_chart_internal_fn.getEdgeX = function (targets) {
+ var $$ = this;
+ return !targets.length ? [0, 0] : [
+ $$.d3.min(targets, function (t) { return t.values[0].x; }),
+ $$.d3.max(targets, function (t) { return t.values[t.values.length - 1].x; })
+ ];
+ };
+ c3_chart_internal_fn.mapToIds = function (targets) {
+ return targets.map(function (d) { return d.id; });
+ };
+ c3_chart_internal_fn.mapToTargetIds = function (ids) {
+ var $$ = this;
+ return ids ? [].concat(ids) : $$.mapToIds($$.data.targets);
+ };
+ c3_chart_internal_fn.hasTarget = function (targets, id) {
+ var ids = this.mapToIds(targets), i;
+ for (i = 0; i < ids.length; i++) {
+ if (ids[i] === id) {
+ return true;
+ }
+ }
+ return false;
+ };
+ c3_chart_internal_fn.isTargetToShow = function (targetId) {
+ return this.hiddenTargetIds.indexOf(targetId) < 0;
+ };
+ c3_chart_internal_fn.isLegendToShow = function (targetId) {
+ return this.hiddenLegendIds.indexOf(targetId) < 0;
+ };
+ c3_chart_internal_fn.filterTargetsToShow = function (targets) {
+ var $$ = this;
+ return targets.filter(function (t) { return $$.isTargetToShow(t.id); });
+ };
+ c3_chart_internal_fn.mapTargetsToUniqueXs = function (targets) {
+ var $$ = this;
+ var xs = $$.d3.set($$.d3.merge(targets.map(function (t) { return t.values.map(function (v) { return +v.x; }); }))).values();
+ xs = $$.isTimeSeries() ? xs.map(function (x) { return new Date(+x); }) : xs.map(function (x) { return +x; });
+ return xs.sort(function (a, b) { return a < b ? -1 : a > b ? 1 : a >= b ? 0 : NaN; });
+ };
+ c3_chart_internal_fn.addHiddenTargetIds = function (targetIds) {
+ this.hiddenTargetIds = this.hiddenTargetIds.concat(targetIds);
+ };
+ c3_chart_internal_fn.removeHiddenTargetIds = function (targetIds) {
+ this.hiddenTargetIds = this.hiddenTargetIds.filter(function (id) { return targetIds.indexOf(id) < 0; });
+ };
+ c3_chart_internal_fn.addHiddenLegendIds = function (targetIds) {
+ this.hiddenLegendIds = this.hiddenLegendIds.concat(targetIds);
+ };
+ c3_chart_internal_fn.removeHiddenLegendIds = function (targetIds) {
+ this.hiddenLegendIds = this.hiddenLegendIds.filter(function (id) { return targetIds.indexOf(id) < 0; });
+ };
+ c3_chart_internal_fn.getValuesAsIdKeyed = function (targets) {
+ var ys = {};
+ targets.forEach(function (t) {
+ ys[t.id] = [];
+ t.values.forEach(function (v) {
+ ys[t.id].push(v.value);
+ });
+ });
+ return ys;
+ };
+ c3_chart_internal_fn.checkValueInTargets = function (targets, checker) {
+ var ids = Object.keys(targets), i, j, values;
+ for (i = 0; i < ids.length; i++) {
+ values = targets[ids[i]].values;
+ for (j = 0; j < values.length; j++) {
+ if (checker(values[j].value)) {
+ return true;
+ }
+ }
+ }
+ return false;
+ };
+ c3_chart_internal_fn.hasNegativeValueInTargets = function (targets) {
+ return this.checkValueInTargets(targets, function (v) { return v < 0; });
+ };
+ c3_chart_internal_fn.hasPositiveValueInTargets = function (targets) {
+ return this.checkValueInTargets(targets, function (v) { return v > 0; });
+ };
+ c3_chart_internal_fn.isOrderDesc = function () {
+ var config = this.config;
+ return typeof(config.data_order) === 'string' && config.data_order.toLowerCase() === 'desc';
+ };
+ c3_chart_internal_fn.isOrderAsc = function () {
+ var config = this.config;
+ return typeof(config.data_order) === 'string' && config.data_order.toLowerCase() === 'asc';
+ };
+ c3_chart_internal_fn.orderTargets = function (targets) {
+ var $$ = this, config = $$.config, orderAsc = $$.isOrderAsc(), orderDesc = $$.isOrderDesc();
+ if (orderAsc || orderDesc) {
+ targets.sort(function (t1, t2) {
+ var reducer = function (p, c) { return p + Math.abs(c.value); };
+ var t1Sum = t1.values.reduce(reducer, 0),
+ t2Sum = t2.values.reduce(reducer, 0);
+ return orderAsc ? t2Sum - t1Sum : t1Sum - t2Sum;
+ });
+ } else if (isFunction(config.data_order)) {
+ targets.sort(config.data_order);
+ } // TODO: accept name array for order
+ return targets;
+ };
+ c3_chart_internal_fn.filterByX = function (targets, x) {
+ return this.d3.merge(targets.map(function (t) { return t.values; })).filter(function (v) { return v.x - x === 0; });
+ };
+ c3_chart_internal_fn.filterRemoveNull = function (data) {
+ return data.filter(function (d) { return isValue(d.value); });
+ };
+ c3_chart_internal_fn.filterByXDomain = function (targets, xDomain) {
+ return targets.map(function (t) {
+ return {
+ id: t.id,
+ id_org: t.id_org,
+ values: t.values.filter(function (v) {
+ return xDomain[0] <= v.x && v.x <= xDomain[1];
+ })
+ };
+ });
+ };
+ c3_chart_internal_fn.hasDataLabel = function () {
+ var config = this.config;
+ if (typeof config.data_labels === 'boolean' && config.data_labels) {
+ return true;
+ } else if (typeof config.data_labels === 'object' && notEmpty(config.data_labels)) {
+ return true;
+ }
+ return false;
+ };
+ c3_chart_internal_fn.getDataLabelLength = function (min, max, key) {
+ var $$ = this,
+ lengths = [0, 0], paddingCoef = 1.3;
+ $$.selectChart.select('svg').selectAll('.dummy')
+ .data([min, max])
+ .enter().append('text')
+ .text(function (d) { return $$.dataLabelFormat(d.id)(d); })
+ .each(function (d, i) {
+ lengths[i] = this.getBoundingClientRect()[key] * paddingCoef;
+ })
+ .remove();
+ return lengths;
+ };
+ c3_chart_internal_fn.isNoneArc = function (d) {
+ return this.hasTarget(this.data.targets, d.id);
+ },
+ c3_chart_internal_fn.isArc = function (d) {
+ return 'data' in d && this.hasTarget(this.data.targets, d.data.id);
+ };
+ c3_chart_internal_fn.findSameXOfValues = function (values, index) {
+ var i, targetX = values[index].x, sames = [];
+ for (i = index - 1; i >= 0; i--) {
+ if (targetX !== values[i].x) { break; }
+ sames.push(values[i]);
+ }
+ for (i = index; i < values.length; i++) {
+ if (targetX !== values[i].x) { break; }
+ sames.push(values[i]);
+ }
+ return sames;
+ };
+
+ c3_chart_internal_fn.findClosestFromTargets = function (targets, pos) {
+ var $$ = this, candidates;
+
+ // map to array of closest points of each target
+ candidates = targets.map(function (target) {
+ return $$.findClosest(target.values, pos);
+ });
+
+ // decide closest point and return
+ return $$.findClosest(candidates, pos);
+ };
+ c3_chart_internal_fn.findClosest = function (values, pos) {
+ var $$ = this, minDist = $$.config.point_sensitivity, closest;
+
+ // find mouseovering bar
+ values.filter(function (v) { return v && $$.isBarType(v.id); }).forEach(function (v) {
+ var shape = $$.main.select('.' + CLASS.bars + $$.getTargetSelectorSuffix(v.id) + ' .' + CLASS.bar + '-' + v.index).node();
+ if (!closest && $$.isWithinBar(shape)) {
+ closest = v;
+ }
+ });
+
+ // find closest point from non-bar
+ values.filter(function (v) { return v && !$$.isBarType(v.id); }).forEach(function (v) {
+ var d = $$.dist(v, pos);
+ if (d < minDist) {
+ minDist = d;
+ closest = v;
+ }
+ });
+
+ return closest;
+ };
+ c3_chart_internal_fn.dist = function (data, pos) {
+ var $$ = this, config = $$.config,
+ xIndex = config.axis_rotated ? 1 : 0,
+ yIndex = config.axis_rotated ? 0 : 1,
+ y = $$.circleY(data, data.index),
+ x = $$.x(data.x);
+ return Math.sqrt(Math.pow(x - pos[xIndex], 2) + Math.pow(y - pos[yIndex], 2));
+ };
+ c3_chart_internal_fn.convertValuesToStep = function (values) {
+ var converted = [].concat(values), i;
+
+ if (!this.isCategorized()) {
+ return values;
+ }
+
+ for (i = values.length + 1; 0 < i; i--) {
+ converted[i] = converted[i - 1];
+ }
+
+ converted[0] = {
+ x: converted[0].x - 1,
+ value: converted[0].value,
+ id: converted[0].id
+ };
+ converted[values.length + 1] = {
+ x: converted[values.length].x + 1,
+ value: converted[values.length].value,
+ id: converted[values.length].id
+ };
+
+ return converted;
+ };
+ c3_chart_internal_fn.updateDataAttributes = function (name, attrs) {
+ var $$ = this, config = $$.config, current = config['data_' + name];
+ if (typeof attrs === 'undefined') { return current; }
+ Object.keys(attrs).forEach(function (id) {
+ current[id] = attrs[id];
+ });
+ $$.redraw({withLegend: true});
+ return current;
+ };
+
+ c3_chart_internal_fn.convertUrlToData = function (url, mimeType, keys, done) {
+ var $$ = this, type = mimeType ? mimeType : 'csv';
+ $$.d3.xhr(url, function (error, data) {
+ var d;
+ if (!data) {
+ throw new Error(error.responseURL + ' ' + error.status + ' (' + error.statusText + ')');
+ }
+ if (type === 'json') {
+ d = $$.convertJsonToData(JSON.parse(data.response), keys);
+ } else if (type === 'tsv') {
+ d = $$.convertTsvToData(data.response);
+ } else {
+ d = $$.convertCsvToData(data.response);
+ }
+ done.call($$, d);
+ });
+ };
+ c3_chart_internal_fn.convertXsvToData = function (xsv, parser) {
+ var rows = parser.parseRows(xsv), d;
+ if (rows.length === 1) {
+ d = [{}];
+ rows[0].forEach(function (id) {
+ d[0][id] = null;
+ });
+ } else {
+ d = parser.parse(xsv);
+ }
+ return d;
+ };
+ c3_chart_internal_fn.convertCsvToData = function (csv) {
+ return this.convertXsvToData(csv, this.d3.csv);
+ };
+ c3_chart_internal_fn.convertTsvToData = function (tsv) {
+ return this.convertXsvToData(tsv, this.d3.tsv);
+ };
+ c3_chart_internal_fn.convertJsonToData = function (json, keys) {
+ var $$ = this,
+ new_rows = [], targetKeys, data;
+ if (keys) { // when keys specified, json would be an array that includes objects
+ if (keys.x) {
+ targetKeys = keys.value.concat(keys.x);
+ $$.config.data_x = keys.x;
+ } else {
+ targetKeys = keys.value;
+ }
+ new_rows.push(targetKeys);
+ json.forEach(function (o) {
+ var new_row = [];
+ targetKeys.forEach(function (key) {
+ // convert undefined to null because undefined data will be removed in convertDataToTargets()
+ var v = isUndefined(o[key]) ? null : o[key];
+ new_row.push(v);
+ });
+ new_rows.push(new_row);
+ });
+ data = $$.convertRowsToData(new_rows);
+ } else {
+ Object.keys(json).forEach(function (key) {
+ new_rows.push([key].concat(json[key]));
+ });
+ data = $$.convertColumnsToData(new_rows);
+ }
+ return data;
+ };
+ c3_chart_internal_fn.convertRowsToData = function (rows) {
+ var keys = rows[0], new_row = {}, new_rows = [], i, j;
+ for (i = 1; i < rows.length; i++) {
+ new_row = {};
+ for (j = 0; j < rows[i].length; j++) {
+ if (isUndefined(rows[i][j])) {
+ throw new Error("Source data is missing a component at (" + i + "," + j + ")!");
+ }
+ new_row[keys[j]] = rows[i][j];
+ }
+ new_rows.push(new_row);
+ }
+ return new_rows;
+ };
+ c3_chart_internal_fn.convertColumnsToData = function (columns) {
+ var new_rows = [], i, j, key;
+ for (i = 0; i < columns.length; i++) {
+ key = columns[i][0];
+ for (j = 1; j < columns[i].length; j++) {
+ if (isUndefined(new_rows[j - 1])) {
+ new_rows[j - 1] = {};
+ }
+ if (isUndefined(columns[i][j])) {
+ throw new Error("Source data is missing a component at (" + i + "," + j + ")!");
+ }
+ new_rows[j - 1][key] = columns[i][j];
+ }
+ }
+ return new_rows;
+ };
+ c3_chart_internal_fn.convertDataToTargets = function (data, appendXs) {
+ var $$ = this, config = $$.config,
+ ids = $$.d3.keys(data[0]).filter($$.isNotX, $$),
+ xs = $$.d3.keys(data[0]).filter($$.isX, $$),
+ targets;
+
+ // save x for update data by load when custom x and c3.x API
+ ids.forEach(function (id) {
+ var xKey = $$.getXKey(id);
+
+ if ($$.isCustomX() || $$.isTimeSeries()) {
+ // if included in input data
+ if (xs.indexOf(xKey) >= 0) {
+ $$.data.xs[id] = (appendXs && $$.data.xs[id] ? $$.data.xs[id] : []).concat(
+ data.map(function (d) { return d[xKey]; })
+ .filter(isValue)
+ .map(function (rawX, i) { return $$.generateTargetX(rawX, id, i); })
+ );
+ }
+ // if not included in input data, find from preloaded data of other id's x
+ else if (config.data_x) {
+ $$.data.xs[id] = $$.getOtherTargetXs();
+ }
+ // if not included in input data, find from preloaded data
+ else if (notEmpty(config.data_xs)) {
+ $$.data.xs[id] = $$.getXValuesOfXKey(xKey, $$.data.targets);
+ }
+ // MEMO: if no x included, use same x of current will be used
+ } else {
+ $$.data.xs[id] = data.map(function (d, i) { return i; });
+ }
+ });
+
+
+ // check x is defined
+ ids.forEach(function (id) {
+ if (!$$.data.xs[id]) {
+ throw new Error('x is not defined for id = "' + id + '".');
+ }
+ });
+
+ // convert to target
+ targets = ids.map(function (id, index) {
+ var convertedId = config.data_idConverter(id);
+ return {
+ id: convertedId,
+ id_org: id,
+ values: data.map(function (d, i) {
+ var xKey = $$.getXKey(id), rawX = d[xKey], x = $$.generateTargetX(rawX, id, i),
+ value = d[id] !== null && !isNaN(d[id]) ? +d[id] : null;
+ // use x as categories if custom x and categorized
+ if ($$.isCustomX() && $$.isCategorized() && index === 0 && rawX) {
+ if (i === 0) { config.axis_x_categories = []; }
+ config.axis_x_categories.push(rawX);
+ }
+ // mark as x = undefined if value is undefined and filter to remove after mapped
+ if (isUndefined(d[id]) || $$.data.xs[id].length <= i) {
+ x = undefined;
+ }
+ return {x: x, value: value, id: convertedId};
+ }).filter(function (v) { return isDefined(v.x); })
+ };
+ });
+
+ // finish targets
+ targets.forEach(function (t) {
+ var i;
+ // sort values by its x
+ if (config.data_xSort) {
+ t.values = t.values.sort(function (v1, v2) {
+ var x1 = v1.x || v1.x === 0 ? v1.x : Infinity,
+ x2 = v2.x || v2.x === 0 ? v2.x : Infinity;
+ return x1 - x2;
+ });
+ }
+ // indexing each value
+ i = 0;
+ t.values.forEach(function (v) {
+ v.index = i++;
+ });
+ // this needs to be sorted because its index and value.index is identical
+ $$.data.xs[t.id].sort(function (v1, v2) {
+ return v1 - v2;
+ });
+ });
+
+ // cache information about values
+ $$.hasNegativeValue = $$.hasNegativeValueInTargets(targets);
+ $$.hasPositiveValue = $$.hasPositiveValueInTargets(targets);
+
+ // set target types
+ if (config.data_type) {
+ $$.setTargetType($$.mapToIds(targets).filter(function (id) { return ! (id in config.data_types); }), config.data_type);
+ }
+
+ // cache as original id keyed
+ targets.forEach(function (d) {
+ $$.addCache(d.id_org, d);
+ });
+
+ return targets;
+ };
+
+ c3_chart_internal_fn.load = function (targets, args) {
+ var $$ = this;
+ if (targets) {
+ // filter loading targets if needed
+ if (args.filter) {
+ targets = targets.filter(args.filter);
+ }
+ // set type if args.types || args.type specified
+ if (args.type || args.types) {
+ targets.forEach(function (t) {
+ var type = args.types && args.types[t.id] ? args.types[t.id] : args.type;
+ $$.setTargetType(t.id, type);
+ });
+ }
+ // Update/Add data
+ $$.data.targets.forEach(function (d) {
+ for (var i = 0; i < targets.length; i++) {
+ if (d.id === targets[i].id) {
+ d.values = targets[i].values;
+ targets.splice(i, 1);
+ break;
+ }
+ }
+ });
+ $$.data.targets = $$.data.targets.concat(targets); // add remained
+ }
+
+ // Set targets
+ $$.updateTargets($$.data.targets);
+
+ // Redraw with new targets
+ $$.redraw({withUpdateOrgXDomain: true, withUpdateXDomain: true, withLegend: true});
+
+ if (args.done) { args.done(); }
+ };
+ c3_chart_internal_fn.loadFromArgs = function (args) {
+ var $$ = this;
+ if (args.data) {
+ $$.load($$.convertDataToTargets(args.data), args);
+ }
+ else if (args.url) {
+ $$.convertUrlToData(args.url, args.mimeType, args.keys, function (data) {
+ $$.load($$.convertDataToTargets(data), args);
+ });
+ }
+ else if (args.json) {
+ $$.load($$.convertDataToTargets($$.convertJsonToData(args.json, args.keys)), args);
+ }
+ else if (args.rows) {
+ $$.load($$.convertDataToTargets($$.convertRowsToData(args.rows)), args);
+ }
+ else if (args.columns) {
+ $$.load($$.convertDataToTargets($$.convertColumnsToData(args.columns)), args);
+ }
+ else {
+ $$.load(null, args);
+ }
+ };
+ c3_chart_internal_fn.unload = function (targetIds, done) {
+ var $$ = this;
+ if (!done) {
+ done = function () {};
+ }
+ // filter existing target
+ targetIds = targetIds.filter(function (id) { return $$.hasTarget($$.data.targets, id); });
+ // If no target, call done and return
+ if (!targetIds || targetIds.length === 0) {
+ done();
+ return;
+ }
+ $$.svg.selectAll(targetIds.map(function (id) { return $$.selectorTarget(id); }))
+ .transition()
+ .style('opacity', 0)
+ .remove()
+ .call($$.endall, done);
+ targetIds.forEach(function (id) {
+ // Reset fadein for future load
+ $$.withoutFadeIn[id] = false;
+ // Remove target's elements
+ if ($$.legend) {
+ $$.legend.selectAll('.' + CLASS.legendItem + $$.getTargetSelectorSuffix(id)).remove();
+ }
+ // Remove target
+ $$.data.targets = $$.data.targets.filter(function (t) {
+ return t.id !== id;
+ });
+ });
+ };
+
+ c3_chart_internal_fn.categoryName = function (i) {
+ var config = this.config;
+ return i < config.axis_x_categories.length ? config.axis_x_categories[i] : i;
+ };
+
+ c3_chart_internal_fn.initEventRect = function () {
+ var $$ = this;
+ $$.main.select('.' + CLASS.chart).append("g")
+ .attr("class", CLASS.eventRects)
+ .style('fill-opacity', 0);
+ };
+ c3_chart_internal_fn.redrawEventRect = function () {
+ var $$ = this, config = $$.config,
+ eventRectUpdate, maxDataCountTarget,
+ isMultipleX = $$.isMultipleX();
+
+ // rects for mouseover
+ var eventRects = $$.main.select('.' + CLASS.eventRects)
+ .style('cursor', config.zoom_enabled ? config.axis_rotated ? 'ns-resize' : 'ew-resize' : null)
+ .classed(CLASS.eventRectsMultiple, isMultipleX)
+ .classed(CLASS.eventRectsSingle, !isMultipleX);
+
+ // clear old rects
+ eventRects.selectAll('.' + CLASS.eventRect).remove();
+
+ // open as public variable
+ $$.eventRect = eventRects.selectAll('.' + CLASS.eventRect);
+
+ if (isMultipleX) {
+ eventRectUpdate = $$.eventRect.data([0]);
+ // enter : only one rect will be added
+ $$.generateEventRectsForMultipleXs(eventRectUpdate.enter());
+ // update
+ $$.updateEventRect(eventRectUpdate);
+ // exit : not needed because always only one rect exists
+ }
+ else {
+ // Set data and update $$.eventRect
+ maxDataCountTarget = $$.getMaxDataCountTarget($$.data.targets);
+ eventRects.datum(maxDataCountTarget ? maxDataCountTarget.values : []);
+ $$.eventRect = eventRects.selectAll('.' + CLASS.eventRect);
+ eventRectUpdate = $$.eventRect.data(function (d) { return d; });
+ // enter
+ $$.generateEventRectsForSingleX(eventRectUpdate.enter());
+ // update
+ $$.updateEventRect(eventRectUpdate);
+ // exit
+ eventRectUpdate.exit().remove();
+ }
+ };
+ c3_chart_internal_fn.updateEventRect = function (eventRectUpdate) {
+ var $$ = this, config = $$.config,
+ x, y, w, h, rectW, rectX;
+
+ // set update selection if null
+ eventRectUpdate = eventRectUpdate || $$.eventRect.data(function (d) { return d; });
+
+ if ($$.isMultipleX()) {
+ // TODO: rotated not supported yet
+ x = 0;
+ y = 0;
+ w = $$.width;
+ h = $$.height;
+ }
+ else {
+ if (($$.isCustomX() || $$.isTimeSeries()) && !$$.isCategorized()) {
+
+ // update index for x that is used by prevX and nextX
+ $$.updateXs();
+
+ rectW = function (d) {
+ var prevX = $$.getPrevX(d.index), nextX = $$.getNextX(d.index);
+
+ // if there this is a single data point make the eventRect full width (or height)
+ if (prevX === null && nextX === null) {
+ return config.axis_rotated ? $$.height : $$.width;
+ }
+
+ if (prevX === null) { prevX = $$.x.domain()[0]; }
+ if (nextX === null) { nextX = $$.x.domain()[1]; }
+
+ return Math.max(0, ($$.x(nextX) - $$.x(prevX)) / 2);
+ };
+ rectX = function (d) {
+ var prevX = $$.getPrevX(d.index), nextX = $$.getNextX(d.index),
+ thisX = $$.data.xs[d.id][d.index];
+
+ // if there this is a single data point position the eventRect at 0
+ if (prevX === null && nextX === null) {
+ return 0;
+ }
+
+ if (prevX === null) { prevX = $$.x.domain()[0]; }
+
+ return ($$.x(thisX) + $$.x(prevX)) / 2;
+ };
+ } else {
+ rectW = $$.getEventRectWidth();
+ rectX = function (d) {
+ return $$.x(d.x) - (rectW / 2);
+ };
+ }
+ x = config.axis_rotated ? 0 : rectX;
+ y = config.axis_rotated ? rectX : 0;
+ w = config.axis_rotated ? $$.width : rectW;
+ h = config.axis_rotated ? rectW : $$.height;
+ }
+
+ eventRectUpdate
+ .attr('class', $$.classEvent.bind($$))
+ .attr("x", x)
+ .attr("y", y)
+ .attr("width", w)
+ .attr("height", h);
+ };
+ c3_chart_internal_fn.generateEventRectsForSingleX = function (eventRectEnter) {
+ var $$ = this, d3 = $$.d3, config = $$.config;
+ eventRectEnter.append("rect")
+ .attr("class", $$.classEvent.bind($$))
+ .style("cursor", config.data_selection_enabled && config.data_selection_grouped ? "pointer" : null)
+ .on('mouseover', function (d) {
+ var index = d.index;
+
+ if ($$.dragging || $$.flowing) { return; } // do nothing while dragging/flowing
+ if ($$.hasArcType()) { return; }
+
+ // Expand shapes for selection
+ if (config.point_focus_expand_enabled) { $$.expandCircles(index, null, true); }
+ $$.expandBars(index, null, true);
+
+ // Call event handler
+ $$.main.selectAll('.' + CLASS.shape + '-' + index).each(function (d) {
+ config.data_onmouseover.call($$.api, d);
+ });
+ })
+ .on('mouseout', function (d) {
+ var index = d.index;
+ if (!$$.config) { return; } // chart is destroyed
+ if ($$.hasArcType()) { return; }
+ $$.hideXGridFocus();
+ $$.hideTooltip();
+ // Undo expanded shapes
+ $$.unexpandCircles();
+ $$.unexpandBars();
+ // Call event handler
+ $$.main.selectAll('.' + CLASS.shape + '-' + index).each(function (d) {
+ config.data_onmouseout.call($$.api, d);
+ });
+ })
+ .on('mousemove', function (d) {
+ var selectedData, index = d.index,
+ eventRect = $$.svg.select('.' + CLASS.eventRect + '-' + index);
+
+ if ($$.dragging || $$.flowing) { return; } // do nothing while dragging/flowing
+ if ($$.hasArcType()) { return; }
+
+ if ($$.isStepType(d) && $$.config.line_step_type === 'step-after' && d3.mouse(this)[0] < $$.x($$.getXValue(d.id, index))) {
+ index -= 1;
+ }
+
+ // Show tooltip
+ selectedData = $$.filterTargetsToShow($$.data.targets).map(function (t) {
+ return $$.addName($$.getValueOnIndex(t.values, index));
+ });
+
+ if (config.tooltip_grouped) {
+ $$.showTooltip(selectedData, this);
+ $$.showXGridFocus(selectedData);
+ }
+
+ if (config.tooltip_grouped && (!config.data_selection_enabled || config.data_selection_grouped)) {
+ return;
+ }
+
+ $$.main.selectAll('.' + CLASS.shape + '-' + index)
+ .each(function () {
+ d3.select(this).classed(CLASS.EXPANDED, true);
+ if (config.data_selection_enabled) {
+ eventRect.style('cursor', config.data_selection_grouped ? 'pointer' : null);
+ }
+ if (!config.tooltip_grouped) {
+ $$.hideXGridFocus();
+ $$.hideTooltip();
+ if (!config.data_selection_grouped) {
+ $$.unexpandCircles(index);
+ $$.unexpandBars(index);
+ }
+ }
+ })
+ .filter(function (d) {
+ return $$.isWithinShape(this, d);
+ })
+ .each(function (d) {
+ if (config.data_selection_enabled && (config.data_selection_grouped || config.data_selection_isselectable(d))) {
+ eventRect.style('cursor', 'pointer');
+ }
+ if (!config.tooltip_grouped) {
+ $$.showTooltip([d], this);
+ $$.showXGridFocus([d]);
+ if (config.point_focus_expand_enabled) { $$.expandCircles(index, d.id, true); }
+ $$.expandBars(index, d.id, true);
+ }
+ });
+ })
+ .on('click', function (d) {
+ var index = d.index;
+ if ($$.hasArcType() || !$$.toggleShape) { return; }
+ if ($$.cancelClick) {
+ $$.cancelClick = false;
+ return;
+ }
+ if ($$.isStepType(d) && config.line_step_type === 'step-after' && d3.mouse(this)[0] < $$.x($$.getXValue(d.id, index))) {
+ index -= 1;
+ }
+ $$.main.selectAll('.' + CLASS.shape + '-' + index).each(function (d) {
+ if (config.data_selection_grouped || $$.isWithinShape(this, d)) {
+ $$.toggleShape(this, d, index);
+ $$.config.data_onclick.call($$.api, d, this);
+ }
+ });
+ })
+ .call(
+ config.data_selection_draggable && $$.drag ? (
+ d3.behavior.drag().origin(Object)
+ .on('drag', function () { $$.drag(d3.mouse(this)); })
+ .on('dragstart', function () { $$.dragstart(d3.mouse(this)); })
+ .on('dragend', function () { $$.dragend(); })
+ ) : function () {}
+ );
+ };
+
+ c3_chart_internal_fn.generateEventRectsForMultipleXs = function (eventRectEnter) {
+ var $$ = this, d3 = $$.d3, config = $$.config;
+
+ function mouseout() {
+ $$.svg.select('.' + CLASS.eventRect).style('cursor', null);
+ $$.hideXGridFocus();
+ $$.hideTooltip();
+ $$.unexpandCircles();
+ $$.unexpandBars();
+ }
+
+ eventRectEnter.append('rect')
+ .attr('x', 0)
+ .attr('y', 0)
+ .attr('width', $$.width)
+ .attr('height', $$.height)
+ .attr('class', CLASS.eventRect)
+ .on('mouseout', function () {
+ if (!$$.config) { return; } // chart is destroyed
+ if ($$.hasArcType()) { return; }
+ mouseout();
+ })
+ .on('mousemove', function () {
+ var targetsToShow = $$.filterTargetsToShow($$.data.targets);
+ var mouse, closest, sameXData, selectedData;
+
+ if ($$.dragging) { return; } // do nothing when dragging
+ if ($$.hasArcType(targetsToShow)) { return; }
+
+ mouse = d3.mouse(this);
+ closest = $$.findClosestFromTargets(targetsToShow, mouse);
+
+ if ($$.mouseover && (!closest || closest.id !== $$.mouseover.id)) {
+ config.data_onmouseout.call($$.api, $$.mouseover);
+ $$.mouseover = undefined;
+ }
+
+ if (! closest) {
+ mouseout();
+ return;
+ }
+
+ if ($$.isScatterType(closest) || !config.tooltip_grouped) {
+ sameXData = [closest];
+ } else {
+ sameXData = $$.filterByX(targetsToShow, closest.x);
+ }
+
+ // show tooltip when cursor is close to some point
+ selectedData = sameXData.map(function (d) {
+ return $$.addName(d);
+ });
+ $$.showTooltip(selectedData, this);
+
+ // expand points
+ if (config.point_focus_expand_enabled) {
+ $$.expandCircles(closest.index, closest.id, true);
+ }
+ $$.expandBars(closest.index, closest.id, true);
+
+ // Show xgrid focus line
+ $$.showXGridFocus(selectedData);
+
+ // Show cursor as pointer if point is close to mouse position
+ if ($$.isBarType(closest.id) || $$.dist(closest, mouse) < config.point_sensitivity) {
+ $$.svg.select('.' + CLASS.eventRect).style('cursor', 'pointer');
+ if (!$$.mouseover) {
+ config.data_onmouseover.call($$.api, closest);
+ $$.mouseover = closest;
+ }
+ }
+ })
+ .on('click', function () {
+ var targetsToShow = $$.filterTargetsToShow($$.data.targets);
+ var mouse, closest;
+ if ($$.hasArcType(targetsToShow)) { return; }
+
+ mouse = d3.mouse(this);
+ closest = $$.findClosestFromTargets(targetsToShow, mouse);
+ if (! closest) { return; }
+ // select if selection enabled
+ if ($$.isBarType(closest.id) || $$.dist(closest, mouse) < config.point_sensitivity) {
+ $$.main.selectAll('.' + CLASS.shapes + $$.getTargetSelectorSuffix(closest.id)).selectAll('.' + CLASS.shape + '-' + closest.index).each(function () {
+ if (config.data_selection_grouped || $$.isWithinShape(this, closest)) {
+ $$.toggleShape(this, closest, closest.index);
+ $$.config.data_onclick.call($$.api, closest, this);
+ }
+ });
+ }
+ })
+ .call(
+ config.data_selection_draggable && $$.drag ? (
+ d3.behavior.drag().origin(Object)
+ .on('drag', function () { $$.drag(d3.mouse(this)); })
+ .on('dragstart', function () { $$.dragstart(d3.mouse(this)); })
+ .on('dragend', function () { $$.dragend(); })
+ ) : function () {}
+ );
+ };
+ c3_chart_internal_fn.dispatchEvent = function (type, index, mouse) {
+ var $$ = this,
+ selector = '.' + CLASS.eventRect + (!$$.isMultipleX() ? '-' + index : ''),
+ eventRect = $$.main.select(selector).node(),
+ box = eventRect.getBoundingClientRect(),
+ x = box.left + (mouse ? mouse[0] : 0),
+ y = box.top + (mouse ? mouse[1] : 0),
+ event = document.createEvent("MouseEvents");
+
+ event.initMouseEvent(type, true, true, window, 0, x, y, x, y,
+ false, false, false, false, 0, null);
+ eventRect.dispatchEvent(event);
+ };
+
+ c3_chart_internal_fn.getCurrentWidth = function () {
+ var $$ = this, config = $$.config;
+ return config.size_width ? config.size_width : $$.getParentWidth();
+ };
+ c3_chart_internal_fn.getCurrentHeight = function () {
+ var $$ = this, config = $$.config,
+ h = config.size_height ? config.size_height : $$.getParentHeight();
+ return h > 0 ? h : 320 / ($$.hasType('gauge') ? 2 : 1);
+ };
+ c3_chart_internal_fn.getCurrentPaddingTop = function () {
+ var $$ = this,
+ config = $$.config,
+ padding = isValue(config.padding_top) ? config.padding_top : 0;
+ if ($$.title && $$.title.node()) {
+ padding += $$.getTitlePadding();
+ }
+ return padding;
+ };
+ c3_chart_internal_fn.getCurrentPaddingBottom = function () {
+ var config = this.config;
+ return isValue(config.padding_bottom) ? config.padding_bottom : 0;
+ };
+ c3_chart_internal_fn.getCurrentPaddingLeft = function (withoutRecompute) {
+ var $$ = this, config = $$.config;
+ if (isValue(config.padding_left)) {
+ return config.padding_left;
+ } else if (config.axis_rotated) {
+ return !config.axis_x_show ? 1 : Math.max(ceil10($$.getAxisWidthByAxisId('x', withoutRecompute)), 40);
+ } else if (!config.axis_y_show || config.axis_y_inner) { // && !config.axis_rotated
+ return $$.axis.getYAxisLabelPosition().isOuter ? 30 : 1;
+ } else {
+ return ceil10($$.getAxisWidthByAxisId('y', withoutRecompute));
+ }
+ };
+ c3_chart_internal_fn.getCurrentPaddingRight = function () {
+ var $$ = this, config = $$.config,
+ defaultPadding = 10, legendWidthOnRight = $$.isLegendRight ? $$.getLegendWidth() + 20 : 0;
+ if (isValue(config.padding_right)) {
+ return config.padding_right + 1; // 1 is needed not to hide tick line
+ } else if (config.axis_rotated) {
+ return defaultPadding + legendWidthOnRight;
+ } else if (!config.axis_y2_show || config.axis_y2_inner) { // && !config.axis_rotated
+ return 2 + legendWidthOnRight + ($$.axis.getY2AxisLabelPosition().isOuter ? 20 : 0);
+ } else {
+ return ceil10($$.getAxisWidthByAxisId('y2')) + legendWidthOnRight;
+ }
+ };
+
+ c3_chart_internal_fn.getParentRectValue = function (key) {
+ var parent = this.selectChart.node(), v;
+ while (parent && parent.tagName !== 'BODY') {
+ try {
+ v = parent.getBoundingClientRect()[key];
+ } catch(e) {
+ if (key === 'width') {
+ // In IE in certain cases getBoundingClientRect
+ // will cause an "unspecified error"
+ v = parent.offsetWidth;
+ }
+ }
+ if (v) {
+ break;
+ }
+ parent = parent.parentNode;
+ }
+ return v;
+ };
+ c3_chart_internal_fn.getParentWidth = function () {
+ return this.getParentRectValue('width');
+ };
+ c3_chart_internal_fn.getParentHeight = function () {
+ var h = this.selectChart.style('height');
+ return h.indexOf('px') > 0 ? +h.replace('px', '') : 0;
+ };
+
+
+ c3_chart_internal_fn.getSvgLeft = function (withoutRecompute) {
+ var $$ = this, config = $$.config,
+ hasLeftAxisRect = config.axis_rotated || (!config.axis_rotated && !config.axis_y_inner),
+ leftAxisClass = config.axis_rotated ? CLASS.axisX : CLASS.axisY,
+ leftAxis = $$.main.select('.' + leftAxisClass).node(),
+ svgRect = leftAxis && hasLeftAxisRect ? leftAxis.getBoundingClientRect() : {right: 0},
+ chartRect = $$.selectChart.node().getBoundingClientRect(),
+ hasArc = $$.hasArcType(),
+ svgLeft = svgRect.right - chartRect.left - (hasArc ? 0 : $$.getCurrentPaddingLeft(withoutRecompute));
+ return svgLeft > 0 ? svgLeft : 0;
+ };
+
+
+ c3_chart_internal_fn.getAxisWidthByAxisId = function (id, withoutRecompute) {
+ var $$ = this, position = $$.axis.getLabelPositionById(id);
+ return $$.axis.getMaxTickWidth(id, withoutRecompute) + (position.isInner ? 20 : 40);
+ };
+ c3_chart_internal_fn.getHorizontalAxisHeight = function (axisId) {
+ var $$ = this, config = $$.config, h = 30;
+ if (axisId === 'x' && !config.axis_x_show) { return 8; }
+ if (axisId === 'x' && config.axis_x_height) { return config.axis_x_height; }
+ if (axisId === 'y' && !config.axis_y_show) { return config.legend_show && !$$.isLegendRight && !$$.isLegendInset ? 10 : 1; }
+ if (axisId === 'y2' && !config.axis_y2_show) { return $$.rotated_padding_top; }
+ // Calculate x axis height when tick rotated
+ if (axisId === 'x' && !config.axis_rotated && config.axis_x_tick_rotate) {
+ h = 30 + $$.axis.getMaxTickWidth(axisId) * Math.cos(Math.PI * (90 - config.axis_x_tick_rotate) / 180);
+ }
+ return h + ($$.axis.getLabelPositionById(axisId).isInner ? 0 : 10) + (axisId === 'y2' ? -10 : 0);
+ };
+
+ c3_chart_internal_fn.getEventRectWidth = function () {
+ return Math.max(0, this.xAxis.tickInterval());
+ };
+
+ c3_chart_internal_fn.getShapeIndices = function (typeFilter) {
+ var $$ = this, config = $$.config,
+ indices = {}, i = 0, j, k;
+ $$.filterTargetsToShow($$.data.targets.filter(typeFilter, $$)).forEach(function (d) {
+ for (j = 0; j < config.data_groups.length; j++) {
+ if (config.data_groups[j].indexOf(d.id) < 0) { continue; }
+ for (k = 0; k < config.data_groups[j].length; k++) {
+ if (config.data_groups[j][k] in indices) {
+ indices[d.id] = indices[config.data_groups[j][k]];
+ break;
+ }
+ }
+ }
+ if (isUndefined(indices[d.id])) { indices[d.id] = i++; }
+ });
+ indices.__max__ = i - 1;
+ return indices;
+ };
+ c3_chart_internal_fn.getShapeX = function (offset, targetsNum, indices, isSub) {
+ var $$ = this, scale = isSub ? $$.subX : $$.x;
+ return function (d) {
+ var index = d.id in indices ? indices[d.id] : 0;
+ return d.x || d.x === 0 ? scale(d.x) - offset * (targetsNum / 2 - index) : 0;
+ };
+ };
+ c3_chart_internal_fn.getShapeY = function (isSub) {
+ var $$ = this;
+ return function (d) {
+ var scale = isSub ? $$.getSubYScale(d.id) : $$.getYScale(d.id);
+ return scale(d.value);
+ };
+ };
+ c3_chart_internal_fn.getShapeOffset = function (typeFilter, indices, isSub) {
+ var $$ = this,
+ targets = $$.orderTargets($$.filterTargetsToShow($$.data.targets.filter(typeFilter, $$))),
+ targetIds = targets.map(function (t) { return t.id; });
+ return function (d, i) {
+ var scale = isSub ? $$.getSubYScale(d.id) : $$.getYScale(d.id),
+ y0 = scale(0), offset = y0;
+ targets.forEach(function (t) {
+ var values = $$.isStepType(d) ? $$.convertValuesToStep(t.values) : t.values;
+ if (t.id === d.id || indices[t.id] !== indices[d.id]) { return; }
+ if (targetIds.indexOf(t.id) < targetIds.indexOf(d.id)) {
+ // check if the x values line up
+ if (typeof values[i] === 'undefined' || +values[i].x !== +d.x) { // "+" for timeseries
+ // if not, try to find the value that does line up
+ i = -1;
+ values.forEach(function (v, j) {
+ if (v.x === d.x) {
+ i = j;
+ }
+ });
+ }
+ if (i in values && values[i].value * d.value >= 0) {
+ offset += scale(values[i].value) - y0;
+ }
+ }
+ });
+ return offset;
+ };
+ };
+ c3_chart_internal_fn.isWithinShape = function (that, d) {
+ var $$ = this,
+ shape = $$.d3.select(that), isWithin;
+ if (!$$.isTargetToShow(d.id)) {
+ isWithin = false;
+ }
+ else if (that.nodeName === 'circle') {
+ isWithin = $$.isStepType(d) ? $$.isWithinStep(that, $$.getYScale(d.id)(d.value)) : $$.isWithinCircle(that, $$.pointSelectR(d) * 1.5);
+ }
+ else if (that.nodeName === 'path') {
+ isWithin = shape.classed(CLASS.bar) ? $$.isWithinBar(that) : true;
+ }
+ return isWithin;
+ };
+
+
+ c3_chart_internal_fn.getInterpolate = function (d) {
+ var $$ = this,
+ interpolation = $$.isInterpolationType($$.config.spline_interpolation_type) ? $$.config.spline_interpolation_type : 'cardinal';
+ return $$.isSplineType(d) ? interpolation : $$.isStepType(d) ? $$.config.line_step_type : "linear";
+ };
+
+ c3_chart_internal_fn.initLine = function () {
+ var $$ = this;
+ $$.main.select('.' + CLASS.chart).append("g")
+ .attr("class", CLASS.chartLines);
+ };
+ c3_chart_internal_fn.updateTargetsForLine = function (targets) {
+ var $$ = this, config = $$.config,
+ mainLineUpdate, mainLineEnter,
+ classChartLine = $$.classChartLine.bind($$),
+ classLines = $$.classLines.bind($$),
+ classAreas = $$.classAreas.bind($$),
+ classCircles = $$.classCircles.bind($$),
+ classFocus = $$.classFocus.bind($$);
+ mainLineUpdate = $$.main.select('.' + CLASS.chartLines).selectAll('.' + CLASS.chartLine)
+ .data(targets)
+ .attr('class', function (d) { return classChartLine(d) + classFocus(d); });
+ mainLineEnter = mainLineUpdate.enter().append('g')
+ .attr('class', classChartLine)
+ .style('opacity', 0)
+ .style("pointer-events", "none");
+ // Lines for each data
+ mainLineEnter.append('g')
+ .attr("class", classLines);
+ // Areas
+ mainLineEnter.append('g')
+ .attr('class', classAreas);
+ // Circles for each data point on lines
+ mainLineEnter.append('g')
+ .attr("class", function (d) { return $$.generateClass(CLASS.selectedCircles, d.id); });
+ mainLineEnter.append('g')
+ .attr("class", classCircles)
+ .style("cursor", function (d) { return config.data_selection_isselectable(d) ? "pointer" : null; });
+ // Update date for selected circles
+ targets.forEach(function (t) {
+ $$.main.selectAll('.' + CLASS.selectedCircles + $$.getTargetSelectorSuffix(t.id)).selectAll('.' + CLASS.selectedCircle).each(function (d) {
+ d.value = t.values[d.index].value;
+ });
+ });
+ // MEMO: can not keep same color...
+ //mainLineUpdate.exit().remove();
+ };
+ c3_chart_internal_fn.updateLine = function (durationForExit) {
+ var $$ = this;
+ $$.mainLine = $$.main.selectAll('.' + CLASS.lines).selectAll('.' + CLASS.line)
+ .data($$.lineData.bind($$));
+ $$.mainLine.enter().append('path')
+ .attr('class', $$.classLine.bind($$))
+ .style("stroke", $$.color);
+ $$.mainLine
+ .style("opacity", $$.initialOpacity.bind($$))
+ .style('shape-rendering', function (d) { return $$.isStepType(d) ? 'crispEdges' : ''; })
+ .attr('transform', null);
+ $$.mainLine.exit().transition().duration(durationForExit)
+ .style('opacity', 0)
+ .remove();
+ };
+ c3_chart_internal_fn.redrawLine = function (drawLine, withTransition) {
+ return [
+ (withTransition ? this.mainLine.transition(Math.random().toString()) : this.mainLine)
+ .attr("d", drawLine)
+ .style("stroke", this.color)
+ .style("opacity", 1)
+ ];
+ };
+ c3_chart_internal_fn.generateDrawLine = function (lineIndices, isSub) {
+ var $$ = this, config = $$.config,
+ line = $$.d3.svg.line(),
+ getPoints = $$.generateGetLinePoints(lineIndices, isSub),
+ yScaleGetter = isSub ? $$.getSubYScale : $$.getYScale,
+ xValue = function (d) { return (isSub ? $$.subxx : $$.xx).call($$, d); },
+ yValue = function (d, i) {
+ return config.data_groups.length > 0 ? getPoints(d, i)[0][1] : yScaleGetter.call($$, d.id)(d.value);
+ };
+
+ line = config.axis_rotated ? line.x(yValue).y(xValue) : line.x(xValue).y(yValue);
+ if (!config.line_connectNull) { line = line.defined(function (d) { return d.value != null; }); }
+ return function (d) {
+ var values = config.line_connectNull ? $$.filterRemoveNull(d.values) : d.values,
+ x = isSub ? $$.x : $$.subX, y = yScaleGetter.call($$, d.id), x0 = 0, y0 = 0, path;
+ if ($$.isLineType(d)) {
+ if (config.data_regions[d.id]) {
+ path = $$.lineWithRegions(values, x, y, config.data_regions[d.id]);
+ } else {
+ if ($$.isStepType(d)) { values = $$.convertValuesToStep(values); }
+ path = line.interpolate($$.getInterpolate(d))(values);
+ }
+ } else {
+ if (values[0]) {
+ x0 = x(values[0].x);
+ y0 = y(values[0].value);
+ }
+ path = config.axis_rotated ? "M " + y0 + " " + x0 : "M " + x0 + " " + y0;
+ }
+ return path ? path : "M 0 0";
+ };
+ };
+ c3_chart_internal_fn.generateGetLinePoints = function (lineIndices, isSub) { // partial duplication of generateGetBarPoints
+ var $$ = this, config = $$.config,
+ lineTargetsNum = lineIndices.__max__ + 1,
+ x = $$.getShapeX(0, lineTargetsNum, lineIndices, !!isSub),
+ y = $$.getShapeY(!!isSub),
+ lineOffset = $$.getShapeOffset($$.isLineType, lineIndices, !!isSub),
+ yScale = isSub ? $$.getSubYScale : $$.getYScale;
+ return function (d, i) {
+ var y0 = yScale.call($$, d.id)(0),
+ offset = lineOffset(d, i) || y0, // offset is for stacked area chart
+ posX = x(d), posY = y(d);
+ // fix posY not to overflow opposite quadrant
+ if (config.axis_rotated) {
+ if ((0 < d.value && posY < y0) || (d.value < 0 && y0 < posY)) { posY = y0; }
+ }
+ // 1 point that marks the line position
+ return [
+ [posX, posY - (y0 - offset)],
+ [posX, posY - (y0 - offset)], // needed for compatibility
+ [posX, posY - (y0 - offset)], // needed for compatibility
+ [posX, posY - (y0 - offset)] // needed for compatibility
+ ];
+ };
+ };
+
+
+ c3_chart_internal_fn.lineWithRegions = function (d, x, y, _regions) {
+ var $$ = this, config = $$.config,
+ prev = -1, i, j,
+ s = "M", sWithRegion,
+ xp, yp, dx, dy, dd, diff, diffx2,
+ xOffset = $$.isCategorized() ? 0.5 : 0,
+ xValue, yValue,
+ regions = [];
+
+ function isWithinRegions(x, regions) {
+ var i;
+ for (i = 0; i < regions.length; i++) {
+ if (regions[i].start < x && x <= regions[i].end) { return true; }
+ }
+ return false;
+ }
+
+ // Check start/end of regions
+ if (isDefined(_regions)) {
+ for (i = 0; i < _regions.length; i++) {
+ regions[i] = {};
+ if (isUndefined(_regions[i].start)) {
+ regions[i].start = d[0].x;
+ } else {
+ regions[i].start = $$.isTimeSeries() ? $$.parseDate(_regions[i].start) : _regions[i].start;
+ }
+ if (isUndefined(_regions[i].end)) {
+ regions[i].end = d[d.length - 1].x;
+ } else {
+ regions[i].end = $$.isTimeSeries() ? $$.parseDate(_regions[i].end) : _regions[i].end;
+ }
+ }
+ }
+
+ // Set scales
+ xValue = config.axis_rotated ? function (d) { return y(d.value); } : function (d) { return x(d.x); };
+ yValue = config.axis_rotated ? function (d) { return x(d.x); } : function (d) { return y(d.value); };
+
+ // Define svg generator function for region
+ function generateM(points) {
+ return 'M' + points[0][0] + ' ' + points[0][1] + ' ' + points[1][0] + ' ' + points[1][1];
+ }
+ if ($$.isTimeSeries()) {
+ sWithRegion = function (d0, d1, j, diff) {
+ var x0 = d0.x.getTime(), x_diff = d1.x - d0.x,
+ xv0 = new Date(x0 + x_diff * j),
+ xv1 = new Date(x0 + x_diff * (j + diff)),
+ points;
+ if (config.axis_rotated) {
+ points = [[y(yp(j)), x(xv0)], [y(yp(j + diff)), x(xv1)]];
+ } else {
+ points = [[x(xv0), y(yp(j))], [x(xv1), y(yp(j + diff))]];
+ }
+ return generateM(points);
+ };
+ } else {
+ sWithRegion = function (d0, d1, j, diff) {
+ var points;
+ if (config.axis_rotated) {
+ points = [[y(yp(j), true), x(xp(j))], [y(yp(j + diff), true), x(xp(j + diff))]];
+ } else {
+ points = [[x(xp(j), true), y(yp(j))], [x(xp(j + diff), true), y(yp(j + diff))]];
+ }
+ return generateM(points);
+ };
+ }
+
+ // Generate
+ for (i = 0; i < d.length; i++) {
+
+ // Draw as normal
+ if (isUndefined(regions) || ! isWithinRegions(d[i].x, regions)) {
+ s += " " + xValue(d[i]) + " " + yValue(d[i]);
+ }
+ // Draw with region // TODO: Fix for horizotal charts
+ else {
+ xp = $$.getScale(d[i - 1].x + xOffset, d[i].x + xOffset, $$.isTimeSeries());
+ yp = $$.getScale(d[i - 1].value, d[i].value);
+
+ dx = x(d[i].x) - x(d[i - 1].x);
+ dy = y(d[i].value) - y(d[i - 1].value);
+ dd = Math.sqrt(Math.pow(dx, 2) + Math.pow(dy, 2));
+ diff = 2 / dd;
+ diffx2 = diff * 2;
+
+ for (j = diff; j <= 1; j += diffx2) {
+ s += sWithRegion(d[i - 1], d[i], j, diff);
+ }
+ }
+ prev = d[i].x;
+ }
+
+ return s;
+ };
+
+
+ c3_chart_internal_fn.updateArea = function (durationForExit) {
+ var $$ = this, d3 = $$.d3;
+ $$.mainArea = $$.main.selectAll('.' + CLASS.areas).selectAll('.' + CLASS.area)
+ .data($$.lineData.bind($$));
+ $$.mainArea.enter().append('path')
+ .attr("class", $$.classArea.bind($$))
+ .style("fill", $$.color)
+ .style("opacity", function () { $$.orgAreaOpacity = +d3.select(this).style('opacity'); return 0; });
+ $$.mainArea
+ .style("opacity", $$.orgAreaOpacity);
+ $$.mainArea.exit().transition().duration(durationForExit)
+ .style('opacity', 0)
+ .remove();
+ };
+ c3_chart_internal_fn.redrawArea = function (drawArea, withTransition) {
+ return [
+ (withTransition ? this.mainArea.transition(Math.random().toString()) : this.mainArea)
+ .attr("d", drawArea)
+ .style("fill", this.color)
+ .style("opacity", this.orgAreaOpacity)
+ ];
+ };
+ c3_chart_internal_fn.generateDrawArea = function (areaIndices, isSub) {
+ var $$ = this, config = $$.config, area = $$.d3.svg.area(),
+ getPoints = $$.generateGetAreaPoints(areaIndices, isSub),
+ yScaleGetter = isSub ? $$.getSubYScale : $$.getYScale,
+ xValue = function (d) { return (isSub ? $$.subxx : $$.xx).call($$, d); },
+ value0 = function (d, i) {
+ return config.data_groups.length > 0 ? getPoints(d, i)[0][1] : yScaleGetter.call($$, d.id)($$.getAreaBaseValue(d.id));
+ },
+ value1 = function (d, i) {
+ return config.data_groups.length > 0 ? getPoints(d, i)[1][1] : yScaleGetter.call($$, d.id)(d.value);
+ };
+
+ area = config.axis_rotated ? area.x0(value0).x1(value1).y(xValue) : area.x(xValue).y0(value0).y1(value1);
+ if (!config.line_connectNull) {
+ area = area.defined(function (d) { return d.value !== null; });
+ }
+
+ return function (d) {
+ var values = config.line_connectNull ? $$.filterRemoveNull(d.values) : d.values,
+ x0 = 0, y0 = 0, path;
+ if ($$.isAreaType(d)) {
+ if ($$.isStepType(d)) { values = $$.convertValuesToStep(values); }
+ path = area.interpolate($$.getInterpolate(d))(values);
+ } else {
+ if (values[0]) {
+ x0 = $$.x(values[0].x);
+ y0 = $$.getYScale(d.id)(values[0].value);
+ }
+ path = config.axis_rotated ? "M " + y0 + " " + x0 : "M " + x0 + " " + y0;
+ }
+ return path ? path : "M 0 0";
+ };
+ };
+ c3_chart_internal_fn.getAreaBaseValue = function () {
+ return 0;
+ };
+ c3_chart_internal_fn.generateGetAreaPoints = function (areaIndices, isSub) { // partial duplication of generateGetBarPoints
+ var $$ = this, config = $$.config,
+ areaTargetsNum = areaIndices.__max__ + 1,
+ x = $$.getShapeX(0, areaTargetsNum, areaIndices, !!isSub),
+ y = $$.getShapeY(!!isSub),
+ areaOffset = $$.getShapeOffset($$.isAreaType, areaIndices, !!isSub),
+ yScale = isSub ? $$.getSubYScale : $$.getYScale;
+ return function (d, i) {
+ var y0 = yScale.call($$, d.id)(0),
+ offset = areaOffset(d, i) || y0, // offset is for stacked area chart
+ posX = x(d), posY = y(d);
+ // fix posY not to overflow opposite quadrant
+ if (config.axis_rotated) {
+ if ((0 < d.value && posY < y0) || (d.value < 0 && y0 < posY)) { posY = y0; }
+ }
+ // 1 point that marks the area position
+ return [
+ [posX, offset],
+ [posX, posY - (y0 - offset)],
+ [posX, posY - (y0 - offset)], // needed for compatibility
+ [posX, offset] // needed for compatibility
+ ];
+ };
+ };
+
+
+ c3_chart_internal_fn.updateCircle = function () {
+ var $$ = this;
+ $$.mainCircle = $$.main.selectAll('.' + CLASS.circles).selectAll('.' + CLASS.circle)
+ .data($$.lineOrScatterData.bind($$));
+ $$.mainCircle.enter().append("circle")
+ .attr("class", $$.classCircle.bind($$))
+ .attr("r", $$.pointR.bind($$))
+ .style("fill", $$.color);
+ $$.mainCircle
+ .style("opacity", $$.initialOpacityForCircle.bind($$));
+ $$.mainCircle.exit().remove();
+ };
+ c3_chart_internal_fn.redrawCircle = function (cx, cy, withTransition) {
+ var selectedCircles = this.main.selectAll('.' + CLASS.selectedCircle);
+ return [
+ (withTransition ? this.mainCircle.transition(Math.random().toString()) : this.mainCircle)
+ .style('opacity', this.opacityForCircle.bind(this))
+ .style("fill", this.color)
+ .attr("cx", cx)
+ .attr("cy", cy),
+ (withTransition ? selectedCircles.transition(Math.random().toString()) : selectedCircles)
+ .attr("cx", cx)
+ .attr("cy", cy)
+ ];
+ };
+ c3_chart_internal_fn.circleX = function (d) {
+ return d.x || d.x === 0 ? this.x(d.x) : null;
+ };
+ c3_chart_internal_fn.updateCircleY = function () {
+ var $$ = this, lineIndices, getPoints;
+ if ($$.config.data_groups.length > 0) {
+ lineIndices = $$.getShapeIndices($$.isLineType),
+ getPoints = $$.generateGetLinePoints(lineIndices);
+ $$.circleY = function (d, i) {
+ return getPoints(d, i)[0][1];
+ };
+ } else {
+ $$.circleY = function (d) {
+ return $$.getYScale(d.id)(d.value);
+ };
+ }
+ };
+ c3_chart_internal_fn.getCircles = function (i, id) {
+ var $$ = this;
+ return (id ? $$.main.selectAll('.' + CLASS.circles + $$.getTargetSelectorSuffix(id)) : $$.main).selectAll('.' + CLASS.circle + (isValue(i) ? '-' + i : ''));
+ };
+ c3_chart_internal_fn.expandCircles = function (i, id, reset) {
+ var $$ = this,
+ r = $$.pointExpandedR.bind($$);
+ if (reset) { $$.unexpandCircles(); }
+ $$.getCircles(i, id)
+ .classed(CLASS.EXPANDED, true)
+ .attr('r', r);
+ };
+ c3_chart_internal_fn.unexpandCircles = function (i) {
+ var $$ = this,
+ r = $$.pointR.bind($$);
+ $$.getCircles(i)
+ .filter(function () { return $$.d3.select(this).classed(CLASS.EXPANDED); })
+ .classed(CLASS.EXPANDED, false)
+ .attr('r', r);
+ };
+ c3_chart_internal_fn.pointR = function (d) {
+ var $$ = this, config = $$.config;
+ return $$.isStepType(d) ? 0 : (isFunction(config.point_r) ? config.point_r(d) : config.point_r);
+ };
+ c3_chart_internal_fn.pointExpandedR = function (d) {
+ var $$ = this, config = $$.config;
+ return config.point_focus_expand_enabled ? (config.point_focus_expand_r ? config.point_focus_expand_r : $$.pointR(d) * 1.75) : $$.pointR(d);
+ };
+ c3_chart_internal_fn.pointSelectR = function (d) {
+ var $$ = this, config = $$.config;
+ return config.point_select_r ? config.point_select_r : $$.pointR(d) * 4;
+ };
+ c3_chart_internal_fn.isWithinCircle = function (that, r) {
+ var d3 = this.d3,
+ mouse = d3.mouse(that), d3_this = d3.select(that),
+ cx = +d3_this.attr("cx"), cy = +d3_this.attr("cy");
+ return Math.sqrt(Math.pow(cx - mouse[0], 2) + Math.pow(cy - mouse[1], 2)) < r;
+ };
+ c3_chart_internal_fn.isWithinStep = function (that, y) {
+ return Math.abs(y - this.d3.mouse(that)[1]) < 30;
+ };
+
+ c3_chart_internal_fn.initBar = function () {
+ var $$ = this;
+ $$.main.select('.' + CLASS.chart).append("g")
+ .attr("class", CLASS.chartBars);
+ };
+ c3_chart_internal_fn.updateTargetsForBar = function (targets) {
+ var $$ = this, config = $$.config,
+ mainBarUpdate, mainBarEnter,
+ classChartBar = $$.classChartBar.bind($$),
+ classBars = $$.classBars.bind($$),
+ classFocus = $$.classFocus.bind($$);
+ mainBarUpdate = $$.main.select('.' + CLASS.chartBars).selectAll('.' + CLASS.chartBar)
+ .data(targets)
+ .attr('class', function (d) { return classChartBar(d) + classFocus(d); });
+ mainBarEnter = mainBarUpdate.enter().append('g')
+ .attr('class', classChartBar)
+ .style('opacity', 0)
+ .style("pointer-events", "none");
+ // Bars for each data
+ mainBarEnter.append('g')
+ .attr("class", classBars)
+ .style("cursor", function (d) { return config.data_selection_isselectable(d) ? "pointer" : null; });
+
+ };
+ c3_chart_internal_fn.updateBar = function (durationForExit) {
+ var $$ = this,
+ barData = $$.barData.bind($$),
+ classBar = $$.classBar.bind($$),
+ initialOpacity = $$.initialOpacity.bind($$),
+ color = function (d) { return $$.color(d.id); };
+ $$.mainBar = $$.main.selectAll('.' + CLASS.bars).selectAll('.' + CLASS.bar)
+ .data(barData);
+ $$.mainBar.enter().append('path')
+ .attr("class", classBar)
+ .style("stroke", color)
+ .style("fill", color);
+ $$.mainBar
+ .style("opacity", initialOpacity);
+ $$.mainBar.exit().transition().duration(durationForExit)
+ .style('opacity', 0)
+ .remove();
+ };
+ c3_chart_internal_fn.redrawBar = function (drawBar, withTransition) {
+ return [
+ (withTransition ? this.mainBar.transition(Math.random().toString()) : this.mainBar)
+ .attr('d', drawBar)
+ .style("fill", this.color)
+ .style("opacity", 1)
+ ];
+ };
+ c3_chart_internal_fn.getBarW = function (axis, barTargetsNum) {
+ var $$ = this, config = $$.config,
+ w = typeof config.bar_width === 'number' ? config.bar_width : barTargetsNum ? (axis.tickInterval() * config.bar_width_ratio) / barTargetsNum : 0;
+ return config.bar_width_max && w > config.bar_width_max ? config.bar_width_max : w;
+ };
+ c3_chart_internal_fn.getBars = function (i, id) {
+ var $$ = this;
+ return (id ? $$.main.selectAll('.' + CLASS.bars + $$.getTargetSelectorSuffix(id)) : $$.main).selectAll('.' + CLASS.bar + (isValue(i) ? '-' + i : ''));
+ };
+ c3_chart_internal_fn.expandBars = function (i, id, reset) {
+ var $$ = this;
+ if (reset) { $$.unexpandBars(); }
+ $$.getBars(i, id).classed(CLASS.EXPANDED, true);
+ };
+ c3_chart_internal_fn.unexpandBars = function (i) {
+ var $$ = this;
+ $$.getBars(i).classed(CLASS.EXPANDED, false);
+ };
+ c3_chart_internal_fn.generateDrawBar = function (barIndices, isSub) {
+ var $$ = this, config = $$.config,
+ getPoints = $$.generateGetBarPoints(barIndices, isSub);
+ return function (d, i) {
+ // 4 points that make a bar
+ var points = getPoints(d, i);
+
+ // switch points if axis is rotated, not applicable for sub chart
+ var indexX = config.axis_rotated ? 1 : 0;
+ var indexY = config.axis_rotated ? 0 : 1;
+
+ var path = 'M ' + points[0][indexX] + ',' + points[0][indexY] + ' ' +
+ 'L' + points[1][indexX] + ',' + points[1][indexY] + ' ' +
+ 'L' + points[2][indexX] + ',' + points[2][indexY] + ' ' +
+ 'L' + points[3][indexX] + ',' + points[3][indexY] + ' ' +
+ 'z';
+
+ return path;
+ };
+ };
+ c3_chart_internal_fn.generateGetBarPoints = function (barIndices, isSub) {
+ var $$ = this,
+ axis = isSub ? $$.subXAxis : $$.xAxis,
+ barTargetsNum = barIndices.__max__ + 1,
+ barW = $$.getBarW(axis, barTargetsNum),
+ barX = $$.getShapeX(barW, barTargetsNum, barIndices, !!isSub),
+ barY = $$.getShapeY(!!isSub),
+ barOffset = $$.getShapeOffset($$.isBarType, barIndices, !!isSub),
+ yScale = isSub ? $$.getSubYScale : $$.getYScale;
+ return function (d, i) {
+ var y0 = yScale.call($$, d.id)(0),
+ offset = barOffset(d, i) || y0, // offset is for stacked bar chart
+ posX = barX(d), posY = barY(d);
+ // fix posY not to overflow opposite quadrant
+ if ($$.config.axis_rotated) {
+ if ((0 < d.value && posY < y0) || (d.value < 0 && y0 < posY)) { posY = y0; }
+ }
+ // 4 points that make a bar
+ return [
+ [posX, offset],
+ [posX, posY - (y0 - offset)],
+ [posX + barW, posY - (y0 - offset)],
+ [posX + barW, offset]
+ ];
+ };
+ };
+ c3_chart_internal_fn.isWithinBar = function (that) {
+ var mouse = this.d3.mouse(that), box = that.getBoundingClientRect(),
+ seg0 = that.pathSegList.getItem(0), seg1 = that.pathSegList.getItem(1),
+ x = Math.min(seg0.x, seg1.x), y = Math.min(seg0.y, seg1.y),
+ w = box.width, h = box.height, offset = 2,
+ sx = x - offset, ex = x + w + offset, sy = y + h + offset, ey = y - offset;
+ return sx < mouse[0] && mouse[0] < ex && ey < mouse[1] && mouse[1] < sy;
+ };
+
+ c3_chart_internal_fn.initText = function () {
+ var $$ = this;
+ $$.main.select('.' + CLASS.chart).append("g")
+ .attr("class", CLASS.chartTexts);
+ $$.mainText = $$.d3.selectAll([]);
+ };
+ c3_chart_internal_fn.updateTargetsForText = function (targets) {
+ var $$ = this, mainTextUpdate, mainTextEnter,
+ classChartText = $$.classChartText.bind($$),
+ classTexts = $$.classTexts.bind($$),
+ classFocus = $$.classFocus.bind($$);
+ mainTextUpdate = $$.main.select('.' + CLASS.chartTexts).selectAll('.' + CLASS.chartText)
+ .data(targets)
+ .attr('class', function (d) { return classChartText(d) + classFocus(d); });
+ mainTextEnter = mainTextUpdate.enter().append('g')
+ .attr('class', classChartText)
+ .style('opacity', 0)
+ .style("pointer-events", "none");
+ mainTextEnter.append('g')
+ .attr('class', classTexts);
+ };
+ c3_chart_internal_fn.updateText = function (durationForExit) {
+ var $$ = this, config = $$.config,
+ barOrLineData = $$.barOrLineData.bind($$),
+ classText = $$.classText.bind($$);
+ $$.mainText = $$.main.selectAll('.' + CLASS.texts).selectAll('.' + CLASS.text)
+ .data(barOrLineData);
+ $$.mainText.enter().append('text')
+ .attr("class", classText)
+ .attr('text-anchor', function (d) { return config.axis_rotated ? (d.value < 0 ? 'end' : 'start') : 'middle'; })
+ .style("stroke", 'none')
+ .style("fill", function (d) { return $$.color(d); })
+ .style("fill-opacity", 0);
+ $$.mainText
+ .text(function (d, i, j) { return $$.dataLabelFormat(d.id)(d.value, d.id, i, j); });
+ $$.mainText.exit()
+ .transition().duration(durationForExit)
+ .style('fill-opacity', 0)
+ .remove();
+ };
+ c3_chart_internal_fn.redrawText = function (xForText, yForText, forFlow, withTransition) {
+ return [
+ (withTransition ? this.mainText.transition() : this.mainText)
+ .attr('x', xForText)
+ .attr('y', yForText)
+ .style("fill", this.color)
+ .style("fill-opacity", forFlow ? 0 : this.opacityForText.bind(this))
+ ];
+ };
+ c3_chart_internal_fn.getTextRect = function (text, cls, element) {
+ var dummy = this.d3.select('body').append('div').classed('c3', true),
+ svg = dummy.append("svg").style('visibility', 'hidden').style('position', 'fixed').style('top', 0).style('left', 0),
+ font = this.d3.select(element).style('font'),
+ rect;
+ svg.selectAll('.dummy')
+ .data([text])
+ .enter().append('text')
+ .classed(cls ? cls : "", true)
+ .style('font', font)
+ .text(text)
+ .each(function () { rect = this.getBoundingClientRect(); });
+ dummy.remove();
+ return rect;
+ };
+ c3_chart_internal_fn.generateXYForText = function (areaIndices, barIndices, lineIndices, forX) {
+ var $$ = this,
+ getAreaPoints = $$.generateGetAreaPoints(areaIndices, false),
+ getBarPoints = $$.generateGetBarPoints(barIndices, false),
+ getLinePoints = $$.generateGetLinePoints(lineIndices, false),
+ getter = forX ? $$.getXForText : $$.getYForText;
+ return function (d, i) {
+ var getPoints = $$.isAreaType(d) ? getAreaPoints : $$.isBarType(d) ? getBarPoints : getLinePoints;
+ return getter.call($$, getPoints(d, i), d, this);
+ };
+ };
+ c3_chart_internal_fn.getXForText = function (points, d, textElement) {
+ var $$ = this,
+ box = textElement.getBoundingClientRect(), xPos, padding;
+ if ($$.config.axis_rotated) {
+ padding = $$.isBarType(d) ? 4 : 6;
+ xPos = points[2][1] + padding * (d.value < 0 ? -1 : 1);
+ } else {
+ xPos = $$.hasType('bar') ? (points[2][0] + points[0][0]) / 2 : points[0][0];
+ }
+ // show labels regardless of the domain if value is null
+ if (d.value === null) {
+ if (xPos > $$.width) {
+ xPos = $$.width - box.width;
+ } else if (xPos < 0) {
+ xPos = 4;
+ }
+ }
+ return xPos;
+ };
+ c3_chart_internal_fn.getYForText = function (points, d, textElement) {
+ var $$ = this,
+ box = textElement.getBoundingClientRect(),
+ yPos;
+ if ($$.config.axis_rotated) {
+ yPos = (points[0][0] + points[2][0] + box.height * 0.6) / 2;
+ } else {
+ yPos = points[2][1];
+ if (d.value < 0 || (d.value === 0 && !$$.hasPositiveValue)) {
+ yPos += box.height;
+ if ($$.isBarType(d) && $$.isSafari()) {
+ yPos -= 3;
+ }
+ else if (!$$.isBarType(d) && $$.isChrome()) {
+ yPos += 3;
+ }
+ } else {
+ yPos += $$.isBarType(d) ? -3 : -6;
+ }
+ }
+ // show labels regardless of the domain if value is null
+ if (d.value === null && !$$.config.axis_rotated) {
+ if (yPos < box.height) {
+ yPos = box.height;
+ } else if (yPos > this.height) {
+ yPos = this.height - 4;
+ }
+ }
+ return yPos;
+ };
+
+ c3_chart_internal_fn.setTargetType = function (targetIds, type) {
+ var $$ = this, config = $$.config;
+ $$.mapToTargetIds(targetIds).forEach(function (id) {
+ $$.withoutFadeIn[id] = (type === config.data_types[id]);
+ config.data_types[id] = type;
+ });
+ if (!targetIds) {
+ config.data_type = type;
+ }
+ };
+ c3_chart_internal_fn.hasType = function (type, targets) {
+ var $$ = this, types = $$.config.data_types, has = false;
+ targets = targets || $$.data.targets;
+ if (targets && targets.length) {
+ targets.forEach(function (target) {
+ var t = types[target.id];
+ if ((t && t.indexOf(type) >= 0) || (!t && type === 'line')) {
+ has = true;
+ }
+ });
+ } else if (Object.keys(types).length) {
+ Object.keys(types).forEach(function (id) {
+ if (types[id] === type) { has = true; }
+ });
+ } else {
+ has = $$.config.data_type === type;
+ }
+ return has;
+ };
+ c3_chart_internal_fn.hasArcType = function (targets) {
+ return this.hasType('pie', targets) || this.hasType('donut', targets) || this.hasType('gauge', targets);
+ };
+ c3_chart_internal_fn.isLineType = function (d) {
+ var config = this.config, id = isString(d) ? d : d.id;
+ return !config.data_types[id] || ['line', 'spline', 'area', 'area-spline', 'step', 'area-step'].indexOf(config.data_types[id]) >= 0;
+ };
+ c3_chart_internal_fn.isStepType = function (d) {
+ var id = isString(d) ? d : d.id;
+ return ['step', 'area-step'].indexOf(this.config.data_types[id]) >= 0;
+ };
+ c3_chart_internal_fn.isSplineType = function (d) {
+ var id = isString(d) ? d : d.id;
+ return ['spline', 'area-spline'].indexOf(this.config.data_types[id]) >= 0;
+ };
+ c3_chart_internal_fn.isAreaType = function (d) {
+ var id = isString(d) ? d : d.id;
+ return ['area', 'area-spline', 'area-step'].indexOf(this.config.data_types[id]) >= 0;
+ };
+ c3_chart_internal_fn.isBarType = function (d) {
+ var id = isString(d) ? d : d.id;
+ return this.config.data_types[id] === 'bar';
+ };
+ c3_chart_internal_fn.isScatterType = function (d) {
+ var id = isString(d) ? d : d.id;
+ return this.config.data_types[id] === 'scatter';
+ };
+ c3_chart_internal_fn.isPieType = function (d) {
+ var id = isString(d) ? d : d.id;
+ return this.config.data_types[id] === 'pie';
+ };
+ c3_chart_internal_fn.isGaugeType = function (d) {
+ var id = isString(d) ? d : d.id;
+ return this.config.data_types[id] === 'gauge';
+ };
+ c3_chart_internal_fn.isDonutType = function (d) {
+ var id = isString(d) ? d : d.id;
+ return this.config.data_types[id] === 'donut';
+ };
+ c3_chart_internal_fn.isArcType = function (d) {
+ return this.isPieType(d) || this.isDonutType(d) || this.isGaugeType(d);
+ };
+ c3_chart_internal_fn.lineData = function (d) {
+ return this.isLineType(d) ? [d] : [];
+ };
+ c3_chart_internal_fn.arcData = function (d) {
+ return this.isArcType(d.data) ? [d] : [];
+ };
+ /* not used
+ function scatterData(d) {
+ return isScatterType(d) ? d.values : [];
+ }
+ */
+ c3_chart_internal_fn.barData = function (d) {
+ return this.isBarType(d) ? d.values : [];
+ };
+ c3_chart_internal_fn.lineOrScatterData = function (d) {
+ return this.isLineType(d) || this.isScatterType(d) ? d.values : [];
+ };
+ c3_chart_internal_fn.barOrLineData = function (d) {
+ return this.isBarType(d) || this.isLineType(d) ? d.values : [];
+ };
+ c3_chart_internal_fn.isInterpolationType = function (type) {
+ return ['linear', 'linear-closed', 'basis', 'basis-open', 'basis-closed', 'bundle', 'cardinal', 'cardinal-open', 'cardinal-closed', 'monotone'].indexOf(type) >= 0;
+ };
+
+ c3_chart_internal_fn.initGrid = function () {
+ var $$ = this, config = $$.config, d3 = $$.d3;
+ $$.grid = $$.main.append('g')
+ .attr("clip-path", $$.clipPathForGrid)
+ .attr('class', CLASS.grid);
+ if (config.grid_x_show) {
+ $$.grid.append("g").attr("class", CLASS.xgrids);
+ }
+ if (config.grid_y_show) {
+ $$.grid.append('g').attr('class', CLASS.ygrids);
+ }
+ if (config.grid_focus_show) {
+ $$.grid.append('g')
+ .attr("class", CLASS.xgridFocus)
+ .append('line')
+ .attr('class', CLASS.xgridFocus);
+ }
+ $$.xgrid = d3.selectAll([]);
+ if (!config.grid_lines_front) { $$.initGridLines(); }
+ };
+ c3_chart_internal_fn.initGridLines = function () {
+ var $$ = this, d3 = $$.d3;
+ $$.gridLines = $$.main.append('g')
+ .attr("clip-path", $$.clipPathForGrid)
+ .attr('class', CLASS.grid + ' ' + CLASS.gridLines);
+ $$.gridLines.append('g').attr("class", CLASS.xgridLines);
+ $$.gridLines.append('g').attr('class', CLASS.ygridLines);
+ $$.xgridLines = d3.selectAll([]);
+ };
+ c3_chart_internal_fn.updateXGrid = function (withoutUpdate) {
+ var $$ = this, config = $$.config, d3 = $$.d3,
+ xgridData = $$.generateGridData(config.grid_x_type, $$.x),
+ tickOffset = $$.isCategorized() ? $$.xAxis.tickOffset() : 0;
+
+ $$.xgridAttr = config.axis_rotated ? {
+ 'x1': 0,
+ 'x2': $$.width,
+ 'y1': function (d) { return $$.x(d) - tickOffset; },
+ 'y2': function (d) { return $$.x(d) - tickOffset; }
+ } : {
+ 'x1': function (d) { return $$.x(d) + tickOffset; },
+ 'x2': function (d) { return $$.x(d) + tickOffset; },
+ 'y1': 0,
+ 'y2': $$.height
+ };
+
+ $$.xgrid = $$.main.select('.' + CLASS.xgrids).selectAll('.' + CLASS.xgrid)
+ .data(xgridData);
+ $$.xgrid.enter().append('line').attr("class", CLASS.xgrid);
+ if (!withoutUpdate) {
+ $$.xgrid.attr($$.xgridAttr)
+ .style("opacity", function () { return +d3.select(this).attr(config.axis_rotated ? 'y1' : 'x1') === (config.axis_rotated ? $$.height : 0) ? 0 : 1; });
+ }
+ $$.xgrid.exit().remove();
+ };
+
+ c3_chart_internal_fn.updateYGrid = function () {
+ var $$ = this, config = $$.config,
+ gridValues = $$.yAxis.tickValues() || $$.y.ticks(config.grid_y_ticks);
+ $$.ygrid = $$.main.select('.' + CLASS.ygrids).selectAll('.' + CLASS.ygrid)
+ .data(gridValues);
+ $$.ygrid.enter().append('line')
+ .attr('class', CLASS.ygrid);
+ $$.ygrid.attr("x1", config.axis_rotated ? $$.y : 0)
+ .attr("x2", config.axis_rotated ? $$.y : $$.width)
+ .attr("y1", config.axis_rotated ? 0 : $$.y)
+ .attr("y2", config.axis_rotated ? $$.height : $$.y);
+ $$.ygrid.exit().remove();
+ $$.smoothLines($$.ygrid, 'grid');
+ };
+
+ c3_chart_internal_fn.gridTextAnchor = function (d) {
+ return d.position ? d.position : "end";
+ };
+ c3_chart_internal_fn.gridTextDx = function (d) {
+ return d.position === 'start' ? 4 : d.position === 'middle' ? 0 : -4;
+ };
+ c3_chart_internal_fn.xGridTextX = function (d) {
+ return d.position === 'start' ? -this.height : d.position === 'middle' ? -this.height / 2 : 0;
+ };
+ c3_chart_internal_fn.yGridTextX = function (d) {
+ return d.position === 'start' ? 0 : d.position === 'middle' ? this.width / 2 : this.width;
+ };
+ c3_chart_internal_fn.updateGrid = function (duration) {
+ var $$ = this, main = $$.main, config = $$.config,
+ xgridLine, ygridLine, yv;
+
+ // hide if arc type
+ $$.grid.style('visibility', $$.hasArcType() ? 'hidden' : 'visible');
+
+ main.select('line.' + CLASS.xgridFocus).style("visibility", "hidden");
+ if (config.grid_x_show) {
+ $$.updateXGrid();
+ }
+ $$.xgridLines = main.select('.' + CLASS.xgridLines).selectAll('.' + CLASS.xgridLine)
+ .data(config.grid_x_lines);
+ // enter
+ xgridLine = $$.xgridLines.enter().append('g')
+ .attr("class", function (d) { return CLASS.xgridLine + (d['class'] ? ' ' + d['class'] : ''); });
+ xgridLine.append('line')
+ .style("opacity", 0);
+ xgridLine.append('text')
+ .attr("text-anchor", $$.gridTextAnchor)
+ .attr("transform", config.axis_rotated ? "" : "rotate(-90)")
+ .attr('dx', $$.gridTextDx)
+ .attr('dy', -5)
+ .style("opacity", 0);
+ // udpate
+ // done in d3.transition() of the end of this function
+ // exit
+ $$.xgridLines.exit().transition().duration(duration)
+ .style("opacity", 0)
+ .remove();
+
+ // Y-Grid
+ if (config.grid_y_show) {
+ $$.updateYGrid();
+ }
+ $$.ygridLines = main.select('.' + CLASS.ygridLines).selectAll('.' + CLASS.ygridLine)
+ .data(config.grid_y_lines);
+ // enter
+ ygridLine = $$.ygridLines.enter().append('g')
+ .attr("class", function (d) { return CLASS.ygridLine + (d['class'] ? ' ' + d['class'] : ''); });
+ ygridLine.append('line')
+ .style("opacity", 0);
+ ygridLine.append('text')
+ .attr("text-anchor", $$.gridTextAnchor)
+ .attr("transform", config.axis_rotated ? "rotate(-90)" : "")
+ .attr('dx', $$.gridTextDx)
+ .attr('dy', -5)
+ .style("opacity", 0);
+ // update
+ yv = $$.yv.bind($$);
+ $$.ygridLines.select('line')
+ .transition().duration(duration)
+ .attr("x1", config.axis_rotated ? yv : 0)
+ .attr("x2", config.axis_rotated ? yv : $$.width)
+ .attr("y1", config.axis_rotated ? 0 : yv)
+ .attr("y2", config.axis_rotated ? $$.height : yv)
+ .style("opacity", 1);
+ $$.ygridLines.select('text')
+ .transition().duration(duration)
+ .attr("x", config.axis_rotated ? $$.xGridTextX.bind($$) : $$.yGridTextX.bind($$))
+ .attr("y", yv)
+ .text(function (d) { return d.text; })
+ .style("opacity", 1);
+ // exit
+ $$.ygridLines.exit().transition().duration(duration)
+ .style("opacity", 0)
+ .remove();
+ };
+ c3_chart_internal_fn.redrawGrid = function (withTransition) {
+ var $$ = this, config = $$.config, xv = $$.xv.bind($$),
+ lines = $$.xgridLines.select('line'),
+ texts = $$.xgridLines.select('text');
+ return [
+ (withTransition ? lines.transition() : lines)
+ .attr("x1", config.axis_rotated ? 0 : xv)
+ .attr("x2", config.axis_rotated ? $$.width : xv)
+ .attr("y1", config.axis_rotated ? xv : 0)
+ .attr("y2", config.axis_rotated ? xv : $$.height)
+ .style("opacity", 1),
+ (withTransition ? texts.transition() : texts)
+ .attr("x", config.axis_rotated ? $$.yGridTextX.bind($$) : $$.xGridTextX.bind($$))
+ .attr("y", xv)
+ .text(function (d) { return d.text; })
+ .style("opacity", 1)
+ ];
+ };
+ c3_chart_internal_fn.showXGridFocus = function (selectedData) {
+ var $$ = this, config = $$.config,
+ dataToShow = selectedData.filter(function (d) { return d && isValue(d.value); }),
+ focusEl = $$.main.selectAll('line.' + CLASS.xgridFocus),
+ xx = $$.xx.bind($$);
+ if (! config.tooltip_show) { return; }
+ // Hide when scatter plot exists
+ if ($$.hasType('scatter') || $$.hasArcType()) { return; }
+ focusEl
+ .style("visibility", "visible")
+ .data([dataToShow[0]])
+ .attr(config.axis_rotated ? 'y1' : 'x1', xx)
+ .attr(config.axis_rotated ? 'y2' : 'x2', xx);
+ $$.smoothLines(focusEl, 'grid');
+ };
+ c3_chart_internal_fn.hideXGridFocus = function () {
+ this.main.select('line.' + CLASS.xgridFocus).style("visibility", "hidden");
+ };
+ c3_chart_internal_fn.updateXgridFocus = function () {
+ var $$ = this, config = $$.config;
+ $$.main.select('line.' + CLASS.xgridFocus)
+ .attr("x1", config.axis_rotated ? 0 : -10)
+ .attr("x2", config.axis_rotated ? $$.width : -10)
+ .attr("y1", config.axis_rotated ? -10 : 0)
+ .attr("y2", config.axis_rotated ? -10 : $$.height);
+ };
+ c3_chart_internal_fn.generateGridData = function (type, scale) {
+ var $$ = this,
+ gridData = [], xDomain, firstYear, lastYear, i,
+ tickNum = $$.main.select("." + CLASS.axisX).selectAll('.tick').size();
+ if (type === 'year') {
+ xDomain = $$.getXDomain();
+ firstYear = xDomain[0].getFullYear();
+ lastYear = xDomain[1].getFullYear();
+ for (i = firstYear; i <= lastYear; i++) {
+ gridData.push(new Date(i + '-01-01 00:00:00'));
+ }
+ } else {
+ gridData = scale.ticks(10);
+ if (gridData.length > tickNum) { // use only int
+ gridData = gridData.filter(function (d) { return ("" + d).indexOf('.') < 0; });
+ }
+ }
+ return gridData;
+ };
+ c3_chart_internal_fn.getGridFilterToRemove = function (params) {
+ return params ? function (line) {
+ var found = false;
+ [].concat(params).forEach(function (param) {
+ if ((('value' in param && line.value === param.value) || ('class' in param && line['class'] === param['class']))) {
+ found = true;
+ }
+ });
+ return found;
+ } : function () { return true; };
+ };
+ c3_chart_internal_fn.removeGridLines = function (params, forX) {
+ var $$ = this, config = $$.config,
+ toRemove = $$.getGridFilterToRemove(params),
+ toShow = function (line) { return !toRemove(line); },
+ classLines = forX ? CLASS.xgridLines : CLASS.ygridLines,
+ classLine = forX ? CLASS.xgridLine : CLASS.ygridLine;
+ $$.main.select('.' + classLines).selectAll('.' + classLine).filter(toRemove)
+ .transition().duration(config.transition_duration)
+ .style('opacity', 0).remove();
+ if (forX) {
+ config.grid_x_lines = config.grid_x_lines.filter(toShow);
+ } else {
+ config.grid_y_lines = config.grid_y_lines.filter(toShow);
+ }
+ };
+
+ c3_chart_internal_fn.initTooltip = function () {
+ var $$ = this, config = $$.config, i;
+ $$.tooltip = $$.selectChart
+ .style("position", "relative")
+ .append("div")
+ .attr('class', CLASS.tooltipContainer)
+ .style("position", "absolute")
+ .style("pointer-events", "none")
+ .style("display", "none");
+ // Show tooltip if needed
+ if (config.tooltip_init_show) {
+ if ($$.isTimeSeries() && isString(config.tooltip_init_x)) {
+ config.tooltip_init_x = $$.parseDate(config.tooltip_init_x);
+ for (i = 0; i < $$.data.targets[0].values.length; i++) {
+ if (($$.data.targets[0].values[i].x - config.tooltip_init_x) === 0) { break; }
+ }
+ config.tooltip_init_x = i;
+ }
+ $$.tooltip.html(config.tooltip_contents.call($$, $$.data.targets.map(function (d) {
+ return $$.addName(d.values[config.tooltip_init_x]);
+ }), $$.axis.getXAxisTickFormat(), $$.getYFormat($$.hasArcType()), $$.color));
+ $$.tooltip.style("top", config.tooltip_init_position.top)
+ .style("left", config.tooltip_init_position.left)
+ .style("display", "block");
+ }
+ };
+ c3_chart_internal_fn.getTooltipContent = function (d, defaultTitleFormat, defaultValueFormat, color) {
+ var $$ = this, config = $$.config,
+ titleFormat = config.tooltip_format_title || defaultTitleFormat,
+ nameFormat = config.tooltip_format_name || function (name) { return name; },
+ valueFormat = config.tooltip_format_value || defaultValueFormat,
+ text, i, title, value, name, bgcolor,
+ orderAsc = $$.isOrderAsc();
+
+ if (config.data_groups.length === 0) {
+ d.sort(function(a,b){
+ return orderAsc ? a.value - b.value : b.value - a.value;
+ });
+ } else {
+ var ids = $$.orderTargets($$.data.targets).map(function (i) {
+ return i.id;
+ });
+ d.sort(function(a, b) {
+ if (a.value > 0 && b.value > 0) {
+ return orderAsc ? ids.indexOf(a.id) - ids.indexOf(b.id) : ids.indexOf(b.id) - ids.indexOf(a.id);
+ } else {
+ return orderAsc ? a.value - b.value : b.value - a.value;
+ }
+ });
+ }
+
+ for (i = 0; i < d.length; i++) {
+ if (! (d[i] && (d[i].value || d[i].value === 0))) { continue; }
+
+ if (! text) {
+ title = titleFormat ? titleFormat(d[i].x) : d[i].x;
+ text = "<table class='" + $$.CLASS.tooltip + "'>" + (title || title === 0 ? "<tr><th colspan='2'>" + title + "</th></tr>" : "");
+ }
+
+ value = valueFormat(d[i].value, d[i].ratio, d[i].id, d[i].index);
+ if (value !== undefined) {
+ // Skip elements when their name is set to null
+ if (d[i].name === null) { continue; }
+ name = nameFormat(d[i].name, d[i].ratio, d[i].id, d[i].index);
+ bgcolor = $$.levelColor ? $$.levelColor(d[i].value) : color(d[i].id);
+
+ text += "<tr class='" + $$.CLASS.tooltipName + "-" + $$.getTargetSelectorSuffix(d[i].id) + "'>";
+ text += "<td class='name'><span style='background-color:" + bgcolor + "'></span>" + name + "</td>";
+ text += "<td class='value'>" + value + "</td>";
+ text += "</tr>";
+ }
+ }
+ return text + "</table>";
+ };
+ c3_chart_internal_fn.tooltipPosition = function (dataToShow, tWidth, tHeight, element) {
+ var $$ = this, config = $$.config, d3 = $$.d3;
+ var svgLeft, tooltipLeft, tooltipRight, tooltipTop, chartRight;
+ var forArc = $$.hasArcType(),
+ mouse = d3.mouse(element);
+ // Determin tooltip position
+ if (forArc) {
+ tooltipLeft = (($$.width - ($$.isLegendRight ? $$.getLegendWidth() : 0)) / 2) + mouse[0];
+ tooltipTop = ($$.height / 2) + mouse[1] + 20;
+ } else {
+ svgLeft = $$.getSvgLeft(true);
+ if (config.axis_rotated) {
+ tooltipLeft = svgLeft + mouse[0] + 100;
+ tooltipRight = tooltipLeft + tWidth;
+ chartRight = $$.currentWidth - $$.getCurrentPaddingRight();
+ tooltipTop = $$.x(dataToShow[0].x) + 20;
+ } else {
+ tooltipLeft = svgLeft + $$.getCurrentPaddingLeft(true) + $$.x(dataToShow[0].x) + 20;
+ tooltipRight = tooltipLeft + tWidth;
+ chartRight = svgLeft + $$.currentWidth - $$.getCurrentPaddingRight();
+ tooltipTop = mouse[1] + 15;
+ }
+
+ if (tooltipRight > chartRight) {
+ // 20 is needed for Firefox to keep tooltip width
+ tooltipLeft -= tooltipRight - chartRight + 20;
+ }
+ if (tooltipTop + tHeight > $$.currentHeight) {
+ tooltipTop -= tHeight + 30;
+ }
+ }
+ if (tooltipTop < 0) {
+ tooltipTop = 0;
+ }
+ return {top: tooltipTop, left: tooltipLeft};
+ };
+ c3_chart_internal_fn.showTooltip = function (selectedData, element) {
+ var $$ = this, config = $$.config;
+ var tWidth, tHeight, position;
+ var forArc = $$.hasArcType(),
+ dataToShow = selectedData.filter(function (d) { return d && isValue(d.value); }),
+ positionFunction = config.tooltip_position || c3_chart_internal_fn.tooltipPosition;
+ if (dataToShow.length === 0 || !config.tooltip_show) {
+ return;
+ }
+ $$.tooltip.html(config.tooltip_contents.call($$, selectedData, $$.axis.getXAxisTickFormat(), $$.getYFormat(forArc), $$.color)).style("display", "block");
+
+ // Get tooltip dimensions
+ tWidth = $$.tooltip.property('offsetWidth');
+ tHeight = $$.tooltip.property('offsetHeight');
+
+ position = positionFunction.call(this, dataToShow, tWidth, tHeight, element);
+ // Set tooltip
+ $$.tooltip
+ .style("top", position.top + "px")
+ .style("left", position.left + 'px');
+ };
+ c3_chart_internal_fn.hideTooltip = function () {
+ this.tooltip.style("display", "none");
+ };
+
+ c3_chart_internal_fn.initLegend = function () {
+ var $$ = this;
+ $$.legendItemTextBox = {};
+ $$.legendHasRendered = false;
+ $$.legend = $$.svg.append("g").attr("transform", $$.getTranslate('legend'));
+ if (!$$.config.legend_show) {
+ $$.legend.style('visibility', 'hidden');
+ $$.hiddenLegendIds = $$.mapToIds($$.data.targets);
+ return;
+ }
+ // MEMO: call here to update legend box and tranlate for all
+ // MEMO: translate will be upated by this, so transform not needed in updateLegend()
+ $$.updateLegendWithDefaults();
+ };
+ c3_chart_internal_fn.updateLegendWithDefaults = function () {
+ var $$ = this;
+ $$.updateLegend($$.mapToIds($$.data.targets), {withTransform: false, withTransitionForTransform: false, withTransition: false});
+ };
+ c3_chart_internal_fn.updateSizeForLegend = function (legendHeight, legendWidth) {
+ var $$ = this, config = $$.config, insetLegendPosition = {
+ top: $$.isLegendTop ? $$.getCurrentPaddingTop() + config.legend_inset_y + 5.5 : $$.currentHeight - legendHeight - $$.getCurrentPaddingBottom() - config.legend_inset_y,
+ left: $$.isLegendLeft ? $$.getCurrentPaddingLeft() + config.legend_inset_x + 0.5 : $$.currentWidth - legendWidth - $$.getCurrentPaddingRight() - config.legend_inset_x + 0.5
+ };
+
+ $$.margin3 = {
+ top: $$.isLegendRight ? 0 : $$.isLegendInset ? insetLegendPosition.top : $$.currentHeight - legendHeight,
+ right: NaN,
+ bottom: 0,
+ left: $$.isLegendRight ? $$.currentWidth - legendWidth : $$.isLegendInset ? insetLegendPosition.left : 0
+ };
+ };
+ c3_chart_internal_fn.transformLegend = function (withTransition) {
+ var $$ = this;
+ (withTransition ? $$.legend.transition() : $$.legend).attr("transform", $$.getTranslate('legend'));
+ };
+ c3_chart_internal_fn.updateLegendStep = function (step) {
+ this.legendStep = step;
+ };
+ c3_chart_internal_fn.updateLegendItemWidth = function (w) {
+ this.legendItemWidth = w;
+ };
+ c3_chart_internal_fn.updateLegendItemHeight = function (h) {
+ this.legendItemHeight = h;
+ };
+ c3_chart_internal_fn.getLegendWidth = function () {
+ var $$ = this;
+ return $$.config.legend_show ? $$.isLegendRight || $$.isLegendInset ? $$.legendItemWidth * ($$.legendStep + 1) : $$.currentWidth : 0;
+ };
+ c3_chart_internal_fn.getLegendHeight = function () {
+ var $$ = this, h = 0;
+ if ($$.config.legend_show) {
+ if ($$.isLegendRight) {
+ h = $$.currentHeight;
+ } else {
+ h = Math.max(20, $$.legendItemHeight) * ($$.legendStep + 1);
+ }
+ }
+ return h;
+ };
+ c3_chart_internal_fn.opacityForLegend = function (legendItem) {
+ return legendItem.classed(CLASS.legendItemHidden) ? null : 1;
+ };
+ c3_chart_internal_fn.opacityForUnfocusedLegend = function (legendItem) {
+ return legendItem.classed(CLASS.legendItemHidden) ? null : 0.3;
+ };
+ c3_chart_internal_fn.toggleFocusLegend = function (targetIds, focus) {
+ var $$ = this;
+ targetIds = $$.mapToTargetIds(targetIds);
+ $$.legend.selectAll('.' + CLASS.legendItem)
+ .filter(function (id) { return targetIds.indexOf(id) >= 0; })
+ .classed(CLASS.legendItemFocused, focus)
+ .transition().duration(100)
+ .style('opacity', function () {
+ var opacity = focus ? $$.opacityForLegend : $$.opacityForUnfocusedLegend;
+ return opacity.call($$, $$.d3.select(this));
+ });
+ };
+ c3_chart_internal_fn.revertLegend = function () {
+ var $$ = this, d3 = $$.d3;
+ $$.legend.selectAll('.' + CLASS.legendItem)
+ .classed(CLASS.legendItemFocused, false)
+ .transition().duration(100)
+ .style('opacity', function () { return $$.opacityForLegend(d3.select(this)); });
+ };
+ c3_chart_internal_fn.showLegend = function (targetIds) {
+ var $$ = this, config = $$.config;
+ if (!config.legend_show) {
+ config.legend_show = true;
+ $$.legend.style('visibility', 'visible');
+ if (!$$.legendHasRendered) {
+ $$.updateLegendWithDefaults();
+ }
+ }
+ $$.removeHiddenLegendIds(targetIds);
+ $$.legend.selectAll($$.selectorLegends(targetIds))
+ .style('visibility', 'visible')
+ .transition()
+ .style('opacity', function () { return $$.opacityForLegend($$.d3.select(this)); });
+ };
+ c3_chart_internal_fn.hideLegend = function (targetIds) {
+ var $$ = this, config = $$.config;
+ if (config.legend_show && isEmpty(targetIds)) {
+ config.legend_show = false;
+ $$.legend.style('visibility', 'hidden');
+ }
+ $$.addHiddenLegendIds(targetIds);
+ $$.legend.selectAll($$.selectorLegends(targetIds))
+ .style('opacity', 0)
+ .style('visibility', 'hidden');
+ };
+ c3_chart_internal_fn.clearLegendItemTextBoxCache = function () {
+ this.legendItemTextBox = {};
+ };
+ c3_chart_internal_fn.updateLegend = function (targetIds, options, transitions) {
+ var $$ = this, config = $$.config;
+ var xForLegend, xForLegendText, xForLegendRect, yForLegend, yForLegendText, yForLegendRect, x1ForLegendTile, x2ForLegendTile, yForLegendTile;
+ var paddingTop = 4, paddingRight = 10, maxWidth = 0, maxHeight = 0, posMin = 10, tileWidth = config.legend_item_tile_width + 5;
+ var l, totalLength = 0, offsets = {}, widths = {}, heights = {}, margins = [0], steps = {}, step = 0;
+ var withTransition, withTransitionForTransform;
+ var texts, rects, tiles, background;
+
+ // Skip elements when their name is set to null
+ targetIds = targetIds.filter(function(id) {
+ return !isDefined(config.data_names[id]) || config.data_names[id] !== null;
+ });
+
+ options = options || {};
+ withTransition = getOption(options, "withTransition", true);
+ withTransitionForTransform = getOption(options, "withTransitionForTransform", true);
+
+ function getTextBox(textElement, id) {
+ if (!$$.legendItemTextBox[id]) {
+ $$.legendItemTextBox[id] = $$.getTextRect(textElement.textContent, CLASS.legendItem, textElement);
+ }
+ return $$.legendItemTextBox[id];
+ }
+
+ function updatePositions(textElement, id, index) {
+ var reset = index === 0, isLast = index === targetIds.length - 1,
+ box = getTextBox(textElement, id),
+ itemWidth = box.width + tileWidth + (isLast && !($$.isLegendRight || $$.isLegendInset) ? 0 : paddingRight) + config.legend_padding,
+ itemHeight = box.height + paddingTop,
+ itemLength = $$.isLegendRight || $$.isLegendInset ? itemHeight : itemWidth,
+ areaLength = $$.isLegendRight || $$.isLegendInset ? $$.getLegendHeight() : $$.getLegendWidth(),
+ margin, maxLength;
+
+ // MEMO: care about condifion of step, totalLength
+ function updateValues(id, withoutStep) {
+ if (!withoutStep) {
+ margin = (areaLength - totalLength - itemLength) / 2;
+ if (margin < posMin) {
+ margin = (areaLength - itemLength) / 2;
+ totalLength = 0;
+ step++;
+ }
+ }
+ steps[id] = step;
+ margins[step] = $$.isLegendInset ? 10 : margin;
+ offsets[id] = totalLength;
+ totalLength += itemLength;
+ }
+
+ if (reset) {
+ totalLength = 0;
+ step = 0;
+ maxWidth = 0;
+ maxHeight = 0;
+ }
+
+ if (config.legend_show && !$$.isLegendToShow(id)) {
+ widths[id] = heights[id] = steps[id] = offsets[id] = 0;
+ return;
+ }
+
+ widths[id] = itemWidth;
+ heights[id] = itemHeight;
+
+ if (!maxWidth || itemWidth >= maxWidth) { maxWidth = itemWidth; }
+ if (!maxHeight || itemHeight >= maxHeight) { maxHeight = itemHeight; }
+ maxLength = $$.isLegendRight || $$.isLegendInset ? maxHeight : maxWidth;
+
+ if (config.legend_equally) {
+ Object.keys(widths).forEach(function (id) { widths[id] = maxWidth; });
+ Object.keys(heights).forEach(function (id) { heights[id] = maxHeight; });
+ margin = (areaLength - maxLength * targetIds.length) / 2;
+ if (margin < posMin) {
+ totalLength = 0;
+ step = 0;
+ targetIds.forEach(function (id) { updateValues(id); });
+ }
+ else {
+ updateValues(id, true);
+ }
+ } else {
+ updateValues(id);
+ }
+ }
+
+ if ($$.isLegendInset) {
+ step = config.legend_inset_step ? config.legend_inset_step : targetIds.length;
+ $$.updateLegendStep(step);
+ }
+
+ if ($$.isLegendRight) {
+ xForLegend = function (id) { return maxWidth * steps[id]; };
+ yForLegend = function (id) { return margins[steps[id]] + offsets[id]; };
+ } else if ($$.isLegendInset) {
+ xForLegend = function (id) { return maxWidth * steps[id] + 10; };
+ yForLegend = function (id) { return margins[steps[id]] + offsets[id]; };
+ } else {
+ xForLegend = function (id) { return margins[steps[id]] + offsets[id]; };
+ yForLegend = function (id) { return maxHeight * steps[id]; };
+ }
+ xForLegendText = function (id, i) { return xForLegend(id, i) + 4 + config.legend_item_tile_width; };
+ yForLegendText = function (id, i) { return yForLegend(id, i) + 9; };
+ xForLegendRect = function (id, i) { return xForLegend(id, i); };
+ yForLegendRect = function (id, i) { return yForLegend(id, i) - 5; };
+ x1ForLegendTile = function (id, i) { return xForLegend(id, i) - 2; };
+ x2ForLegendTile = function (id, i) { return xForLegend(id, i) - 2 + config.legend_item_tile_width; };
+ yForLegendTile = function (id, i) { return yForLegend(id, i) + 4; };
+
+ // Define g for legend area
+ l = $$.legend.selectAll('.' + CLASS.legendItem)
+ .data(targetIds)
+ .enter().append('g')
+ .attr('class', function (id) { return $$.generateClass(CLASS.legendItem, id); })
+ .style('visibility', function (id) { return $$.isLegendToShow(id) ? 'visible' : 'hidden'; })
+ .style('cursor', 'pointer')
+ .on('click', function (id) {
+ if (config.legend_item_onclick) {
+ config.legend_item_onclick.call($$, id);
+ } else {
+ if ($$.d3.event.altKey) {
+ $$.api.hide();
+ $$.api.show(id);
+ } else {
+ $$.api.toggle(id);
+ $$.isTargetToShow(id) ? $$.api.focus(id) : $$.api.revert();
+ }
+ }
+ })
+ .on('mouseover', function (id) {
+ if (config.legend_item_onmouseover) {
+ config.legend_item_onmouseover.call($$, id);
+ }
+ else {
+ $$.d3.select(this).classed(CLASS.legendItemFocused, true);
+ if (!$$.transiting && $$.isTargetToShow(id)) {
+ $$.api.focus(id);
+ }
+ }
+ })
+ .on('mouseout', function (id) {
+ if (config.legend_item_onmouseout) {
+ config.legend_item_onmouseout.call($$, id);
+ }
+ else {
+ $$.d3.select(this).classed(CLASS.legendItemFocused, false);
+ $$.api.revert();
+ }
+ });
+ l.append('text')
+ .text(function (id) { return isDefined(config.data_names[id]) ? config.data_names[id] : id; })
+ .each(function (id, i) { updatePositions(this, id, i); })
+ .style("pointer-events", "none")
+ .attr('x', $$.isLegendRight || $$.isLegendInset ? xForLegendText : -200)
+ .attr('y', $$.isLegendRight || $$.isLegendInset ? -200 : yForLegendText);
+ l.append('rect')
+ .attr("class", CLASS.legendItemEvent)
+ .style('fill-opacity', 0)
+ .attr('x', $$.isLegendRight || $$.isLegendInset ? xForLegendRect : -200)
+ .attr('y', $$.isLegendRight || $$.isLegendInset ? -200 : yForLegendRect);
+ l.append('line')
+ .attr('class', CLASS.legendItemTile)
+ .style('stroke', $$.color)
+ .style("pointer-events", "none")
+ .attr('x1', $$.isLegendRight || $$.isLegendInset ? x1ForLegendTile : -200)
+ .attr('y1', $$.isLegendRight || $$.isLegendInset ? -200 : yForLegendTile)
+ .attr('x2', $$.isLegendRight || $$.isLegendInset ? x2ForLegendTile : -200)
+ .attr('y2', $$.isLegendRight || $$.isLegendInset ? -200 : yForLegendTile)
+ .attr('stroke-width', config.legend_item_tile_height);
+
+ // Set background for inset legend
+ background = $$.legend.select('.' + CLASS.legendBackground + ' rect');
+ if ($$.isLegendInset && maxWidth > 0 && background.size() === 0) {
+ background = $$.legend.insert('g', '.' + CLASS.legendItem)
+ .attr("class", CLASS.legendBackground)
+ .append('rect');
+ }
+
+ texts = $$.legend.selectAll('text')
+ .data(targetIds)
+ .text(function (id) { return isDefined(config.data_names[id]) ? config.data_names[id] : id; }) // MEMO: needed for update
+ .each(function (id, i) { updatePositions(this, id, i); });
+ (withTransition ? texts.transition() : texts)
+ .attr('x', xForLegendText)
+ .attr('y', yForLegendText);
+
+ rects = $$.legend.selectAll('rect.' + CLASS.legendItemEvent)
+ .data(targetIds);
+ (withTransition ? rects.transition() : rects)
+ .attr('width', function (id) { return widths[id]; })
+ .attr('height', function (id) { return heights[id]; })
+ .attr('x', xForLegendRect)
+ .attr('y', yForLegendRect);
+
+ tiles = $$.legend.selectAll('line.' + CLASS.legendItemTile)
+ .data(targetIds);
+ (withTransition ? tiles.transition() : tiles)
+ .style('stroke', $$.color)
+ .attr('x1', x1ForLegendTile)
+ .attr('y1', yForLegendTile)
+ .attr('x2', x2ForLegendTile)
+ .attr('y2', yForLegendTile);
+
+ if (background) {
+ (withTransition ? background.transition() : background)
+ .attr('height', $$.getLegendHeight() - 12)
+ .attr('width', maxWidth * (step + 1) + 10);
+ }
+
+ // toggle legend state
+ $$.legend.selectAll('.' + CLASS.legendItem)
+ .classed(CLASS.legendItemHidden, function (id) { return !$$.isTargetToShow(id); });
+
+ // Update all to reflect change of legend
+ $$.updateLegendItemWidth(maxWidth);
+ $$.updateLegendItemHeight(maxHeight);
+ $$.updateLegendStep(step);
+ // Update size and scale
+ $$.updateSizes();
+ $$.updateScales();
+ $$.updateSvgSize();
+ // Update g positions
+ $$.transformAll(withTransitionForTransform, transitions);
+ $$.legendHasRendered = true;
+ };
+
+ c3_chart_internal_fn.initTitle = function () {
+ var $$ = this;
+ $$.title = $$.svg.append("text")
+ .text($$.config.title_text)
+ .attr("class", $$.CLASS.title);
+ };
+ c3_chart_internal_fn.redrawTitle = function () {
+ var $$ = this;
+ $$.title
+ .attr("x", $$.xForTitle.bind($$))
+ .attr("y", $$.yForTitle.bind($$));
+ };
+ c3_chart_internal_fn.xForTitle = function () {
+ var $$ = this, config = $$.config, position = config.title_position || 'left', x;
+ if (position.indexOf('right') >= 0) {
+ x = $$.currentWidth - $$.getTextRect($$.title.node().textContent, $$.CLASS.title, $$.title.node()).width - config.title_padding.right;
+ } else if (position.indexOf('center') >= 0) {
+ x = ($$.currentWidth - $$.getTextRect($$.title.node().textContent, $$.CLASS.title, $$.title.node()).width) / 2;
+ } else { // left
+ x = config.title_padding.left;
+ }
+ return x;
+ };
+ c3_chart_internal_fn.yForTitle = function () {
+ var $$ = this;
+ return $$.config.title_padding.top + $$.getTextRect($$.title.node().textContent, $$.CLASS.title, $$.title.node()).height;
+ };
+ c3_chart_internal_fn.getTitlePadding = function() {
+ var $$ = this;
+ return $$.yForTitle() + $$.config.title_padding.bottom;
+ };
+
+ function Axis(owner) {
+ API.call(this, owner);
+ }
+
+ inherit(API, Axis);
+
+ Axis.prototype.init = function init() {
+
+ var $$ = this.owner, config = $$.config, main = $$.main;
+ $$.axes.x = main.append("g")
+ .attr("class", CLASS.axis + ' ' + CLASS.axisX)
+ .attr("clip-path", $$.clipPathForXAxis)
+ .attr("transform", $$.getTranslate('x'))
+ .style("visibility", config.axis_x_show ? 'visible' : 'hidden');
+ $$.axes.x.append("text")
+ .attr("class", CLASS.axisXLabel)
+ .attr("transform", config.axis_rotated ? "rotate(-90)" : "")
+ .style("text-anchor", this.textAnchorForXAxisLabel.bind(this));
+ $$.axes.y = main.append("g")
+ .attr("class", CLASS.axis + ' ' + CLASS.axisY)
+ .attr("clip-path", config.axis_y_inner ? "" : $$.clipPathForYAxis)
+ .attr("transform", $$.getTranslate('y'))
+ .style("visibility", config.axis_y_show ? 'visible' : 'hidden');
+ $$.axes.y.append("text")
+ .attr("class", CLASS.axisYLabel)
+ .attr("transform", config.axis_rotated ? "" : "rotate(-90)")
+ .style("text-anchor", this.textAnchorForYAxisLabel.bind(this));
+
+ $$.axes.y2 = main.append("g")
+ .attr("class", CLASS.axis + ' ' + CLASS.axisY2)
+ // clip-path?
+ .attr("transform", $$.getTranslate('y2'))
+ .style("visibility", config.axis_y2_show ? 'visible' : 'hidden');
+ $$.axes.y2.append("text")
+ .attr("class", CLASS.axisY2Label)
+ .attr("transform", config.axis_rotated ? "" : "rotate(-90)")
+ .style("text-anchor", this.textAnchorForY2AxisLabel.bind(this));
+ };
+ Axis.prototype.getXAxis = function getXAxis(scale, orient, tickFormat, tickValues, withOuterTick, withoutTransition, withoutRotateTickText) {
+ var $$ = this.owner, config = $$.config,
+ axisParams = {
+ isCategory: $$.isCategorized(),
+ withOuterTick: withOuterTick,
+ tickMultiline: config.axis_x_tick_multiline,
+ tickWidth: config.axis_x_tick_width,
+ tickTextRotate: withoutRotateTickText ? 0 : config.axis_x_tick_rotate,
+ withoutTransition: withoutTransition,
+ },
+ axis = c3_axis($$.d3, axisParams).scale(scale).orient(orient);
+
+ if ($$.isTimeSeries() && tickValues && typeof tickValues !== "function") {
+ tickValues = tickValues.map(function (v) { return $$.parseDate(v); });
+ }
+
+ // Set tick
+ axis.tickFormat(tickFormat).tickValues(tickValues);
+ if ($$.isCategorized()) {
+ axis.tickCentered(config.axis_x_tick_centered);
+ if (isEmpty(config.axis_x_tick_culling)) {
+ config.axis_x_tick_culling = false;
+ }
+ }
+
+ return axis;
+ };
+ Axis.prototype.updateXAxisTickValues = function updateXAxisTickValues(targets, axis) {
+ var $$ = this.owner, config = $$.config, tickValues;
+ if (config.axis_x_tick_fit || config.axis_x_tick_count) {
+ tickValues = this.generateTickValues($$.mapTargetsToUniqueXs(targets), config.axis_x_tick_count, $$.isTimeSeries());
+ }
+ if (axis) {
+ axis.tickValues(tickValues);
+ } else {
+ $$.xAxis.tickValues(tickValues);
+ $$.subXAxis.tickValues(tickValues);
+ }
+ return tickValues;
+ };
+ Axis.prototype.getYAxis = function getYAxis(scale, orient, tickFormat, tickValues, withOuterTick, withoutTransition) {
+ var axisParams = {
+ withOuterTick: withOuterTick,
+ withoutTransition: withoutTransition,
+ },
+ $$ = this.owner,
+ d3 = $$.d3,
+ config = $$.config,
+ axis = c3_axis(d3, axisParams).scale(scale).orient(orient).tickFormat(tickFormat);
+ if ($$.isTimeSeriesY()) {
+ axis.ticks(d3.time[config.axis_y_tick_time_value], config.axis_y_tick_time_interval);
+ } else {
+ axis.tickValues(tickValues);
+ }
+ return axis;
+ };
+ Axis.prototype.getId = function getId(id) {
+ var config = this.owner.config;
+ return id in config.data_axes ? config.data_axes[id] : 'y';
+ };
+ Axis.prototype.getXAxisTickFormat = function getXAxisTickFormat() {
+ var $$ = this.owner, config = $$.config,
+ format = $$.isTimeSeries() ? $$.defaultAxisTimeFormat : $$.isCategorized() ? $$.categoryName : function (v) { return v < 0 ? v.toFixed(0) : v; };
+ if (config.axis_x_tick_format) {
+ if (isFunction(config.axis_x_tick_format)) {
+ format = config.axis_x_tick_format;
+ } else if ($$.isTimeSeries()) {
+ format = function (date) {
+ return date ? $$.axisTimeFormat(config.axis_x_tick_format)(date) : "";
+ };
+ }
+ }
+ return isFunction(format) ? function (v) { return format.call($$, v); } : format;
+ };
+ Axis.prototype.getTickValues = function getTickValues(tickValues, axis) {
+ return tickValues ? tickValues : axis ? axis.tickValues() : undefined;
+ };
+ Axis.prototype.getXAxisTickValues = function getXAxisTickValues() {
+ return this.getTickValues(this.owner.config.axis_x_tick_values, this.owner.xAxis);
+ };
+ Axis.prototype.getYAxisTickValues = function getYAxisTickValues() {
+ return this.getTickValues(this.owner.config.axis_y_tick_values, this.owner.yAxis);
+ };
+ Axis.prototype.getY2AxisTickValues = function getY2AxisTickValues() {
+ return this.getTickValues(this.owner.config.axis_y2_tick_values, this.owner.y2Axis);
+ };
+ Axis.prototype.getLabelOptionByAxisId = function getLabelOptionByAxisId(axisId) {
+ var $$ = this.owner, config = $$.config, option;
+ if (axisId === 'y') {
+ option = config.axis_y_label;
+ } else if (axisId === 'y2') {
+ option = config.axis_y2_label;
+ } else if (axisId === 'x') {
+ option = config.axis_x_label;
+ }
+ return option;
+ };
+ Axis.prototype.getLabelText = function getLabelText(axisId) {
+ var option = this.getLabelOptionByAxisId(axisId);
+ return isString(option) ? option : option ? option.text : null;
+ };
+ Axis.prototype.setLabelText = function setLabelText(axisId, text) {
+ var $$ = this.owner, config = $$.config,
+ option = this.getLabelOptionByAxisId(axisId);
+ if (isString(option)) {
+ if (axisId === 'y') {
+ config.axis_y_label = text;
+ } else if (axisId === 'y2') {
+ config.axis_y2_label = text;
+ } else if (axisId === 'x') {
+ config.axis_x_label = text;
+ }
+ } else if (option) {
+ option.text = text;
+ }
+ };
+ Axis.prototype.getLabelPosition = function getLabelPosition(axisId, defaultPosition) {
+ var option = this.getLabelOptionByAxisId(axisId),
+ position = (option && typeof option === 'object' && option.position) ? option.position : defaultPosition;
+ return {
+ isInner: position.indexOf('inner') >= 0,
+ isOuter: position.indexOf('outer') >= 0,
+ isLeft: position.indexOf('left') >= 0,
+ isCenter: position.indexOf('center') >= 0,
+ isRight: position.indexOf('right') >= 0,
+ isTop: position.indexOf('top') >= 0,
+ isMiddle: position.indexOf('middle') >= 0,
+ isBottom: position.indexOf('bottom') >= 0
+ };
+ };
+ Axis.prototype.getXAxisLabelPosition = function getXAxisLabelPosition() {
+ return this.getLabelPosition('x', this.owner.config.axis_rotated ? 'inner-top' : 'inner-right');
+ };
+ Axis.prototype.getYAxisLabelPosition = function getYAxisLabelPosition() {
+ return this.getLabelPosition('y', this.owner.config.axis_rotated ? 'inner-right' : 'inner-top');
+ };
+ Axis.prototype.getY2AxisLabelPosition = function getY2AxisLabelPosition() {
+ return this.getLabelPosition('y2', this.owner.config.axis_rotated ? 'inner-right' : 'inner-top');
+ };
+ Axis.prototype.getLabelPositionById = function getLabelPositionById(id) {
+ return id === 'y2' ? this.getY2AxisLabelPosition() : id === 'y' ? this.getYAxisLabelPosition() : this.getXAxisLabelPosition();
+ };
+ Axis.prototype.textForXAxisLabel = function textForXAxisLabel() {
+ return this.getLabelText('x');
+ };
+ Axis.prototype.textForYAxisLabel = function textForYAxisLabel() {
+ return this.getLabelText('y');
+ };
+ Axis.prototype.textForY2AxisLabel = function textForY2AxisLabel() {
+ return this.getLabelText('y2');
+ };
+ Axis.prototype.xForAxisLabel = function xForAxisLabel(forHorizontal, position) {
+ var $$ = this.owner;
+ if (forHorizontal) {
+ return position.isLeft ? 0 : position.isCenter ? $$.width / 2 : $$.width;
+ } else {
+ return position.isBottom ? -$$.height : position.isMiddle ? -$$.height / 2 : 0;
+ }
+ };
+ Axis.prototype.dxForAxisLabel = function dxForAxisLabel(forHorizontal, position) {
+ if (forHorizontal) {
+ return position.isLeft ? "0.5em" : position.isRight ? "-0.5em" : "0";
+ } else {
+ return position.isTop ? "-0.5em" : position.isBottom ? "0.5em" : "0";
+ }
+ };
+ Axis.prototype.textAnchorForAxisLabel = function textAnchorForAxisLabel(forHorizontal, position) {
+ if (forHorizontal) {
+ return position.isLeft ? 'start' : position.isCenter ? 'middle' : 'end';
+ } else {
+ return position.isBottom ? 'start' : position.isMiddle ? 'middle' : 'end';
+ }
+ };
+ Axis.prototype.xForXAxisLabel = function xForXAxisLabel() {
+ return this.xForAxisLabel(!this.owner.config.axis_rotated, this.getXAxisLabelPosition());
+ };
+ Axis.prototype.xForYAxisLabel = function xForYAxisLabel() {
+ return this.xForAxisLabel(this.owner.config.axis_rotated, this.getYAxisLabelPosition());
+ };
+ Axis.prototype.xForY2AxisLabel = function xForY2AxisLabel() {
+ return this.xForAxisLabel(this.owner.config.axis_rotated, this.getY2AxisLabelPosition());
+ };
+ Axis.prototype.dxForXAxisLabel = function dxForXAxisLabel() {
+ return this.dxForAxisLabel(!this.owner.config.axis_rotated, this.getXAxisLabelPosition());
+ };
+ Axis.prototype.dxForYAxisLabel = function dxForYAxisLabel() {
+ return this.dxForAxisLabel(this.owner.config.axis_rotated, this.getYAxisLabelPosition());
+ };
+ Axis.prototype.dxForY2AxisLabel = function dxForY2AxisLabel() {
+ return this.dxForAxisLabel(this.owner.config.axis_rotated, this.getY2AxisLabelPosition());
+ };
+ Axis.prototype.dyForXAxisLabel = function dyForXAxisLabel() {
+ var $$ = this.owner, config = $$.config,
+ position = this.getXAxisLabelPosition();
+ if (config.axis_rotated) {
+ return position.isInner ? "1.2em" : -25 - this.getMaxTickWidth('x');
+ } else {
+ return position.isInner ? "-0.5em" : config.axis_x_height ? config.axis_x_height - 10 : "3em";
+ }
+ };
+ Axis.prototype.dyForYAxisLabel = function dyForYAxisLabel() {
+ var $$ = this.owner,
+ position = this.getYAxisLabelPosition();
+ if ($$.config.axis_rotated) {
+ return position.isInner ? "-0.5em" : "3em";
+ } else {
+ return position.isInner ? "1.2em" : -10 - ($$.config.axis_y_inner ? 0 : (this.getMaxTickWidth('y') + 10));
+ }
+ };
+ Axis.prototype.dyForY2AxisLabel = function dyForY2AxisLabel() {
+ var $$ = this.owner,
+ position = this.getY2AxisLabelPosition();
+ if ($$.config.axis_rotated) {
+ return position.isInner ? "1.2em" : "-2.2em";
+ } else {
+ return position.isInner ? "-0.5em" : 15 + ($$.config.axis_y2_inner ? 0 : (this.getMaxTickWidth('y2') + 15));
+ }
+ };
+ Axis.prototype.textAnchorForXAxisLabel = function textAnchorForXAxisLabel() {
+ var $$ = this.owner;
+ return this.textAnchorForAxisLabel(!$$.config.axis_rotated, this.getXAxisLabelPosition());
+ };
+ Axis.prototype.textAnchorForYAxisLabel = function textAnchorForYAxisLabel() {
+ var $$ = this.owner;
+ return this.textAnchorForAxisLabel($$.config.axis_rotated, this.getYAxisLabelPosition());
+ };
+ Axis.prototype.textAnchorForY2AxisLabel = function textAnchorForY2AxisLabel() {
+ var $$ = this.owner;
+ return this.textAnchorForAxisLabel($$.config.axis_rotated, this.getY2AxisLabelPosition());
+ };
+ Axis.prototype.getMaxTickWidth = function getMaxTickWidth(id, withoutRecompute) {
+ var $$ = this.owner, config = $$.config,
+ maxWidth = 0, targetsToShow, scale, axis, dummy, svg;
+ if (withoutRecompute && $$.currentMaxTickWidths[id]) {
+ return $$.currentMaxTickWidths[id];
+ }
+ if ($$.svg) {
+ targetsToShow = $$.filterTargetsToShow($$.data.targets);
+ if (id === 'y') {
+ scale = $$.y.copy().domain($$.getYDomain(targetsToShow, 'y'));
+ axis = this.getYAxis(scale, $$.yOrient, config.axis_y_tick_format, $$.yAxisTickValues, false, true);
+ } else if (id === 'y2') {
+ scale = $$.y2.copy().domain($$.getYDomain(targetsToShow, 'y2'));
+ axis = this.getYAxis(scale, $$.y2Orient, config.axis_y2_tick_format, $$.y2AxisTickValues, false, true);
+ } else {
+ scale = $$.x.copy().domain($$.getXDomain(targetsToShow));
+ axis = this.getXAxis(scale, $$.xOrient, $$.xAxisTickFormat, $$.xAxisTickValues, false, true, true);
+ this.updateXAxisTickValues(targetsToShow, axis);
+ }
+ dummy = $$.d3.select('body').append('div').classed('c3', true);
+ svg = dummy.append("svg").style('visibility', 'hidden').style('position', 'fixed').style('top', 0).style('left', 0),
+ svg.append('g').call(axis).each(function () {
+ $$.d3.select(this).selectAll('text').each(function () {
+ var box = this.getBoundingClientRect();
+ if (maxWidth < box.width) { maxWidth = box.width; }
+ });
+ dummy.remove();
+ });
+ }
+ $$.currentMaxTickWidths[id] = maxWidth <= 0 ? $$.currentMaxTickWidths[id] : maxWidth;
+ return $$.currentMaxTickWidths[id];
+ };
+
+ Axis.prototype.updateLabels = function updateLabels(withTransition) {
+ var $$ = this.owner;
+ var axisXLabel = $$.main.select('.' + CLASS.axisX + ' .' + CLASS.axisXLabel),
+ axisYLabel = $$.main.select('.' + CLASS.axisY + ' .' + CLASS.axisYLabel),
+ axisY2Label = $$.main.select('.' + CLASS.axisY2 + ' .' + CLASS.axisY2Label);
+ (withTransition ? axisXLabel.transition() : axisXLabel)
+ .attr("x", this.xForXAxisLabel.bind(this))
+ .attr("dx", this.dxForXAxisLabel.bind(this))
+ .attr("dy", this.dyForXAxisLabel.bind(this))
+ .text(this.textForXAxisLabel.bind(this));
+ (withTransition ? axisYLabel.transition() : axisYLabel)
+ .attr("x", this.xForYAxisLabel.bind(this))
+ .attr("dx", this.dxForYAxisLabel.bind(this))
+ .attr("dy", this.dyForYAxisLabel.bind(this))
+ .text(this.textForYAxisLabel.bind(this));
+ (withTransition ? axisY2Label.transition() : axisY2Label)
+ .attr("x", this.xForY2AxisLabel.bind(this))
+ .attr("dx", this.dxForY2AxisLabel.bind(this))
+ .attr("dy", this.dyForY2AxisLabel.bind(this))
+ .text(this.textForY2AxisLabel.bind(this));
+ };
+ Axis.prototype.getPadding = function getPadding(padding, key, defaultValue, domainLength) {
+ var p = typeof padding === 'number' ? padding : padding[key];
+ if (!isValue(p)) {
+ return defaultValue;
+ }
+ if (padding.unit === 'ratio') {
+ return padding[key] * domainLength;
+ }
+ // assume padding is pixels if unit is not specified
+ return this.convertPixelsToAxisPadding(p, domainLength);
+ };
+ Axis.prototype.convertPixelsToAxisPadding = function convertPixelsToAxisPadding(pixels, domainLength) {
+ var $$ = this.owner,
+ length = $$.config.axis_rotated ? $$.width : $$.height;
+ return domainLength * (pixels / length);
+ };
+ Axis.prototype.generateTickValues = function generateTickValues(values, tickCount, forTimeSeries) {
+ var tickValues = values, targetCount, start, end, count, interval, i, tickValue;
+ if (tickCount) {
+ targetCount = isFunction(tickCount) ? tickCount() : tickCount;
+ // compute ticks according to tickCount
+ if (targetCount === 1) {
+ tickValues = [values[0]];
+ } else if (targetCount === 2) {
+ tickValues = [values[0], values[values.length - 1]];
+ } else if (targetCount > 2) {
+ count = targetCount - 2;
+ start = values[0];
+ end = values[values.length - 1];
+ interval = (end - start) / (count + 1);
+ // re-construct unique values
+ tickValues = [start];
+ for (i = 0; i < count; i++) {
+ tickValue = +start + interval * (i + 1);
+ tickValues.push(forTimeSeries ? new Date(tickValue) : tickValue);
+ }
+ tickValues.push(end);
+ }
+ }
+ if (!forTimeSeries) { tickValues = tickValues.sort(function (a, b) { return a - b; }); }
+ return tickValues;
+ };
+ Axis.prototype.generateTransitions = function generateTransitions(duration) {
+ var $$ = this.owner, axes = $$.axes;
+ return {
+ axisX: duration ? axes.x.transition().duration(duration) : axes.x,
+ axisY: duration ? axes.y.transition().duration(duration) : axes.y,
+ axisY2: duration ? axes.y2.transition().duration(duration) : axes.y2,
+ axisSubX: duration ? axes.subx.transition().duration(duration) : axes.subx
+ };
+ };
+ Axis.prototype.redraw = function redraw(transitions, isHidden) {
+ var $$ = this.owner;
+ $$.axes.x.style("opacity", isHidden ? 0 : 1);
+ $$.axes.y.style("opacity", isHidden ? 0 : 1);
+ $$.axes.y2.style("opacity", isHidden ? 0 : 1);
+ $$.axes.subx.style("opacity", isHidden ? 0 : 1);
+ transitions.axisX.call($$.xAxis);
+ transitions.axisY.call($$.yAxis);
+ transitions.axisY2.call($$.y2Axis);
+ transitions.axisSubX.call($$.subXAxis);
+ };
+
+ c3_chart_internal_fn.getClipPath = function (id) {
+ var isIE9 = window.navigator.appVersion.toLowerCase().indexOf("msie 9.") >= 0;
+ return "url(" + (isIE9 ? "" : document.URL.split('#')[0]) + "#" + id + ")";
+ };
+ c3_chart_internal_fn.appendClip = function (parent, id) {
+ return parent.append("clipPath").attr("id", id).append("rect");
+ };
+ c3_chart_internal_fn.getAxisClipX = function (forHorizontal) {
+ // axis line width + padding for left
+ var left = Math.max(30, this.margin.left);
+ return forHorizontal ? -(1 + left) : -(left - 1);
+ };
+ c3_chart_internal_fn.getAxisClipY = function (forHorizontal) {
+ return forHorizontal ? -20 : -this.margin.top;
+ };
+ c3_chart_internal_fn.getXAxisClipX = function () {
+ var $$ = this;
+ return $$.getAxisClipX(!$$.config.axis_rotated);
+ };
+ c3_chart_internal_fn.getXAxisClipY = function () {
+ var $$ = this;
+ return $$.getAxisClipY(!$$.config.axis_rotated);
+ };
+ c3_chart_internal_fn.getYAxisClipX = function () {
+ var $$ = this;
+ return $$.config.axis_y_inner ? -1 : $$.getAxisClipX($$.config.axis_rotated);
+ };
+ c3_chart_internal_fn.getYAxisClipY = function () {
+ var $$ = this;
+ return $$.getAxisClipY($$.config.axis_rotated);
+ };
+ c3_chart_internal_fn.getAxisClipWidth = function (forHorizontal) {
+ var $$ = this,
+ left = Math.max(30, $$.margin.left),
+ right = Math.max(30, $$.margin.right);
+ // width + axis line width + padding for left/right
+ return forHorizontal ? $$.width + 2 + left + right : $$.margin.left + 20;
+ };
+ c3_chart_internal_fn.getAxisClipHeight = function (forHorizontal) {
+ // less than 20 is not enough to show the axis label 'outer' without legend
+ return (forHorizontal ? this.margin.bottom : (this.margin.top + this.height)) + 20;
+ };
+ c3_chart_internal_fn.getXAxisClipWidth = function () {
+ var $$ = this;
+ return $$.getAxisClipWidth(!$$.config.axis_rotated);
+ };
+ c3_chart_internal_fn.getXAxisClipHeight = function () {
+ var $$ = this;
+ return $$.getAxisClipHeight(!$$.config.axis_rotated);
+ };
+ c3_chart_internal_fn.getYAxisClipWidth = function () {
+ var $$ = this;
+ return $$.getAxisClipWidth($$.config.axis_rotated) + ($$.config.axis_y_inner ? 20 : 0);
+ };
+ c3_chart_internal_fn.getYAxisClipHeight = function () {
+ var $$ = this;
+ return $$.getAxisClipHeight($$.config.axis_rotated);
+ };
+
+ c3_chart_internal_fn.initPie = function () {
+ var $$ = this, d3 = $$.d3, config = $$.config;
+ $$.pie = d3.layout.pie().value(function (d) {
+ return d.values.reduce(function (a, b) { return a + b.value; }, 0);
+ });
+ if (!config.data_order) {
+ $$.pie.sort(null);
+ }
+ };
+
+ c3_chart_internal_fn.updateRadius = function () {
+ var $$ = this, config = $$.config,
+ w = config.gauge_width || config.donut_width;
+ $$.radiusExpanded = Math.min($$.arcWidth, $$.arcHeight) / 2;
+ $$.radius = $$.radiusExpanded * 0.95;
+ $$.innerRadiusRatio = w ? ($$.radius - w) / $$.radius : 0.6;
+ $$.innerRadius = $$.hasType('donut') || $$.hasType('gauge') ? $$.radius * $$.innerRadiusRatio : 0;
+ };
+
+ c3_chart_internal_fn.updateArc = function () {
+ var $$ = this;
+ $$.svgArc = $$.getSvgArc();
+ $$.svgArcExpanded = $$.getSvgArcExpanded();
+ $$.svgArcExpandedSub = $$.getSvgArcExpanded(0.98);
+ };
+
+ c3_chart_internal_fn.updateAngle = function (d) {
+ var $$ = this, config = $$.config,
+ found = false, index = 0,
+ gMin, gMax, gTic, gValue;
+
+ if (!config) {
+ return null;
+ }
+
+ $$.pie($$.filterTargetsToShow($$.data.targets)).forEach(function (t) {
+ if (! found && t.data.id === d.data.id) {
+ found = true;
+ d = t;
+ d.index = index;
+ }
+ index++;
+ });
+ if (isNaN(d.startAngle)) {
+ d.startAngle = 0;
+ }
+ if (isNaN(d.endAngle)) {
+ d.endAngle = d.startAngle;
+ }
+ if ($$.isGaugeType(d.data)) {
+ gMin = config.gauge_min;
+ gMax = config.gauge_max;
+ gTic = (Math.PI) / (gMax - gMin);
+ gValue = d.value < gMin ? 0 : d.value < gMax ? d.value - gMin : (gMax - gMin);
+ d.startAngle = -1 * (Math.PI / 2);
+ d.endAngle = d.startAngle + gTic * gValue;
+ }
+ return found ? d : null;
+ };
+
+ c3_chart_internal_fn.getSvgArc = function () {
+ var $$ = this,
+ arc = $$.d3.svg.arc().outerRadius($$.radius).innerRadius($$.innerRadius),
+ newArc = function (d, withoutUpdate) {
+ var updated;
+ if (withoutUpdate) { return arc(d); } // for interpolate
+ updated = $$.updateAngle(d);
+ return updated ? arc(updated) : "M 0 0";
+ };
+ // TODO: extends all function
+ newArc.centroid = arc.centroid;
+ return newArc;
+ };
+
+ c3_chart_internal_fn.getSvgArcExpanded = function (rate) {
+ var $$ = this,
+ arc = $$.d3.svg.arc().outerRadius($$.radiusExpanded * (rate ? rate : 1)).innerRadius($$.innerRadius);
+ return function (d) {
+ var updated = $$.updateAngle(d);
+ return updated ? arc(updated) : "M 0 0";
+ };
+ };
+
+ c3_chart_internal_fn.getArc = function (d, withoutUpdate, force) {
+ return force || this.isArcType(d.data) ? this.svgArc(d, withoutUpdate) : "M 0 0";
+ };
+
+
+ c3_chart_internal_fn.transformForArcLabel = function (d) {
+ var $$ = this,
+ updated = $$.updateAngle(d), c, x, y, h, ratio, translate = "";
+ if (updated && !$$.hasType('gauge')) {
+ c = this.svgArc.centroid(updated);
+ x = isNaN(c[0]) ? 0 : c[0];
+ y = isNaN(c[1]) ? 0 : c[1];
+ h = Math.sqrt(x * x + y * y);
+ // TODO: ratio should be an option?
+ ratio = $$.radius && h ? (36 / $$.radius > 0.375 ? 1.175 - 36 / $$.radius : 0.8) * $$.radius / h : 0;
+ translate = "translate(" + (x * ratio) + ',' + (y * ratio) + ")";
+ }
+ return translate;
+ };
+
+ c3_chart_internal_fn.getArcRatio = function (d) {
+ var $$ = this,
+ whole = $$.hasType('gauge') ? Math.PI : (Math.PI * 2);
+ return d ? (d.endAngle - d.startAngle) / whole : null;
+ };
+
+ c3_chart_internal_fn.convertToArcData = function (d) {
+ return this.addName({
+ id: d.data.id,
+ value: d.value,
+ ratio: this.getArcRatio(d),
+ index: d.index
+ });
+ };
+
+ c3_chart_internal_fn.textForArcLabel = function (d) {
+ var $$ = this,
+ updated, value, ratio, id, format;
+ if (! $$.shouldShowArcLabel()) { return ""; }
+ updated = $$.updateAngle(d);
+ value = updated ? updated.value : null;
+ ratio = $$.getArcRatio(updated);
+ id = d.data.id;
+ if (! $$.hasType('gauge') && ! $$.meetsArcLabelThreshold(ratio)) { return ""; }
+ format = $$.getArcLabelFormat();
+ return format ? format(value, ratio, id) : $$.defaultArcValueFormat(value, ratio);
+ };
+
+ c3_chart_internal_fn.expandArc = function (targetIds) {
+ var $$ = this, interval;
+
+ // MEMO: avoid to cancel transition
+ if ($$.transiting) {
+ interval = window.setInterval(function () {
+ if (!$$.transiting) {
+ window.clearInterval(interval);
+ if ($$.legend.selectAll('.c3-legend-item-focused').size() > 0) {
+ $$.expandArc(targetIds);
+ }
+ }
+ }, 10);
+ return;
+ }
+
+ targetIds = $$.mapToTargetIds(targetIds);
+
+ $$.svg.selectAll($$.selectorTargets(targetIds, '.' + CLASS.chartArc)).each(function (d) {
+ if (! $$.shouldExpand(d.data.id)) { return; }
+ $$.d3.select(this).selectAll('path')
+ .transition().duration($$.expandDuration(d.data.id))
+ .attr("d", $$.svgArcExpanded)
+ .transition().duration($$.expandDuration(d.data.id) * 2)
+ .attr("d", $$.svgArcExpandedSub)
+ .each(function (d) {
+ if ($$.isDonutType(d.data)) {
+ // callback here
+ }
+ });
+ });
+ };
+
+ c3_chart_internal_fn.unexpandArc = function (targetIds) {
+ var $$ = this;
+
+ if ($$.transiting) { return; }
+
+ targetIds = $$.mapToTargetIds(targetIds);
+
+ $$.svg.selectAll($$.selectorTargets(targetIds, '.' + CLASS.chartArc)).selectAll('path')
+ .transition().duration(function(d) {
+ return $$.expandDuration(d.data.id);
+ })
+ .attr("d", $$.svgArc);
+ $$.svg.selectAll('.' + CLASS.arc)
+ .style("opacity", 1);
+ };
+
+ c3_chart_internal_fn.expandDuration = function (id) {
+ var $$ = this, config = $$.config;
+
+ if ($$.isDonutType(id)) {
+ return config.donut_expand_duration;
+ } else if ($$.isGaugeType(id)) {
+ return config.gauge_expand_duration;
+ } else if ($$.isPieType(id)) {
+ return config.pie_expand_duration;
+ } else {
+ return 50;
+ }
+
+ };
+
+ c3_chart_internal_fn.shouldExpand = function (id) {
+ var $$ = this, config = $$.config;
+ return ($$.isDonutType(id) && config.donut_expand) ||
+ ($$.isGaugeType(id) && config.gauge_expand) ||
+ ($$.isPieType(id) && config.pie_expand);
+ };
+
+ c3_chart_internal_fn.shouldShowArcLabel = function () {
+ var $$ = this, config = $$.config, shouldShow = true;
+ if ($$.hasType('donut')) {
+ shouldShow = config.donut_label_show;
+ } else if ($$.hasType('pie')) {
+ shouldShow = config.pie_label_show;
+ }
+ // when gauge, always true
+ return shouldShow;
+ };
+
+ c3_chart_internal_fn.meetsArcLabelThreshold = function (ratio) {
+ var $$ = this, config = $$.config,
+ threshold = $$.hasType('donut') ? config.donut_label_threshold : config.pie_label_threshold;
+ return ratio >= threshold;
+ };
+
+ c3_chart_internal_fn.getArcLabelFormat = function () {
+ var $$ = this, config = $$.config,
+ format = config.pie_label_format;
+ if ($$.hasType('gauge')) {
+ format = config.gauge_label_format;
+ } else if ($$.hasType('donut')) {
+ format = config.donut_label_format;
+ }
+ return format;
+ };
+
+ c3_chart_internal_fn.getArcTitle = function () {
+ var $$ = this;
+ return $$.hasType('donut') ? $$.config.donut_title : "";
+ };
+
+ c3_chart_internal_fn.updateTargetsForArc = function (targets) {
+ var $$ = this, main = $$.main,
+ mainPieUpdate, mainPieEnter,
+ classChartArc = $$.classChartArc.bind($$),
+ classArcs = $$.classArcs.bind($$),
+ classFocus = $$.classFocus.bind($$);
+ mainPieUpdate = main.select('.' + CLASS.chartArcs).selectAll('.' + CLASS.chartArc)
+ .data($$.pie(targets))
+ .attr("class", function (d) { return classChartArc(d) + classFocus(d.data); });
+ mainPieEnter = mainPieUpdate.enter().append("g")
+ .attr("class", classChartArc);
+ mainPieEnter.append('g')
+ .attr('class', classArcs);
+ mainPieEnter.append("text")
+ .attr("dy", $$.hasType('gauge') ? "-.1em" : ".35em")
+ .style("opacity", 0)
+ .style("text-anchor", "middle")
+ .style("pointer-events", "none");
+ // MEMO: can not keep same color..., but not bad to update color in redraw
+ //mainPieUpdate.exit().remove();
+ };
+
+ c3_chart_internal_fn.initArc = function () {
+ var $$ = this;
+ $$.arcs = $$.main.select('.' + CLASS.chart).append("g")
+ .attr("class", CLASS.chartArcs)
+ .attr("transform", $$.getTranslate('arc'));
+ $$.arcs.append('text')
+ .attr('class', CLASS.chartArcsTitle)
+ .style("text-anchor", "middle")
+ .text($$.getArcTitle());
+ };
+
+ c3_chart_internal_fn.redrawArc = function (duration, durationForExit, withTransform) {
+ var $$ = this, d3 = $$.d3, config = $$.config, main = $$.main,
+ mainArc;
+ mainArc = main.selectAll('.' + CLASS.arcs).selectAll('.' + CLASS.arc)
+ .data($$.arcData.bind($$));
+ mainArc.enter().append('path')
+ .attr("class", $$.classArc.bind($$))
+ .style("fill", function (d) { return $$.color(d.data); })
+ .style("cursor", function (d) { return config.interaction_enabled && config.data_selection_isselectable(d) ? "pointer" : null; })
+ .style("opacity", 0)
+ .each(function (d) {
+ if ($$.isGaugeType(d.data)) {
+ d.startAngle = d.endAngle = -1 * (Math.PI / 2);
+ }
+ this._current = d;
+ });
+ mainArc
+ .attr("transform", function (d) { return !$$.isGaugeType(d.data) && withTransform ? "scale(0)" : ""; })
+ .style("opacity", function (d) { return d === this._current ? 0 : 1; })
+ .on('mouseover', config.interaction_enabled ? function (d) {
+ var updated, arcData;
+ if ($$.transiting) { // skip while transiting
+ return;
+ }
+ updated = $$.updateAngle(d);
+ if (updated) {
+ arcData = $$.convertToArcData(updated);
+ // transitions
+ $$.expandArc(updated.data.id);
+ $$.api.focus(updated.data.id);
+ $$.toggleFocusLegend(updated.data.id, true);
+ $$.config.data_onmouseover(arcData, this);
+ }
+ } : null)
+ .on('mousemove', config.interaction_enabled ? function (d) {
+ var updated = $$.updateAngle(d), arcData, selectedData;
+ if (updated) {
+ arcData = $$.convertToArcData(updated),
+ selectedData = [arcData];
+ $$.showTooltip(selectedData, this);
+ }
+ } : null)
+ .on('mouseout', config.interaction_enabled ? function (d) {
+ var updated, arcData;
+ if ($$.transiting) { // skip while transiting
+ return;
+ }
+ updated = $$.updateAngle(d);
+ if (updated) {
+ arcData = $$.convertToArcData(updated);
+ // transitions
+ $$.unexpandArc(updated.data.id);
+ $$.api.revert();
+ $$.revertLegend();
+ $$.hideTooltip();
+ $$.config.data_onmouseout(arcData, this);
+ }
+ } : null)
+ .on('click', config.interaction_enabled ? function (d, i) {
+ var updated = $$.updateAngle(d), arcData;
+ if (updated) {
+ arcData = $$.convertToArcData(updated);
+ if ($$.toggleShape) {
+ $$.toggleShape(this, arcData, i);
+ }
+ $$.config.data_onclick.call($$.api, arcData, this);
+ }
+ } : null)
+ .each(function () { $$.transiting = true; })
+ .transition().duration(duration)
+ .attrTween("d", function (d) {
+ var updated = $$.updateAngle(d), interpolate;
+ if (! updated) {
+ return function () { return "M 0 0"; };
+ }
+ // if (this._current === d) {
+ // this._current = {
+ // startAngle: Math.PI*2,
+ // endAngle: Math.PI*2,
+ // };
+ // }
+ if (isNaN(this._current.startAngle)) {
+ this._current.startAngle = 0;
+ }
+ if (isNaN(this._current.endAngle)) {
+ this._current.endAngle = this._current.startAngle;
+ }
+ interpolate = d3.interpolate(this._current, updated);
+ this._current = interpolate(0);
+ return function (t) {
+ var interpolated = interpolate(t);
+ interpolated.data = d.data; // data.id will be updated by interporator
+ return $$.getArc(interpolated, true);
+ };
+ })
+ .attr("transform", withTransform ? "scale(1)" : "")
+ .style("fill", function (d) {
+ return $$.levelColor ? $$.levelColor(d.data.values[0].value) : $$.color(d.data.id);
+ }) // Where gauge reading color would receive customization.
+ .style("opacity", 1)
+ .call($$.endall, function () {
+ $$.transiting = false;
+ });
+ mainArc.exit().transition().duration(durationForExit)
+ .style('opacity', 0)
+ .remove();
+ main.selectAll('.' + CLASS.chartArc).select('text')
+ .style("opacity", 0)
+ .attr('class', function (d) { return $$.isGaugeType(d.data) ? CLASS.gaugeValue : ''; })
+ .text($$.textForArcLabel.bind($$))
+ .attr("transform", $$.transformForArcLabel.bind($$))
+ .style('font-size', function (d) { return $$.isGaugeType(d.data) ? Math.round($$.radius / 5) + 'px' : ''; })
+ .transition().duration(duration)
+ .style("opacity", function (d) { return $$.isTargetToShow(d.data.id) && $$.isArcType(d.data) ? 1 : 0; });
+ main.select('.' + CLASS.chartArcsTitle)
+ .style("opacity", $$.hasType('donut') || $$.hasType('gauge') ? 1 : 0);
+
+ if ($$.hasType('gauge')) {
+ $$.arcs.select('.' + CLASS.chartArcsBackground)
+ .attr("d", function () {
+ var d = {
+ data: [{value: config.gauge_max}],
+ startAngle: -1 * (Math.PI / 2),
+ endAngle: Math.PI / 2
+ };
+ return $$.getArc(d, true, true);
+ });
+ $$.arcs.select('.' + CLASS.chartArcsGaugeUnit)
+ .attr("dy", ".75em")
+ .text(config.gauge_label_show ? config.gauge_units : '');
+ $$.arcs.select('.' + CLASS.chartArcsGaugeMin)
+ .attr("dx", -1 * ($$.innerRadius + (($$.radius - $$.innerRadius) / 2)) + "px")
+ .attr("dy", "1.2em")
+ .text(config.gauge_label_show ? config.gauge_min : '');
+ $$.arcs.select('.' + CLASS.chartArcsGaugeMax)
+ .attr("dx", $$.innerRadius + (($$.radius - $$.innerRadius) / 2) + "px")
+ .attr("dy", "1.2em")
+ .text(config.gauge_label_show ? config.gauge_max : '');
+ }
+ };
+ c3_chart_internal_fn.initGauge = function () {
+ var arcs = this.arcs;
+ if (this.hasType('gauge')) {
+ arcs.append('path')
+ .attr("class", CLASS.chartArcsBackground);
+ arcs.append("text")
+ .attr("class", CLASS.chartArcsGaugeUnit)
+ .style("text-anchor", "middle")
+ .style("pointer-events", "none");
+ arcs.append("text")
+ .attr("class", CLASS.chartArcsGaugeMin)
+ .style("text-anchor", "middle")
+ .style("pointer-events", "none");
+ arcs.append("text")
+ .attr("class", CLASS.chartArcsGaugeMax)
+ .style("text-anchor", "middle")
+ .style("pointer-events", "none");
+ }
+ };
+ c3_chart_internal_fn.getGaugeLabelHeight = function () {
+ return this.config.gauge_label_show ? 20 : 0;
+ };
+
+ c3_chart_internal_fn.initRegion = function () {
+ var $$ = this;
+ $$.region = $$.main.append('g')
+ .attr("clip-path", $$.clipPath)
+ .attr("class", CLASS.regions);
+ };
+ c3_chart_internal_fn.updateRegion = function (duration) {
+ var $$ = this, config = $$.config;
+
+ // hide if arc type
+ $$.region.style('visibility', $$.hasArcType() ? 'hidden' : 'visible');
+
+ $$.mainRegion = $$.main.select('.' + CLASS.regions).selectAll('.' + CLASS.region)
+ .data(config.regions);
+ $$.mainRegion.enter().append('g')
+ .attr('class', $$.classRegion.bind($$))
+ .append('rect')
+ .style("fill-opacity", 0);
+ $$.mainRegion.exit().transition().duration(duration)
+ .style("opacity", 0)
+ .remove();
+ };
+ c3_chart_internal_fn.redrawRegion = function (withTransition) {
+ var $$ = this,
+ regions = $$.mainRegion.selectAll('rect'),
+ x = $$.regionX.bind($$),
+ y = $$.regionY.bind($$),
+ w = $$.regionWidth.bind($$),
+ h = $$.regionHeight.bind($$);
+ return [
+ (withTransition ? regions.transition() : regions)
+ .attr("x", x)
+ .attr("y", y)
+ .attr("width", w)
+ .attr("height", h)
+ .style("fill-opacity", function (d) { return isValue(d.opacity) ? d.opacity : 0.1; })
+ ];
+ };
+ c3_chart_internal_fn.regionX = function (d) {
+ var $$ = this, config = $$.config,
+ xPos, yScale = d.axis === 'y' ? $$.y : $$.y2;
+ if (d.axis === 'y' || d.axis === 'y2') {
+ xPos = config.axis_rotated ? ('start' in d ? yScale(d.start) : 0) : 0;
+ } else {
+ xPos = config.axis_rotated ? 0 : ('start' in d ? $$.x($$.isTimeSeries() ? $$.parseDate(d.start) : d.start) : 0);
+ }
+ return xPos;
+ };
+ c3_chart_internal_fn.regionY = function (d) {
+ var $$ = this, config = $$.config,
+ yPos, yScale = d.axis === 'y' ? $$.y : $$.y2;
+ if (d.axis === 'y' || d.axis === 'y2') {
+ yPos = config.axis_rotated ? 0 : ('end' in d ? yScale(d.end) : 0);
+ } else {
+ yPos = config.axis_rotated ? ('start' in d ? $$.x($$.isTimeSeries() ? $$.parseDate(d.start) : d.start) : 0) : 0;
+ }
+ return yPos;
+ };
+ c3_chart_internal_fn.regionWidth = function (d) {
+ var $$ = this, config = $$.config,
+ start = $$.regionX(d), end, yScale = d.axis === 'y' ? $$.y : $$.y2;
+ if (d.axis === 'y' || d.axis === 'y2') {
+ end = config.axis_rotated ? ('end' in d ? yScale(d.end) : $$.width) : $$.width;
+ } else {
+ end = config.axis_rotated ? $$.width : ('end' in d ? $$.x($$.isTimeSeries() ? $$.parseDate(d.end) : d.end) : $$.width);
+ }
+ return end < start ? 0 : end - start;
+ };
+ c3_chart_internal_fn.regionHeight = function (d) {
+ var $$ = this, config = $$.config,
+ start = this.regionY(d), end, yScale = d.axis === 'y' ? $$.y : $$.y2;
+ if (d.axis === 'y' || d.axis === 'y2') {
+ end = config.axis_rotated ? $$.height : ('start' in d ? yScale(d.start) : $$.height);
+ } else {
+ end = config.axis_rotated ? ('end' in d ? $$.x($$.isTimeSeries() ? $$.parseDate(d.end) : d.end) : $$.height) : $$.height;
+ }
+ return end < start ? 0 : end - start;
+ };
+ c3_chart_internal_fn.isRegionOnX = function (d) {
+ return !d.axis || d.axis === 'x';
+ };
+
+ c3_chart_internal_fn.drag = function (mouse) {
+ var $$ = this, config = $$.config, main = $$.main, d3 = $$.d3;
+ var sx, sy, mx, my, minX, maxX, minY, maxY;
+
+ if ($$.hasArcType()) { return; }
+ if (! config.data_selection_enabled) { return; } // do nothing if not selectable
+ if (config.zoom_enabled && ! $$.zoom.altDomain) { return; } // skip if zoomable because of conflict drag dehavior
+ if (!config.data_selection_multiple) { return; } // skip when single selection because drag is used for multiple selection
+
+ sx = $$.dragStart[0];
+ sy = $$.dragStart[1];
+ mx = mouse[0];
+ my = mouse[1];
+ minX = Math.min(sx, mx);
+ maxX = Math.max(sx, mx);
+ minY = (config.data_selection_grouped) ? $$.margin.top : Math.min(sy, my);
+ maxY = (config.data_selection_grouped) ? $$.height : Math.max(sy, my);
+
+ main.select('.' + CLASS.dragarea)
+ .attr('x', minX)
+ .attr('y', minY)
+ .attr('width', maxX - minX)
+ .attr('height', maxY - minY);
+ // TODO: binary search when multiple xs
+ main.selectAll('.' + CLASS.shapes).selectAll('.' + CLASS.shape)
+ .filter(function (d) { return config.data_selection_isselectable(d); })
+ .each(function (d, i) {
+ var shape = d3.select(this),
+ isSelected = shape.classed(CLASS.SELECTED),
+ isIncluded = shape.classed(CLASS.INCLUDED),
+ _x, _y, _w, _h, toggle, isWithin = false, box;
+ if (shape.classed(CLASS.circle)) {
+ _x = shape.attr("cx") * 1;
+ _y = shape.attr("cy") * 1;
+ toggle = $$.togglePoint;
+ isWithin = minX < _x && _x < maxX && minY < _y && _y < maxY;
+ }
+ else if (shape.classed(CLASS.bar)) {
+ box = getPathBox(this);
+ _x = box.x;
+ _y = box.y;
+ _w = box.width;
+ _h = box.height;
+ toggle = $$.togglePath;
+ isWithin = !(maxX < _x || _x + _w < minX) && !(maxY < _y || _y + _h < minY);
+ } else {
+ // line/area selection not supported yet
+ return;
+ }
+ if (isWithin ^ isIncluded) {
+ shape.classed(CLASS.INCLUDED, !isIncluded);
+ // TODO: included/unincluded callback here
+ shape.classed(CLASS.SELECTED, !isSelected);
+ toggle.call($$, !isSelected, shape, d, i);
+ }
+ });
+ };
+
+ c3_chart_internal_fn.dragstart = function (mouse) {
+ var $$ = this, config = $$.config;
+ if ($$.hasArcType()) { return; }
+ if (! config.data_selection_enabled) { return; } // do nothing if not selectable
+ $$.dragStart = mouse;
+ $$.main.select('.' + CLASS.chart).append('rect')
+ .attr('class', CLASS.dragarea)
+ .style('opacity', 0.1);
+ $$.dragging = true;
+ };
+
+ c3_chart_internal_fn.dragend = function () {
+ var $$ = this, config = $$.config;
+ if ($$.hasArcType()) { return; }
+ if (! config.data_selection_enabled) { return; } // do nothing if not selectable
+ $$.main.select('.' + CLASS.dragarea)
+ .transition().duration(100)
+ .style('opacity', 0)
+ .remove();
+ $$.main.selectAll('.' + CLASS.shape)
+ .classed(CLASS.INCLUDED, false);
+ $$.dragging = false;
+ };
+
+ c3_chart_internal_fn.selectPoint = function (target, d, i) {
+ var $$ = this, config = $$.config,
+ cx = (config.axis_rotated ? $$.circleY : $$.circleX).bind($$),
+ cy = (config.axis_rotated ? $$.circleX : $$.circleY).bind($$),
+ r = $$.pointSelectR.bind($$);
+ config.data_onselected.call($$.api, d, target.node());
+ // add selected-circle on low layer g
+ $$.main.select('.' + CLASS.selectedCircles + $$.getTargetSelectorSuffix(d.id)).selectAll('.' + CLASS.selectedCircle + '-' + i)
+ .data([d])
+ .enter().append('circle')
+ .attr("class", function () { return $$.generateClass(CLASS.selectedCircle, i); })
+ .attr("cx", cx)
+ .attr("cy", cy)
+ .attr("stroke", function () { return $$.color(d); })
+ .attr("r", function (d) { return $$.pointSelectR(d) * 1.4; })
+ .transition().duration(100)
+ .attr("r", r);
+ };
+ c3_chart_internal_fn.unselectPoint = function (target, d, i) {
+ var $$ = this;
+ $$.config.data_onunselected.call($$.api, d, target.node());
+ // remove selected-circle from low layer g
+ $$.main.select('.' + CLASS.selectedCircles + $$.getTargetSelectorSuffix(d.id)).selectAll('.' + CLASS.selectedCircle + '-' + i)
+ .transition().duration(100).attr('r', 0)
+ .remove();
+ };
+ c3_chart_internal_fn.togglePoint = function (selected, target, d, i) {
+ selected ? this.selectPoint(target, d, i) : this.unselectPoint(target, d, i);
+ };
+ c3_chart_internal_fn.selectPath = function (target, d) {
+ var $$ = this;
+ $$.config.data_onselected.call($$, d, target.node());
+ target.transition().duration(100)
+ .style("fill", function () { return $$.d3.rgb($$.color(d)).brighter(0.75); });
+ };
+ c3_chart_internal_fn.unselectPath = function (target, d) {
+ var $$ = this;
+ $$.config.data_onunselected.call($$, d, target.node());
+ target.transition().duration(100)
+ .style("fill", function () { return $$.color(d); });
+ };
+ c3_chart_internal_fn.togglePath = function (selected, target, d, i) {
+ selected ? this.selectPath(target, d, i) : this.unselectPath(target, d, i);
+ };
+ c3_chart_internal_fn.getToggle = function (that, d) {
+ var $$ = this, toggle;
+ if (that.nodeName === 'circle') {
+ if ($$.isStepType(d)) {
+ // circle is hidden in step chart, so treat as within the click area
+ toggle = function () {}; // TODO: how to select step chart?
+ } else {
+ toggle = $$.togglePoint;
+ }
+ }
+ else if (that.nodeName === 'path') {
+ toggle = $$.togglePath;
+ }
+ return toggle;
+ };
+ c3_chart_internal_fn.toggleShape = function (that, d, i) {
+ var $$ = this, d3 = $$.d3, config = $$.config,
+ shape = d3.select(that), isSelected = shape.classed(CLASS.SELECTED),
+ toggle = $$.getToggle(that, d).bind($$);
+
+ if (config.data_selection_enabled && config.data_selection_isselectable(d)) {
+ if (!config.data_selection_multiple) {
+ $$.main.selectAll('.' + CLASS.shapes + (config.data_selection_grouped ? $$.getTargetSelectorSuffix(d.id) : "")).selectAll('.' + CLASS.shape).each(function (d, i) {
+ var shape = d3.select(this);
+ if (shape.classed(CLASS.SELECTED)) { toggle(false, shape.classed(CLASS.SELECTED, false), d, i); }
+ });
+ }
+ shape.classed(CLASS.SELECTED, !isSelected);
+ toggle(!isSelected, shape, d, i);
+ }
+ };
+
+ c3_chart_internal_fn.initBrush = function () {
+ var $$ = this, d3 = $$.d3;
+ $$.brush = d3.svg.brush().on("brush", function () { $$.redrawForBrush(); });
+ $$.brush.update = function () {
+ if ($$.context) { $$.context.select('.' + CLASS.brush).call(this); }
+ return this;
+ };
+ $$.brush.scale = function (scale) {
+ return $$.config.axis_rotated ? this.y(scale) : this.x(scale);
+ };
+ };
+ c3_chart_internal_fn.initSubchart = function () {
+ var $$ = this, config = $$.config,
+ context = $$.context = $$.svg.append("g").attr("transform", $$.getTranslate('context')),
+ visibility = config.subchart_show ? 'visible' : 'hidden';
+
+ context.style('visibility', visibility);
+
+ // Define g for chart area
+ context.append('g')
+ .attr("clip-path", $$.clipPathForSubchart)
+ .attr('class', CLASS.chart);
+
+ // Define g for bar chart area
+ context.select('.' + CLASS.chart).append("g")
+ .attr("class", CLASS.chartBars);
+
+ // Define g for line chart area
+ context.select('.' + CLASS.chart).append("g")
+ .attr("class", CLASS.chartLines);
+
+ // Add extent rect for Brush
+ context.append("g")
+ .attr("clip-path", $$.clipPath)
+ .attr("class", CLASS.brush)
+ .call($$.brush);
+
+ // ATTENTION: This must be called AFTER chart added
+ // Add Axis
+ $$.axes.subx = context.append("g")
+ .attr("class", CLASS.axisX)
+ .attr("transform", $$.getTranslate('subx'))
+ .attr("clip-path", config.axis_rotated ? "" : $$.clipPathForXAxis)
+ .style("visibility", config.subchart_axis_x_show ? visibility : 'hidden');
+ };
+ c3_chart_internal_fn.updateTargetsForSubchart = function (targets) {
+ var $$ = this, context = $$.context, config = $$.config,
+ contextLineEnter, contextLineUpdate, contextBarEnter, contextBarUpdate,
+ classChartBar = $$.classChartBar.bind($$),
+ classBars = $$.classBars.bind($$),
+ classChartLine = $$.classChartLine.bind($$),
+ classLines = $$.classLines.bind($$),
+ classAreas = $$.classAreas.bind($$);
+
+ if (config.subchart_show) {
+ //-- Bar --//
+ contextBarUpdate = context.select('.' + CLASS.chartBars).selectAll('.' + CLASS.chartBar)
+ .data(targets)
+ .attr('class', classChartBar);
+ contextBarEnter = contextBarUpdate.enter().append('g')
+ .style('opacity', 0)
+ .attr('class', classChartBar);
+ // Bars for each data
+ contextBarEnter.append('g')
+ .attr("class", classBars);
+
+ //-- Line --//
+ contextLineUpdate = context.select('.' + CLASS.chartLines).selectAll('.' + CLASS.chartLine)
+ .data(targets)
+ .attr('class', classChartLine);
+ contextLineEnter = contextLineUpdate.enter().append('g')
+ .style('opacity', 0)
+ .attr('class', classChartLine);
+ // Lines for each data
+ contextLineEnter.append("g")
+ .attr("class", classLines);
+ // Area
+ contextLineEnter.append("g")
+ .attr("class", classAreas);
+
+ //-- Brush --//
+ context.selectAll('.' + CLASS.brush + ' rect')
+ .attr(config.axis_rotated ? "width" : "height", config.axis_rotated ? $$.width2 : $$.height2);
+ }
+ };
+ c3_chart_internal_fn.updateBarForSubchart = function (durationForExit) {
+ var $$ = this;
+ $$.contextBar = $$.context.selectAll('.' + CLASS.bars).selectAll('.' + CLASS.bar)
+ .data($$.barData.bind($$));
+ $$.contextBar.enter().append('path')
+ .attr("class", $$.classBar.bind($$))
+ .style("stroke", 'none')
+ .style("fill", $$.color);
+ $$.contextBar
+ .style("opacity", $$.initialOpacity.bind($$));
+ $$.contextBar.exit().transition().duration(durationForExit)
+ .style('opacity', 0)
+ .remove();
+ };
+ c3_chart_internal_fn.redrawBarForSubchart = function (drawBarOnSub, withTransition, duration) {
+ (withTransition ? this.contextBar.transition(Math.random().toString()).duration(duration) : this.contextBar)
+ .attr('d', drawBarOnSub)
+ .style('opacity', 1);
+ };
+ c3_chart_internal_fn.updateLineForSubchart = function (durationForExit) {
+ var $$ = this;
+ $$.contextLine = $$.context.selectAll('.' + CLASS.lines).selectAll('.' + CLASS.line)
+ .data($$.lineData.bind($$));
+ $$.contextLine.enter().append('path')
+ .attr('class', $$.classLine.bind($$))
+ .style('stroke', $$.color);
+ $$.contextLine
+ .style("opacity", $$.initialOpacity.bind($$));
+ $$.contextLine.exit().transition().duration(durationForExit)
+ .style('opacity', 0)
+ .remove();
+ };
+ c3_chart_internal_fn.redrawLineForSubchart = function (drawLineOnSub, withTransition, duration) {
+ (withTransition ? this.contextLine.transition(Math.random().toString()).duration(duration) : this.contextLine)
+ .attr("d", drawLineOnSub)
+ .style('opacity', 1);
+ };
+ c3_chart_internal_fn.updateAreaForSubchart = function (durationForExit) {
+ var $$ = this, d3 = $$.d3;
+ $$.contextArea = $$.context.selectAll('.' + CLASS.areas).selectAll('.' + CLASS.area)
+ .data($$.lineData.bind($$));
+ $$.contextArea.enter().append('path')
+ .attr("class", $$.classArea.bind($$))
+ .style("fill", $$.color)
+ .style("opacity", function () { $$.orgAreaOpacity = +d3.select(this).style('opacity'); return 0; });
+ $$.contextArea
+ .style("opacity", 0);
+ $$.contextArea.exit().transition().duration(durationForExit)
+ .style('opacity', 0)
+ .remove();
+ };
+ c3_chart_internal_fn.redrawAreaForSubchart = function (drawAreaOnSub, withTransition, duration) {
+ (withTransition ? this.contextArea.transition(Math.random().toString()).duration(duration) : this.contextArea)
+ .attr("d", drawAreaOnSub)
+ .style("fill", this.color)
+ .style("opacity", this.orgAreaOpacity);
+ };
+ c3_chart_internal_fn.redrawSubchart = function (withSubchart, transitions, duration, durationForExit, areaIndices, barIndices, lineIndices) {
+ var $$ = this, d3 = $$.d3, config = $$.config,
+ drawAreaOnSub, drawBarOnSub, drawLineOnSub;
+
+ $$.context.style('visibility', config.subchart_show ? 'visible' : 'hidden');
+
+ // subchart
+ if (config.subchart_show) {
+ // reflect main chart to extent on subchart if zoomed
+ if (d3.event && d3.event.type === 'zoom') {
+ $$.brush.extent($$.x.orgDomain()).update();
+ }
+ // update subchart elements if needed
+ if (withSubchart) {
+
+ // extent rect
+ if (!$$.brush.empty()) {
+ $$.brush.extent($$.x.orgDomain()).update();
+ }
+ // setup drawer - MEMO: this must be called after axis updated
+ drawAreaOnSub = $$.generateDrawArea(areaIndices, true);
+ drawBarOnSub = $$.generateDrawBar(barIndices, true);
+ drawLineOnSub = $$.generateDrawLine(lineIndices, true);
+
+ $$.updateBarForSubchart(duration);
+ $$.updateLineForSubchart(duration);
+ $$.updateAreaForSubchart(duration);
+
+ $$.redrawBarForSubchart(drawBarOnSub, duration, duration);
+ $$.redrawLineForSubchart(drawLineOnSub, duration, duration);
+ $$.redrawAreaForSubchart(drawAreaOnSub, duration, duration);
+ }
+ }
+ };
+ c3_chart_internal_fn.redrawForBrush = function () {
+ var $$ = this, x = $$.x;
+ $$.redraw({
+ withTransition: false,
+ withY: $$.config.zoom_rescale,
+ withSubchart: false,
+ withUpdateXDomain: true,
+ withDimension: false
+ });
+ $$.config.subchart_onbrush.call($$.api, x.orgDomain());
+ };
+ c3_chart_internal_fn.transformContext = function (withTransition, transitions) {
+ var $$ = this, subXAxis;
+ if (transitions && transitions.axisSubX) {
+ subXAxis = transitions.axisSubX;
+ } else {
+ subXAxis = $$.context.select('.' + CLASS.axisX);
+ if (withTransition) { subXAxis = subXAxis.transition(); }
+ }
+ $$.context.attr("transform", $$.getTranslate('context'));
+ subXAxis.attr("transform", $$.getTranslate('subx'));
+ };
+ c3_chart_internal_fn.getDefaultExtent = function () {
+ var $$ = this, config = $$.config,
+ extent = isFunction(config.axis_x_extent) ? config.axis_x_extent($$.getXDomain($$.data.targets)) : config.axis_x_extent;
+ if ($$.isTimeSeries()) {
+ extent = [$$.parseDate(extent[0]), $$.parseDate(extent[1])];
+ }
+ return extent;
+ };
+
+ c3_chart_internal_fn.initZoom = function () {
+ var $$ = this, d3 = $$.d3, config = $$.config, startEvent;
+
+ $$.zoom = d3.behavior.zoom()
+ .on("zoomstart", function () {
+ startEvent = d3.event.sourceEvent;
+ $$.zoom.altDomain = d3.event.sourceEvent.altKey ? $$.x.orgDomain() : null;
+ config.zoom_onzoomstart.call($$.api, d3.event.sourceEvent);
+ })
+ .on("zoom", function () {
+ $$.redrawForZoom.call($$);
+ })
+ .on('zoomend', function () {
+ var event = d3.event.sourceEvent;
+ // if click, do nothing. otherwise, click interaction will be canceled.
+ if (event && startEvent.clientX === event.clientX && startEvent.clientY === event.clientY) {
+ return;
+ }
+ $$.redrawEventRect();
+ $$.updateZoom();
+ config.zoom_onzoomend.call($$.api, $$.x.orgDomain());
+ });
+ $$.zoom.scale = function (scale) {
+ return config.axis_rotated ? this.y(scale) : this.x(scale);
+ };
+ $$.zoom.orgScaleExtent = function () {
+ var extent = config.zoom_extent ? config.zoom_extent : [1, 10];
+ return [extent[0], Math.max($$.getMaxDataCount() / extent[1], extent[1])];
+ };
+ $$.zoom.updateScaleExtent = function () {
+ var ratio = diffDomain($$.x.orgDomain()) / diffDomain($$.getZoomDomain()),
+ extent = this.orgScaleExtent();
+ this.scaleExtent([extent[0] * ratio, extent[1] * ratio]);
+ return this;
+ };
+ };
+ c3_chart_internal_fn.getZoomDomain = function () {
+ var $$ = this, config = $$.config, d3 = $$.d3,
+ min = d3.min([$$.orgXDomain[0], config.zoom_x_min]),
+ max = d3.max([$$.orgXDomain[1], config.zoom_x_max]);
+ return [min, max];
+ };
+ c3_chart_internal_fn.updateZoom = function () {
+ var $$ = this, z = $$.config.zoom_enabled ? $$.zoom : function () {};
+ $$.main.select('.' + CLASS.zoomRect).call(z).on("dblclick.zoom", null);
+ $$.main.selectAll('.' + CLASS.eventRect).call(z).on("dblclick.zoom", null);
+ };
+ c3_chart_internal_fn.redrawForZoom = function () {
+ var $$ = this, d3 = $$.d3, config = $$.config, zoom = $$.zoom, x = $$.x;
+ if (!config.zoom_enabled) {
+ return;
+ }
+ if ($$.filterTargetsToShow($$.data.targets).length === 0) {
+ return;
+ }
+ if (d3.event.sourceEvent.type === 'mousemove' && zoom.altDomain) {
+ x.domain(zoom.altDomain);
+ zoom.scale(x).updateScaleExtent();
+ return;
+ }
+ if ($$.isCategorized() && x.orgDomain()[0] === $$.orgXDomain[0]) {
+ x.domain([$$.orgXDomain[0] - 1e-10, x.orgDomain()[1]]);
+ }
+ $$.redraw({
+ withTransition: false,
+ withY: config.zoom_rescale,
+ withSubchart: false,
+ withEventRect: false,
+ withDimension: false
+ });
+ if (d3.event.sourceEvent.type === 'mousemove') {
+ $$.cancelClick = true;
+ }
+ config.zoom_onzoom.call($$.api, x.orgDomain());
+ };
+
+ c3_chart_internal_fn.generateColor = function () {
+ var $$ = this, config = $$.config, d3 = $$.d3,
+ colors = config.data_colors,
+ pattern = notEmpty(config.color_pattern) ? config.color_pattern : d3.scale.category10().range(),
+ callback = config.data_color,
+ ids = [];
+
+ return function (d) {
+ var id = d.id || (d.data && d.data.id) || d, color;
+
+ // if callback function is provided
+ if (colors[id] instanceof Function) {
+ color = colors[id](d);
+ }
+ // if specified, choose that color
+ else if (colors[id]) {
+ color = colors[id];
+ }
+ // if not specified, choose from pattern
+ else {
+ if (ids.indexOf(id) < 0) { ids.push(id); }
+ color = pattern[ids.indexOf(id) % pattern.length];
+ colors[id] = color;
+ }
+ return callback instanceof Function ? callback(color, d) : color;
+ };
+ };
+ c3_chart_internal_fn.generateLevelColor = function () {
+ var $$ = this, config = $$.config,
+ colors = config.color_pattern,
+ threshold = config.color_threshold,
+ asValue = threshold.unit === 'value',
+ values = threshold.values && threshold.values.length ? threshold.values : [],
+ max = threshold.max || 100;
+ return notEmpty(config.color_threshold) ? function (value) {
+ var i, v, color = colors[colors.length - 1];
+ for (i = 0; i < values.length; i++) {
+ v = asValue ? value : (value * 100 / max);
+ if (v < values[i]) {
+ color = colors[i];
+ break;
+ }
+ }
+ return color;
+ } : null;
+ };
+
+ c3_chart_internal_fn.getYFormat = function (forArc) {
+ var $$ = this,
+ formatForY = forArc && !$$.hasType('gauge') ? $$.defaultArcValueFormat : $$.yFormat,
+ formatForY2 = forArc && !$$.hasType('gauge') ? $$.defaultArcValueFormat : $$.y2Format;
+ return function (v, ratio, id) {
+ var format = $$.axis.getId(id) === 'y2' ? formatForY2 : formatForY;
+ return format.call($$, v, ratio);
+ };
+ };
+ c3_chart_internal_fn.yFormat = function (v) {
+ var $$ = this, config = $$.config,
+ format = config.axis_y_tick_format ? config.axis_y_tick_format : $$.defaultValueFormat;
+ return format(v);
+ };
+ c3_chart_internal_fn.y2Format = function (v) {
+ var $$ = this, config = $$.config,
+ format = config.axis_y2_tick_format ? config.axis_y2_tick_format : $$.defaultValueFormat;
+ return format(v);
+ };
+ c3_chart_internal_fn.defaultValueFormat = function (v) {
+ return isValue(v) ? +v : "";
+ };
+ c3_chart_internal_fn.defaultArcValueFormat = function (v, ratio) {
+ return (ratio * 100).toFixed(1) + '%';
+ };
+ c3_chart_internal_fn.dataLabelFormat = function (targetId) {
+ var $$ = this, data_labels = $$.config.data_labels,
+ format, defaultFormat = function (v) { return isValue(v) ? +v : ""; };
+ // find format according to axis id
+ if (typeof data_labels.format === 'function') {
+ format = data_labels.format;
+ } else if (typeof data_labels.format === 'object') {
+ if (data_labels.format[targetId]) {
+ format = data_labels.format[targetId] === true ? defaultFormat : data_labels.format[targetId];
+ } else {
+ format = function () { return ''; };
+ }
+ } else {
+ format = defaultFormat;
+ }
+ return format;
+ };
+
+ c3_chart_internal_fn.hasCaches = function (ids) {
+ for (var i = 0; i < ids.length; i++) {
+ if (! (ids[i] in this.cache)) { return false; }
+ }
+ return true;
+ };
+ c3_chart_internal_fn.addCache = function (id, target) {
+ this.cache[id] = this.cloneTarget(target);
+ };
+ c3_chart_internal_fn.getCaches = function (ids) {
+ var targets = [], i;
+ for (i = 0; i < ids.length; i++) {
+ if (ids[i] in this.cache) { targets.push(this.cloneTarget(this.cache[ids[i]])); }
+ }
+ return targets;
+ };
+
+ var CLASS = c3_chart_internal_fn.CLASS = {
+ target: 'c3-target',
+ chart: 'c3-chart',
+ chartLine: 'c3-chart-line',
+ chartLines: 'c3-chart-lines',
+ chartBar: 'c3-chart-bar',
+ chartBars: 'c3-chart-bars',
+ chartText: 'c3-chart-text',
+ chartTexts: 'c3-chart-texts',
+ chartArc: 'c3-chart-arc',
+ chartArcs: 'c3-chart-arcs',
+ chartArcsTitle: 'c3-chart-arcs-title',
+ chartArcsBackground: 'c3-chart-arcs-background',
+ chartArcsGaugeUnit: 'c3-chart-arcs-gauge-unit',
+ chartArcsGaugeMax: 'c3-chart-arcs-gauge-max',
+ chartArcsGaugeMin: 'c3-chart-arcs-gauge-min',
+ selectedCircle: 'c3-selected-circle',
+ selectedCircles: 'c3-selected-circles',
+ eventRect: 'c3-event-rect',
+ eventRects: 'c3-event-rects',
+ eventRectsSingle: 'c3-event-rects-single',
+ eventRectsMultiple: 'c3-event-rects-multiple',
+ zoomRect: 'c3-zoom-rect',
+ brush: 'c3-brush',
+ focused: 'c3-focused',
+ defocused: 'c3-defocused',
+ region: 'c3-region',
+ regions: 'c3-regions',
+ title: 'c3-title',
+ tooltipContainer: 'c3-tooltip-container',
+ tooltip: 'c3-tooltip',
+ tooltipName: 'c3-tooltip-name',
+ shape: 'c3-shape',
+ shapes: 'c3-shapes',
+ line: 'c3-line',
+ lines: 'c3-lines',
+ bar: 'c3-bar',
+ bars: 'c3-bars',
+ circle: 'c3-circle',
+ circles: 'c3-circles',
+ arc: 'c3-arc',
+ arcs: 'c3-arcs',
+ area: 'c3-area',
+ areas: 'c3-areas',
+ empty: 'c3-empty',
+ text: 'c3-text',
+ texts: 'c3-texts',
+ gaugeValue: 'c3-gauge-value',
+ grid: 'c3-grid',
+ gridLines: 'c3-grid-lines',
+ xgrid: 'c3-xgrid',
+ xgrids: 'c3-xgrids',
+ xgridLine: 'c3-xgrid-line',
+ xgridLines: 'c3-xgrid-lines',
+ xgridFocus: 'c3-xgrid-focus',
+ ygrid: 'c3-ygrid',
+ ygrids: 'c3-ygrids',
+ ygridLine: 'c3-ygrid-line',
+ ygridLines: 'c3-ygrid-lines',
+ axis: 'c3-axis',
+ axisX: 'c3-axis-x',
+ axisXLabel: 'c3-axis-x-label',
+ axisY: 'c3-axis-y',
+ axisYLabel: 'c3-axis-y-label',
+ axisY2: 'c3-axis-y2',
+ axisY2Label: 'c3-axis-y2-label',
+ legendBackground: 'c3-legend-background',
+ legendItem: 'c3-legend-item',
+ legendItemEvent: 'c3-legend-item-event',
+ legendItemTile: 'c3-legend-item-tile',
+ legendItemHidden: 'c3-legend-item-hidden',
+ legendItemFocused: 'c3-legend-item-focused',
+ dragarea: 'c3-dragarea',
+ EXPANDED: '_expanded_',
+ SELECTED: '_selected_',
+ INCLUDED: '_included_'
+ };
+ c3_chart_internal_fn.generateClass = function (prefix, targetId) {
+ return " " + prefix + " " + prefix + this.getTargetSelectorSuffix(targetId);
+ };
+ c3_chart_internal_fn.classText = function (d) {
+ return this.generateClass(CLASS.text, d.index);
+ };
+ c3_chart_internal_fn.classTexts = function (d) {
+ return this.generateClass(CLASS.texts, d.id);
+ };
+ c3_chart_internal_fn.classShape = function (d) {
+ return this.generateClass(CLASS.shape, d.index);
+ };
+ c3_chart_internal_fn.classShapes = function (d) {
+ return this.generateClass(CLASS.shapes, d.id);
+ };
+ c3_chart_internal_fn.classLine = function (d) {
+ return this.classShape(d) + this.generateClass(CLASS.line, d.id);
+ };
+ c3_chart_internal_fn.classLines = function (d) {
+ return this.classShapes(d) + this.generateClass(CLASS.lines, d.id);
+ };
+ c3_chart_internal_fn.classCircle = function (d) {
+ return this.classShape(d) + this.generateClass(CLASS.circle, d.index);
+ };
+ c3_chart_internal_fn.classCircles = function (d) {
+ return this.classShapes(d) + this.generateClass(CLASS.circles, d.id);
+ };
+ c3_chart_internal_fn.classBar = function (d) {
+ return this.classShape(d) + this.generateClass(CLASS.bar, d.index);
+ };
+ c3_chart_internal_fn.classBars = function (d) {
+ return this.classShapes(d) + this.generateClass(CLASS.bars, d.id);
+ };
+ c3_chart_internal_fn.classArc = function (d) {
+ return this.classShape(d.data) + this.generateClass(CLASS.arc, d.data.id);
+ };
+ c3_chart_internal_fn.classArcs = function (d) {
+ return this.classShapes(d.data) + this.generateClass(CLASS.arcs, d.data.id);
+ };
+ c3_chart_internal_fn.classArea = function (d) {
+ return this.classShape(d) + this.generateClass(CLASS.area, d.id);
+ };
+ c3_chart_internal_fn.classAreas = function (d) {
+ return this.classShapes(d) + this.generateClass(CLASS.areas, d.id);
+ };
+ c3_chart_internal_fn.classRegion = function (d, i) {
+ return this.generateClass(CLASS.region, i) + ' ' + ('class' in d ? d['class'] : '');
+ };
+ c3_chart_internal_fn.classEvent = function (d) {
+ return this.generateClass(CLASS.eventRect, d.index);
+ };
+ c3_chart_internal_fn.classTarget = function (id) {
+ var $$ = this;
+ var additionalClassSuffix = $$.config.data_classes[id], additionalClass = '';
+ if (additionalClassSuffix) {
+ additionalClass = ' ' + CLASS.target + '-' + additionalClassSuffix;
+ }
+ return $$.generateClass(CLASS.target, id) + additionalClass;
+ };
+ c3_chart_internal_fn.classFocus = function (d) {
+ return this.classFocused(d) + this.classDefocused(d);
+ };
+ c3_chart_internal_fn.classFocused = function (d) {
+ return ' ' + (this.focusedTargetIds.indexOf(d.id) >= 0 ? CLASS.focused : '');
+ };
+ c3_chart_internal_fn.classDefocused = function (d) {
+ return ' ' + (this.defocusedTargetIds.indexOf(d.id) >= 0 ? CLASS.defocused : '');
+ };
+ c3_chart_internal_fn.classChartText = function (d) {
+ return CLASS.chartText + this.classTarget(d.id);
+ };
+ c3_chart_internal_fn.classChartLine = function (d) {
+ return CLASS.chartLine + this.classTarget(d.id);
+ };
+ c3_chart_internal_fn.classChartBar = function (d) {
+ return CLASS.chartBar + this.classTarget(d.id);
+ };
+ c3_chart_internal_fn.classChartArc = function (d) {
+ return CLASS.chartArc + this.classTarget(d.data.id);
+ };
+ c3_chart_internal_fn.getTargetSelectorSuffix = function (targetId) {
+ return targetId || targetId === 0 ? ('-' + targetId).replace(/[\s?!@#$%^&*()_=+,.<>'":;\[\]\/|~`{}\\]/g, '-') : '';
+ };
+ c3_chart_internal_fn.selectorTarget = function (id, prefix) {
+ return (prefix || '') + '.' + CLASS.target + this.getTargetSelectorSuffix(id);
+ };
+ c3_chart_internal_fn.selectorTargets = function (ids, prefix) {
+ var $$ = this;
+ ids = ids || [];
+ return ids.length ? ids.map(function (id) { return $$.selectorTarget(id, prefix); }) : null;
+ };
+ c3_chart_internal_fn.selectorLegend = function (id) {
+ return '.' + CLASS.legendItem + this.getTargetSelectorSuffix(id);
+ };
+ c3_chart_internal_fn.selectorLegends = function (ids) {
+ var $$ = this;
+ return ids && ids.length ? ids.map(function (id) { return $$.selectorLegend(id); }) : null;
+ };
+
+ var isValue = c3_chart_internal_fn.isValue = function (v) {
+ return v || v === 0;
+ },
+ isFunction = c3_chart_internal_fn.isFunction = function (o) {
+ return typeof o === 'function';
+ },
+ isString = c3_chart_internal_fn.isString = function (o) {
+ return typeof o === 'string';
+ },
+ isUndefined = c3_chart_internal_fn.isUndefined = function (v) {
+ return typeof v === 'undefined';
+ },
+ isDefined = c3_chart_internal_fn.isDefined = function (v) {
+ return typeof v !== 'undefined';
+ },
+ ceil10 = c3_chart_internal_fn.ceil10 = function (v) {
+ return Math.ceil(v / 10) * 10;
+ },
+ asHalfPixel = c3_chart_internal_fn.asHalfPixel = function (n) {
+ return Math.ceil(n) + 0.5;
+ },
+ diffDomain = c3_chart_internal_fn.diffDomain = function (d) {
+ return d[1] - d[0];
+ },
+ isEmpty = c3_chart_internal_fn.isEmpty = function (o) {
+ return typeof o === 'undefined' || o === null || (isString(o) && o.length === 0) || (typeof o === 'object' && Object.keys(o).length === 0);
+ },
+ notEmpty = c3_chart_internal_fn.notEmpty = function (o) {
+ return !c3_chart_internal_fn.isEmpty(o);
+ },
+ getOption = c3_chart_internal_fn.getOption = function (options, key, defaultValue) {
+ return isDefined(options[key]) ? options[key] : defaultValue;
+ },
+ hasValue = c3_chart_internal_fn.hasValue = function (dict, value) {
+ var found = false;
+ Object.keys(dict).forEach(function (key) {
+ if (dict[key] === value) { found = true; }
+ });
+ return found;
+ },
+ getPathBox = c3_chart_internal_fn.getPathBox = function (path) {
+ var box = path.getBoundingClientRect(),
+ items = [path.pathSegList.getItem(0), path.pathSegList.getItem(1)],
+ minX = items[0].x, minY = Math.min(items[0].y, items[1].y);
+ return {x: minX, y: minY, width: box.width, height: box.height};
+ };
+
+ c3_chart_fn.focus = function (targetIds) {
+ var $$ = this.internal, candidates;
+
+ targetIds = $$.mapToTargetIds(targetIds);
+ candidates = $$.svg.selectAll($$.selectorTargets(targetIds.filter($$.isTargetToShow, $$))),
+
+ this.revert();
+ this.defocus();
+ candidates.classed(CLASS.focused, true).classed(CLASS.defocused, false);
+ if ($$.hasArcType()) {
+ $$.expandArc(targetIds);
+ }
+ $$.toggleFocusLegend(targetIds, true);
+
+ $$.focusedTargetIds = targetIds;
+ $$.defocusedTargetIds = $$.defocusedTargetIds.filter(function (id) {
+ return targetIds.indexOf(id) < 0;
+ });
+ };
+
+ c3_chart_fn.defocus = function (targetIds) {
+ var $$ = this.internal, candidates;
+
+ targetIds = $$.mapToTargetIds(targetIds);
+ candidates = $$.svg.selectAll($$.selectorTargets(targetIds.filter($$.isTargetToShow, $$))),
+
+ candidates.classed(CLASS.focused, false).classed(CLASS.defocused, true);
+ if ($$.hasArcType()) {
+ $$.unexpandArc(targetIds);
+ }
+ $$.toggleFocusLegend(targetIds, false);
+
+ $$.focusedTargetIds = $$.focusedTargetIds.filter(function (id) {
+ return targetIds.indexOf(id) < 0;
+ });
+ $$.defocusedTargetIds = targetIds;
+ };
+
+ c3_chart_fn.revert = function (targetIds) {
+ var $$ = this.internal, candidates;
+
+ targetIds = $$.mapToTargetIds(targetIds);
+ candidates = $$.svg.selectAll($$.selectorTargets(targetIds)); // should be for all targets
+
+ candidates.classed(CLASS.focused, false).classed(CLASS.defocused, false);
+ if ($$.hasArcType()) {
+ $$.unexpandArc(targetIds);
+ }
+ if ($$.config.legend_show) {
+ $$.showLegend(targetIds.filter($$.isLegendToShow.bind($$)));
+ $$.legend.selectAll($$.selectorLegends(targetIds))
+ .filter(function () {
+ return $$.d3.select(this).classed(CLASS.legendItemFocused);
+ })
+ .classed(CLASS.legendItemFocused, false);
+ }
+
+ $$.focusedTargetIds = [];
+ $$.defocusedTargetIds = [];
+ };
+
+ c3_chart_fn.show = function (targetIds, options) {
+ var $$ = this.internal, targets;
+
+ targetIds = $$.mapToTargetIds(targetIds);
+ options = options || {};
+
+ $$.removeHiddenTargetIds(targetIds);
+ targets = $$.svg.selectAll($$.selectorTargets(targetIds));
+
+ targets.transition()
+ .style('opacity', 1, 'important')
+ .call($$.endall, function () {
+ targets.style('opacity', null).style('opacity', 1);
+ });
+
+ if (options.withLegend) {
+ $$.showLegend(targetIds);
+ }
+
+ $$.redraw({withUpdateOrgXDomain: true, withUpdateXDomain: true, withLegend: true});
+ };
+
+ c3_chart_fn.hide = function (targetIds, options) {
+ var $$ = this.internal, targets;
+
+ targetIds = $$.mapToTargetIds(targetIds);
+ options = options || {};
+
+ $$.addHiddenTargetIds(targetIds);
+ targets = $$.svg.selectAll($$.selectorTargets(targetIds));
+
+ targets.transition()
+ .style('opacity', 0, 'important')
+ .call($$.endall, function () {
+ targets.style('opacity', null).style('opacity', 0);
+ });
+
+ if (options.withLegend) {
+ $$.hideLegend(targetIds);
+ }
+
+ $$.redraw({withUpdateOrgXDomain: true, withUpdateXDomain: true, withLegend: true});
+ };
+
+ c3_chart_fn.toggle = function (targetIds, options) {
+ var that = this, $$ = this.internal;
+ $$.mapToTargetIds(targetIds).forEach(function (targetId) {
+ $$.isTargetToShow(targetId) ? that.hide(targetId, options) : that.show(targetId, options);
+ });
+ };
+
+ c3_chart_fn.zoom = function (domain) {
+ var $$ = this.internal;
+ if (domain) {
+ if ($$.isTimeSeries()) {
+ domain = domain.map(function (x) { return $$.parseDate(x); });
+ }
+ $$.brush.extent(domain);
+ $$.redraw({withUpdateXDomain: true, withY: $$.config.zoom_rescale});
+ $$.config.zoom_onzoom.call(this, $$.x.orgDomain());
+ }
+ return $$.brush.extent();
+ };
+ c3_chart_fn.zoom.enable = function (enabled) {
+ var $$ = this.internal;
+ $$.config.zoom_enabled = enabled;
+ $$.updateAndRedraw();
+ };
+ c3_chart_fn.unzoom = function () {
+ var $$ = this.internal;
+ $$.brush.clear().update();
+ $$.redraw({withUpdateXDomain: true});
+ };
+
+ c3_chart_fn.zoom.max = function (max) {
+ var $$ = this.internal, config = $$.config, d3 = $$.d3;
+ if (max === 0 || max) {
+ config.zoom_x_max = d3.max([$$.orgXDomain[1], max]);
+ }
+ else {
+ return config.zoom_x_max;
+ }
+ };
+
+ c3_chart_fn.zoom.min = function (min) {
+ var $$ = this.internal, config = $$.config, d3 = $$.d3;
+ if (min === 0 || min) {
+ config.zoom_x_min = d3.min([$$.orgXDomain[0], min]);
+ }
+ else {
+ return config.zoom_x_min;
+ }
+ };
+
+ c3_chart_fn.zoom.range = function (range) {
+ if (arguments.length) {
+ if (isDefined(range.max)) { this.domain.max(range.max); }
+ if (isDefined(range.min)) { this.domain.min(range.min); }
+ } else {
+ return {
+ max: this.domain.max(),
+ min: this.domain.min()
+ };
+ }
+ };
+
+ c3_chart_fn.load = function (args) {
+ var $$ = this.internal, config = $$.config;
+ // update xs if specified
+ if (args.xs) {
+ $$.addXs(args.xs);
+ }
+ // update classes if exists
+ if ('classes' in args) {
+ Object.keys(args.classes).forEach(function (id) {
+ config.data_classes[id] = args.classes[id];
+ });
+ }
+ // update categories if exists
+ if ('categories' in args && $$.isCategorized()) {
+ config.axis_x_categories = args.categories;
+ }
+ // update axes if exists
+ if ('axes' in args) {
+ Object.keys(args.axes).forEach(function (id) {
+ config.data_axes[id] = args.axes[id];
+ });
+ }
+ // update colors if exists
+ if ('colors' in args) {
+ Object.keys(args.colors).forEach(function (id) {
+ config.data_colors[id] = args.colors[id];
+ });
+ }
+ // use cache if exists
+ if ('cacheIds' in args && $$.hasCaches(args.cacheIds)) {
+ $$.load($$.getCaches(args.cacheIds), args.done);
+ return;
+ }
+ // unload if needed
+ if ('unload' in args) {
+ // TODO: do not unload if target will load (included in url/rows/columns)
+ $$.unload($$.mapToTargetIds((typeof args.unload === 'boolean' && args.unload) ? null : args.unload), function () {
+ $$.loadFromArgs(args);
+ });
+ } else {
+ $$.loadFromArgs(args);
+ }
+ };
+
+ c3_chart_fn.unload = function (args) {
+ var $$ = this.internal;
+ args = args || {};
+ if (args instanceof Array) {
+ args = {ids: args};
+ } else if (typeof args === 'string') {
+ args = {ids: [args]};
+ }
+ $$.unload($$.mapToTargetIds(args.ids), function () {
+ $$.redraw({withUpdateOrgXDomain: true, withUpdateXDomain: true, withLegend: true});
+ if (args.done) { args.done(); }
+ });
+ };
+
+ c3_chart_fn.flow = function (args) {
+ var $$ = this.internal,
+ targets, data, notfoundIds = [], orgDataCount = $$.getMaxDataCount(),
+ dataCount, domain, baseTarget, baseValue, length = 0, tail = 0, diff, to;
+
+ if (args.json) {
+ data = $$.convertJsonToData(args.json, args.keys);
+ }
+ else if (args.rows) {
+ data = $$.convertRowsToData(args.rows);
+ }
+ else if (args.columns) {
+ data = $$.convertColumnsToData(args.columns);
+ }
+ else {
+ return;
+ }
+ targets = $$.convertDataToTargets(data, true);
+
+ // Update/Add data
+ $$.data.targets.forEach(function (t) {
+ var found = false, i, j;
+ for (i = 0; i < targets.length; i++) {
+ if (t.id === targets[i].id) {
+ found = true;
+
+ if (t.values[t.values.length - 1]) {
+ tail = t.values[t.values.length - 1].index + 1;
+ }
+ length = targets[i].values.length;
+
+ for (j = 0; j < length; j++) {
+ targets[i].values[j].index = tail + j;
+ if (!$$.isTimeSeries()) {
+ targets[i].values[j].x = tail + j;
+ }
+ }
+ t.values = t.values.concat(targets[i].values);
+
+ targets.splice(i, 1);
+ break;
+ }
+ }
+ if (!found) { notfoundIds.push(t.id); }
+ });
+
+ // Append null for not found targets
+ $$.data.targets.forEach(function (t) {
+ var i, j;
+ for (i = 0; i < notfoundIds.length; i++) {
+ if (t.id === notfoundIds[i]) {
+ tail = t.values[t.values.length - 1].index + 1;
+ for (j = 0; j < length; j++) {
+ t.values.push({
+ id: t.id,
+ index: tail + j,
+ x: $$.isTimeSeries() ? $$.getOtherTargetX(tail + j) : tail + j,
+ value: null
+ });
+ }
+ }
+ }
+ });
+
+ // Generate null values for new target
+ if ($$.data.targets.length) {
+ targets.forEach(function (t) {
+ var i, missing = [];
+ for (i = $$.data.targets[0].values[0].index; i < tail; i++) {
+ missing.push({
+ id: t.id,
+ index: i,
+ x: $$.isTimeSeries() ? $$.getOtherTargetX(i) : i,
+ value: null
+ });
+ }
+ t.values.forEach(function (v) {
+ v.index += tail;
+ if (!$$.isTimeSeries()) {
+ v.x += tail;
+ }
+ });
+ t.values = missing.concat(t.values);
+ });
+ }
+ $$.data.targets = $$.data.targets.concat(targets); // add remained
+
+ // check data count because behavior needs to change when it's only one
+ dataCount = $$.getMaxDataCount();
+ baseTarget = $$.data.targets[0];
+ baseValue = baseTarget.values[0];
+
+ // Update length to flow if needed
+ if (isDefined(args.to)) {
+ length = 0;
+ to = $$.isTimeSeries() ? $$.parseDate(args.to) : args.to;
+ baseTarget.values.forEach(function (v) {
+ if (v.x < to) { length++; }
+ });
+ } else if (isDefined(args.length)) {
+ length = args.length;
+ }
+
+ // If only one data, update the domain to flow from left edge of the chart
+ if (!orgDataCount) {
+ if ($$.isTimeSeries()) {
+ if (baseTarget.values.length > 1) {
+ diff = baseTarget.values[baseTarget.values.length - 1].x - baseValue.x;
+ } else {
+ diff = baseValue.x - $$.getXDomain($$.data.targets)[0];
+ }
+ } else {
+ diff = 1;
+ }
+ domain = [baseValue.x - diff, baseValue.x];
+ $$.updateXDomain(null, true, true, false, domain);
+ } else if (orgDataCount === 1) {
+ if ($$.isTimeSeries()) {
+ diff = (baseTarget.values[baseTarget.values.length - 1].x - baseValue.x) / 2;
+ domain = [new Date(+baseValue.x - diff), new Date(+baseValue.x + diff)];
+ $$.updateXDomain(null, true, true, false, domain);
+ }
+ }
+
+ // Set targets
+ $$.updateTargets($$.data.targets);
+
+ // Redraw with new targets
+ $$.redraw({
+ flow: {
+ index: baseValue.index,
+ length: length,
+ duration: isValue(args.duration) ? args.duration : $$.config.transition_duration,
+ done: args.done,
+ orgDataCount: orgDataCount,
+ },
+ withLegend: true,
+ withTransition: orgDataCount > 1,
+ withTrimXDomain: false,
+ withUpdateXAxis: true,
+ });
+ };
+
+ c3_chart_internal_fn.generateFlow = function (args) {
+ var $$ = this, config = $$.config, d3 = $$.d3;
+
+ return function () {
+ var targets = args.targets,
+ flow = args.flow,
+ drawBar = args.drawBar,
+ drawLine = args.drawLine,
+ drawArea = args.drawArea,
+ cx = args.cx,
+ cy = args.cy,
+ xv = args.xv,
+ xForText = args.xForText,
+ yForText = args.yForText,
+ duration = args.duration;
+
+ var translateX, scaleX = 1, transform,
+ flowIndex = flow.index,
+ flowLength = flow.length,
+ flowStart = $$.getValueOnIndex($$.data.targets[0].values, flowIndex),
+ flowEnd = $$.getValueOnIndex($$.data.targets[0].values, flowIndex + flowLength),
+ orgDomain = $$.x.domain(), domain,
+ durationForFlow = flow.duration || duration,
+ done = flow.done || function () {},
+ wait = $$.generateWait();
+
+ var xgrid = $$.xgrid || d3.selectAll([]),
+ xgridLines = $$.xgridLines || d3.selectAll([]),
+ mainRegion = $$.mainRegion || d3.selectAll([]),
+ mainText = $$.mainText || d3.selectAll([]),
+ mainBar = $$.mainBar || d3.selectAll([]),
+ mainLine = $$.mainLine || d3.selectAll([]),
+ mainArea = $$.mainArea || d3.selectAll([]),
+ mainCircle = $$.mainCircle || d3.selectAll([]);
+
+ // set flag
+ $$.flowing = true;
+
+ // remove head data after rendered
+ $$.data.targets.forEach(function (d) {
+ d.values.splice(0, flowLength);
+ });
+
+ // update x domain to generate axis elements for flow
+ domain = $$.updateXDomain(targets, true, true);
+ // update elements related to x scale
+ if ($$.updateXGrid) { $$.updateXGrid(true); }
+
+ // generate transform to flow
+ if (!flow.orgDataCount) { // if empty
+ if ($$.data.targets[0].values.length !== 1) {
+ translateX = $$.x(orgDomain[0]) - $$.x(domain[0]);
+ } else {
+ if ($$.isTimeSeries()) {
+ flowStart = $$.getValueOnIndex($$.data.targets[0].values, 0);
+ flowEnd = $$.getValueOnIndex($$.data.targets[0].values, $$.data.targets[0].values.length - 1);
+ translateX = $$.x(flowStart.x) - $$.x(flowEnd.x);
+ } else {
+ translateX = diffDomain(domain) / 2;
+ }
+ }
+ } else if (flow.orgDataCount === 1 || flowStart.x === flowEnd.x) {
+ translateX = $$.x(orgDomain[0]) - $$.x(domain[0]);
+ } else {
+ if ($$.isTimeSeries()) {
+ translateX = ($$.x(orgDomain[0]) - $$.x(domain[0]));
+ } else {
+ translateX = ($$.x(flowStart.x) - $$.x(flowEnd.x));
+ }
+ }
+ scaleX = (diffDomain(orgDomain) / diffDomain(domain));
+ transform = 'translate(' + translateX + ',0) scale(' + scaleX + ',1)';
+
+ $$.hideXGridFocus();
+
+ d3.transition().ease('linear').duration(durationForFlow).each(function () {
+ wait.add($$.axes.x.transition().call($$.xAxis));
+ wait.add(mainBar.transition().attr('transform', transform));
+ wait.add(mainLine.transition().attr('transform', transform));
+ wait.add(mainArea.transition().attr('transform', transform));
+ wait.add(mainCircle.transition().attr('transform', transform));
+ wait.add(mainText.transition().attr('transform', transform));
+ wait.add(mainRegion.filter($$.isRegionOnX).transition().attr('transform', transform));
+ wait.add(xgrid.transition().attr('transform', transform));
+ wait.add(xgridLines.transition().attr('transform', transform));
+ })
+ .call(wait, function () {
+ var i, shapes = [], texts = [], eventRects = [];
+
+ // remove flowed elements
+ if (flowLength) {
+ for (i = 0; i < flowLength; i++) {
+ shapes.push('.' + CLASS.shape + '-' + (flowIndex + i));
+ texts.push('.' + CLASS.text + '-' + (flowIndex + i));
+ eventRects.push('.' + CLASS.eventRect + '-' + (flowIndex + i));
+ }
+ $$.svg.selectAll('.' + CLASS.shapes).selectAll(shapes).remove();
+ $$.svg.selectAll('.' + CLASS.texts).selectAll(texts).remove();
+ $$.svg.selectAll('.' + CLASS.eventRects).selectAll(eventRects).remove();
+ $$.svg.select('.' + CLASS.xgrid).remove();
+ }
+
+ // draw again for removing flowed elements and reverting attr
+ xgrid
+ .attr('transform', null)
+ .attr($$.xgridAttr);
+ xgridLines
+ .attr('transform', null);
+ xgridLines.select('line')
+ .attr("x1", config.axis_rotated ? 0 : xv)
+ .attr("x2", config.axis_rotated ? $$.width : xv);
+ xgridLines.select('text')
+ .attr("x", config.axis_rotated ? $$.width : 0)
+ .attr("y", xv);
+ mainBar
+ .attr('transform', null)
+ .attr("d", drawBar);
+ mainLine
+ .attr('transform', null)
+ .attr("d", drawLine);
+ mainArea
+ .attr('transform', null)
+ .attr("d", drawArea);
+ mainCircle
+ .attr('transform', null)
+ .attr("cx", cx)
+ .attr("cy", cy);
+ mainText
+ .attr('transform', null)
+ .attr('x', xForText)
+ .attr('y', yForText)
+ .style('fill-opacity', $$.opacityForText.bind($$));
+ mainRegion
+ .attr('transform', null);
+ mainRegion.select('rect').filter($$.isRegionOnX)
+ .attr("x", $$.regionX.bind($$))
+ .attr("width", $$.regionWidth.bind($$));
+
+ if (config.interaction_enabled) {
+ $$.redrawEventRect();
+ }
+
+ // callback for end of flow
+ done();
+
+ $$.flowing = false;
+ });
+ };
+ };
+
+ c3_chart_fn.selected = function (targetId) {
+ var $$ = this.internal, d3 = $$.d3;
+ return d3.merge(
+ $$.main.selectAll('.' + CLASS.shapes + $$.getTargetSelectorSuffix(targetId)).selectAll('.' + CLASS.shape)
+ .filter(function () { return d3.select(this).classed(CLASS.SELECTED); })
+ .map(function (d) { return d.map(function (d) { var data = d.__data__; return data.data ? data.data : data; }); })
+ );
+ };
+ c3_chart_fn.select = function (ids, indices, resetOther) {
+ var $$ = this.internal, d3 = $$.d3, config = $$.config;
+ if (! config.data_selection_enabled) { return; }
+ $$.main.selectAll('.' + CLASS.shapes).selectAll('.' + CLASS.shape).each(function (d, i) {
+ var shape = d3.select(this), id = d.data ? d.data.id : d.id,
+ toggle = $$.getToggle(this, d).bind($$),
+ isTargetId = config.data_selection_grouped || !ids || ids.indexOf(id) >= 0,
+ isTargetIndex = !indices || indices.indexOf(i) >= 0,
+ isSelected = shape.classed(CLASS.SELECTED);
+ // line/area selection not supported yet
+ if (shape.classed(CLASS.line) || shape.classed(CLASS.area)) {
+ return;
+ }
+ if (isTargetId && isTargetIndex) {
+ if (config.data_selection_isselectable(d) && !isSelected) {
+ toggle(true, shape.classed(CLASS.SELECTED, true), d, i);
+ }
+ } else if (isDefined(resetOther) && resetOther) {
+ if (isSelected) {
+ toggle(false, shape.classed(CLASS.SELECTED, false), d, i);
+ }
+ }
+ });
+ };
+ c3_chart_fn.unselect = function (ids, indices) {
+ var $$ = this.internal, d3 = $$.d3, config = $$.config;
+ if (! config.data_selection_enabled) { return; }
+ $$.main.selectAll('.' + CLASS.shapes).selectAll('.' + CLASS.shape).each(function (d, i) {
+ var shape = d3.select(this), id = d.data ? d.data.id : d.id,
+ toggle = $$.getToggle(this, d).bind($$),
+ isTargetId = config.data_selection_grouped || !ids || ids.indexOf(id) >= 0,
+ isTargetIndex = !indices || indices.indexOf(i) >= 0,
+ isSelected = shape.classed(CLASS.SELECTED);
+ // line/area selection not supported yet
+ if (shape.classed(CLASS.line) || shape.classed(CLASS.area)) {
+ return;
+ }
+ if (isTargetId && isTargetIndex) {
+ if (config.data_selection_isselectable(d)) {
+ if (isSelected) {
+ toggle(false, shape.classed(CLASS.SELECTED, false), d, i);
+ }
+ }
+ }
+ });
+ };
+
+ c3_chart_fn.transform = function (type, targetIds) {
+ var $$ = this.internal,
+ options = ['pie', 'donut'].indexOf(type) >= 0 ? {withTransform: true} : null;
+ $$.transformTo(targetIds, type, options);
+ };
+
+ c3_chart_internal_fn.transformTo = function (targetIds, type, optionsForRedraw) {
+ var $$ = this,
+ withTransitionForAxis = !$$.hasArcType(),
+ options = optionsForRedraw || {withTransitionForAxis: withTransitionForAxis};
+ options.withTransitionForTransform = false;
+ $$.transiting = false;
+ $$.setTargetType(targetIds, type);
+ $$.updateTargets($$.data.targets); // this is needed when transforming to arc
+ $$.updateAndRedraw(options);
+ };
+
+ c3_chart_fn.groups = function (groups) {
+ var $$ = this.internal, config = $$.config;
+ if (isUndefined(groups)) { return config.data_groups; }
+ config.data_groups = groups;
+ $$.redraw();
+ return config.data_groups;
+ };
+
+ c3_chart_fn.xgrids = function (grids) {
+ var $$ = this.internal, config = $$.config;
+ if (! grids) { return config.grid_x_lines; }
+ config.grid_x_lines = grids;
+ $$.redrawWithoutRescale();
+ return config.grid_x_lines;
+ };
+ c3_chart_fn.xgrids.add = function (grids) {
+ var $$ = this.internal;
+ return this.xgrids($$.config.grid_x_lines.concat(grids ? grids : []));
+ };
+ c3_chart_fn.xgrids.remove = function (params) { // TODO: multiple
+ var $$ = this.internal;
+ $$.removeGridLines(params, true);
+ };
+
+ c3_chart_fn.ygrids = function (grids) {
+ var $$ = this.internal, config = $$.config;
+ if (! grids) { return config.grid_y_lines; }
+ config.grid_y_lines = grids;
+ $$.redrawWithoutRescale();
+ return config.grid_y_lines;
+ };
+ c3_chart_fn.ygrids.add = function (grids) {
+ var $$ = this.internal;
+ return this.ygrids($$.config.grid_y_lines.concat(grids ? grids : []));
+ };
+ c3_chart_fn.ygrids.remove = function (params) { // TODO: multiple
+ var $$ = this.internal;
+ $$.removeGridLines(params, false);
+ };
+
+ c3_chart_fn.regions = function (regions) {
+ var $$ = this.internal, config = $$.config;
+ if (!regions) { return config.regions; }
+ config.regions = regions;
+ $$.redrawWithoutRescale();
+ return config.regions;
+ };
+ c3_chart_fn.regions.add = function (regions) {
+ var $$ = this.internal, config = $$.config;
+ if (!regions) { return config.regions; }
+ config.regions = config.regions.concat(regions);
+ $$.redrawWithoutRescale();
+ return config.regions;
+ };
+ c3_chart_fn.regions.remove = function (options) {
+ var $$ = this.internal, config = $$.config,
+ duration, classes, regions;
+
+ options = options || {};
+ duration = $$.getOption(options, "duration", config.transition_duration);
+ classes = $$.getOption(options, "classes", [CLASS.region]);
+
+ regions = $$.main.select('.' + CLASS.regions).selectAll(classes.map(function (c) { return '.' + c; }));
+ (duration ? regions.transition().duration(duration) : regions)
+ .style('opacity', 0)
+ .remove();
+
+ config.regions = config.regions.filter(function (region) {
+ var found = false;
+ if (!region['class']) {
+ return true;
+ }
+ region['class'].split(' ').forEach(function (c) {
+ if (classes.indexOf(c) >= 0) { found = true; }
+ });
+ return !found;
+ });
+
+ return config.regions;
+ };
+
+ c3_chart_fn.data = function (targetIds) {
+ var targets = this.internal.data.targets;
+ return typeof targetIds === 'undefined' ? targets : targets.filter(function (t) {
+ return [].concat(targetIds).indexOf(t.id) >= 0;
+ });
+ };
+ c3_chart_fn.data.shown = function (targetIds) {
+ return this.internal.filterTargetsToShow(this.data(targetIds));
+ };
+ c3_chart_fn.data.values = function (targetId) {
+ var targets, values = null;
+ if (targetId) {
+ targets = this.data(targetId);
+ values = targets[0] ? targets[0].values.map(function (d) { return d.value; }) : null;
+ }
+ return values;
+ };
+ c3_chart_fn.data.names = function (names) {
+ this.internal.clearLegendItemTextBoxCache();
+ return this.internal.updateDataAttributes('names', names);
+ };
+ c3_chart_fn.data.colors = function (colors) {
+ return this.internal.updateDataAttributes('colors', colors);
+ };
+ c3_chart_fn.data.axes = function (axes) {
+ return this.internal.updateDataAttributes('axes', axes);
+ };
+
+ c3_chart_fn.category = function (i, category) {
+ var $$ = this.internal, config = $$.config;
+ if (arguments.length > 1) {
+ config.axis_x_categories[i] = category;
+ $$.redraw();
+ }
+ return config.axis_x_categories[i];
+ };
+ c3_chart_fn.categories = function (categories) {
+ var $$ = this.internal, config = $$.config;
+ if (!arguments.length) { return config.axis_x_categories; }
+ config.axis_x_categories = categories;
+ $$.redraw();
+ return config.axis_x_categories;
+ };
+
+ // TODO: fix
+ c3_chart_fn.color = function (id) {
+ var $$ = this.internal;
+ return $$.color(id); // more patterns
+ };
+
+ c3_chart_fn.x = function (x) {
+ var $$ = this.internal;
+ if (arguments.length) {
+ $$.updateTargetX($$.data.targets, x);
+ $$.redraw({withUpdateOrgXDomain: true, withUpdateXDomain: true});
+ }
+ return $$.data.xs;
+ };
+ c3_chart_fn.xs = function (xs) {
+ var $$ = this.internal;
+ if (arguments.length) {
+ $$.updateTargetXs($$.data.targets, xs);
+ $$.redraw({withUpdateOrgXDomain: true, withUpdateXDomain: true});
+ }
+ return $$.data.xs;
+ };
+
+ c3_chart_fn.axis = function () {};
+ c3_chart_fn.axis.labels = function (labels) {
+ var $$ = this.internal;
+ if (arguments.length) {
+ Object.keys(labels).forEach(function (axisId) {
+ $$.axis.setLabelText(axisId, labels[axisId]);
+ });
+ $$.axis.updateLabels();
+ }
+ // TODO: return some values?
+ };
+ c3_chart_fn.axis.max = function (max) {
+ var $$ = this.internal, config = $$.config;
+ if (arguments.length) {
+ if (typeof max === 'object') {
+ if (isValue(max.x)) { config.axis_x_max = max.x; }
+ if (isValue(max.y)) { config.axis_y_max = max.y; }
+ if (isValue(max.y2)) { config.axis_y2_max = max.y2; }
+ } else {
+ config.axis_y_max = config.axis_y2_max = max;
+ }
+ $$.redraw({withUpdateOrgXDomain: true, withUpdateXDomain: true});
+ } else {
+ return {
+ x: config.axis_x_max,
+ y: config.axis_y_max,
+ y2: config.axis_y2_max
+ };
+ }
+ };
+ c3_chart_fn.axis.min = function (min) {
+ var $$ = this.internal, config = $$.config;
+ if (arguments.length) {
+ if (typeof min === 'object') {
+ if (isValue(min.x)) { config.axis_x_min = min.x; }
+ if (isValue(min.y)) { config.axis_y_min = min.y; }
+ if (isValue(min.y2)) { config.axis_y2_min = min.y2; }
+ } else {
+ config.axis_y_min = config.axis_y2_min = min;
+ }
+ $$.redraw({withUpdateOrgXDomain: true, withUpdateXDomain: true});
+ } else {
+ return {
+ x: config.axis_x_min,
+ y: config.axis_y_min,
+ y2: config.axis_y2_min
+ };
+ }
+ };
+ c3_chart_fn.axis.range = function (range) {
+ if (arguments.length) {
+ if (isDefined(range.max)) { this.axis.max(range.max); }
+ if (isDefined(range.min)) { this.axis.min(range.min); }
+ } else {
+ return {
+ max: this.axis.max(),
+ min: this.axis.min()
+ };
+ }
+ };
+
+ c3_chart_fn.legend = function () {};
+ c3_chart_fn.legend.show = function (targetIds) {
+ var $$ = this.internal;
+ $$.showLegend($$.mapToTargetIds(targetIds));
+ $$.updateAndRedraw({withLegend: true});
+ };
+ c3_chart_fn.legend.hide = function (targetIds) {
+ var $$ = this.internal;
+ $$.hideLegend($$.mapToTargetIds(targetIds));
+ $$.updateAndRedraw({withLegend: true});
+ };
+
+ c3_chart_fn.resize = function (size) {
+ var $$ = this.internal, config = $$.config;
+ config.size_width = size ? size.width : null;
+ config.size_height = size ? size.height : null;
+ this.flush();
+ };
+
+ c3_chart_fn.flush = function () {
+ var $$ = this.internal;
+ $$.updateAndRedraw({withLegend: true, withTransition: false, withTransitionForTransform: false});
+ };
+
+ c3_chart_fn.destroy = function () {
+ var $$ = this.internal;
+
+ window.clearInterval($$.intervalForObserveInserted);
+
+ if ($$.resizeTimeout !== undefined) {
+ window.clearTimeout($$.resizeTimeout);
+ }
+
+ if (window.detachEvent) {
+ window.detachEvent('onresize', $$.resizeFunction);
+ } else if (window.removeEventListener) {
+ window.removeEventListener('resize', $$.resizeFunction);
+ } else {
+ var wrapper = window.onresize;
+ // check if no one else removed our wrapper and remove our resizeFunction from it
+ if (wrapper && wrapper.add && wrapper.remove) {
+ wrapper.remove($$.resizeFunction);
+ }
+ }
+
+ $$.selectChart.classed('c3', false).html("");
+
+ // MEMO: this is needed because the reference of some elements will not be released, then memory leak will happen.
+ Object.keys($$).forEach(function (key) {
+ $$[key] = null;
+ });
+
+ return null;
+ };
+
+ c3_chart_fn.tooltip = function () {};
+ c3_chart_fn.tooltip.show = function (args) {
+ var $$ = this.internal, index, mouse;
+
+ // determine mouse position on the chart
+ if (args.mouse) {
+ mouse = args.mouse;
+ }
+
+ // determine focus data
+ if (args.data) {
+ if ($$.isMultipleX()) {
+ // if multiple xs, target point will be determined by mouse
+ mouse = [$$.x(args.data.x), $$.getYScale(args.data.id)(args.data.value)];
+ index = null;
+ } else {
+ // TODO: when tooltip_grouped = false
+ index = isValue(args.data.index) ? args.data.index : $$.getIndexByX(args.data.x);
+ }
+ }
+ else if (typeof args.x !== 'undefined') {
+ index = $$.getIndexByX(args.x);
+ }
+ else if (typeof args.index !== 'undefined') {
+ index = args.index;
+ }
+
+ // emulate mouse events to show
+ $$.dispatchEvent('mouseover', index, mouse);
+ $$.dispatchEvent('mousemove', index, mouse);
+
+ $$.config.tooltip_onshow.call($$, args.data);
+ };
+ c3_chart_fn.tooltip.hide = function () {
+ // TODO: get target data by checking the state of focus
+ this.internal.dispatchEvent('mouseout', 0);
+
+ this.internal.config.tooltip_onhide.call(this);
+ };
+
+ // Features:
+ // 1. category axis
+ // 2. ceil values of translate/x/y to int for half pixel antialiasing
+ // 3. multiline tick text
+ var tickTextCharSize;
+ function c3_axis(d3, params) {
+ var scale = d3.scale.linear(), orient = "bottom", innerTickSize = 6, outerTickSize, tickPadding = 3, tickValues = null, tickFormat, tickArguments;
+
+ var tickOffset = 0, tickCulling = true, tickCentered;
+
+ params = params || {};
+ outerTickSize = params.withOuterTick ? 6 : 0;
+
+ function axisX(selection, x) {
+ selection.attr("transform", function (d) {
+ return "translate(" + Math.ceil(x(d) + tickOffset) + ", 0)";
+ });
+ }
+ function axisY(selection, y) {
+ selection.attr("transform", function (d) {
+ return "translate(0," + Math.ceil(y(d)) + ")";
+ });
+ }
+ function scaleExtent(domain) {
+ var start = domain[0], stop = domain[domain.length - 1];
+ return start < stop ? [ start, stop ] : [ stop, start ];
+ }
+ function generateTicks(scale) {
+ var i, domain, ticks = [];
+ if (scale.ticks) {
+ return scale.ticks.apply(scale, tickArguments);
+ }
+ domain = scale.domain();
+ for (i = Math.ceil(domain[0]); i < domain[1]; i++) {
+ ticks.push(i);
+ }
+ if (ticks.length > 0 && ticks[0] > 0) {
+ ticks.unshift(ticks[0] - (ticks[1] - ticks[0]));
+ }
+ return ticks;
+ }
+ function copyScale() {
+ var newScale = scale.copy(), domain;
+ if (params.isCategory) {
+ domain = scale.domain();
+ newScale.domain([domain[0], domain[1] - 1]);
+ }
+ return newScale;
+ }
+ function textFormatted(v) {
+ var formatted = tickFormat ? tickFormat(v) : v;
+ return typeof formatted !== 'undefined' ? formatted : '';
+ }
+ function getSizeFor1Char(tick) {
+ if (tickTextCharSize) {
+ return tickTextCharSize;
+ }
+ var size = {
+ h: 11.5,
+ w: 5.5
+ };
+ tick.select('text').text(textFormatted).each(function (d) {
+ var box = this.getBoundingClientRect(),
+ text = textFormatted(d),
+ h = box.height,
+ w = text ? (box.width / text.length) : undefined;
+ if (h && w) {
+ size.h = h;
+ size.w = w;
+ }
+ }).text('');
+ tickTextCharSize = size;
+ return size;
+ }
+ function transitionise(selection) {
+ return params.withoutTransition ? selection : d3.transition(selection);
+ }
+ function axis(g) {
+ g.each(function () {
+ var g = axis.g = d3.select(this);
+
+ var scale0 = this.__chart__ || scale, scale1 = this.__chart__ = copyScale();
+
+ var ticks = tickValues ? tickValues : generateTicks(scale1),
+ tick = g.selectAll(".tick").data(ticks, scale1),
+ tickEnter = tick.enter().insert("g", ".domain").attr("class", "tick").style("opacity", 1e-6),
+ // MEMO: No exit transition. The reason is this transition affects max tick width calculation because old tick will be included in the ticks.
+ tickExit = tick.exit().remove(),
+ tickUpdate = transitionise(tick).style("opacity", 1),
+ tickTransform, tickX, tickY;
+
+ var range = scale.rangeExtent ? scale.rangeExtent() : scaleExtent(scale.range()),
+ path = g.selectAll(".domain").data([ 0 ]),
+ pathUpdate = (path.enter().append("path").attr("class", "domain"), transitionise(path));
+ tickEnter.append("line");
+ tickEnter.append("text");
+
+ var lineEnter = tickEnter.select("line"),
+ lineUpdate = tickUpdate.select("line"),
+ textEnter = tickEnter.select("text"),
+ textUpdate = tickUpdate.select("text");
+
+ if (params.isCategory) {
+ tickOffset = Math.ceil((scale1(1) - scale1(0)) / 2);
+ tickX = tickCentered ? 0 : tickOffset;
+ tickY = tickCentered ? tickOffset : 0;
+ } else {
+ tickOffset = tickX = 0;
+ }
+
+ var text, tspan, sizeFor1Char = getSizeFor1Char(g.select('.tick')), counts = [];
+ var tickLength = Math.max(innerTickSize, 0) + tickPadding,
+ isVertical = orient === 'left' || orient === 'right';
+
+ // this should be called only when category axis
+ function splitTickText(d, maxWidth) {
+ var tickText = textFormatted(d),
+ subtext, spaceIndex, textWidth, splitted = [];
+
+ if (Object.prototype.toString.call(tickText) === "[object Array]") {
+ return tickText;
+ }
+
+ if (!maxWidth || maxWidth <= 0) {
+ maxWidth = isVertical ? 95 : params.isCategory ? (Math.ceil(scale1(ticks[1]) - scale1(ticks[0])) - 12) : 110;
+ }
+
+ function split(splitted, text) {
+ spaceIndex = undefined;
+ for (var i = 1; i < text.length; i++) {
+ if (text.charAt(i) === ' ') {
+ spaceIndex = i;
+ }
+ subtext = text.substr(0, i + 1);
+ textWidth = sizeFor1Char.w * subtext.length;
+ // if text width gets over tick width, split by space index or crrent index
+ if (maxWidth < textWidth) {
+ return split(
+ splitted.concat(text.substr(0, spaceIndex ? spaceIndex : i)),
+ text.slice(spaceIndex ? spaceIndex + 1 : i)
+ );
+ }
+ }
+ return splitted.concat(text);
+ }
+
+ return split(splitted, tickText + "");
+ }
+
+ function tspanDy(d, i) {
+ var dy = sizeFor1Char.h;
+ if (i === 0) {
+ if (orient === 'left' || orient === 'right') {
+ dy = -((counts[d.index] - 1) * (sizeFor1Char.h / 2) - 3);
+ } else {
+ dy = ".71em";
+ }
+ }
+ return dy;
+ }
+
+ function tickSize(d) {
+ var tickPosition = scale(d) + (tickCentered ? 0 : tickOffset);
+ return range[0] < tickPosition && tickPosition < range[1] ? innerTickSize : 0;
+ }
+
+ text = tick.select("text");
+ tspan = text.selectAll('tspan')
+ .data(function (d, i) {
+ var splitted = params.tickMultiline ? splitTickText(d, params.tickWidth) : [].concat(textFormatted(d));
+ counts[i] = splitted.length;
+ return splitted.map(function (s) {
+ return { index: i, splitted: s };
+ });
+ });
+ tspan.enter().append('tspan');
+ tspan.exit().remove();
+ tspan.text(function (d) { return d.splitted; });
+
+ var rotate = params.tickTextRotate;
+
+ function textAnchorForText(rotate) {
+ if (!rotate) {
+ return 'middle';
+ }
+ return rotate > 0 ? "start" : "end";
+ }
+ function textTransform(rotate) {
+ if (!rotate) {
+ return '';
+ }
+ return "rotate(" + rotate + ")";
+ }
+ function dxForText(rotate) {
+ if (!rotate) {
+ return 0;
+ }
+ return 8 * Math.sin(Math.PI * (rotate / 180));
+ }
+ function yForText(rotate) {
+ if (!rotate) {
+ return tickLength;
+ }
+ return 11.5 - 2.5 * (rotate / 15) * (rotate > 0 ? 1 : -1);
+ }
+
+ switch (orient) {
+ case "bottom":
+ {
+ tickTransform = axisX;
+ lineEnter.attr("y2", innerTickSize);
+ textEnter.attr("y", tickLength);
+ lineUpdate.attr("x1", tickX).attr("x2", tickX).attr("y2", tickSize);
+ textUpdate.attr("x", 0).attr("y", yForText(rotate))
+ .style("text-anchor", textAnchorForText(rotate))
+ .attr("transform", textTransform(rotate));
+ tspan.attr('x', 0).attr("dy", tspanDy).attr('dx', dxForText(rotate));
+ pathUpdate.attr("d", "M" + range[0] + "," + outerTickSize + "V0H" + range[1] + "V" + outerTickSize);
+ break;
+ }
+ case "top":
+ {
+ // TODO: rotated tick text
+ tickTransform = axisX;
+ lineEnter.attr("y2", -innerTickSize);
+ textEnter.attr("y", -tickLength);
+ lineUpdate.attr("x2", 0).attr("y2", -innerTickSize);
+ textUpdate.attr("x", 0).attr("y", -tickLength);
+ text.style("text-anchor", "middle");
+ tspan.attr('x', 0).attr("dy", "0em");
+ pathUpdate.attr("d", "M" + range[0] + "," + -outerTickSize + "V0H" + range[1] + "V" + -outerTickSize);
+ break;
+ }
+ case "left":
+ {
+ tickTransform = axisY;
+ lineEnter.attr("x2", -innerTickSize);
+ textEnter.attr("x", -tickLength);
+ lineUpdate.attr("x2", -innerTickSize).attr("y1", tickY).attr("y2", tickY);
+ textUpdate.attr("x", -tickLength).attr("y", tickOffset);
+ text.style("text-anchor", "end");
+ tspan.attr('x', -tickLength).attr("dy", tspanDy);
+ pathUpdate.attr("d", "M" + -outerTickSize + "," + range[0] + "H0V" + range[1] + "H" + -outerTickSize);
+ break;
+ }
+ case "right":
+ {
+ tickTransform = axisY;
+ lineEnter.attr("x2", innerTickSize);
+ textEnter.attr("x", tickLength);
+ lineUpdate.attr("x2", innerTickSize).attr("y2", 0);
+ textUpdate.attr("x", tickLength).attr("y", 0);
+ text.style("text-anchor", "start");
+ tspan.attr('x', tickLength).attr("dy", tspanDy);
+ pathUpdate.attr("d", "M" + outerTickSize + "," + range[0] + "H0V" + range[1] + "H" + outerTickSize);
+ break;
+ }
+ }
+ if (scale1.rangeBand) {
+ var x = scale1, dx = x.rangeBand() / 2;
+ scale0 = scale1 = function (d) {
+ return x(d) + dx;
+ };
+ } else if (scale0.rangeBand) {
+ scale0 = scale1;
+ } else {
+ tickExit.call(tickTransform, scale1);
+ }
+ tickEnter.call(tickTransform, scale0);
+ tickUpdate.call(tickTransform, scale1);
+ });
+ }
+ axis.scale = function (x) {
+ if (!arguments.length) { return scale; }
+ scale = x;
+ return axis;
+ };
+ axis.orient = function (x) {
+ if (!arguments.length) { return orient; }
+ orient = x in {top: 1, right: 1, bottom: 1, left: 1} ? x + "" : "bottom";
+ return axis;
+ };
+ axis.tickFormat = function (format) {
+ if (!arguments.length) { return tickFormat; }
+ tickFormat = format;
+ return axis;
+ };
+ axis.tickCentered = function (isCentered) {
+ if (!arguments.length) { return tickCentered; }
+ tickCentered = isCentered;
+ return axis;
+ };
+ axis.tickOffset = function () {
+ return tickOffset;
+ };
+ axis.tickInterval = function () {
+ var interval, length;
+ if (params.isCategory) {
+ interval = tickOffset * 2;
+ }
+ else {
+ length = axis.g.select('path.domain').node().getTotalLength() - outerTickSize * 2;
+ interval = length / axis.g.selectAll('line').size();
+ }
+ return interval === Infinity ? 0 : interval;
+ };
+ axis.ticks = function () {
+ if (!arguments.length) { return tickArguments; }
+ tickArguments = arguments;
+ return axis;
+ };
+ axis.tickCulling = function (culling) {
+ if (!arguments.length) { return tickCulling; }
+ tickCulling = culling;
+ return axis;
+ };
+ axis.tickValues = function (x) {
+ if (typeof x === 'function') {
+ tickValues = function () {
+ return x(scale.domain());
+ };
+ }
+ else {
+ if (!arguments.length) { return tickValues; }
+ tickValues = x;
+ }
+ return axis;
+ };
+ return axis;
+ }
+
+ c3_chart_internal_fn.isSafari = function () {
+ var ua = window.navigator.userAgent;
+ return ua.indexOf('Safari') >= 0 && ua.indexOf('Chrome') < 0;
+ };
+ c3_chart_internal_fn.isChrome = function () {
+ var ua = window.navigator.userAgent;
+ return ua.indexOf('Chrome') >= 0;
+ };
+
+ // PhantomJS doesn't have support for Function.prototype.bind, which has caused confusion. Use
+ // this polyfill to avoid the confusion.
+ // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind#Polyfill
+
+ if (!Function.prototype.bind) {
+ Function.prototype.bind = function(oThis) {
+ if (typeof this !== 'function') {
+ // closest thing possible to the ECMAScript 5
+ // internal IsCallable function
+ throw new TypeError('Function.prototype.bind - what is trying to be bound is not callable');
+ }
+
+ var aArgs = Array.prototype.slice.call(arguments, 1),
+ fToBind = this,
+ fNOP = function() {},
+ fBound = function() {
+ return fToBind.apply(this instanceof fNOP ? this : oThis, aArgs.concat(Array.prototype.slice.call(arguments)));
+ };
+
+ fNOP.prototype = this.prototype;
+ fBound.prototype = new fNOP();
+
+ return fBound;
+ };
+ }
+
+ if (typeof define === 'function' && define.amd) {
+ define("c3", ["d3"], function () { return c3; });
+ } else if ('undefined' !== typeof exports && 'undefined' !== typeof module) {
+ module.exports = c3;
+ } else {
+ window.c3 = c3;
+ }
+
+})(window);
diff --git a/debian/missing-sources/dygraph-combined.js b/debian/missing-sources/dygraph-combined.js
new file mode 100644
index 00000000..5316fe49
--- /dev/null
+++ b/debian/missing-sources/dygraph-combined.js
@@ -0,0 +1,11219 @@
+/*! @license Copyright 2014 Dan Vanderkam (danvdk@gmail.com) MIT-licensed (http://opensource.org/licenses/MIT) */
+// Console-polyfill. MIT license.
+// https://github.com/paulmillr/console-polyfill
+// Make it safe to do console.log() always.
+(function(con) {
+ 'use strict';
+ var prop, method;
+ var empty = {};
+ var dummy = function() {};
+ var properties = 'memory'.split(',');
+ var methods = ('assert,clear,count,debug,dir,dirxml,error,exception,group,' +
+ 'groupCollapsed,groupEnd,info,log,markTimeline,profile,profiles,profileEnd,' +
+ 'show,table,time,timeEnd,timeline,timelineEnd,timeStamp,trace,warn').split(',');
+ while (prop = properties.pop()) con[prop] = con[prop] || empty;
+ while (method = methods.pop()) con[method] = con[method] || dummy;
+})(this.console = this.console || {}); // Using `this` for web workers.
+/**
+ * @license
+ * Copyright 2012 Dan Vanderkam (danvdk@gmail.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+
+(function() {
+'use strict';
+
+/**
+ * @fileoverview Adds support for dashed lines to the HTML5 canvas.
+ *
+ * Usage:
+ * var ctx = canvas.getContext("2d");
+ * ctx.installPattern([10, 5]) // draw 10 pixels, skip 5 pixels, repeat.
+ * ctx.beginPath();
+ * ctx.moveTo(100, 100); // start the first line segment.
+ * ctx.lineTo(150, 200);
+ * ctx.lineTo(200, 100);
+ * ctx.moveTo(300, 150); // start a second, unconnected line
+ * ctx.lineTo(400, 250);
+ * ...
+ * ctx.stroke(); // draw the dashed line.
+ * ctx.uninstallPattern();
+ *
+ * This is designed to leave the canvas untouched when it's not used.
+ * If you never install a pattern, or call uninstallPattern(), then the canvas
+ * will be exactly as it would have if you'd never used this library. The only
+ * difference from the standard canvas will be the "installPattern" method of
+ * the drawing context.
+ */
+
+/**
+ * Change the stroking style of the canvas drawing context from a solid line to
+ * a pattern (e.g. dashes, dash-dot-dash, etc.)
+ *
+ * Once you've installed the pattern, you can draw with it by using the
+ * beginPath(), moveTo(), lineTo() and stroke() method calls. Note that some
+ * more advanced methods (e.g. quadraticCurveTo() and bezierCurveTo()) are not
+ * supported. See file overview for a working example.
+ *
+ * Side effects of calling this method include adding an "isPatternInstalled"
+ * property and "uninstallPattern" method to this particular canvas context.
+ * You must call uninstallPattern() before calling installPattern() again.
+ *
+ * @param {Array.<number>} pattern A description of the stroke pattern. Even
+ * indices indicate a draw and odd indices indicate a gap (in pixels). The
+ * array should have a even length as any odd lengthed array could be expressed
+ * as a smaller even length array.
+ */
+CanvasRenderingContext2D.prototype.installPattern = function(pattern) {
+ if (typeof(this.isPatternInstalled) !== 'undefined') {
+ throw "Must un-install old line pattern before installing a new one.";
+ }
+ this.isPatternInstalled = true;
+
+ var dashedLineToHistory = [0, 0];
+
+ // list of connected line segements:
+ // [ [x1, y1], ..., [xn, yn] ], [ [x1, y1], ..., [xn, yn] ]
+ var segments = [];
+
+ // Stash away copies of the unmodified line-drawing functions.
+ var realBeginPath = this.beginPath;
+ var realLineTo = this.lineTo;
+ var realMoveTo = this.moveTo;
+ var realStroke = this.stroke;
+
+ /** @type {function()|undefined} */
+ this.uninstallPattern = function() {
+ this.beginPath = realBeginPath;
+ this.lineTo = realLineTo;
+ this.moveTo = realMoveTo;
+ this.stroke = realStroke;
+ this.uninstallPattern = undefined;
+ this.isPatternInstalled = undefined;
+ };
+
+ // Keep our own copies of the line segments as they're drawn.
+ this.beginPath = function() {
+ segments = [];
+ realBeginPath.call(this);
+ };
+ this.moveTo = function(x, y) {
+ segments.push([[x, y]]);
+ realMoveTo.call(this, x, y);
+ };
+ this.lineTo = function(x, y) {
+ var last = segments[segments.length - 1];
+ last.push([x, y]);
+ };
+
+ this.stroke = function() {
+ if (segments.length === 0) {
+ // Maybe the user is drawing something other than a line.
+ // TODO(danvk): test this case.
+ realStroke.call(this);
+ return;
+ }
+
+ for (var i = 0; i < segments.length; i++) {
+ var seg = segments[i];
+ var x1 = seg[0][0], y1 = seg[0][1];
+ for (var j = 1; j < seg.length; j++) {
+ // Draw a dashed line from (x1, y1) - (x2, y2)
+ var x2 = seg[j][0], y2 = seg[j][1];
+ this.save();
+
+ // Calculate transformation parameters
+ var dx = (x2-x1);
+ var dy = (y2-y1);
+ var len = Math.sqrt(dx*dx + dy*dy);
+ var rot = Math.atan2(dy, dx);
+
+ // Set transformation
+ this.translate(x1, y1);
+ realMoveTo.call(this, 0, 0);
+ this.rotate(rot);
+
+ // Set last pattern index we used for this pattern.
+ var patternIndex = dashedLineToHistory[0];
+ var x = 0;
+ while (len > x) {
+ // Get the length of the pattern segment we are dealing with.
+ var segment = pattern[patternIndex];
+ // If our last draw didn't complete the pattern segment all the way
+ // we will try to finish it. Otherwise we will try to do the whole
+ // segment.
+ if (dashedLineToHistory[1]) {
+ x += dashedLineToHistory[1];
+ } else {
+ x += segment;
+ }
+
+ if (x > len) {
+ // We were unable to complete this pattern index all the way, keep
+ // where we are the history so our next draw continues where we
+ // left off in the pattern.
+ dashedLineToHistory = [patternIndex, x-len];
+ x = len;
+ } else {
+ // We completed this patternIndex, we put in the history that we
+ // are on the beginning of the next segment.
+ dashedLineToHistory = [(patternIndex+1)%pattern.length, 0];
+ }
+
+ // We do a line on a even pattern index and just move on a odd
+ // pattern index. The move is the empty space in the dash.
+ if (patternIndex % 2 === 0) {
+ realLineTo.call(this, x, 0);
+ } else {
+ realMoveTo.call(this, x, 0);
+ }
+
+ // If we are not done, next loop process the next pattern segment, or
+ // the first segment again if we are at the end of the pattern.
+ patternIndex = (patternIndex+1) % pattern.length;
+ }
+
+ this.restore();
+ x1 = x2;
+ y1 = y2;
+ }
+ }
+ realStroke.call(this);
+ segments = [];
+ };
+};
+
+/**
+ * Removes the previously-installed pattern.
+ * You must call installPattern() before calling this. You can install at most
+ * one pattern at a time--there is no pattern stack.
+ */
+CanvasRenderingContext2D.prototype.uninstallPattern = function() {
+ // This will be replaced by a non-error version when a pattern is installed.
+ throw "Must install a line pattern before uninstalling it.";
+};
+
+})();
+/**
+ * @license
+ * Copyright 2011 Dan Vanderkam (danvdk@gmail.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+
+/**
+ * @fileoverview DygraphOptions is responsible for parsing and returning information about options.
+ *
+ * Still tightly coupled to Dygraphs, we could remove some of that, you know.
+ */
+
+var DygraphOptions = (function() {
+/*jshint strict:false */
+
+// For "production" code, this gets set to false by uglifyjs.
+// Need to define it outside of "use strict", hence the nested IIFEs.
+if (typeof(DEBUG) === 'undefined') DEBUG=true;
+
+return (function() {
+
+// TODO: remove this jshint directive & fix the warnings.
+/*jshint sub:true */
+/*global Dygraph:false */
+"use strict";
+
+/*
+ * Interesting member variables: (REMOVING THIS LIST AS I CLOSURIZE)
+ * global_ - global attributes (common among all graphs, AIUI)
+ * user - attributes set by the user
+ * series_ - { seriesName -> { idx, yAxis, options }}
+ */
+
+/**
+ * This parses attributes into an object that can be easily queried.
+ *
+ * It doesn't necessarily mean that all options are available, specifically
+ * if labels are not yet available, since those drive details of the per-series
+ * and per-axis options.
+ *
+ * @param {Dygraph} dygraph The chart to which these options belong.
+ * @constructor
+ */
+var DygraphOptions = function(dygraph) {
+ /**
+ * The dygraph.
+ * @type {!Dygraph}
+ */
+ this.dygraph_ = dygraph;
+
+ /**
+ * Array of axis index to { series : [ series names ] , options : { axis-specific options. }
+ * @type {Array.<{series : Array.<string>, options : Object}>} @private
+ */
+ this.yAxes_ = [];
+
+ /**
+ * Contains x-axis specific options, which are stored in the options key.
+ * This matches the yAxes_ object structure (by being a dictionary with an
+ * options element) allowing for shared code.
+ * @type {options: Object} @private
+ */
+ this.xAxis_ = {};
+ this.series_ = {};
+
+ // Once these two objects are initialized, you can call get();
+ this.global_ = this.dygraph_.attrs_;
+ this.user_ = this.dygraph_.user_attrs_ || {};
+
+ /**
+ * A list of series in columnar order.
+ * @type {Array.<string>}
+ */
+ this.labels_ = [];
+
+ this.highlightSeries_ = this.get("highlightSeriesOpts") || {};
+ this.reparseSeries();
+};
+
+/**
+ * Not optimal, but does the trick when you're only using two axes.
+ * If we move to more axes, this can just become a function.
+ *
+ * @type {Object.<number>}
+ * @private
+ */
+DygraphOptions.AXIS_STRING_MAPPINGS_ = {
+ 'y' : 0,
+ 'Y' : 0,
+ 'y1' : 0,
+ 'Y1' : 0,
+ 'y2' : 1,
+ 'Y2' : 1
+};
+
+/**
+ * @param {string|number} axis
+ * @private
+ */
+DygraphOptions.axisToIndex_ = function(axis) {
+ if (typeof(axis) == "string") {
+ if (DygraphOptions.AXIS_STRING_MAPPINGS_.hasOwnProperty(axis)) {
+ return DygraphOptions.AXIS_STRING_MAPPINGS_[axis];
+ }
+ throw "Unknown axis : " + axis;
+ }
+ if (typeof(axis) == "number") {
+ if (axis === 0 || axis === 1) {
+ return axis;
+ }
+ throw "Dygraphs only supports two y-axes, indexed from 0-1.";
+ }
+ if (axis) {
+ throw "Unknown axis : " + axis;
+ }
+ // No axis specification means axis 0.
+ return 0;
+};
+
+/**
+ * Reparses options that are all related to series. This typically occurs when
+ * options are either updated, or source data has been made available.
+ *
+ * TODO(konigsberg): The method name is kind of weak; fix.
+ */
+DygraphOptions.prototype.reparseSeries = function() {
+ var labels = this.get("labels");
+ if (!labels) {
+ return; // -- can't do more for now, will parse after getting the labels.
+ }
+
+ this.labels_ = labels.slice(1);
+
+ this.yAxes_ = [ { series : [], options : {}} ]; // Always one axis at least.
+ this.xAxis_ = { options : {} };
+ this.series_ = {};
+
+ // Traditionally, per-series options were specified right up there with the options. For instance
+ // {
+ // labels: [ "X", "foo", "bar" ],
+ // pointSize: 3,
+ // foo : {}, // options for foo
+ // bar : {} // options for bar
+ // }
+ //
+ // Moving forward, series really should be specified in the series element, separating them.
+ // like so:
+ //
+ // {
+ // labels: [ "X", "foo", "bar" ],
+ // pointSize: 3,
+ // series : {
+ // foo : {}, // options for foo
+ // bar : {} // options for bar
+ // }
+ // }
+ //
+ // So, if series is found, it's expected to contain per-series data, otherwise we fall
+ // back.
+ var oldStyleSeries = !this.user_["series"];
+
+ if (oldStyleSeries) {
+ var axisId = 0; // 0-offset; there's always one.
+ // Go through once, add all the series, and for those with {} axis options, add a new axis.
+ for (var idx = 0; idx < this.labels_.length; idx++) {
+ var seriesName = this.labels_[idx];
+
+ var optionsForSeries = this.user_[seriesName] || {};
+
+ var yAxis = 0;
+ var axis = optionsForSeries["axis"];
+ if (typeof(axis) == 'object') {
+ yAxis = ++axisId;
+ this.yAxes_[yAxis] = { series : [ seriesName ], options : axis };
+ }
+
+ // Associate series without axis options with axis 0.
+ if (!axis) { // undefined
+ this.yAxes_[0].series.push(seriesName);
+ }
+
+ this.series_[seriesName] = { idx: idx, yAxis: yAxis, options : optionsForSeries };
+ }
+
+ // Go through one more time and assign series to an axis defined by another
+ // series, e.g. { 'Y1: { axis: {} }, 'Y2': { axis: 'Y1' } }
+ for (var idx = 0; idx < this.labels_.length; idx++) {
+ var seriesName = this.labels_[idx];
+ var optionsForSeries = this.series_[seriesName]["options"];
+ var axis = optionsForSeries["axis"];
+
+ if (typeof(axis) == 'string') {
+ if (!this.series_.hasOwnProperty(axis)) {
+ console.error("Series " + seriesName + " wants to share a y-axis with " +
+ "series " + axis + ", which does not define its own axis.");
+ return;
+ }
+ var yAxis = this.series_[axis].yAxis;
+ this.series_[seriesName].yAxis = yAxis;
+ this.yAxes_[yAxis].series.push(seriesName);
+ }
+ }
+ } else {
+ for (var idx = 0; idx < this.labels_.length; idx++) {
+ var seriesName = this.labels_[idx];
+ var optionsForSeries = this.user_.series[seriesName] || {};
+ var yAxis = DygraphOptions.axisToIndex_(optionsForSeries["axis"]);
+
+ this.series_[seriesName] = {
+ idx: idx,
+ yAxis: yAxis,
+ options : optionsForSeries };
+
+ if (!this.yAxes_[yAxis]) {
+ this.yAxes_[yAxis] = { series : [ seriesName ], options : {} };
+ } else {
+ this.yAxes_[yAxis].series.push(seriesName);
+ }
+ }
+ }
+
+ var axis_opts = this.user_["axes"] || {};
+ Dygraph.update(this.yAxes_[0].options, axis_opts["y"] || {});
+ if (this.yAxes_.length > 1) {
+ Dygraph.update(this.yAxes_[1].options, axis_opts["y2"] || {});
+ }
+ Dygraph.update(this.xAxis_.options, axis_opts["x"] || {});
+
+ if (DEBUG) this.validateOptions_();
+};
+
+/**
+ * Get a global value.
+ *
+ * @param {string} name the name of the option.
+ */
+DygraphOptions.prototype.get = function(name) {
+ var result = this.getGlobalUser_(name);
+ if (result !== null) {
+ return result;
+ }
+ return this.getGlobalDefault_(name);
+};
+
+DygraphOptions.prototype.getGlobalUser_ = function(name) {
+ if (this.user_.hasOwnProperty(name)) {
+ return this.user_[name];
+ }
+ return null;
+};
+
+DygraphOptions.prototype.getGlobalDefault_ = function(name) {
+ if (this.global_.hasOwnProperty(name)) {
+ return this.global_[name];
+ }
+ if (Dygraph.DEFAULT_ATTRS.hasOwnProperty(name)) {
+ return Dygraph.DEFAULT_ATTRS[name];
+ }
+ return null;
+};
+
+/**
+ * Get a value for a specific axis. If there is no specific value for the axis,
+ * the global value is returned.
+ *
+ * @param {string} name the name of the option.
+ * @param {string|number} axis the axis to search. Can be the string representation
+ * ("y", "y2") or the axis number (0, 1).
+ */
+DygraphOptions.prototype.getForAxis = function(name, axis) {
+ var axisIdx;
+ var axisString;
+
+ // Since axis can be a number or a string, straighten everything out here.
+ if (typeof(axis) == 'number') {
+ axisIdx = axis;
+ axisString = axisIdx === 0 ? "y" : "y2";
+ } else {
+ if (axis == "y1") { axis = "y"; } // Standardize on 'y'. Is this bad? I think so.
+ if (axis == "y") {
+ axisIdx = 0;
+ } else if (axis == "y2") {
+ axisIdx = 1;
+ } else if (axis == "x") {
+ axisIdx = -1; // simply a placeholder for below.
+ } else {
+ throw "Unknown axis " + axis;
+ }
+ axisString = axis;
+ }
+
+ var userAxis = (axisIdx == -1) ? this.xAxis_ : this.yAxes_[axisIdx];
+
+ // Search the user-specified axis option first.
+ if (userAxis) { // This condition could be removed if we always set up this.yAxes_ for y2.
+ var axisOptions = userAxis.options;
+ if (axisOptions.hasOwnProperty(name)) {
+ return axisOptions[name];
+ }
+ }
+
+ // User-specified global options second.
+ // But, hack, ignore globally-specified 'logscale' for 'x' axis declaration.
+ if (!(axis === 'x' && name === 'logscale')) {
+ var result = this.getGlobalUser_(name);
+ if (result !== null) {
+ return result;
+ }
+ }
+ // Default axis options third.
+ var defaultAxisOptions = Dygraph.DEFAULT_ATTRS.axes[axisString];
+ if (defaultAxisOptions.hasOwnProperty(name)) {
+ return defaultAxisOptions[name];
+ }
+
+ // Default global options last.
+ return this.getGlobalDefault_(name);
+};
+
+/**
+ * Get a value for a specific series. If there is no specific value for the series,
+ * the value for the axis is returned (and afterwards, the global value.)
+ *
+ * @param {string} name the name of the option.
+ * @param {string} series the series to search.
+ */
+DygraphOptions.prototype.getForSeries = function(name, series) {
+ // Honors indexes as series.
+ if (series === this.dygraph_.getHighlightSeries()) {
+ if (this.highlightSeries_.hasOwnProperty(name)) {
+ return this.highlightSeries_[name];
+ }
+ }
+
+ if (!this.series_.hasOwnProperty(series)) {
+ throw "Unknown series: " + series;
+ }
+
+ var seriesObj = this.series_[series];
+ var seriesOptions = seriesObj["options"];
+ if (seriesOptions.hasOwnProperty(name)) {
+ return seriesOptions[name];
+ }
+
+ return this.getForAxis(name, seriesObj["yAxis"]);
+};
+
+/**
+ * Returns the number of y-axes on the chart.
+ * @return {number} the number of axes.
+ */
+DygraphOptions.prototype.numAxes = function() {
+ return this.yAxes_.length;
+};
+
+/**
+ * Return the y-axis for a given series, specified by name.
+ */
+DygraphOptions.prototype.axisForSeries = function(series) {
+ return this.series_[series].yAxis;
+};
+
+/**
+ * Returns the options for the specified axis.
+ */
+// TODO(konigsberg): this is y-axis specific. Support the x axis.
+DygraphOptions.prototype.axisOptions = function(yAxis) {
+ return this.yAxes_[yAxis].options;
+};
+
+/**
+ * Return the series associated with an axis.
+ */
+DygraphOptions.prototype.seriesForAxis = function(yAxis) {
+ return this.yAxes_[yAxis].series;
+};
+
+/**
+ * Return the list of all series, in their columnar order.
+ */
+DygraphOptions.prototype.seriesNames = function() {
+ return this.labels_;
+};
+
+if (DEBUG) {
+
+/**
+ * Validate all options.
+ * This requires Dygraph.OPTIONS_REFERENCE, which is only available in debug builds.
+ * @private
+ */
+DygraphOptions.prototype.validateOptions_ = function() {
+ if (typeof Dygraph.OPTIONS_REFERENCE === 'undefined') {
+ throw 'Called validateOptions_ in prod build.';
+ }
+
+ var that = this;
+ var validateOption = function(optionName) {
+ if (!Dygraph.OPTIONS_REFERENCE[optionName]) {
+ that.warnInvalidOption_(optionName);
+ }
+ };
+
+ var optionsDicts = [this.xAxis_.options,
+ this.yAxes_[0].options,
+ this.yAxes_[1] && this.yAxes_[1].options,
+ this.global_,
+ this.user_,
+ this.highlightSeries_];
+ var names = this.seriesNames();
+ for (var i = 0; i < names.length; i++) {
+ var name = names[i];
+ if (this.series_.hasOwnProperty(name)) {
+ optionsDicts.push(this.series_[name].options);
+ }
+ }
+ for (var i = 0; i < optionsDicts.length; i++) {
+ var dict = optionsDicts[i];
+ if (!dict) continue;
+ for (var optionName in dict) {
+ if (dict.hasOwnProperty(optionName)) {
+ validateOption(optionName);
+ }
+ }
+ }
+};
+
+var WARNINGS = {}; // Only show any particular warning once.
+
+/**
+ * Logs a warning about invalid options.
+ * TODO: make this throw for testing
+ * @private
+ */
+DygraphOptions.prototype.warnInvalidOption_ = function(optionName) {
+ if (!WARNINGS[optionName]) {
+ WARNINGS[optionName] = true;
+ var isSeries = (this.labels_.indexOf(optionName) >= 0);
+ if (isSeries) {
+ console.warn('Use new-style per-series options (saw ' + optionName + ' as top-level options key). See http://bit.ly/1tceaJs');
+ } else {
+ console.warn('Unknown option ' + optionName + ' (full list of options at dygraphs.com/options.html');
+ throw "invalid option " + optionName;
+ }
+ }
+};
+
+// Reset list of previously-shown warnings. Used for testing.
+DygraphOptions.resetWarnings_ = function() {
+ WARNINGS = {};
+};
+
+}
+
+return DygraphOptions;
+
+})();
+})();
+/**
+ * @license
+ * Copyright 2011 Dan Vanderkam (danvdk@gmail.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+
+/**
+ * @fileoverview Based on PlotKitLayout, but modified to meet the needs of
+ * dygraphs.
+ */
+
+var DygraphLayout = (function() {
+
+/*global Dygraph:false */
+"use strict";
+
+/**
+ * Creates a new DygraphLayout object.
+ *
+ * This class contains all the data to be charted.
+ * It uses data coordinates, but also records the chart range (in data
+ * coordinates) and hence is able to calculate percentage positions ('In this
+ * view, Point A lies 25% down the x-axis.')
+ *
+ * Two things that it does not do are:
+ * 1. Record pixel coordinates for anything.
+ * 2. (oddly) determine anything about the layout of chart elements.
+ *
+ * The naming is a vestige of Dygraph's original PlotKit roots.
+ *
+ * @constructor
+ */
+var DygraphLayout = function(dygraph) {
+ this.dygraph_ = dygraph;
+ /**
+ * Array of points for each series.
+ *
+ * [series index][row index in series] = |Point| structure,
+ * where series index refers to visible series only, and the
+ * point index is for the reduced set of points for the current
+ * zoom region (including one point just outside the window).
+ * All points in the same row index share the same X value.
+ *
+ * @type {Array.<Array.<Dygraph.PointType>>}
+ */
+ this.points = [];
+ this.setNames = [];
+ this.annotations = [];
+ this.yAxes_ = null;
+
+ // TODO(danvk): it's odd that xTicks_ and yTicks_ are inputs, but xticks and
+ // yticks are outputs. Clean this up.
+ this.xTicks_ = null;
+ this.yTicks_ = null;
+};
+
+/**
+ * Add points for a single series.
+ *
+ * @param {string} setname Name of the series.
+ * @param {Array.<Dygraph.PointType>} set_xy Points for the series.
+ */
+DygraphLayout.prototype.addDataset = function(setname, set_xy) {
+ this.points.push(set_xy);
+ this.setNames.push(setname);
+};
+
+/**
+ * Returns the box which the chart should be drawn in. This is the canvas's
+ * box, less space needed for the axis and chart labels.
+ *
+ * @return {{x: number, y: number, w: number, h: number}}
+ */
+DygraphLayout.prototype.getPlotArea = function() {
+ return this.area_;
+};
+
+// Compute the box which the chart should be drawn in. This is the canvas's
+// box, less space needed for axis, chart labels, and other plug-ins.
+// NOTE: This should only be called by Dygraph.predraw_().
+DygraphLayout.prototype.computePlotArea = function() {
+ var area = {
+ // TODO(danvk): per-axis setting.
+ x: 0,
+ y: 0
+ };
+
+ area.w = this.dygraph_.width_ - area.x - this.dygraph_.getOption('rightGap');
+ area.h = this.dygraph_.height_;
+
+ // Let plugins reserve space.
+ var e = {
+ chart_div: this.dygraph_.graphDiv,
+ reserveSpaceLeft: function(px) {
+ var r = {
+ x: area.x,
+ y: area.y,
+ w: px,
+ h: area.h
+ };
+ area.x += px;
+ area.w -= px;
+ return r;
+ },
+ reserveSpaceRight: function(px) {
+ var r = {
+ x: area.x + area.w - px,
+ y: area.y,
+ w: px,
+ h: area.h
+ };
+ area.w -= px;
+ return r;
+ },
+ reserveSpaceTop: function(px) {
+ var r = {
+ x: area.x,
+ y: area.y,
+ w: area.w,
+ h: px
+ };
+ area.y += px;
+ area.h -= px;
+ return r;
+ },
+ reserveSpaceBottom: function(px) {
+ var r = {
+ x: area.x,
+ y: area.y + area.h - px,
+ w: area.w,
+ h: px
+ };
+ area.h -= px;
+ return r;
+ },
+ chartRect: function() {
+ return {x:area.x, y:area.y, w:area.w, h:area.h};
+ }
+ };
+ this.dygraph_.cascadeEvents_('layout', e);
+
+ this.area_ = area;
+};
+
+DygraphLayout.prototype.setAnnotations = function(ann) {
+ // The Dygraph object's annotations aren't parsed. We parse them here and
+ // save a copy. If there is no parser, then the user must be using raw format.
+ this.annotations = [];
+ var parse = this.dygraph_.getOption('xValueParser') || function(x) { return x; };
+ for (var i = 0; i < ann.length; i++) {
+ var a = {};
+ if (!ann[i].xval && ann[i].x === undefined) {
+ console.error("Annotations must have an 'x' property");
+ return;
+ }
+ if (ann[i].icon &&
+ !(ann[i].hasOwnProperty('width') &&
+ ann[i].hasOwnProperty('height'))) {
+ console.error("Must set width and height when setting " +
+ "annotation.icon property");
+ return;
+ }
+ Dygraph.update(a, ann[i]);
+ if (!a.xval) a.xval = parse(a.x);
+ this.annotations.push(a);
+ }
+};
+
+DygraphLayout.prototype.setXTicks = function(xTicks) {
+ this.xTicks_ = xTicks;
+};
+
+// TODO(danvk): add this to the Dygraph object's API or move it into Layout.
+DygraphLayout.prototype.setYAxes = function (yAxes) {
+ this.yAxes_ = yAxes;
+};
+
+DygraphLayout.prototype.evaluate = function() {
+ this._xAxis = {};
+ this._evaluateLimits();
+ this._evaluateLineCharts();
+ this._evaluateLineTicks();
+ this._evaluateAnnotations();
+};
+
+DygraphLayout.prototype._evaluateLimits = function() {
+ var xlimits = this.dygraph_.xAxisRange();
+ this._xAxis.minval = xlimits[0];
+ this._xAxis.maxval = xlimits[1];
+ var xrange = xlimits[1] - xlimits[0];
+ this._xAxis.scale = (xrange !== 0 ? 1 / xrange : 1.0);
+
+ if (this.dygraph_.getOptionForAxis("logscale", 'x')) {
+ this._xAxis.xlogrange = Dygraph.log10(this._xAxis.maxval) - Dygraph.log10(this._xAxis.minval);
+ this._xAxis.xlogscale = (this._xAxis.xlogrange !== 0 ? 1.0 / this._xAxis.xlogrange : 1.0);
+ }
+ for (var i = 0; i < this.yAxes_.length; i++) {
+ var axis = this.yAxes_[i];
+ axis.minyval = axis.computedValueRange[0];
+ axis.maxyval = axis.computedValueRange[1];
+ axis.yrange = axis.maxyval - axis.minyval;
+ axis.yscale = (axis.yrange !== 0 ? 1.0 / axis.yrange : 1.0);
+
+ if (this.dygraph_.getOption("logscale")) {
+ axis.ylogrange = Dygraph.log10(axis.maxyval) - Dygraph.log10(axis.minyval);
+ axis.ylogscale = (axis.ylogrange !== 0 ? 1.0 / axis.ylogrange : 1.0);
+ if (!isFinite(axis.ylogrange) || isNaN(axis.ylogrange)) {
+ console.error('axis ' + i + ' of graph at ' + axis.g +
+ ' can\'t be displayed in log scale for range [' +
+ axis.minyval + ' - ' + axis.maxyval + ']');
+ }
+ }
+ }
+};
+
+DygraphLayout.calcXNormal_ = function(value, xAxis, logscale) {
+ if (logscale) {
+ return ((Dygraph.log10(value) - Dygraph.log10(xAxis.minval)) * xAxis.xlogscale);
+ } else {
+ return (value - xAxis.minval) * xAxis.scale;
+ }
+};
+
+/**
+ * @param {DygraphAxisType} axis
+ * @param {number} value
+ * @param {boolean} logscale
+ * @return {number}
+ */
+DygraphLayout.calcYNormal_ = function(axis, value, logscale) {
+ if (logscale) {
+ var x = 1.0 - ((Dygraph.log10(value) - Dygraph.log10(axis.minyval)) * axis.ylogscale);
+ return isFinite(x) ? x : NaN; // shim for v8 issue; see pull request 276
+ } else {
+ return 1.0 - ((value - axis.minyval) * axis.yscale);
+ }
+};
+
+DygraphLayout.prototype._evaluateLineCharts = function() {
+ var isStacked = this.dygraph_.getOption("stackedGraph");
+ var isLogscaleForX = this.dygraph_.getOptionForAxis("logscale", 'x');
+
+ for (var setIdx = 0; setIdx < this.points.length; setIdx++) {
+ var points = this.points[setIdx];
+ var setName = this.setNames[setIdx];
+ var connectSeparated = this.dygraph_.getOption('connectSeparatedPoints', setName);
+ var axis = this.dygraph_.axisPropertiesForSeries(setName);
+ // TODO (konigsberg): use optionsForAxis instead.
+ var logscale = this.dygraph_.attributes_.getForSeries("logscale", setName);
+
+ for (var j = 0; j < points.length; j++) {
+ var point = points[j];
+
+ // Range from 0-1 where 0 represents left and 1 represents right.
+ point.x = DygraphLayout.calcXNormal_(point.xval, this._xAxis, isLogscaleForX);
+ // Range from 0-1 where 0 represents top and 1 represents bottom
+ var yval = point.yval;
+ if (isStacked) {
+ point.y_stacked = DygraphLayout.calcYNormal_(
+ axis, point.yval_stacked, logscale);
+ if (yval !== null && !isNaN(yval)) {
+ yval = point.yval_stacked;
+ }
+ }
+ if (yval === null) {
+ yval = NaN;
+ if (!connectSeparated) {
+ point.yval = NaN;
+ }
+ }
+ point.y = DygraphLayout.calcYNormal_(axis, yval, logscale);
+ }
+
+ this.dygraph_.dataHandler_.onLineEvaluated(points, axis, logscale);
+ }
+};
+
+DygraphLayout.prototype._evaluateLineTicks = function() {
+ var i, tick, label, pos;
+ this.xticks = [];
+ for (i = 0; i < this.xTicks_.length; i++) {
+ tick = this.xTicks_[i];
+ label = tick.label;
+ pos = this.dygraph_.toPercentXCoord(tick.v);
+ if ((pos >= 0.0) && (pos < 1.0)) {
+ this.xticks.push([pos, label]);
+ }
+ }
+
+ this.yticks = [];
+ for (i = 0; i < this.yAxes_.length; i++ ) {
+ var axis = this.yAxes_[i];
+ for (var j = 0; j < axis.ticks.length; j++) {
+ tick = axis.ticks[j];
+ label = tick.label;
+ pos = this.dygraph_.toPercentYCoord(tick.v, i);
+ if ((pos > 0.0) && (pos <= 1.0)) {
+ this.yticks.push([i, pos, label]);
+ }
+ }
+ }
+};
+
+DygraphLayout.prototype._evaluateAnnotations = function() {
+ // Add the annotations to the point to which they belong.
+ // Make a map from (setName, xval) to annotation for quick lookups.
+ var i;
+ var annotations = {};
+ for (i = 0; i < this.annotations.length; i++) {
+ var a = this.annotations[i];
+ annotations[a.xval + "," + a.series] = a;
+ }
+
+ this.annotated_points = [];
+
+ // Exit the function early if there are no annotations.
+ if (!this.annotations || !this.annotations.length) {
+ return;
+ }
+
+ // TODO(antrob): loop through annotations not points.
+ for (var setIdx = 0; setIdx < this.points.length; setIdx++) {
+ var points = this.points[setIdx];
+ for (i = 0; i < points.length; i++) {
+ var p = points[i];
+ var k = p.xval + "," + p.name;
+ if (k in annotations) {
+ p.annotation = annotations[k];
+ this.annotated_points.push(p);
+ }
+ }
+ }
+};
+
+/**
+ * Convenience function to remove all the data sets from a graph
+ */
+DygraphLayout.prototype.removeAllDatasets = function() {
+ delete this.points;
+ delete this.setNames;
+ delete this.setPointsLengths;
+ delete this.setPointsOffsets;
+ this.points = [];
+ this.setNames = [];
+ this.setPointsLengths = [];
+ this.setPointsOffsets = [];
+};
+
+return DygraphLayout;
+
+})();
+/**
+ * @license
+ * Copyright 2006 Dan Vanderkam (danvdk@gmail.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+
+/**
+ * @fileoverview Based on PlotKit.CanvasRenderer, but modified to meet the
+ * needs of dygraphs.
+ *
+ * In particular, support for:
+ * - grid overlays
+ * - error bars
+ * - dygraphs attribute system
+ */
+
+/**
+ * The DygraphCanvasRenderer class does the actual rendering of the chart onto
+ * a canvas. It's based on PlotKit.CanvasRenderer.
+ * @param {Object} element The canvas to attach to
+ * @param {Object} elementContext The 2d context of the canvas (injected so it
+ * can be mocked for testing.)
+ * @param {Layout} layout The DygraphLayout object for this graph.
+ * @constructor
+ */
+
+var DygraphCanvasRenderer = (function() {
+/*global Dygraph:false */
+"use strict";
+
+
+/**
+ * @constructor
+ *
+ * This gets called when there are "new points" to chart. This is generally the
+ * case when the underlying data being charted has changed. It is _not_ called
+ * in the common case that the user has zoomed or is panning the view.
+ *
+ * The chart canvas has already been created by the Dygraph object. The
+ * renderer simply gets a drawing context.
+ *
+ * @param {Dygraph} dygraph The chart to which this renderer belongs.
+ * @param {HTMLCanvasElement} element The &lt;canvas&gt; DOM element on which to draw.
+ * @param {CanvasRenderingContext2D} elementContext The drawing context.
+ * @param {DygraphLayout} layout The chart's DygraphLayout object.
+ *
+ * TODO(danvk): remove the elementContext property.
+ */
+var DygraphCanvasRenderer = function(dygraph, element, elementContext, layout) {
+ this.dygraph_ = dygraph;
+
+ this.layout = layout;
+ this.element = element;
+ this.elementContext = elementContext;
+
+ this.height = dygraph.height_;
+ this.width = dygraph.width_;
+
+ // --- check whether everything is ok before we return
+ // NOTE(konigsberg): isIE is never defined in this object. Bug of some sort.
+ if (!this.isIE && !(Dygraph.isCanvasSupported(this.element)))
+ throw "Canvas is not supported.";
+
+ // internal state
+ this.area = layout.getPlotArea();
+
+ // Set up a clipping area for the canvas (and the interaction canvas).
+ // This ensures that we don't overdraw.
+ if (this.dygraph_.isUsingExcanvas_) {
+ this._createIEClipArea();
+ } else {
+ // on Android 3 and 4, setting a clipping area on a canvas prevents it from
+ // displaying anything.
+ if (!Dygraph.isAndroid()) {
+ var ctx = this.dygraph_.canvas_ctx_;
+ ctx.beginPath();
+ ctx.rect(this.area.x, this.area.y, this.area.w, this.area.h);
+ ctx.clip();
+
+ ctx = this.dygraph_.hidden_ctx_;
+ ctx.beginPath();
+ ctx.rect(this.area.x, this.area.y, this.area.w, this.area.h);
+ ctx.clip();
+ }
+ }
+};
+
+/**
+ * Clears out all chart content and DOM elements.
+ * This is called immediately before render() on every frame, including
+ * during zooms and pans.
+ * @private
+ */
+DygraphCanvasRenderer.prototype.clear = function() {
+ var context;
+ if (this.isIE) {
+ // VML takes a while to start up, so we just poll every this.IEDelay
+ try {
+ if (this.clearDelay) {
+ this.clearDelay.cancel();
+ this.clearDelay = null;
+ }
+ context = this.elementContext;
+ }
+ catch (e) {
+ // TODO(danvk): this is broken, since MochiKit.Async is gone.
+ // this.clearDelay = MochiKit.Async.wait(this.IEDelay);
+ // this.clearDelay.addCallback(bind(this.clear, this));
+ return;
+ }
+ }
+
+ context = this.elementContext;
+ context.clearRect(0, 0, this.width, this.height);
+};
+
+/**
+ * This method is responsible for drawing everything on the chart, including
+ * lines, error bars, fills and axes.
+ * It is called immediately after clear() on every frame, including during pans
+ * and zooms.
+ * @private
+ */
+DygraphCanvasRenderer.prototype.render = function() {
+ // attaches point.canvas{x,y}
+ this._updatePoints();
+
+ // actually draws the chart.
+ this._renderLineChart();
+};
+
+DygraphCanvasRenderer.prototype._createIEClipArea = function() {
+ var className = 'dygraph-clip-div';
+ var graphDiv = this.dygraph_.graphDiv;
+
+ // Remove old clip divs.
+ for (var i = graphDiv.childNodes.length-1; i >= 0; i--) {
+ if (graphDiv.childNodes[i].className == className) {
+ graphDiv.removeChild(graphDiv.childNodes[i]);
+ }
+ }
+
+ // Determine background color to give clip divs.
+ var backgroundColor = document.bgColor;
+ var element = this.dygraph_.graphDiv;
+ while (element != document) {
+ var bgcolor = element.currentStyle.backgroundColor;
+ if (bgcolor && bgcolor != 'transparent') {
+ backgroundColor = bgcolor;
+ break;
+ }
+ element = element.parentNode;
+ }
+
+ function createClipDiv(area) {
+ if (area.w === 0 || area.h === 0) {
+ return;
+ }
+ var elem = document.createElement('div');
+ elem.className = className;
+ elem.style.backgroundColor = backgroundColor;
+ elem.style.position = 'absolute';
+ elem.style.left = area.x + 'px';
+ elem.style.top = area.y + 'px';
+ elem.style.width = area.w + 'px';
+ elem.style.height = area.h + 'px';
+ graphDiv.appendChild(elem);
+ }
+
+ var plotArea = this.area;
+ // Left side
+ createClipDiv({
+ x:0, y:0,
+ w:plotArea.x,
+ h:this.height
+ });
+
+ // Top
+ createClipDiv({
+ x: plotArea.x, y: 0,
+ w: this.width - plotArea.x,
+ h: plotArea.y
+ });
+
+ // Right side
+ createClipDiv({
+ x: plotArea.x + plotArea.w, y: 0,
+ w: this.width - plotArea.x - plotArea.w,
+ h: this.height
+ });
+
+ // Bottom
+ createClipDiv({
+ x: plotArea.x,
+ y: plotArea.y + plotArea.h,
+ w: this.width - plotArea.x,
+ h: this.height - plotArea.h - plotArea.y
+ });
+};
+
+
+/**
+ * Returns a predicate to be used with an iterator, which will
+ * iterate over points appropriately, depending on whether
+ * connectSeparatedPoints is true. When it's false, the predicate will
+ * skip over points with missing yVals.
+ */
+DygraphCanvasRenderer._getIteratorPredicate = function(connectSeparatedPoints) {
+ return connectSeparatedPoints ?
+ DygraphCanvasRenderer._predicateThatSkipsEmptyPoints :
+ null;
+};
+
+DygraphCanvasRenderer._predicateThatSkipsEmptyPoints =
+ function(array, idx) {
+ return array[idx].yval !== null;
+};
+
+/**
+ * Draws a line with the styles passed in and calls all the drawPointCallbacks.
+ * @param {Object} e The dictionary passed to the plotter function.
+ * @private
+ */
+DygraphCanvasRenderer._drawStyledLine = function(e,
+ color, strokeWidth, strokePattern, drawPoints,
+ drawPointCallback, pointSize) {
+ var g = e.dygraph;
+ // TODO(konigsberg): Compute attributes outside this method call.
+ var stepPlot = g.getBooleanOption("stepPlot", e.setName);
+
+ if (!Dygraph.isArrayLike(strokePattern)) {
+ strokePattern = null;
+ }
+
+ var drawGapPoints = g.getBooleanOption('drawGapEdgePoints', e.setName);
+
+ var points = e.points;
+ var setName = e.setName;
+ var iter = Dygraph.createIterator(points, 0, points.length,
+ DygraphCanvasRenderer._getIteratorPredicate(
+ g.getBooleanOption("connectSeparatedPoints", setName)));
+
+ var stroking = strokePattern && (strokePattern.length >= 2);
+
+ var ctx = e.drawingContext;
+ ctx.save();
+ if (stroking) {
+ ctx.installPattern(strokePattern);
+ }
+
+ var pointsOnLine = DygraphCanvasRenderer._drawSeries(
+ e, iter, strokeWidth, pointSize, drawPoints, drawGapPoints, stepPlot, color);
+ DygraphCanvasRenderer._drawPointsOnLine(
+ e, pointsOnLine, drawPointCallback, color, pointSize);
+
+ if (stroking) {
+ ctx.uninstallPattern();
+ }
+
+ ctx.restore();
+};
+
+/**
+ * This does the actual drawing of lines on the canvas, for just one series.
+ * Returns a list of [canvasx, canvasy] pairs for points for which a
+ * drawPointCallback should be fired. These include isolated points, or all
+ * points if drawPoints=true.
+ * @param {Object} e The dictionary passed to the plotter function.
+ * @private
+ */
+DygraphCanvasRenderer._drawSeries = function(e,
+ iter, strokeWidth, pointSize, drawPoints, drawGapPoints, stepPlot, color) {
+
+ var prevCanvasX = null;
+ var prevCanvasY = null;
+ var nextCanvasY = null;
+ var isIsolated; // true if this point is isolated (no line segments)
+ var point; // the point being processed in the while loop
+ var pointsOnLine = []; // Array of [canvasx, canvasy] pairs.
+ var first = true; // the first cycle through the while loop
+
+ var ctx = e.drawingContext;
+ ctx.beginPath();
+ ctx.strokeStyle = color;
+ ctx.lineWidth = strokeWidth;
+
+ // NOTE: we break the iterator's encapsulation here for about a 25% speedup.
+ var arr = iter.array_;
+ var limit = iter.end_;
+ var predicate = iter.predicate_;
+
+ for (var i = iter.start_; i < limit; i++) {
+ point = arr[i];
+ if (predicate) {
+ while (i < limit && !predicate(arr, i)) {
+ i++;
+ }
+ if (i == limit) break;
+ point = arr[i];
+ }
+
+ // FIXME: The 'canvasy != canvasy' test here catches NaN values but the test
+ // doesn't catch Infinity values. Could change this to
+ // !isFinite(point.canvasy), but I assume it avoids isNaN for performance?
+ if (point.canvasy === null || point.canvasy != point.canvasy) {
+ if (stepPlot && prevCanvasX !== null) {
+ // Draw a horizontal line to the start of the missing data
+ ctx.moveTo(prevCanvasX, prevCanvasY);
+ ctx.lineTo(point.canvasx, prevCanvasY);
+ }
+ prevCanvasX = prevCanvasY = null;
+ } else {
+ isIsolated = false;
+ if (drawGapPoints || !prevCanvasX) {
+ iter.nextIdx_ = i;
+ iter.next();
+ nextCanvasY = iter.hasNext ? iter.peek.canvasy : null;
+
+ var isNextCanvasYNullOrNaN = nextCanvasY === null ||
+ nextCanvasY != nextCanvasY;
+ isIsolated = (!prevCanvasX && isNextCanvasYNullOrNaN);
+ if (drawGapPoints) {
+ // Also consider a point to be "isolated" if it's adjacent to a
+ // null point, excluding the graph edges.
+ if ((!first && !prevCanvasX) ||
+ (iter.hasNext && isNextCanvasYNullOrNaN)) {
+ isIsolated = true;
+ }
+ }
+ }
+
+ if (prevCanvasX !== null) {
+ if (strokeWidth) {
+ if (stepPlot) {
+ ctx.moveTo(prevCanvasX, prevCanvasY);
+ ctx.lineTo(point.canvasx, prevCanvasY);
+ }
+
+ ctx.lineTo(point.canvasx, point.canvasy);
+ }
+ } else {
+ ctx.moveTo(point.canvasx, point.canvasy);
+ }
+ if (drawPoints || isIsolated) {
+ pointsOnLine.push([point.canvasx, point.canvasy, point.idx]);
+ }
+ prevCanvasX = point.canvasx;
+ prevCanvasY = point.canvasy;
+ }
+ first = false;
+ }
+ ctx.stroke();
+ return pointsOnLine;
+};
+
+/**
+ * This fires the drawPointCallback functions, which draw dots on the points by
+ * default. This gets used when the "drawPoints" option is set, or when there
+ * are isolated points.
+ * @param {Object} e The dictionary passed to the plotter function.
+ * @private
+ */
+DygraphCanvasRenderer._drawPointsOnLine = function(
+ e, pointsOnLine, drawPointCallback, color, pointSize) {
+ var ctx = e.drawingContext;
+ for (var idx = 0; idx < pointsOnLine.length; idx++) {
+ var cb = pointsOnLine[idx];
+ ctx.save();
+ drawPointCallback.call(e.dygraph,
+ e.dygraph, e.setName, ctx, cb[0], cb[1], color, pointSize, cb[2]);
+ ctx.restore();
+ }
+};
+
+/**
+ * Attaches canvas coordinates to the points array.
+ * @private
+ */
+DygraphCanvasRenderer.prototype._updatePoints = function() {
+ // Update Points
+ // TODO(danvk): here
+ //
+ // TODO(bhs): this loop is a hot-spot for high-point-count charts. These
+ // transformations can be pushed into the canvas via linear transformation
+ // matrices.
+ // NOTE(danvk): this is trickier than it sounds at first. The transformation
+ // needs to be done before the .moveTo() and .lineTo() calls, but must be
+ // undone before the .stroke() call to ensure that the stroke width is
+ // unaffected. An alternative is to reduce the stroke width in the
+ // transformed coordinate space, but you can't specify different values for
+ // each dimension (as you can with .scale()). The speedup here is ~12%.
+ var sets = this.layout.points;
+ for (var i = sets.length; i--;) {
+ var points = sets[i];
+ for (var j = points.length; j--;) {
+ var point = points[j];
+ point.canvasx = this.area.w * point.x + this.area.x;
+ point.canvasy = this.area.h * point.y + this.area.y;
+ }
+ }
+};
+
+/**
+ * Add canvas Actually draw the lines chart, including error bars.
+ *
+ * This function can only be called if DygraphLayout's points array has been
+ * updated with canvas{x,y} attributes, i.e. by
+ * DygraphCanvasRenderer._updatePoints.
+ *
+ * @param {string=} opt_seriesName when specified, only that series will
+ * be drawn. (This is used for expedited redrawing with highlightSeriesOpts)
+ * @param {CanvasRenderingContext2D} opt_ctx when specified, the drawing
+ * context. However, lines are typically drawn on the object's
+ * elementContext.
+ * @private
+ */
+DygraphCanvasRenderer.prototype._renderLineChart = function(opt_seriesName, opt_ctx) {
+ var ctx = opt_ctx || this.elementContext;
+ var i;
+
+ var sets = this.layout.points;
+ var setNames = this.layout.setNames;
+ var setName;
+
+ this.colors = this.dygraph_.colorsMap_;
+
+ // Determine which series have specialized plotters.
+ var plotter_attr = this.dygraph_.getOption("plotter");
+ var plotters = plotter_attr;
+ if (!Dygraph.isArrayLike(plotters)) {
+ plotters = [plotters];
+ }
+
+ var setPlotters = {}; // series name -> plotter fn.
+ for (i = 0; i < setNames.length; i++) {
+ setName = setNames[i];
+ var setPlotter = this.dygraph_.getOption("plotter", setName);
+ if (setPlotter == plotter_attr) continue; // not specialized.
+
+ setPlotters[setName] = setPlotter;
+ }
+
+ for (i = 0; i < plotters.length; i++) {
+ var plotter = plotters[i];
+ var is_last = (i == plotters.length - 1);
+
+ for (var j = 0; j < sets.length; j++) {
+ setName = setNames[j];
+ if (opt_seriesName && setName != opt_seriesName) continue;
+
+ var points = sets[j];
+
+ // Only throw in the specialized plotters on the last iteration.
+ var p = plotter;
+ if (setName in setPlotters) {
+ if (is_last) {
+ p = setPlotters[setName];
+ } else {
+ // Don't use the standard plotters in this case.
+ continue;
+ }
+ }
+
+ var color = this.colors[setName];
+ var strokeWidth = this.dygraph_.getOption("strokeWidth", setName);
+
+ ctx.save();
+ ctx.strokeStyle = color;
+ ctx.lineWidth = strokeWidth;
+ p({
+ points: points,
+ setName: setName,
+ drawingContext: ctx,
+ color: color,
+ strokeWidth: strokeWidth,
+ dygraph: this.dygraph_,
+ axis: this.dygraph_.axisPropertiesForSeries(setName),
+ plotArea: this.area,
+ seriesIndex: j,
+ seriesCount: sets.length,
+ singleSeriesName: opt_seriesName,
+ allSeriesPoints: sets
+ });
+ ctx.restore();
+ }
+ }
+};
+
+/**
+ * Standard plotters. These may be used by clients via Dygraph.Plotters.
+ * See comments there for more details.
+ */
+DygraphCanvasRenderer._Plotters = {
+ linePlotter: function(e) {
+ DygraphCanvasRenderer._linePlotter(e);
+ },
+
+ fillPlotter: function(e) {
+ DygraphCanvasRenderer._fillPlotter(e);
+ },
+
+ errorPlotter: function(e) {
+ DygraphCanvasRenderer._errorPlotter(e);
+ }
+};
+
+/**
+ * Plotter which draws the central lines for a series.
+ * @private
+ */
+DygraphCanvasRenderer._linePlotter = function(e) {
+ var g = e.dygraph;
+ var setName = e.setName;
+ var strokeWidth = e.strokeWidth;
+
+ // TODO(danvk): Check if there's any performance impact of just calling
+ // getOption() inside of _drawStyledLine. Passing in so many parameters makes
+ // this code a bit nasty.
+ var borderWidth = g.getNumericOption("strokeBorderWidth", setName);
+ var drawPointCallback = g.getOption("drawPointCallback", setName) ||
+ Dygraph.Circles.DEFAULT;
+ var strokePattern = g.getOption("strokePattern", setName);
+ var drawPoints = g.getBooleanOption("drawPoints", setName);
+ var pointSize = g.getNumericOption("pointSize", setName);
+
+ if (borderWidth && strokeWidth) {
+ DygraphCanvasRenderer._drawStyledLine(e,
+ g.getOption("strokeBorderColor", setName),
+ strokeWidth + 2 * borderWidth,
+ strokePattern,
+ drawPoints,
+ drawPointCallback,
+ pointSize
+ );
+ }
+
+ DygraphCanvasRenderer._drawStyledLine(e,
+ e.color,
+ strokeWidth,
+ strokePattern,
+ drawPoints,
+ drawPointCallback,
+ pointSize
+ );
+};
+
+/**
+ * Draws the shaded error bars/confidence intervals for each series.
+ * This happens before the center lines are drawn, since the center lines
+ * need to be drawn on top of the error bars for all series.
+ * @private
+ */
+DygraphCanvasRenderer._errorPlotter = function(e) {
+ var g = e.dygraph;
+ var setName = e.setName;
+ var errorBars = g.getBooleanOption("errorBars") ||
+ g.getBooleanOption("customBars");
+ if (!errorBars) return;
+
+ var fillGraph = g.getBooleanOption("fillGraph", setName);
+ if (fillGraph) {
+ console.warn("Can't use fillGraph option with error bars");
+ }
+
+ var ctx = e.drawingContext;
+ var color = e.color;
+ var fillAlpha = g.getNumericOption('fillAlpha', setName);
+ var stepPlot = g.getBooleanOption("stepPlot", setName);
+ var points = e.points;
+
+ var iter = Dygraph.createIterator(points, 0, points.length,
+ DygraphCanvasRenderer._getIteratorPredicate(
+ g.getBooleanOption("connectSeparatedPoints", setName)));
+
+ var newYs;
+
+ // setup graphics context
+ var prevX = NaN;
+ var prevY = NaN;
+ var prevYs = [-1, -1];
+ // should be same color as the lines but only 15% opaque.
+ var rgb = Dygraph.toRGB_(color);
+ var err_color =
+ 'rgba(' + rgb.r + ',' + rgb.g + ',' + rgb.b + ',' + fillAlpha + ')';
+ ctx.fillStyle = err_color;
+ ctx.beginPath();
+
+ var isNullUndefinedOrNaN = function(x) {
+ return (x === null ||
+ x === undefined ||
+ isNaN(x));
+ };
+
+ while (iter.hasNext) {
+ var point = iter.next();
+ if ((!stepPlot && isNullUndefinedOrNaN(point.y)) ||
+ (stepPlot && !isNaN(prevY) && isNullUndefinedOrNaN(prevY))) {
+ prevX = NaN;
+ continue;
+ }
+
+ newYs = [ point.y_bottom, point.y_top ];
+ if (stepPlot) {
+ prevY = point.y;
+ }
+
+ // The documentation specifically disallows nulls inside the point arrays,
+ // but in case it happens we should do something sensible.
+ if (isNaN(newYs[0])) newYs[0] = point.y;
+ if (isNaN(newYs[1])) newYs[1] = point.y;
+
+ newYs[0] = e.plotArea.h * newYs[0] + e.plotArea.y;
+ newYs[1] = e.plotArea.h * newYs[1] + e.plotArea.y;
+ if (!isNaN(prevX)) {
+ if (stepPlot) {
+ ctx.moveTo(prevX, prevYs[0]);
+ ctx.lineTo(point.canvasx, prevYs[0]);
+ ctx.lineTo(point.canvasx, prevYs[1]);
+ } else {
+ ctx.moveTo(prevX, prevYs[0]);
+ ctx.lineTo(point.canvasx, newYs[0]);
+ ctx.lineTo(point.canvasx, newYs[1]);
+ }
+ ctx.lineTo(prevX, prevYs[1]);
+ ctx.closePath();
+ }
+ prevYs = newYs;
+ prevX = point.canvasx;
+ }
+ ctx.fill();
+};
+
+
+/**
+ * Proxy for CanvasRenderingContext2D which drops moveTo/lineTo calls which are
+ * superfluous. It accumulates all movements which haven't changed the x-value
+ * and only applies the two with the most extreme y-values.
+ *
+ * Calls to lineTo/moveTo must have non-decreasing x-values.
+ */
+DygraphCanvasRenderer._fastCanvasProxy = function(context) {
+ var pendingActions = []; // array of [type, x, y] tuples
+ var lastRoundedX = null;
+
+ var LINE_TO = 1,
+ MOVE_TO = 2;
+
+ var actionCount = 0; // number of moveTos and lineTos passed to context.
+
+ // Drop superfluous motions
+ // Assumes all pendingActions have the same (rounded) x-value.
+ var compressActions = function(opt_losslessOnly) {
+ if (pendingActions.length <= 1) return;
+
+ // Lossless compression: drop inconsequential moveTos.
+ for (var i = pendingActions.length - 1; i > 0; i--) {
+ var action = pendingActions[i];
+ if (action[0] == MOVE_TO) {
+ var prevAction = pendingActions[i - 1];
+ if (prevAction[1] == action[1] && prevAction[2] == action[2]) {
+ pendingActions.splice(i, 1);
+ }
+ }
+ }
+
+ // Lossless compression: ... drop consecutive moveTos ...
+ for (var i = 0; i < pendingActions.length - 1; /* incremented internally */) {
+ var action = pendingActions[i];
+ if (action[0] == MOVE_TO && pendingActions[i + 1][0] == MOVE_TO) {
+ pendingActions.splice(i, 1);
+ } else {
+ i++;
+ }
+ }
+
+ // Lossy compression: ... drop all but the extreme y-values ...
+ if (pendingActions.length > 2 && !opt_losslessOnly) {
+ // keep an initial moveTo, but drop all others.
+ var startIdx = 0;
+ if (pendingActions[0][0] == MOVE_TO) startIdx++;
+ var minIdx = null, maxIdx = null;
+ for (var i = startIdx; i < pendingActions.length; i++) {
+ var action = pendingActions[i];
+ if (action[0] != LINE_TO) continue;
+ if (minIdx === null && maxIdx === null) {
+ minIdx = i;
+ maxIdx = i;
+ } else {
+ var y = action[2];
+ if (y < pendingActions[minIdx][2]) {
+ minIdx = i;
+ } else if (y > pendingActions[maxIdx][2]) {
+ maxIdx = i;
+ }
+ }
+ }
+ var minAction = pendingActions[minIdx],
+ maxAction = pendingActions[maxIdx];
+ pendingActions.splice(startIdx, pendingActions.length - startIdx);
+ if (minIdx < maxIdx) {
+ pendingActions.push(minAction);
+ pendingActions.push(maxAction);
+ } else if (minIdx > maxIdx) {
+ pendingActions.push(maxAction);
+ pendingActions.push(minAction);
+ } else {
+ pendingActions.push(minAction);
+ }
+ }
+ };
+
+ var flushActions = function(opt_noLossyCompression) {
+ compressActions(opt_noLossyCompression);
+ for (var i = 0, len = pendingActions.length; i < len; i++) {
+ var action = pendingActions[i];
+ if (action[0] == LINE_TO) {
+ context.lineTo(action[1], action[2]);
+ } else if (action[0] == MOVE_TO) {
+ context.moveTo(action[1], action[2]);
+ }
+ }
+ actionCount += pendingActions.length;
+ pendingActions = [];
+ };
+
+ var addAction = function(action, x, y) {
+ var rx = Math.round(x);
+ if (lastRoundedX === null || rx != lastRoundedX) {
+ flushActions();
+ lastRoundedX = rx;
+ }
+ pendingActions.push([action, x, y]);
+ };
+
+ return {
+ moveTo: function(x, y) {
+ addAction(MOVE_TO, x, y);
+ },
+ lineTo: function(x, y) {
+ addAction(LINE_TO, x, y);
+ },
+
+ // for major operations like stroke/fill, we skip compression to ensure
+ // that there are no artifacts at the right edge.
+ stroke: function() { flushActions(true); context.stroke(); },
+ fill: function() { flushActions(true); context.fill(); },
+ beginPath: function() { flushActions(true); context.beginPath(); },
+ closePath: function() { flushActions(true); context.closePath(); },
+
+ _count: function() { return actionCount; }
+ };
+};
+
+/**
+ * Draws the shaded regions when "fillGraph" is set. Not to be confused with
+ * error bars.
+ *
+ * For stacked charts, it's more convenient to handle all the series
+ * simultaneously. So this plotter plots all the points on the first series
+ * it's asked to draw, then ignores all the other series.
+ *
+ * @private
+ */
+DygraphCanvasRenderer._fillPlotter = function(e) {
+ // Skip if we're drawing a single series for interactive highlight overlay.
+ if (e.singleSeriesName) return;
+
+ // We'll handle all the series at once, not one-by-one.
+ if (e.seriesIndex !== 0) return;
+
+ var g = e.dygraph;
+ var setNames = g.getLabels().slice(1); // remove x-axis
+
+ // getLabels() includes names for invisible series, which are not included in
+ // allSeriesPoints. We remove those to make the two match.
+ // TODO(danvk): provide a simpler way to get this information.
+ for (var i = setNames.length; i >= 0; i--) {
+ if (!g.visibility()[i]) setNames.splice(i, 1);
+ }
+
+ var anySeriesFilled = (function() {
+ for (var i = 0; i < setNames.length; i++) {
+ if (g.getBooleanOption("fillGraph", setNames[i])) return true;
+ }
+ return false;
+ })();
+
+ if (!anySeriesFilled) return;
+
+ var area = e.plotArea;
+ var sets = e.allSeriesPoints;
+ var setCount = sets.length;
+
+ var fillAlpha = g.getNumericOption('fillAlpha');
+ var stackedGraph = g.getBooleanOption("stackedGraph");
+ var colors = g.getColors();
+
+ // For stacked graphs, track the baseline for filling.
+ //
+ // The filled areas below graph lines are trapezoids with two
+ // vertical edges. The top edge is the line segment being drawn, and
+ // the baseline is the bottom edge. Each baseline corresponds to the
+ // top line segment from the previous stacked line. In the case of
+ // step plots, the trapezoids are rectangles.
+ var baseline = {};
+ var currBaseline;
+ var prevStepPlot; // for different line drawing modes (line/step) per series
+
+ // Helper function to trace a line back along the baseline.
+ var traceBackPath = function(ctx, baselineX, baselineY, pathBack) {
+ ctx.lineTo(baselineX, baselineY);
+ if (stackedGraph) {
+ for (var i = pathBack.length - 1; i >= 0; i--) {
+ var pt = pathBack[i];
+ ctx.lineTo(pt[0], pt[1]);
+ }
+ }
+ };
+
+ // process sets in reverse order (needed for stacked graphs)
+ for (var setIdx = setCount - 1; setIdx >= 0; setIdx--) {
+ var ctx = e.drawingContext;
+ var setName = setNames[setIdx];
+ if (!g.getBooleanOption('fillGraph', setName)) continue;
+
+ var stepPlot = g.getBooleanOption('stepPlot', setName);
+ var color = colors[setIdx];
+ var axis = g.axisPropertiesForSeries(setName);
+ var axisY = 1.0 + axis.minyval * axis.yscale;
+ if (axisY < 0.0) axisY = 0.0;
+ else if (axisY > 1.0) axisY = 1.0;
+ axisY = area.h * axisY + area.y;
+
+ var points = sets[setIdx];
+ var iter = Dygraph.createIterator(points, 0, points.length,
+ DygraphCanvasRenderer._getIteratorPredicate(
+ g.getBooleanOption("connectSeparatedPoints", setName)));
+
+ // setup graphics context
+ var prevX = NaN;
+ var prevYs = [-1, -1];
+ var newYs;
+ // should be same color as the lines but only 15% opaque.
+ var rgb = Dygraph.toRGB_(color);
+ var err_color =
+ 'rgba(' + rgb.r + ',' + rgb.g + ',' + rgb.b + ',' + fillAlpha + ')';
+ ctx.fillStyle = err_color;
+ ctx.beginPath();
+ var last_x, is_first = true;
+
+ // If the point density is high enough, dropping segments on their way to
+ // the canvas justifies the overhead of doing so.
+ if (points.length > 2 * g.width_) {
+ ctx = DygraphCanvasRenderer._fastCanvasProxy(ctx);
+ }
+
+ // For filled charts, we draw points from left to right, then back along
+ // the x-axis to complete a shape for filling.
+ // For stacked plots, this "back path" is a more complex shape. This array
+ // stores the [x, y] values needed to trace that shape.
+ var pathBack = [];
+
+ // TODO(danvk): there are a lot of options at play in this loop.
+ // The logic would be much clearer if some (e.g. stackGraph and
+ // stepPlot) were split off into separate sub-plotters.
+ var point;
+ while (iter.hasNext) {
+ point = iter.next();
+ if (!Dygraph.isOK(point.y) && !stepPlot) {
+ traceBackPath(ctx, prevX, prevYs[1], pathBack);
+ pathBack = [];
+ prevX = NaN;
+ if (point.y_stacked !== null && !isNaN(point.y_stacked)) {
+ baseline[point.canvasx] = area.h * point.y_stacked + area.y;
+ }
+ continue;
+ }
+ if (stackedGraph) {
+ if (!is_first && last_x == point.xval) {
+ continue;
+ } else {
+ is_first = false;
+ last_x = point.xval;
+ }
+
+ currBaseline = baseline[point.canvasx];
+ var lastY;
+ if (currBaseline === undefined) {
+ lastY = axisY;
+ } else {
+ if(prevStepPlot) {
+ lastY = currBaseline[0];
+ } else {
+ lastY = currBaseline;
+ }
+ }
+ newYs = [ point.canvasy, lastY ];
+
+ if (stepPlot) {
+ // Step plots must keep track of the top and bottom of
+ // the baseline at each point.
+ if (prevYs[0] === -1) {
+ baseline[point.canvasx] = [ point.canvasy, axisY ];
+ } else {
+ baseline[point.canvasx] = [ point.canvasy, prevYs[0] ];
+ }
+ } else {
+ baseline[point.canvasx] = point.canvasy;
+ }
+
+ } else {
+ if (isNaN(point.canvasy) && stepPlot) {
+ newYs = [ area.y + area.h, axisY ];
+ } else {
+ newYs = [ point.canvasy, axisY ];
+ }
+ }
+ if (!isNaN(prevX)) {
+ // Move to top fill point
+ if (stepPlot) {
+ ctx.lineTo(point.canvasx, prevYs[0]);
+ ctx.lineTo(point.canvasx, newYs[0]);
+ } else {
+ ctx.lineTo(point.canvasx, newYs[0]);
+ }
+
+ // Record the baseline for the reverse path.
+ if (stackedGraph) {
+ pathBack.push([prevX, prevYs[1]]);
+ if (prevStepPlot && currBaseline) {
+ // Draw to the bottom of the baseline
+ pathBack.push([point.canvasx, currBaseline[1]]);
+ } else {
+ pathBack.push([point.canvasx, newYs[1]]);
+ }
+ }
+ } else {
+ ctx.moveTo(point.canvasx, newYs[1]);
+ ctx.lineTo(point.canvasx, newYs[0]);
+ }
+ prevYs = newYs;
+ prevX = point.canvasx;
+ }
+ prevStepPlot = stepPlot;
+ if (newYs && point) {
+ traceBackPath(ctx, point.canvasx, newYs[1], pathBack);
+ pathBack = [];
+ }
+ ctx.fill();
+ }
+};
+
+return DygraphCanvasRenderer;
+
+})();
+/**
+ * @license
+ * Copyright 2006 Dan Vanderkam (danvdk@gmail.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+
+/**
+ * @fileoverview Creates an interactive, zoomable graph based on a CSV file or
+ * string. Dygraph can handle multiple series with or without error bars. The
+ * date/value ranges will be automatically set. Dygraph uses the
+ * &lt;canvas&gt; tag, so it only works in FF1.5+.
+ * @author danvdk@gmail.com (Dan Vanderkam)
+
+ Usage:
+ <div id="graphdiv" style="width:800px; height:500px;"></div>
+ <script type="text/javascript">
+ new Dygraph(document.getElementById("graphdiv"),
+ "datafile.csv", // CSV file with headers
+ { }); // options
+ </script>
+
+ The CSV file is of the form
+
+ Date,SeriesA,SeriesB,SeriesC
+ YYYYMMDD,A1,B1,C1
+ YYYYMMDD,A2,B2,C2
+
+ If the 'errorBars' option is set in the constructor, the input should be of
+ the form
+ Date,SeriesA,SeriesB,...
+ YYYYMMDD,A1,sigmaA1,B1,sigmaB1,...
+ YYYYMMDD,A2,sigmaA2,B2,sigmaB2,...
+
+ If the 'fractions' option is set, the input should be of the form:
+
+ Date,SeriesA,SeriesB,...
+ YYYYMMDD,A1/B1,A2/B2,...
+ YYYYMMDD,A1/B1,A2/B2,...
+
+ And error bars will be calculated automatically using a binomial distribution.
+
+ For further documentation and examples, see http://dygraphs.com/
+
+ */
+
+// For "production" code, this gets set to false by uglifyjs.
+if (typeof(DEBUG) === 'undefined') DEBUG=true;
+
+var Dygraph = (function() {
+/*global DygraphLayout:false, DygraphCanvasRenderer:false, DygraphOptions:false, G_vmlCanvasManager:false,ActiveXObject:false */
+"use strict";
+
+/**
+ * Creates an interactive, zoomable chart.
+ *
+ * @constructor
+ * @param {div | String} div A div or the id of a div into which to construct
+ * the chart.
+ * @param {String | Function} file A file containing CSV data or a function
+ * that returns this data. The most basic expected format for each line is
+ * "YYYY/MM/DD,val1,val2,...". For more information, see
+ * http://dygraphs.com/data.html.
+ * @param {Object} attrs Various other attributes, e.g. errorBars determines
+ * whether the input data contains error ranges. For a complete list of
+ * options, see http://dygraphs.com/options.html.
+ */
+var Dygraph = function(div, data, opts, opt_fourth_param) {
+ // These have to go above the "Hack for IE" in __init__ since .ready() can be
+ // called as soon as the constructor returns. Once support for OldIE is
+ // dropped, this can go down with the rest of the initializers.
+ this.is_initial_draw_ = true;
+ this.readyFns_ = [];
+
+ if (opt_fourth_param !== undefined) {
+ // Old versions of dygraphs took in the series labels as a constructor
+ // parameter. This doesn't make sense anymore, but it's easy to continue
+ // to support this usage.
+ console.warn("Using deprecated four-argument dygraph constructor");
+ this.__old_init__(div, data, opts, opt_fourth_param);
+ } else {
+ this.__init__(div, data, opts);
+ }
+};
+
+Dygraph.NAME = "Dygraph";
+Dygraph.VERSION = "1.1.0";
+Dygraph.__repr__ = function() {
+ return "[" + Dygraph.NAME + " " + Dygraph.VERSION + "]";
+};
+
+/**
+ * Returns information about the Dygraph class.
+ */
+Dygraph.toString = function() {
+ return Dygraph.__repr__();
+};
+
+// Various default values
+Dygraph.DEFAULT_ROLL_PERIOD = 1;
+Dygraph.DEFAULT_WIDTH = 480;
+Dygraph.DEFAULT_HEIGHT = 320;
+
+// For max 60 Hz. animation:
+Dygraph.ANIMATION_STEPS = 12;
+Dygraph.ANIMATION_DURATION = 200;
+
+// Label constants for the labelsKMB and labelsKMG2 options.
+// (i.e. '100000' -> '100K')
+Dygraph.KMB_LABELS = [ 'K', 'M', 'B', 'T', 'Q' ];
+Dygraph.KMG2_BIG_LABELS = [ 'k', 'M', 'G', 'T', 'P', 'E', 'Z', 'Y' ];
+Dygraph.KMG2_SMALL_LABELS = [ 'm', 'u', 'n', 'p', 'f', 'a', 'z', 'y' ];
+
+// These are defined before DEFAULT_ATTRS so that it can refer to them.
+/**
+ * @private
+ * Return a string version of a number. This respects the digitsAfterDecimal
+ * and maxNumberWidth options.
+ * @param {number} x The number to be formatted
+ * @param {Dygraph} opts An options view
+ */
+Dygraph.numberValueFormatter = function(x, opts) {
+ var sigFigs = opts('sigFigs');
+
+ if (sigFigs !== null) {
+ // User has opted for a fixed number of significant figures.
+ return Dygraph.floatFormat(x, sigFigs);
+ }
+
+ var digits = opts('digitsAfterDecimal');
+ var maxNumberWidth = opts('maxNumberWidth');
+
+ var kmb = opts('labelsKMB');
+ var kmg2 = opts('labelsKMG2');
+
+ var label;
+
+ // switch to scientific notation if we underflow or overflow fixed display.
+ if (x !== 0.0 &&
+ (Math.abs(x) >= Math.pow(10, maxNumberWidth) ||
+ Math.abs(x) < Math.pow(10, -digits))) {
+ label = x.toExponential(digits);
+ } else {
+ label = '' + Dygraph.round_(x, digits);
+ }
+
+ if (kmb || kmg2) {
+ var k;
+ var k_labels = [];
+ var m_labels = [];
+ if (kmb) {
+ k = 1000;
+ k_labels = Dygraph.KMB_LABELS;
+ }
+ if (kmg2) {
+ if (kmb) console.warn("Setting both labelsKMB and labelsKMG2. Pick one!");
+ k = 1024;
+ k_labels = Dygraph.KMG2_BIG_LABELS;
+ m_labels = Dygraph.KMG2_SMALL_LABELS;
+ }
+
+ var absx = Math.abs(x);
+ var n = Dygraph.pow(k, k_labels.length);
+ for (var j = k_labels.length - 1; j >= 0; j--, n /= k) {
+ if (absx >= n) {
+ label = Dygraph.round_(x / n, digits) + k_labels[j];
+ break;
+ }
+ }
+ if (kmg2) {
+ // TODO(danvk): clean up this logic. Why so different than kmb?
+ var x_parts = String(x.toExponential()).split('e-');
+ if (x_parts.length === 2 && x_parts[1] >= 3 && x_parts[1] <= 24) {
+ if (x_parts[1] % 3 > 0) {
+ label = Dygraph.round_(x_parts[0] /
+ Dygraph.pow(10, (x_parts[1] % 3)),
+ digits);
+ } else {
+ label = Number(x_parts[0]).toFixed(2);
+ }
+ label += m_labels[Math.floor(x_parts[1] / 3) - 1];
+ }
+ }
+ }
+
+ return label;
+};
+
+/**
+ * variant for use as an axisLabelFormatter.
+ * @private
+ */
+Dygraph.numberAxisLabelFormatter = function(x, granularity, opts) {
+ return Dygraph.numberValueFormatter(x, opts);
+};
+
+/**
+ * @type {!Array.<string>}
+ * @private
+ * @constant
+ */
+Dygraph.SHORT_MONTH_NAMES_ = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
+
+
+/**
+ * Convert a JS date to a string appropriate to display on an axis that
+ * is displaying values at the stated granularity. This respects the
+ * labelsUTC option.
+ * @param {Date} date The date to format
+ * @param {number} granularity One of the Dygraph granularity constants
+ * @param {Dygraph} opts An options view
+ * @return {string} The date formatted as local time
+ * @private
+ */
+Dygraph.dateAxisLabelFormatter = function(date, granularity, opts) {
+ var utc = opts('labelsUTC');
+ var accessors = utc ? Dygraph.DateAccessorsUTC : Dygraph.DateAccessorsLocal;
+
+ var year = accessors.getFullYear(date),
+ month = accessors.getMonth(date),
+ day = accessors.getDate(date),
+ hours = accessors.getHours(date),
+ mins = accessors.getMinutes(date),
+ secs = accessors.getSeconds(date),
+ millis = accessors.getSeconds(date);
+
+ if (granularity >= Dygraph.DECADAL) {
+ return '' + year;
+ } else if (granularity >= Dygraph.MONTHLY) {
+ return Dygraph.SHORT_MONTH_NAMES_[month] + '&#160;' + year;
+ } else {
+ var frac = hours * 3600 + mins * 60 + secs + 1e-3 * millis;
+ if (frac === 0 || granularity >= Dygraph.DAILY) {
+ // e.g. '21 Jan' (%d%b)
+ return Dygraph.zeropad(day) + '&#160;' + Dygraph.SHORT_MONTH_NAMES_[month];
+ } else {
+ return Dygraph.hmsString_(hours, mins, secs);
+ }
+ }
+};
+// alias in case anyone is referencing the old method.
+Dygraph.dateAxisFormatter = Dygraph.dateAxisLabelFormatter;
+
+/**
+ * Return a string version of a JS date for a value label. This respects the
+ * labelsUTC option.
+ * @param {Date} date The date to be formatted
+ * @param {Dygraph} opts An options view
+ * @private
+ */
+Dygraph.dateValueFormatter = function(d, opts) {
+ return Dygraph.dateString_(d, opts('labelsUTC'));
+};
+
+/**
+ * Standard plotters. These may be used by clients.
+ * Available plotters are:
+ * - Dygraph.Plotters.linePlotter: draws central lines (most common)
+ * - Dygraph.Plotters.errorPlotter: draws error bars
+ * - Dygraph.Plotters.fillPlotter: draws fills under lines (used with fillGraph)
+ *
+ * By default, the plotter is [fillPlotter, errorPlotter, linePlotter].
+ * This causes all the lines to be drawn over all the fills/error bars.
+ */
+Dygraph.Plotters = DygraphCanvasRenderer._Plotters;
+
+
+// Default attribute values.
+Dygraph.DEFAULT_ATTRS = {
+ highlightCircleSize: 3,
+ highlightSeriesOpts: null,
+ highlightSeriesBackgroundAlpha: 0.5,
+
+ labelsDivWidth: 250,
+ labelsDivStyles: {
+ // TODO(danvk): move defaults from createStatusMessage_ here.
+ },
+ labelsSeparateLines: false,
+ labelsShowZeroValues: true,
+ labelsKMB: false,
+ labelsKMG2: false,
+ showLabelsOnHighlight: true,
+
+ digitsAfterDecimal: 2,
+ maxNumberWidth: 6,
+ sigFigs: null,
+
+ strokeWidth: 1.0,
+ strokeBorderWidth: 0,
+ strokeBorderColor: "white",
+
+ axisTickSize: 3,
+ axisLabelFontSize: 14,
+ rightGap: 5,
+
+ showRoller: false,
+ xValueParser: Dygraph.dateParser,
+
+ delimiter: ',',
+
+ sigma: 2.0,
+ errorBars: false,
+ fractions: false,
+ wilsonInterval: true, // only relevant if fractions is true
+ customBars: false,
+ fillGraph: false,
+ fillAlpha: 0.15,
+ connectSeparatedPoints: false,
+
+ stackedGraph: false,
+ stackedGraphNaNFill: 'all',
+ hideOverlayOnMouseOut: true,
+
+ legend: 'onmouseover',
+ stepPlot: false,
+ avoidMinZero: false,
+ xRangePad: 0,
+ yRangePad: null,
+ drawAxesAtZero: false,
+
+ // Sizes of the various chart labels.
+ titleHeight: 28,
+ xLabelHeight: 18,
+ yLabelWidth: 18,
+
+ drawXAxis: true,
+ drawYAxis: true,
+ axisLineColor: "black",
+ axisLineWidth: 0.3,
+ gridLineWidth: 0.3,
+ axisLabelColor: "black",
+ axisLabelWidth: 50,
+ drawYGrid: true,
+ drawXGrid: true,
+ gridLineColor: "rgb(128,128,128)",
+
+ interactionModel: null, // will be set to Dygraph.Interaction.defaultModel
+ animatedZooms: false, // (for now)
+
+ // Range selector options
+ showRangeSelector: false,
+ rangeSelectorHeight: 40,
+ rangeSelectorPlotStrokeColor: "#808FAB",
+ rangeSelectorPlotFillColor: "#A7B1C4",
+ showInRangeSelector: null,
+
+ // The ordering here ensures that central lines always appear above any
+ // fill bars/error bars.
+ plotter: [
+ Dygraph.Plotters.fillPlotter,
+ Dygraph.Plotters.errorPlotter,
+ Dygraph.Plotters.linePlotter
+ ],
+
+ plugins: [ ],
+
+ // per-axis options
+ axes: {
+ x: {
+ pixelsPerLabel: 70,
+ axisLabelWidth: 60,
+ axisLabelFormatter: Dygraph.dateAxisLabelFormatter,
+ valueFormatter: Dygraph.dateValueFormatter,
+ drawGrid: true,
+ drawAxis: true,
+ independentTicks: true,
+ ticker: null // will be set in dygraph-tickers.js
+ },
+ y: {
+ axisLabelWidth: 50,
+ pixelsPerLabel: 30,
+ valueFormatter: Dygraph.numberValueFormatter,
+ axisLabelFormatter: Dygraph.numberAxisLabelFormatter,
+ drawGrid: true,
+ drawAxis: true,
+ independentTicks: true,
+ ticker: null // will be set in dygraph-tickers.js
+ },
+ y2: {
+ axisLabelWidth: 50,
+ pixelsPerLabel: 30,
+ valueFormatter: Dygraph.numberValueFormatter,
+ axisLabelFormatter: Dygraph.numberAxisLabelFormatter,
+ drawAxis: true, // only applies when there are two axes of data.
+ drawGrid: false,
+ independentTicks: false,
+ ticker: null // will be set in dygraph-tickers.js
+ }
+ }
+};
+
+// Directions for panning and zooming. Use bit operations when combined
+// values are possible.
+Dygraph.HORIZONTAL = 1;
+Dygraph.VERTICAL = 2;
+
+// Installed plugins, in order of precedence (most-general to most-specific).
+// Plugins are installed after they are defined, in plugins/install.js.
+Dygraph.PLUGINS = [
+];
+
+// Used for initializing annotation CSS rules only once.
+Dygraph.addedAnnotationCSS = false;
+
+Dygraph.prototype.__old_init__ = function(div, file, labels, attrs) {
+ // Labels is no longer a constructor parameter, since it's typically set
+ // directly from the data source. It also conains a name for the x-axis,
+ // which the previous constructor form did not.
+ if (labels !== null) {
+ var new_labels = ["Date"];
+ for (var i = 0; i < labels.length; i++) new_labels.push(labels[i]);
+ Dygraph.update(attrs, { 'labels': new_labels });
+ }
+ this.__init__(div, file, attrs);
+};
+
+/**
+ * Initializes the Dygraph. This creates a new DIV and constructs the PlotKit
+ * and context &lt;canvas&gt; inside of it. See the constructor for details.
+ * on the parameters.
+ * @param {Element} div the Element to render the graph into.
+ * @param {string | Function} file Source data
+ * @param {Object} attrs Miscellaneous other options
+ * @private
+ */
+Dygraph.prototype.__init__ = function(div, file, attrs) {
+ // Hack for IE: if we're using excanvas and the document hasn't finished
+ // loading yet (and hence may not have initialized whatever it needs to
+ // initialize), then keep calling this routine periodically until it has.
+ if (/MSIE/.test(navigator.userAgent) && !window.opera &&
+ typeof(G_vmlCanvasManager) != 'undefined' &&
+ document.readyState != 'complete') {
+ var self = this;
+ setTimeout(function() { self.__init__(div, file, attrs); }, 100);
+ return;
+ }
+
+ // Support two-argument constructor
+ if (attrs === null || attrs === undefined) { attrs = {}; }
+
+ attrs = Dygraph.mapLegacyOptions_(attrs);
+
+ if (typeof(div) == 'string') {
+ div = document.getElementById(div);
+ }
+
+ if (!div) {
+ console.error("Constructing dygraph with a non-existent div!");
+ return;
+ }
+
+ this.isUsingExcanvas_ = typeof(G_vmlCanvasManager) != 'undefined';
+
+ // Copy the important bits into the object
+ // TODO(danvk): most of these should just stay in the attrs_ dictionary.
+ this.maindiv_ = div;
+ this.file_ = file;
+ this.rollPeriod_ = attrs.rollPeriod || Dygraph.DEFAULT_ROLL_PERIOD;
+ this.previousVerticalX_ = -1;
+ this.fractions_ = attrs.fractions || false;
+ this.dateWindow_ = attrs.dateWindow || null;
+
+ this.annotations_ = [];
+
+ // Zoomed indicators - These indicate when the graph has been zoomed and on what axis.
+ this.zoomed_x_ = false;
+ this.zoomed_y_ = false;
+
+ // Clear the div. This ensure that, if multiple dygraphs are passed the same
+ // div, then only one will be drawn.
+ div.innerHTML = "";
+
+ // For historical reasons, the 'width' and 'height' options trump all CSS
+ // rules _except_ for an explicit 'width' or 'height' on the div.
+ // As an added convenience, if the div has zero height (like <div></div> does
+ // without any styles), then we use a default height/width.
+ if (div.style.width === '' && attrs.width) {
+ div.style.width = attrs.width + "px";
+ }
+ if (div.style.height === '' && attrs.height) {
+ div.style.height = attrs.height + "px";
+ }
+ if (div.style.height === '' && div.clientHeight === 0) {
+ div.style.height = Dygraph.DEFAULT_HEIGHT + "px";
+ if (div.style.width === '') {
+ div.style.width = Dygraph.DEFAULT_WIDTH + "px";
+ }
+ }
+ // These will be zero if the dygraph's div is hidden. In that case,
+ // use the user-specified attributes if present. If not, use zero
+ // and assume the user will call resize to fix things later.
+ this.width_ = div.clientWidth || attrs.width || 0;
+ this.height_ = div.clientHeight || attrs.height || 0;
+
+ // TODO(danvk): set fillGraph to be part of attrs_ here, not user_attrs_.
+ if (attrs.stackedGraph) {
+ attrs.fillGraph = true;
+ // TODO(nikhilk): Add any other stackedGraph checks here.
+ }
+
+ // DEPRECATION WARNING: All option processing should be moved from
+ // attrs_ and user_attrs_ to options_, which holds all this information.
+ //
+ // Dygraphs has many options, some of which interact with one another.
+ // To keep track of everything, we maintain two sets of options:
+ //
+ // this.user_attrs_ only options explicitly set by the user.
+ // this.attrs_ defaults, options derived from user_attrs_, data.
+ //
+ // Options are then accessed this.attr_('attr'), which first looks at
+ // user_attrs_ and then computed attrs_. This way Dygraphs can set intelligent
+ // defaults without overriding behavior that the user specifically asks for.
+ this.user_attrs_ = {};
+ Dygraph.update(this.user_attrs_, attrs);
+
+ // This sequence ensures that Dygraph.DEFAULT_ATTRS is never modified.
+ this.attrs_ = {};
+ Dygraph.updateDeep(this.attrs_, Dygraph.DEFAULT_ATTRS);
+
+ this.boundaryIds_ = [];
+ this.setIndexByName_ = {};
+ this.datasetIndex_ = [];
+
+ this.registeredEvents_ = [];
+ this.eventListeners_ = {};
+
+ this.attributes_ = new DygraphOptions(this);
+
+ // Create the containing DIV and other interactive elements
+ this.createInterface_();
+
+ // Activate plugins.
+ this.plugins_ = [];
+ var plugins = Dygraph.PLUGINS.concat(this.getOption('plugins'));
+ for (var i = 0; i < plugins.length; i++) {
+ // the plugins option may contain either plugin classes or instances.
+ // Plugin instances contain an activate method.
+ var Plugin = plugins[i]; // either a constructor or an instance.
+ var pluginInstance;
+ if (typeof(Plugin.activate) !== 'undefined') {
+ pluginInstance = Plugin;
+ } else {
+ pluginInstance = new Plugin();
+ }
+
+ var pluginDict = {
+ plugin: pluginInstance,
+ events: {},
+ options: {},
+ pluginOptions: {}
+ };
+
+ var handlers = pluginInstance.activate(this);
+ for (var eventName in handlers) {
+ if (!handlers.hasOwnProperty(eventName)) continue;
+ // TODO(danvk): validate eventName.
+ pluginDict.events[eventName] = handlers[eventName];
+ }
+
+ this.plugins_.push(pluginDict);
+ }
+
+ // At this point, plugins can no longer register event handlers.
+ // Construct a map from event -> ordered list of [callback, plugin].
+ for (var i = 0; i < this.plugins_.length; i++) {
+ var plugin_dict = this.plugins_[i];
+ for (var eventName in plugin_dict.events) {
+ if (!plugin_dict.events.hasOwnProperty(eventName)) continue;
+ var callback = plugin_dict.events[eventName];
+
+ var pair = [plugin_dict.plugin, callback];
+ if (!(eventName in this.eventListeners_)) {
+ this.eventListeners_[eventName] = [pair];
+ } else {
+ this.eventListeners_[eventName].push(pair);
+ }
+ }
+ }
+
+ this.createDragInterface_();
+
+ this.start_();
+};
+
+/**
+ * Triggers a cascade of events to the various plugins which are interested in them.
+ * Returns true if the "default behavior" should be prevented, i.e. if one
+ * of the event listeners called event.preventDefault().
+ * @private
+ */
+Dygraph.prototype.cascadeEvents_ = function(name, extra_props) {
+ if (!(name in this.eventListeners_)) return false;
+
+ // QUESTION: can we use objects & prototypes to speed this up?
+ var e = {
+ dygraph: this,
+ cancelable: false,
+ defaultPrevented: false,
+ preventDefault: function() {
+ if (!e.cancelable) throw "Cannot call preventDefault on non-cancelable event.";
+ e.defaultPrevented = true;
+ },
+ propagationStopped: false,
+ stopPropagation: function() {
+ e.propagationStopped = true;
+ }
+ };
+ Dygraph.update(e, extra_props);
+
+ var callback_plugin_pairs = this.eventListeners_[name];
+ if (callback_plugin_pairs) {
+ for (var i = callback_plugin_pairs.length - 1; i >= 0; i--) {
+ var plugin = callback_plugin_pairs[i][0];
+ var callback = callback_plugin_pairs[i][1];
+ callback.call(plugin, e);
+ if (e.propagationStopped) break;
+ }
+ }
+ return e.defaultPrevented;
+};
+
+/**
+ * Fetch a plugin instance of a particular class. Only for testing.
+ * @private
+ * @param {!Class} type The type of the plugin.
+ * @return {Object} Instance of the plugin, or null if there is none.
+ */
+Dygraph.prototype.getPluginInstance_ = function(type) {
+ for (var i = 0; i < this.plugins_.length; i++) {
+ var p = this.plugins_[i];
+ if (p.plugin instanceof type) {
+ return p.plugin;
+ }
+ }
+ return null;
+};
+
+/**
+ * Returns the zoomed status of the chart for one or both axes.
+ *
+ * Axis is an optional parameter. Can be set to 'x' or 'y'.
+ *
+ * The zoomed status for an axis is set whenever a user zooms using the mouse
+ * or when the dateWindow or valueRange are updated (unless the
+ * isZoomedIgnoreProgrammaticZoom option is also specified).
+ */
+Dygraph.prototype.isZoomed = function(axis) {
+ if (axis === null || axis === undefined) {
+ return this.zoomed_x_ || this.zoomed_y_;
+ }
+ if (axis === 'x') return this.zoomed_x_;
+ if (axis === 'y') return this.zoomed_y_;
+ throw "axis parameter is [" + axis + "] must be null, 'x' or 'y'.";
+};
+
+/**
+ * Returns information about the Dygraph object, including its containing ID.
+ */
+Dygraph.prototype.toString = function() {
+ var maindiv = this.maindiv_;
+ var id = (maindiv && maindiv.id) ? maindiv.id : maindiv;
+ return "[Dygraph " + id + "]";
+};
+
+/**
+ * @private
+ * Returns the value of an option. This may be set by the user (either in the
+ * constructor or by calling updateOptions) or by dygraphs, and may be set to a
+ * per-series value.
+ * @param {string} name The name of the option, e.g. 'rollPeriod'.
+ * @param {string} [seriesName] The name of the series to which the option
+ * will be applied. If no per-series value of this option is available, then
+ * the global value is returned. This is optional.
+ * @return { ... } The value of the option.
+ */
+Dygraph.prototype.attr_ = function(name, seriesName) {
+ if (DEBUG) {
+ if (typeof(Dygraph.OPTIONS_REFERENCE) === 'undefined') {
+ console.error('Must include options reference JS for testing');
+ } else if (!Dygraph.OPTIONS_REFERENCE.hasOwnProperty(name)) {
+ console.error('Dygraphs is using property ' + name + ', which has no ' +
+ 'entry in the Dygraphs.OPTIONS_REFERENCE listing.');
+ // Only log this error once.
+ Dygraph.OPTIONS_REFERENCE[name] = true;
+ }
+ }
+ return seriesName ? this.attributes_.getForSeries(name, seriesName) : this.attributes_.get(name);
+};
+
+/**
+ * Returns the current value for an option, as set in the constructor or via
+ * updateOptions. You may pass in an (optional) series name to get per-series
+ * values for the option.
+ *
+ * All values returned by this method should be considered immutable. If you
+ * modify them, there is no guarantee that the changes will be honored or that
+ * dygraphs will remain in a consistent state. If you want to modify an option,
+ * use updateOptions() instead.
+ *
+ * @param {string} name The name of the option (e.g. 'strokeWidth')
+ * @param {string=} opt_seriesName Series name to get per-series values.
+ * @return {*} The value of the option.
+ */
+Dygraph.prototype.getOption = function(name, opt_seriesName) {
+ return this.attr_(name, opt_seriesName);
+};
+
+/**
+ * Like getOption(), but specifically returns a number.
+ * This is a convenience function for working with the Closure Compiler.
+ * @param {string} name The name of the option (e.g. 'strokeWidth')
+ * @param {string=} opt_seriesName Series name to get per-series values.
+ * @return {number} The value of the option.
+ * @private
+ */
+Dygraph.prototype.getNumericOption = function(name, opt_seriesName) {
+ return /** @type{number} */(this.getOption(name, opt_seriesName));
+};
+
+/**
+ * Like getOption(), but specifically returns a string.
+ * This is a convenience function for working with the Closure Compiler.
+ * @param {string} name The name of the option (e.g. 'strokeWidth')
+ * @param {string=} opt_seriesName Series name to get per-series values.
+ * @return {string} The value of the option.
+ * @private
+ */
+Dygraph.prototype.getStringOption = function(name, opt_seriesName) {
+ return /** @type{string} */(this.getOption(name, opt_seriesName));
+};
+
+/**
+ * Like getOption(), but specifically returns a boolean.
+ * This is a convenience function for working with the Closure Compiler.
+ * @param {string} name The name of the option (e.g. 'strokeWidth')
+ * @param {string=} opt_seriesName Series name to get per-series values.
+ * @return {boolean} The value of the option.
+ * @private
+ */
+Dygraph.prototype.getBooleanOption = function(name, opt_seriesName) {
+ return /** @type{boolean} */(this.getOption(name, opt_seriesName));
+};
+
+/**
+ * Like getOption(), but specifically returns a function.
+ * This is a convenience function for working with the Closure Compiler.
+ * @param {string} name The name of the option (e.g. 'strokeWidth')
+ * @param {string=} opt_seriesName Series name to get per-series values.
+ * @return {function(...)} The value of the option.
+ * @private
+ */
+Dygraph.prototype.getFunctionOption = function(name, opt_seriesName) {
+ return /** @type{function(...)} */(this.getOption(name, opt_seriesName));
+};
+
+Dygraph.prototype.getOptionForAxis = function(name, axis) {
+ return this.attributes_.getForAxis(name, axis);
+};
+
+/**
+ * @private
+ * @param {string} axis The name of the axis (i.e. 'x', 'y' or 'y2')
+ * @return { ... } A function mapping string -> option value
+ */
+Dygraph.prototype.optionsViewForAxis_ = function(axis) {
+ var self = this;
+ return function(opt) {
+ var axis_opts = self.user_attrs_.axes;
+ if (axis_opts && axis_opts[axis] && axis_opts[axis].hasOwnProperty(opt)) {
+ return axis_opts[axis][opt];
+ }
+
+ // I don't like that this is in a second spot.
+ if (axis === 'x' && opt === 'logscale') {
+ // return the default value.
+ // TODO(konigsberg): pull the default from a global default.
+ return false;
+ }
+
+ // user-specified attributes always trump defaults, even if they're less
+ // specific.
+ if (typeof(self.user_attrs_[opt]) != 'undefined') {
+ return self.user_attrs_[opt];
+ }
+
+ axis_opts = self.attrs_.axes;
+ if (axis_opts && axis_opts[axis] && axis_opts[axis].hasOwnProperty(opt)) {
+ return axis_opts[axis][opt];
+ }
+ // check old-style axis options
+ // TODO(danvk): add a deprecation warning if either of these match.
+ if (axis == 'y' && self.axes_[0].hasOwnProperty(opt)) {
+ return self.axes_[0][opt];
+ } else if (axis == 'y2' && self.axes_[1].hasOwnProperty(opt)) {
+ return self.axes_[1][opt];
+ }
+ return self.attr_(opt);
+ };
+};
+
+/**
+ * Returns the current rolling period, as set by the user or an option.
+ * @return {number} The number of points in the rolling window
+ */
+Dygraph.prototype.rollPeriod = function() {
+ return this.rollPeriod_;
+};
+
+/**
+ * Returns the currently-visible x-range. This can be affected by zooming,
+ * panning or a call to updateOptions.
+ * Returns a two-element array: [left, right].
+ * If the Dygraph has dates on the x-axis, these will be millis since epoch.
+ */
+Dygraph.prototype.xAxisRange = function() {
+ return this.dateWindow_ ? this.dateWindow_ : this.xAxisExtremes();
+};
+
+/**
+ * Returns the lower- and upper-bound x-axis values of the
+ * data set.
+ */
+Dygraph.prototype.xAxisExtremes = function() {
+ var pad = this.getNumericOption('xRangePad') / this.plotter_.area.w;
+ if (this.numRows() === 0) {
+ return [0 - pad, 1 + pad];
+ }
+ var left = this.rawData_[0][0];
+ var right = this.rawData_[this.rawData_.length - 1][0];
+ if (pad) {
+ // Must keep this in sync with dygraph-layout _evaluateLimits()
+ var range = right - left;
+ left -= range * pad;
+ right += range * pad;
+ }
+ return [left, right];
+};
+
+/**
+ * Returns the currently-visible y-range for an axis. This can be affected by
+ * zooming, panning or a call to updateOptions. Axis indices are zero-based. If
+ * called with no arguments, returns the range of the first axis.
+ * Returns a two-element array: [bottom, top].
+ */
+Dygraph.prototype.yAxisRange = function(idx) {
+ if (typeof(idx) == "undefined") idx = 0;
+ if (idx < 0 || idx >= this.axes_.length) {
+ return null;
+ }
+ var axis = this.axes_[idx];
+ return [ axis.computedValueRange[0], axis.computedValueRange[1] ];
+};
+
+/**
+ * Returns the currently-visible y-ranges for each axis. This can be affected by
+ * zooming, panning, calls to updateOptions, etc.
+ * Returns an array of [bottom, top] pairs, one for each y-axis.
+ */
+Dygraph.prototype.yAxisRanges = function() {
+ var ret = [];
+ for (var i = 0; i < this.axes_.length; i++) {
+ ret.push(this.yAxisRange(i));
+ }
+ return ret;
+};
+
+// TODO(danvk): use these functions throughout dygraphs.
+/**
+ * Convert from data coordinates to canvas/div X/Y coordinates.
+ * If specified, do this conversion for the coordinate system of a particular
+ * axis. Uses the first axis by default.
+ * Returns a two-element array: [X, Y]
+ *
+ * Note: use toDomXCoord instead of toDomCoords(x, null) and use toDomYCoord
+ * instead of toDomCoords(null, y, axis).
+ */
+Dygraph.prototype.toDomCoords = function(x, y, axis) {
+ return [ this.toDomXCoord(x), this.toDomYCoord(y, axis) ];
+};
+
+/**
+ * Convert from data x coordinates to canvas/div X coordinate.
+ * If specified, do this conversion for the coordinate system of a particular
+ * axis.
+ * Returns a single value or null if x is null.
+ */
+Dygraph.prototype.toDomXCoord = function(x) {
+ if (x === null) {
+ return null;
+ }
+
+ var area = this.plotter_.area;
+ var xRange = this.xAxisRange();
+ return area.x + (x - xRange[0]) / (xRange[1] - xRange[0]) * area.w;
+};
+
+/**
+ * Convert from data x coordinates to canvas/div Y coordinate and optional
+ * axis. Uses the first axis by default.
+ *
+ * returns a single value or null if y is null.
+ */
+Dygraph.prototype.toDomYCoord = function(y, axis) {
+ var pct = this.toPercentYCoord(y, axis);
+
+ if (pct === null) {
+ return null;
+ }
+ var area = this.plotter_.area;
+ return area.y + pct * area.h;
+};
+
+/**
+ * Convert from canvas/div coords to data coordinates.
+ * If specified, do this conversion for the coordinate system of a particular
+ * axis. Uses the first axis by default.
+ * Returns a two-element array: [X, Y].
+ *
+ * Note: use toDataXCoord instead of toDataCoords(x, null) and use toDataYCoord
+ * instead of toDataCoords(null, y, axis).
+ */
+Dygraph.prototype.toDataCoords = function(x, y, axis) {
+ return [ this.toDataXCoord(x), this.toDataYCoord(y, axis) ];
+};
+
+/**
+ * Convert from canvas/div x coordinate to data coordinate.
+ *
+ * If x is null, this returns null.
+ */
+Dygraph.prototype.toDataXCoord = function(x) {
+ if (x === null) {
+ return null;
+ }
+
+ var area = this.plotter_.area;
+ var xRange = this.xAxisRange();
+
+ if (!this.attributes_.getForAxis("logscale", 'x')) {
+ return xRange[0] + (x - area.x) / area.w * (xRange[1] - xRange[0]);
+ } else {
+ // TODO: remove duplicate code?
+ // Computing the inverse of toDomCoord.
+ var pct = (x - area.x) / area.w;
+
+ // Computing the inverse of toPercentXCoord. The function was arrived at with
+ // the following steps:
+ //
+ // Original calcuation:
+ // pct = (log(x) - log(xRange[0])) / (log(xRange[1]) - log(xRange[0])));
+ //
+ // Multiply both sides by the right-side demoninator.
+ // pct * (log(xRange[1] - log(xRange[0]))) = log(x) - log(xRange[0])
+ //
+ // add log(xRange[0]) to both sides
+ // log(xRange[0]) + (pct * (log(xRange[1]) - log(xRange[0])) = log(x);
+ //
+ // Swap both sides of the equation,
+ // log(x) = log(xRange[0]) + (pct * (log(xRange[1]) - log(xRange[0]))
+ //
+ // Use both sides as the exponent in 10^exp and we're done.
+ // x = 10 ^ (log(xRange[0]) + (pct * (log(xRange[1]) - log(xRange[0])))
+ var logr0 = Dygraph.log10(xRange[0]);
+ var logr1 = Dygraph.log10(xRange[1]);
+ var exponent = logr0 + (pct * (logr1 - logr0));
+ var value = Math.pow(Dygraph.LOG_SCALE, exponent);
+ return value;
+ }
+};
+
+/**
+ * Convert from canvas/div y coord to value.
+ *
+ * If y is null, this returns null.
+ * if axis is null, this uses the first axis.
+ */
+Dygraph.prototype.toDataYCoord = function(y, axis) {
+ if (y === null) {
+ return null;
+ }
+
+ var area = this.plotter_.area;
+ var yRange = this.yAxisRange(axis);
+
+ if (typeof(axis) == "undefined") axis = 0;
+ if (!this.attributes_.getForAxis("logscale", axis)) {
+ return yRange[0] + (area.y + area.h - y) / area.h * (yRange[1] - yRange[0]);
+ } else {
+ // Computing the inverse of toDomCoord.
+ var pct = (y - area.y) / area.h;
+
+ // Computing the inverse of toPercentYCoord. The function was arrived at with
+ // the following steps:
+ //
+ // Original calcuation:
+ // pct = (log(yRange[1]) - log(y)) / (log(yRange[1]) - log(yRange[0]));
+ //
+ // Multiply both sides by the right-side demoninator.
+ // pct * (log(yRange[1]) - log(yRange[0])) = log(yRange[1]) - log(y);
+ //
+ // subtract log(yRange[1]) from both sides.
+ // (pct * (log(yRange[1]) - log(yRange[0]))) - log(yRange[1]) = -log(y);
+ //
+ // and multiply both sides by -1.
+ // log(yRange[1]) - (pct * (logr1 - log(yRange[0])) = log(y);
+ //
+ // Swap both sides of the equation,
+ // log(y) = log(yRange[1]) - (pct * (log(yRange[1]) - log(yRange[0])));
+ //
+ // Use both sides as the exponent in 10^exp and we're done.
+ // y = 10 ^ (log(yRange[1]) - (pct * (log(yRange[1]) - log(yRange[0]))));
+ var logr0 = Dygraph.log10(yRange[0]);
+ var logr1 = Dygraph.log10(yRange[1]);
+ var exponent = logr1 - (pct * (logr1 - logr0));
+ var value = Math.pow(Dygraph.LOG_SCALE, exponent);
+ return value;
+ }
+};
+
+/**
+ * Converts a y for an axis to a percentage from the top to the
+ * bottom of the drawing area.
+ *
+ * If the coordinate represents a value visible on the canvas, then
+ * the value will be between 0 and 1, where 0 is the top of the canvas.
+ * However, this method will return values outside the range, as
+ * values can fall outside the canvas.
+ *
+ * If y is null, this returns null.
+ * if axis is null, this uses the first axis.
+ *
+ * @param {number} y The data y-coordinate.
+ * @param {number} [axis] The axis number on which the data coordinate lives.
+ * @return {number} A fraction in [0, 1] where 0 = the top edge.
+ */
+Dygraph.prototype.toPercentYCoord = function(y, axis) {
+ if (y === null) {
+ return null;
+ }
+ if (typeof(axis) == "undefined") axis = 0;
+
+ var yRange = this.yAxisRange(axis);
+
+ var pct;
+ var logscale = this.attributes_.getForAxis("logscale", axis);
+ if (logscale) {
+ var logr0 = Dygraph.log10(yRange[0]);
+ var logr1 = Dygraph.log10(yRange[1]);
+ pct = (logr1 - Dygraph.log10(y)) / (logr1 - logr0);
+ } else {
+ // yRange[1] - y is unit distance from the bottom.
+ // yRange[1] - yRange[0] is the scale of the range.
+ // (yRange[1] - y) / (yRange[1] - yRange[0]) is the % from the bottom.
+ pct = (yRange[1] - y) / (yRange[1] - yRange[0]);
+ }
+ return pct;
+};
+
+/**
+ * Converts an x value to a percentage from the left to the right of
+ * the drawing area.
+ *
+ * If the coordinate represents a value visible on the canvas, then
+ * the value will be between 0 and 1, where 0 is the left of the canvas.
+ * However, this method will return values outside the range, as
+ * values can fall outside the canvas.
+ *
+ * If x is null, this returns null.
+ * @param {number} x The data x-coordinate.
+ * @return {number} A fraction in [0, 1] where 0 = the left edge.
+ */
+Dygraph.prototype.toPercentXCoord = function(x) {
+ if (x === null) {
+ return null;
+ }
+
+ var xRange = this.xAxisRange();
+ var pct;
+ var logscale = this.attributes_.getForAxis("logscale", 'x') ;
+ if (logscale === true) { // logscale can be null so we test for true explicitly.
+ var logr0 = Dygraph.log10(xRange[0]);
+ var logr1 = Dygraph.log10(xRange[1]);
+ pct = (Dygraph.log10(x) - logr0) / (logr1 - logr0);
+ } else {
+ // x - xRange[0] is unit distance from the left.
+ // xRange[1] - xRange[0] is the scale of the range.
+ // The full expression below is the % from the left.
+ pct = (x - xRange[0]) / (xRange[1] - xRange[0]);
+ }
+ return pct;
+};
+
+/**
+ * Returns the number of columns (including the independent variable).
+ * @return {number} The number of columns.
+ */
+Dygraph.prototype.numColumns = function() {
+ if (!this.rawData_) return 0;
+ return this.rawData_[0] ? this.rawData_[0].length : this.attr_("labels").length;
+};
+
+/**
+ * Returns the number of rows (excluding any header/label row).
+ * @return {number} The number of rows, less any header.
+ */
+Dygraph.prototype.numRows = function() {
+ if (!this.rawData_) return 0;
+ return this.rawData_.length;
+};
+
+/**
+ * Returns the value in the given row and column. If the row and column exceed
+ * the bounds on the data, returns null. Also returns null if the value is
+ * missing.
+ * @param {number} row The row number of the data (0-based). Row 0 is the
+ * first row of data, not a header row.
+ * @param {number} col The column number of the data (0-based)
+ * @return {number} The value in the specified cell or null if the row/col
+ * were out of range.
+ */
+Dygraph.prototype.getValue = function(row, col) {
+ if (row < 0 || row > this.rawData_.length) return null;
+ if (col < 0 || col > this.rawData_[row].length) return null;
+
+ return this.rawData_[row][col];
+};
+
+/**
+ * Generates interface elements for the Dygraph: a containing div, a div to
+ * display the current point, and a textbox to adjust the rolling average
+ * period. Also creates the Renderer/Layout elements.
+ * @private
+ */
+Dygraph.prototype.createInterface_ = function() {
+ // Create the all-enclosing graph div
+ var enclosing = this.maindiv_;
+
+ this.graphDiv = document.createElement("div");
+
+ // TODO(danvk): any other styles that are useful to set here?
+ this.graphDiv.style.textAlign = 'left'; // This is a CSS "reset"
+ this.graphDiv.style.position = 'relative';
+ enclosing.appendChild(this.graphDiv);
+
+ // Create the canvas for interactive parts of the chart.
+ this.canvas_ = Dygraph.createCanvas();
+ this.canvas_.style.position = "absolute";
+
+ // ... and for static parts of the chart.
+ this.hidden_ = this.createPlotKitCanvas_(this.canvas_);
+
+ this.canvas_ctx_ = Dygraph.getContext(this.canvas_);
+ this.hidden_ctx_ = Dygraph.getContext(this.hidden_);
+
+ this.resizeElements_();
+
+ // The interactive parts of the graph are drawn on top of the chart.
+ this.graphDiv.appendChild(this.hidden_);
+ this.graphDiv.appendChild(this.canvas_);
+ this.mouseEventElement_ = this.createMouseEventElement_();
+
+ // Create the grapher
+ this.layout_ = new DygraphLayout(this);
+
+ var dygraph = this;
+
+ this.mouseMoveHandler_ = function(e) {
+ dygraph.mouseMove_(e);
+ };
+
+ this.mouseOutHandler_ = function(e) {
+ // The mouse has left the chart if:
+ // 1. e.target is inside the chart
+ // 2. e.relatedTarget is outside the chart
+ var target = e.target || e.fromElement;
+ var relatedTarget = e.relatedTarget || e.toElement;
+ if (Dygraph.isNodeContainedBy(target, dygraph.graphDiv) &&
+ !Dygraph.isNodeContainedBy(relatedTarget, dygraph.graphDiv)) {
+ dygraph.mouseOut_(e);
+ }
+ };
+
+ this.addAndTrackEvent(window, 'mouseout', this.mouseOutHandler_);
+ this.addAndTrackEvent(this.mouseEventElement_, 'mousemove', this.mouseMoveHandler_);
+
+ // Don't recreate and register the resize handler on subsequent calls.
+ // This happens when the graph is resized.
+ if (!this.resizeHandler_) {
+ this.resizeHandler_ = function(e) {
+ dygraph.resize();
+ };
+
+ // Update when the window is resized.
+ // TODO(danvk): drop frames depending on complexity of the chart.
+ this.addAndTrackEvent(window, 'resize', this.resizeHandler_);
+ }
+};
+
+Dygraph.prototype.resizeElements_ = function() {
+ this.graphDiv.style.width = this.width_ + "px";
+ this.graphDiv.style.height = this.height_ + "px";
+
+ var canvasScale = Dygraph.getContextPixelRatio(this.canvas_ctx_);
+ this.canvas_.width = this.width_ * canvasScale;
+ this.canvas_.height = this.height_ * canvasScale;
+ this.canvas_.style.width = this.width_ + "px"; // for IE
+ this.canvas_.style.height = this.height_ + "px"; // for IE
+ if (canvasScale !== 1) {
+ this.canvas_ctx_.scale(canvasScale, canvasScale);
+ }
+
+ var hiddenScale = Dygraph.getContextPixelRatio(this.hidden_ctx_);
+ this.hidden_.width = this.width_ * hiddenScale;
+ this.hidden_.height = this.height_ * hiddenScale;
+ this.hidden_.style.width = this.width_ + "px"; // for IE
+ this.hidden_.style.height = this.height_ + "px"; // for IE
+ if (hiddenScale !== 1) {
+ this.hidden_ctx_.scale(hiddenScale, hiddenScale);
+ }
+};
+
+/**
+ * Detach DOM elements in the dygraph and null out all data references.
+ * Calling this when you're done with a dygraph can dramatically reduce memory
+ * usage. See, e.g., the tests/perf.html example.
+ */
+Dygraph.prototype.destroy = function() {
+ this.canvas_ctx_.restore();
+ this.hidden_ctx_.restore();
+
+ // Destroy any plugins, in the reverse order that they were registered.
+ for (var i = this.plugins_.length - 1; i >= 0; i--) {
+ var p = this.plugins_.pop();
+ if (p.plugin.destroy) p.plugin.destroy();
+ }
+
+ var removeRecursive = function(node) {
+ while (node.hasChildNodes()) {
+ removeRecursive(node.firstChild);
+ node.removeChild(node.firstChild);
+ }
+ };
+
+ this.removeTrackedEvents_();
+
+ // remove mouse event handlers (This may not be necessary anymore)
+ Dygraph.removeEvent(window, 'mouseout', this.mouseOutHandler_);
+ Dygraph.removeEvent(this.mouseEventElement_, 'mousemove', this.mouseMoveHandler_);
+
+ // remove window handlers
+ Dygraph.removeEvent(window,'resize', this.resizeHandler_);
+ this.resizeHandler_ = null;
+
+ removeRecursive(this.maindiv_);
+
+ var nullOut = function(obj) {
+ for (var n in obj) {
+ if (typeof(obj[n]) === 'object') {
+ obj[n] = null;
+ }
+ }
+ };
+ // These may not all be necessary, but it can't hurt...
+ nullOut(this.layout_);
+ nullOut(this.plotter_);
+ nullOut(this);
+};
+
+/**
+ * Creates the canvas on which the chart will be drawn. Only the Renderer ever
+ * draws on this particular canvas. All Dygraph work (i.e. drawing hover dots
+ * or the zoom rectangles) is done on this.canvas_.
+ * @param {Object} canvas The Dygraph canvas over which to overlay the plot
+ * @return {Object} The newly-created canvas
+ * @private
+ */
+Dygraph.prototype.createPlotKitCanvas_ = function(canvas) {
+ var h = Dygraph.createCanvas();
+ h.style.position = "absolute";
+ // TODO(danvk): h should be offset from canvas. canvas needs to include
+ // some extra area to make it easier to zoom in on the far left and far
+ // right. h needs to be precisely the plot area, so that clipping occurs.
+ h.style.top = canvas.style.top;
+ h.style.left = canvas.style.left;
+ h.width = this.width_;
+ h.height = this.height_;
+ h.style.width = this.width_ + "px"; // for IE
+ h.style.height = this.height_ + "px"; // for IE
+ return h;
+};
+
+/**
+ * Creates an overlay element used to handle mouse events.
+ * @return {Object} The mouse event element.
+ * @private
+ */
+Dygraph.prototype.createMouseEventElement_ = function() {
+ if (this.isUsingExcanvas_) {
+ var elem = document.createElement("div");
+ elem.style.position = 'absolute';
+ elem.style.backgroundColor = 'white';
+ elem.style.filter = 'alpha(opacity=0)';
+ elem.style.width = this.width_ + "px";
+ elem.style.height = this.height_ + "px";
+ this.graphDiv.appendChild(elem);
+ return elem;
+ } else {
+ return this.canvas_;
+ }
+};
+
+/**
+ * Generate a set of distinct colors for the data series. This is done with a
+ * color wheel. Saturation/Value are customizable, and the hue is
+ * equally-spaced around the color wheel. If a custom set of colors is
+ * specified, that is used instead.
+ * @private
+ */
+Dygraph.prototype.setColors_ = function() {
+ var labels = this.getLabels();
+ var num = labels.length - 1;
+ this.colors_ = [];
+ this.colorsMap_ = {};
+
+ // These are used for when no custom colors are specified.
+ var sat = this.getNumericOption('colorSaturation') || 1.0;
+ var val = this.getNumericOption('colorValue') || 0.5;
+ var half = Math.ceil(num / 2);
+
+ var colors = this.getOption('colors');
+ var visibility = this.visibility();
+ for (var i = 0; i < num; i++) {
+ if (!visibility[i]) {
+ continue;
+ }
+ var label = labels[i + 1];
+ var colorStr = this.attributes_.getForSeries('color', label);
+ if (!colorStr) {
+ if (colors) {
+ colorStr = colors[i % colors.length];
+ } else {
+ // alternate colors for high contrast.
+ var idx = i % 2 ? (half + (i + 1)/ 2) : Math.ceil((i + 1) / 2);
+ var hue = (1.0 * idx / (1 + num));
+ colorStr = Dygraph.hsvToRGB(hue, sat, val);
+ }
+ }
+ this.colors_.push(colorStr);
+ this.colorsMap_[label] = colorStr;
+ }
+};
+
+/**
+ * Return the list of colors. This is either the list of colors passed in the
+ * attributes or the autogenerated list of rgb(r,g,b) strings.
+ * This does not return colors for invisible series.
+ * @return {Array.<string>} The list of colors.
+ */
+Dygraph.prototype.getColors = function() {
+ return this.colors_;
+};
+
+/**
+ * Returns a few attributes of a series, i.e. its color, its visibility, which
+ * axis it's assigned to, and its column in the original data.
+ * Returns null if the series does not exist.
+ * Otherwise, returns an object with column, visibility, color and axis properties.
+ * The "axis" property will be set to 1 for y1 and 2 for y2.
+ * The "column" property can be fed back into getValue(row, column) to get
+ * values for this series.
+ */
+Dygraph.prototype.getPropertiesForSeries = function(series_name) {
+ var idx = -1;
+ var labels = this.getLabels();
+ for (var i = 1; i < labels.length; i++) {
+ if (labels[i] == series_name) {
+ idx = i;
+ break;
+ }
+ }
+ if (idx == -1) return null;
+
+ return {
+ name: series_name,
+ column: idx,
+ visible: this.visibility()[idx - 1],
+ color: this.colorsMap_[series_name],
+ axis: 1 + this.attributes_.axisForSeries(series_name)
+ };
+};
+
+/**
+ * Create the text box to adjust the averaging period
+ * @private
+ */
+Dygraph.prototype.createRollInterface_ = function() {
+ // Create a roller if one doesn't exist already.
+ if (!this.roller_) {
+ this.roller_ = document.createElement("input");
+ this.roller_.type = "text";
+ this.roller_.style.display = "none";
+ this.graphDiv.appendChild(this.roller_);
+ }
+
+ var display = this.getBooleanOption('showRoller') ? 'block' : 'none';
+
+ var area = this.plotter_.area;
+ var textAttr = { "position": "absolute",
+ "zIndex": 10,
+ "top": (area.y + area.h - 25) + "px",
+ "left": (area.x + 1) + "px",
+ "display": display
+ };
+ this.roller_.size = "2";
+ this.roller_.value = this.rollPeriod_;
+ for (var name in textAttr) {
+ if (textAttr.hasOwnProperty(name)) {
+ this.roller_.style[name] = textAttr[name];
+ }
+ }
+
+ var dygraph = this;
+ this.roller_.onchange = function() { dygraph.adjustRoll(dygraph.roller_.value); };
+};
+
+/**
+ * Set up all the mouse handlers needed to capture dragging behavior for zoom
+ * events.
+ * @private
+ */
+Dygraph.prototype.createDragInterface_ = function() {
+ var context = {
+ // Tracks whether the mouse is down right now
+ isZooming: false,
+ isPanning: false, // is this drag part of a pan?
+ is2DPan: false, // if so, is that pan 1- or 2-dimensional?
+ dragStartX: null, // pixel coordinates
+ dragStartY: null, // pixel coordinates
+ dragEndX: null, // pixel coordinates
+ dragEndY: null, // pixel coordinates
+ dragDirection: null,
+ prevEndX: null, // pixel coordinates
+ prevEndY: null, // pixel coordinates
+ prevDragDirection: null,
+ cancelNextDblclick: false, // see comment in dygraph-interaction-model.js
+
+ // The value on the left side of the graph when a pan operation starts.
+ initialLeftmostDate: null,
+
+ // The number of units each pixel spans. (This won't be valid for log
+ // scales)
+ xUnitsPerPixel: null,
+
+ // TODO(danvk): update this comment
+ // The range in second/value units that the viewport encompasses during a
+ // panning operation.
+ dateRange: null,
+
+ // Top-left corner of the canvas, in DOM coords
+ // TODO(konigsberg): Rename topLeftCanvasX, topLeftCanvasY.
+ px: 0,
+ py: 0,
+
+ // Values for use with panEdgeFraction, which limit how far outside the
+ // graph's data boundaries it can be panned.
+ boundedDates: null, // [minDate, maxDate]
+ boundedValues: null, // [[minValue, maxValue] ...]
+
+ // We cover iframes during mouse interactions. See comments in
+ // dygraph-utils.js for more info on why this is a good idea.
+ tarp: new Dygraph.IFrameTarp(),
+
+ // contextB is the same thing as this context object but renamed.
+ initializeMouseDown: function(event, g, contextB) {
+ // prevents mouse drags from selecting page text.
+ if (event.preventDefault) {
+ event.preventDefault(); // Firefox, Chrome, etc.
+ } else {
+ event.returnValue = false; // IE
+ event.cancelBubble = true;
+ }
+
+ var canvasPos = Dygraph.findPos(g.canvas_);
+ contextB.px = canvasPos.x;
+ contextB.py = canvasPos.y;
+ contextB.dragStartX = Dygraph.dragGetX_(event, contextB);
+ contextB.dragStartY = Dygraph.dragGetY_(event, contextB);
+ contextB.cancelNextDblclick = false;
+ contextB.tarp.cover();
+ },
+ destroy: function() {
+ var context = this;
+ if (context.isZooming || context.isPanning) {
+ context.isZooming = false;
+ context.dragStartX = null;
+ context.dragStartY = null;
+ }
+
+ if (context.isPanning) {
+ context.isPanning = false;
+ context.draggingDate = null;
+ context.dateRange = null;
+ for (var i = 0; i < self.axes_.length; i++) {
+ delete self.axes_[i].draggingValue;
+ delete self.axes_[i].dragValueRange;
+ }
+ }
+
+ context.tarp.uncover();
+ }
+ };
+
+ var interactionModel = this.getOption("interactionModel");
+
+ // Self is the graph.
+ var self = this;
+
+ // Function that binds the graph and context to the handler.
+ var bindHandler = function(handler) {
+ return function(event) {
+ handler(event, self, context);
+ };
+ };
+
+ for (var eventName in interactionModel) {
+ if (!interactionModel.hasOwnProperty(eventName)) continue;
+ this.addAndTrackEvent(this.mouseEventElement_, eventName,
+ bindHandler(interactionModel[eventName]));
+ }
+
+ // If the user releases the mouse button during a drag, but not over the
+ // canvas, then it doesn't count as a zooming action.
+ if (!interactionModel.willDestroyContextMyself) {
+ var mouseUpHandler = function(event) {
+ context.destroy();
+ };
+
+ this.addAndTrackEvent(document, 'mouseup', mouseUpHandler);
+ }
+};
+
+/**
+ * Draw a gray zoom rectangle over the desired area of the canvas. Also clears
+ * up any previous zoom rectangles that were drawn. This could be optimized to
+ * avoid extra redrawing, but it's tricky to avoid interactions with the status
+ * dots.
+ *
+ * @param {number} direction the direction of the zoom rectangle. Acceptable
+ * values are Dygraph.HORIZONTAL and Dygraph.VERTICAL.
+ * @param {number} startX The X position where the drag started, in canvas
+ * coordinates.
+ * @param {number} endX The current X position of the drag, in canvas coords.
+ * @param {number} startY The Y position where the drag started, in canvas
+ * coordinates.
+ * @param {number} endY The current Y position of the drag, in canvas coords.
+ * @param {number} prevDirection the value of direction on the previous call to
+ * this function. Used to avoid excess redrawing
+ * @param {number} prevEndX The value of endX on the previous call to this
+ * function. Used to avoid excess redrawing
+ * @param {number} prevEndY The value of endY on the previous call to this
+ * function. Used to avoid excess redrawing
+ * @private
+ */
+Dygraph.prototype.drawZoomRect_ = function(direction, startX, endX, startY,
+ endY, prevDirection, prevEndX,
+ prevEndY) {
+ var ctx = this.canvas_ctx_;
+
+ // Clean up from the previous rect if necessary
+ if (prevDirection == Dygraph.HORIZONTAL) {
+ ctx.clearRect(Math.min(startX, prevEndX), this.layout_.getPlotArea().y,
+ Math.abs(startX - prevEndX), this.layout_.getPlotArea().h);
+ } else if (prevDirection == Dygraph.VERTICAL) {
+ ctx.clearRect(this.layout_.getPlotArea().x, Math.min(startY, prevEndY),
+ this.layout_.getPlotArea().w, Math.abs(startY - prevEndY));
+ }
+
+ // Draw a light-grey rectangle to show the new viewing area
+ if (direction == Dygraph.HORIZONTAL) {
+ if (endX && startX) {
+ ctx.fillStyle = "rgba(128,128,128,0.33)";
+ ctx.fillRect(Math.min(startX, endX), this.layout_.getPlotArea().y,
+ Math.abs(endX - startX), this.layout_.getPlotArea().h);
+ }
+ } else if (direction == Dygraph.VERTICAL) {
+ if (endY && startY) {
+ ctx.fillStyle = "rgba(128,128,128,0.33)";
+ ctx.fillRect(this.layout_.getPlotArea().x, Math.min(startY, endY),
+ this.layout_.getPlotArea().w, Math.abs(endY - startY));
+ }
+ }
+
+ if (this.isUsingExcanvas_) {
+ this.currentZoomRectArgs_ = [direction, startX, endX, startY, endY, 0, 0, 0];
+ }
+};
+
+/**
+ * Clear the zoom rectangle (and perform no zoom).
+ * @private
+ */
+Dygraph.prototype.clearZoomRect_ = function() {
+ this.currentZoomRectArgs_ = null;
+ this.canvas_ctx_.clearRect(0, 0, this.width_, this.height_);
+};
+
+/**
+ * Zoom to something containing [lowX, highX]. These are pixel coordinates in
+ * the canvas. The exact zoom window may be slightly larger if there are no data
+ * points near lowX or highX. Don't confuse this function with doZoomXDates,
+ * which accepts dates that match the raw data. This function redraws the graph.
+ *
+ * @param {number} lowX The leftmost pixel value that should be visible.
+ * @param {number} highX The rightmost pixel value that should be visible.
+ * @private
+ */
+Dygraph.prototype.doZoomX_ = function(lowX, highX) {
+ this.currentZoomRectArgs_ = null;
+ // Find the earliest and latest dates contained in this canvasx range.
+ // Convert the call to date ranges of the raw data.
+ var minDate = this.toDataXCoord(lowX);
+ var maxDate = this.toDataXCoord(highX);
+ this.doZoomXDates_(minDate, maxDate);
+};
+
+/**
+ * Zoom to something containing [minDate, maxDate] values. Don't confuse this
+ * method with doZoomX which accepts pixel coordinates. This function redraws
+ * the graph.
+ *
+ * @param {number} minDate The minimum date that should be visible.
+ * @param {number} maxDate The maximum date that should be visible.
+ * @private
+ */
+Dygraph.prototype.doZoomXDates_ = function(minDate, maxDate) {
+ // TODO(danvk): when xAxisRange is null (i.e. "fit to data", the animation
+ // can produce strange effects. Rather than the x-axis transitioning slowly
+ // between values, it can jerk around.)
+ var old_window = this.xAxisRange();
+ var new_window = [minDate, maxDate];
+ this.zoomed_x_ = true;
+ var that = this;
+ this.doAnimatedZoom(old_window, new_window, null, null, function() {
+ if (that.getFunctionOption("zoomCallback")) {
+ that.getFunctionOption("zoomCallback").call(that,
+ minDate, maxDate, that.yAxisRanges());
+ }
+ });
+};
+
+/**
+ * Zoom to something containing [lowY, highY]. These are pixel coordinates in
+ * the canvas. This function redraws the graph.
+ *
+ * @param {number} lowY The topmost pixel value that should be visible.
+ * @param {number} highY The lowest pixel value that should be visible.
+ * @private
+ */
+Dygraph.prototype.doZoomY_ = function(lowY, highY) {
+ this.currentZoomRectArgs_ = null;
+ // Find the highest and lowest values in pixel range for each axis.
+ // Note that lowY (in pixels) corresponds to the max Value (in data coords).
+ // This is because pixels increase as you go down on the screen, whereas data
+ // coordinates increase as you go up the screen.
+ var oldValueRanges = this.yAxisRanges();
+ var newValueRanges = [];
+ for (var i = 0; i < this.axes_.length; i++) {
+ var hi = this.toDataYCoord(lowY, i);
+ var low = this.toDataYCoord(highY, i);
+ newValueRanges.push([low, hi]);
+ }
+
+ this.zoomed_y_ = true;
+ var that = this;
+ this.doAnimatedZoom(null, null, oldValueRanges, newValueRanges, function() {
+ if (that.getFunctionOption("zoomCallback")) {
+ var xRange = that.xAxisRange();
+ that.getFunctionOption("zoomCallback").call(that,
+ xRange[0], xRange[1], that.yAxisRanges());
+ }
+ });
+};
+
+/**
+ * Transition function to use in animations. Returns values between 0.0
+ * (totally old values) and 1.0 (totally new values) for each frame.
+ * @private
+ */
+Dygraph.zoomAnimationFunction = function(frame, numFrames) {
+ var k = 1.5;
+ return (1.0 - Math.pow(k, -frame)) / (1.0 - Math.pow(k, -numFrames));
+};
+
+/**
+ * Reset the zoom to the original view coordinates. This is the same as
+ * double-clicking on the graph.
+ */
+Dygraph.prototype.resetZoom = function() {
+ var dirty = false, dirtyX = false, dirtyY = false;
+ if (this.dateWindow_ !== null) {
+ dirty = true;
+ dirtyX = true;
+ }
+
+ for (var i = 0; i < this.axes_.length; i++) {
+ if (typeof(this.axes_[i].valueWindow) !== 'undefined' && this.axes_[i].valueWindow !== null) {
+ dirty = true;
+ dirtyY = true;
+ }
+ }
+
+ // Clear any selection, since it's likely to be drawn in the wrong place.
+ this.clearSelection();
+
+ if (dirty) {
+ this.zoomed_x_ = false;
+ this.zoomed_y_ = false;
+
+ var minDate = this.rawData_[0][0];
+ var maxDate = this.rawData_[this.rawData_.length - 1][0];
+
+ // With only one frame, don't bother calculating extreme ranges.
+ // TODO(danvk): merge this block w/ the code below.
+ if (!this.getBooleanOption("animatedZooms")) {
+ this.dateWindow_ = null;
+ for (i = 0; i < this.axes_.length; i++) {
+ if (this.axes_[i].valueWindow !== null) {
+ delete this.axes_[i].valueWindow;
+ }
+ }
+ this.drawGraph_();
+ if (this.getFunctionOption("zoomCallback")) {
+ this.getFunctionOption("zoomCallback").call(this,
+ minDate, maxDate, this.yAxisRanges());
+ }
+ return;
+ }
+
+ var oldWindow=null, newWindow=null, oldValueRanges=null, newValueRanges=null;
+ if (dirtyX) {
+ oldWindow = this.xAxisRange();
+ newWindow = [minDate, maxDate];
+ }
+
+ if (dirtyY) {
+ oldValueRanges = this.yAxisRanges();
+ // TODO(danvk): this is pretty inefficient
+ var packed = this.gatherDatasets_(this.rolledSeries_, null);
+ var extremes = packed.extremes;
+
+ // this has the side-effect of modifying this.axes_.
+ // this doesn't make much sense in this context, but it's convenient (we
+ // need this.axes_[*].extremeValues) and not harmful since we'll be
+ // calling drawGraph_ shortly, which clobbers these values.
+ this.computeYAxisRanges_(extremes);
+
+ newValueRanges = [];
+ for (i = 0; i < this.axes_.length; i++) {
+ var axis = this.axes_[i];
+ newValueRanges.push((axis.valueRange !== null &&
+ axis.valueRange !== undefined) ?
+ axis.valueRange : axis.extremeRange);
+ }
+ }
+
+ var that = this;
+ this.doAnimatedZoom(oldWindow, newWindow, oldValueRanges, newValueRanges,
+ function() {
+ that.dateWindow_ = null;
+ for (var i = 0; i < that.axes_.length; i++) {
+ if (that.axes_[i].valueWindow !== null) {
+ delete that.axes_[i].valueWindow;
+ }
+ }
+ if (that.getFunctionOption("zoomCallback")) {
+ that.getFunctionOption("zoomCallback").call(that,
+ minDate, maxDate, that.yAxisRanges());
+ }
+ });
+ }
+};
+
+/**
+ * Combined animation logic for all zoom functions.
+ * either the x parameters or y parameters may be null.
+ * @private
+ */
+Dygraph.prototype.doAnimatedZoom = function(oldXRange, newXRange, oldYRanges, newYRanges, callback) {
+ var steps = this.getBooleanOption("animatedZooms") ?
+ Dygraph.ANIMATION_STEPS : 1;
+
+ var windows = [];
+ var valueRanges = [];
+ var step, frac;
+
+ if (oldXRange !== null && newXRange !== null) {
+ for (step = 1; step <= steps; step++) {
+ frac = Dygraph.zoomAnimationFunction(step, steps);
+ windows[step-1] = [oldXRange[0]*(1-frac) + frac*newXRange[0],
+ oldXRange[1]*(1-frac) + frac*newXRange[1]];
+ }
+ }
+
+ if (oldYRanges !== null && newYRanges !== null) {
+ for (step = 1; step <= steps; step++) {
+ frac = Dygraph.zoomAnimationFunction(step, steps);
+ var thisRange = [];
+ for (var j = 0; j < this.axes_.length; j++) {
+ thisRange.push([oldYRanges[j][0]*(1-frac) + frac*newYRanges[j][0],
+ oldYRanges[j][1]*(1-frac) + frac*newYRanges[j][1]]);
+ }
+ valueRanges[step-1] = thisRange;
+ }
+ }
+
+ var that = this;
+ Dygraph.repeatAndCleanup(function(step) {
+ if (valueRanges.length) {
+ for (var i = 0; i < that.axes_.length; i++) {
+ var w = valueRanges[step][i];
+ that.axes_[i].valueWindow = [w[0], w[1]];
+ }
+ }
+ if (windows.length) {
+ that.dateWindow_ = windows[step];
+ }
+ that.drawGraph_();
+ }, steps, Dygraph.ANIMATION_DURATION / steps, callback);
+};
+
+/**
+ * Get the current graph's area object.
+ *
+ * Returns: {x, y, w, h}
+ */
+Dygraph.prototype.getArea = function() {
+ return this.plotter_.area;
+};
+
+/**
+ * Convert a mouse event to DOM coordinates relative to the graph origin.
+ *
+ * Returns a two-element array: [X, Y].
+ */
+Dygraph.prototype.eventToDomCoords = function(event) {
+ if (event.offsetX && event.offsetY) {
+ return [ event.offsetX, event.offsetY ];
+ } else {
+ var eventElementPos = Dygraph.findPos(this.mouseEventElement_);
+ var canvasx = Dygraph.pageX(event) - eventElementPos.x;
+ var canvasy = Dygraph.pageY(event) - eventElementPos.y;
+ return [canvasx, canvasy];
+ }
+};
+
+/**
+ * Given a canvas X coordinate, find the closest row.
+ * @param {number} domX graph-relative DOM X coordinate
+ * Returns {number} row number.
+ * @private
+ */
+Dygraph.prototype.findClosestRow = function(domX) {
+ var minDistX = Infinity;
+ var closestRow = -1;
+ var sets = this.layout_.points;
+ for (var i = 0; i < sets.length; i++) {
+ var points = sets[i];
+ var len = points.length;
+ for (var j = 0; j < len; j++) {
+ var point = points[j];
+ if (!Dygraph.isValidPoint(point, true)) continue;
+ var dist = Math.abs(point.canvasx - domX);
+ if (dist < minDistX) {
+ minDistX = dist;
+ closestRow = point.idx;
+ }
+ }
+ }
+
+ return closestRow;
+};
+
+/**
+ * Given canvas X,Y coordinates, find the closest point.
+ *
+ * This finds the individual data point across all visible series
+ * that's closest to the supplied DOM coordinates using the standard
+ * Euclidean X,Y distance.
+ *
+ * @param {number} domX graph-relative DOM X coordinate
+ * @param {number} domY graph-relative DOM Y coordinate
+ * Returns: {row, seriesName, point}
+ * @private
+ */
+Dygraph.prototype.findClosestPoint = function(domX, domY) {
+ var minDist = Infinity;
+ var dist, dx, dy, point, closestPoint, closestSeries, closestRow;
+ for ( var setIdx = this.layout_.points.length - 1 ; setIdx >= 0 ; --setIdx ) {
+ var points = this.layout_.points[setIdx];
+ for (var i = 0; i < points.length; ++i) {
+ point = points[i];
+ if (!Dygraph.isValidPoint(point)) continue;
+ dx = point.canvasx - domX;
+ dy = point.canvasy - domY;
+ dist = dx * dx + dy * dy;
+ if (dist < minDist) {
+ minDist = dist;
+ closestPoint = point;
+ closestSeries = setIdx;
+ closestRow = point.idx;
+ }
+ }
+ }
+ var name = this.layout_.setNames[closestSeries];
+ return {
+ row: closestRow,
+ seriesName: name,
+ point: closestPoint
+ };
+};
+
+/**
+ * Given canvas X,Y coordinates, find the touched area in a stacked graph.
+ *
+ * This first finds the X data point closest to the supplied DOM X coordinate,
+ * then finds the series which puts the Y coordinate on top of its filled area,
+ * using linear interpolation between adjacent point pairs.
+ *
+ * @param {number} domX graph-relative DOM X coordinate
+ * @param {number} domY graph-relative DOM Y coordinate
+ * Returns: {row, seriesName, point}
+ * @private
+ */
+Dygraph.prototype.findStackedPoint = function(domX, domY) {
+ var row = this.findClosestRow(domX);
+ var closestPoint, closestSeries;
+ for (var setIdx = 0; setIdx < this.layout_.points.length; ++setIdx) {
+ var boundary = this.getLeftBoundary_(setIdx);
+ var rowIdx = row - boundary;
+ var points = this.layout_.points[setIdx];
+ if (rowIdx >= points.length) continue;
+ var p1 = points[rowIdx];
+ if (!Dygraph.isValidPoint(p1)) continue;
+ var py = p1.canvasy;
+ if (domX > p1.canvasx && rowIdx + 1 < points.length) {
+ // interpolate series Y value using next point
+ var p2 = points[rowIdx + 1];
+ if (Dygraph.isValidPoint(p2)) {
+ var dx = p2.canvasx - p1.canvasx;
+ if (dx > 0) {
+ var r = (domX - p1.canvasx) / dx;
+ py += r * (p2.canvasy - p1.canvasy);
+ }
+ }
+ } else if (domX < p1.canvasx && rowIdx > 0) {
+ // interpolate series Y value using previous point
+ var p0 = points[rowIdx - 1];
+ if (Dygraph.isValidPoint(p0)) {
+ var dx = p1.canvasx - p0.canvasx;
+ if (dx > 0) {
+ var r = (p1.canvasx - domX) / dx;
+ py += r * (p0.canvasy - p1.canvasy);
+ }
+ }
+ }
+ // Stop if the point (domX, py) is above this series' upper edge
+ if (setIdx === 0 || py < domY) {
+ closestPoint = p1;
+ closestSeries = setIdx;
+ }
+ }
+ var name = this.layout_.setNames[closestSeries];
+ return {
+ row: row,
+ seriesName: name,
+ point: closestPoint
+ };
+};
+
+/**
+ * When the mouse moves in the canvas, display information about a nearby data
+ * point and draw dots over those points in the data series. This function
+ * takes care of cleanup of previously-drawn dots.
+ * @param {Object} event The mousemove event from the browser.
+ * @private
+ */
+Dygraph.prototype.mouseMove_ = function(event) {
+ // This prevents JS errors when mousing over the canvas before data loads.
+ var points = this.layout_.points;
+ if (points === undefined || points === null) return;
+
+ var canvasCoords = this.eventToDomCoords(event);
+ var canvasx = canvasCoords[0];
+ var canvasy = canvasCoords[1];
+
+ var highlightSeriesOpts = this.getOption("highlightSeriesOpts");
+ var selectionChanged = false;
+ if (highlightSeriesOpts && !this.isSeriesLocked()) {
+ var closest;
+ if (this.getBooleanOption("stackedGraph")) {
+ closest = this.findStackedPoint(canvasx, canvasy);
+ } else {
+ closest = this.findClosestPoint(canvasx, canvasy);
+ }
+ selectionChanged = this.setSelection(closest.row, closest.seriesName);
+ } else {
+ var idx = this.findClosestRow(canvasx);
+ selectionChanged = this.setSelection(idx);
+ }
+
+ var callback = this.getFunctionOption("highlightCallback");
+ if (callback && selectionChanged) {
+ callback.call(this, event,
+ this.lastx_,
+ this.selPoints_,
+ this.lastRow_,
+ this.highlightSet_);
+ }
+};
+
+/**
+ * Fetch left offset from the specified set index or if not passed, the
+ * first defined boundaryIds record (see bug #236).
+ * @private
+ */
+Dygraph.prototype.getLeftBoundary_ = function(setIdx) {
+ if (this.boundaryIds_[setIdx]) {
+ return this.boundaryIds_[setIdx][0];
+ } else {
+ for (var i = 0; i < this.boundaryIds_.length; i++) {
+ if (this.boundaryIds_[i] !== undefined) {
+ return this.boundaryIds_[i][0];
+ }
+ }
+ return 0;
+ }
+};
+
+Dygraph.prototype.animateSelection_ = function(direction) {
+ var totalSteps = 10;
+ var millis = 30;
+ if (this.fadeLevel === undefined) this.fadeLevel = 0;
+ if (this.animateId === undefined) this.animateId = 0;
+ var start = this.fadeLevel;
+ var steps = direction < 0 ? start : totalSteps - start;
+ if (steps <= 0) {
+ if (this.fadeLevel) {
+ this.updateSelection_(1.0);
+ }
+ return;
+ }
+
+ var thisId = ++this.animateId;
+ var that = this;
+ Dygraph.repeatAndCleanup(
+ function(n) {
+ // ignore simultaneous animations
+ if (that.animateId != thisId) return;
+
+ that.fadeLevel += direction;
+ if (that.fadeLevel === 0) {
+ that.clearSelection();
+ } else {
+ that.updateSelection_(that.fadeLevel / totalSteps);
+ }
+ },
+ steps, millis, function() {});
+};
+
+/**
+ * Draw dots over the selectied points in the data series. This function
+ * takes care of cleanup of previously-drawn dots.
+ * @private
+ */
+Dygraph.prototype.updateSelection_ = function(opt_animFraction) {
+ /*var defaultPrevented = */
+ this.cascadeEvents_('select', {
+ selectedX: this.lastx_,
+ selectedPoints: this.selPoints_
+ });
+ // TODO(danvk): use defaultPrevented here?
+
+ // Clear the previously drawn vertical, if there is one
+ var i;
+ var ctx = this.canvas_ctx_;
+ if (this.getOption('highlightSeriesOpts')) {
+ ctx.clearRect(0, 0, this.width_, this.height_);
+ var alpha = 1.0 - this.getNumericOption('highlightSeriesBackgroundAlpha');
+ if (alpha) {
+ // Activating background fade includes an animation effect for a gradual
+ // fade. TODO(klausw): make this independently configurable if it causes
+ // issues? Use a shared preference to control animations?
+ var animateBackgroundFade = true;
+ if (animateBackgroundFade) {
+ if (opt_animFraction === undefined) {
+ // start a new animation
+ this.animateSelection_(1);
+ return;
+ }
+ alpha *= opt_animFraction;
+ }
+ ctx.fillStyle = 'rgba(255,255,255,' + alpha + ')';
+ ctx.fillRect(0, 0, this.width_, this.height_);
+ }
+
+ // Redraw only the highlighted series in the interactive canvas (not the
+ // static plot canvas, which is where series are usually drawn).
+ this.plotter_._renderLineChart(this.highlightSet_, ctx);
+ } else if (this.previousVerticalX_ >= 0) {
+ // Determine the maximum highlight circle size.
+ var maxCircleSize = 0;
+ var labels = this.attr_('labels');
+ for (i = 1; i < labels.length; i++) {
+ var r = this.getNumericOption('highlightCircleSize', labels[i]);
+ if (r > maxCircleSize) maxCircleSize = r;
+ }
+ var px = this.previousVerticalX_;
+ ctx.clearRect(px - maxCircleSize - 1, 0,
+ 2 * maxCircleSize + 2, this.height_);
+ }
+
+ if (this.isUsingExcanvas_ && this.currentZoomRectArgs_) {
+ Dygraph.prototype.drawZoomRect_.apply(this, this.currentZoomRectArgs_);
+ }
+
+ if (this.selPoints_.length > 0) {
+ // Draw colored circles over the center of each selected point
+ var canvasx = this.selPoints_[0].canvasx;
+ ctx.save();
+ for (i = 0; i < this.selPoints_.length; i++) {
+ var pt = this.selPoints_[i];
+ if (!Dygraph.isOK(pt.canvasy)) continue;
+
+ var circleSize = this.getNumericOption('highlightCircleSize', pt.name);
+ var callback = this.getFunctionOption("drawHighlightPointCallback", pt.name);
+ var color = this.plotter_.colors[pt.name];
+ if (!callback) {
+ callback = Dygraph.Circles.DEFAULT;
+ }
+ ctx.lineWidth = this.getNumericOption('strokeWidth', pt.name);
+ ctx.strokeStyle = color;
+ ctx.fillStyle = color;
+ callback.call(this, this, pt.name, ctx, canvasx, pt.canvasy,
+ color, circleSize, pt.idx);
+ }
+ ctx.restore();
+
+ this.previousVerticalX_ = canvasx;
+ }
+};
+
+/**
+ * Manually set the selected points and display information about them in the
+ * legend. The selection can be cleared using clearSelection() and queried
+ * using getSelection().
+ * @param {number} row Row number that should be highlighted (i.e. appear with
+ * hover dots on the chart).
+ * @param {seriesName} optional series name to highlight that series with the
+ * the highlightSeriesOpts setting.
+ * @param { locked } optional If true, keep seriesName selected when mousing
+ * over the graph, disabling closest-series highlighting. Call clearSelection()
+ * to unlock it.
+ */
+Dygraph.prototype.setSelection = function(row, opt_seriesName, opt_locked) {
+ // Extract the points we've selected
+ this.selPoints_ = [];
+
+ var changed = false;
+ if (row !== false && row >= 0) {
+ if (row != this.lastRow_) changed = true;
+ this.lastRow_ = row;
+ for (var setIdx = 0; setIdx < this.layout_.points.length; ++setIdx) {
+ var points = this.layout_.points[setIdx];
+ // Check if the point at the appropriate index is the point we're looking
+ // for. If it is, just use it, otherwise search the array for a point
+ // in the proper place.
+ var setRow = row - this.getLeftBoundary_(setIdx);
+ if (setRow < points.length && points[setRow].idx == row) {
+ var point = points[setRow];
+ if (point.yval !== null) this.selPoints_.push(point);
+ } else {
+ for (var pointIdx = 0; pointIdx < points.length; ++pointIdx) {
+ var point = points[pointIdx];
+ if (point.idx == row) {
+ if (point.yval !== null) {
+ this.selPoints_.push(point);
+ }
+ break;
+ }
+ }
+ }
+ }
+ } else {
+ if (this.lastRow_ >= 0) changed = true;
+ this.lastRow_ = -1;
+ }
+
+ if (this.selPoints_.length) {
+ this.lastx_ = this.selPoints_[0].xval;
+ } else {
+ this.lastx_ = -1;
+ }
+
+ if (opt_seriesName !== undefined) {
+ if (this.highlightSet_ !== opt_seriesName) changed = true;
+ this.highlightSet_ = opt_seriesName;
+ }
+
+ if (opt_locked !== undefined) {
+ this.lockedSet_ = opt_locked;
+ }
+
+ if (changed) {
+ this.updateSelection_(undefined);
+ }
+ return changed;
+};
+
+/**
+ * The mouse has left the canvas. Clear out whatever artifacts remain
+ * @param {Object} event the mouseout event from the browser.
+ * @private
+ */
+Dygraph.prototype.mouseOut_ = function(event) {
+ if (this.getFunctionOption("unhighlightCallback")) {
+ this.getFunctionOption("unhighlightCallback").call(this, event);
+ }
+
+ if (this.getBooleanOption("hideOverlayOnMouseOut") && !this.lockedSet_) {
+ this.clearSelection();
+ }
+};
+
+/**
+ * Clears the current selection (i.e. points that were highlighted by moving
+ * the mouse over the chart).
+ */
+Dygraph.prototype.clearSelection = function() {
+ this.cascadeEvents_('deselect', {});
+
+ this.lockedSet_ = false;
+ // Get rid of the overlay data
+ if (this.fadeLevel) {
+ this.animateSelection_(-1);
+ return;
+ }
+ this.canvas_ctx_.clearRect(0, 0, this.width_, this.height_);
+ this.fadeLevel = 0;
+ this.selPoints_ = [];
+ this.lastx_ = -1;
+ this.lastRow_ = -1;
+ this.highlightSet_ = null;
+};
+
+/**
+ * Returns the number of the currently selected row. To get data for this row,
+ * you can use the getValue method.
+ * @return {number} row number, or -1 if nothing is selected
+ */
+Dygraph.prototype.getSelection = function() {
+ if (!this.selPoints_ || this.selPoints_.length < 1) {
+ return -1;
+ }
+
+ for (var setIdx = 0; setIdx < this.layout_.points.length; setIdx++) {
+ var points = this.layout_.points[setIdx];
+ for (var row = 0; row < points.length; row++) {
+ if (points[row].x == this.selPoints_[0].x) {
+ return points[row].idx;
+ }
+ }
+ }
+ return -1;
+};
+
+/**
+ * Returns the name of the currently-highlighted series.
+ * Only available when the highlightSeriesOpts option is in use.
+ */
+Dygraph.prototype.getHighlightSeries = function() {
+ return this.highlightSet_;
+};
+
+/**
+ * Returns true if the currently-highlighted series was locked
+ * via setSelection(..., seriesName, true).
+ */
+Dygraph.prototype.isSeriesLocked = function() {
+ return this.lockedSet_;
+};
+
+/**
+ * Fires when there's data available to be graphed.
+ * @param {string} data Raw CSV data to be plotted
+ * @private
+ */
+Dygraph.prototype.loadedEvent_ = function(data) {
+ this.rawData_ = this.parseCSV_(data);
+ this.cascadeDataDidUpdateEvent_();
+ this.predraw_();
+};
+
+/**
+ * Add ticks on the x-axis representing years, months, quarters, weeks, or days
+ * @private
+ */
+Dygraph.prototype.addXTicks_ = function() {
+ // Determine the correct ticks scale on the x-axis: quarterly, monthly, ...
+ var range;
+ if (this.dateWindow_) {
+ range = [this.dateWindow_[0], this.dateWindow_[1]];
+ } else {
+ range = this.xAxisExtremes();
+ }
+
+ var xAxisOptionsView = this.optionsViewForAxis_('x');
+ var xTicks = xAxisOptionsView('ticker')(
+ range[0],
+ range[1],
+ this.plotter_.area.w, // TODO(danvk): should be area.width
+ xAxisOptionsView,
+ this);
+ // var msg = 'ticker(' + range[0] + ', ' + range[1] + ', ' + this.width_ + ', ' + this.attr_('pixelsPerXLabel') + ') -> ' + JSON.stringify(xTicks);
+ // console.log(msg);
+ this.layout_.setXTicks(xTicks);
+};
+
+/**
+ * Returns the correct handler class for the currently set options.
+ * @private
+ */
+Dygraph.prototype.getHandlerClass_ = function() {
+ var handlerClass;
+ if (this.attr_('dataHandler')) {
+ handlerClass = this.attr_('dataHandler');
+ } else if (this.fractions_) {
+ if (this.getBooleanOption('errorBars')) {
+ handlerClass = Dygraph.DataHandlers.FractionsBarsHandler;
+ } else {
+ handlerClass = Dygraph.DataHandlers.DefaultFractionHandler;
+ }
+ } else if (this.getBooleanOption('customBars')) {
+ handlerClass = Dygraph.DataHandlers.CustomBarsHandler;
+ } else if (this.getBooleanOption('errorBars')) {
+ handlerClass = Dygraph.DataHandlers.ErrorBarsHandler;
+ } else {
+ handlerClass = Dygraph.DataHandlers.DefaultHandler;
+ }
+ return handlerClass;
+};
+
+/**
+ * @private
+ * This function is called once when the chart's data is changed or the options
+ * dictionary is updated. It is _not_ called when the user pans or zooms. The
+ * idea is that values derived from the chart's data can be computed here,
+ * rather than every time the chart is drawn. This includes things like the
+ * number of axes, rolling averages, etc.
+ */
+Dygraph.prototype.predraw_ = function() {
+ var start = new Date();
+
+ // Create the correct dataHandler
+ this.dataHandler_ = new (this.getHandlerClass_())();
+
+ this.layout_.computePlotArea();
+
+ // TODO(danvk): move more computations out of drawGraph_ and into here.
+ this.computeYAxes_();
+
+ if (!this.is_initial_draw_) {
+ this.canvas_ctx_.restore();
+ this.hidden_ctx_.restore();
+ }
+
+ this.canvas_ctx_.save();
+ this.hidden_ctx_.save();
+
+ // Create a new plotter.
+ this.plotter_ = new DygraphCanvasRenderer(this,
+ this.hidden_,
+ this.hidden_ctx_,
+ this.layout_);
+
+ // The roller sits in the bottom left corner of the chart. We don't know where
+ // this will be until the options are available, so it's positioned here.
+ this.createRollInterface_();
+
+ this.cascadeEvents_('predraw');
+
+ // Convert the raw data (a 2D array) into the internal format and compute
+ // rolling averages.
+ this.rolledSeries_ = [null]; // x-axis is the first series and it's special
+ for (var i = 1; i < this.numColumns(); i++) {
+ // var logScale = this.attr_('logscale', i); // TODO(klausw): this looks wrong // konigsberg thinks so too.
+ var series = this.dataHandler_.extractSeries(this.rawData_, i, this.attributes_);
+ if (this.rollPeriod_ > 1) {
+ series = this.dataHandler_.rollingAverage(series, this.rollPeriod_, this.attributes_);
+ }
+
+ this.rolledSeries_.push(series);
+ }
+
+ // If the data or options have changed, then we'd better redraw.
+ this.drawGraph_();
+
+ // This is used to determine whether to do various animations.
+ var end = new Date();
+ this.drawingTimeMs_ = (end - start);
+};
+
+/**
+ * Point structure.
+ *
+ * xval_* and yval_* are the original unscaled data values,
+ * while x_* and y_* are scaled to the range (0.0-1.0) for plotting.
+ * yval_stacked is the cumulative Y value used for stacking graphs,
+ * and bottom/top/minus/plus are used for error bar graphs.
+ *
+ * @typedef {{
+ * idx: number,
+ * name: string,
+ * x: ?number,
+ * xval: ?number,
+ * y_bottom: ?number,
+ * y: ?number,
+ * y_stacked: ?number,
+ * y_top: ?number,
+ * yval_minus: ?number,
+ * yval: ?number,
+ * yval_plus: ?number,
+ * yval_stacked
+ * }}
+ */
+Dygraph.PointType = undefined;
+
+/**
+ * Calculates point stacking for stackedGraph=true.
+ *
+ * For stacking purposes, interpolate or extend neighboring data across
+ * NaN values based on stackedGraphNaNFill settings. This is for display
+ * only, the underlying data value as shown in the legend remains NaN.
+ *
+ * @param {Array.<Dygraph.PointType>} points Point array for a single series.
+ * Updates each Point's yval_stacked property.
+ * @param {Array.<number>} cumulativeYval Accumulated top-of-graph stacked Y
+ * values for the series seen so far. Index is the row number. Updated
+ * based on the current series's values.
+ * @param {Array.<number>} seriesExtremes Min and max values, updated
+ * to reflect the stacked values.
+ * @param {string} fillMethod Interpolation method, one of 'all', 'inside', or
+ * 'none'.
+ * @private
+ */
+Dygraph.stackPoints_ = function(
+ points, cumulativeYval, seriesExtremes, fillMethod) {
+ var lastXval = null;
+ var prevPoint = null;
+ var nextPoint = null;
+ var nextPointIdx = -1;
+
+ // Find the next stackable point starting from the given index.
+ var updateNextPoint = function(idx) {
+ // If we've previously found a non-NaN point and haven't gone past it yet,
+ // just use that.
+ if (nextPointIdx >= idx) return;
+
+ // We haven't found a non-NaN point yet or have moved past it,
+ // look towards the right to find a non-NaN point.
+ for (var j = idx; j < points.length; ++j) {
+ // Clear out a previously-found point (if any) since it's no longer
+ // valid, we shouldn't use it for interpolation anymore.
+ nextPoint = null;
+ if (!isNaN(points[j].yval) && points[j].yval !== null) {
+ nextPointIdx = j;
+ nextPoint = points[j];
+ break;
+ }
+ }
+ };
+
+ for (var i = 0; i < points.length; ++i) {
+ var point = points[i];
+ var xval = point.xval;
+ if (cumulativeYval[xval] === undefined) {
+ cumulativeYval[xval] = 0;
+ }
+
+ var actualYval = point.yval;
+ if (isNaN(actualYval) || actualYval === null) {
+ if(fillMethod == 'none') {
+ actualYval = 0;
+ } else {
+ // Interpolate/extend for stacking purposes if possible.
+ updateNextPoint(i);
+ if (prevPoint && nextPoint && fillMethod != 'none') {
+ // Use linear interpolation between prevPoint and nextPoint.
+ actualYval = prevPoint.yval + (nextPoint.yval - prevPoint.yval) *
+ ((xval - prevPoint.xval) / (nextPoint.xval - prevPoint.xval));
+ } else if (prevPoint && fillMethod == 'all') {
+ actualYval = prevPoint.yval;
+ } else if (nextPoint && fillMethod == 'all') {
+ actualYval = nextPoint.yval;
+ } else {
+ actualYval = 0;
+ }
+ }
+ } else {
+ prevPoint = point;
+ }
+
+ var stackedYval = cumulativeYval[xval];
+ if (lastXval != xval) {
+ // If an x-value is repeated, we ignore the duplicates.
+ stackedYval += actualYval;
+ cumulativeYval[xval] = stackedYval;
+ }
+ lastXval = xval;
+
+ point.yval_stacked = stackedYval;
+
+ if (stackedYval > seriesExtremes[1]) {
+ seriesExtremes[1] = stackedYval;
+ }
+ if (stackedYval < seriesExtremes[0]) {
+ seriesExtremes[0] = stackedYval;
+ }
+ }
+};
+
+
+/**
+ * Loop over all fields and create datasets, calculating extreme y-values for
+ * each series and extreme x-indices as we go.
+ *
+ * dateWindow is passed in as an explicit parameter so that we can compute
+ * extreme values "speculatively", i.e. without actually setting state on the
+ * dygraph.
+ *
+ * @param {Array.<Array.<Array.<(number|Array<number>)>>} rolledSeries, where
+ * rolledSeries[seriesIndex][row] = raw point, where
+ * seriesIndex is the column number starting with 1, and
+ * rawPoint is [x,y] or [x, [y, err]] or [x, [y, yminus, yplus]].
+ * @param {?Array.<number>} dateWindow [xmin, xmax] pair, or null.
+ * @return {{
+ * points: Array.<Array.<Dygraph.PointType>>,
+ * seriesExtremes: Array.<Array.<number>>,
+ * boundaryIds: Array.<number>}}
+ * @private
+ */
+Dygraph.prototype.gatherDatasets_ = function(rolledSeries, dateWindow) {
+ var boundaryIds = [];
+ var points = [];
+ var cumulativeYval = []; // For stacked series.
+ var extremes = {}; // series name -> [low, high]
+ var seriesIdx, sampleIdx;
+ var firstIdx, lastIdx;
+ var axisIdx;
+
+ // Loop over the fields (series). Go from the last to the first,
+ // because if they're stacked that's how we accumulate the values.
+ var num_series = rolledSeries.length - 1;
+ var series;
+ for (seriesIdx = num_series; seriesIdx >= 1; seriesIdx--) {
+ if (!this.visibility()[seriesIdx - 1]) continue;
+
+ // Prune down to the desired range, if necessary (for zooming)
+ // Because there can be lines going to points outside of the visible area,
+ // we actually prune to visible points, plus one on either side.
+ if (dateWindow) {
+ series = rolledSeries[seriesIdx];
+ var low = dateWindow[0];
+ var high = dateWindow[1];
+
+ // TODO(danvk): do binary search instead of linear search.
+ // TODO(danvk): pass firstIdx and lastIdx directly to the renderer.
+ firstIdx = null;
+ lastIdx = null;
+ for (sampleIdx = 0; sampleIdx < series.length; sampleIdx++) {
+ if (series[sampleIdx][0] >= low && firstIdx === null) {
+ firstIdx = sampleIdx;
+ }
+ if (series[sampleIdx][0] <= high) {
+ lastIdx = sampleIdx;
+ }
+ }
+
+ if (firstIdx === null) firstIdx = 0;
+ var correctedFirstIdx = firstIdx;
+ var isInvalidValue = true;
+ while (isInvalidValue && correctedFirstIdx > 0) {
+ correctedFirstIdx--;
+ // check if the y value is null.
+ isInvalidValue = series[correctedFirstIdx][1] === null;
+ }
+
+ if (lastIdx === null) lastIdx = series.length - 1;
+ var correctedLastIdx = lastIdx;
+ isInvalidValue = true;
+ while (isInvalidValue && correctedLastIdx < series.length - 1) {
+ correctedLastIdx++;
+ isInvalidValue = series[correctedLastIdx][1] === null;
+ }
+
+ if (correctedFirstIdx!==firstIdx) {
+ firstIdx = correctedFirstIdx;
+ }
+ if (correctedLastIdx !== lastIdx) {
+ lastIdx = correctedLastIdx;
+ }
+
+ boundaryIds[seriesIdx-1] = [firstIdx, lastIdx];
+
+ // .slice's end is exclusive, we want to include lastIdx.
+ series = series.slice(firstIdx, lastIdx + 1);
+ } else {
+ series = rolledSeries[seriesIdx];
+ boundaryIds[seriesIdx-1] = [0, series.length-1];
+ }
+
+ var seriesName = this.attr_("labels")[seriesIdx];
+ var seriesExtremes = this.dataHandler_.getExtremeYValues(series,
+ dateWindow, this.getBooleanOption("stepPlot",seriesName));
+
+ var seriesPoints = this.dataHandler_.seriesToPoints(series,
+ seriesName, boundaryIds[seriesIdx-1][0]);
+
+ if (this.getBooleanOption("stackedGraph")) {
+ axisIdx = this.attributes_.axisForSeries(seriesName);
+ if (cumulativeYval[axisIdx] === undefined) {
+ cumulativeYval[axisIdx] = [];
+ }
+ Dygraph.stackPoints_(seriesPoints, cumulativeYval[axisIdx], seriesExtremes,
+ this.getBooleanOption("stackedGraphNaNFill"));
+ }
+
+ extremes[seriesName] = seriesExtremes;
+ points[seriesIdx] = seriesPoints;
+ }
+
+ return { points: points, extremes: extremes, boundaryIds: boundaryIds };
+};
+
+/**
+ * Update the graph with new data. This method is called when the viewing area
+ * has changed. If the underlying data or options have changed, predraw_ will
+ * be called before drawGraph_ is called.
+ *
+ * @private
+ */
+Dygraph.prototype.drawGraph_ = function() {
+ var start = new Date();
+
+ // This is used to set the second parameter to drawCallback, below.
+ var is_initial_draw = this.is_initial_draw_;
+ this.is_initial_draw_ = false;
+
+ this.layout_.removeAllDatasets();
+ this.setColors_();
+ this.attrs_.pointSize = 0.5 * this.getNumericOption('highlightCircleSize');
+
+ var packed = this.gatherDatasets_(this.rolledSeries_, this.dateWindow_);
+ var points = packed.points;
+ var extremes = packed.extremes;
+ this.boundaryIds_ = packed.boundaryIds;
+
+ this.setIndexByName_ = {};
+ var labels = this.attr_("labels");
+ if (labels.length > 0) {
+ this.setIndexByName_[labels[0]] = 0;
+ }
+ var dataIdx = 0;
+ for (var i = 1; i < points.length; i++) {
+ this.setIndexByName_[labels[i]] = i;
+ if (!this.visibility()[i - 1]) continue;
+ this.layout_.addDataset(labels[i], points[i]);
+ this.datasetIndex_[i] = dataIdx++;
+ }
+
+ this.computeYAxisRanges_(extremes);
+ this.layout_.setYAxes(this.axes_);
+
+ this.addXTicks_();
+
+ // Save the X axis zoomed status as the updateOptions call will tend to set it erroneously
+ var tmp_zoomed_x = this.zoomed_x_;
+ // Tell PlotKit to use this new data and render itself
+ this.zoomed_x_ = tmp_zoomed_x;
+ this.layout_.evaluate();
+ this.renderGraph_(is_initial_draw);
+
+ if (this.getStringOption("timingName")) {
+ var end = new Date();
+ console.log(this.getStringOption("timingName") + " - drawGraph: " + (end - start) + "ms");
+ }
+};
+
+/**
+ * This does the work of drawing the chart. It assumes that the layout and axis
+ * scales have already been set (e.g. by predraw_).
+ *
+ * @private
+ */
+Dygraph.prototype.renderGraph_ = function(is_initial_draw) {
+ this.cascadeEvents_('clearChart');
+ this.plotter_.clear();
+
+ if (this.getFunctionOption('underlayCallback')) {
+ // NOTE: we pass the dygraph object to this callback twice to avoid breaking
+ // users who expect a deprecated form of this callback.
+ this.getFunctionOption('underlayCallback').call(this,
+ this.hidden_ctx_, this.layout_.getPlotArea(), this, this);
+ }
+
+ var e = {
+ canvas: this.hidden_,
+ drawingContext: this.hidden_ctx_
+ };
+ this.cascadeEvents_('willDrawChart', e);
+ this.plotter_.render();
+ this.cascadeEvents_('didDrawChart', e);
+ this.lastRow_ = -1; // because plugins/legend.js clears the legend
+
+ // TODO(danvk): is this a performance bottleneck when panning?
+ // The interaction canvas should already be empty in that situation.
+ this.canvas_.getContext('2d').clearRect(0, 0, this.width_, this.height_);
+
+ if (this.getFunctionOption("drawCallback") !== null) {
+ this.getFunctionOption("drawCallback")(this, is_initial_draw);
+ }
+ if (is_initial_draw) {
+ this.readyFired_ = true;
+ while (this.readyFns_.length > 0) {
+ var fn = this.readyFns_.pop();
+ fn(this);
+ }
+ }
+};
+
+/**
+ * @private
+ * Determine properties of the y-axes which are independent of the data
+ * currently being displayed. This includes things like the number of axes and
+ * the style of the axes. It does not include the range of each axis and its
+ * tick marks.
+ * This fills in this.axes_.
+ * axes_ = [ { options } ]
+ * indices are into the axes_ array.
+ */
+Dygraph.prototype.computeYAxes_ = function() {
+ // Preserve valueWindow settings if they exist, and if the user hasn't
+ // specified a new valueRange.
+ var valueWindows, axis, index, opts, v;
+ if (this.axes_ !== undefined && this.user_attrs_.hasOwnProperty("valueRange") === false) {
+ valueWindows = [];
+ for (index = 0; index < this.axes_.length; index++) {
+ valueWindows.push(this.axes_[index].valueWindow);
+ }
+ }
+
+ // this.axes_ doesn't match this.attributes_.axes_.options. It's used for
+ // data computation as well as options storage.
+ // Go through once and add all the axes.
+ this.axes_ = [];
+
+ for (axis = 0; axis < this.attributes_.numAxes(); axis++) {
+ // Add a new axis, making a copy of its per-axis options.
+ opts = { g : this };
+ Dygraph.update(opts, this.attributes_.axisOptions(axis));
+ this.axes_[axis] = opts;
+ }
+
+
+ // Copy global valueRange option over to the first axis.
+ // NOTE(konigsberg): Are these two statements necessary?
+ // I tried removing it. The automated tests pass, and manually
+ // messing with tests/zoom.html showed no trouble.
+ v = this.attr_('valueRange');
+ if (v) this.axes_[0].valueRange = v;
+
+ if (valueWindows !== undefined) {
+ // Restore valueWindow settings.
+
+ // When going from two axes back to one, we only restore
+ // one axis.
+ var idxCount = Math.min(valueWindows.length, this.axes_.length);
+
+ for (index = 0; index < idxCount; index++) {
+ this.axes_[index].valueWindow = valueWindows[index];
+ }
+ }
+
+ for (axis = 0; axis < this.axes_.length; axis++) {
+ if (axis === 0) {
+ opts = this.optionsViewForAxis_('y' + (axis ? '2' : ''));
+ v = opts("valueRange");
+ if (v) this.axes_[axis].valueRange = v;
+ } else { // To keep old behavior
+ var axes = this.user_attrs_.axes;
+ if (axes && axes.y2) {
+ v = axes.y2.valueRange;
+ if (v) this.axes_[axis].valueRange = v;
+ }
+ }
+ }
+};
+
+/**
+ * Returns the number of y-axes on the chart.
+ * @return {number} the number of axes.
+ */
+Dygraph.prototype.numAxes = function() {
+ return this.attributes_.numAxes();
+};
+
+/**
+ * @private
+ * Returns axis properties for the given series.
+ * @param {string} setName The name of the series for which to get axis
+ * properties, e.g. 'Y1'.
+ * @return {Object} The axis properties.
+ */
+Dygraph.prototype.axisPropertiesForSeries = function(series) {
+ // TODO(danvk): handle errors.
+ return this.axes_[this.attributes_.axisForSeries(series)];
+};
+
+/**
+ * @private
+ * Determine the value range and tick marks for each axis.
+ * @param {Object} extremes A mapping from seriesName -> [low, high]
+ * This fills in the valueRange and ticks fields in each entry of this.axes_.
+ */
+Dygraph.prototype.computeYAxisRanges_ = function(extremes) {
+ var isNullUndefinedOrNaN = function(num) {
+ return isNaN(parseFloat(num));
+ };
+ var numAxes = this.attributes_.numAxes();
+ var ypadCompat, span, series, ypad;
+
+ var p_axis;
+
+ // Compute extreme values, a span and tick marks for each axis.
+ for (var i = 0; i < numAxes; i++) {
+ var axis = this.axes_[i];
+ var logscale = this.attributes_.getForAxis("logscale", i);
+ var includeZero = this.attributes_.getForAxis("includeZero", i);
+ var independentTicks = this.attributes_.getForAxis("independentTicks", i);
+ series = this.attributes_.seriesForAxis(i);
+
+ // Add some padding. This supports two Y padding operation modes:
+ //
+ // - backwards compatible (yRangePad not set):
+ // 10% padding for automatic Y ranges, but not for user-supplied
+ // ranges, and move a close-to-zero edge to zero except if
+ // avoidMinZero is set, since drawing at the edge results in
+ // invisible lines. Unfortunately lines drawn at the edge of a
+ // user-supplied range will still be invisible. If logscale is
+ // set, add a variable amount of padding at the top but
+ // none at the bottom.
+ //
+ // - new-style (yRangePad set by the user):
+ // always add the specified Y padding.
+ //
+ ypadCompat = true;
+ ypad = 0.1; // add 10%
+ if (this.getNumericOption('yRangePad') !== null) {
+ ypadCompat = false;
+ // Convert pixel padding to ratio
+ ypad = this.getNumericOption('yRangePad') / this.plotter_.area.h;
+ }
+
+ if (series.length === 0) {
+ // If no series are defined or visible then use a reasonable default
+ axis.extremeRange = [0, 1];
+ } else {
+ // Calculate the extremes of extremes.
+ var minY = Infinity; // extremes[series[0]][0];
+ var maxY = -Infinity; // extremes[series[0]][1];
+ var extremeMinY, extremeMaxY;
+
+ for (var j = 0; j < series.length; j++) {
+ // this skips invisible series
+ if (!extremes.hasOwnProperty(series[j])) continue;
+
+ // Only use valid extremes to stop null data series' from corrupting the scale.
+ extremeMinY = extremes[series[j]][0];
+ if (extremeMinY !== null) {
+ minY = Math.min(extremeMinY, minY);
+ }
+ extremeMaxY = extremes[series[j]][1];
+ if (extremeMaxY !== null) {
+ maxY = Math.max(extremeMaxY, maxY);
+ }
+ }
+
+ // Include zero if requested by the user.
+ if (includeZero && !logscale) {
+ if (minY > 0) minY = 0;
+ if (maxY < 0) maxY = 0;
+ }
+
+ // Ensure we have a valid scale, otherwise default to [0, 1] for safety.
+ if (minY == Infinity) minY = 0;
+ if (maxY == -Infinity) maxY = 1;
+
+ span = maxY - minY;
+ // special case: if we have no sense of scale, center on the sole value.
+ if (span === 0) {
+ if (maxY !== 0) {
+ span = Math.abs(maxY);
+ } else {
+ // ... and if the sole value is zero, use range 0-1.
+ maxY = 1;
+ span = 1;
+ }
+ }
+
+ var maxAxisY, minAxisY;
+ if (logscale) {
+ if (ypadCompat) {
+ maxAxisY = maxY + ypad * span;
+ minAxisY = minY;
+ } else {
+ var logpad = Math.exp(Math.log(span) * ypad);
+ maxAxisY = maxY * logpad;
+ minAxisY = minY / logpad;
+ }
+ } else {
+ maxAxisY = maxY + ypad * span;
+ minAxisY = minY - ypad * span;
+
+ // Backwards-compatible behavior: Move the span to start or end at zero if it's
+ // close to zero, but not if avoidMinZero is set.
+ if (ypadCompat && !this.getBooleanOption("avoidMinZero")) {
+ if (minAxisY < 0 && minY >= 0) minAxisY = 0;
+ if (maxAxisY > 0 && maxY <= 0) maxAxisY = 0;
+ }
+ }
+ axis.extremeRange = [minAxisY, maxAxisY];
+ }
+ if (axis.valueWindow) {
+ // This is only set if the user has zoomed on the y-axis. It is never set
+ // by a user. It takes precedence over axis.valueRange because, if you set
+ // valueRange, you'd still expect to be able to pan.
+ axis.computedValueRange = [axis.valueWindow[0], axis.valueWindow[1]];
+ } else if (axis.valueRange) {
+ // This is a user-set value range for this axis.
+ var y0 = isNullUndefinedOrNaN(axis.valueRange[0]) ? axis.extremeRange[0] : axis.valueRange[0];
+ var y1 = isNullUndefinedOrNaN(axis.valueRange[1]) ? axis.extremeRange[1] : axis.valueRange[1];
+ if (!ypadCompat) {
+ if (axis.logscale) {
+ var logpad = Math.exp(Math.log(span) * ypad);
+ y0 *= logpad;
+ y1 /= logpad;
+ } else {
+ span = y1 - y0;
+ y0 -= span * ypad;
+ y1 += span * ypad;
+ }
+ }
+ axis.computedValueRange = [y0, y1];
+ } else {
+ axis.computedValueRange = axis.extremeRange;
+ }
+
+
+ if (independentTicks) {
+ axis.independentTicks = independentTicks;
+ var opts = this.optionsViewForAxis_('y' + (i ? '2' : ''));
+ var ticker = opts('ticker');
+ axis.ticks = ticker(axis.computedValueRange[0],
+ axis.computedValueRange[1],
+ this.plotter_.area.h,
+ opts,
+ this);
+ // Define the first independent axis as primary axis.
+ if (!p_axis) p_axis = axis;
+ }
+ }
+ if (p_axis === undefined) {
+ throw ("Configuration Error: At least one axis has to have the \"independentTicks\" option activated.");
+ }
+ // Add ticks. By default, all axes inherit the tick positions of the
+ // primary axis. However, if an axis is specifically marked as having
+ // independent ticks, then that is permissible as well.
+ for (var i = 0; i < numAxes; i++) {
+ var axis = this.axes_[i];
+
+ if (!axis.independentTicks) {
+ var opts = this.optionsViewForAxis_('y' + (i ? '2' : ''));
+ var ticker = opts('ticker');
+ var p_ticks = p_axis.ticks;
+ var p_scale = p_axis.computedValueRange[1] - p_axis.computedValueRange[0];
+ var scale = axis.computedValueRange[1] - axis.computedValueRange[0];
+ var tick_values = [];
+ for (var k = 0; k < p_ticks.length; k++) {
+ var y_frac = (p_ticks[k].v - p_axis.computedValueRange[0]) / p_scale;
+ var y_val = axis.computedValueRange[0] + y_frac * scale;
+ tick_values.push(y_val);
+ }
+
+ axis.ticks = ticker(axis.computedValueRange[0],
+ axis.computedValueRange[1],
+ this.plotter_.area.h,
+ opts,
+ this,
+ tick_values);
+ }
+ }
+};
+
+/**
+ * Detects the type of the str (date or numeric) and sets the various
+ * formatting attributes in this.attrs_ based on this type.
+ * @param {string} str An x value.
+ * @private
+ */
+Dygraph.prototype.detectTypeFromString_ = function(str) {
+ var isDate = false;
+ var dashPos = str.indexOf('-'); // could be 2006-01-01 _or_ 1.0e-2
+ if ((dashPos > 0 && (str[dashPos-1] != 'e' && str[dashPos-1] != 'E')) ||
+ str.indexOf('/') >= 0 ||
+ isNaN(parseFloat(str))) {
+ isDate = true;
+ } else if (str.length == 8 && str > '19700101' && str < '20371231') {
+ // TODO(danvk): remove support for this format.
+ isDate = true;
+ }
+
+ this.setXAxisOptions_(isDate);
+};
+
+Dygraph.prototype.setXAxisOptions_ = function(isDate) {
+ if (isDate) {
+ this.attrs_.xValueParser = Dygraph.dateParser;
+ this.attrs_.axes.x.valueFormatter = Dygraph.dateValueFormatter;
+ this.attrs_.axes.x.ticker = Dygraph.dateTicker;
+ this.attrs_.axes.x.axisLabelFormatter = Dygraph.dateAxisLabelFormatter;
+ } else {
+ /** @private (shut up, jsdoc!) */
+ this.attrs_.xValueParser = function(x) { return parseFloat(x); };
+ // TODO(danvk): use Dygraph.numberValueFormatter here?
+ /** @private (shut up, jsdoc!) */
+ this.attrs_.axes.x.valueFormatter = function(x) { return x; };
+ this.attrs_.axes.x.ticker = Dygraph.numericTicks;
+ this.attrs_.axes.x.axisLabelFormatter = this.attrs_.axes.x.valueFormatter;
+ }
+};
+
+/**
+ * @private
+ * Parses a string in a special csv format. We expect a csv file where each
+ * line is a date point, and the first field in each line is the date string.
+ * We also expect that all remaining fields represent series.
+ * if the errorBars attribute is set, then interpret the fields as:
+ * date, series1, stddev1, series2, stddev2, ...
+ * @param {[Object]} data See above.
+ *
+ * @return [Object] An array with one entry for each row. These entries
+ * are an array of cells in that row. The first entry is the parsed x-value for
+ * the row. The second, third, etc. are the y-values. These can take on one of
+ * three forms, depending on the CSV and constructor parameters:
+ * 1. numeric value
+ * 2. [ value, stddev ]
+ * 3. [ low value, center value, high value ]
+ */
+Dygraph.prototype.parseCSV_ = function(data) {
+ var ret = [];
+ var line_delimiter = Dygraph.detectLineDelimiter(data);
+ var lines = data.split(line_delimiter || "\n");
+ var vals, j;
+
+ // Use the default delimiter or fall back to a tab if that makes sense.
+ var delim = this.getStringOption('delimiter');
+ if (lines[0].indexOf(delim) == -1 && lines[0].indexOf('\t') >= 0) {
+ delim = '\t';
+ }
+
+ var start = 0;
+ if (!('labels' in this.user_attrs_)) {
+ // User hasn't explicitly set labels, so they're (presumably) in the CSV.
+ start = 1;
+ this.attrs_.labels = lines[0].split(delim); // NOTE: _not_ user_attrs_.
+ this.attributes_.reparseSeries();
+ }
+ var line_no = 0;
+
+ var xParser;
+ var defaultParserSet = false; // attempt to auto-detect x value type
+ var expectedCols = this.attr_("labels").length;
+ var outOfOrder = false;
+ for (var i = start; i < lines.length; i++) {
+ var line = lines[i];
+ line_no = i;
+ if (line.length === 0) continue; // skip blank lines
+ if (line[0] == '#') continue; // skip comment lines
+ var inFields = line.split(delim);
+ if (inFields.length < 2) continue;
+
+ var fields = [];
+ if (!defaultParserSet) {
+ this.detectTypeFromString_(inFields[0]);
+ xParser = this.getFunctionOption("xValueParser");
+ defaultParserSet = true;
+ }
+ fields[0] = xParser(inFields[0], this);
+
+ // If fractions are expected, parse the numbers as "A/B"
+ if (this.fractions_) {
+ for (j = 1; j < inFields.length; j++) {
+ // TODO(danvk): figure out an appropriate way to flag parse errors.
+ vals = inFields[j].split("/");
+ if (vals.length != 2) {
+ console.error('Expected fractional "num/den" values in CSV data ' +
+ "but found a value '" + inFields[j] + "' on line " +
+ (1 + i) + " ('" + line + "') which is not of this form.");
+ fields[j] = [0, 0];
+ } else {
+ fields[j] = [Dygraph.parseFloat_(vals[0], i, line),
+ Dygraph.parseFloat_(vals[1], i, line)];
+ }
+ }
+ } else if (this.getBooleanOption("errorBars")) {
+ // If there are error bars, values are (value, stddev) pairs
+ if (inFields.length % 2 != 1) {
+ console.error('Expected alternating (value, stdev.) pairs in CSV data ' +
+ 'but line ' + (1 + i) + ' has an odd number of values (' +
+ (inFields.length - 1) + "): '" + line + "'");
+ }
+ for (j = 1; j < inFields.length; j += 2) {
+ fields[(j + 1) / 2] = [Dygraph.parseFloat_(inFields[j], i, line),
+ Dygraph.parseFloat_(inFields[j + 1], i, line)];
+ }
+ } else if (this.getBooleanOption("customBars")) {
+ // Bars are a low;center;high tuple
+ for (j = 1; j < inFields.length; j++) {
+ var val = inFields[j];
+ if (/^ *$/.test(val)) {
+ fields[j] = [null, null, null];
+ } else {
+ vals = val.split(";");
+ if (vals.length == 3) {
+ fields[j] = [ Dygraph.parseFloat_(vals[0], i, line),
+ Dygraph.parseFloat_(vals[1], i, line),
+ Dygraph.parseFloat_(vals[2], i, line) ];
+ } else {
+ console.warn('When using customBars, values must be either blank ' +
+ 'or "low;center;high" tuples (got "' + val +
+ '" on line ' + (1+i));
+ }
+ }
+ }
+ } else {
+ // Values are just numbers
+ for (j = 1; j < inFields.length; j++) {
+ fields[j] = Dygraph.parseFloat_(inFields[j], i, line);
+ }
+ }
+ if (ret.length > 0 && fields[0] < ret[ret.length - 1][0]) {
+ outOfOrder = true;
+ }
+
+ if (fields.length != expectedCols) {
+ console.error("Number of columns in line " + i + " (" + fields.length +
+ ") does not agree with number of labels (" + expectedCols +
+ ") " + line);
+ }
+
+ // If the user specified the 'labels' option and none of the cells of the
+ // first row parsed correctly, then they probably double-specified the
+ // labels. We go with the values set in the option, discard this row and
+ // log a warning to the JS console.
+ if (i === 0 && this.attr_('labels')) {
+ var all_null = true;
+ for (j = 0; all_null && j < fields.length; j++) {
+ if (fields[j]) all_null = false;
+ }
+ if (all_null) {
+ console.warn("The dygraphs 'labels' option is set, but the first row " +
+ "of CSV data ('" + line + "') appears to also contain " +
+ "labels. Will drop the CSV labels and use the option " +
+ "labels.");
+ continue;
+ }
+ }
+ ret.push(fields);
+ }
+
+ if (outOfOrder) {
+ console.warn("CSV is out of order; order it correctly to speed loading.");
+ ret.sort(function(a,b) { return a[0] - b[0]; });
+ }
+
+ return ret;
+};
+
+/**
+ * The user has provided their data as a pre-packaged JS array. If the x values
+ * are numeric, this is the same as dygraphs' internal format. If the x values
+ * are dates, we need to convert them from Date objects to ms since epoch.
+ * @param {!Array} data
+ * @return {Object} data with numeric x values.
+ * @private
+ */
+Dygraph.prototype.parseArray_ = function(data) {
+ // Peek at the first x value to see if it's numeric.
+ if (data.length === 0) {
+ console.error("Can't plot empty data set");
+ return null;
+ }
+ if (data[0].length === 0) {
+ console.error("Data set cannot contain an empty row");
+ return null;
+ }
+
+ var i;
+ if (this.attr_("labels") === null) {
+ console.warn("Using default labels. Set labels explicitly via 'labels' " +
+ "in the options parameter");
+ this.attrs_.labels = [ "X" ];
+ for (i = 1; i < data[0].length; i++) {
+ this.attrs_.labels.push("Y" + i); // Not user_attrs_.
+ }
+ this.attributes_.reparseSeries();
+ } else {
+ var num_labels = this.attr_("labels");
+ if (num_labels.length != data[0].length) {
+ console.error("Mismatch between number of labels (" + num_labels + ")" +
+ " and number of columns in array (" + data[0].length + ")");
+ return null;
+ }
+ }
+
+ if (Dygraph.isDateLike(data[0][0])) {
+ // Some intelligent defaults for a date x-axis.
+ this.attrs_.axes.x.valueFormatter = Dygraph.dateValueFormatter;
+ this.attrs_.axes.x.ticker = Dygraph.dateTicker;
+ this.attrs_.axes.x.axisLabelFormatter = Dygraph.dateAxisLabelFormatter;
+
+ // Assume they're all dates.
+ var parsedData = Dygraph.clone(data);
+ for (i = 0; i < data.length; i++) {
+ if (parsedData[i].length === 0) {
+ console.error("Row " + (1 + i) + " of data is empty");
+ return null;
+ }
+ if (parsedData[i][0] === null ||
+ typeof(parsedData[i][0].getTime) != 'function' ||
+ isNaN(parsedData[i][0].getTime())) {
+ console.error("x value in row " + (1 + i) + " is not a Date");
+ return null;
+ }
+ parsedData[i][0] = parsedData[i][0].getTime();
+ }
+ return parsedData;
+ } else {
+ // Some intelligent defaults for a numeric x-axis.
+ /** @private (shut up, jsdoc!) */
+ this.attrs_.axes.x.valueFormatter = function(x) { return x; };
+ this.attrs_.axes.x.ticker = Dygraph.numericTicks;
+ this.attrs_.axes.x.axisLabelFormatter = Dygraph.numberAxisLabelFormatter;
+ return data;
+ }
+};
+
+/**
+ * Parses a DataTable object from gviz.
+ * The data is expected to have a first column that is either a date or a
+ * number. All subsequent columns must be numbers. If there is a clear mismatch
+ * between this.xValueParser_ and the type of the first column, it will be
+ * fixed. Fills out rawData_.
+ * @param {!google.visualization.DataTable} data See above.
+ * @private
+ */
+Dygraph.prototype.parseDataTable_ = function(data) {
+ var shortTextForAnnotationNum = function(num) {
+ // converts [0-9]+ [A-Z][a-z]*
+ // example: 0=A, 1=B, 25=Z, 26=Aa, 27=Ab
+ // and continues like.. Ba Bb .. Za .. Zz..Aaa...Zzz Aaaa Zzzz
+ var shortText = String.fromCharCode(65 /* A */ + num % 26);
+ num = Math.floor(num / 26);
+ while ( num > 0 ) {
+ shortText = String.fromCharCode(65 /* A */ + (num - 1) % 26 ) + shortText.toLowerCase();
+ num = Math.floor((num - 1) / 26);
+ }
+ return shortText;
+ };
+
+ var cols = data.getNumberOfColumns();
+ var rows = data.getNumberOfRows();
+
+ var indepType = data.getColumnType(0);
+ if (indepType == 'date' || indepType == 'datetime') {
+ this.attrs_.xValueParser = Dygraph.dateParser;
+ this.attrs_.axes.x.valueFormatter = Dygraph.dateValueFormatter;
+ this.attrs_.axes.x.ticker = Dygraph.dateTicker;
+ this.attrs_.axes.x.axisLabelFormatter = Dygraph.dateAxisLabelFormatter;
+ } else if (indepType == 'number') {
+ this.attrs_.xValueParser = function(x) { return parseFloat(x); };
+ this.attrs_.axes.x.valueFormatter = function(x) { return x; };
+ this.attrs_.axes.x.ticker = Dygraph.numericTicks;
+ this.attrs_.axes.x.axisLabelFormatter = this.attrs_.axes.x.valueFormatter;
+ } else {
+ console.error("only 'date', 'datetime' and 'number' types are supported " +
+ "for column 1 of DataTable input (Got '" + indepType + "')");
+ return null;
+ }
+
+ // Array of the column indices which contain data (and not annotations).
+ var colIdx = [];
+ var annotationCols = {}; // data index -> [annotation cols]
+ var hasAnnotations = false;
+ var i, j;
+ for (i = 1; i < cols; i++) {
+ var type = data.getColumnType(i);
+ if (type == 'number') {
+ colIdx.push(i);
+ } else if (type == 'string' && this.getBooleanOption('displayAnnotations')) {
+ // This is OK -- it's an annotation column.
+ var dataIdx = colIdx[colIdx.length - 1];
+ if (!annotationCols.hasOwnProperty(dataIdx)) {
+ annotationCols[dataIdx] = [i];
+ } else {
+ annotationCols[dataIdx].push(i);
+ }
+ hasAnnotations = true;
+ } else {
+ console.error("Only 'number' is supported as a dependent type with Gviz." +
+ " 'string' is only supported if displayAnnotations is true");
+ }
+ }
+
+ // Read column labels
+ // TODO(danvk): add support back for errorBars
+ var labels = [data.getColumnLabel(0)];
+ for (i = 0; i < colIdx.length; i++) {
+ labels.push(data.getColumnLabel(colIdx[i]));
+ if (this.getBooleanOption("errorBars")) i += 1;
+ }
+ this.attrs_.labels = labels;
+ cols = labels.length;
+
+ var ret = [];
+ var outOfOrder = false;
+ var annotations = [];
+ for (i = 0; i < rows; i++) {
+ var row = [];
+ if (typeof(data.getValue(i, 0)) === 'undefined' ||
+ data.getValue(i, 0) === null) {
+ console.warn("Ignoring row " + i +
+ " of DataTable because of undefined or null first column.");
+ continue;
+ }
+
+ if (indepType == 'date' || indepType == 'datetime') {
+ row.push(data.getValue(i, 0).getTime());
+ } else {
+ row.push(data.getValue(i, 0));
+ }
+ if (!this.getBooleanOption("errorBars")) {
+ for (j = 0; j < colIdx.length; j++) {
+ var col = colIdx[j];
+ row.push(data.getValue(i, col));
+ if (hasAnnotations &&
+ annotationCols.hasOwnProperty(col) &&
+ data.getValue(i, annotationCols[col][0]) !== null) {
+ var ann = {};
+ ann.series = data.getColumnLabel(col);
+ ann.xval = row[0];
+ ann.shortText = shortTextForAnnotationNum(annotations.length);
+ ann.text = '';
+ for (var k = 0; k < annotationCols[col].length; k++) {
+ if (k) ann.text += "\n";
+ ann.text += data.getValue(i, annotationCols[col][k]);
+ }
+ annotations.push(ann);
+ }
+ }
+
+ // Strip out infinities, which give dygraphs problems later on.
+ for (j = 0; j < row.length; j++) {
+ if (!isFinite(row[j])) row[j] = null;
+ }
+ } else {
+ for (j = 0; j < cols - 1; j++) {
+ row.push([ data.getValue(i, 1 + 2 * j), data.getValue(i, 2 + 2 * j) ]);
+ }
+ }
+ if (ret.length > 0 && row[0] < ret[ret.length - 1][0]) {
+ outOfOrder = true;
+ }
+ ret.push(row);
+ }
+
+ if (outOfOrder) {
+ console.warn("DataTable is out of order; order it correctly to speed loading.");
+ ret.sort(function(a,b) { return a[0] - b[0]; });
+ }
+ this.rawData_ = ret;
+
+ if (annotations.length > 0) {
+ this.setAnnotations(annotations, true);
+ }
+ this.attributes_.reparseSeries();
+};
+
+/**
+ * Signals to plugins that the chart data has updated.
+ * This happens after the data has updated but before the chart has redrawn.
+ */
+Dygraph.prototype.cascadeDataDidUpdateEvent_ = function() {
+ // TODO(danvk): there are some issues checking xAxisRange() and using
+ // toDomCoords from handlers of this event. The visible range should be set
+ // when the chart is drawn, not derived from the data.
+ this.cascadeEvents_('dataDidUpdate', {});
+};
+
+/**
+ * Get the CSV data. If it's in a function, call that function. If it's in a
+ * file, do an XMLHttpRequest to get it.
+ * @private
+ */
+Dygraph.prototype.start_ = function() {
+ var data = this.file_;
+
+ // Functions can return references of all other types.
+ if (typeof data == 'function') {
+ data = data();
+ }
+
+ if (Dygraph.isArrayLike(data)) {
+ this.rawData_ = this.parseArray_(data);
+ this.cascadeDataDidUpdateEvent_();
+ this.predraw_();
+ } else if (typeof data == 'object' &&
+ typeof data.getColumnRange == 'function') {
+ // must be a DataTable from gviz.
+ this.parseDataTable_(data);
+ this.cascadeDataDidUpdateEvent_();
+ this.predraw_();
+ } else if (typeof data == 'string') {
+ // Heuristic: a newline means it's CSV data. Otherwise it's an URL.
+ var line_delimiter = Dygraph.detectLineDelimiter(data);
+ if (line_delimiter) {
+ this.loadedEvent_(data);
+ } else {
+ // REMOVE_FOR_IE
+ var req;
+ if (window.XMLHttpRequest) {
+ // Firefox, Opera, IE7, and other browsers will use the native object
+ req = new XMLHttpRequest();
+ } else {
+ // IE 5 and 6 will use the ActiveX control
+ req = new ActiveXObject("Microsoft.XMLHTTP");
+ }
+
+ var caller = this;
+ req.onreadystatechange = function () {
+ if (req.readyState == 4) {
+ if (req.status === 200 || // Normal http
+ req.status === 0) { // Chrome w/ --allow-file-access-from-files
+ caller.loadedEvent_(req.responseText);
+ }
+ }
+ };
+
+ req.open("GET", data, true);
+ req.send(null);
+ }
+ } else {
+ console.error("Unknown data format: " + (typeof data));
+ }
+};
+
+/**
+ * Changes various properties of the graph. These can include:
+ * <ul>
+ * <li>file: changes the source data for the graph</li>
+ * <li>errorBars: changes whether the data contains stddev</li>
+ * </ul>
+ *
+ * There's a huge variety of options that can be passed to this method. For a
+ * full list, see http://dygraphs.com/options.html.
+ *
+ * @param {Object} input_attrs The new properties and values
+ * @param {boolean} block_redraw Usually the chart is redrawn after every
+ * call to updateOptions(). If you know better, you can pass true to
+ * explicitly block the redraw. This can be useful for chaining
+ * updateOptions() calls, avoiding the occasional infinite loop and
+ * preventing redraws when it's not necessary (e.g. when updating a
+ * callback).
+ */
+Dygraph.prototype.updateOptions = function(input_attrs, block_redraw) {
+ if (typeof(block_redraw) == 'undefined') block_redraw = false;
+
+ // mapLegacyOptions_ drops the "file" parameter as a convenience to us.
+ var file = input_attrs.file;
+ var attrs = Dygraph.mapLegacyOptions_(input_attrs);
+
+ // TODO(danvk): this is a mess. Move these options into attr_.
+ if ('rollPeriod' in attrs) {
+ this.rollPeriod_ = attrs.rollPeriod;
+ }
+ if ('dateWindow' in attrs) {
+ this.dateWindow_ = attrs.dateWindow;
+ if (!('isZoomedIgnoreProgrammaticZoom' in attrs)) {
+ this.zoomed_x_ = (attrs.dateWindow !== null);
+ }
+ }
+ if ('valueRange' in attrs && !('isZoomedIgnoreProgrammaticZoom' in attrs)) {
+ this.zoomed_y_ = (attrs.valueRange !== null);
+ }
+
+ // TODO(danvk): validate per-series options.
+ // Supported:
+ // strokeWidth
+ // pointSize
+ // drawPoints
+ // highlightCircleSize
+
+ // Check if this set options will require new points.
+ var requiresNewPoints = Dygraph.isPixelChangingOptionList(this.attr_("labels"), attrs);
+
+ Dygraph.updateDeep(this.user_attrs_, attrs);
+
+ this.attributes_.reparseSeries();
+
+ if (file) {
+ // This event indicates that the data is about to change, but hasn't yet.
+ // TODO(danvk): support cancelation of the update via this event.
+ this.cascadeEvents_('dataWillUpdate', {});
+
+ this.file_ = file;
+ if (!block_redraw) this.start_();
+ } else {
+ if (!block_redraw) {
+ if (requiresNewPoints) {
+ this.predraw_();
+ } else {
+ this.renderGraph_(false);
+ }
+ }
+ }
+};
+
+/**
+ * Returns a copy of the options with deprecated names converted into current
+ * names. Also drops the (potentially-large) 'file' attribute. If the caller is
+ * interested in that, they should save a copy before calling this.
+ * @private
+ */
+Dygraph.mapLegacyOptions_ = function(attrs) {
+ var my_attrs = {};
+ for (var k in attrs) {
+ if (!attrs.hasOwnProperty(k)) continue;
+ if (k == 'file') continue;
+ if (attrs.hasOwnProperty(k)) my_attrs[k] = attrs[k];
+ }
+
+ var set = function(axis, opt, value) {
+ if (!my_attrs.axes) my_attrs.axes = {};
+ if (!my_attrs.axes[axis]) my_attrs.axes[axis] = {};
+ my_attrs.axes[axis][opt] = value;
+ };
+ var map = function(opt, axis, new_opt) {
+ if (typeof(attrs[opt]) != 'undefined') {
+ console.warn("Option " + opt + " is deprecated. Use the " +
+ new_opt + " option for the " + axis + " axis instead. " +
+ "(e.g. { axes : { " + axis + " : { " + new_opt + " : ... } } } " +
+ "(see http://dygraphs.com/per-axis.html for more information.");
+ set(axis, new_opt, attrs[opt]);
+ delete my_attrs[opt];
+ }
+ };
+
+ // This maps, e.g., xValueFormater -> axes: { x: { valueFormatter: ... } }
+ map('xValueFormatter', 'x', 'valueFormatter');
+ map('pixelsPerXLabel', 'x', 'pixelsPerLabel');
+ map('xAxisLabelFormatter', 'x', 'axisLabelFormatter');
+ map('xTicker', 'x', 'ticker');
+ map('yValueFormatter', 'y', 'valueFormatter');
+ map('pixelsPerYLabel', 'y', 'pixelsPerLabel');
+ map('yAxisLabelFormatter', 'y', 'axisLabelFormatter');
+ map('yTicker', 'y', 'ticker');
+ map('drawXGrid', 'x', 'drawGrid');
+ map('drawXAxis', 'x', 'drawAxis');
+ map('drawYGrid', 'y', 'drawGrid');
+ map('drawYAxis', 'y', 'drawAxis');
+ map('xAxisLabelWidth', 'x', 'axisLabelWidth');
+ map('yAxisLabelWidth', 'y', 'axisLabelWidth');
+ return my_attrs;
+};
+
+/**
+ * Resizes the dygraph. If no parameters are specified, resizes to fill the
+ * containing div (which has presumably changed size since the dygraph was
+ * instantiated. If the width/height are specified, the div will be resized.
+ *
+ * This is far more efficient than destroying and re-instantiating a
+ * Dygraph, since it doesn't have to reparse the underlying data.
+ *
+ * @param {number} width Width (in pixels)
+ * @param {number} height Height (in pixels)
+ */
+Dygraph.prototype.resize = function(width, height) {
+ if (this.resize_lock) {
+ return;
+ }
+ this.resize_lock = true;
+
+ if ((width === null) != (height === null)) {
+ console.warn("Dygraph.resize() should be called with zero parameters or " +
+ "two non-NULL parameters. Pretending it was zero.");
+ width = height = null;
+ }
+
+ var old_width = this.width_;
+ var old_height = this.height_;
+
+ if (width) {
+ this.maindiv_.style.width = width + "px";
+ this.maindiv_.style.height = height + "px";
+ this.width_ = width;
+ this.height_ = height;
+ } else {
+ this.width_ = this.maindiv_.clientWidth;
+ this.height_ = this.maindiv_.clientHeight;
+ }
+
+ if (old_width != this.width_ || old_height != this.height_) {
+ // Resizing a canvas erases it, even when the size doesn't change, so
+ // any resize needs to be followed by a redraw.
+ this.resizeElements_();
+ this.predraw_();
+ }
+
+ this.resize_lock = false;
+};
+
+/**
+ * Adjusts the number of points in the rolling average. Updates the graph to
+ * reflect the new averaging period.
+ * @param {number} length Number of points over which to average the data.
+ */
+Dygraph.prototype.adjustRoll = function(length) {
+ this.rollPeriod_ = length;
+ this.predraw_();
+};
+
+/**
+ * Returns a boolean array of visibility statuses.
+ */
+Dygraph.prototype.visibility = function() {
+ // Do lazy-initialization, so that this happens after we know the number of
+ // data series.
+ if (!this.getOption("visibility")) {
+ this.attrs_.visibility = [];
+ }
+ // TODO(danvk): it looks like this could go into an infinite loop w/ user_attrs.
+ while (this.getOption("visibility").length < this.numColumns() - 1) {
+ this.attrs_.visibility.push(true);
+ }
+ return this.getOption("visibility");
+};
+
+/**
+ * Changes the visiblity of a series.
+ *
+ * @param {number} num the series index
+ * @param {boolean} value true or false, identifying the visibility.
+ */
+Dygraph.prototype.setVisibility = function(num, value) {
+ var x = this.visibility();
+ if (num < 0 || num >= x.length) {
+ console.warn("invalid series number in setVisibility: " + num);
+ } else {
+ x[num] = value;
+ this.predraw_();
+ }
+};
+
+/**
+ * How large of an area will the dygraph render itself in?
+ * This is used for testing.
+ * @return A {width: w, height: h} object.
+ * @private
+ */
+Dygraph.prototype.size = function() {
+ return { width: this.width_, height: this.height_ };
+};
+
+/**
+ * Update the list of annotations and redraw the chart.
+ * See dygraphs.com/annotations.html for more info on how to use annotations.
+ * @param ann {Array} An array of annotation objects.
+ * @param suppressDraw {Boolean} Set to "true" to block chart redraw (optional).
+ */
+Dygraph.prototype.setAnnotations = function(ann, suppressDraw) {
+ // Only add the annotation CSS rule once we know it will be used.
+ Dygraph.addAnnotationRule();
+ this.annotations_ = ann;
+ if (!this.layout_) {
+ console.warn("Tried to setAnnotations before dygraph was ready. " +
+ "Try setting them in a ready() block. See " +
+ "dygraphs.com/tests/annotation.html");
+ return;
+ }
+
+ this.layout_.setAnnotations(this.annotations_);
+ if (!suppressDraw) {
+ this.predraw_();
+ }
+};
+
+/**
+ * Return the list of annotations.
+ */
+Dygraph.prototype.annotations = function() {
+ return this.annotations_;
+};
+
+/**
+ * Get the list of label names for this graph. The first column is the
+ * x-axis, so the data series names start at index 1.
+ *
+ * Returns null when labels have not yet been defined.
+ */
+Dygraph.prototype.getLabels = function() {
+ var labels = this.attr_("labels");
+ return labels ? labels.slice() : null;
+};
+
+/**
+ * Get the index of a series (column) given its name. The first column is the
+ * x-axis, so the data series start with index 1.
+ */
+Dygraph.prototype.indexFromSetName = function(name) {
+ return this.setIndexByName_[name];
+};
+
+/**
+ * Trigger a callback when the dygraph has drawn itself and is ready to be
+ * manipulated. This is primarily useful when dygraphs has to do an XHR for the
+ * data (i.e. a URL is passed as the data source) and the chart is drawn
+ * asynchronously. If the chart has already drawn, the callback will fire
+ * immediately.
+ *
+ * This is a good place to call setAnnotation().
+ *
+ * @param {function(!Dygraph)} callback The callback to trigger when the chart
+ * is ready.
+ */
+Dygraph.prototype.ready = function(callback) {
+ if (this.is_initial_draw_) {
+ this.readyFns_.push(callback);
+ } else {
+ callback.call(this, this);
+ }
+};
+
+/**
+ * @private
+ * Adds a default style for the annotation CSS classes to the document. This is
+ * only executed when annotations are actually used. It is designed to only be
+ * called once -- all calls after the first will return immediately.
+ */
+Dygraph.addAnnotationRule = function() {
+ // TODO(danvk): move this function into plugins/annotations.js?
+ if (Dygraph.addedAnnotationCSS) return;
+
+ var rule = "border: 1px solid black; " +
+ "background-color: white; " +
+ "text-align: center;";
+
+ var styleSheetElement = document.createElement("style");
+ styleSheetElement.type = "text/css";
+ document.getElementsByTagName("head")[0].appendChild(styleSheetElement);
+
+ // Find the first style sheet that we can access.
+ // We may not add a rule to a style sheet from another domain for security
+ // reasons. This sometimes comes up when using gviz, since the Google gviz JS
+ // adds its own style sheets from google.com.
+ for (var i = 0; i < document.styleSheets.length; i++) {
+ if (document.styleSheets[i].disabled) continue;
+ var mysheet = document.styleSheets[i];
+ try {
+ if (mysheet.insertRule) { // Firefox
+ var idx = mysheet.cssRules ? mysheet.cssRules.length : 0;
+ mysheet.insertRule(".dygraphDefaultAnnotation { " + rule + " }", idx);
+ } else if (mysheet.addRule) { // IE
+ mysheet.addRule(".dygraphDefaultAnnotation", rule);
+ }
+ Dygraph.addedAnnotationCSS = true;
+ return;
+ } catch(err) {
+ // Was likely a security exception.
+ }
+ }
+
+ console.warn("Unable to add default annotation CSS rule; display may be off.");
+};
+
+return Dygraph;
+
+})();
+/**
+ * @license
+ * Copyright 2011 Dan Vanderkam (danvdk@gmail.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+
+/**
+ * @fileoverview This file contains utility functions used by dygraphs. These
+ * are typically static (i.e. not related to any particular dygraph). Examples
+ * include date/time formatting functions, basic algorithms (e.g. binary
+ * search) and generic DOM-manipulation functions.
+ */
+
+(function() {
+
+/*global Dygraph:false, G_vmlCanvasManager:false, Node:false */
+"use strict";
+
+Dygraph.LOG_SCALE = 10;
+Dygraph.LN_TEN = Math.log(Dygraph.LOG_SCALE);
+
+/**
+ * @private
+ * @param {number} x
+ * @return {number}
+ */
+Dygraph.log10 = function(x) {
+ return Math.log(x) / Dygraph.LN_TEN;
+};
+
+/** A dotted line stroke pattern. */
+Dygraph.DOTTED_LINE = [2, 2];
+/** A dashed line stroke pattern. */
+Dygraph.DASHED_LINE = [7, 3];
+/** A dot dash stroke pattern. */
+Dygraph.DOT_DASH_LINE = [7, 2, 2, 2];
+
+/**
+ * Return the 2d context for a dygraph canvas.
+ *
+ * This method is only exposed for the sake of replacing the function in
+ * automated tests, e.g.
+ *
+ * var oldFunc = Dygraph.getContext();
+ * Dygraph.getContext = function(canvas) {
+ * var realContext = oldFunc(canvas);
+ * return new Proxy(realContext);
+ * };
+ * @param {!HTMLCanvasElement} canvas
+ * @return {!CanvasRenderingContext2D}
+ * @private
+ */
+Dygraph.getContext = function(canvas) {
+ return /** @type{!CanvasRenderingContext2D}*/(canvas.getContext("2d"));
+};
+
+/**
+ * Add an event handler. This smooths a difference between IE and the rest of
+ * the world.
+ * @param {!Node} elem The element to add the event to.
+ * @param {string} type The type of the event, e.g. 'click' or 'mousemove'.
+ * @param {function(Event):(boolean|undefined)} fn The function to call
+ * on the event. The function takes one parameter: the event object.
+ * @private
+ */
+Dygraph.addEvent = function addEvent(elem, type, fn) {
+ if (elem.addEventListener) {
+ elem.addEventListener(type, fn, false);
+ } else {
+ elem[type+fn] = function(){fn(window.event);};
+ elem.attachEvent('on'+type, elem[type+fn]);
+ }
+};
+
+/**
+ * Add an event handler. This event handler is kept until the graph is
+ * destroyed with a call to graph.destroy().
+ *
+ * @param {!Node} elem The element to add the event to.
+ * @param {string} type The type of the event, e.g. 'click' or 'mousemove'.
+ * @param {function(Event):(boolean|undefined)} fn The function to call
+ * on the event. The function takes one parameter: the event object.
+ * @private
+ */
+Dygraph.prototype.addAndTrackEvent = function(elem, type, fn) {
+ Dygraph.addEvent(elem, type, fn);
+ this.registeredEvents_.push({ elem : elem, type : type, fn : fn });
+};
+
+/**
+ * Remove an event handler. This smooths a difference between IE and the rest
+ * of the world.
+ * @param {!Node} elem The element to remove the event from.
+ * @param {string} type The type of the event, e.g. 'click' or 'mousemove'.
+ * @param {function(Event):(boolean|undefined)} fn The function to call
+ * on the event. The function takes one parameter: the event object.
+ * @private
+ */
+Dygraph.removeEvent = function(elem, type, fn) {
+ if (elem.removeEventListener) {
+ elem.removeEventListener(type, fn, false);
+ } else {
+ try {
+ elem.detachEvent('on'+type, elem[type+fn]);
+ } catch(e) {
+ // We only detach event listeners on a "best effort" basis in IE. See:
+ // http://stackoverflow.com/questions/2553632/detachevent-not-working-with-named-inline-functions
+ }
+ elem[type+fn] = null;
+ }
+};
+
+Dygraph.prototype.removeTrackedEvents_ = function() {
+ if (this.registeredEvents_) {
+ for (var idx = 0; idx < this.registeredEvents_.length; idx++) {
+ var reg = this.registeredEvents_[idx];
+ Dygraph.removeEvent(reg.elem, reg.type, reg.fn);
+ }
+ }
+
+ this.registeredEvents_ = [];
+};
+
+/**
+ * Cancels further processing of an event. This is useful to prevent default
+ * browser actions, e.g. highlighting text on a double-click.
+ * Based on the article at
+ * http://www.switchonthecode.com/tutorials/javascript-tutorial-the-scroll-wheel
+ * @param {!Event} e The event whose normal behavior should be canceled.
+ * @private
+ */
+Dygraph.cancelEvent = function(e) {
+ e = e ? e : window.event;
+ if (e.stopPropagation) {
+ e.stopPropagation();
+ }
+ if (e.preventDefault) {
+ e.preventDefault();
+ }
+ e.cancelBubble = true;
+ e.cancel = true;
+ e.returnValue = false;
+ return false;
+};
+
+/**
+ * Convert hsv values to an rgb(r,g,b) string. Taken from MochiKit.Color. This
+ * is used to generate default series colors which are evenly spaced on the
+ * color wheel.
+ * @param { number } hue Range is 0.0-1.0.
+ * @param { number } saturation Range is 0.0-1.0.
+ * @param { number } value Range is 0.0-1.0.
+ * @return { string } "rgb(r,g,b)" where r, g and b range from 0-255.
+ * @private
+ */
+Dygraph.hsvToRGB = function (hue, saturation, value) {
+ var red;
+ var green;
+ var blue;
+ if (saturation === 0) {
+ red = value;
+ green = value;
+ blue = value;
+ } else {
+ var i = Math.floor(hue * 6);
+ var f = (hue * 6) - i;
+ var p = value * (1 - saturation);
+ var q = value * (1 - (saturation * f));
+ var t = value * (1 - (saturation * (1 - f)));
+ switch (i) {
+ case 1: red = q; green = value; blue = p; break;
+ case 2: red = p; green = value; blue = t; break;
+ case 3: red = p; green = q; blue = value; break;
+ case 4: red = t; green = p; blue = value; break;
+ case 5: red = value; green = p; blue = q; break;
+ case 6: // fall through
+ case 0: red = value; green = t; blue = p; break;
+ }
+ }
+ red = Math.floor(255 * red + 0.5);
+ green = Math.floor(255 * green + 0.5);
+ blue = Math.floor(255 * blue + 0.5);
+ return 'rgb(' + red + ',' + green + ',' + blue + ')';
+};
+
+// The following functions are from quirksmode.org with a modification for Safari from
+// http://blog.firetree.net/2005/07/04/javascript-find-position/
+// http://www.quirksmode.org/js/findpos.html
+// ... and modifications to support scrolling divs.
+
+/**
+ * Find the coordinates of an object relative to the top left of the page.
+ *
+ * TODO(danvk): change obj type from Node -&gt; !Node
+ * @param {Node} obj
+ * @return {{x:number,y:number}}
+ * @private
+ */
+Dygraph.findPos = function(obj) {
+ var curleft = 0, curtop = 0;
+ if (obj.offsetParent) {
+ var copyObj = obj;
+ while (1) {
+ // NOTE: the if statement here is for IE8.
+ var borderLeft = "0", borderTop = "0";
+ if (window.getComputedStyle) {
+ var computedStyle = window.getComputedStyle(copyObj, null);
+ borderLeft = computedStyle.borderLeft || "0";
+ borderTop = computedStyle.borderTop || "0";
+ }
+ curleft += parseInt(borderLeft, 10) ;
+ curtop += parseInt(borderTop, 10) ;
+ curleft += copyObj.offsetLeft;
+ curtop += copyObj.offsetTop;
+ if (!copyObj.offsetParent) {
+ break;
+ }
+ copyObj = copyObj.offsetParent;
+ }
+ } else {
+ // TODO(danvk): why would obj ever have these properties?
+ if (obj.x) curleft += obj.x;
+ if (obj.y) curtop += obj.y;
+ }
+
+ // This handles the case where the object is inside a scrolled div.
+ while (obj && obj != document.body) {
+ curleft -= obj.scrollLeft;
+ curtop -= obj.scrollTop;
+ obj = obj.parentNode;
+ }
+ return {x: curleft, y: curtop};
+};
+
+/**
+ * Returns the x-coordinate of the event in a coordinate system where the
+ * top-left corner of the page (not the window) is (0,0).
+ * Taken from MochiKit.Signal
+ * @param {!Event} e
+ * @return {number}
+ * @private
+ */
+Dygraph.pageX = function(e) {
+ if (e.pageX) {
+ return (!e.pageX || e.pageX < 0) ? 0 : e.pageX;
+ } else {
+ var de = document.documentElement;
+ var b = document.body;
+ return e.clientX +
+ (de.scrollLeft || b.scrollLeft) -
+ (de.clientLeft || 0);
+ }
+};
+
+/**
+ * Returns the y-coordinate of the event in a coordinate system where the
+ * top-left corner of the page (not the window) is (0,0).
+ * Taken from MochiKit.Signal
+ * @param {!Event} e
+ * @return {number}
+ * @private
+ */
+Dygraph.pageY = function(e) {
+ if (e.pageY) {
+ return (!e.pageY || e.pageY < 0) ? 0 : e.pageY;
+ } else {
+ var de = document.documentElement;
+ var b = document.body;
+ return e.clientY +
+ (de.scrollTop || b.scrollTop) -
+ (de.clientTop || 0);
+ }
+};
+
+/**
+ * Converts page the x-coordinate of the event to pixel x-coordinates on the
+ * canvas (i.e. DOM Coords).
+ * @param {!Event} e Drag event.
+ * @param {!DygraphInteractionContext} context Interaction context object.
+ * @return {number} The amount by which the drag has moved to the right.
+ */
+Dygraph.dragGetX_ = function(e, context) {
+ return Dygraph.pageX(e) - context.px;
+};
+
+/**
+ * Converts page the y-coordinate of the event to pixel y-coordinates on the
+ * canvas (i.e. DOM Coords).
+ * @param {!Event} e Drag event.
+ * @param {!DygraphInteractionContext} context Interaction context object.
+ * @return {number} The amount by which the drag has moved down.
+ */
+Dygraph.dragGetY_ = function(e, context) {
+ return Dygraph.pageY(e) - context.py;
+};
+
+/**
+ * This returns true unless the parameter is 0, null, undefined or NaN.
+ * TODO(danvk): rename this function to something like 'isNonZeroNan'.
+ *
+ * @param {number} x The number to consider.
+ * @return {boolean} Whether the number is zero or NaN.
+ * @private
+ */
+Dygraph.isOK = function(x) {
+ return !!x && !isNaN(x);
+};
+
+/**
+ * @param {{x:?number,y:?number,yval:?number}} p The point to consider, valid
+ * points are {x, y} objects
+ * @param {boolean=} opt_allowNaNY Treat point with y=NaN as valid
+ * @return {boolean} Whether the point has numeric x and y.
+ * @private
+ */
+Dygraph.isValidPoint = function(p, opt_allowNaNY) {
+ if (!p) return false; // null or undefined object
+ if (p.yval === null) return false; // missing point
+ if (p.x === null || p.x === undefined) return false;
+ if (p.y === null || p.y === undefined) return false;
+ if (isNaN(p.x) || (!opt_allowNaNY && isNaN(p.y))) return false;
+ return true;
+};
+
+/**
+ * Number formatting function which mimicks the behavior of %g in printf, i.e.
+ * either exponential or fixed format (without trailing 0s) is used depending on
+ * the length of the generated string. The advantage of this format is that
+ * there is a predictable upper bound on the resulting string length,
+ * significant figures are not dropped, and normal numbers are not displayed in
+ * exponential notation.
+ *
+ * NOTE: JavaScript's native toPrecision() is NOT a drop-in replacement for %g.
+ * It creates strings which are too long for absolute values between 10^-4 and
+ * 10^-6, e.g. '0.00001' instead of '1e-5'. See tests/number-format.html for
+ * output examples.
+ *
+ * @param {number} x The number to format
+ * @param {number=} opt_precision The precision to use, default 2.
+ * @return {string} A string formatted like %g in printf. The max generated
+ * string length should be precision + 6 (e.g 1.123e+300).
+ */
+Dygraph.floatFormat = function(x, opt_precision) {
+ // Avoid invalid precision values; [1, 21] is the valid range.
+ var p = Math.min(Math.max(1, opt_precision || 2), 21);
+
+ // This is deceptively simple. The actual algorithm comes from:
+ //
+ // Max allowed length = p + 4
+ // where 4 comes from 'e+n' and '.'.
+ //
+ // Length of fixed format = 2 + y + p
+ // where 2 comes from '0.' and y = # of leading zeroes.
+ //
+ // Equating the two and solving for y yields y = 2, or 0.00xxxx which is
+ // 1.0e-3.
+ //
+ // Since the behavior of toPrecision() is identical for larger numbers, we
+ // don't have to worry about the other bound.
+ //
+ // Finally, the argument for toExponential() is the number of trailing digits,
+ // so we take off 1 for the value before the '.'.
+ return (Math.abs(x) < 1.0e-3 && x !== 0.0) ?
+ x.toExponential(p - 1) : x.toPrecision(p);
+};
+
+/**
+ * Converts '9' to '09' (useful for dates)
+ * @param {number} x
+ * @return {string}
+ * @private
+ */
+Dygraph.zeropad = function(x) {
+ if (x < 10) return "0" + x; else return "" + x;
+};
+
+/**
+ * Date accessors to get the parts of a calendar date (year, month,
+ * day, hour, minute, second and millisecond) according to local time,
+ * and factory method to call the Date constructor with an array of arguments.
+ */
+Dygraph.DateAccessorsLocal = {
+ getFullYear: function(d) {return d.getFullYear();},
+ getMonth: function(d) {return d.getMonth();},
+ getDate: function(d) {return d.getDate();},
+ getHours: function(d) {return d.getHours();},
+ getMinutes: function(d) {return d.getMinutes();},
+ getSeconds: function(d) {return d.getSeconds();},
+ getMilliseconds: function(d) {return d.getMilliseconds();},
+ getDay: function(d) {return d.getDay();},
+ makeDate: function(y, m, d, hh, mm, ss, ms) {
+ return new Date(y, m, d, hh, mm, ss, ms);
+ }
+};
+
+/**
+ * Date accessors to get the parts of a calendar date (year, month,
+ * day of month, hour, minute, second and millisecond) according to UTC time,
+ * and factory method to call the Date constructor with an array of arguments.
+ */
+Dygraph.DateAccessorsUTC = {
+ getFullYear: function(d) {return d.getUTCFullYear();},
+ getMonth: function(d) {return d.getUTCMonth();},
+ getDate: function(d) {return d.getUTCDate();},
+ getHours: function(d) {return d.getUTCHours();},
+ getMinutes: function(d) {return d.getUTCMinutes();},
+ getSeconds: function(d) {return d.getUTCSeconds();},
+ getMilliseconds: function(d) {return d.getUTCMilliseconds();},
+ getDay: function(d) {return d.getUTCDay();},
+ makeDate: function(y, m, d, hh, mm, ss, ms) {
+ return new Date(Date.UTC(y, m, d, hh, mm, ss, ms));
+ }
+};
+
+/**
+ * Return a string version of the hours, minutes and seconds portion of a date.
+ * @param {number} hh The hours (from 0-23)
+ * @param {number} mm The minutes (from 0-59)
+ * @param {number} ss The seconds (from 0-59)
+ * @return {string} A time of the form "HH:MM" or "HH:MM:SS"
+ * @private
+ */
+Dygraph.hmsString_ = function(hh, mm, ss) {
+ var zeropad = Dygraph.zeropad;
+ var ret = zeropad(hh) + ":" + zeropad(mm);
+ if (ss) {
+ ret += ":" + zeropad(ss);
+ }
+ return ret;
+};
+
+/**
+ * Convert a JS date (millis since epoch) to a formatted string.
+ * @param {number} time The JavaScript time value (ms since epoch)
+ * @param {boolean} utc Wether output UTC or local time
+ * @return {string} A date of one of these forms:
+ * "YYYY/MM/DD", "YYYY/MM/DD HH:MM" or "YYYY/MM/DD HH:MM:SS"
+ * @private
+ */
+Dygraph.dateString_ = function(time, utc) {
+ var zeropad = Dygraph.zeropad;
+ var accessors = utc ? Dygraph.DateAccessorsUTC : Dygraph.DateAccessorsLocal;
+ var date = new Date(time);
+ var y = accessors.getFullYear(date);
+ var m = accessors.getMonth(date);
+ var d = accessors.getDate(date);
+ var hh = accessors.getHours(date);
+ var mm = accessors.getMinutes(date);
+ var ss = accessors.getSeconds(date);
+ // Get a year string:
+ var year = "" + y;
+ // Get a 0 padded month string
+ var month = zeropad(m + 1); //months are 0-offset, sigh
+ // Get a 0 padded day string
+ var day = zeropad(d);
+ var frac = hh * 3600 + mm * 60 + ss;
+ var ret = year + "/" + month + "/" + day;
+ if (frac) {
+ ret += " " + Dygraph.hmsString_(hh, mm, ss);
+ }
+ return ret;
+};
+
+/**
+ * Round a number to the specified number of digits past the decimal point.
+ * @param {number} num The number to round
+ * @param {number} places The number of decimals to which to round
+ * @return {number} The rounded number
+ * @private
+ */
+Dygraph.round_ = function(num, places) {
+ var shift = Math.pow(10, places);
+ return Math.round(num * shift)/shift;
+};
+
+/**
+ * Implementation of binary search over an array.
+ * Currently does not work when val is outside the range of arry's values.
+ * @param {number} val the value to search for
+ * @param {Array.<number>} arry is the value over which to search
+ * @param {number} abs If abs > 0, find the lowest entry greater than val
+ * If abs < 0, find the highest entry less than val.
+ * If abs == 0, find the entry that equals val.
+ * @param {number=} low The first index in arry to consider (optional)
+ * @param {number=} high The last index in arry to consider (optional)
+ * @return {number} Index of the element, or -1 if it isn't found.
+ * @private
+ */
+Dygraph.binarySearch = function(val, arry, abs, low, high) {
+ if (low === null || low === undefined ||
+ high === null || high === undefined) {
+ low = 0;
+ high = arry.length - 1;
+ }
+ if (low > high) {
+ return -1;
+ }
+ if (abs === null || abs === undefined) {
+ abs = 0;
+ }
+ var validIndex = function(idx) {
+ return idx >= 0 && idx < arry.length;
+ };
+ var mid = parseInt((low + high) / 2, 10);
+ var element = arry[mid];
+ var idx;
+ if (element == val) {
+ return mid;
+ } else if (element > val) {
+ if (abs > 0) {
+ // Accept if element > val, but also if prior element < val.
+ idx = mid - 1;
+ if (validIndex(idx) && arry[idx] < val) {
+ return mid;
+ }
+ }
+ return Dygraph.binarySearch(val, arry, abs, low, mid - 1);
+ } else if (element < val) {
+ if (abs < 0) {
+ // Accept if element < val, but also if prior element > val.
+ idx = mid + 1;
+ if (validIndex(idx) && arry[idx] > val) {
+ return mid;
+ }
+ }
+ return Dygraph.binarySearch(val, arry, abs, mid + 1, high);
+ }
+ return -1; // can't actually happen, but makes closure compiler happy
+};
+
+/**
+ * Parses a date, returning the number of milliseconds since epoch. This can be
+ * passed in as an xValueParser in the Dygraph constructor.
+ * TODO(danvk): enumerate formats that this understands.
+ *
+ * @param {string} dateStr A date in a variety of possible string formats.
+ * @return {number} Milliseconds since epoch.
+ * @private
+ */
+Dygraph.dateParser = function(dateStr) {
+ var dateStrSlashed;
+ var d;
+
+ // Let the system try the format first, with one caveat:
+ // YYYY-MM-DD[ HH:MM:SS] is interpreted as UTC by a variety of browsers.
+ // dygraphs displays dates in local time, so this will result in surprising
+ // inconsistencies. But if you specify "T" or "Z" (i.e. YYYY-MM-DDTHH:MM:SS),
+ // then you probably know what you're doing, so we'll let you go ahead.
+ // Issue: http://code.google.com/p/dygraphs/issues/detail?id=255
+ if (dateStr.search("-") == -1 ||
+ dateStr.search("T") != -1 || dateStr.search("Z") != -1) {
+ d = Dygraph.dateStrToMillis(dateStr);
+ if (d && !isNaN(d)) return d;
+ }
+
+ if (dateStr.search("-") != -1) { // e.g. '2009-7-12' or '2009-07-12'
+ dateStrSlashed = dateStr.replace("-", "/", "g");
+ while (dateStrSlashed.search("-") != -1) {
+ dateStrSlashed = dateStrSlashed.replace("-", "/");
+ }
+ d = Dygraph.dateStrToMillis(dateStrSlashed);
+ } else if (dateStr.length == 8) { // e.g. '20090712'
+ // TODO(danvk): remove support for this format. It's confusing.
+ dateStrSlashed = dateStr.substr(0,4) + "/" + dateStr.substr(4,2) + "/" +
+ dateStr.substr(6,2);
+ d = Dygraph.dateStrToMillis(dateStrSlashed);
+ } else {
+ // Any format that Date.parse will accept, e.g. "2009/07/12" or
+ // "2009/07/12 12:34:56"
+ d = Dygraph.dateStrToMillis(dateStr);
+ }
+
+ if (!d || isNaN(d)) {
+ console.error("Couldn't parse " + dateStr + " as a date");
+ }
+ return d;
+};
+
+/**
+ * This is identical to JavaScript's built-in Date.parse() method, except that
+ * it doesn't get replaced with an incompatible method by aggressive JS
+ * libraries like MooTools or Joomla.
+ * @param {string} str The date string, e.g. "2011/05/06"
+ * @return {number} millis since epoch
+ * @private
+ */
+Dygraph.dateStrToMillis = function(str) {
+ return new Date(str).getTime();
+};
+
+// These functions are all based on MochiKit.
+/**
+ * Copies all the properties from o to self.
+ *
+ * @param {!Object} self
+ * @param {!Object} o
+ * @return {!Object}
+ */
+Dygraph.update = function(self, o) {
+ if (typeof(o) != 'undefined' && o !== null) {
+ for (var k in o) {
+ if (o.hasOwnProperty(k)) {
+ self[k] = o[k];
+ }
+ }
+ }
+ return self;
+};
+
+/**
+ * Copies all the properties from o to self.
+ *
+ * @param {!Object} self
+ * @param {!Object} o
+ * @return {!Object}
+ * @private
+ */
+Dygraph.updateDeep = function (self, o) {
+ // Taken from http://stackoverflow.com/questions/384286/javascript-isdom-how-do-you-check-if-a-javascript-object-is-a-dom-object
+ function isNode(o) {
+ return (
+ typeof Node === "object" ? o instanceof Node :
+ typeof o === "object" && typeof o.nodeType === "number" && typeof o.nodeName==="string"
+ );
+ }
+
+ if (typeof(o) != 'undefined' && o !== null) {
+ for (var k in o) {
+ if (o.hasOwnProperty(k)) {
+ if (o[k] === null) {
+ self[k] = null;
+ } else if (Dygraph.isArrayLike(o[k])) {
+ self[k] = o[k].slice();
+ } else if (isNode(o[k])) {
+ // DOM objects are shallowly-copied.
+ self[k] = o[k];
+ } else if (typeof(o[k]) == 'object') {
+ if (typeof(self[k]) != 'object' || self[k] === null) {
+ self[k] = {};
+ }
+ Dygraph.updateDeep(self[k], o[k]);
+ } else {
+ self[k] = o[k];
+ }
+ }
+ }
+ }
+ return self;
+};
+
+/**
+ * @param {*} o
+ * @return {boolean}
+ * @private
+ */
+Dygraph.isArrayLike = function(o) {
+ var typ = typeof(o);
+ if (
+ (typ != 'object' && !(typ == 'function' &&
+ typeof(o.item) == 'function')) ||
+ o === null ||
+ typeof(o.length) != 'number' ||
+ o.nodeType === 3
+ ) {
+ return false;
+ }
+ return true;
+};
+
+/**
+ * @param {Object} o
+ * @return {boolean}
+ * @private
+ */
+Dygraph.isDateLike = function (o) {
+ if (typeof(o) != "object" || o === null ||
+ typeof(o.getTime) != 'function') {
+ return false;
+ }
+ return true;
+};
+
+/**
+ * Note: this only seems to work for arrays.
+ * @param {!Array} o
+ * @return {!Array}
+ * @private
+ */
+Dygraph.clone = function(o) {
+ // TODO(danvk): figure out how MochiKit's version works
+ var r = [];
+ for (var i = 0; i < o.length; i++) {
+ if (Dygraph.isArrayLike(o[i])) {
+ r.push(Dygraph.clone(o[i]));
+ } else {
+ r.push(o[i]);
+ }
+ }
+ return r;
+};
+
+/**
+ * Create a new canvas element. This is more complex than a simple
+ * document.createElement("canvas") because of IE and excanvas.
+ *
+ * @return {!HTMLCanvasElement}
+ * @private
+ */
+Dygraph.createCanvas = function() {
+ var canvas = document.createElement("canvas");
+
+ var isIE = (/MSIE/.test(navigator.userAgent) && !window.opera);
+ if (isIE && (typeof(G_vmlCanvasManager) != 'undefined')) {
+ canvas = G_vmlCanvasManager.initElement(
+ /**@type{!HTMLCanvasElement}*/(canvas));
+ }
+
+ return canvas;
+};
+
+/**
+ * Returns the context's pixel ratio, which is the ratio between the device
+ * pixel ratio and the backing store ratio. Typically this is 1 for conventional
+ * displays, and > 1 for HiDPI displays (such as the Retina MBP).
+ * See http://www.html5rocks.com/en/tutorials/canvas/hidpi/ for more details.
+ *
+ * @param {!CanvasRenderingContext2D} context The canvas's 2d context.
+ * @return {number} The ratio of the device pixel ratio and the backing store
+ * ratio for the specified context.
+ */
+Dygraph.getContextPixelRatio = function(context) {
+ try {
+ var devicePixelRatio = window.devicePixelRatio;
+ var backingStoreRatio = context.webkitBackingStorePixelRatio ||
+ context.mozBackingStorePixelRatio ||
+ context.msBackingStorePixelRatio ||
+ context.oBackingStorePixelRatio ||
+ context.backingStorePixelRatio || 1;
+ if (devicePixelRatio !== undefined) {
+ return devicePixelRatio / backingStoreRatio;
+ } else {
+ // At least devicePixelRatio must be defined for this ratio to make sense.
+ // We default backingStoreRatio to 1: this does not exist on some browsers
+ // (i.e. desktop Chrome).
+ return 1;
+ }
+ } catch (e) {
+ return 1;
+ }
+};
+
+/**
+ * Checks whether the user is on an Android browser.
+ * Android does not fully support the <canvas> tag, e.g. w/r/t/ clipping.
+ * @return {boolean}
+ * @private
+ */
+Dygraph.isAndroid = function() {
+ return (/Android/).test(navigator.userAgent);
+};
+
+
+/**
+ * TODO(danvk): use @template here when it's better supported for classes.
+ * @param {!Array} array
+ * @param {number} start
+ * @param {number} length
+ * @param {function(!Array,?):boolean=} predicate
+ * @constructor
+ */
+Dygraph.Iterator = function(array, start, length, predicate) {
+ start = start || 0;
+ length = length || array.length;
+ this.hasNext = true; // Use to identify if there's another element.
+ this.peek = null; // Use for look-ahead
+ this.start_ = start;
+ this.array_ = array;
+ this.predicate_ = predicate;
+ this.end_ = Math.min(array.length, start + length);
+ this.nextIdx_ = start - 1; // use -1 so initial advance works.
+ this.next(); // ignoring result.
+};
+
+/**
+ * @return {Object}
+ */
+Dygraph.Iterator.prototype.next = function() {
+ if (!this.hasNext) {
+ return null;
+ }
+ var obj = this.peek;
+
+ var nextIdx = this.nextIdx_ + 1;
+ var found = false;
+ while (nextIdx < this.end_) {
+ if (!this.predicate_ || this.predicate_(this.array_, nextIdx)) {
+ this.peek = this.array_[nextIdx];
+ found = true;
+ break;
+ }
+ nextIdx++;
+ }
+ this.nextIdx_ = nextIdx;
+ if (!found) {
+ this.hasNext = false;
+ this.peek = null;
+ }
+ return obj;
+};
+
+/**
+ * Returns a new iterator over array, between indexes start and
+ * start + length, and only returns entries that pass the accept function
+ *
+ * @param {!Array} array the array to iterate over.
+ * @param {number} start the first index to iterate over, 0 if absent.
+ * @param {number} length the number of elements in the array to iterate over.
+ * This, along with start, defines a slice of the array, and so length
+ * doesn't imply the number of elements in the iterator when accept doesn't
+ * always accept all values. array.length when absent.
+ * @param {function(?):boolean=} opt_predicate a function that takes
+ * parameters array and idx, which returns true when the element should be
+ * returned. If omitted, all elements are accepted.
+ * @private
+ */
+Dygraph.createIterator = function(array, start, length, opt_predicate) {
+ return new Dygraph.Iterator(array, start, length, opt_predicate);
+};
+
+// Shim layer with setTimeout fallback.
+// From: http://paulirish.com/2011/requestanimationframe-for-smart-animating/
+// Should be called with the window context:
+// Dygraph.requestAnimFrame.call(window, function() {})
+Dygraph.requestAnimFrame = (function() {
+ return window.requestAnimationFrame ||
+ window.webkitRequestAnimationFrame ||
+ window.mozRequestAnimationFrame ||
+ window.oRequestAnimationFrame ||
+ window.msRequestAnimationFrame ||
+ function (callback) {
+ window.setTimeout(callback, 1000 / 60);
+ };
+})();
+
+/**
+ * Call a function at most maxFrames times at an attempted interval of
+ * framePeriodInMillis, then call a cleanup function once. repeatFn is called
+ * once immediately, then at most (maxFrames - 1) times asynchronously. If
+ * maxFrames==1, then cleanup_fn() is also called synchronously. This function
+ * is used to sequence animation.
+ * @param {function(number)} repeatFn Called repeatedly -- takes the frame
+ * number (from 0 to maxFrames-1) as an argument.
+ * @param {number} maxFrames The max number of times to call repeatFn
+ * @param {number} framePeriodInMillis Max requested time between frames.
+ * @param {function()} cleanupFn A function to call after all repeatFn calls.
+ * @private
+ */
+Dygraph.repeatAndCleanup = function(repeatFn, maxFrames, framePeriodInMillis,
+ cleanupFn) {
+ var frameNumber = 0;
+ var previousFrameNumber;
+ var startTime = new Date().getTime();
+ repeatFn(frameNumber);
+ if (maxFrames == 1) {
+ cleanupFn();
+ return;
+ }
+ var maxFrameArg = maxFrames - 1;
+
+ (function loop() {
+ if (frameNumber >= maxFrames) return;
+ Dygraph.requestAnimFrame.call(window, function() {
+ // Determine which frame to draw based on the delay so far. Will skip
+ // frames if necessary.
+ var currentTime = new Date().getTime();
+ var delayInMillis = currentTime - startTime;
+ previousFrameNumber = frameNumber;
+ frameNumber = Math.floor(delayInMillis / framePeriodInMillis);
+ var frameDelta = frameNumber - previousFrameNumber;
+ // If we predict that the subsequent repeatFn call will overshoot our
+ // total frame target, so our last call will cause a stutter, then jump to
+ // the last call immediately. If we're going to cause a stutter, better
+ // to do it faster than slower.
+ var predictOvershootStutter = (frameNumber + frameDelta) > maxFrameArg;
+ if (predictOvershootStutter || (frameNumber >= maxFrameArg)) {
+ repeatFn(maxFrameArg); // Ensure final call with maxFrameArg.
+ cleanupFn();
+ } else {
+ if (frameDelta !== 0) { // Don't call repeatFn with duplicate frames.
+ repeatFn(frameNumber);
+ }
+ loop();
+ }
+ });
+ })();
+};
+
+// A whitelist of options that do not change pixel positions.
+var pixelSafeOptions = {
+ 'annotationClickHandler': true,
+ 'annotationDblClickHandler': true,
+ 'annotationMouseOutHandler': true,
+ 'annotationMouseOverHandler': true,
+ 'axisLabelColor': true,
+ 'axisLineColor': true,
+ 'axisLineWidth': true,
+ 'clickCallback': true,
+ 'drawCallback': true,
+ 'drawHighlightPointCallback': true,
+ 'drawPoints': true,
+ 'drawPointCallback': true,
+ 'drawXGrid': true,
+ 'drawYGrid': true,
+ 'fillAlpha': true,
+ 'gridLineColor': true,
+ 'gridLineWidth': true,
+ 'hideOverlayOnMouseOut': true,
+ 'highlightCallback': true,
+ 'highlightCircleSize': true,
+ 'interactionModel': true,
+ 'isZoomedIgnoreProgrammaticZoom': true,
+ 'labelsDiv': true,
+ 'labelsDivStyles': true,
+ 'labelsDivWidth': true,
+ 'labelsKMB': true,
+ 'labelsKMG2': true,
+ 'labelsSeparateLines': true,
+ 'labelsShowZeroValues': true,
+ 'legend': true,
+ 'panEdgeFraction': true,
+ 'pixelsPerYLabel': true,
+ 'pointClickCallback': true,
+ 'pointSize': true,
+ 'rangeSelectorPlotFillColor': true,
+ 'rangeSelectorPlotStrokeColor': true,
+ 'showLabelsOnHighlight': true,
+ 'showRoller': true,
+ 'strokeWidth': true,
+ 'underlayCallback': true,
+ 'unhighlightCallback': true,
+ 'zoomCallback': true
+};
+
+/**
+ * This function will scan the option list and determine if they
+ * require us to recalculate the pixel positions of each point.
+ * TODO: move this into dygraph-options.js
+ * @param {!Array.<string>} labels a list of options to check.
+ * @param {!Object} attrs
+ * @return {boolean} true if the graph needs new points else false.
+ * @private
+ */
+Dygraph.isPixelChangingOptionList = function(labels, attrs) {
+ // Assume that we do not require new points.
+ // This will change to true if we actually do need new points.
+
+ // Create a dictionary of series names for faster lookup.
+ // If there are no labels, then the dictionary stays empty.
+ var seriesNamesDictionary = { };
+ if (labels) {
+ for (var i = 1; i < labels.length; i++) {
+ seriesNamesDictionary[labels[i]] = true;
+ }
+ }
+
+ // Scan through a flat (i.e. non-nested) object of options.
+ // Returns true/false depending on whether new points are needed.
+ var scanFlatOptions = function(options) {
+ for (var property in options) {
+ if (options.hasOwnProperty(property) &&
+ !pixelSafeOptions[property]) {
+ return true;
+ }
+ }
+ return false;
+ };
+
+ // Iterate through the list of updated options.
+ for (var property in attrs) {
+ if (!attrs.hasOwnProperty(property)) continue;
+
+ // Find out of this field is actually a series specific options list.
+ if (property == 'highlightSeriesOpts' ||
+ (seriesNamesDictionary[property] && !attrs.series)) {
+ // This property value is a list of options for this series.
+ if (scanFlatOptions(attrs[property])) return true;
+ } else if (property == 'series' || property == 'axes') {
+ // This is twice-nested options list.
+ var perSeries = attrs[property];
+ for (var series in perSeries) {
+ if (perSeries.hasOwnProperty(series) &&
+ scanFlatOptions(perSeries[series])) {
+ return true;
+ }
+ }
+ } else {
+ // If this was not a series specific option list, check if it's a pixel
+ // changing property.
+ if (!pixelSafeOptions[property]) return true;
+ }
+ }
+
+ return false;
+};
+
+Dygraph.Circles = {
+ DEFAULT : function(g, name, ctx, canvasx, canvasy, color, radius) {
+ ctx.beginPath();
+ ctx.fillStyle = color;
+ ctx.arc(canvasx, canvasy, radius, 0, 2 * Math.PI, false);
+ ctx.fill();
+ }
+ // For more shapes, include extras/shapes.js
+};
+
+/**
+ * To create a "drag" interaction, you typically register a mousedown event
+ * handler on the element where the drag begins. In that handler, you register a
+ * mouseup handler on the window to determine when the mouse is released,
+ * wherever that release happens. This works well, except when the user releases
+ * the mouse over an off-domain iframe. In that case, the mouseup event is
+ * handled by the iframe and never bubbles up to the window handler.
+ *
+ * To deal with this issue, we cover iframes with high z-index divs to make sure
+ * they don't capture mouseup.
+ *
+ * Usage:
+ * element.addEventListener('mousedown', function() {
+ * var tarper = new Dygraph.IFrameTarp();
+ * tarper.cover();
+ * var mouseUpHandler = function() {
+ * ...
+ * window.removeEventListener(mouseUpHandler);
+ * tarper.uncover();
+ * };
+ * window.addEventListener('mouseup', mouseUpHandler);
+ * };
+ *
+ * @constructor
+ */
+Dygraph.IFrameTarp = function() {
+ /** @type {Array.<!HTMLDivElement>} */
+ this.tarps = [];
+};
+
+/**
+ * Find all the iframes in the document and cover them with high z-index
+ * transparent divs.
+ */
+Dygraph.IFrameTarp.prototype.cover = function() {
+ var iframes = document.getElementsByTagName("iframe");
+ for (var i = 0; i < iframes.length; i++) {
+ var iframe = iframes[i];
+ var pos = Dygraph.findPos(iframe),
+ x = pos.x,
+ y = pos.y,
+ width = iframe.offsetWidth,
+ height = iframe.offsetHeight;
+
+ var div = document.createElement("div");
+ div.style.position = "absolute";
+ div.style.left = x + 'px';
+ div.style.top = y + 'px';
+ div.style.width = width + 'px';
+ div.style.height = height + 'px';
+ div.style.zIndex = 999;
+ document.body.appendChild(div);
+ this.tarps.push(div);
+ }
+};
+
+/**
+ * Remove all the iframe covers. You should call this in a mouseup handler.
+ */
+Dygraph.IFrameTarp.prototype.uncover = function() {
+ for (var i = 0; i < this.tarps.length; i++) {
+ this.tarps[i].parentNode.removeChild(this.tarps[i]);
+ }
+ this.tarps = [];
+};
+
+/**
+ * Determine whether |data| is delimited by CR, CRLF, LF, LFCR.
+ * @param {string} data
+ * @return {?string} the delimiter that was detected (or null on failure).
+ */
+Dygraph.detectLineDelimiter = function(data) {
+ for (var i = 0; i < data.length; i++) {
+ var code = data.charAt(i);
+ if (code === '\r') {
+ // Might actually be "\r\n".
+ if (((i + 1) < data.length) && (data.charAt(i + 1) === '\n')) {
+ return '\r\n';
+ }
+ return code;
+ }
+ if (code === '\n') {
+ // Might actually be "\n\r".
+ if (((i + 1) < data.length) && (data.charAt(i + 1) === '\r')) {
+ return '\n\r';
+ }
+ return code;
+ }
+ }
+
+ return null;
+};
+
+/**
+ * Is one node contained by another?
+ * @param {Node} containee The contained node.
+ * @param {Node} container The container node.
+ * @return {boolean} Whether containee is inside (or equal to) container.
+ * @private
+ */
+Dygraph.isNodeContainedBy = function(containee, container) {
+ if (container === null || containee === null) {
+ return false;
+ }
+ var containeeNode = /** @type {Node} */ (containee);
+ while (containeeNode && containeeNode !== container) {
+ containeeNode = containeeNode.parentNode;
+ }
+ return (containeeNode === container);
+};
+
+
+// This masks some numeric issues in older versions of Firefox,
+// where 1.0/Math.pow(10,2) != Math.pow(10,-2).
+/** @type {function(number,number):number} */
+Dygraph.pow = function(base, exp) {
+ if (exp < 0) {
+ return 1.0 / Math.pow(base, -exp);
+ }
+ return Math.pow(base, exp);
+};
+
+/**
+ * Converts any valid CSS color (hex, rgb(), named color) to an RGB tuple.
+ *
+ * @param {!string} colorStr Any valid CSS color string.
+ * @return {{r:number,g:number,b:number}} Parsed RGB tuple.
+ * @private
+ */
+Dygraph.toRGB_ = function(colorStr) {
+ // TODO(danvk): cache color parses to avoid repeated DOM manipulation.
+ var div = document.createElement('div');
+ div.style.backgroundColor = colorStr;
+ div.style.visibility = 'hidden';
+ document.body.appendChild(div);
+ var rgbStr;
+ if (window.getComputedStyle) {
+ rgbStr = window.getComputedStyle(div, null).backgroundColor;
+ } else {
+ // IE8
+ rgbStr = div.currentStyle.backgroundColor;
+ }
+ document.body.removeChild(div);
+ var bits = /^rgb\((\d{1,3}),\s*(\d{1,3}),\s*(\d{1,3})\)$/.exec(rgbStr);
+ return {
+ r: parseInt(bits[1], 10),
+ g: parseInt(bits[2], 10),
+ b: parseInt(bits[3], 10)
+ };
+};
+
+/**
+ * Checks whether the browser supports the &lt;canvas&gt; tag.
+ * @param {HTMLCanvasElement=} opt_canvasElement Pass a canvas element as an
+ * optimization if you have one.
+ * @return {boolean} Whether the browser supports canvas.
+ */
+Dygraph.isCanvasSupported = function(opt_canvasElement) {
+ var canvas;
+ try {
+ canvas = opt_canvasElement || document.createElement("canvas");
+ canvas.getContext("2d");
+ }
+ catch (e) {
+ var ie = navigator.appVersion.match(/MSIE (\d\.\d)/);
+ var opera = (navigator.userAgent.toLowerCase().indexOf("opera") != -1);
+ if ((!ie) || (ie[1] < 6) || (opera))
+ return false;
+ return true;
+ }
+ return true;
+};
+
+/**
+ * Parses the value as a floating point number. This is like the parseFloat()
+ * built-in, but with a few differences:
+ * - the empty string is parsed as null, rather than NaN.
+ * - if the string cannot be parsed at all, an error is logged.
+ * If the string can't be parsed, this method returns null.
+ * @param {string} x The string to be parsed
+ * @param {number=} opt_line_no The line number from which the string comes.
+ * @param {string=} opt_line The text of the line from which the string comes.
+ */
+Dygraph.parseFloat_ = function(x, opt_line_no, opt_line) {
+ var val = parseFloat(x);
+ if (!isNaN(val)) return val;
+
+ // Try to figure out what happeend.
+ // If the value is the empty string, parse it as null.
+ if (/^ *$/.test(x)) return null;
+
+ // If it was actually "NaN", return it as NaN.
+ if (/^ *nan *$/i.test(x)) return NaN;
+
+ // Looks like a parsing error.
+ var msg = "Unable to parse '" + x + "' as a number";
+ if (opt_line !== undefined && opt_line_no !== undefined) {
+ msg += " on line " + (1+(opt_line_no||0)) + " ('" + opt_line + "') of CSV.";
+ }
+ console.error(msg);
+
+ return null;
+};
+
+})();
+/**
+ * @license
+ * Copyright 2011 Dan Vanderkam (danvdk@gmail.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+
+/**
+ * @fileoverview A wrapper around the Dygraph class which implements the
+ * interface for a GViz (aka Google Visualization API) visualization.
+ * It is designed to be a drop-in replacement for Google's AnnotatedTimeline,
+ * so the documentation at
+ * http://code.google.com/apis/chart/interactive/docs/gallery/annotatedtimeline.html
+ * translates over directly.
+ *
+ * For a full demo, see:
+ * - http://dygraphs.com/tests/gviz.html
+ * - http://dygraphs.com/tests/annotation-gviz.html
+ */
+
+(function() {
+/*global Dygraph:false */
+"use strict";
+
+/**
+ * A wrapper around Dygraph that implements the gviz API.
+ * @param {!HTMLDivElement} container The DOM object the visualization should
+ * live in.
+ * @constructor
+ */
+Dygraph.GVizChart = function(container) {
+ this.container = container;
+};
+
+/**
+ * @param {GVizDataTable} data
+ * @param {Object.<*>} options
+ */
+Dygraph.GVizChart.prototype.draw = function(data, options) {
+ // Clear out any existing dygraph.
+ // TODO(danvk): would it make more sense to simply redraw using the current
+ // date_graph object?
+ this.container.innerHTML = '';
+ if (typeof(this.date_graph) != 'undefined') {
+ this.date_graph.destroy();
+ }
+
+ this.date_graph = new Dygraph(this.container, data, options);
+};
+
+/**
+ * Google charts compatible setSelection
+ * Only row selection is supported, all points in the row will be highlighted
+ * @param {Array.<{row:number}>} selection_array array of the selected cells
+ * @public
+ */
+Dygraph.GVizChart.prototype.setSelection = function(selection_array) {
+ var row = false;
+ if (selection_array.length) {
+ row = selection_array[0].row;
+ }
+ this.date_graph.setSelection(row);
+};
+
+/**
+ * Google charts compatible getSelection implementation
+ * @return {Array.<{row:number,column:number}>} array of the selected cells
+ * @public
+ */
+Dygraph.GVizChart.prototype.getSelection = function() {
+ var selection = [];
+
+ var row = this.date_graph.getSelection();
+
+ if (row < 0) return selection;
+
+ var points = this.date_graph.layout_.points;
+ for (var setIdx = 0; setIdx < points.length; ++setIdx) {
+ selection.push({row: row, column: setIdx + 1});
+ }
+
+ return selection;
+};
+
+})();
+/**
+ * @license
+ * Copyright 2011 Robert Konigsberg (konigsberg@google.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+
+/**
+ * @fileoverview The default interaction model for Dygraphs. This is kept out
+ * of dygraph.js for better navigability.
+ * @author Robert Konigsberg (konigsberg@google.com)
+ */
+
+(function() {
+/*global Dygraph:false */
+"use strict";
+
+/**
+ * You can drag this many pixels past the edge of the chart and still have it
+ * be considered a zoom. This makes it easier to zoom to the exact edge of the
+ * chart, a fairly common operation.
+ */
+var DRAG_EDGE_MARGIN = 100;
+
+/**
+ * A collection of functions to facilitate build custom interaction models.
+ * @class
+ */
+Dygraph.Interaction = {};
+
+/**
+ * Checks whether the beginning & ending of an event were close enough that it
+ * should be considered a click. If it should, dispatch appropriate events.
+ * Returns true if the event was treated as a click.
+ *
+ * @param {Event} event
+ * @param {Dygraph} g
+ * @param {Object} context
+ */
+Dygraph.Interaction.maybeTreatMouseOpAsClick = function(event, g, context) {
+ context.dragEndX = Dygraph.dragGetX_(event, context);
+ context.dragEndY = Dygraph.dragGetY_(event, context);
+ var regionWidth = Math.abs(context.dragEndX - context.dragStartX);
+ var regionHeight = Math.abs(context.dragEndY - context.dragStartY);
+
+ if (regionWidth < 2 && regionHeight < 2 &&
+ g.lastx_ !== undefined && g.lastx_ != -1) {
+ Dygraph.Interaction.treatMouseOpAsClick(g, event, context);
+ }
+
+ context.regionWidth = regionWidth;
+ context.regionHeight = regionHeight;
+};
+
+/**
+ * Called in response to an interaction model operation that
+ * should start the default panning behavior.
+ *
+ * It's used in the default callback for "mousedown" operations.
+ * Custom interaction model builders can use it to provide the default
+ * panning behavior.
+ *
+ * @param {Event} event the event object which led to the startPan call.
+ * @param {Dygraph} g The dygraph on which to act.
+ * @param {Object} context The dragging context object (with
+ * dragStartX/dragStartY/etc. properties). This function modifies the
+ * context.
+ */
+Dygraph.Interaction.startPan = function(event, g, context) {
+ var i, axis;
+ context.isPanning = true;
+ var xRange = g.xAxisRange();
+
+ if (g.getOptionForAxis("logscale", "x")) {
+ context.initialLeftmostDate = Dygraph.log10(xRange[0]);
+ context.dateRange = Dygraph.log10(xRange[1]) - Dygraph.log10(xRange[0]);
+ } else {
+ context.initialLeftmostDate = xRange[0];
+ context.dateRange = xRange[1] - xRange[0];
+ }
+ context.xUnitsPerPixel = context.dateRange / (g.plotter_.area.w - 1);
+
+ if (g.getNumericOption("panEdgeFraction")) {
+ var maxXPixelsToDraw = g.width_ * g.getNumericOption("panEdgeFraction");
+ var xExtremes = g.xAxisExtremes(); // I REALLY WANT TO CALL THIS xTremes!
+
+ var boundedLeftX = g.toDomXCoord(xExtremes[0]) - maxXPixelsToDraw;
+ var boundedRightX = g.toDomXCoord(xExtremes[1]) + maxXPixelsToDraw;
+
+ var boundedLeftDate = g.toDataXCoord(boundedLeftX);
+ var boundedRightDate = g.toDataXCoord(boundedRightX);
+ context.boundedDates = [boundedLeftDate, boundedRightDate];
+
+ var boundedValues = [];
+ var maxYPixelsToDraw = g.height_ * g.getNumericOption("panEdgeFraction");
+
+ for (i = 0; i < g.axes_.length; i++) {
+ axis = g.axes_[i];
+ var yExtremes = axis.extremeRange;
+
+ var boundedTopY = g.toDomYCoord(yExtremes[0], i) + maxYPixelsToDraw;
+ var boundedBottomY = g.toDomYCoord(yExtremes[1], i) - maxYPixelsToDraw;
+
+ var boundedTopValue = g.toDataYCoord(boundedTopY, i);
+ var boundedBottomValue = g.toDataYCoord(boundedBottomY, i);
+
+ boundedValues[i] = [boundedTopValue, boundedBottomValue];
+ }
+ context.boundedValues = boundedValues;
+ }
+
+ // Record the range of each y-axis at the start of the drag.
+ // If any axis has a valueRange or valueWindow, then we want a 2D pan.
+ // We can't store data directly in g.axes_, because it does not belong to us
+ // and could change out from under us during a pan (say if there's a data
+ // update).
+ context.is2DPan = false;
+ context.axes = [];
+ for (i = 0; i < g.axes_.length; i++) {
+ axis = g.axes_[i];
+ var axis_data = {};
+ var yRange = g.yAxisRange(i);
+ // TODO(konigsberg): These values should be in |context|.
+ // In log scale, initialTopValue, dragValueRange and unitsPerPixel are log scale.
+ var logscale = g.attributes_.getForAxis("logscale", i);
+ if (logscale) {
+ axis_data.initialTopValue = Dygraph.log10(yRange[1]);
+ axis_data.dragValueRange = Dygraph.log10(yRange[1]) - Dygraph.log10(yRange[0]);
+ } else {
+ axis_data.initialTopValue = yRange[1];
+ axis_data.dragValueRange = yRange[1] - yRange[0];
+ }
+ axis_data.unitsPerPixel = axis_data.dragValueRange / (g.plotter_.area.h - 1);
+ context.axes.push(axis_data);
+
+ // While calculating axes, set 2dpan.
+ if (axis.valueWindow || axis.valueRange) context.is2DPan = true;
+ }
+};
+
+/**
+ * Called in response to an interaction model operation that
+ * responds to an event that pans the view.
+ *
+ * It's used in the default callback for "mousemove" operations.
+ * Custom interaction model builders can use it to provide the default
+ * panning behavior.
+ *
+ * @param {Event} event the event object which led to the movePan call.
+ * @param {Dygraph} g The dygraph on which to act.
+ * @param {Object} context The dragging context object (with
+ * dragStartX/dragStartY/etc. properties). This function modifies the
+ * context.
+ */
+Dygraph.Interaction.movePan = function(event, g, context) {
+ context.dragEndX = Dygraph.dragGetX_(event, context);
+ context.dragEndY = Dygraph.dragGetY_(event, context);
+
+ var minDate = context.initialLeftmostDate -
+ (context.dragEndX - context.dragStartX) * context.xUnitsPerPixel;
+ if (context.boundedDates) {
+ minDate = Math.max(minDate, context.boundedDates[0]);
+ }
+ var maxDate = minDate + context.dateRange;
+ if (context.boundedDates) {
+ if (maxDate > context.boundedDates[1]) {
+ // Adjust minDate, and recompute maxDate.
+ minDate = minDate - (maxDate - context.boundedDates[1]);
+ maxDate = minDate + context.dateRange;
+ }
+ }
+
+ if (g.getOptionForAxis("logscale", "x")) {
+ g.dateWindow_ = [ Math.pow(Dygraph.LOG_SCALE, minDate),
+ Math.pow(Dygraph.LOG_SCALE, maxDate) ];
+ } else {
+ g.dateWindow_ = [minDate, maxDate];
+ }
+
+ // y-axis scaling is automatic unless this is a full 2D pan.
+ if (context.is2DPan) {
+
+ var pixelsDragged = context.dragEndY - context.dragStartY;
+
+ // Adjust each axis appropriately.
+ for (var i = 0; i < g.axes_.length; i++) {
+ var axis = g.axes_[i];
+ var axis_data = context.axes[i];
+ var unitsDragged = pixelsDragged * axis_data.unitsPerPixel;
+
+ var boundedValue = context.boundedValues ? context.boundedValues[i] : null;
+
+ // In log scale, maxValue and minValue are the logs of those values.
+ var maxValue = axis_data.initialTopValue + unitsDragged;
+ if (boundedValue) {
+ maxValue = Math.min(maxValue, boundedValue[1]);
+ }
+ var minValue = maxValue - axis_data.dragValueRange;
+ if (boundedValue) {
+ if (minValue < boundedValue[0]) {
+ // Adjust maxValue, and recompute minValue.
+ maxValue = maxValue - (minValue - boundedValue[0]);
+ minValue = maxValue - axis_data.dragValueRange;
+ }
+ }
+ if (g.attributes_.getForAxis("logscale", i)) {
+ axis.valueWindow = [ Math.pow(Dygraph.LOG_SCALE, minValue),
+ Math.pow(Dygraph.LOG_SCALE, maxValue) ];
+ } else {
+ axis.valueWindow = [ minValue, maxValue ];
+ }
+ }
+ }
+
+ g.drawGraph_(false);
+};
+
+/**
+ * Called in response to an interaction model operation that
+ * responds to an event that ends panning.
+ *
+ * It's used in the default callback for "mouseup" operations.
+ * Custom interaction model builders can use it to provide the default
+ * panning behavior.
+ *
+ * @param {Event} event the event object which led to the endPan call.
+ * @param {Dygraph} g The dygraph on which to act.
+ * @param {Object} context The dragging context object (with
+ * dragStartX/dragStartY/etc. properties). This function modifies the
+ * context.
+ */
+Dygraph.Interaction.endPan = Dygraph.Interaction.maybeTreatMouseOpAsClick;
+
+/**
+ * Called in response to an interaction model operation that
+ * responds to an event that starts zooming.
+ *
+ * It's used in the default callback for "mousedown" operations.
+ * Custom interaction model builders can use it to provide the default
+ * zooming behavior.
+ *
+ * @param {Event} event the event object which led to the startZoom call.
+ * @param {Dygraph} g The dygraph on which to act.
+ * @param {Object} context The dragging context object (with
+ * dragStartX/dragStartY/etc. properties). This function modifies the
+ * context.
+ */
+Dygraph.Interaction.startZoom = function(event, g, context) {
+ context.isZooming = true;
+ context.zoomMoved = false;
+};
+
+/**
+ * Called in response to an interaction model operation that
+ * responds to an event that defines zoom boundaries.
+ *
+ * It's used in the default callback for "mousemove" operations.
+ * Custom interaction model builders can use it to provide the default
+ * zooming behavior.
+ *
+ * @param {Event} event the event object which led to the moveZoom call.
+ * @param {Dygraph} g The dygraph on which to act.
+ * @param {Object} context The dragging context object (with
+ * dragStartX/dragStartY/etc. properties). This function modifies the
+ * context.
+ */
+Dygraph.Interaction.moveZoom = function(event, g, context) {
+ context.zoomMoved = true;
+ context.dragEndX = Dygraph.dragGetX_(event, context);
+ context.dragEndY = Dygraph.dragGetY_(event, context);
+
+ var xDelta = Math.abs(context.dragStartX - context.dragEndX);
+ var yDelta = Math.abs(context.dragStartY - context.dragEndY);
+
+ // drag direction threshold for y axis is twice as large as x axis
+ context.dragDirection = (xDelta < yDelta / 2) ? Dygraph.VERTICAL : Dygraph.HORIZONTAL;
+
+ g.drawZoomRect_(
+ context.dragDirection,
+ context.dragStartX,
+ context.dragEndX,
+ context.dragStartY,
+ context.dragEndY,
+ context.prevDragDirection,
+ context.prevEndX,
+ context.prevEndY);
+
+ context.prevEndX = context.dragEndX;
+ context.prevEndY = context.dragEndY;
+ context.prevDragDirection = context.dragDirection;
+};
+
+/**
+ * TODO(danvk): move this logic into dygraph.js
+ * @param {Dygraph} g
+ * @param {Event} event
+ * @param {Object} context
+ */
+Dygraph.Interaction.treatMouseOpAsClick = function(g, event, context) {
+ var clickCallback = g.getFunctionOption('clickCallback');
+ var pointClickCallback = g.getFunctionOption('pointClickCallback');
+
+ var selectedPoint = null;
+
+ // Find out if the click occurs on a point.
+ var closestIdx = -1;
+ var closestDistance = Number.MAX_VALUE;
+
+ // check if the click was on a particular point.
+ for (var i = 0; i < g.selPoints_.length; i++) {
+ var p = g.selPoints_[i];
+ var distance = Math.pow(p.canvasx - context.dragEndX, 2) +
+ Math.pow(p.canvasy - context.dragEndY, 2);
+ if (!isNaN(distance) &&
+ (closestIdx == -1 || distance < closestDistance)) {
+ closestDistance = distance;
+ closestIdx = i;
+ }
+ }
+
+ // Allow any click within two pixels of the dot.
+ var radius = g.getNumericOption('highlightCircleSize') + 2;
+ if (closestDistance <= radius * radius) {
+ selectedPoint = g.selPoints_[closestIdx];
+ }
+
+ if (selectedPoint) {
+ var e = {
+ cancelable: true,
+ point: selectedPoint,
+ canvasx: context.dragEndX,
+ canvasy: context.dragEndY
+ };
+ var defaultPrevented = g.cascadeEvents_('pointClick', e);
+ if (defaultPrevented) {
+ // Note: this also prevents click / clickCallback from firing.
+ return;
+ }
+ if (pointClickCallback) {
+ pointClickCallback.call(g, event, selectedPoint);
+ }
+ }
+
+ var e = {
+ cancelable: true,
+ xval: g.lastx_, // closest point by x value
+ pts: g.selPoints_,
+ canvasx: context.dragEndX,
+ canvasy: context.dragEndY
+ };
+ if (!g.cascadeEvents_('click', e)) {
+ if (clickCallback) {
+ // TODO(danvk): pass along more info about the points, e.g. 'x'
+ clickCallback.call(g, event, g.lastx_, g.selPoints_);
+ }
+ }
+};
+
+/**
+ * Called in response to an interaction model operation that
+ * responds to an event that performs a zoom based on previously defined
+ * bounds..
+ *
+ * It's used in the default callback for "mouseup" operations.
+ * Custom interaction model builders can use it to provide the default
+ * zooming behavior.
+ *
+ * @param {Event} event the event object which led to the endZoom call.
+ * @param {Dygraph} g The dygraph on which to end the zoom.
+ * @param {Object} context The dragging context object (with
+ * dragStartX/dragStartY/etc. properties). This function modifies the
+ * context.
+ */
+Dygraph.Interaction.endZoom = function(event, g, context) {
+ g.clearZoomRect_();
+ context.isZooming = false;
+ Dygraph.Interaction.maybeTreatMouseOpAsClick(event, g, context);
+
+ // The zoom rectangle is visibly clipped to the plot area, so its behavior
+ // should be as well.
+ // See http://code.google.com/p/dygraphs/issues/detail?id=280
+ var plotArea = g.getArea();
+ if (context.regionWidth >= 10 &&
+ context.dragDirection == Dygraph.HORIZONTAL) {
+ var left = Math.min(context.dragStartX, context.dragEndX),
+ right = Math.max(context.dragStartX, context.dragEndX);
+ left = Math.max(left, plotArea.x);
+ right = Math.min(right, plotArea.x + plotArea.w);
+ if (left < right) {
+ g.doZoomX_(left, right);
+ }
+ context.cancelNextDblclick = true;
+ } else if (context.regionHeight >= 10 &&
+ context.dragDirection == Dygraph.VERTICAL) {
+ var top = Math.min(context.dragStartY, context.dragEndY),
+ bottom = Math.max(context.dragStartY, context.dragEndY);
+ top = Math.max(top, plotArea.y);
+ bottom = Math.min(bottom, plotArea.y + plotArea.h);
+ if (top < bottom) {
+ g.doZoomY_(top, bottom);
+ }
+ context.cancelNextDblclick = true;
+ }
+ context.dragStartX = null;
+ context.dragStartY = null;
+};
+
+/**
+ * @private
+ */
+Dygraph.Interaction.startTouch = function(event, g, context) {
+ event.preventDefault(); // touch browsers are all nice.
+ if (event.touches.length > 1) {
+ // If the user ever puts two fingers down, it's not a double tap.
+ context.startTimeForDoubleTapMs = null;
+ }
+
+ var touches = [];
+ for (var i = 0; i < event.touches.length; i++) {
+ var t = event.touches[i];
+ // we dispense with 'dragGetX_' because all touchBrowsers support pageX
+ touches.push({
+ pageX: t.pageX,
+ pageY: t.pageY,
+ dataX: g.toDataXCoord(t.pageX),
+ dataY: g.toDataYCoord(t.pageY)
+ // identifier: t.identifier
+ });
+ }
+ context.initialTouches = touches;
+
+ if (touches.length == 1) {
+ // This is just a swipe.
+ context.initialPinchCenter = touches[0];
+ context.touchDirections = { x: true, y: true };
+ } else if (touches.length >= 2) {
+ // It's become a pinch!
+ // In case there are 3+ touches, we ignore all but the "first" two.
+
+ // only screen coordinates can be averaged (data coords could be log scale).
+ context.initialPinchCenter = {
+ pageX: 0.5 * (touches[0].pageX + touches[1].pageX),
+ pageY: 0.5 * (touches[0].pageY + touches[1].pageY),
+
+ // TODO(danvk): remove
+ dataX: 0.5 * (touches[0].dataX + touches[1].dataX),
+ dataY: 0.5 * (touches[0].dataY + touches[1].dataY)
+ };
+
+ // Make pinches in a 45-degree swath around either axis 1-dimensional zooms.
+ var initialAngle = 180 / Math.PI * Math.atan2(
+ context.initialPinchCenter.pageY - touches[0].pageY,
+ touches[0].pageX - context.initialPinchCenter.pageX);
+
+ // use symmetry to get it into the first quadrant.
+ initialAngle = Math.abs(initialAngle);
+ if (initialAngle > 90) initialAngle = 90 - initialAngle;
+
+ context.touchDirections = {
+ x: (initialAngle < (90 - 45/2)),
+ y: (initialAngle > 45/2)
+ };
+ }
+
+ // save the full x & y ranges.
+ context.initialRange = {
+ x: g.xAxisRange(),
+ y: g.yAxisRange()
+ };
+};
+
+/**
+ * @private
+ */
+Dygraph.Interaction.moveTouch = function(event, g, context) {
+ // If the tap moves, then it's definitely not part of a double-tap.
+ context.startTimeForDoubleTapMs = null;
+
+ var i, touches = [];
+ for (i = 0; i < event.touches.length; i++) {
+ var t = event.touches[i];
+ touches.push({
+ pageX: t.pageX,
+ pageY: t.pageY
+ });
+ }
+ var initialTouches = context.initialTouches;
+
+ var c_now;
+
+ // old and new centers.
+ var c_init = context.initialPinchCenter;
+ if (touches.length == 1) {
+ c_now = touches[0];
+ } else {
+ c_now = {
+ pageX: 0.5 * (touches[0].pageX + touches[1].pageX),
+ pageY: 0.5 * (touches[0].pageY + touches[1].pageY)
+ };
+ }
+
+ // this is the "swipe" component
+ // we toss it out for now, but could use it in the future.
+ var swipe = {
+ pageX: c_now.pageX - c_init.pageX,
+ pageY: c_now.pageY - c_init.pageY
+ };
+ var dataWidth = context.initialRange.x[1] - context.initialRange.x[0];
+ var dataHeight = context.initialRange.y[0] - context.initialRange.y[1];
+ swipe.dataX = (swipe.pageX / g.plotter_.area.w) * dataWidth;
+ swipe.dataY = (swipe.pageY / g.plotter_.area.h) * dataHeight;
+ var xScale, yScale;
+
+ // The residual bits are usually split into scale & rotate bits, but we split
+ // them into x-scale and y-scale bits.
+ if (touches.length == 1) {
+ xScale = 1.0;
+ yScale = 1.0;
+ } else if (touches.length >= 2) {
+ var initHalfWidth = (initialTouches[1].pageX - c_init.pageX);
+ xScale = (touches[1].pageX - c_now.pageX) / initHalfWidth;
+
+ var initHalfHeight = (initialTouches[1].pageY - c_init.pageY);
+ yScale = (touches[1].pageY - c_now.pageY) / initHalfHeight;
+ }
+
+ // Clip scaling to [1/8, 8] to prevent too much blowup.
+ xScale = Math.min(8, Math.max(0.125, xScale));
+ yScale = Math.min(8, Math.max(0.125, yScale));
+
+ var didZoom = false;
+ if (context.touchDirections.x) {
+ g.dateWindow_ = [
+ c_init.dataX - swipe.dataX + (context.initialRange.x[0] - c_init.dataX) / xScale,
+ c_init.dataX - swipe.dataX + (context.initialRange.x[1] - c_init.dataX) / xScale
+ ];
+ didZoom = true;
+ }
+
+ if (context.touchDirections.y) {
+ for (i = 0; i < 1 /*g.axes_.length*/; i++) {
+ var axis = g.axes_[i];
+ var logscale = g.attributes_.getForAxis("logscale", i);
+ if (logscale) {
+ // TODO(danvk): implement
+ } else {
+ axis.valueWindow = [
+ c_init.dataY - swipe.dataY + (context.initialRange.y[0] - c_init.dataY) / yScale,
+ c_init.dataY - swipe.dataY + (context.initialRange.y[1] - c_init.dataY) / yScale
+ ];
+ didZoom = true;
+ }
+ }
+ }
+
+ g.drawGraph_(false);
+
+ // We only call zoomCallback on zooms, not pans, to mirror desktop behavior.
+ if (didZoom && touches.length > 1 && g.getFunctionOption('zoomCallback')) {
+ var viewWindow = g.xAxisRange();
+ g.getFunctionOption("zoomCallback").call(g, viewWindow[0], viewWindow[1], g.yAxisRanges());
+ }
+};
+
+/**
+ * @private
+ */
+Dygraph.Interaction.endTouch = function(event, g, context) {
+ if (event.touches.length !== 0) {
+ // this is effectively a "reset"
+ Dygraph.Interaction.startTouch(event, g, context);
+ } else if (event.changedTouches.length == 1) {
+ // Could be part of a "double tap"
+ // The heuristic here is that it's a double-tap if the two touchend events
+ // occur within 500ms and within a 50x50 pixel box.
+ var now = new Date().getTime();
+ var t = event.changedTouches[0];
+ if (context.startTimeForDoubleTapMs &&
+ now - context.startTimeForDoubleTapMs < 500 &&
+ context.doubleTapX && Math.abs(context.doubleTapX - t.screenX) < 50 &&
+ context.doubleTapY && Math.abs(context.doubleTapY - t.screenY) < 50) {
+ g.resetZoom();
+ } else {
+ context.startTimeForDoubleTapMs = now;
+ context.doubleTapX = t.screenX;
+ context.doubleTapY = t.screenY;
+ }
+ }
+};
+
+// Determine the distance from x to [left, right].
+var distanceFromInterval = function(x, left, right) {
+ if (x < left) {
+ return left - x;
+ } else if (x > right) {
+ return x - right;
+ } else {
+ return 0;
+ }
+};
+
+/**
+ * Returns the number of pixels by which the event happens from the nearest
+ * edge of the chart. For events in the interior of the chart, this returns zero.
+ */
+var distanceFromChart = function(event, g) {
+ var chartPos = Dygraph.findPos(g.canvas_);
+ var box = {
+ left: chartPos.x,
+ right: chartPos.x + g.canvas_.offsetWidth,
+ top: chartPos.y,
+ bottom: chartPos.y + g.canvas_.offsetHeight
+ };
+
+ var pt = {
+ x: Dygraph.pageX(event),
+ y: Dygraph.pageY(event)
+ };
+
+ var dx = distanceFromInterval(pt.x, box.left, box.right),
+ dy = distanceFromInterval(pt.y, box.top, box.bottom);
+ return Math.max(dx, dy);
+};
+
+/**
+ * Default interation model for dygraphs. You can refer to specific elements of
+ * this when constructing your own interaction model, e.g.:
+ * g.updateOptions( {
+ * interactionModel: {
+ * mousedown: Dygraph.defaultInteractionModel.mousedown
+ * }
+ * } );
+ */
+Dygraph.Interaction.defaultModel = {
+ // Track the beginning of drag events
+ mousedown: function(event, g, context) {
+ // Right-click should not initiate a zoom.
+ if (event.button && event.button == 2) return;
+
+ context.initializeMouseDown(event, g, context);
+
+ if (event.altKey || event.shiftKey) {
+ Dygraph.startPan(event, g, context);
+ } else {
+ Dygraph.startZoom(event, g, context);
+ }
+
+ // Note: we register mousemove/mouseup on document to allow some leeway for
+ // events to move outside of the chart. Interaction model events get
+ // registered on the canvas, which is too small to allow this.
+ var mousemove = function(event) {
+ if (context.isZooming) {
+ // When the mouse moves >200px from the chart edge, cancel the zoom.
+ var d = distanceFromChart(event, g);
+ if (d < DRAG_EDGE_MARGIN) {
+ Dygraph.moveZoom(event, g, context);
+ } else {
+ if (context.dragEndX !== null) {
+ context.dragEndX = null;
+ context.dragEndY = null;
+ g.clearZoomRect_();
+ }
+ }
+ } else if (context.isPanning) {
+ Dygraph.movePan(event, g, context);
+ }
+ };
+ var mouseup = function(event) {
+ if (context.isZooming) {
+ if (context.dragEndX !== null) {
+ Dygraph.endZoom(event, g, context);
+ } else {
+ Dygraph.Interaction.maybeTreatMouseOpAsClick(event, g, context);
+ }
+ } else if (context.isPanning) {
+ Dygraph.endPan(event, g, context);
+ }
+
+ Dygraph.removeEvent(document, 'mousemove', mousemove);
+ Dygraph.removeEvent(document, 'mouseup', mouseup);
+ context.destroy();
+ };
+
+ g.addAndTrackEvent(document, 'mousemove', mousemove);
+ g.addAndTrackEvent(document, 'mouseup', mouseup);
+ },
+ willDestroyContextMyself: true,
+
+ touchstart: function(event, g, context) {
+ Dygraph.Interaction.startTouch(event, g, context);
+ },
+ touchmove: function(event, g, context) {
+ Dygraph.Interaction.moveTouch(event, g, context);
+ },
+ touchend: function(event, g, context) {
+ Dygraph.Interaction.endTouch(event, g, context);
+ },
+
+ // Disable zooming out if panning.
+ dblclick: function(event, g, context) {
+ if (context.cancelNextDblclick) {
+ context.cancelNextDblclick = false;
+ return;
+ }
+
+ // Give plugins a chance to grab this event.
+ var e = {
+ canvasx: context.dragEndX,
+ canvasy: context.dragEndY
+ };
+ if (g.cascadeEvents_('dblclick', e)) {
+ return;
+ }
+
+ if (event.altKey || event.shiftKey) {
+ return;
+ }
+ g.resetZoom();
+ }
+};
+
+Dygraph.DEFAULT_ATTRS.interactionModel = Dygraph.Interaction.defaultModel;
+
+// old ways of accessing these methods/properties
+Dygraph.defaultInteractionModel = Dygraph.Interaction.defaultModel;
+Dygraph.endZoom = Dygraph.Interaction.endZoom;
+Dygraph.moveZoom = Dygraph.Interaction.moveZoom;
+Dygraph.startZoom = Dygraph.Interaction.startZoom;
+Dygraph.endPan = Dygraph.Interaction.endPan;
+Dygraph.movePan = Dygraph.Interaction.movePan;
+Dygraph.startPan = Dygraph.Interaction.startPan;
+
+Dygraph.Interaction.nonInteractiveModel_ = {
+ mousedown: function(event, g, context) {
+ context.initializeMouseDown(event, g, context);
+ },
+ mouseup: Dygraph.Interaction.maybeTreatMouseOpAsClick
+};
+
+// Default interaction model when using the range selector.
+Dygraph.Interaction.dragIsPanInteractionModel = {
+ mousedown: function(event, g, context) {
+ context.initializeMouseDown(event, g, context);
+ Dygraph.startPan(event, g, context);
+ },
+ mousemove: function(event, g, context) {
+ if (context.isPanning) {
+ Dygraph.movePan(event, g, context);
+ }
+ },
+ mouseup: function(event, g, context) {
+ if (context.isPanning) {
+ Dygraph.endPan(event, g, context);
+ }
+ }
+};
+
+})();
+/**
+ * @license
+ * Copyright 2011 Dan Vanderkam (danvdk@gmail.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+
+/**
+ * @fileoverview Description of this file.
+ * @author danvk@google.com (Dan Vanderkam)
+ *
+ * A ticker is a function with the following interface:
+ *
+ * function(a, b, pixels, options_view, dygraph, forced_values);
+ * -> [ { v: tick1_v, label: tick1_label[, label_v: label_v1] },
+ * { v: tick2_v, label: tick2_label[, label_v: label_v2] },
+ * ...
+ * ]
+ *
+ * The returned value is called a "tick list".
+ *
+ * Arguments
+ * ---------
+ *
+ * [a, b] is the range of the axis for which ticks are being generated. For a
+ * numeric axis, these will simply be numbers. For a date axis, these will be
+ * millis since epoch (convertable to Date objects using "new Date(a)" and "new
+ * Date(b)").
+ *
+ * opts provides access to chart- and axis-specific options. It can be used to
+ * access number/date formatting code/options, check for a log scale, etc.
+ *
+ * pixels is the length of the axis in pixels. opts('pixelsPerLabel') is the
+ * minimum amount of space to be allotted to each label. For instance, if
+ * pixels=400 and opts('pixelsPerLabel')=40 then the ticker should return
+ * between zero and ten (400/40) ticks.
+ *
+ * dygraph is the Dygraph object for which an axis is being constructed.
+ *
+ * forced_values is used for secondary y-axes. The tick positions are typically
+ * set by the primary y-axis, so the secondary y-axis has no choice in where to
+ * put these. It simply has to generate labels for these data values.
+ *
+ * Tick lists
+ * ----------
+ * Typically a tick will have both a grid/tick line and a label at one end of
+ * that line (at the bottom for an x-axis, at left or right for the y-axis).
+ *
+ * A tick may be missing one of these two components:
+ * - If "label_v" is specified instead of "v", then there will be no tick or
+ * gridline, just a label.
+ * - Similarly, if "label" is not specified, then there will be a gridline
+ * without a label.
+ *
+ * This flexibility is useful in a few situations:
+ * - For log scales, some of the tick lines may be too close to all have labels.
+ * - For date scales where years are being displayed, it is desirable to display
+ * tick marks at the beginnings of years but labels (e.g. "2006") in the
+ * middle of the years.
+ */
+
+/*jshint sub:true */
+/*global Dygraph:false */
+(function() {
+"use strict";
+
+/** @typedef {Array.<{v:number, label:string, label_v:(string|undefined)}>} */
+Dygraph.TickList = undefined; // the ' = undefined' keeps jshint happy.
+
+/** @typedef {function(
+ * number,
+ * number,
+ * number,
+ * function(string):*,
+ * Dygraph=,
+ * Array.<number>=
+ * ): Dygraph.TickList}
+ */
+Dygraph.Ticker = undefined; // the ' = undefined' keeps jshint happy.
+
+/** @type {Dygraph.Ticker} */
+Dygraph.numericLinearTicks = function(a, b, pixels, opts, dygraph, vals) {
+ var nonLogscaleOpts = function(opt) {
+ if (opt === 'logscale') return false;
+ return opts(opt);
+ };
+ return Dygraph.numericTicks(a, b, pixels, nonLogscaleOpts, dygraph, vals);
+};
+
+/** @type {Dygraph.Ticker} */
+Dygraph.numericTicks = function(a, b, pixels, opts, dygraph, vals) {
+ var pixels_per_tick = /** @type{number} */(opts('pixelsPerLabel'));
+ var ticks = [];
+ var i, j, tickV, nTicks;
+ if (vals) {
+ for (i = 0; i < vals.length; i++) {
+ ticks.push({v: vals[i]});
+ }
+ } else {
+ // TODO(danvk): factor this log-scale block out into a separate function.
+ if (opts("logscale")) {
+ nTicks = Math.floor(pixels / pixels_per_tick);
+ var minIdx = Dygraph.binarySearch(a, Dygraph.PREFERRED_LOG_TICK_VALUES, 1);
+ var maxIdx = Dygraph.binarySearch(b, Dygraph.PREFERRED_LOG_TICK_VALUES, -1);
+ if (minIdx == -1) {
+ minIdx = 0;
+ }
+ if (maxIdx == -1) {
+ maxIdx = Dygraph.PREFERRED_LOG_TICK_VALUES.length - 1;
+ }
+ // Count the number of tick values would appear, if we can get at least
+ // nTicks / 4 accept them.
+ var lastDisplayed = null;
+ if (maxIdx - minIdx >= nTicks / 4) {
+ for (var idx = maxIdx; idx >= minIdx; idx--) {
+ var tickValue = Dygraph.PREFERRED_LOG_TICK_VALUES[idx];
+ var pixel_coord = Math.log(tickValue / a) / Math.log(b / a) * pixels;
+ var tick = { v: tickValue };
+ if (lastDisplayed === null) {
+ lastDisplayed = {
+ tickValue : tickValue,
+ pixel_coord : pixel_coord
+ };
+ } else {
+ if (Math.abs(pixel_coord - lastDisplayed.pixel_coord) >= pixels_per_tick) {
+ lastDisplayed = {
+ tickValue : tickValue,
+ pixel_coord : pixel_coord
+ };
+ } else {
+ tick.label = "";
+ }
+ }
+ ticks.push(tick);
+ }
+ // Since we went in backwards order.
+ ticks.reverse();
+ }
+ }
+
+ // ticks.length won't be 0 if the log scale function finds values to insert.
+ if (ticks.length === 0) {
+ // Basic idea:
+ // Try labels every 1, 2, 5, 10, 20, 50, 100, etc.
+ // Calculate the resulting tick spacing (i.e. this.height_ / nTicks).
+ // The first spacing greater than pixelsPerYLabel is what we use.
+ // TODO(danvk): version that works on a log scale.
+ var kmg2 = opts("labelsKMG2");
+ var mults, base;
+ if (kmg2) {
+ mults = [1, 2, 4, 8, 16, 32, 64, 128, 256];
+ base = 16;
+ } else {
+ mults = [1, 2, 5, 10, 20, 50, 100];
+ base = 10;
+ }
+
+ // Get the maximum number of permitted ticks based on the
+ // graph's pixel size and pixels_per_tick setting.
+ var max_ticks = Math.ceil(pixels / pixels_per_tick);
+
+ // Now calculate the data unit equivalent of this tick spacing.
+ // Use abs() since graphs may have a reversed Y axis.
+ var units_per_tick = Math.abs(b - a) / max_ticks;
+
+ // Based on this, get a starting scale which is the largest
+ // integer power of the chosen base (10 or 16) that still remains
+ // below the requested pixels_per_tick spacing.
+ var base_power = Math.floor(Math.log(units_per_tick) / Math.log(base));
+ var base_scale = Math.pow(base, base_power);
+
+ // Now try multiples of the starting scale until we find one
+ // that results in tick marks spaced sufficiently far apart.
+ // The "mults" array should cover the range 1 .. base^2 to
+ // adjust for rounding and edge effects.
+ var scale, low_val, high_val, spacing;
+ for (j = 0; j < mults.length; j++) {
+ scale = base_scale * mults[j];
+ low_val = Math.floor(a / scale) * scale;
+ high_val = Math.ceil(b / scale) * scale;
+ nTicks = Math.abs(high_val - low_val) / scale;
+ spacing = pixels / nTicks;
+ if (spacing > pixels_per_tick) break;
+ }
+
+ // Construct the set of ticks.
+ // Allow reverse y-axis if it's explicitly requested.
+ if (low_val > high_val) scale *= -1;
+ for (i = 0; i <= nTicks; i++) {
+ tickV = low_val + i * scale;
+ ticks.push( {v: tickV} );
+ }
+ }
+ }
+
+ var formatter = /**@type{AxisLabelFormatter}*/(opts('axisLabelFormatter'));
+
+ // Add labels to the ticks.
+ for (i = 0; i < ticks.length; i++) {
+ if (ticks[i].label !== undefined) continue; // Use current label.
+ // TODO(danvk): set granularity to something appropriate here.
+ ticks[i].label = formatter(ticks[i].v, 0, opts, dygraph);
+ }
+
+ return ticks;
+};
+
+
+/** @type {Dygraph.Ticker} */
+Dygraph.dateTicker = function(a, b, pixels, opts, dygraph, vals) {
+ var chosen = Dygraph.pickDateTickGranularity(a, b, pixels, opts);
+
+ if (chosen >= 0) {
+ return Dygraph.getDateAxis(a, b, chosen, opts, dygraph);
+ } else {
+ // this can happen if self.width_ is zero.
+ return [];
+ }
+};
+
+// Time granularity enumeration
+// TODO(danvk): make this an @enum
+Dygraph.SECONDLY = 0;
+Dygraph.TWO_SECONDLY = 1;
+Dygraph.FIVE_SECONDLY = 2;
+Dygraph.TEN_SECONDLY = 3;
+Dygraph.THIRTY_SECONDLY = 4;
+Dygraph.MINUTELY = 5;
+Dygraph.TWO_MINUTELY = 6;
+Dygraph.FIVE_MINUTELY = 7;
+Dygraph.TEN_MINUTELY = 8;
+Dygraph.THIRTY_MINUTELY = 9;
+Dygraph.HOURLY = 10;
+Dygraph.TWO_HOURLY = 11;
+Dygraph.SIX_HOURLY = 12;
+Dygraph.DAILY = 13;
+Dygraph.TWO_DAILY = 14;
+Dygraph.WEEKLY = 15;
+Dygraph.MONTHLY = 16;
+Dygraph.QUARTERLY = 17;
+Dygraph.BIANNUAL = 18;
+Dygraph.ANNUAL = 19;
+Dygraph.DECADAL = 20;
+Dygraph.CENTENNIAL = 21;
+Dygraph.NUM_GRANULARITIES = 22;
+
+// Date components enumeration (in the order of the arguments in Date)
+// TODO: make this an @enum
+Dygraph.DATEFIELD_Y = 0;
+Dygraph.DATEFIELD_M = 1;
+Dygraph.DATEFIELD_D = 2;
+Dygraph.DATEFIELD_HH = 3;
+Dygraph.DATEFIELD_MM = 4;
+Dygraph.DATEFIELD_SS = 5;
+Dygraph.DATEFIELD_MS = 6;
+Dygraph.NUM_DATEFIELDS = 7;
+
+
+/**
+ * The value of datefield will start at an even multiple of "step", i.e.
+ * if datefield=SS and step=5 then the first tick will be on a multiple of 5s.
+ *
+ * For granularities <= HOURLY, ticks are generated every `spacing` ms.
+ *
+ * At coarser granularities, ticks are generated by incrementing `datefield` by
+ * `step`. In this case, the `spacing` value is only used to estimate the
+ * number of ticks. It should roughly correspond to the spacing between
+ * adjacent ticks.
+ *
+ * @type {Array.<{datefield:number, step:number, spacing:number}>}
+ */
+Dygraph.TICK_PLACEMENT = [];
+Dygraph.TICK_PLACEMENT[Dygraph.SECONDLY] = {datefield: Dygraph.DATEFIELD_SS, step: 1, spacing: 1000 * 1};
+Dygraph.TICK_PLACEMENT[Dygraph.TWO_SECONDLY] = {datefield: Dygraph.DATEFIELD_SS, step: 2, spacing: 1000 * 2};
+Dygraph.TICK_PLACEMENT[Dygraph.FIVE_SECONDLY] = {datefield: Dygraph.DATEFIELD_SS, step: 5, spacing: 1000 * 5};
+Dygraph.TICK_PLACEMENT[Dygraph.TEN_SECONDLY] = {datefield: Dygraph.DATEFIELD_SS, step: 10, spacing: 1000 * 10};
+Dygraph.TICK_PLACEMENT[Dygraph.THIRTY_SECONDLY] = {datefield: Dygraph.DATEFIELD_SS, step: 30, spacing: 1000 * 30};
+Dygraph.TICK_PLACEMENT[Dygraph.MINUTELY] = {datefield: Dygraph.DATEFIELD_MM, step: 1, spacing: 1000 * 60};
+Dygraph.TICK_PLACEMENT[Dygraph.TWO_MINUTELY] = {datefield: Dygraph.DATEFIELD_MM, step: 2, spacing: 1000 * 60 * 2};
+Dygraph.TICK_PLACEMENT[Dygraph.FIVE_MINUTELY] = {datefield: Dygraph.DATEFIELD_MM, step: 5, spacing: 1000 * 60 * 5};
+Dygraph.TICK_PLACEMENT[Dygraph.TEN_MINUTELY] = {datefield: Dygraph.DATEFIELD_MM, step: 10, spacing: 1000 * 60 * 10};
+Dygraph.TICK_PLACEMENT[Dygraph.THIRTY_MINUTELY] = {datefield: Dygraph.DATEFIELD_MM, step: 30, spacing: 1000 * 60 * 30};
+Dygraph.TICK_PLACEMENT[Dygraph.HOURLY] = {datefield: Dygraph.DATEFIELD_HH, step: 1, spacing: 1000 * 3600};
+Dygraph.TICK_PLACEMENT[Dygraph.TWO_HOURLY] = {datefield: Dygraph.DATEFIELD_HH, step: 2, spacing: 1000 * 3600 * 2};
+Dygraph.TICK_PLACEMENT[Dygraph.SIX_HOURLY] = {datefield: Dygraph.DATEFIELD_HH, step: 6, spacing: 1000 * 3600 * 6};
+Dygraph.TICK_PLACEMENT[Dygraph.DAILY] = {datefield: Dygraph.DATEFIELD_D, step: 1, spacing: 1000 * 86400};
+Dygraph.TICK_PLACEMENT[Dygraph.TWO_DAILY] = {datefield: Dygraph.DATEFIELD_D, step: 2, spacing: 1000 * 86400 * 2};
+Dygraph.TICK_PLACEMENT[Dygraph.WEEKLY] = {datefield: Dygraph.DATEFIELD_D, step: 7, spacing: 1000 * 604800};
+Dygraph.TICK_PLACEMENT[Dygraph.MONTHLY] = {datefield: Dygraph.DATEFIELD_M, step: 1, spacing: 1000 * 7200 * 365.2524}; // 1e3 * 60 * 60 * 24 * 365.2524 / 12
+Dygraph.TICK_PLACEMENT[Dygraph.QUARTERLY] = {datefield: Dygraph.DATEFIELD_M, step: 3, spacing: 1000 * 21600 * 365.2524}; // 1e3 * 60 * 60 * 24 * 365.2524 / 4
+Dygraph.TICK_PLACEMENT[Dygraph.BIANNUAL] = {datefield: Dygraph.DATEFIELD_M, step: 6, spacing: 1000 * 43200 * 365.2524}; // 1e3 * 60 * 60 * 24 * 365.2524 / 2
+Dygraph.TICK_PLACEMENT[Dygraph.ANNUAL] = {datefield: Dygraph.DATEFIELD_Y, step: 1, spacing: 1000 * 86400 * 365.2524}; // 1e3 * 60 * 60 * 24 * 365.2524 * 1
+Dygraph.TICK_PLACEMENT[Dygraph.DECADAL] = {datefield: Dygraph.DATEFIELD_Y, step: 10, spacing: 1000 * 864000 * 365.2524}; // 1e3 * 60 * 60 * 24 * 365.2524 * 10
+Dygraph.TICK_PLACEMENT[Dygraph.CENTENNIAL] = {datefield: Dygraph.DATEFIELD_Y, step: 100, spacing: 1000 * 8640000 * 365.2524}; // 1e3 * 60 * 60 * 24 * 365.2524 * 100
+
+
+/**
+ * This is a list of human-friendly values at which to show tick marks on a log
+ * scale. It is k * 10^n, where k=1..9 and n=-39..+39, so:
+ * ..., 1, 2, 3, 4, 5, ..., 9, 10, 20, 30, ..., 90, 100, 200, 300, ...
+ * NOTE: this assumes that Dygraph.LOG_SCALE = 10.
+ * @type {Array.<number>}
+ */
+Dygraph.PREFERRED_LOG_TICK_VALUES = (function() {
+ var vals = [];
+ for (var power = -39; power <= 39; power++) {
+ var range = Math.pow(10, power);
+ for (var mult = 1; mult <= 9; mult++) {
+ var val = range * mult;
+ vals.push(val);
+ }
+ }
+ return vals;
+})();
+
+/**
+ * Determine the correct granularity of ticks on a date axis.
+ *
+ * @param {number} a Left edge of the chart (ms)
+ * @param {number} b Right edge of the chart (ms)
+ * @param {number} pixels Size of the chart in the relevant dimension (width).
+ * @param {function(string):*} opts Function mapping from option name -&gt; value.
+ * @return {number} The appropriate axis granularity for this chart. See the
+ * enumeration of possible values in dygraph-tickers.js.
+ */
+Dygraph.pickDateTickGranularity = function(a, b, pixels, opts) {
+ var pixels_per_tick = /** @type{number} */(opts('pixelsPerLabel'));
+ for (var i = 0; i < Dygraph.NUM_GRANULARITIES; i++) {
+ var num_ticks = Dygraph.numDateTicks(a, b, i);
+ if (pixels / num_ticks >= pixels_per_tick) {
+ return i;
+ }
+ }
+ return -1;
+};
+
+/**
+ * Compute the number of ticks on a date axis for a given granularity.
+ * @param {number} start_time
+ * @param {number} end_time
+ * @param {number} granularity (one of the granularities enumerated above)
+ * @return {number} (Approximate) number of ticks that would result.
+ */
+Dygraph.numDateTicks = function(start_time, end_time, granularity) {
+ var spacing = Dygraph.TICK_PLACEMENT[granularity].spacing;
+ return Math.round(1.0 * (end_time - start_time) / spacing);
+};
+
+/**
+ * Compute the positions and labels of ticks on a date axis for a given granularity.
+ * @param {number} start_time
+ * @param {number} end_time
+ * @param {number} granularity (one of the granularities enumerated above)
+ * @param {function(string):*} opts Function mapping from option name -&gt; value.
+ * @param {Dygraph=} dg
+ * @return {!Dygraph.TickList}
+ */
+Dygraph.getDateAxis = function(start_time, end_time, granularity, opts, dg) {
+ var formatter = /** @type{AxisLabelFormatter} */(
+ opts("axisLabelFormatter"));
+ var utc = opts("labelsUTC");
+ var accessors = utc ? Dygraph.DateAccessorsUTC : Dygraph.DateAccessorsLocal;
+
+ var datefield = Dygraph.TICK_PLACEMENT[granularity].datefield;
+ var step = Dygraph.TICK_PLACEMENT[granularity].step;
+ var spacing = Dygraph.TICK_PLACEMENT[granularity].spacing;
+
+ // Choose a nice tick position before the initial instant.
+ // Currently, this code deals properly with the existent daily granularities:
+ // DAILY (with step of 1) and WEEKLY (with step of 7 but specially handled).
+ // Other daily granularities (say TWO_DAILY) should also be handled specially
+ // by setting the start_date_offset to 0.
+ var start_date = new Date(start_time);
+ var date_array = [];
+ date_array[Dygraph.DATEFIELD_Y] = accessors.getFullYear(start_date);
+ date_array[Dygraph.DATEFIELD_M] = accessors.getMonth(start_date);
+ date_array[Dygraph.DATEFIELD_D] = accessors.getDate(start_date);
+ date_array[Dygraph.DATEFIELD_HH] = accessors.getHours(start_date);
+ date_array[Dygraph.DATEFIELD_MM] = accessors.getMinutes(start_date);
+ date_array[Dygraph.DATEFIELD_SS] = accessors.getSeconds(start_date);
+ date_array[Dygraph.DATEFIELD_MS] = accessors.getMilliseconds(start_date);
+
+ var start_date_offset = date_array[datefield] % step;
+ if (granularity == Dygraph.WEEKLY) {
+ // This will put the ticks on Sundays.
+ start_date_offset = accessors.getDay(start_date);
+ }
+
+ date_array[datefield] -= start_date_offset;
+ for (var df = datefield + 1; df < Dygraph.NUM_DATEFIELDS; df++) {
+ // The minimum value is 1 for the day of month, and 0 for all other fields.
+ date_array[df] = (df === Dygraph.DATEFIELD_D) ? 1 : 0;
+ }
+
+ // Generate the ticks.
+ // For granularities not coarser than HOURLY we use the fact that:
+ // the number of milliseconds between ticks is constant
+ // and equal to the defined spacing.
+ // Otherwise we rely on the 'roll over' property of the Date functions:
+ // when some date field is set to a value outside of its logical range,
+ // the excess 'rolls over' the next (more significant) field.
+ // However, when using local time with DST transitions,
+ // there are dates that do not represent any time value at all
+ // (those in the hour skipped at the 'spring forward'),
+ // and the JavaScript engines usually return an equivalent value.
+ // Hence we have to check that the date is properly increased at each step,
+ // returning a date at a nice tick position.
+ var ticks = [];
+ var tick_date = accessors.makeDate.apply(null, date_array);
+ var tick_time = tick_date.getTime();
+ if (granularity <= Dygraph.HOURLY) {
+ if (tick_time < start_time) {
+ tick_time += spacing;
+ tick_date = new Date(tick_time);
+ }
+ while (tick_time <= end_time) {
+ ticks.push({ v: tick_time,
+ label: formatter(tick_date, granularity, opts, dg)
+ });
+ tick_time += spacing;
+ tick_date = new Date(tick_time);
+ }
+ } else {
+ if (tick_time < start_time) {
+ date_array[datefield] += step;
+ tick_date = accessors.makeDate.apply(null, date_array);
+ tick_time = tick_date.getTime();
+ }
+ while (tick_time <= end_time) {
+ if (granularity >= Dygraph.DAILY ||
+ accessors.getHours(tick_date) % step === 0) {
+ ticks.push({ v: tick_time,
+ label: formatter(tick_date, granularity, opts, dg)
+ });
+ }
+ date_array[datefield] += step;
+ tick_date = accessors.makeDate.apply(null, date_array);
+ tick_time = tick_date.getTime();
+ }
+ }
+ return ticks;
+};
+
+// These are set here so that this file can be included after dygraph.js
+// or independently.
+if (Dygraph &&
+ Dygraph.DEFAULT_ATTRS &&
+ Dygraph.DEFAULT_ATTRS['axes'] &&
+ Dygraph.DEFAULT_ATTRS['axes']['x'] &&
+ Dygraph.DEFAULT_ATTRS['axes']['y'] &&
+ Dygraph.DEFAULT_ATTRS['axes']['y2']) {
+ Dygraph.DEFAULT_ATTRS['axes']['x']['ticker'] = Dygraph.dateTicker;
+ Dygraph.DEFAULT_ATTRS['axes']['y']['ticker'] = Dygraph.numericTicks;
+ Dygraph.DEFAULT_ATTRS['axes']['y2']['ticker'] = Dygraph.numericTicks;
+}
+
+})();
+/*global Dygraph:false */
+
+// Namespace for plugins. Load this before plugins/*.js files.
+Dygraph.Plugins = {};
+/**
+ * @license
+ * Copyright 2012 Dan Vanderkam (danvdk@gmail.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+
+/*global Dygraph:false */
+
+Dygraph.Plugins.Annotations = (function() {
+
+"use strict";
+
+/**
+Current bits of jankiness:
+- Uses dygraph.layout_ to get the parsed annotations.
+- Uses dygraph.plotter_.area
+
+It would be nice if the plugin didn't require so much special support inside
+the core dygraphs classes, but annotations involve quite a bit of parsing and
+layout.
+
+TODO(danvk): cache DOM elements.
+
+*/
+
+var annotations = function() {
+ this.annotations_ = [];
+};
+
+annotations.prototype.toString = function() {
+ return "Annotations Plugin";
+};
+
+annotations.prototype.activate = function(g) {
+ return {
+ clearChart: this.clearChart,
+ didDrawChart: this.didDrawChart
+ };
+};
+
+annotations.prototype.detachLabels = function() {
+ for (var i = 0; i < this.annotations_.length; i++) {
+ var a = this.annotations_[i];
+ if (a.parentNode) a.parentNode.removeChild(a);
+ this.annotations_[i] = null;
+ }
+ this.annotations_ = [];
+};
+
+annotations.prototype.clearChart = function(e) {
+ this.detachLabels();
+};
+
+annotations.prototype.didDrawChart = function(e) {
+ var g = e.dygraph;
+
+ // Early out in the (common) case of zero annotations.
+ var points = g.layout_.annotated_points;
+ if (!points || points.length === 0) return;
+
+ var containerDiv = e.canvas.parentNode;
+ var annotationStyle = {
+ "position": "absolute",
+ "fontSize": g.getOption('axisLabelFontSize') + "px",
+ "zIndex": 10,
+ "overflow": "hidden"
+ };
+
+ var bindEvt = function(eventName, classEventName, pt) {
+ return function(annotation_event) {
+ var a = pt.annotation;
+ if (a.hasOwnProperty(eventName)) {
+ a[eventName](a, pt, g, annotation_event);
+ } else if (g.getOption(classEventName)) {
+ g.getOption(classEventName)(a, pt, g, annotation_event );
+ }
+ };
+ };
+
+ // Add the annotations one-by-one.
+ var area = e.dygraph.plotter_.area;
+
+ // x-coord to sum of previous annotation's heights (used for stacking).
+ var xToUsedHeight = {};
+
+ for (var i = 0; i < points.length; i++) {
+ var p = points[i];
+ if (p.canvasx < area.x || p.canvasx > area.x + area.w ||
+ p.canvasy < area.y || p.canvasy > area.y + area.h) {
+ continue;
+ }
+
+ var a = p.annotation;
+ var tick_height = 6;
+ if (a.hasOwnProperty("tickHeight")) {
+ tick_height = a.tickHeight;
+ }
+
+ var div = document.createElement("div");
+ for (var name in annotationStyle) {
+ if (annotationStyle.hasOwnProperty(name)) {
+ div.style[name] = annotationStyle[name];
+ }
+ }
+ if (!a.hasOwnProperty('icon')) {
+ div.className = "dygraphDefaultAnnotation";
+ }
+ if (a.hasOwnProperty('cssClass')) {
+ div.className += " " + a.cssClass;
+ }
+
+ var width = a.hasOwnProperty('width') ? a.width : 16;
+ var height = a.hasOwnProperty('height') ? a.height : 16;
+ if (a.hasOwnProperty('icon')) {
+ var img = document.createElement("img");
+ img.src = a.icon;
+ img.width = width;
+ img.height = height;
+ div.appendChild(img);
+ } else if (p.annotation.hasOwnProperty('shortText')) {
+ div.appendChild(document.createTextNode(p.annotation.shortText));
+ }
+ var left = p.canvasx - width / 2;
+ div.style.left = left + "px";
+ var divTop = 0;
+ if (a.attachAtBottom) {
+ var y = (area.y + area.h - height - tick_height);
+ if (xToUsedHeight[left]) {
+ y -= xToUsedHeight[left];
+ } else {
+ xToUsedHeight[left] = 0;
+ }
+ xToUsedHeight[left] += (tick_height + height);
+ divTop = y;
+ } else {
+ divTop = p.canvasy - height - tick_height;
+ }
+ div.style.top = divTop + "px";
+ div.style.width = width + "px";
+ div.style.height = height + "px";
+ div.title = p.annotation.text;
+ div.style.color = g.colorsMap_[p.name];
+ div.style.borderColor = g.colorsMap_[p.name];
+ a.div = div;
+
+ g.addAndTrackEvent(div, 'click',
+ bindEvt('clickHandler', 'annotationClickHandler', p, this));
+ g.addAndTrackEvent(div, 'mouseover',
+ bindEvt('mouseOverHandler', 'annotationMouseOverHandler', p, this));
+ g.addAndTrackEvent(div, 'mouseout',
+ bindEvt('mouseOutHandler', 'annotationMouseOutHandler', p, this));
+ g.addAndTrackEvent(div, 'dblclick',
+ bindEvt('dblClickHandler', 'annotationDblClickHandler', p, this));
+
+ containerDiv.appendChild(div);
+ this.annotations_.push(div);
+
+ var ctx = e.drawingContext;
+ ctx.save();
+ ctx.strokeStyle = g.colorsMap_[p.name];
+ ctx.beginPath();
+ if (!a.attachAtBottom) {
+ ctx.moveTo(p.canvasx, p.canvasy);
+ ctx.lineTo(p.canvasx, p.canvasy - 2 - tick_height);
+ } else {
+ var y = divTop + height;
+ ctx.moveTo(p.canvasx, y);
+ ctx.lineTo(p.canvasx, y + tick_height);
+ }
+ ctx.closePath();
+ ctx.stroke();
+ ctx.restore();
+ }
+};
+
+annotations.prototype.destroy = function() {
+ this.detachLabels();
+};
+
+return annotations;
+
+})();
+/**
+ * @license
+ * Copyright 2012 Dan Vanderkam (danvdk@gmail.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+
+/*global Dygraph:false */
+
+Dygraph.Plugins.Axes = (function() {
+
+'use strict';
+
+/*
+Bits of jankiness:
+- Direct layout access
+- Direct area access
+- Should include calculation of ticks, not just the drawing.
+
+Options left to make axis-friendly.
+ ('drawAxesAtZero')
+ ('xAxisHeight')
+*/
+
+/**
+ * Draws the axes. This includes the labels on the x- and y-axes, as well
+ * as the tick marks on the axes.
+ * It does _not_ draw the grid lines which span the entire chart.
+ */
+var axes = function() {
+ this.xlabels_ = [];
+ this.ylabels_ = [];
+};
+
+axes.prototype.toString = function() {
+ return 'Axes Plugin';
+};
+
+axes.prototype.activate = function(g) {
+ return {
+ layout: this.layout,
+ clearChart: this.clearChart,
+ willDrawChart: this.willDrawChart
+ };
+};
+
+axes.prototype.layout = function(e) {
+ var g = e.dygraph;
+
+ if (g.getOptionForAxis('drawAxis', 'y')) {
+ var w = g.getOptionForAxis('axisLabelWidth', 'y') + 2 * g.getOptionForAxis('axisTickSize', 'y');
+ e.reserveSpaceLeft(w);
+ }
+
+ if (g.getOptionForAxis('drawAxis', 'x')) {
+ var h;
+ // NOTE: I think this is probably broken now, since g.getOption() now
+ // hits the dictionary. (That is, g.getOption('xAxisHeight') now always
+ // has a value.)
+ if (g.getOption('xAxisHeight')) {
+ h = g.getOption('xAxisHeight');
+ } else {
+ h = g.getOptionForAxis('axisLabelFontSize', 'x') + 2 * g.getOptionForAxis('axisTickSize', 'x');
+ }
+ e.reserveSpaceBottom(h);
+ }
+
+ if (g.numAxes() == 2) {
+ if (g.getOptionForAxis('drawAxis', 'y2')) {
+ var w = g.getOptionForAxis('axisLabelWidth', 'y2') + 2 * g.getOptionForAxis('axisTickSize', 'y2');
+ e.reserveSpaceRight(w);
+ }
+ } else if (g.numAxes() > 2) {
+ g.error('Only two y-axes are supported at this time. (Trying ' +
+ 'to use ' + g.numAxes() + ')');
+ }
+};
+
+axes.prototype.detachLabels = function() {
+ function removeArray(ary) {
+ for (var i = 0; i < ary.length; i++) {
+ var el = ary[i];
+ if (el.parentNode) el.parentNode.removeChild(el);
+ }
+ }
+
+ removeArray(this.xlabels_);
+ removeArray(this.ylabels_);
+ this.xlabels_ = [];
+ this.ylabels_ = [];
+};
+
+axes.prototype.clearChart = function(e) {
+ this.detachLabels();
+};
+
+axes.prototype.willDrawChart = function(e) {
+ var g = e.dygraph;
+
+ if (!g.getOptionForAxis('drawAxis', 'x') &&
+ !g.getOptionForAxis('drawAxis', 'y') &&
+ !g.getOptionForAxis('drawAxis', 'y2')) {
+ return;
+ }
+
+ // Round pixels to half-integer boundaries for crisper drawing.
+ function halfUp(x) { return Math.round(x) + 0.5; }
+ function halfDown(y){ return Math.round(y) - 0.5; }
+
+ var context = e.drawingContext;
+ var containerDiv = e.canvas.parentNode;
+ var canvasWidth = g.width_; // e.canvas.width is affected by pixel ratio.
+ var canvasHeight = g.height_;
+
+ var label, x, y, tick, i;
+
+ var makeLabelStyle = function(axis) {
+ return {
+ position: 'absolute',
+ fontSize: g.getOptionForAxis('axisLabelFontSize', axis) + 'px',
+ zIndex: 10,
+ color: g.getOptionForAxis('axisLabelColor', axis),
+ width: g.getOptionForAxis('axisLabelWidth', axis) + 'px',
+ // height: g.getOptionForAxis('axisLabelFontSize', 'x') + 2 + "px",
+ lineHeight: 'normal', // Something other than "normal" line-height screws up label positioning.
+ overflow: 'hidden'
+ };
+ };
+
+ var labelStyles = {
+ x : makeLabelStyle('x'),
+ y : makeLabelStyle('y'),
+ y2 : makeLabelStyle('y2')
+ };
+
+ var makeDiv = function(txt, axis, prec_axis) {
+ /*
+ * This seems to be called with the following three sets of axis/prec_axis:
+ * x: undefined
+ * y: y1
+ * y: y2
+ */
+ var div = document.createElement('div');
+ var labelStyle = labelStyles[prec_axis == 'y2' ? 'y2' : axis];
+ for (var name in labelStyle) {
+ if (labelStyle.hasOwnProperty(name)) {
+ div.style[name] = labelStyle[name];
+ }
+ }
+ var inner_div = document.createElement('div');
+ inner_div.className = 'dygraph-axis-label' +
+ ' dygraph-axis-label-' + axis +
+ (prec_axis ? ' dygraph-axis-label-' + prec_axis : '');
+ inner_div.innerHTML = txt;
+ div.appendChild(inner_div);
+ return div;
+ };
+
+ // axis lines
+ context.save();
+
+ var layout = g.layout_;
+ var area = e.dygraph.plotter_.area;
+
+ // Helper for repeated axis-option accesses.
+ var makeOptionGetter = function(axis) {
+ return function(option) {
+ return g.getOptionForAxis(option, axis);
+ };
+ };
+
+ if (g.getOptionForAxis('drawAxis', 'y')) {
+ if (layout.yticks && layout.yticks.length > 0) {
+ var num_axes = g.numAxes();
+ var getOptions = [makeOptionGetter('y'), makeOptionGetter('y2')];
+ for (i = 0; i < layout.yticks.length; i++) {
+ tick = layout.yticks[i];
+ if (typeof(tick) == 'function') return; // <-- when would this happen?
+ x = area.x;
+ var sgn = 1;
+ var prec_axis = 'y1';
+ var getAxisOption = getOptions[0];
+ if (tick[0] == 1) { // right-side y-axis
+ x = area.x + area.w;
+ sgn = -1;
+ prec_axis = 'y2';
+ getAxisOption = getOptions[1];
+ }
+ var fontSize = getAxisOption('axisLabelFontSize');
+ y = area.y + tick[1] * area.h;
+
+ /* Tick marks are currently clipped, so don't bother drawing them.
+ context.beginPath();
+ context.moveTo(halfUp(x), halfDown(y));
+ context.lineTo(halfUp(x - sgn * this.attr_('axisTickSize')), halfDown(y));
+ context.closePath();
+ context.stroke();
+ */
+
+ label = makeDiv(tick[2], 'y', num_axes == 2 ? prec_axis : null);
+ var top = (y - fontSize / 2);
+ if (top < 0) top = 0;
+
+ if (top + fontSize + 3 > canvasHeight) {
+ label.style.bottom = '0';
+ } else {
+ label.style.top = top + 'px';
+ }
+ if (tick[0] === 0) {
+ label.style.left = (area.x - getAxisOption('axisLabelWidth') - getAxisOption('axisTickSize')) + 'px';
+ label.style.textAlign = 'right';
+ } else if (tick[0] == 1) {
+ label.style.left = (area.x + area.w +
+ getAxisOption('axisTickSize')) + 'px';
+ label.style.textAlign = 'left';
+ }
+ label.style.width = getAxisOption('axisLabelWidth') + 'px';
+ containerDiv.appendChild(label);
+ this.ylabels_.push(label);
+ }
+
+ // The lowest tick on the y-axis often overlaps with the leftmost
+ // tick on the x-axis. Shift the bottom tick up a little bit to
+ // compensate if necessary.
+ var bottomTick = this.ylabels_[0];
+ // Interested in the y2 axis also?
+ var fontSize = g.getOptionForAxis('axisLabelFontSize', 'y');
+ var bottom = parseInt(bottomTick.style.top, 10) + fontSize;
+ if (bottom > canvasHeight - fontSize) {
+ bottomTick.style.top = (parseInt(bottomTick.style.top, 10) -
+ fontSize / 2) + 'px';
+ }
+ }
+
+ // draw a vertical line on the left to separate the chart from the labels.
+ var axisX;
+ if (g.getOption('drawAxesAtZero')) {
+ var r = g.toPercentXCoord(0);
+ if (r > 1 || r < 0 || isNaN(r)) r = 0;
+ axisX = halfUp(area.x + r * area.w);
+ } else {
+ axisX = halfUp(area.x);
+ }
+
+ context.strokeStyle = g.getOptionForAxis('axisLineColor', 'y');
+ context.lineWidth = g.getOptionForAxis('axisLineWidth', 'y');
+
+ context.beginPath();
+ context.moveTo(axisX, halfDown(area.y));
+ context.lineTo(axisX, halfDown(area.y + area.h));
+ context.closePath();
+ context.stroke();
+
+ // if there's a secondary y-axis, draw a vertical line for that, too.
+ if (g.numAxes() == 2) {
+ context.strokeStyle = g.getOptionForAxis('axisLineColor', 'y2');
+ context.lineWidth = g.getOptionForAxis('axisLineWidth', 'y2');
+ context.beginPath();
+ context.moveTo(halfDown(area.x + area.w), halfDown(area.y));
+ context.lineTo(halfDown(area.x + area.w), halfDown(area.y + area.h));
+ context.closePath();
+ context.stroke();
+ }
+ }
+
+ if (g.getOptionForAxis('drawAxis', 'x')) {
+ if (layout.xticks) {
+ var getAxisOption = makeOptionGetter('x');
+ for (i = 0; i < layout.xticks.length; i++) {
+ tick = layout.xticks[i];
+ x = area.x + tick[0] * area.w;
+ y = area.y + area.h;
+
+ /* Tick marks are currently clipped, so don't bother drawing them.
+ context.beginPath();
+ context.moveTo(halfUp(x), halfDown(y));
+ context.lineTo(halfUp(x), halfDown(y + this.attr_('axisTickSize')));
+ context.closePath();
+ context.stroke();
+ */
+
+ label = makeDiv(tick[1], 'x');
+ label.style.textAlign = 'center';
+ label.style.top = (y + getAxisOption('axisTickSize')) + 'px';
+
+ var left = (x - getAxisOption('axisLabelWidth')/2);
+ if (left + getAxisOption('axisLabelWidth') > canvasWidth) {
+ left = canvasWidth - getAxisOption('axisLabelWidth');
+ label.style.textAlign = 'right';
+ }
+ if (left < 0) {
+ left = 0;
+ label.style.textAlign = 'left';
+ }
+
+ label.style.left = left + 'px';
+ label.style.width = getAxisOption('axisLabelWidth') + 'px';
+ containerDiv.appendChild(label);
+ this.xlabels_.push(label);
+ }
+ }
+
+ context.strokeStyle = g.getOptionForAxis('axisLineColor', 'x');
+ context.lineWidth = g.getOptionForAxis('axisLineWidth', 'x');
+ context.beginPath();
+ var axisY;
+ if (g.getOption('drawAxesAtZero')) {
+ var r = g.toPercentYCoord(0, 0);
+ if (r > 1 || r < 0) r = 1;
+ axisY = halfDown(area.y + r * area.h);
+ } else {
+ axisY = halfDown(area.y + area.h);
+ }
+ context.moveTo(halfUp(area.x), axisY);
+ context.lineTo(halfUp(area.x + area.w), axisY);
+ context.closePath();
+ context.stroke();
+ }
+
+ context.restore();
+};
+
+return axes;
+})();
+/**
+ * @license
+ * Copyright 2012 Dan Vanderkam (danvdk@gmail.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+/*global Dygraph:false */
+
+Dygraph.Plugins.ChartLabels = (function() {
+
+"use strict";
+
+// TODO(danvk): move chart label options out of dygraphs and into the plugin.
+// TODO(danvk): only tear down & rebuild the DIVs when it's necessary.
+
+var chart_labels = function() {
+ this.title_div_ = null;
+ this.xlabel_div_ = null;
+ this.ylabel_div_ = null;
+ this.y2label_div_ = null;
+};
+
+chart_labels.prototype.toString = function() {
+ return "ChartLabels Plugin";
+};
+
+chart_labels.prototype.activate = function(g) {
+ return {
+ layout: this.layout,
+ // clearChart: this.clearChart,
+ didDrawChart: this.didDrawChart
+ };
+};
+
+// QUESTION: should there be a plugin-utils.js?
+var createDivInRect = function(r) {
+ var div = document.createElement('div');
+ div.style.position = 'absolute';
+ div.style.left = r.x + 'px';
+ div.style.top = r.y + 'px';
+ div.style.width = r.w + 'px';
+ div.style.height = r.h + 'px';
+ return div;
+};
+
+// Detach and null out any existing nodes.
+chart_labels.prototype.detachLabels_ = function() {
+ var els = [ this.title_div_,
+ this.xlabel_div_,
+ this.ylabel_div_,
+ this.y2label_div_ ];
+ for (var i = 0; i < els.length; i++) {
+ var el = els[i];
+ if (!el) continue;
+ if (el.parentNode) el.parentNode.removeChild(el);
+ }
+
+ this.title_div_ = null;
+ this.xlabel_div_ = null;
+ this.ylabel_div_ = null;
+ this.y2label_div_ = null;
+};
+
+var createRotatedDiv = function(g, box, axis, classes, html) {
+ // TODO(danvk): is this outer div actually necessary?
+ var div = document.createElement("div");
+ div.style.position = 'absolute';
+ if (axis == 1) {
+ // NOTE: this is cheating. Should be positioned relative to the box.
+ div.style.left = '0px';
+ } else {
+ div.style.left = box.x + 'px';
+ }
+ div.style.top = box.y + 'px';
+ div.style.width = box.w + 'px';
+ div.style.height = box.h + 'px';
+ div.style.fontSize = (g.getOption('yLabelWidth') - 2) + 'px';
+
+ var inner_div = document.createElement("div");
+ inner_div.style.position = 'absolute';
+ inner_div.style.width = box.h + 'px';
+ inner_div.style.height = box.w + 'px';
+ inner_div.style.top = (box.h / 2 - box.w / 2) + 'px';
+ inner_div.style.left = (box.w / 2 - box.h / 2) + 'px';
+ inner_div.style.textAlign = 'center';
+
+ // CSS rotation is an HTML5 feature which is not standardized. Hence every
+ // browser has its own name for the CSS style.
+ var val = 'rotate(' + (axis == 1 ? '-' : '') + '90deg)';
+ inner_div.style.transform = val; // HTML5
+ inner_div.style.WebkitTransform = val; // Safari/Chrome
+ inner_div.style.MozTransform = val; // Firefox
+ inner_div.style.OTransform = val; // Opera
+ inner_div.style.msTransform = val; // IE9
+
+ if (typeof(document.documentMode) !== 'undefined' &&
+ document.documentMode < 9) {
+ // We're dealing w/ an old version of IE, so we have to rotate the text
+ // using a BasicImage transform. This uses a different origin of rotation
+ // than HTML5 rotation (top left of div vs. its center).
+ inner_div.style.filter =
+ 'progid:DXImageTransform.Microsoft.BasicImage(rotation=' +
+ (axis == 1 ? '3' : '1') + ')';
+ inner_div.style.left = '0px';
+ inner_div.style.top = '0px';
+ }
+
+ var class_div = document.createElement("div");
+ class_div.className = classes;
+ class_div.innerHTML = html;
+
+ inner_div.appendChild(class_div);
+ div.appendChild(inner_div);
+ return div;
+};
+
+chart_labels.prototype.layout = function(e) {
+ this.detachLabels_();
+
+ var g = e.dygraph;
+ var div = e.chart_div;
+ if (g.getOption('title')) {
+ // QUESTION: should this return an absolutely-positioned div instead?
+ var title_rect = e.reserveSpaceTop(g.getOption('titleHeight'));
+ this.title_div_ = createDivInRect(title_rect);
+ this.title_div_.style.textAlign = 'center';
+ this.title_div_.style.fontSize = (g.getOption('titleHeight') - 8) + 'px';
+ this.title_div_.style.fontWeight = 'bold';
+ this.title_div_.style.zIndex = 10;
+
+ var class_div = document.createElement("div");
+ class_div.className = 'dygraph-label dygraph-title';
+ class_div.innerHTML = g.getOption('title');
+ this.title_div_.appendChild(class_div);
+ div.appendChild(this.title_div_);
+ }
+
+ if (g.getOption('xlabel')) {
+ var x_rect = e.reserveSpaceBottom(g.getOption('xLabelHeight'));
+ this.xlabel_div_ = createDivInRect(x_rect);
+ this.xlabel_div_.style.textAlign = 'center';
+ this.xlabel_div_.style.fontSize = (g.getOption('xLabelHeight') - 2) + 'px';
+
+ var class_div = document.createElement("div");
+ class_div.className = 'dygraph-label dygraph-xlabel';
+ class_div.innerHTML = g.getOption('xlabel');
+ this.xlabel_div_.appendChild(class_div);
+ div.appendChild(this.xlabel_div_);
+ }
+
+ if (g.getOption('ylabel')) {
+ // It would make sense to shift the chart here to make room for the y-axis
+ // label, but the default yAxisLabelWidth is large enough that this results
+ // in overly-padded charts. The y-axis label should fit fine. If it
+ // doesn't, the yAxisLabelWidth option can be increased.
+ var y_rect = e.reserveSpaceLeft(0);
+
+ this.ylabel_div_ = createRotatedDiv(
+ g, y_rect,
+ 1, // primary (left) y-axis
+ 'dygraph-label dygraph-ylabel',
+ g.getOption('ylabel'));
+ div.appendChild(this.ylabel_div_);
+ }
+
+ if (g.getOption('y2label') && g.numAxes() == 2) {
+ // same logic applies here as for ylabel.
+ var y2_rect = e.reserveSpaceRight(0);
+ this.y2label_div_ = createRotatedDiv(
+ g, y2_rect,
+ 2, // secondary (right) y-axis
+ 'dygraph-label dygraph-y2label',
+ g.getOption('y2label'));
+ div.appendChild(this.y2label_div_);
+ }
+};
+
+chart_labels.prototype.didDrawChart = function(e) {
+ var g = e.dygraph;
+ if (this.title_div_) {
+ this.title_div_.children[0].innerHTML = g.getOption('title');
+ }
+ if (this.xlabel_div_) {
+ this.xlabel_div_.children[0].innerHTML = g.getOption('xlabel');
+ }
+ if (this.ylabel_div_) {
+ this.ylabel_div_.children[0].children[0].innerHTML = g.getOption('ylabel');
+ }
+ if (this.y2label_div_) {
+ this.y2label_div_.children[0].children[0].innerHTML = g.getOption('y2label');
+ }
+};
+
+chart_labels.prototype.clearChart = function() {
+};
+
+chart_labels.prototype.destroy = function() {
+ this.detachLabels_();
+};
+
+
+return chart_labels;
+})();
+/**
+ * @license
+ * Copyright 2012 Dan Vanderkam (danvdk@gmail.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+/*global Dygraph:false */
+
+Dygraph.Plugins.Grid = (function() {
+
+/*
+
+Current bits of jankiness:
+- Direct layout access
+- Direct area access
+
+*/
+
+"use strict";
+
+
+/**
+ * Draws the gridlines, i.e. the gray horizontal & vertical lines running the
+ * length of the chart.
+ *
+ * @constructor
+ */
+var grid = function() {
+};
+
+grid.prototype.toString = function() {
+ return "Gridline Plugin";
+};
+
+grid.prototype.activate = function(g) {
+ return {
+ willDrawChart: this.willDrawChart
+ };
+};
+
+grid.prototype.willDrawChart = function(e) {
+ // Draw the new X/Y grid. Lines appear crisper when pixels are rounded to
+ // half-integers. This prevents them from drawing in two rows/cols.
+ var g = e.dygraph;
+ var ctx = e.drawingContext;
+ var layout = g.layout_;
+ var area = e.dygraph.plotter_.area;
+
+ function halfUp(x) { return Math.round(x) + 0.5; }
+ function halfDown(y){ return Math.round(y) - 0.5; }
+
+ var x, y, i, ticks;
+ if (g.getOptionForAxis('drawGrid', 'y')) {
+ var axes = ["y", "y2"];
+ var strokeStyles = [], lineWidths = [], drawGrid = [], stroking = [], strokePattern = [];
+ for (var i = 0; i < axes.length; i++) {
+ drawGrid[i] = g.getOptionForAxis('drawGrid', axes[i]);
+ if (drawGrid[i]) {
+ strokeStyles[i] = g.getOptionForAxis('gridLineColor', axes[i]);
+ lineWidths[i] = g.getOptionForAxis('gridLineWidth', axes[i]);
+ strokePattern[i] = g.getOptionForAxis('gridLinePattern', axes[i]);
+ stroking[i] = strokePattern[i] && (strokePattern[i].length >= 2);
+ }
+ }
+ ticks = layout.yticks;
+ ctx.save();
+ // draw grids for the different y axes
+ for (i = 0; i < ticks.length; i++) {
+ var axis = ticks[i][0];
+ if(drawGrid[axis]) {
+ if (stroking[axis]) {
+ ctx.installPattern(strokePattern[axis]);
+ }
+ ctx.strokeStyle = strokeStyles[axis];
+ ctx.lineWidth = lineWidths[axis];
+
+ x = halfUp(area.x);
+ y = halfDown(area.y + ticks[i][1] * area.h);
+ ctx.beginPath();
+ ctx.moveTo(x, y);
+ ctx.lineTo(x + area.w, y);
+ ctx.closePath();
+ ctx.stroke();
+
+ if (stroking[axis]) {
+ ctx.uninstallPattern();
+ }
+ }
+ }
+ ctx.restore();
+ }
+
+ // draw grid for x axis
+ if (g.getOptionForAxis('drawGrid', 'x')) {
+ ticks = layout.xticks;
+ ctx.save();
+ var strokePattern = g.getOptionForAxis('gridLinePattern', 'x');
+ var stroking = strokePattern && (strokePattern.length >= 2);
+ if (stroking) {
+ ctx.installPattern(strokePattern);
+ }
+ ctx.strokeStyle = g.getOptionForAxis('gridLineColor', 'x');
+ ctx.lineWidth = g.getOptionForAxis('gridLineWidth', 'x');
+ for (i = 0; i < ticks.length; i++) {
+ x = halfUp(area.x + ticks[i][0] * area.w);
+ y = halfDown(area.y + area.h);
+ ctx.beginPath();
+ ctx.moveTo(x, y);
+ ctx.lineTo(x, area.y);
+ ctx.closePath();
+ ctx.stroke();
+ }
+ if (stroking) {
+ ctx.uninstallPattern();
+ }
+ ctx.restore();
+ }
+};
+
+grid.prototype.destroy = function() {
+};
+
+return grid;
+
+})();
+/**
+ * @license
+ * Copyright 2012 Dan Vanderkam (danvdk@gmail.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+/*global Dygraph:false */
+
+Dygraph.Plugins.Legend = (function() {
+/*
+Current bits of jankiness:
+- Uses two private APIs:
+ 1. Dygraph.optionsViewForAxis_
+ 2. dygraph.plotter_.area
+- Registers for a "predraw" event, which should be renamed.
+- I call calculateEmWidthInDiv more often than needed.
+*/
+
+/*global Dygraph:false */
+"use strict";
+
+
+/**
+ * Creates the legend, which appears when the user hovers over the chart.
+ * The legend can be either a user-specified or generated div.
+ *
+ * @constructor
+ */
+var legend = function() {
+ this.legend_div_ = null;
+ this.is_generated_div_ = false; // do we own this div, or was it user-specified?
+};
+
+legend.prototype.toString = function() {
+ return "Legend Plugin";
+};
+
+// (defined below)
+var generateLegendDashHTML;
+
+/**
+ * This is called during the dygraph constructor, after options have been set
+ * but before the data is available.
+ *
+ * Proper tasks to do here include:
+ * - Reading your own options
+ * - DOM manipulation
+ * - Registering event listeners
+ *
+ * @param {Dygraph} g Graph instance.
+ * @return {object.<string, function(ev)>} Mapping of event names to callbacks.
+ */
+legend.prototype.activate = function(g) {
+ var div;
+ var divWidth = g.getOption('labelsDivWidth');
+
+ var userLabelsDiv = g.getOption('labelsDiv');
+ if (userLabelsDiv && null !== userLabelsDiv) {
+ if (typeof(userLabelsDiv) == "string" || userLabelsDiv instanceof String) {
+ div = document.getElementById(userLabelsDiv);
+ } else {
+ div = userLabelsDiv;
+ }
+ } else {
+ // Default legend styles. These can be overridden in CSS by adding
+ // "!important" after your rule, e.g. "left: 30px !important;"
+ var messagestyle = {
+ "position": "absolute",
+ "fontSize": "14px",
+ "zIndex": 10,
+ "width": divWidth + "px",
+ "top": "0px",
+ "left": (g.size().width - divWidth - 2) + "px",
+ "background": "white",
+ "lineHeight": "normal",
+ "textAlign": "left",
+ "overflow": "hidden"};
+
+ // TODO(danvk): get rid of labelsDivStyles? CSS is better.
+ Dygraph.update(messagestyle, g.getOption('labelsDivStyles'));
+ div = document.createElement("div");
+ div.className = "dygraph-legend";
+ for (var name in messagestyle) {
+ if (!messagestyle.hasOwnProperty(name)) continue;
+
+ try {
+ div.style[name] = messagestyle[name];
+ } catch (e) {
+ console.warn("You are using unsupported css properties for your " +
+ "browser in labelsDivStyles");
+ }
+ }
+
+ // TODO(danvk): come up with a cleaner way to expose this.
+ g.graphDiv.appendChild(div);
+ this.is_generated_div_ = true;
+ }
+
+ this.legend_div_ = div;
+ this.one_em_width_ = 10; // just a guess, will be updated.
+
+ return {
+ select: this.select,
+ deselect: this.deselect,
+ // TODO(danvk): rethink the name "predraw" before we commit to it in any API.
+ predraw: this.predraw,
+ didDrawChart: this.didDrawChart
+ };
+};
+
+// Needed for dashed lines.
+var calculateEmWidthInDiv = function(div) {
+ var sizeSpan = document.createElement('span');
+ sizeSpan.setAttribute('style', 'margin: 0; padding: 0 0 0 1em; border: 0;');
+ div.appendChild(sizeSpan);
+ var oneEmWidth=sizeSpan.offsetWidth;
+ div.removeChild(sizeSpan);
+ return oneEmWidth;
+};
+
+var escapeHTML = function(str) {
+ return str.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+};
+
+legend.prototype.select = function(e) {
+ var xValue = e.selectedX;
+ var points = e.selectedPoints;
+
+ var legendMode = e.dygraph.getOption('legend');
+ if (legendMode === 'never') {
+ this.legend_div_.style.display = 'none';
+ return;
+ }
+
+ if (legendMode === 'follow') {
+ // create floating legend div
+ var area = e.dygraph.plotter_.area;
+ var labelsDivWidth = e.dygraph.getOption('labelsDivWidth');
+ var yAxisLabelWidth = e.dygraph.getOptionForAxis('axisLabelWidth', 'y');
+ // determine floating [left, top] coordinates of the legend div
+ // within the plotter_ area
+ // offset 20 px to the right and down from the first selection point
+ // 20 px is guess based on mouse cursor size
+ var leftLegend = points[0].x * area.w + 20;
+ var topLegend = points[0].y * area.h - 20;
+
+ // if legend floats to end of the window area, it flips to the other
+ // side of the selection point
+ if ((leftLegend + labelsDivWidth + 1) > (window.scrollX + window.innerWidth)) {
+ leftLegend = leftLegend - 2 * 20 - labelsDivWidth - (yAxisLabelWidth - area.x);
+ }
+
+ e.dygraph.graphDiv.appendChild(this.legend_div_);
+ this.legend_div_.style.left = yAxisLabelWidth + leftLegend + "px";
+ this.legend_div_.style.top = topLegend + "px";
+ }
+
+ var html = legend.generateLegendHTML(e.dygraph, xValue, points, this.one_em_width_);
+ this.legend_div_.innerHTML = html;
+ this.legend_div_.style.display = '';
+};
+
+legend.prototype.deselect = function(e) {
+ var legendMode = e.dygraph.getOption('legend');
+ if (legendMode !== 'always') {
+ this.legend_div_.style.display = "none";
+ }
+
+ // Have to do this every time, since styles might have changed.
+ var oneEmWidth = calculateEmWidthInDiv(this.legend_div_);
+ this.one_em_width_ = oneEmWidth;
+
+ var html = legend.generateLegendHTML(e.dygraph, undefined, undefined, oneEmWidth);
+ this.legend_div_.innerHTML = html;
+};
+
+legend.prototype.didDrawChart = function(e) {
+ this.deselect(e);
+};
+
+// Right edge should be flush with the right edge of the charting area (which
+// may not be the same as the right edge of the div, if we have two y-axes.
+// TODO(danvk): is any of this really necessary? Could just set "right" in "activate".
+/**
+ * Position the labels div so that:
+ * - its right edge is flush with the right edge of the charting area
+ * - its top edge is flush with the top edge of the charting area
+ * @private
+ */
+legend.prototype.predraw = function(e) {
+ // Don't touch a user-specified labelsDiv.
+ if (!this.is_generated_div_) return;
+
+ // TODO(danvk): only use real APIs for this.
+ e.dygraph.graphDiv.appendChild(this.legend_div_);
+ var area = e.dygraph.plotter_.area;
+ var labelsDivWidth = e.dygraph.getOption("labelsDivWidth");
+ this.legend_div_.style.left = area.x + area.w - labelsDivWidth - 1 + "px";
+ this.legend_div_.style.top = area.y + "px";
+ this.legend_div_.style.width = labelsDivWidth + "px";
+};
+
+/**
+ * Called when dygraph.destroy() is called.
+ * You should null out any references and detach any DOM elements.
+ */
+legend.prototype.destroy = function() {
+ this.legend_div_ = null;
+};
+
+/**
+ * @private
+ * Generates HTML for the legend which is displayed when hovering over the
+ * chart. If no selected points are specified, a default legend is returned
+ * (this may just be the empty string).
+ * @param { Number } [x] The x-value of the selected points.
+ * @param { [Object] } [sel_points] List of selected points for the given
+ * x-value. Should have properties like 'name', 'yval' and 'canvasy'.
+ * @param { Number } [oneEmWidth] The pixel width for 1em in the legend. Only
+ * relevant when displaying a legend with no selection (i.e. {legend:
+ * 'always'}) and with dashed lines.
+ */
+legend.generateLegendHTML = function(g, x, sel_points, oneEmWidth) {
+ // TODO(danvk): deprecate this option in place of {legend: 'never'}
+ if (g.getOption('showLabelsOnHighlight') !== true) return '';
+
+ // If no points are selected, we display a default legend. Traditionally,
+ // this has been blank. But a better default would be a conventional legend,
+ // which provides essential information for a non-interactive chart.
+ var html, sepLines, i, dash, strokePattern;
+ var labels = g.getLabels();
+
+ if (typeof(x) === 'undefined') {
+ if (g.getOption('legend') != 'always') {
+ return '';
+ }
+
+ sepLines = g.getOption('labelsSeparateLines');
+ html = '';
+ for (i = 1; i < labels.length; i++) {
+ var series = g.getPropertiesForSeries(labels[i]);
+ if (!series.visible) continue;
+
+ if (html !== '') html += (sepLines ? '<br/>' : ' ');
+ strokePattern = g.getOption("strokePattern", labels[i]);
+ dash = generateLegendDashHTML(strokePattern, series.color, oneEmWidth);
+ html += "<span style='font-weight: bold; color: " + series.color + ";'>" +
+ dash + " " + escapeHTML(labels[i]) + "</span>";
+ }
+ return html;
+ }
+
+ // TODO(danvk): remove this use of a private API
+ var xOptView = g.optionsViewForAxis_('x');
+ var xvf = xOptView('valueFormatter');
+ html = xvf(x, xOptView, labels[0], g);
+ if (html !== '') {
+ html += ':';
+ }
+
+ var yOptViews = [];
+ var num_axes = g.numAxes();
+ for (i = 0; i < num_axes; i++) {
+ // TODO(danvk): remove this use of a private API
+ yOptViews[i] = g.optionsViewForAxis_('y' + (i ? 1 + i : ''));
+ }
+ var showZeros = g.getOption("labelsShowZeroValues");
+ sepLines = g.getOption("labelsSeparateLines");
+ var highlightSeries = g.getHighlightSeries();
+ for (i = 0; i < sel_points.length; i++) {
+ var pt = sel_points[i];
+ if (pt.yval === 0 && !showZeros) continue;
+ if (!Dygraph.isOK(pt.canvasy)) continue;
+ if (sepLines) html += "<br/>";
+
+ var series = g.getPropertiesForSeries(pt.name);
+ var yOptView = yOptViews[series.axis - 1];
+ var fmtFunc = yOptView('valueFormatter');
+ var yval = fmtFunc(pt.yval, yOptView, pt.name, g);
+
+ var cls = (pt.name == highlightSeries) ? " class='highlight'" : "";
+
+ // TODO(danvk): use a template string here and make it an attribute.
+ html += "<span" + cls + ">" + " <b><span style='color: " + series.color + ";'>" +
+ escapeHTML(pt.name) + "</span></b>:&#160;" + yval + "</span>";
+ }
+ return html;
+};
+
+
+/**
+ * Generates html for the "dash" displayed on the legend when using "legend: always".
+ * In particular, this works for dashed lines with any stroke pattern. It will
+ * try to scale the pattern to fit in 1em width. Or if small enough repeat the
+ * pattern for 1em width.
+ *
+ * @param strokePattern The pattern
+ * @param color The color of the series.
+ * @param oneEmWidth The width in pixels of 1em in the legend.
+ * @private
+ */
+generateLegendDashHTML = function(strokePattern, color, oneEmWidth) {
+ // IE 7,8 fail at these divs, so they get boring legend, have not tested 9.
+ var isIE = (/MSIE/.test(navigator.userAgent) && !window.opera);
+ if (isIE) return "&mdash;";
+
+ // Easy, common case: a solid line
+ if (!strokePattern || strokePattern.length <= 1) {
+ return "<div style=\"display: inline-block; position: relative; " +
+ "bottom: .5ex; padding-left: 1em; height: 1px; " +
+ "border-bottom: 2px solid " + color + ";\"></div>";
+ }
+
+ var i, j, paddingLeft, marginRight;
+ var strokePixelLength = 0, segmentLoop = 0;
+ var normalizedPattern = [];
+ var loop;
+
+ // Compute the length of the pixels including the first segment twice,
+ // since we repeat it.
+ for (i = 0; i <= strokePattern.length; i++) {
+ strokePixelLength += strokePattern[i%strokePattern.length];
+ }
+
+ // See if we can loop the pattern by itself at least twice.
+ loop = Math.floor(oneEmWidth/(strokePixelLength-strokePattern[0]));
+ if (loop > 1) {
+ // This pattern fits at least two times, no scaling just convert to em;
+ for (i = 0; i < strokePattern.length; i++) {
+ normalizedPattern[i] = strokePattern[i]/oneEmWidth;
+ }
+ // Since we are repeating the pattern, we don't worry about repeating the
+ // first segment in one draw.
+ segmentLoop = normalizedPattern.length;
+ } else {
+ // If the pattern doesn't fit in the legend we scale it to fit.
+ loop = 1;
+ for (i = 0; i < strokePattern.length; i++) {
+ normalizedPattern[i] = strokePattern[i]/strokePixelLength;
+ }
+ // For the scaled patterns we do redraw the first segment.
+ segmentLoop = normalizedPattern.length+1;
+ }
+
+ // Now make the pattern.
+ var dash = "";
+ for (j = 0; j < loop; j++) {
+ for (i = 0; i < segmentLoop; i+=2) {
+ // The padding is the drawn segment.
+ paddingLeft = normalizedPattern[i%normalizedPattern.length];
+ if (i < strokePattern.length) {
+ // The margin is the space segment.
+ marginRight = normalizedPattern[(i+1)%normalizedPattern.length];
+ } else {
+ // The repeated first segment has no right margin.
+ marginRight = 0;
+ }
+ dash += "<div style=\"display: inline-block; position: relative; " +
+ "bottom: .5ex; margin-right: " + marginRight + "em; padding-left: " +
+ paddingLeft + "em; height: 1px; border-bottom: 2px solid " + color +
+ ";\"></div>";
+ }
+ }
+ return dash;
+};
+
+
+return legend;
+})();
+/**
+ * @license
+ * Copyright 2011 Paul Felix (paul.eric.felix@gmail.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+/*global Dygraph:false,TouchEvent:false */
+
+/**
+ * @fileoverview This file contains the RangeSelector plugin used to provide
+ * a timeline range selector widget for dygraphs.
+ */
+
+Dygraph.Plugins.RangeSelector = (function() {
+
+/*global Dygraph:false */
+"use strict";
+
+var rangeSelector = function() {
+ this.isIE_ = /MSIE/.test(navigator.userAgent) && !window.opera;
+ this.hasTouchInterface_ = typeof(TouchEvent) != 'undefined';
+ this.isMobileDevice_ = /mobile|android/gi.test(navigator.appVersion);
+ this.interfaceCreated_ = false;
+};
+
+rangeSelector.prototype.toString = function() {
+ return "RangeSelector Plugin";
+};
+
+rangeSelector.prototype.activate = function(dygraph) {
+ this.dygraph_ = dygraph;
+ this.isUsingExcanvas_ = dygraph.isUsingExcanvas_;
+ if (this.getOption_('showRangeSelector')) {
+ this.createInterface_();
+ }
+ return {
+ layout: this.reserveSpace_,
+ predraw: this.renderStaticLayer_,
+ didDrawChart: this.renderInteractiveLayer_
+ };
+};
+
+rangeSelector.prototype.destroy = function() {
+ this.bgcanvas_ = null;
+ this.fgcanvas_ = null;
+ this.leftZoomHandle_ = null;
+ this.rightZoomHandle_ = null;
+ this.iePanOverlay_ = null;
+};
+
+//------------------------------------------------------------------
+// Private methods
+//------------------------------------------------------------------
+
+rangeSelector.prototype.getOption_ = function(name, opt_series) {
+ return this.dygraph_.getOption(name, opt_series);
+};
+
+rangeSelector.prototype.setDefaultOption_ = function(name, value) {
+ this.dygraph_.attrs_[name] = value;
+};
+
+/**
+ * @private
+ * Creates the range selector elements and adds them to the graph.
+ */
+rangeSelector.prototype.createInterface_ = function() {
+ this.createCanvases_();
+ if (this.isUsingExcanvas_) {
+ this.createIEPanOverlay_();
+ }
+ this.createZoomHandles_();
+ this.initInteraction_();
+
+ // Range selector and animatedZooms have a bad interaction. See issue 359.
+ if (this.getOption_('animatedZooms')) {
+ console.warn('Animated zooms and range selector are not compatible; disabling animatedZooms.');
+ this.dygraph_.updateOptions({animatedZooms: false}, true);
+ }
+
+ this.interfaceCreated_ = true;
+ this.addToGraph_();
+};
+
+/**
+ * @private
+ * Adds the range selector to the graph.
+ */
+rangeSelector.prototype.addToGraph_ = function() {
+ var graphDiv = this.graphDiv_ = this.dygraph_.graphDiv;
+ graphDiv.appendChild(this.bgcanvas_);
+ graphDiv.appendChild(this.fgcanvas_);
+ graphDiv.appendChild(this.leftZoomHandle_);
+ graphDiv.appendChild(this.rightZoomHandle_);
+};
+
+/**
+ * @private
+ * Removes the range selector from the graph.
+ */
+rangeSelector.prototype.removeFromGraph_ = function() {
+ var graphDiv = this.graphDiv_;
+ graphDiv.removeChild(this.bgcanvas_);
+ graphDiv.removeChild(this.fgcanvas_);
+ graphDiv.removeChild(this.leftZoomHandle_);
+ graphDiv.removeChild(this.rightZoomHandle_);
+ this.graphDiv_ = null;
+};
+
+/**
+ * @private
+ * Called by Layout to allow range selector to reserve its space.
+ */
+rangeSelector.prototype.reserveSpace_ = function(e) {
+ if (this.getOption_('showRangeSelector')) {
+ e.reserveSpaceBottom(this.getOption_('rangeSelectorHeight') + 4);
+ }
+};
+
+/**
+ * @private
+ * Renders the static portion of the range selector at the predraw stage.
+ */
+rangeSelector.prototype.renderStaticLayer_ = function() {
+ if (!this.updateVisibility_()) {
+ return;
+ }
+ this.resize_();
+ this.drawStaticLayer_();
+};
+
+/**
+ * @private
+ * Renders the interactive portion of the range selector after the chart has been drawn.
+ */
+rangeSelector.prototype.renderInteractiveLayer_ = function() {
+ if (!this.updateVisibility_() || this.isChangingRange_) {
+ return;
+ }
+ this.placeZoomHandles_();
+ this.drawInteractiveLayer_();
+};
+
+/**
+ * @private
+ * Check to see if the range selector is enabled/disabled and update visibility accordingly.
+ */
+rangeSelector.prototype.updateVisibility_ = function() {
+ var enabled = this.getOption_('showRangeSelector');
+ if (enabled) {
+ if (!this.interfaceCreated_) {
+ this.createInterface_();
+ } else if (!this.graphDiv_ || !this.graphDiv_.parentNode) {
+ this.addToGraph_();
+ }
+ } else if (this.graphDiv_) {
+ this.removeFromGraph_();
+ var dygraph = this.dygraph_;
+ setTimeout(function() { dygraph.width_ = 0; dygraph.resize(); }, 1);
+ }
+ return enabled;
+};
+
+/**
+ * @private
+ * Resizes the range selector.
+ */
+rangeSelector.prototype.resize_ = function() {
+ function setElementRect(canvas, context, rect) {
+ var canvasScale = Dygraph.getContextPixelRatio(context);
+
+ canvas.style.top = rect.y + 'px';
+ canvas.style.left = rect.x + 'px';
+ canvas.width = rect.w * canvasScale;
+ canvas.height = rect.h * canvasScale;
+ canvas.style.width = rect.w + 'px';
+ canvas.style.height = rect.h + 'px';
+
+ if(canvasScale != 1) {
+ context.scale(canvasScale, canvasScale);
+ }
+ }
+
+ var plotArea = this.dygraph_.layout_.getPlotArea();
+
+ var xAxisLabelHeight = 0;
+ if (this.dygraph_.getOptionForAxis('drawAxis', 'x')) {
+ xAxisLabelHeight = this.getOption_('xAxisHeight') || (this.getOption_('axisLabelFontSize') + 2 * this.getOption_('axisTickSize'));
+ }
+ this.canvasRect_ = {
+ x: plotArea.x,
+ y: plotArea.y + plotArea.h + xAxisLabelHeight + 4,
+ w: plotArea.w,
+ h: this.getOption_('rangeSelectorHeight')
+ };
+
+ setElementRect(this.bgcanvas_, this.bgcanvas_ctx_, this.canvasRect_);
+ setElementRect(this.fgcanvas_, this.fgcanvas_ctx_, this.canvasRect_);
+};
+
+/**
+ * @private
+ * Creates the background and foreground canvases.
+ */
+rangeSelector.prototype.createCanvases_ = function() {
+ this.bgcanvas_ = Dygraph.createCanvas();
+ this.bgcanvas_.className = 'dygraph-rangesel-bgcanvas';
+ this.bgcanvas_.style.position = 'absolute';
+ this.bgcanvas_.style.zIndex = 9;
+ this.bgcanvas_ctx_ = Dygraph.getContext(this.bgcanvas_);
+
+ this.fgcanvas_ = Dygraph.createCanvas();
+ this.fgcanvas_.className = 'dygraph-rangesel-fgcanvas';
+ this.fgcanvas_.style.position = 'absolute';
+ this.fgcanvas_.style.zIndex = 9;
+ this.fgcanvas_.style.cursor = 'default';
+ this.fgcanvas_ctx_ = Dygraph.getContext(this.fgcanvas_);
+};
+
+/**
+ * @private
+ * Creates overlay divs for IE/Excanvas so that mouse events are handled properly.
+ */
+rangeSelector.prototype.createIEPanOverlay_ = function() {
+ this.iePanOverlay_ = document.createElement("div");
+ this.iePanOverlay_.style.position = 'absolute';
+ this.iePanOverlay_.style.backgroundColor = 'white';
+ this.iePanOverlay_.style.filter = 'alpha(opacity=0)';
+ this.iePanOverlay_.style.display = 'none';
+ this.iePanOverlay_.style.cursor = 'move';
+ this.fgcanvas_.appendChild(this.iePanOverlay_);
+};
+
+/**
+ * @private
+ * Creates the zoom handle elements.
+ */
+rangeSelector.prototype.createZoomHandles_ = function() {
+ var img = new Image();
+ img.className = 'dygraph-rangesel-zoomhandle';
+ img.style.position = 'absolute';
+ img.style.zIndex = 10;
+ img.style.visibility = 'hidden'; // Initially hidden so they don't show up in the wrong place.
+ img.style.cursor = 'col-resize';
+
+ if (/MSIE 7/.test(navigator.userAgent)) { // IE7 doesn't support embedded src data.
+ img.width = 7;
+ img.height = 14;
+ img.style.backgroundColor = 'white';
+ img.style.border = '1px solid #333333'; // Just show box in IE7.
+ } else {
+ img.width = 9;
+ img.height = 16;
+ img.src = 'data:image/png;base64,' +
+'iVBORw0KGgoAAAANSUhEUgAAAAkAAAAQCAYAAADESFVDAAAAAXNSR0IArs4c6QAAAAZiS0dEANAA' +
+'zwDP4Z7KegAAAAlwSFlzAAAOxAAADsQBlSsOGwAAAAd0SU1FB9sHGw0cMqdt1UwAAAAZdEVYdENv' +
+'bW1lbnQAQ3JlYXRlZCB3aXRoIEdJTVBXgQ4XAAAAaElEQVQoz+3SsRFAQBCF4Z9WJM8KCDVwownl' +
+'6YXsTmCUsyKGkZzcl7zkz3YLkypgAnreFmDEpHkIwVOMfpdi9CEEN2nGpFdwD03yEqDtOgCaun7s' +
+'qSTDH32I1pQA2Pb9sZecAxc5r3IAb21d6878xsAAAAAASUVORK5CYII=';
+ }
+
+ if (this.isMobileDevice_) {
+ img.width *= 2;
+ img.height *= 2;
+ }
+
+ this.leftZoomHandle_ = img;
+ this.rightZoomHandle_ = img.cloneNode(false);
+};
+
+/**
+ * @private
+ * Sets up the interaction for the range selector.
+ */
+rangeSelector.prototype.initInteraction_ = function() {
+ var self = this;
+ var topElem = document;
+ var clientXLast = 0;
+ var handle = null;
+ var isZooming = false;
+ var isPanning = false;
+ var dynamic = !this.isMobileDevice_ && !this.isUsingExcanvas_;
+
+ // We cover iframes during mouse interactions. See comments in
+ // dygraph-utils.js for more info on why this is a good idea.
+ var tarp = new Dygraph.IFrameTarp();
+
+ // functions, defined below. Defining them this way (rather than with
+ // "function foo() {...}" makes JSHint happy.
+ var toXDataWindow, onZoomStart, onZoom, onZoomEnd, doZoom, isMouseInPanZone,
+ onPanStart, onPan, onPanEnd, doPan, onCanvasHover;
+
+ // Touch event functions
+ var onZoomHandleTouchEvent, onCanvasTouchEvent, addTouchEvents;
+
+ toXDataWindow = function(zoomHandleStatus) {
+ var xDataLimits = self.dygraph_.xAxisExtremes();
+ var fact = (xDataLimits[1] - xDataLimits[0])/self.canvasRect_.w;
+ var xDataMin = xDataLimits[0] + (zoomHandleStatus.leftHandlePos - self.canvasRect_.x)*fact;
+ var xDataMax = xDataLimits[0] + (zoomHandleStatus.rightHandlePos - self.canvasRect_.x)*fact;
+ return [xDataMin, xDataMax];
+ };
+
+ onZoomStart = function(e) {
+ Dygraph.cancelEvent(e);
+ isZooming = true;
+ clientXLast = e.clientX;
+ handle = e.target ? e.target : e.srcElement;
+ if (e.type === 'mousedown' || e.type === 'dragstart') {
+ // These events are removed manually.
+ Dygraph.addEvent(topElem, 'mousemove', onZoom);
+ Dygraph.addEvent(topElem, 'mouseup', onZoomEnd);
+ }
+ self.fgcanvas_.style.cursor = 'col-resize';
+ tarp.cover();
+ return true;
+ };
+
+ onZoom = function(e) {
+ if (!isZooming) {
+ return false;
+ }
+ Dygraph.cancelEvent(e);
+
+ var delX = e.clientX - clientXLast;
+ if (Math.abs(delX) < 4) {
+ return true;
+ }
+ clientXLast = e.clientX;
+
+ // Move handle.
+ var zoomHandleStatus = self.getZoomHandleStatus_();
+ var newPos;
+ if (handle == self.leftZoomHandle_) {
+ newPos = zoomHandleStatus.leftHandlePos + delX;
+ newPos = Math.min(newPos, zoomHandleStatus.rightHandlePos - handle.width - 3);
+ newPos = Math.max(newPos, self.canvasRect_.x);
+ } else {
+ newPos = zoomHandleStatus.rightHandlePos + delX;
+ newPos = Math.min(newPos, self.canvasRect_.x + self.canvasRect_.w);
+ newPos = Math.max(newPos, zoomHandleStatus.leftHandlePos + handle.width + 3);
+ }
+ var halfHandleWidth = handle.width/2;
+ handle.style.left = (newPos - halfHandleWidth) + 'px';
+ self.drawInteractiveLayer_();
+
+ // Zoom on the fly (if not using excanvas).
+ if (dynamic) {
+ doZoom();
+ }
+ return true;
+ };
+
+ onZoomEnd = function(e) {
+ if (!isZooming) {
+ return false;
+ }
+ isZooming = false;
+ tarp.uncover();
+ Dygraph.removeEvent(topElem, 'mousemove', onZoom);
+ Dygraph.removeEvent(topElem, 'mouseup', onZoomEnd);
+ self.fgcanvas_.style.cursor = 'default';
+
+ // If using excanvas, Zoom now.
+ if (!dynamic) {
+ doZoom();
+ }
+ return true;
+ };
+
+ doZoom = function() {
+ try {
+ var zoomHandleStatus = self.getZoomHandleStatus_();
+ self.isChangingRange_ = true;
+ if (!zoomHandleStatus.isZoomed) {
+ self.dygraph_.resetZoom();
+ } else {
+ var xDataWindow = toXDataWindow(zoomHandleStatus);
+ self.dygraph_.doZoomXDates_(xDataWindow[0], xDataWindow[1]);
+ }
+ } finally {
+ self.isChangingRange_ = false;
+ }
+ };
+
+ isMouseInPanZone = function(e) {
+ if (self.isUsingExcanvas_) {
+ return e.srcElement == self.iePanOverlay_;
+ } else {
+ var rect = self.leftZoomHandle_.getBoundingClientRect();
+ var leftHandleClientX = rect.left + rect.width/2;
+ rect = self.rightZoomHandle_.getBoundingClientRect();
+ var rightHandleClientX = rect.left + rect.width/2;
+ return (e.clientX > leftHandleClientX && e.clientX < rightHandleClientX);
+ }
+ };
+
+ onPanStart = function(e) {
+ if (!isPanning && isMouseInPanZone(e) && self.getZoomHandleStatus_().isZoomed) {
+ Dygraph.cancelEvent(e);
+ isPanning = true;
+ clientXLast = e.clientX;
+ if (e.type === 'mousedown') {
+ // These events are removed manually.
+ Dygraph.addEvent(topElem, 'mousemove', onPan);
+ Dygraph.addEvent(topElem, 'mouseup', onPanEnd);
+ }
+ return true;
+ }
+ return false;
+ };
+
+ onPan = function(e) {
+ if (!isPanning) {
+ return false;
+ }
+ Dygraph.cancelEvent(e);
+
+ var delX = e.clientX - clientXLast;
+ if (Math.abs(delX) < 4) {
+ return true;
+ }
+ clientXLast = e.clientX;
+
+ // Move range view
+ var zoomHandleStatus = self.getZoomHandleStatus_();
+ var leftHandlePos = zoomHandleStatus.leftHandlePos;
+ var rightHandlePos = zoomHandleStatus.rightHandlePos;
+ var rangeSize = rightHandlePos - leftHandlePos;
+ if (leftHandlePos + delX <= self.canvasRect_.x) {
+ leftHandlePos = self.canvasRect_.x;
+ rightHandlePos = leftHandlePos + rangeSize;
+ } else if (rightHandlePos + delX >= self.canvasRect_.x + self.canvasRect_.w) {
+ rightHandlePos = self.canvasRect_.x + self.canvasRect_.w;
+ leftHandlePos = rightHandlePos - rangeSize;
+ } else {
+ leftHandlePos += delX;
+ rightHandlePos += delX;
+ }
+ var halfHandleWidth = self.leftZoomHandle_.width/2;
+ self.leftZoomHandle_.style.left = (leftHandlePos - halfHandleWidth) + 'px';
+ self.rightZoomHandle_.style.left = (rightHandlePos - halfHandleWidth) + 'px';
+ self.drawInteractiveLayer_();
+
+ // Do pan on the fly (if not using excanvas).
+ if (dynamic) {
+ doPan();
+ }
+ return true;
+ };
+
+ onPanEnd = function(e) {
+ if (!isPanning) {
+ return false;
+ }
+ isPanning = false;
+ Dygraph.removeEvent(topElem, 'mousemove', onPan);
+ Dygraph.removeEvent(topElem, 'mouseup', onPanEnd);
+ // If using excanvas, do pan now.
+ if (!dynamic) {
+ doPan();
+ }
+ return true;
+ };
+
+ doPan = function() {
+ try {
+ self.isChangingRange_ = true;
+ self.dygraph_.dateWindow_ = toXDataWindow(self.getZoomHandleStatus_());
+ self.dygraph_.drawGraph_(false);
+ } finally {
+ self.isChangingRange_ = false;
+ }
+ };
+
+ onCanvasHover = function(e) {
+ if (isZooming || isPanning) {
+ return;
+ }
+ var cursor = isMouseInPanZone(e) ? 'move' : 'default';
+ if (cursor != self.fgcanvas_.style.cursor) {
+ self.fgcanvas_.style.cursor = cursor;
+ }
+ };
+
+ onZoomHandleTouchEvent = function(e) {
+ if (e.type == 'touchstart' && e.targetTouches.length == 1) {
+ if (onZoomStart(e.targetTouches[0])) {
+ Dygraph.cancelEvent(e);
+ }
+ } else if (e.type == 'touchmove' && e.targetTouches.length == 1) {
+ if (onZoom(e.targetTouches[0])) {
+ Dygraph.cancelEvent(e);
+ }
+ } else {
+ onZoomEnd(e);
+ }
+ };
+
+ onCanvasTouchEvent = function(e) {
+ if (e.type == 'touchstart' && e.targetTouches.length == 1) {
+ if (onPanStart(e.targetTouches[0])) {
+ Dygraph.cancelEvent(e);
+ }
+ } else if (e.type == 'touchmove' && e.targetTouches.length == 1) {
+ if (onPan(e.targetTouches[0])) {
+ Dygraph.cancelEvent(e);
+ }
+ } else {
+ onPanEnd(e);
+ }
+ };
+
+ addTouchEvents = function(elem, fn) {
+ var types = ['touchstart', 'touchend', 'touchmove', 'touchcancel'];
+ for (var i = 0; i < types.length; i++) {
+ self.dygraph_.addAndTrackEvent(elem, types[i], fn);
+ }
+ };
+
+ this.setDefaultOption_('interactionModel', Dygraph.Interaction.dragIsPanInteractionModel);
+ this.setDefaultOption_('panEdgeFraction', 0.0001);
+
+ var dragStartEvent = window.opera ? 'mousedown' : 'dragstart';
+ this.dygraph_.addAndTrackEvent(this.leftZoomHandle_, dragStartEvent, onZoomStart);
+ this.dygraph_.addAndTrackEvent(this.rightZoomHandle_, dragStartEvent, onZoomStart);
+
+ if (this.isUsingExcanvas_) {
+ this.dygraph_.addAndTrackEvent(this.iePanOverlay_, 'mousedown', onPanStart);
+ } else {
+ this.dygraph_.addAndTrackEvent(this.fgcanvas_, 'mousedown', onPanStart);
+ this.dygraph_.addAndTrackEvent(this.fgcanvas_, 'mousemove', onCanvasHover);
+ }
+
+ // Touch events
+ if (this.hasTouchInterface_) {
+ addTouchEvents(this.leftZoomHandle_, onZoomHandleTouchEvent);
+ addTouchEvents(this.rightZoomHandle_, onZoomHandleTouchEvent);
+ addTouchEvents(this.fgcanvas_, onCanvasTouchEvent);
+ }
+};
+
+/**
+ * @private
+ * Draws the static layer in the background canvas.
+ */
+rangeSelector.prototype.drawStaticLayer_ = function() {
+ var ctx = this.bgcanvas_ctx_;
+ ctx.clearRect(0, 0, this.canvasRect_.w, this.canvasRect_.h);
+ try {
+ this.drawMiniPlot_();
+ } catch(ex) {
+ console.warn(ex);
+ }
+
+ var margin = 0.5;
+ this.bgcanvas_ctx_.lineWidth = 1;
+ ctx.strokeStyle = 'gray';
+ ctx.beginPath();
+ ctx.moveTo(margin, margin);
+ ctx.lineTo(margin, this.canvasRect_.h-margin);
+ ctx.lineTo(this.canvasRect_.w-margin, this.canvasRect_.h-margin);
+ ctx.lineTo(this.canvasRect_.w-margin, margin);
+ ctx.stroke();
+};
+
+
+/**
+ * @private
+ * Draws the mini plot in the background canvas.
+ */
+rangeSelector.prototype.drawMiniPlot_ = function() {
+ var fillStyle = this.getOption_('rangeSelectorPlotFillColor');
+ var strokeStyle = this.getOption_('rangeSelectorPlotStrokeColor');
+ if (!fillStyle && !strokeStyle) {
+ return;
+ }
+
+ var stepPlot = this.getOption_('stepPlot');
+
+ var combinedSeriesData = this.computeCombinedSeriesAndLimits_();
+ var yRange = combinedSeriesData.yMax - combinedSeriesData.yMin;
+
+ // Draw the mini plot.
+ var ctx = this.bgcanvas_ctx_;
+ var margin = 0.5;
+
+ var xExtremes = this.dygraph_.xAxisExtremes();
+ var xRange = Math.max(xExtremes[1] - xExtremes[0], 1.e-30);
+ var xFact = (this.canvasRect_.w - margin)/xRange;
+ var yFact = (this.canvasRect_.h - margin)/yRange;
+ var canvasWidth = this.canvasRect_.w - margin;
+ var canvasHeight = this.canvasRect_.h - margin;
+
+ var prevX = null, prevY = null;
+
+ ctx.beginPath();
+ ctx.moveTo(margin, canvasHeight);
+ for (var i = 0; i < combinedSeriesData.data.length; i++) {
+ var dataPoint = combinedSeriesData.data[i];
+ var x = ((dataPoint[0] !== null) ? ((dataPoint[0] - xExtremes[0])*xFact) : NaN);
+ var y = ((dataPoint[1] !== null) ? (canvasHeight - (dataPoint[1] - combinedSeriesData.yMin)*yFact) : NaN);
+
+ // Skip points that don't change the x-value. Overly fine-grained points
+ // can cause major slowdowns with the ctx.fill() call below.
+ if (!stepPlot && prevX !== null && Math.round(x) == Math.round(prevX)) {
+ continue;
+ }
+
+ if (isFinite(x) && isFinite(y)) {
+ if(prevX === null) {
+ ctx.lineTo(x, canvasHeight);
+ }
+ else if (stepPlot) {
+ ctx.lineTo(x, prevY);
+ }
+ ctx.lineTo(x, y);
+ prevX = x;
+ prevY = y;
+ }
+ else {
+ if(prevX !== null) {
+ if (stepPlot) {
+ ctx.lineTo(x, prevY);
+ ctx.lineTo(x, canvasHeight);
+ }
+ else {
+ ctx.lineTo(prevX, canvasHeight);
+ }
+ }
+ prevX = prevY = null;
+ }
+ }
+ ctx.lineTo(canvasWidth, canvasHeight);
+ ctx.closePath();
+
+ if (fillStyle) {
+ var lingrad = this.bgcanvas_ctx_.createLinearGradient(0, 0, 0, canvasHeight);
+ lingrad.addColorStop(0, 'white');
+ lingrad.addColorStop(1, fillStyle);
+ this.bgcanvas_ctx_.fillStyle = lingrad;
+ ctx.fill();
+ }
+
+ if (strokeStyle) {
+ this.bgcanvas_ctx_.strokeStyle = strokeStyle;
+ this.bgcanvas_ctx_.lineWidth = 1.5;
+ ctx.stroke();
+ }
+};
+
+/**
+ * @private
+ * Computes and returns the combined series data along with min/max for the mini plot.
+ * The combined series consists of averaged values for all series.
+ * When series have error bars, the error bars are ignored.
+ * @return {Object} An object containing combined series array, ymin, ymax.
+ */
+rangeSelector.prototype.computeCombinedSeriesAndLimits_ = function() {
+ var g = this.dygraph_;
+ var logscale = this.getOption_('logscale');
+ var i;
+
+ // Select series to combine. By default, all series are combined.
+ var numColumns = g.numColumns();
+ var labels = g.getLabels();
+ var includeSeries = new Array(numColumns);
+ var anySet = false;
+ for (i = 1; i < numColumns; i++) {
+ var include = this.getOption_('showInRangeSelector', labels[i]);
+ includeSeries[i] = include;
+ if (include !== null) anySet = true; // it's set explicitly for this series
+ }
+ if (!anySet) {
+ for (i = 0; i < includeSeries.length; i++) includeSeries[i] = true;
+ }
+
+ // Create a combined series (average of selected series values).
+ // TODO(danvk): short-circuit if there's only one series.
+ var rolledSeries = [];
+ var dataHandler = g.dataHandler_;
+ var options = g.attributes_;
+ for (i = 1; i < g.numColumns(); i++) {
+ if (!includeSeries[i]) continue;
+ var series = dataHandler.extractSeries(g.rawData_, i, options);
+ if (g.rollPeriod() > 1) {
+ series = dataHandler.rollingAverage(series, g.rollPeriod(), options);
+ }
+
+ rolledSeries.push(series);
+ }
+
+ var combinedSeries = [];
+ for (i = 0; i < rolledSeries[0].length; i++) {
+ var sum = 0;
+ var count = 0;
+ for (var j = 0; j < rolledSeries.length; j++) {
+ var y = rolledSeries[j][i][1];
+ if (y === null || isNaN(y)) continue;
+ count++;
+ sum += y;
+ }
+ combinedSeries.push([rolledSeries[0][i][0], sum / count]);
+ }
+
+ // Compute the y range.
+ var yMin = Number.MAX_VALUE;
+ var yMax = -Number.MAX_VALUE;
+ for (i = 0; i < combinedSeries.length; i++) {
+ var yVal = combinedSeries[i][1];
+ if (yVal !== null && isFinite(yVal) && (!logscale || yVal > 0)) {
+ yMin = Math.min(yMin, yVal);
+ yMax = Math.max(yMax, yVal);
+ }
+ }
+
+ // Convert Y data to log scale if needed.
+ // Also, expand the Y range to compress the mini plot a little.
+ var extraPercent = 0.25;
+ if (logscale) {
+ yMax = Dygraph.log10(yMax);
+ yMax += yMax*extraPercent;
+ yMin = Dygraph.log10(yMin);
+ for (i = 0; i < combinedSeries.length; i++) {
+ combinedSeries[i][1] = Dygraph.log10(combinedSeries[i][1]);
+ }
+ } else {
+ var yExtra;
+ var yRange = yMax - yMin;
+ if (yRange <= Number.MIN_VALUE) {
+ yExtra = yMax*extraPercent;
+ } else {
+ yExtra = yRange*extraPercent;
+ }
+ yMax += yExtra;
+ yMin -= yExtra;
+ }
+
+ return {data: combinedSeries, yMin: yMin, yMax: yMax};
+};
+
+/**
+ * @private
+ * Places the zoom handles in the proper position based on the current X data window.
+ */
+rangeSelector.prototype.placeZoomHandles_ = function() {
+ var xExtremes = this.dygraph_.xAxisExtremes();
+ var xWindowLimits = this.dygraph_.xAxisRange();
+ var xRange = xExtremes[1] - xExtremes[0];
+ var leftPercent = Math.max(0, (xWindowLimits[0] - xExtremes[0])/xRange);
+ var rightPercent = Math.max(0, (xExtremes[1] - xWindowLimits[1])/xRange);
+ var leftCoord = this.canvasRect_.x + this.canvasRect_.w*leftPercent;
+ var rightCoord = this.canvasRect_.x + this.canvasRect_.w*(1 - rightPercent);
+ var handleTop = Math.max(this.canvasRect_.y, this.canvasRect_.y + (this.canvasRect_.h - this.leftZoomHandle_.height)/2);
+ var halfHandleWidth = this.leftZoomHandle_.width/2;
+ this.leftZoomHandle_.style.left = (leftCoord - halfHandleWidth) + 'px';
+ this.leftZoomHandle_.style.top = handleTop + 'px';
+ this.rightZoomHandle_.style.left = (rightCoord - halfHandleWidth) + 'px';
+ this.rightZoomHandle_.style.top = this.leftZoomHandle_.style.top;
+
+ this.leftZoomHandle_.style.visibility = 'visible';
+ this.rightZoomHandle_.style.visibility = 'visible';
+};
+
+/**
+ * @private
+ * Draws the interactive layer in the foreground canvas.
+ */
+rangeSelector.prototype.drawInteractiveLayer_ = function() {
+ var ctx = this.fgcanvas_ctx_;
+ ctx.clearRect(0, 0, this.canvasRect_.w, this.canvasRect_.h);
+ var margin = 1;
+ var width = this.canvasRect_.w - margin;
+ var height = this.canvasRect_.h - margin;
+ var zoomHandleStatus = this.getZoomHandleStatus_();
+
+ ctx.strokeStyle = 'black';
+ if (!zoomHandleStatus.isZoomed) {
+ ctx.beginPath();
+ ctx.moveTo(margin, margin);
+ ctx.lineTo(margin, height);
+ ctx.lineTo(width, height);
+ ctx.lineTo(width, margin);
+ ctx.stroke();
+ if (this.iePanOverlay_) {
+ this.iePanOverlay_.style.display = 'none';
+ }
+ } else {
+ var leftHandleCanvasPos = Math.max(margin, zoomHandleStatus.leftHandlePos - this.canvasRect_.x);
+ var rightHandleCanvasPos = Math.min(width, zoomHandleStatus.rightHandlePos - this.canvasRect_.x);
+
+ ctx.fillStyle = 'rgba(240, 240, 240, 0.6)';
+ ctx.fillRect(0, 0, leftHandleCanvasPos, this.canvasRect_.h);
+ ctx.fillRect(rightHandleCanvasPos, 0, this.canvasRect_.w - rightHandleCanvasPos, this.canvasRect_.h);
+
+ ctx.beginPath();
+ ctx.moveTo(margin, margin);
+ ctx.lineTo(leftHandleCanvasPos, margin);
+ ctx.lineTo(leftHandleCanvasPos, height);
+ ctx.lineTo(rightHandleCanvasPos, height);
+ ctx.lineTo(rightHandleCanvasPos, margin);
+ ctx.lineTo(width, margin);
+ ctx.stroke();
+
+ if (this.isUsingExcanvas_) {
+ this.iePanOverlay_.style.width = (rightHandleCanvasPos - leftHandleCanvasPos) + 'px';
+ this.iePanOverlay_.style.left = leftHandleCanvasPos + 'px';
+ this.iePanOverlay_.style.height = height + 'px';
+ this.iePanOverlay_.style.display = 'inline';
+ }
+ }
+};
+
+/**
+ * @private
+ * Returns the current zoom handle position information.
+ * @return {Object} The zoom handle status.
+ */
+rangeSelector.prototype.getZoomHandleStatus_ = function() {
+ var halfHandleWidth = this.leftZoomHandle_.width/2;
+ var leftHandlePos = parseFloat(this.leftZoomHandle_.style.left) + halfHandleWidth;
+ var rightHandlePos = parseFloat(this.rightZoomHandle_.style.left) + halfHandleWidth;
+ return {
+ leftHandlePos: leftHandlePos,
+ rightHandlePos: rightHandlePos,
+ isZoomed: (leftHandlePos - 1 > this.canvasRect_.x || rightHandlePos + 1 < this.canvasRect_.x+this.canvasRect_.w)
+ };
+};
+
+return rangeSelector;
+
+})();
+/*global Dygraph:false */
+
+// This file defines the ordering of the plugins.
+//
+// The ordering is from most-general to most-specific.
+// This means that, in an event cascade, plugins which have registered for that
+// event will be called in reverse order.
+//
+// This is most relevant for plugins which register a layout event, e.g.
+// Axes, Legend and ChartLabels.
+
+Dygraph.PLUGINS.push(
+ Dygraph.Plugins.Legend,
+ Dygraph.Plugins.Axes,
+ Dygraph.Plugins.RangeSelector, // Has to be before ChartLabels so that its callbacks are called after ChartLabels' callbacks.
+ Dygraph.Plugins.ChartLabels,
+ Dygraph.Plugins.Annotations,
+ Dygraph.Plugins.Grid
+);
+/**
+ * @license
+ * Copyright 2013 David Eberlein (david.eberlein@ch.sauter-bc.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+
+/**
+ * @fileoverview This file contains the managment of data handlers
+ * @author David Eberlein (david.eberlein@ch.sauter-bc.com)
+ *
+ * The idea is to define a common, generic data format that works for all data
+ * structures supported by dygraphs. To make this possible, the DataHandler
+ * interface is introduced. This makes it possible, that dygraph itself can work
+ * with the same logic for every data type independent of the actual format and
+ * the DataHandler takes care of the data format specific jobs.
+ * DataHandlers are implemented for all data types supported by Dygraphs and
+ * return Dygraphs compliant formats.
+ * By default the correct DataHandler is chosen based on the options set.
+ * Optionally the user may use his own DataHandler (similar to the plugin
+ * system).
+ *
+ *
+ * The unified data format returend by each handler is defined as so:
+ * series[n][point] = [x,y,(extras)]
+ *
+ * This format contains the common basis that is needed to draw a simple line
+ * series extended by optional extras for more complex graphing types. It
+ * contains a primitive x value as first array entry, a primitive y value as
+ * second array entry and an optional extras object for additional data needed.
+ *
+ * x must always be a number.
+ * y must always be a number, NaN of type number or null.
+ * extras is optional and must be interpreted by the DataHandler. It may be of
+ * any type.
+ *
+ * In practice this might look something like this:
+ * default: [x, yVal]
+ * errorBar / customBar: [x, yVal, [yTopVariance, yBottomVariance] ]
+ *
+ */
+/*global Dygraph:false */
+/*global DygraphLayout:false */
+
+/**
+ *
+ * The data handler is responsible for all data specific operations. All of the
+ * series data it receives and returns is always in the unified data format.
+ * Initially the unified data is created by the extractSeries method
+ * @constructor
+ */
+Dygraph.DataHandler = function () {
+};
+
+/**
+ * A collection of functions to create and retrieve data handlers.
+ * @type {Object.<!Dygraph.DataHandler>}
+ */
+Dygraph.DataHandlers = {};
+
+(function() {
+
+"use strict";
+
+var handler = Dygraph.DataHandler;
+
+/**
+ * X-value array index constant for unified data samples.
+ * @const
+ * @type {number}
+ */
+handler.X = 0;
+
+/**
+ * Y-value array index constant for unified data samples.
+ * @const
+ * @type {number}
+ */
+handler.Y = 1;
+
+/**
+ * Extras-value array index constant for unified data samples.
+ * @const
+ * @type {number}
+ */
+handler.EXTRAS = 2;
+
+/**
+ * Extracts one series from the raw data (a 2D array) into an array of the
+ * unified data format.
+ * This is where undesirable points (i.e. negative values on log scales and
+ * missing values through which we wish to connect lines) are dropped.
+ * TODO(danvk): the "missing values" bit above doesn't seem right.
+ *
+ * @param {!Array.<Array>} rawData The raw data passed into dygraphs where
+ * rawData[i] = [x,ySeries1,...,ySeriesN].
+ * @param {!number} seriesIndex Index of the series to extract. All other
+ * series should be ignored.
+ * @param {!DygraphOptions} options Dygraph options.
+ * @return {Array.<[!number,?number,?]>} The series in the unified data format
+ * where series[i] = [x,y,{extras}].
+ */
+handler.prototype.extractSeries = function(rawData, seriesIndex, options) {
+};
+
+/**
+ * Converts a series to a Point array. The resulting point array must be
+ * returned in increasing order of idx property.
+ *
+ * @param {!Array.<[!number,?number,?]>} series The series in the unified
+ * data format where series[i] = [x,y,{extras}].
+ * @param {!string} setName Name of the series.
+ * @param {!number} boundaryIdStart Index offset of the first point, equal to the
+ * number of skipped points left of the date window minimum (if any).
+ * @return {!Array.<Dygraph.PointType>} List of points for this series.
+ */
+handler.prototype.seriesToPoints = function(series, setName, boundaryIdStart) {
+ // TODO(bhs): these loops are a hot-spot for high-point-count charts. In
+ // fact,
+ // on chrome+linux, they are 6 times more expensive than iterating through
+ // the
+ // points and drawing the lines. The brunt of the cost comes from allocating
+ // the |point| structures.
+ var points = [];
+ for ( var i = 0; i < series.length; ++i) {
+ var item = series[i];
+ var yraw = item[1];
+ var yval = yraw === null ? null : handler.parseFloat(yraw);
+ var point = {
+ x : NaN,
+ y : NaN,
+ xval : handler.parseFloat(item[0]),
+ yval : yval,
+ name : setName, // TODO(danvk): is this really necessary?
+ idx : i + boundaryIdStart
+ };
+ points.push(point);
+ }
+ this.onPointsCreated_(series, points);
+ return points;
+};
+
+/**
+ * Callback called for each series after the series points have been generated
+ * which will later be used by the plotters to draw the graph.
+ * Here data may be added to the seriesPoints which is needed by the plotters.
+ * The indexes of series and points are in sync meaning the original data
+ * sample for series[i] is points[i].
+ *
+ * @param {!Array.<[!number,?number,?]>} series The series in the unified
+ * data format where series[i] = [x,y,{extras}].
+ * @param {!Array.<Dygraph.PointType>} points The corresponding points passed
+ * to the plotter.
+ * @protected
+ */
+handler.prototype.onPointsCreated_ = function(series, points) {
+};
+
+/**
+ * Calculates the rolling average of a data set.
+ *
+ * @param {!Array.<[!number,?number,?]>} series The series in the unified
+ * data format where series[i] = [x,y,{extras}].
+ * @param {!number} rollPeriod The number of points over which to average the data
+ * @param {!DygraphOptions} options The dygraph options.
+ * @return {!Array.<[!number,?number,?]>} the rolled series.
+ */
+handler.prototype.rollingAverage = function(series, rollPeriod, options) {
+};
+
+/**
+ * Computes the range of the data series (including confidence intervals).
+ *
+ * @param {!Array.<[!number,?number,?]>} series The series in the unified
+ * data format where series[i] = [x, y, {extras}].
+ * @param {!Array.<number>} dateWindow The x-value range to display with
+ * the format: [min, max].
+ * @param {!DygraphOptions} options The dygraph options.
+ * @return {Array.<number>} The low and high extremes of the series in the
+ * given window with the format: [low, high].
+ */
+handler.prototype.getExtremeYValues = function(series, dateWindow, options) {
+};
+
+/**
+ * Callback called for each series after the layouting data has been
+ * calculated before the series is drawn. Here normalized positioning data
+ * should be calculated for the extras of each point.
+ *
+ * @param {!Array.<Dygraph.PointType>} points The points passed to
+ * the plotter.
+ * @param {!Object} axis The axis on which the series will be plotted.
+ * @param {!boolean} logscale Weather or not to use a logscale.
+ */
+handler.prototype.onLineEvaluated = function(points, axis, logscale) {
+};
+
+/**
+ * Helper method that computes the y value of a line defined by the points p1
+ * and p2 and a given x value.
+ *
+ * @param {!Array.<number>} p1 left point ([x,y]).
+ * @param {!Array.<number>} p2 right point ([x,y]).
+ * @param {!number} xValue The x value to compute the y-intersection for.
+ * @return {number} corresponding y value to x on the line defined by p1 and p2.
+ * @private
+ */
+handler.prototype.computeYInterpolation_ = function(p1, p2, xValue) {
+ var deltaY = p2[1] - p1[1];
+ var deltaX = p2[0] - p1[0];
+ var gradient = deltaY / deltaX;
+ var growth = (xValue - p1[0]) * gradient;
+ return p1[1] + growth;
+};
+
+/**
+ * Helper method that returns the first and the last index of the given series
+ * that lie inside the given dateWindow.
+ *
+ * @param {!Array.<[!number,?number,?]>} series The series in the unified
+ * data format where series[i] = [x,y,{extras}].
+ * @param {!Array.<number>} dateWindow The x-value range to display with
+ * the format: [min,max].
+ * @return {!Array.<[!number,?number,?]>} The samples of the series that
+ * are in the given date window.
+ * @private
+ */
+handler.prototype.getIndexesInWindow_ = function(series, dateWindow) {
+ var firstIdx = 0, lastIdx = series.length - 1;
+ if (dateWindow) {
+ var idx = 0;
+ var low = dateWindow[0];
+ var high = dateWindow[1];
+
+ // Start from each side of the array to minimize the performance
+ // needed.
+ while (idx < series.length - 1 && series[idx][0] < low) {
+ firstIdx++;
+ idx++;
+ }
+ idx = series.length - 1;
+ while (idx > 0 && series[idx][0] > high) {
+ lastIdx--;
+ idx--;
+ }
+ }
+ if (firstIdx <= lastIdx) {
+ return [ firstIdx, lastIdx ];
+ } else {
+ return [ 0, series.length - 1 ];
+ }
+};
+
+/**
+ * Optimized replacement for parseFloat, which was way too slow when almost
+ * all values were type number, with few edge cases, none of which were strings.
+ * @param {?number} val
+ * @return {number}
+ * @protected
+ */
+handler.parseFloat = function(val) {
+ // parseFloat(null) is NaN
+ if (val === null) {
+ return NaN;
+ }
+
+ // Assume it's a number or NaN. If it's something else, I'll be shocked.
+ return val;
+};
+
+})();
+/**
+ * @license
+ * Copyright 2013 David Eberlein (david.eberlein@ch.sauter-bc.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+
+/**
+ * @fileoverview DataHandler default implementation used for simple line charts.
+ * @author David Eberlein (david.eberlein@ch.sauter-bc.com)
+ */
+
+(function() {
+
+/*global Dygraph:false */
+"use strict";
+
+/**
+ * @constructor
+ * @extends Dygraph.DataHandler
+ */
+Dygraph.DataHandlers.DefaultHandler = function() {
+};
+
+var DefaultHandler = Dygraph.DataHandlers.DefaultHandler;
+DefaultHandler.prototype = new Dygraph.DataHandler();
+
+/** @inheritDoc */
+DefaultHandler.prototype.extractSeries = function(rawData, i, options) {
+ // TODO(danvk): pre-allocate series here.
+ var series = [];
+ var logScale = options.get('logscale');
+ for ( var j = 0; j < rawData.length; j++) {
+ var x = rawData[j][0];
+ var point = rawData[j][i];
+ if (logScale) {
+ // On the log scale, points less than zero do not exist.
+ // This will create a gap in the chart.
+ if (point <= 0) {
+ point = null;
+ }
+ }
+ series.push([ x, point ]);
+ }
+ return series;
+};
+
+/** @inheritDoc */
+DefaultHandler.prototype.rollingAverage = function(originalData, rollPeriod,
+ options) {
+ rollPeriod = Math.min(rollPeriod, originalData.length);
+ var rollingData = [];
+
+ var i, j, y, sum, num_ok;
+ // Calculate the rolling average for the first rollPeriod - 1 points
+ // where
+ // there is not enough data to roll over the full number of points
+ if (rollPeriod == 1) {
+ return originalData;
+ }
+ for (i = 0; i < originalData.length; i++) {
+ sum = 0;
+ num_ok = 0;
+ for (j = Math.max(0, i - rollPeriod + 1); j < i + 1; j++) {
+ y = originalData[j][1];
+ if (y === null || isNaN(y))
+ continue;
+ num_ok++;
+ sum += originalData[j][1];
+ }
+ if (num_ok) {
+ rollingData[i] = [ originalData[i][0], sum / num_ok ];
+ } else {
+ rollingData[i] = [ originalData[i][0], null ];
+ }
+ }
+
+ return rollingData;
+};
+
+/** @inheritDoc */
+DefaultHandler.prototype.getExtremeYValues = function(series, dateWindow,
+ options) {
+ var minY = null, maxY = null, y;
+ var firstIdx = 0, lastIdx = series.length - 1;
+
+ for ( var j = firstIdx; j <= lastIdx; j++) {
+ y = series[j][1];
+ if (y === null || isNaN(y))
+ continue;
+ if (maxY === null || y > maxY) {
+ maxY = y;
+ }
+ if (minY === null || y < minY) {
+ minY = y;
+ }
+ }
+ return [ minY, maxY ];
+};
+
+})();
+/**
+ * @license
+ * Copyright 2013 David Eberlein (david.eberlein@ch.sauter-bc.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+
+/**
+ * @fileoverview DataHandler implementation for the fractions option.
+ * @author David Eberlein (david.eberlein@ch.sauter-bc.com)
+ */
+
+(function() {
+
+/*global Dygraph:false */
+"use strict";
+
+/**
+ * @extends Dygraph.DataHandlers.DefaultHandler
+ * @constructor
+ */
+Dygraph.DataHandlers.DefaultFractionHandler = function() {
+};
+
+var DefaultFractionHandler = Dygraph.DataHandlers.DefaultFractionHandler;
+DefaultFractionHandler.prototype = new Dygraph.DataHandlers.DefaultHandler();
+
+DefaultFractionHandler.prototype.extractSeries = function(rawData, i, options) {
+ // TODO(danvk): pre-allocate series here.
+ var series = [];
+ var x, y, point, num, den, value;
+ var mult = 100.0;
+ var logScale = options.get('logscale');
+ for ( var j = 0; j < rawData.length; j++) {
+ x = rawData[j][0];
+ point = rawData[j][i];
+ if (logScale && point !== null) {
+ // On the log scale, points less than zero do not exist.
+ // This will create a gap in the chart.
+ if (point[0] <= 0 || point[1] <= 0) {
+ point = null;
+ }
+ }
+ // Extract to the unified data format.
+ if (point !== null) {
+ num = point[0];
+ den = point[1];
+ if (num !== null && !isNaN(num)) {
+ value = den ? num / den : 0.0;
+ y = mult * value;
+ // preserve original values in extras for further filtering
+ series.push([ x, y, [ num, den ] ]);
+ } else {
+ series.push([ x, num, [ num, den ] ]);
+ }
+ } else {
+ series.push([ x, null, [ null, null ] ]);
+ }
+ }
+ return series;
+};
+
+DefaultFractionHandler.prototype.rollingAverage = function(originalData, rollPeriod,
+ options) {
+ rollPeriod = Math.min(rollPeriod, originalData.length);
+ var rollingData = [];
+
+ var i;
+ var num = 0;
+ var den = 0; // numerator/denominator
+ var mult = 100.0;
+ for (i = 0; i < originalData.length; i++) {
+ num += originalData[i][2][0];
+ den += originalData[i][2][1];
+ if (i - rollPeriod >= 0) {
+ num -= originalData[i - rollPeriod][2][0];
+ den -= originalData[i - rollPeriod][2][1];
+ }
+
+ var date = originalData[i][0];
+ var value = den ? num / den : 0.0;
+ rollingData[i] = [ date, mult * value ];
+ }
+
+ return rollingData;
+};
+
+})();
+/**
+ * @license
+ * Copyright 2013 David Eberlein (david.eberlein@ch.sauter-bc.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+
+/**
+ * @fileoverview DataHandler base implementation for the "bar"
+ * data formats. This implementation must be extended and the
+ * extractSeries and rollingAverage must be implemented.
+ * @author David Eberlein (david.eberlein@ch.sauter-bc.com)
+ */
+
+(function() {
+
+/*global Dygraph:false */
+/*global DygraphLayout:false */
+"use strict";
+
+/**
+ * @constructor
+ * @extends {Dygraph.DataHandler}
+ */
+Dygraph.DataHandlers.BarsHandler = function() {
+ Dygraph.DataHandler.call(this);
+};
+Dygraph.DataHandlers.BarsHandler.prototype = new Dygraph.DataHandler();
+
+// alias for the rest of the implementation
+var BarsHandler = Dygraph.DataHandlers.BarsHandler;
+
+// TODO(danvk): figure out why the jsdoc has to be copy/pasted from superclass.
+// (I get closure compiler errors if this isn't here.)
+/**
+ * @override
+ * @param {!Array.<Array>} rawData The raw data passed into dygraphs where
+ * rawData[i] = [x,ySeries1,...,ySeriesN].
+ * @param {!number} seriesIndex Index of the series to extract. All other
+ * series should be ignored.
+ * @param {!DygraphOptions} options Dygraph options.
+ * @return {Array.<[!number,?number,?]>} The series in the unified data format
+ * where series[i] = [x,y,{extras}].
+ */
+BarsHandler.prototype.extractSeries = function(rawData, seriesIndex, options) {
+ // Not implemented here must be extended
+};
+
+/**
+ * @override
+ * @param {!Array.<[!number,?number,?]>} series The series in the unified
+ * data format where series[i] = [x,y,{extras}].
+ * @param {!number} rollPeriod The number of points over which to average the data
+ * @param {!DygraphOptions} options The dygraph options.
+ * TODO(danvk): be more specific than "Array" here.
+ * @return {!Array.<[!number,?number,?]>} the rolled series.
+ */
+BarsHandler.prototype.rollingAverage =
+ function(series, rollPeriod, options) {
+ // Not implemented here, must be extended.
+};
+
+/** @inheritDoc */
+BarsHandler.prototype.onPointsCreated_ = function(series, points) {
+ for (var i = 0; i < series.length; ++i) {
+ var item = series[i];
+ var point = points[i];
+ point.y_top = NaN;
+ point.y_bottom = NaN;
+ point.yval_minus = Dygraph.DataHandler.parseFloat(item[2][0]);
+ point.yval_plus = Dygraph.DataHandler.parseFloat(item[2][1]);
+ }
+};
+
+/** @inheritDoc */
+BarsHandler.prototype.getExtremeYValues = function(series, dateWindow, options) {
+ var minY = null, maxY = null, y;
+
+ var firstIdx = 0;
+ var lastIdx = series.length - 1;
+
+ for ( var j = firstIdx; j <= lastIdx; j++) {
+ y = series[j][1];
+ if (y === null || isNaN(y)) continue;
+
+ var low = series[j][2][0];
+ var high = series[j][2][1];
+
+ if (low > y) low = y; // this can happen with custom bars,
+ if (high < y) high = y; // e.g. in tests/custom-bars.html
+
+ if (maxY === null || high > maxY) maxY = high;
+ if (minY === null || low < minY) minY = low;
+ }
+
+ return [ minY, maxY ];
+};
+
+/** @inheritDoc */
+BarsHandler.prototype.onLineEvaluated = function(points, axis, logscale) {
+ var point;
+ for (var j = 0; j < points.length; j++) {
+ // Copy over the error terms
+ point = points[j];
+ point.y_top = DygraphLayout.calcYNormal_(axis, point.yval_minus, logscale);
+ point.y_bottom = DygraphLayout.calcYNormal_(axis, point.yval_plus, logscale);
+ }
+};
+
+})();
+/**
+ * @license
+ * Copyright 2013 David Eberlein (david.eberlein@ch.sauter-bc.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+
+/**
+ * @fileoverview DataHandler implementation for the custom bars option.
+ * @author David Eberlein (david.eberlein@ch.sauter-bc.com)
+ */
+
+(function() {
+
+/*global Dygraph:false */
+"use strict";
+
+/**
+ * @constructor
+ * @extends Dygraph.DataHandlers.BarsHandler
+ */
+Dygraph.DataHandlers.CustomBarsHandler = function() {
+};
+
+var CustomBarsHandler = Dygraph.DataHandlers.CustomBarsHandler;
+CustomBarsHandler.prototype = new Dygraph.DataHandlers.BarsHandler();
+
+/** @inheritDoc */
+CustomBarsHandler.prototype.extractSeries = function(rawData, i, options) {
+ // TODO(danvk): pre-allocate series here.
+ var series = [];
+ var x, y, point;
+ var logScale = options.get('logscale');
+ for ( var j = 0; j < rawData.length; j++) {
+ x = rawData[j][0];
+ point = rawData[j][i];
+ if (logScale && point !== null) {
+ // On the log scale, points less than zero do not exist.
+ // This will create a gap in the chart.
+ if (point[0] <= 0 || point[1] <= 0 || point[2] <= 0) {
+ point = null;
+ }
+ }
+ // Extract to the unified data format.
+ if (point !== null) {
+ y = point[1];
+ if (y !== null && !isNaN(y)) {
+ series.push([ x, y, [ point[0], point[2] ] ]);
+ } else {
+ series.push([ x, y, [ y, y ] ]);
+ }
+ } else {
+ series.push([ x, null, [ null, null ] ]);
+ }
+ }
+ return series;
+};
+
+/** @inheritDoc */
+CustomBarsHandler.prototype.rollingAverage =
+ function(originalData, rollPeriod, options) {
+ rollPeriod = Math.min(rollPeriod, originalData.length);
+ var rollingData = [];
+ var y, low, high, mid,count, i, extremes;
+
+ low = 0;
+ mid = 0;
+ high = 0;
+ count = 0;
+ for (i = 0; i < originalData.length; i++) {
+ y = originalData[i][1];
+ extremes = originalData[i][2];
+ rollingData[i] = originalData[i];
+
+ if (y !== null && !isNaN(y)) {
+ low += extremes[0];
+ mid += y;
+ high += extremes[1];
+ count += 1;
+ }
+ if (i - rollPeriod >= 0) {
+ var prev = originalData[i - rollPeriod];
+ if (prev[1] !== null && !isNaN(prev[1])) {
+ low -= prev[2][0];
+ mid -= prev[1];
+ high -= prev[2][1];
+ count -= 1;
+ }
+ }
+ if (count) {
+ rollingData[i] = [
+ originalData[i][0],
+ 1.0 * mid / count,
+ [ 1.0 * low / count,
+ 1.0 * high / count ] ];
+ } else {
+ rollingData[i] = [ originalData[i][0], null, [ null, null ] ];
+ }
+ }
+
+ return rollingData;
+};
+
+})();
+/**
+ * @license
+ * Copyright 2013 David Eberlein (david.eberlein@ch.sauter-bc.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+
+/**
+ * @fileoverview DataHandler implementation for the error bars option.
+ * @author David Eberlein (david.eberlein@ch.sauter-bc.com)
+ */
+
+(function() {
+
+/*global Dygraph:false */
+"use strict";
+
+/**
+ * @constructor
+ * @extends Dygraph.DataHandlers.BarsHandler
+ */
+Dygraph.DataHandlers.ErrorBarsHandler = function() {
+};
+
+var ErrorBarsHandler = Dygraph.DataHandlers.ErrorBarsHandler;
+ErrorBarsHandler.prototype = new Dygraph.DataHandlers.BarsHandler();
+
+/** @inheritDoc */
+ErrorBarsHandler.prototype.extractSeries = function(rawData, i, options) {
+ // TODO(danvk): pre-allocate series here.
+ var series = [];
+ var x, y, variance, point;
+ var sigma = options.get("sigma");
+ var logScale = options.get('logscale');
+ for ( var j = 0; j < rawData.length; j++) {
+ x = rawData[j][0];
+ point = rawData[j][i];
+ if (logScale && point !== null) {
+ // On the log scale, points less than zero do not exist.
+ // This will create a gap in the chart.
+ if (point[0] <= 0 || point[0] - sigma * point[1] <= 0) {
+ point = null;
+ }
+ }
+ // Extract to the unified data format.
+ if (point !== null) {
+ y = point[0];
+ if (y !== null && !isNaN(y)) {
+ variance = sigma * point[1];
+ // preserve original error value in extras for further
+ // filtering
+ series.push([ x, y, [ y - variance, y + variance, point[1] ] ]);
+ } else {
+ series.push([ x, y, [ y, y, y ] ]);
+ }
+ } else {
+ series.push([ x, null, [ null, null, null ] ]);
+ }
+ }
+ return series;
+};
+
+/** @inheritDoc */
+ErrorBarsHandler.prototype.rollingAverage =
+ function(originalData, rollPeriod, options) {
+ rollPeriod = Math.min(rollPeriod, originalData.length);
+ var rollingData = [];
+ var sigma = options.get("sigma");
+
+ var i, j, y, v, sum, num_ok, stddev, variance, value;
+
+ // Calculate the rolling average for the first rollPeriod - 1 points
+ // where there is not enough data to roll over the full number of points
+ for (i = 0; i < originalData.length; i++) {
+ sum = 0;
+ variance = 0;
+ num_ok = 0;
+ for (j = Math.max(0, i - rollPeriod + 1); j < i + 1; j++) {
+ y = originalData[j][1];
+ if (y === null || isNaN(y))
+ continue;
+ num_ok++;
+ sum += y;
+ variance += Math.pow(originalData[j][2][2], 2);
+ }
+ if (num_ok) {
+ stddev = Math.sqrt(variance) / num_ok;
+ value = sum / num_ok;
+ rollingData[i] = [ originalData[i][0], value,
+ [value - sigma * stddev, value + sigma * stddev] ];
+ } else {
+ // This explicitly preserves NaNs to aid with "independent
+ // series".
+ // See testRollingAveragePreservesNaNs.
+ v = (rollPeriod == 1) ? originalData[i][1] : null;
+ rollingData[i] = [ originalData[i][0], v, [ v, v ] ];
+ }
+ }
+
+ return rollingData;
+};
+
+})();
+/**
+ * @license
+ * Copyright 2013 David Eberlein (david.eberlein@ch.sauter-bc.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
+
+/**
+ * @fileoverview DataHandler implementation for the combination
+ * of error bars and fractions options.
+ * @author David Eberlein (david.eberlein@ch.sauter-bc.com)
+ */
+
+(function() {
+
+/*global Dygraph:false */
+"use strict";
+
+/**
+ * @constructor
+ * @extends Dygraph.DataHandlers.BarsHandler
+ */
+Dygraph.DataHandlers.FractionsBarsHandler = function() {
+};
+
+var FractionsBarsHandler = Dygraph.DataHandlers.FractionsBarsHandler;
+FractionsBarsHandler.prototype = new Dygraph.DataHandlers.BarsHandler();
+
+/** @inheritDoc */
+FractionsBarsHandler.prototype.extractSeries = function(rawData, i, options) {
+ // TODO(danvk): pre-allocate series here.
+ var series = [];
+ var x, y, point, num, den, value, stddev, variance;
+ var mult = 100.0;
+ var sigma = options.get("sigma");
+ var logScale = options.get('logscale');
+ for ( var j = 0; j < rawData.length; j++) {
+ x = rawData[j][0];
+ point = rawData[j][i];
+ if (logScale && point !== null) {
+ // On the log scale, points less than zero do not exist.
+ // This will create a gap in the chart.
+ if (point[0] <= 0 || point[1] <= 0) {
+ point = null;
+ }
+ }
+ // Extract to the unified data format.
+ if (point !== null) {
+ num = point[0];
+ den = point[1];
+ if (num !== null && !isNaN(num)) {
+ value = den ? num / den : 0.0;
+ stddev = den ? sigma * Math.sqrt(value * (1 - value) / den) : 1.0;
+ variance = mult * stddev;
+ y = mult * value;
+ // preserve original values in extras for further filtering
+ series.push([ x, y, [ y - variance, y + variance, num, den ] ]);
+ } else {
+ series.push([ x, num, [ num, num, num, den ] ]);
+ }
+ } else {
+ series.push([ x, null, [ null, null, null, null ] ]);
+ }
+ }
+ return series;
+};
+
+/** @inheritDoc */
+FractionsBarsHandler.prototype.rollingAverage =
+ function(originalData, rollPeriod, options) {
+ rollPeriod = Math.min(rollPeriod, originalData.length);
+ var rollingData = [];
+ var sigma = options.get("sigma");
+ var wilsonInterval = options.get("wilsonInterval");
+
+ var low, high, i, stddev;
+ var num = 0;
+ var den = 0; // numerator/denominator
+ var mult = 100.0;
+ for (i = 0; i < originalData.length; i++) {
+ num += originalData[i][2][2];
+ den += originalData[i][2][3];
+ if (i - rollPeriod >= 0) {
+ num -= originalData[i - rollPeriod][2][2];
+ den -= originalData[i - rollPeriod][2][3];
+ }
+
+ var date = originalData[i][0];
+ var value = den ? num / den : 0.0;
+ if (wilsonInterval) {
+ // For more details on this confidence interval, see:
+ // http://en.wikipedia.org/wiki/Binomial_confidence_interval
+ if (den) {
+ var p = value < 0 ? 0 : value, n = den;
+ var pm = sigma * Math.sqrt(p * (1 - p) / n + sigma * sigma / (4 * n * n));
+ var denom = 1 + sigma * sigma / den;
+ low = (p + sigma * sigma / (2 * den) - pm) / denom;
+ high = (p + sigma * sigma / (2 * den) + pm) / denom;
+ rollingData[i] = [ date, p * mult,
+ [ low * mult, high * mult ] ];
+ } else {
+ rollingData[i] = [ date, 0, [ 0, 0 ] ];
+ }
+ } else {
+ stddev = den ? sigma * Math.sqrt(value * (1 - value) / den) : 1.0;
+ rollingData[i] = [ date, mult * value,
+ [ mult * (value - stddev), mult * (value + stddev) ] ];
+ }
+ }
+
+ return rollingData;
+};
+
+})();
diff --git a/debian/missing-sources/gauge.coffee b/debian/missing-sources/gauge.coffee
new file mode 100644
index 00000000..0ae4c8da
--- /dev/null
+++ b/debian/missing-sources/gauge.coffee
@@ -0,0 +1,542 @@
+# Request Animation Frame Polyfill
+# CoffeeScript version of http://paulirish.com/2011/requestanimationframe-for-smart-animating/
+do () ->
+ vendors = ['ms', 'moz', 'webkit', 'o']
+ for vendor in vendors
+ if window.requestAnimationFrame
+ break
+ window.requestAnimationFrame = window[vendor + 'RequestAnimationFrame']
+ window.cancelAnimationFrame = window[vendor + 'CancelAnimationFrame'] or window[vendor + 'CancelRequestAnimationFrame']
+
+ browserRequestAnimationFrame = null
+ lastId = 0
+ isCancelled = {}
+
+ if not requestAnimationFrame
+ window.requestAnimationFrame = (callback, element) ->
+ currTime = new Date().getTime()
+ timeToCall = Math.max(0, 16 - (currTime - lastTime))
+ id = window.setTimeout(() ->
+ callback(currTime + timeToCall)
+ , timeToCall)
+ lastTime = currTime + timeToCall
+ return id
+ # This implementation should only be used with the setTimeout()
+ # version of window.requestAnimationFrame().
+ window.cancelAnimationFrame = (id) ->
+ clearTimeout(id)
+ else if not window.cancelAnimationFrame
+ browserRequestAnimationFrame = window.requestAnimationFrame
+ window.requestAnimationFrame = (callback, element) ->
+ myId = ++lastId
+ browserRequestAnimationFrame(() ->
+ if not isCancelled[myId]
+ callback()
+ , element)
+ return myId
+ window.cancelAnimationFrame = (id) ->
+ isCancelled[id] = true
+
+String.prototype.hashCode = () ->
+ hash = 0
+ if this.length == 0
+ return hash
+ for i in [0...this.length]
+ char = this.charCodeAt(i)
+ hash = ((hash << 5) - hash) + char
+ hash = hash & hash # Convert to 32bit integer
+ return hash
+
+secondsToString = (sec) ->
+ hr = Math.floor(sec / 3600)
+ min = Math.floor((sec - (hr * 3600))/60)
+ sec -= ((hr * 3600) + (min * 60))
+ sec += ''
+ min += ''
+ while min.length < 2
+ min = '0' + min
+ while sec.length < 2
+ sec = '0' + sec
+ hr = if hr then hr + ':' else ''
+ return hr + min + ':' + sec
+
+formatNumber = (num) ->
+ return addCommas(num.toFixed(0))
+
+updateObjectValues = (obj1, obj2) ->
+ for own key, val of obj2
+ obj1[key] = val
+ return obj1
+
+mergeObjects = (obj1, obj2) ->
+ out = {}
+ for own key, val of obj1
+ out[key] = val
+ for own key, val of obj2
+ out[key] = val
+ return out
+
+addCommas = (nStr) ->
+ nStr += ''
+ x = nStr.split('.')
+ x1 = x[0]
+ x2 = ''
+ if x.length > 1
+ x2 = '.' + x[1]
+ rgx = /(\d+)(\d{3})/
+ while rgx.test(x1)
+ x1 = x1.replace(rgx, '$1' + ',' + '$2')
+ return x1 + x2
+
+cutHex = (nStr) ->
+ if nStr.charAt(0) == "#"
+ return nStr.substring(1,7)
+ return nStr
+
+class ValueUpdater
+ animationSpeed: 32
+ constructor: (addToAnimationQueue=true, @clear=true) ->
+ if addToAnimationQueue
+ AnimationUpdater.add(@)
+
+ update: (force=false) ->
+ if force or @displayedValue != @value
+ if @ctx and @clear
+ @ctx.clearRect(0, 0, @canvas.width, @canvas.height)
+ diff = @value - @displayedValue
+ if Math.abs(diff / @animationSpeed) <= 0.001
+ @displayedValue = @value
+ else
+ @displayedValue = @displayedValue + diff / @animationSpeed
+ @render()
+ return true
+ return false
+
+class BaseGauge extends ValueUpdater
+ displayScale: 1
+
+ setTextField: (textField) ->
+ @textField = if textField instanceof TextRenderer then textField else new TextRenderer(textField)
+
+ setMinValue: (@minValue, updateStartValue=true) ->
+ if updateStartValue
+ @displayedValue = @minValue
+ for gauge in @gp or []
+ gauge.displayedValue = @minValue
+
+ setOptions: (options=null) ->
+ @options = mergeObjects(@options, options)
+ if @textField
+ @textField.el.style.fontSize = options.fontSize + 'px'
+
+ if @options.angle > .5
+ @gauge.options.angle = .5
+ @configDisplayScale()
+ return @
+
+ configDisplayScale: () ->
+ prevDisplayScale = @displayScale
+
+ if @options.highDpiSupport == false
+ delete @displayScale
+ else
+ devicePixelRatio = window.devicePixelRatio or 1
+ backingStorePixelRatio =
+ @ctx.webkitBackingStorePixelRatio or
+ @ctx.mozBackingStorePixelRatio or
+ @ctx.msBackingStorePixelRatio or
+ @ctx.oBackingStorePixelRatio or
+ @ctx.backingStorePixelRatio or 1
+ @displayScale = devicePixelRatio / backingStorePixelRatio
+
+ if @displayScale != prevDisplayScale
+ width = @canvas.G__width or @canvas.width
+ height = @canvas.G__height or @canvas.height
+ @canvas.width = width * @displayScale
+ @canvas.height = height * @displayScale
+ @canvas.style.width = "#{width}px"
+ @canvas.style.height = "#{height}px"
+ @canvas.G__width = width
+ @canvas.G__height = height
+
+ return @
+
+class TextRenderer
+ constructor: (@el) ->
+
+ # Default behaviour, override to customize rendering
+ render: (gauge) ->
+ @el.innerHTML = formatNumber(gauge.displayedValue)
+
+class AnimatedText extends ValueUpdater
+ displayedValue: 0
+ value: 0
+
+ setVal: (value) ->
+ @value = 1 * value
+
+ constructor: (@elem, @text=false) ->
+ @value = 1 * @elem.innerHTML
+ if @text
+ @value = 0
+ render: () ->
+ if @text
+ textVal = secondsToString(@displayedValue.toFixed(0))
+ else
+ textVal = addCommas(formatNumber(@displayedValue))
+ @elem.innerHTML = textVal
+
+AnimatedTextFactory =
+ create: (objList) ->
+ out = []
+ for elem in objList
+ out.push(new AnimatedText(elem))
+ return out
+
+class GaugePointer extends ValueUpdater
+ displayedValue: 0
+ value: 0
+ options:
+ strokeWidth: 0.035
+ length: 0.1
+ color: "#000000"
+
+ constructor: (@gauge) ->
+ @ctx = @gauge.ctx
+ @canvas = @gauge.canvas
+ super(false, false)
+ @setOptions()
+
+ setOptions: (options=null) ->
+ updateObjectValues(@options, options)
+ @length = @canvas.height * @options.length
+ @strokeWidth = @canvas.height * @options.strokeWidth
+ @maxValue = @gauge.maxValue
+ @minValue = @gauge.minValue
+ @displayedValue = @gauge.minValue
+ @animationSpeed = @gauge.animationSpeed
+ @options.angle = @gauge.options.angle
+
+ render: () ->
+ angle = @gauge.getAngle.call(@, @displayedValue)
+ centerX = @canvas.width / 2
+ centerY = @canvas.height * 0.9
+
+ x = Math.round(centerX + @length * Math.cos(angle))
+ y = Math.round(centerY + @length * Math.sin(angle))
+
+ startX = Math.round(centerX + @strokeWidth * Math.cos(angle - Math.PI/2))
+ startY = Math.round(centerY + @strokeWidth * Math.sin(angle - Math.PI/2))
+
+ endX = Math.round(centerX + @strokeWidth * Math.cos(angle + Math.PI/2))
+ endY = Math.round(centerY + @strokeWidth * Math.sin(angle + Math.PI/2))
+
+ @ctx.fillStyle = @options.color
+ @ctx.beginPath()
+
+ @ctx.arc(centerX, centerY, @strokeWidth, 0, Math.PI*2, true)
+ @ctx.fill()
+
+ @ctx.beginPath()
+ @ctx.moveTo(startX, startY)
+ @ctx.lineTo(x, y)
+ @ctx.lineTo(endX, endY)
+ @ctx.fill()
+
+class Bar
+ constructor: (@elem) ->
+ updateValues: (arrValues) ->
+ @value = arrValues[0]
+ @maxValue = arrValues[1]
+ @avgValue = arrValues[2]
+ @render()
+
+ render: () ->
+ if @textField
+ @textField.text(formatNumber(@value))
+
+ if @maxValue == 0
+ @maxValue = @avgValue * 2
+
+ valPercent = (@value / @maxValue) * 100
+ avgPercent = (@avgValue / @maxValue) * 100
+
+ $(".bar-value", @elem).css({"width": valPercent + "%"})
+ $(".typical-value", @elem).css({"width": avgPercent + "%"})
+
+class Gauge extends BaseGauge
+ elem: null
+ value: [20] # we support multiple pointers
+ maxValue: 80
+ minValue: 0
+ displayedAngle: 0
+ displayedValue: 0
+ lineWidth: 40
+ paddingBottom: 0.1
+ percentColors: null,
+ options:
+ colorStart: "#6fadcf"
+ colorStop: undefined
+ gradientType: 0 # 0 : radial, 1 : linear
+ strokeColor: "#e0e0e0"
+ pointer:
+ length: 0.8
+ strokeWidth: 0.035
+ angle: 0.15
+ lineWidth: 0.44
+ fontSize: 40
+ limitMax: false
+
+ constructor: (@canvas) ->
+ super()
+ @percentColors = null
+ if typeof G_vmlCanvasManager != 'undefined'
+ @canvas = window.G_vmlCanvasManager.initElement(@canvas)
+ @ctx = @canvas.getContext('2d')
+ @gp = [new GaugePointer(@)]
+ @setOptions()
+ @render()
+
+ setOptions: (options=null) ->
+ super(options)
+ @configPercentColors()
+ @lineWidth = @canvas.height * (1 - @paddingBottom) * @options.lineWidth # .2 - .7
+ @radius = @canvas.height * (1 - @paddingBottom) - @lineWidth
+ @ctx.clearRect(0, 0, @canvas.width, @canvas.height)
+ @render()
+ for gauge in @gp
+ gauge.setOptions(@options.pointer)
+ gauge.render()
+ return @
+
+ configPercentColors: () ->
+ @percentColors = null;
+ if (@options.percentColors != undefined)
+ @percentColors = new Array()
+ for i in [0..(@options.percentColors.length-1)]
+ rval = parseInt((cutHex(@options.percentColors[i][1])).substring(0,2),16)
+ gval = parseInt((cutHex(@options.percentColors[i][1])).substring(2,4),16)
+ bval = parseInt((cutHex(@options.percentColors[i][1])).substring(4,6),16)
+ @percentColors[i] = { pct: @options.percentColors[i][0], color: { r: rval, g: gval, b: bval } }
+
+ set: (value) ->
+ @displayedValue = @minValue
+ if not (value instanceof Array)
+ value = [value]
+ # check if we have enough GaugePointers initialized
+ # lazy initialization
+ if value.length > @gp.length
+ for i in [0...(value.length - @gp.length)]
+ @gp.push(new GaugePointer(@))
+
+ # get max value and update pointer(s)
+ i = 0
+ max_hit = false
+
+ for val in value
+ if val > @maxValue
+ @maxValue = @value * 1.1
+ max_hit = true
+ @gp[i].value = val
+ @gp[i++].setOptions({maxValue: @maxValue, angle: @options.angle})
+ @value = value[value.length - 1] # TODO: Span maybe??
+
+ if max_hit
+ unless @options.limitMax
+ AnimationUpdater.run()
+ else
+ AnimationUpdater.run()
+
+ getAngle: (value) ->
+ return (1 + @options.angle) * Math.PI + ((value - @minValue) / (@maxValue - @minValue)) * (1 - @options.angle * 2) * Math.PI
+
+ getColorForPercentage: (pct, grad) ->
+ if pct == 0
+ color = @percentColors[0].color;
+ else
+ color = @percentColors[@percentColors.length - 1].color;
+ for i in [0..(@percentColors.length - 1)]
+ if (pct <= @percentColors[i].pct)
+ if grad == true
+ # Gradually change between colors
+ startColor = @percentColors[i - 1]
+ endColor = @percentColors[i]
+ rangePct = (pct - startColor.pct) / (endColor.pct - startColor.pct) # How far between both colors
+ color = {
+ r: Math.floor(startColor.color.r * (1 - rangePct) + endColor.color.r * rangePct),
+ g: Math.floor(startColor.color.g * (1 - rangePct) + endColor.color.g * rangePct),
+ b: Math.floor(startColor.color.b * (1 - rangePct) + endColor.color.b * rangePct)
+ }
+ else
+ color = @percentColors[i].color
+ break
+ return 'rgb(' + [color.r, color.g, color.b].join(',') + ')'
+
+ getColorForValue: (val, grad) ->
+ pct = (val - @minValue) / (@maxValue - @minValue)
+ return @getColorForPercentage(pct, grad);
+
+ render: () ->
+ # Draw using canvas
+ w = @canvas.width / 2
+ h = @canvas.height * (1 - @paddingBottom)
+ displayedAngle = @getAngle(@displayedValue)
+ if @textField
+ @textField.render(@)
+
+ @ctx.lineCap = "butt"
+ if @options.customFillStyle != undefined
+ fillStyle = @options.customFillStyle(@)
+ else if @percentColors != null
+ fillStyle = @getColorForValue(@displayedValue, true)
+ else if @options.colorStop != undefined
+ if @options.gradientType == 0
+ fillStyle = this.ctx.createRadialGradient(w, h, 9, w, h, 70);
+ else
+ fillStyle = this.ctx.createLinearGradient(0, 0, w, 0);
+ fillStyle.addColorStop(0, @options.colorStart)
+ fillStyle.addColorStop(1, @options.colorStop)
+ else
+ fillStyle = @options.colorStart
+ @ctx.strokeStyle = fillStyle
+
+ @ctx.beginPath()
+ @ctx.arc(w, h, @radius, (1 + @options.angle) * Math.PI, displayedAngle, false)
+ @ctx.lineWidth = @lineWidth
+ @ctx.stroke()
+
+ @ctx.strokeStyle = @options.strokeColor
+ @ctx.beginPath()
+ @ctx.arc(w, h, @radius, displayedAngle, (2 - @options.angle) * Math.PI, false)
+ @ctx.stroke()
+ for gauge in @gp
+ gauge.update(true)
+
+
+class BaseDonut extends BaseGauge
+ lineWidth: 15
+ displayedValue: 0
+ value: 33
+ maxValue: 80
+ minValue: 0
+
+ options:
+ lineWidth: 0.10
+ colorStart: "#6f6ea0"
+ colorStop: "#c0c0db"
+ strokeColor: "#eeeeee"
+ shadowColor: "#d5d5d5"
+ angle: 0.35
+
+ constructor: (@canvas) ->
+ super()
+ if typeof G_vmlCanvasManager != 'undefined'
+ @canvas = window.G_vmlCanvasManager.initElement(@canvas)
+ @ctx = @canvas.getContext('2d')
+ @setOptions()
+ @render()
+
+ getAngle: (value) ->
+ return (1 - @options.angle) * Math.PI + ((value - @minValue) / (@maxValue - @minValue)) * ((2 + @options.angle) - (1 - @options.angle)) * Math.PI
+
+ setOptions: (options=null) ->
+ super(options)
+ @lineWidth = @canvas.height * @options.lineWidth
+ @radius = @canvas.height / 2 - @lineWidth/2
+ return @
+
+ set: (value) ->
+ @value = value
+ if @value > @maxValue
+ @maxValue = @value * 1.1
+ AnimationUpdater.run()
+
+ render: () ->
+ displayedAngle = @getAngle(@displayedValue)
+ w = @canvas.width / 2
+ h = @canvas.height / 2
+
+ if @textField
+ @textField.render(@)
+
+ grdFill = @ctx.createRadialGradient(w, h, 39, w, h, 70)
+ grdFill.addColorStop(0, @options.colorStart)
+ grdFill.addColorStop(1, @options.colorStop)
+
+ start = @radius - @lineWidth / 2
+ stop = @radius + @lineWidth / 2
+
+ @ctx.strokeStyle = @options.strokeColor
+ @ctx.beginPath()
+ @ctx.arc(w, h, @radius, (1 - @options.angle) * Math.PI, (2 + @options.angle) * Math.PI, false)
+ @ctx.lineWidth = @lineWidth
+ @ctx.lineCap = "round"
+ @ctx.stroke()
+
+ @ctx.strokeStyle = grdFill
+ @ctx.beginPath()
+ @ctx.arc(w, h, @radius, (1 - @options.angle) * Math.PI, displayedAngle, false)
+ @ctx.stroke()
+
+
+class Donut extends BaseDonut
+ strokeGradient: (w, h, start, stop) ->
+ grd = @ctx.createRadialGradient(w, h, start, w, h, stop)
+ grd.addColorStop(0, @options.shadowColor)
+ grd.addColorStop(0.12, @options._orgStrokeColor)
+ grd.addColorStop(0.88, @options._orgStrokeColor)
+ grd.addColorStop(1, @options.shadowColor)
+ return grd
+
+ setOptions: (options=null) ->
+ super(options)
+ w = @canvas.width / 2
+ h = @canvas.height / 2
+ start = @radius - @lineWidth / 2
+ stop = @radius + @lineWidth / 2
+ @options._orgStrokeColor = @options.strokeColor
+ @options.strokeColor = @strokeGradient(w, h, start, stop)
+ return @
+
+window.AnimationUpdater =
+ elements: []
+ animId: null
+
+ addAll: (list) ->
+ for elem in list
+ AnimationUpdater.elements.push(elem)
+
+ add: (object) ->
+ AnimationUpdater.elements.push(object)
+
+ run: () ->
+ animationFinished = true
+ for elem in AnimationUpdater.elements
+ if elem.update()
+ animationFinished = false
+ if not animationFinished
+ AnimationUpdater.animId = requestAnimationFrame(AnimationUpdater.run)
+ else
+ cancelAnimationFrame(AnimationUpdater.animId)
+
+if typeof window.define == 'function' && window.define.amd?
+ define(() ->
+ {
+ Gauge: Gauge,
+ Donut: Donut,
+ BaseDonut: BaseDonut,
+ TextRenderer: TextRenderer
+ }
+ )
+else if typeof module != 'undefined' && module.exports?
+ module.exports = {
+ Gauge: Gauge,
+ Donut: Donut,
+ BaseDonut: BaseDonut,
+ TextRenderer: TextRenderer
+ }
+else
+ window.Gauge = Gauge
+ window.Donut = Donut
+ window.BaseDonut = BaseDonut
+ window.TextRenderer = TextRenderer
diff --git a/debian/missing-sources/jquery.easypiechart.js b/debian/missing-sources/jquery.easypiechart.js
new file mode 100644
index 00000000..5ac3dc1b
--- /dev/null
+++ b/debian/missing-sources/jquery.easypiechart.js
@@ -0,0 +1,364 @@
+/**!
+ * easy-pie-chart
+ * Lightweight plugin to render simple, animated and retina optimized pie charts
+ *
+ * @license
+ * @author Robert Fleischmann <rendro87@gmail.com> (http://robert-fleischmann.de)
+ * @version 2.1.7
+ **/
+
+(function (root, factory) {
+ if (typeof define === 'function' && define.amd) {
+ // AMD. Register as an anonymous module unless amdModuleId is set
+ define(["jquery"], function (a0) {
+ return (factory(a0));
+ });
+ } else if (typeof exports === 'object') {
+ // Node. Does not work with strict CommonJS, but
+ // only CommonJS-like environments that support module.exports,
+ // like Node.
+ module.exports = factory(require("jquery"));
+ } else {
+ factory(jQuery);
+ }
+}(this, function ($) {
+
+/**
+ * Renderer to render the chart on a canvas object
+ * @param {DOMElement} el DOM element to host the canvas (root of the plugin)
+ * @param {object} options options object of the plugin
+ */
+var CanvasRenderer = function(el, options) {
+ var cachedBackground;
+ var canvas = document.createElement('canvas');
+
+ el.appendChild(canvas);
+
+ if (typeof(G_vmlCanvasManager) === 'object') {
+ G_vmlCanvasManager.initElement(canvas);
+ }
+
+ var ctx = canvas.getContext('2d');
+
+ canvas.width = canvas.height = options.size;
+
+ // canvas on retina devices
+ var scaleBy = 1;
+ if (window.devicePixelRatio > 1) {
+ scaleBy = window.devicePixelRatio;
+ canvas.style.width = canvas.style.height = [options.size, 'px'].join('');
+ canvas.width = canvas.height = options.size * scaleBy;
+ ctx.scale(scaleBy, scaleBy);
+ }
+
+ // move 0,0 coordinates to the center
+ ctx.translate(options.size / 2, options.size / 2);
+
+ // rotate canvas -90deg
+ ctx.rotate((-1 / 2 + options.rotate / 180) * Math.PI);
+
+ var radius = (options.size - options.lineWidth) / 2;
+ if (options.scaleColor && options.scaleLength) {
+ radius -= options.scaleLength + 2; // 2 is the distance between scale and bar
+ }
+
+ // IE polyfill for Date
+ Date.now = Date.now || function() {
+ return +(new Date());
+ };
+
+ /**
+ * Draw a circle around the center of the canvas
+ * @param {strong} color Valid CSS color string
+ * @param {number} lineWidth Width of the line in px
+ * @param {number} percent Percentage to draw (float between -1 and 1)
+ */
+ var drawCircle = function(color, lineWidth, percent) {
+ percent = Math.min(Math.max(-1, percent || 0), 1);
+ var isNegative = percent <= 0 ? true : false;
+
+ ctx.beginPath();
+ ctx.arc(0, 0, radius, 0, Math.PI * 2 * percent, isNegative);
+
+ ctx.strokeStyle = color;
+ ctx.lineWidth = lineWidth;
+
+ ctx.stroke();
+ };
+
+ /**
+ * Draw the scale of the chart
+ */
+ var drawScale = function() {
+ var offset;
+ var length;
+
+ ctx.lineWidth = 1;
+ ctx.fillStyle = options.scaleColor;
+
+ ctx.save();
+ for (var i = 24; i > 0; --i) {
+ if (i % 6 === 0) {
+ length = options.scaleLength;
+ offset = 0;
+ } else {
+ length = options.scaleLength * 0.6;
+ offset = options.scaleLength - length;
+ }
+ ctx.fillRect(-options.size/2 + offset, 0, length, 1);
+ ctx.rotate(Math.PI / 12);
+ }
+ ctx.restore();
+ };
+
+ /**
+ * Request animation frame wrapper with polyfill
+ * @return {function} Request animation frame method or timeout fallback
+ */
+ var reqAnimationFrame = (function() {
+ return window.requestAnimationFrame ||
+ window.webkitRequestAnimationFrame ||
+ window.mozRequestAnimationFrame ||
+ function(callback) {
+ window.setTimeout(callback, 1000 / 60);
+ };
+ }());
+
+ /**
+ * Draw the background of the plugin including the scale and the track
+ */
+ var drawBackground = function() {
+ if(options.scaleColor) drawScale();
+ if(options.trackColor) drawCircle(options.trackColor, options.trackWidth || options.lineWidth, 1);
+ };
+
+ /**
+ * Canvas accessor
+ */
+ this.getCanvas = function() {
+ return canvas;
+ };
+
+ /**
+ * Canvas 2D context 'ctx' accessor
+ */
+ this.getCtx = function() {
+ return ctx;
+ };
+
+ /**
+ * Clear the complete canvas
+ */
+ this.clear = function() {
+ ctx.clearRect(options.size / -2, options.size / -2, options.size, options.size);
+ };
+
+ /**
+ * Draw the complete chart
+ * @param {number} percent Percent shown by the chart between -100 and 100
+ */
+ this.draw = function(percent) {
+ // do we need to render a background
+ if (!!options.scaleColor || !!options.trackColor) {
+ // getImageData and putImageData are supported
+ if (ctx.getImageData && ctx.putImageData) {
+ if (!cachedBackground) {
+ drawBackground();
+ cachedBackground = ctx.getImageData(0, 0, options.size * scaleBy, options.size * scaleBy);
+ } else {
+ ctx.putImageData(cachedBackground, 0, 0);
+ }
+ } else {
+ this.clear();
+ drawBackground();
+ }
+ } else {
+ this.clear();
+ }
+
+ ctx.lineCap = options.lineCap;
+
+ // if barcolor is a function execute it and pass the percent as a value
+ var color;
+ if (typeof(options.barColor) === 'function') {
+ color = options.barColor(percent);
+ } else {
+ color = options.barColor;
+ }
+
+ // draw bar
+ drawCircle(color, options.lineWidth, percent / 100);
+ }.bind(this);
+
+ /**
+ * Animate from some percent to some other percentage
+ * @param {number} from Starting percentage
+ * @param {number} to Final percentage
+ */
+ this.animate = function(from, to) {
+ var startTime = Date.now();
+ options.onStart(from, to);
+ var animation = function() {
+ var process = Math.min(Date.now() - startTime, options.animate.duration);
+ var currentValue = options.easing(this, process, from, to - from, options.animate.duration);
+ this.draw(currentValue);
+ options.onStep(from, to, currentValue);
+ if (process >= options.animate.duration) {
+ options.onStop(from, to);
+ } else {
+ reqAnimationFrame(animation);
+ }
+ }.bind(this);
+
+ reqAnimationFrame(animation);
+ }.bind(this);
+};
+
+var EasyPieChart = function(el, opts) {
+ var defaultOptions = {
+ barColor: '#ef1e25',
+ trackColor: '#f9f9f9',
+ scaleColor: '#dfe0e0',
+ scaleLength: 5,
+ lineCap: 'round',
+ lineWidth: 3,
+ trackWidth: undefined,
+ size: 110,
+ rotate: 0,
+ animate: {
+ duration: 1000,
+ enabled: true
+ },
+ easing: function (x, t, b, c, d) { // more can be found here: http://gsgd.co.uk/sandbox/jquery/easing/
+ t = t / (d/2);
+ if (t < 1) {
+ return c / 2 * t * t + b;
+ }
+ return -c/2 * ((--t)*(t-2) - 1) + b;
+ },
+ onStart: function(from, to) {
+ return;
+ },
+ onStep: function(from, to, currentValue) {
+ return;
+ },
+ onStop: function(from, to) {
+ return;
+ }
+ };
+
+ // detect present renderer
+ if (typeof(CanvasRenderer) !== 'undefined') {
+ defaultOptions.renderer = CanvasRenderer;
+ } else if (typeof(SVGRenderer) !== 'undefined') {
+ defaultOptions.renderer = SVGRenderer;
+ } else {
+ throw new Error('Please load either the SVG- or the CanvasRenderer');
+ }
+
+ var options = {};
+ var currentValue = 0;
+
+ /**
+ * Initialize the plugin by creating the options object and initialize rendering
+ */
+ var init = function() {
+ this.el = el;
+ this.options = options;
+
+ // merge user options into default options
+ for (var i in defaultOptions) {
+ if (defaultOptions.hasOwnProperty(i)) {
+ options[i] = opts && typeof(opts[i]) !== 'undefined' ? opts[i] : defaultOptions[i];
+ if (typeof(options[i]) === 'function') {
+ options[i] = options[i].bind(this);
+ }
+ }
+ }
+
+ // check for jQuery easing
+ if (typeof(options.easing) === 'string' && typeof(jQuery) !== 'undefined' && jQuery.isFunction(jQuery.easing[options.easing])) {
+ options.easing = jQuery.easing[options.easing];
+ } else {
+ options.easing = defaultOptions.easing;
+ }
+
+ // process earlier animate option to avoid bc breaks
+ if (typeof(options.animate) === 'number') {
+ options.animate = {
+ duration: options.animate,
+ enabled: true
+ };
+ }
+
+ if (typeof(options.animate) === 'boolean' && !options.animate) {
+ options.animate = {
+ duration: 1000,
+ enabled: options.animate
+ };
+ }
+
+ // create renderer
+ this.renderer = new options.renderer(el, options);
+
+ // initial draw
+ this.renderer.draw(currentValue);
+
+ // initial update
+ if (el.dataset && el.dataset.percent) {
+ this.update(parseFloat(el.dataset.percent));
+ } else if (el.getAttribute && el.getAttribute('data-percent')) {
+ this.update(parseFloat(el.getAttribute('data-percent')));
+ }
+ }.bind(this);
+
+ /**
+ * Update the value of the chart
+ * @param {number} newValue Number between 0 and 100
+ * @return {object} Instance of the plugin for method chaining
+ */
+ this.update = function(newValue) {
+ newValue = parseFloat(newValue);
+ if (options.animate.enabled) {
+ this.renderer.animate(currentValue, newValue);
+ } else {
+ this.renderer.draw(newValue);
+ }
+ currentValue = newValue;
+ return this;
+ }.bind(this);
+
+ /**
+ * Disable animation
+ * @return {object} Instance of the plugin for method chaining
+ */
+ this.disableAnimation = function() {
+ options.animate.enabled = false;
+ return this;
+ };
+
+ /**
+ * Enable animation
+ * @return {object} Instance of the plugin for method chaining
+ */
+ this.enableAnimation = function() {
+ options.animate.enabled = true;
+ return this;
+ };
+
+ init();
+};
+
+$.fn.easyPieChart = function(options) {
+ return this.each(function() {
+ var instanceOptions;
+
+ if (!$.data(this, 'easyPieChart')) {
+ instanceOptions = $.extend({}, options, $(this).data());
+ $.data(this, 'easyPieChart', new EasyPieChart(this, instanceOptions));
+ }
+ });
+};
+
+
+}));
diff --git a/debian/missing-sources/jquery.nanoscroller.js b/debian/missing-sources/jquery.nanoscroller.js
new file mode 100644
index 00000000..edcbfaa4
--- /dev/null
+++ b/debian/missing-sources/jquery.nanoscroller.js
@@ -0,0 +1,1000 @@
+/*! nanoScrollerJS - v0.8.7 - 2015
+* http://jamesflorentino.github.com/nanoScrollerJS/
+* Copyright (c) 2015 James Florentino; Licensed MIT */
+(function(factory) {
+ if (typeof define === 'function' && define.amd) {
+ return define(['jquery'], function($) {
+ return factory($, window, document);
+ });
+ } else if (typeof exports === 'object') {
+ return module.exports = factory(require('jquery'), window, document);
+ } else {
+ return factory(jQuery, window, document);
+ }
+})(function($, window, document) {
+ "use strict";
+ var BROWSER_IS_IE7, BROWSER_SCROLLBAR_WIDTH, DOMSCROLL, DOWN, DRAG, ENTER, KEYDOWN, KEYUP, MOUSEDOWN, MOUSEENTER, MOUSEMOVE, MOUSEUP, MOUSEWHEEL, NanoScroll, PANEDOWN, RESIZE, SCROLL, SCROLLBAR, TOUCHMOVE, UP, WHEEL, cAF, defaults, getBrowserScrollbarWidth, hasTransform, isFFWithBuggyScrollbar, rAF, transform, _elementStyle, _prefixStyle, _vendor;
+ defaults = {
+
+ /**
+ a classname for the pane element.
+ @property paneClass
+ @type String
+ @default 'nano-pane'
+ */
+ paneClass: 'nano-pane',
+
+ /**
+ a classname for the slider element.
+ @property sliderClass
+ @type String
+ @default 'nano-slider'
+ */
+ sliderClass: 'nano-slider',
+
+ /**
+ a classname for the content element.
+ @property contentClass
+ @type String
+ @default 'nano-content'
+ */
+ contentClass: 'nano-content',
+
+ /**
+ a classname for enabled mode
+ @property enabledClass
+ @type String
+ @default 'has-scrollbar'
+ */
+ enabledClass: 'has-scrollbar',
+
+ /**
+ a classname for flashed mode
+ @property flashedClass
+ @type String
+ @default 'flashed'
+ */
+ flashedClass: 'flashed',
+
+ /**
+ a classname for active mode
+ @property activeClass
+ @type String
+ @default 'active'
+ */
+ activeClass: 'active',
+
+ /**
+ a setting to enable native scrolling in iOS devices.
+ @property iOSNativeScrolling
+ @type Boolean
+ @default false
+ */
+ iOSNativeScrolling: false,
+
+ /**
+ a setting to prevent the rest of the page being
+ scrolled when user scrolls the `.content` element.
+ @property preventPageScrolling
+ @type Boolean
+ @default false
+ */
+ preventPageScrolling: false,
+
+ /**
+ a setting to disable binding to the resize event.
+ @property disableResize
+ @type Boolean
+ @default false
+ */
+ disableResize: false,
+
+ /**
+ a setting to make the scrollbar always visible.
+ @property alwaysVisible
+ @type Boolean
+ @default false
+ */
+ alwaysVisible: false,
+
+ /**
+ a default timeout for the `flash()` method.
+ @property flashDelay
+ @type Number
+ @default 1500
+ */
+ flashDelay: 1500,
+
+ /**
+ a minimum height for the `.slider` element.
+ @property sliderMinHeight
+ @type Number
+ @default 20
+ */
+ sliderMinHeight: 20,
+
+ /**
+ a maximum height for the `.slider` element.
+ @property sliderMaxHeight
+ @type Number
+ @default null
+ */
+ sliderMaxHeight: null,
+
+ /**
+ an alternate document context.
+ @property documentContext
+ @type Document
+ @default null
+ */
+ documentContext: null,
+
+ /**
+ an alternate window context.
+ @property windowContext
+ @type Window
+ @default null
+ */
+ windowContext: null
+ };
+
+ /**
+ @property SCROLLBAR
+ @type String
+ @static
+ @final
+ @private
+ */
+ SCROLLBAR = 'scrollbar';
+
+ /**
+ @property SCROLL
+ @type String
+ @static
+ @final
+ @private
+ */
+ SCROLL = 'scroll';
+
+ /**
+ @property MOUSEDOWN
+ @type String
+ @final
+ @private
+ */
+ MOUSEDOWN = 'mousedown';
+
+ /**
+ @property MOUSEENTER
+ @type String
+ @final
+ @private
+ */
+ MOUSEENTER = 'mouseenter';
+
+ /**
+ @property MOUSEMOVE
+ @type String
+ @static
+ @final
+ @private
+ */
+ MOUSEMOVE = 'mousemove';
+
+ /**
+ @property MOUSEWHEEL
+ @type String
+ @final
+ @private
+ */
+ MOUSEWHEEL = 'mousewheel';
+
+ /**
+ @property MOUSEUP
+ @type String
+ @static
+ @final
+ @private
+ */
+ MOUSEUP = 'mouseup';
+
+ /**
+ @property RESIZE
+ @type String
+ @final
+ @private
+ */
+ RESIZE = 'resize';
+
+ /**
+ @property DRAG
+ @type String
+ @static
+ @final
+ @private
+ */
+ DRAG = 'drag';
+
+ /**
+ @property ENTER
+ @type String
+ @static
+ @final
+ @private
+ */
+ ENTER = 'enter';
+
+ /**
+ @property UP
+ @type String
+ @static
+ @final
+ @private
+ */
+ UP = 'up';
+
+ /**
+ @property PANEDOWN
+ @type String
+ @static
+ @final
+ @private
+ */
+ PANEDOWN = 'panedown';
+
+ /**
+ @property DOMSCROLL
+ @type String
+ @static
+ @final
+ @private
+ */
+ DOMSCROLL = 'DOMMouseScroll';
+
+ /**
+ @property DOWN
+ @type String
+ @static
+ @final
+ @private
+ */
+ DOWN = 'down';
+
+ /**
+ @property WHEEL
+ @type String
+ @static
+ @final
+ @private
+ */
+ WHEEL = 'wheel';
+
+ /**
+ @property KEYDOWN
+ @type String
+ @static
+ @final
+ @private
+ */
+ KEYDOWN = 'keydown';
+
+ /**
+ @property KEYUP
+ @type String
+ @static
+ @final
+ @private
+ */
+ KEYUP = 'keyup';
+
+ /**
+ @property TOUCHMOVE
+ @type String
+ @static
+ @final
+ @private
+ */
+ TOUCHMOVE = 'touchmove';
+
+ /**
+ @property BROWSER_IS_IE7
+ @type Boolean
+ @static
+ @final
+ @private
+ */
+ BROWSER_IS_IE7 = window.navigator.appName === 'Microsoft Internet Explorer' && /msie 7./i.test(window.navigator.appVersion) && window.ActiveXObject;
+
+ /**
+ @property BROWSER_SCROLLBAR_WIDTH
+ @type Number
+ @static
+ @default null
+ @private
+ */
+ BROWSER_SCROLLBAR_WIDTH = null;
+ rAF = window.requestAnimationFrame;
+ cAF = window.cancelAnimationFrame;
+ _elementStyle = document.createElement('div').style;
+ _vendor = (function() {
+ var i, transform, vendor, vendors, _i, _len;
+ vendors = ['t', 'webkitT', 'MozT', 'msT', 'OT'];
+ for (i = _i = 0, _len = vendors.length; _i < _len; i = ++_i) {
+ vendor = vendors[i];
+ transform = vendors[i] + 'ransform';
+ if (transform in _elementStyle) {
+ return vendors[i].substr(0, vendors[i].length - 1);
+ }
+ }
+ return false;
+ })();
+ _prefixStyle = function(style) {
+ if (_vendor === false) {
+ return false;
+ }
+ if (_vendor === '') {
+ return style;
+ }
+ return _vendor + style.charAt(0).toUpperCase() + style.substr(1);
+ };
+ transform = _prefixStyle('transform');
+ hasTransform = transform !== false;
+
+ /**
+ Returns browser's native scrollbar width
+ @method getBrowserScrollbarWidth
+ @return {Number} the scrollbar width in pixels
+ @static
+ @private
+ */
+ getBrowserScrollbarWidth = function() {
+ var outer, outerStyle, scrollbarWidth;
+ outer = document.createElement('div');
+ outerStyle = outer.style;
+ outerStyle.position = 'absolute';
+ outerStyle.width = '100px';
+ outerStyle.height = '100px';
+ outerStyle.overflow = SCROLL;
+ outerStyle.top = '-9999px';
+ document.body.appendChild(outer);
+ scrollbarWidth = outer.offsetWidth - outer.clientWidth;
+ document.body.removeChild(outer);
+ return scrollbarWidth;
+ };
+ isFFWithBuggyScrollbar = function() {
+ var isOSXFF, ua, version;
+ ua = window.navigator.userAgent;
+ isOSXFF = /(?=.+Mac OS X)(?=.+Firefox)/.test(ua);
+ if (!isOSXFF) {
+ return false;
+ }
+ version = /Firefox\/\d{2}\./.exec(ua);
+ if (version) {
+ version = version[0].replace(/\D+/g, '');
+ }
+ return isOSXFF && +version > 23;
+ };
+
+ /**
+ @class NanoScroll
+ @param element {HTMLElement|Node} the main element
+ @param options {Object} nanoScroller's options
+ @constructor
+ */
+ NanoScroll = (function() {
+ function NanoScroll(el, options) {
+ this.el = el;
+ this.options = options;
+ BROWSER_SCROLLBAR_WIDTH || (BROWSER_SCROLLBAR_WIDTH = getBrowserScrollbarWidth());
+ this.$el = $(this.el);
+ this.doc = $(this.options.documentContext || document);
+ this.win = $(this.options.windowContext || window);
+ this.body = this.doc.find('body');
+ this.$content = this.$el.children("." + this.options.contentClass);
+ this.$content.attr('tabindex', this.options.tabIndex || 0);
+ this.content = this.$content[0];
+ this.previousPosition = 0;
+ if (this.options.iOSNativeScrolling && (this.el.style.WebkitOverflowScrolling != null)) {
+ this.nativeScrolling();
+ } else {
+ this.generate();
+ }
+ this.createEvents();
+ this.addEvents();
+ this.reset();
+ }
+
+
+ /**
+ Prevents the rest of the page being scrolled
+ when user scrolls the `.nano-content` element.
+ @method preventScrolling
+ @param event {Event}
+ @param direction {String} Scroll direction (up or down)
+ @private
+ */
+
+ NanoScroll.prototype.preventScrolling = function(e, direction) {
+ if (!this.isActive) {
+ return;
+ }
+ if (e.type === DOMSCROLL) {
+ if (direction === DOWN && e.originalEvent.detail > 0 || direction === UP && e.originalEvent.detail < 0) {
+ e.preventDefault();
+ }
+ } else if (e.type === MOUSEWHEEL) {
+ if (!e.originalEvent || !e.originalEvent.wheelDelta) {
+ return;
+ }
+ if (direction === DOWN && e.originalEvent.wheelDelta < 0 || direction === UP && e.originalEvent.wheelDelta > 0) {
+ e.preventDefault();
+ }
+ }
+ };
+
+
+ /**
+ Enable iOS native scrolling
+ @method nativeScrolling
+ @private
+ */
+
+ NanoScroll.prototype.nativeScrolling = function() {
+ this.$content.css({
+ WebkitOverflowScrolling: 'touch'
+ });
+ this.iOSNativeScrolling = true;
+ this.isActive = true;
+ };
+
+
+ /**
+ Updates those nanoScroller properties that
+ are related to current scrollbar position.
+ @method updateScrollValues
+ @private
+ */
+
+ NanoScroll.prototype.updateScrollValues = function() {
+ var content, direction;
+ content = this.content;
+ this.maxScrollTop = content.scrollHeight - content.clientHeight;
+ this.prevScrollTop = this.contentScrollTop || 0;
+ this.contentScrollTop = content.scrollTop;
+ direction = this.contentScrollTop > this.previousPosition ? "down" : this.contentScrollTop < this.previousPosition ? "up" : "same";
+ this.previousPosition = this.contentScrollTop;
+ if (direction !== "same") {
+ this.$el.trigger('update', {
+ position: this.contentScrollTop,
+ maximum: this.maxScrollTop,
+ direction: direction
+ });
+ }
+ if (!this.iOSNativeScrolling) {
+ this.maxSliderTop = this.paneHeight - this.sliderHeight;
+ this.sliderTop = this.maxScrollTop === 0 ? 0 : this.contentScrollTop * this.maxSliderTop / this.maxScrollTop;
+ }
+ };
+
+
+ /**
+ Updates CSS styles for current scroll position.
+ Uses CSS 2d transfroms and `window.requestAnimationFrame` if available.
+ @method setOnScrollStyles
+ @private
+ */
+
+ NanoScroll.prototype.setOnScrollStyles = function() {
+ var cssValue;
+ if (hasTransform) {
+ cssValue = {};
+ cssValue[transform] = "translate(0, " + this.sliderTop + "px)";
+ } else {
+ cssValue = {
+ top: this.sliderTop
+ };
+ }
+ if (rAF) {
+ if (cAF && this.scrollRAF) {
+ cAF(this.scrollRAF);
+ }
+ this.scrollRAF = rAF((function(_this) {
+ return function() {
+ _this.scrollRAF = null;
+ return _this.slider.css(cssValue);
+ };
+ })(this));
+ } else {
+ this.slider.css(cssValue);
+ }
+ };
+
+
+ /**
+ Creates event related methods
+ @method createEvents
+ @private
+ */
+
+ NanoScroll.prototype.createEvents = function() {
+ this.events = {
+ down: (function(_this) {
+ return function(e) {
+ _this.isBeingDragged = true;
+ _this.offsetY = e.pageY - _this.slider.offset().top;
+ if (!_this.slider.is(e.target)) {
+ _this.offsetY = 0;
+ }
+ _this.pane.addClass(_this.options.activeClass);
+ _this.doc.bind(MOUSEMOVE, _this.events[DRAG]).bind(MOUSEUP, _this.events[UP]);
+ _this.body.bind(MOUSEENTER, _this.events[ENTER]);
+ return false;
+ };
+ })(this),
+ drag: (function(_this) {
+ return function(e) {
+ _this.sliderY = e.pageY - _this.$el.offset().top - _this.paneTop - (_this.offsetY || _this.sliderHeight * 0.5);
+ _this.scroll();
+ if (_this.contentScrollTop >= _this.maxScrollTop && _this.prevScrollTop !== _this.maxScrollTop) {
+ _this.$el.trigger('scrollend');
+ } else if (_this.contentScrollTop === 0 && _this.prevScrollTop !== 0) {
+ _this.$el.trigger('scrolltop');
+ }
+ return false;
+ };
+ })(this),
+ up: (function(_this) {
+ return function(e) {
+ _this.isBeingDragged = false;
+ _this.pane.removeClass(_this.options.activeClass);
+ _this.doc.unbind(MOUSEMOVE, _this.events[DRAG]).unbind(MOUSEUP, _this.events[UP]);
+ _this.body.unbind(MOUSEENTER, _this.events[ENTER]);
+ return false;
+ };
+ })(this),
+ resize: (function(_this) {
+ return function(e) {
+ _this.reset();
+ };
+ })(this),
+ panedown: (function(_this) {
+ return function(e) {
+ _this.sliderY = (e.offsetY || e.originalEvent.layerY) - (_this.sliderHeight * 0.5);
+ _this.scroll();
+ _this.events.down(e);
+ return false;
+ };
+ })(this),
+ scroll: (function(_this) {
+ return function(e) {
+ _this.updateScrollValues();
+ if (_this.isBeingDragged) {
+ return;
+ }
+ if (!_this.iOSNativeScrolling) {
+ _this.sliderY = _this.sliderTop;
+ _this.setOnScrollStyles();
+ }
+ if (e == null) {
+ return;
+ }
+ if (_this.contentScrollTop >= _this.maxScrollTop) {
+ if (_this.options.preventPageScrolling) {
+ _this.preventScrolling(e, DOWN);
+ }
+ if (_this.prevScrollTop !== _this.maxScrollTop) {
+ _this.$el.trigger('scrollend');
+ }
+ } else if (_this.contentScrollTop === 0) {
+ if (_this.options.preventPageScrolling) {
+ _this.preventScrolling(e, UP);
+ }
+ if (_this.prevScrollTop !== 0) {
+ _this.$el.trigger('scrolltop');
+ }
+ }
+ };
+ })(this),
+ wheel: (function(_this) {
+ return function(e) {
+ var delta;
+ if (e == null) {
+ return;
+ }
+ delta = e.delta || e.wheelDelta || (e.originalEvent && e.originalEvent.wheelDelta) || -e.detail || (e.originalEvent && -e.originalEvent.detail);
+ if (delta) {
+ _this.sliderY += -delta / 3;
+ }
+ _this.scroll();
+ return false;
+ };
+ })(this),
+ enter: (function(_this) {
+ return function(e) {
+ var _ref;
+ if (!_this.isBeingDragged) {
+ return;
+ }
+ if ((e.buttons || e.which) !== 1) {
+ return (_ref = _this.events)[UP].apply(_ref, arguments);
+ }
+ };
+ })(this)
+ };
+ };
+
+
+ /**
+ Adds event listeners with jQuery.
+ @method addEvents
+ @private
+ */
+
+ NanoScroll.prototype.addEvents = function() {
+ var events;
+ this.removeEvents();
+ events = this.events;
+ if (!this.options.disableResize) {
+ this.win.bind(RESIZE, events[RESIZE]);
+ }
+ if (!this.iOSNativeScrolling) {
+ this.slider.bind(MOUSEDOWN, events[DOWN]);
+ this.pane.bind(MOUSEDOWN, events[PANEDOWN]).bind("" + MOUSEWHEEL + " " + DOMSCROLL, events[WHEEL]);
+ }
+ this.$content.bind("" + SCROLL + " " + MOUSEWHEEL + " " + DOMSCROLL + " " + TOUCHMOVE, events[SCROLL]);
+ };
+
+
+ /**
+ Removes event listeners with jQuery.
+ @method removeEvents
+ @private
+ */
+
+ NanoScroll.prototype.removeEvents = function() {
+ var events;
+ events = this.events;
+ this.win.unbind(RESIZE, events[RESIZE]);
+ if (!this.iOSNativeScrolling) {
+ this.slider.unbind();
+ this.pane.unbind();
+ }
+ this.$content.unbind("" + SCROLL + " " + MOUSEWHEEL + " " + DOMSCROLL + " " + TOUCHMOVE, events[SCROLL]);
+ };
+
+
+ /**
+ Generates nanoScroller's scrollbar and elements for it.
+ @method generate
+ @chainable
+ @private
+ */
+
+ NanoScroll.prototype.generate = function() {
+ var contentClass, cssRule, currentPadding, options, pane, paneClass, sliderClass;
+ options = this.options;
+ paneClass = options.paneClass, sliderClass = options.sliderClass, contentClass = options.contentClass;
+ if (!(pane = this.$el.children("." + paneClass)).length && !pane.children("." + sliderClass).length) {
+ this.$el.append("<div class=\"" + paneClass + "\"><div class=\"" + sliderClass + "\" /></div>");
+ }
+ this.pane = this.$el.children("." + paneClass);
+ this.slider = this.pane.find("." + sliderClass);
+ if (BROWSER_SCROLLBAR_WIDTH === 0 && isFFWithBuggyScrollbar()) {
+ currentPadding = window.getComputedStyle(this.content, null).getPropertyValue('padding-right').replace(/[^0-9.]+/g, '');
+ cssRule = {
+ right: -14,
+ paddingRight: +currentPadding + 14
+ };
+ } else if (BROWSER_SCROLLBAR_WIDTH) {
+ cssRule = {
+ right: -BROWSER_SCROLLBAR_WIDTH
+ };
+ this.$el.addClass(options.enabledClass);
+ }
+ if (cssRule != null) {
+ this.$content.css(cssRule);
+ }
+ return this;
+ };
+
+
+ /**
+ @method restore
+ @private
+ */
+
+ NanoScroll.prototype.restore = function() {
+ this.stopped = false;
+ if (!this.iOSNativeScrolling) {
+ this.pane.show();
+ }
+ this.addEvents();
+ };
+
+
+ /**
+ Resets nanoScroller's scrollbar.
+ @method reset
+ @chainable
+ @example
+ $(".nano").nanoScroller();
+ */
+
+ NanoScroll.prototype.reset = function() {
+ var content, contentHeight, contentPosition, contentStyle, contentStyleOverflowY, paneBottom, paneHeight, paneOuterHeight, paneTop, parentMaxHeight, right, sliderHeight;
+ if (this.iOSNativeScrolling) {
+ this.contentHeight = this.content.scrollHeight;
+ return;
+ }
+ if (!this.$el.find("." + this.options.paneClass).length) {
+ this.generate().stop();
+ }
+ if (this.stopped) {
+ this.restore();
+ }
+ content = this.content;
+ contentStyle = content.style;
+ contentStyleOverflowY = contentStyle.overflowY;
+ if (BROWSER_IS_IE7) {
+ this.$content.css({
+ height: this.$content.height()
+ });
+ }
+ contentHeight = content.scrollHeight + BROWSER_SCROLLBAR_WIDTH;
+ parentMaxHeight = parseInt(this.$el.css("max-height"), 10);
+ if (parentMaxHeight > 0) {
+ this.$el.height("");
+ this.$el.height(content.scrollHeight > parentMaxHeight ? parentMaxHeight : content.scrollHeight);
+ }
+ paneHeight = this.pane.outerHeight(false);
+ paneTop = parseInt(this.pane.css('top'), 10);
+ paneBottom = parseInt(this.pane.css('bottom'), 10);
+ paneOuterHeight = paneHeight + paneTop + paneBottom;
+ sliderHeight = Math.round(paneOuterHeight / contentHeight * paneHeight);
+ if (sliderHeight < this.options.sliderMinHeight) {
+ sliderHeight = this.options.sliderMinHeight;
+ } else if ((this.options.sliderMaxHeight != null) && sliderHeight > this.options.sliderMaxHeight) {
+ sliderHeight = this.options.sliderMaxHeight;
+ }
+ if (contentStyleOverflowY === SCROLL && contentStyle.overflowX !== SCROLL) {
+ sliderHeight += BROWSER_SCROLLBAR_WIDTH;
+ }
+ this.maxSliderTop = paneOuterHeight - sliderHeight;
+ this.contentHeight = contentHeight;
+ this.paneHeight = paneHeight;
+ this.paneOuterHeight = paneOuterHeight;
+ this.sliderHeight = sliderHeight;
+ this.paneTop = paneTop;
+ this.slider.height(sliderHeight);
+ this.events.scroll();
+ this.pane.show();
+ this.isActive = true;
+ if ((content.scrollHeight === content.clientHeight) || (this.pane.outerHeight(true) >= content.scrollHeight && contentStyleOverflowY !== SCROLL)) {
+ this.pane.hide();
+ this.isActive = false;
+ } else if (this.el.clientHeight === content.scrollHeight && contentStyleOverflowY === SCROLL) {
+ this.slider.hide();
+ } else {
+ this.slider.show();
+ }
+ this.pane.css({
+ opacity: (this.options.alwaysVisible ? 1 : ''),
+ visibility: (this.options.alwaysVisible ? 'visible' : '')
+ });
+ contentPosition = this.$content.css('position');
+ if (contentPosition === 'static' || contentPosition === 'relative') {
+ right = parseInt(this.$content.css('right'), 10);
+ if (right) {
+ this.$content.css({
+ right: '',
+ marginRight: right
+ });
+ }
+ }
+ return this;
+ };
+
+
+ /**
+ @method scroll
+ @private
+ @example
+ $(".nano").nanoScroller({ scroll: 'top' });
+ */
+
+ NanoScroll.prototype.scroll = function() {
+ if (!this.isActive) {
+ return;
+ }
+ this.sliderY = Math.max(0, this.sliderY);
+ this.sliderY = Math.min(this.maxSliderTop, this.sliderY);
+ this.$content.scrollTop(this.maxScrollTop * this.sliderY / this.maxSliderTop);
+ if (!this.iOSNativeScrolling) {
+ this.updateScrollValues();
+ this.setOnScrollStyles();
+ }
+ return this;
+ };
+
+
+ /**
+ Scroll at the bottom with an offset value
+ @method scrollBottom
+ @param offsetY {Number}
+ @chainable
+ @example
+ $(".nano").nanoScroller({ scrollBottom: value });
+ */
+
+ NanoScroll.prototype.scrollBottom = function(offsetY) {
+ if (!this.isActive) {
+ return;
+ }
+ this.$content.scrollTop(this.contentHeight - this.$content.height() - offsetY).trigger(MOUSEWHEEL);
+ this.stop().restore();
+ return this;
+ };
+
+
+ /**
+ Scroll at the top with an offset value
+ @method scrollTop
+ @param offsetY {Number}
+ @chainable
+ @example
+ $(".nano").nanoScroller({ scrollTop: value });
+ */
+
+ NanoScroll.prototype.scrollTop = function(offsetY) {
+ if (!this.isActive) {
+ return;
+ }
+ this.$content.scrollTop(+offsetY).trigger(MOUSEWHEEL);
+ this.stop().restore();
+ return this;
+ };
+
+
+ /**
+ Scroll to an element
+ @method scrollTo
+ @param node {Node} A node to scroll to.
+ @chainable
+ @example
+ $(".nano").nanoScroller({ scrollTo: $('#a_node') });
+ */
+
+ NanoScroll.prototype.scrollTo = function(node) {
+ if (!this.isActive) {
+ return;
+ }
+ this.scrollTop(this.$el.find(node).get(0).offsetTop);
+ return this;
+ };
+
+
+ /**
+ To stop the operation.
+ This option will tell the plugin to disable all event bindings and hide the gadget scrollbar from the UI.
+ @method stop
+ @chainable
+ @example
+ $(".nano").nanoScroller({ stop: true });
+ */
+
+ NanoScroll.prototype.stop = function() {
+ if (cAF && this.scrollRAF) {
+ cAF(this.scrollRAF);
+ this.scrollRAF = null;
+ }
+ this.stopped = true;
+ this.removeEvents();
+ if (!this.iOSNativeScrolling) {
+ this.pane.hide();
+ }
+ return this;
+ };
+
+
+ /**
+ Destroys nanoScroller and restores browser's native scrollbar.
+ @method destroy
+ @chainable
+ @example
+ $(".nano").nanoScroller({ destroy: true });
+ */
+
+ NanoScroll.prototype.destroy = function() {
+ if (!this.stopped) {
+ this.stop();
+ }
+ if (!this.iOSNativeScrolling && this.pane.length) {
+ this.pane.remove();
+ }
+ if (BROWSER_IS_IE7) {
+ this.$content.height('');
+ }
+ this.$content.removeAttr('tabindex');
+ if (this.$el.hasClass(this.options.enabledClass)) {
+ this.$el.removeClass(this.options.enabledClass);
+ this.$content.css({
+ right: ''
+ });
+ }
+ return this;
+ };
+
+
+ /**
+ To flash the scrollbar gadget for an amount of time defined in plugin settings (defaults to 1,5s).
+ Useful if you want to show the user (e.g. on pageload) that there is more content waiting for him.
+ @method flash
+ @chainable
+ @example
+ $(".nano").nanoScroller({ flash: true });
+ */
+
+ NanoScroll.prototype.flash = function() {
+ if (this.iOSNativeScrolling) {
+ return;
+ }
+ if (!this.isActive) {
+ return;
+ }
+ this.reset();
+ this.pane.addClass(this.options.flashedClass);
+ setTimeout((function(_this) {
+ return function() {
+ _this.pane.removeClass(_this.options.flashedClass);
+ };
+ })(this), this.options.flashDelay);
+ return this;
+ };
+
+ return NanoScroll;
+
+ })();
+ $.fn.nanoScroller = function(settings) {
+ return this.each(function() {
+ var options, scrollbar;
+ if (!(scrollbar = this.nanoscroller)) {
+ options = $.extend({}, defaults, settings);
+ this.nanoscroller = scrollbar = new NanoScroll(this, options);
+ }
+ if (settings && typeof settings === "object") {
+ $.extend(scrollbar.options, settings);
+ if (settings.scrollBottom != null) {
+ return scrollbar.scrollBottom(settings.scrollBottom);
+ }
+ if (settings.scrollTop != null) {
+ return scrollbar.scrollTop(settings.scrollTop);
+ }
+ if (settings.scrollTo) {
+ return scrollbar.scrollTo(settings.scrollTo);
+ }
+ if (settings.scroll === 'bottom') {
+ return scrollbar.scrollBottom(0);
+ }
+ if (settings.scroll === 'top') {
+ return scrollbar.scrollTop(0);
+ }
+ if (settings.scroll && settings.scroll instanceof $) {
+ return scrollbar.scrollTo(settings.scroll);
+ }
+ if (settings.stop) {
+ return scrollbar.stop();
+ }
+ if (settings.destroy) {
+ return scrollbar.destroy();
+ }
+ if (settings.flash) {
+ return scrollbar.flash();
+ }
+ }
+ return scrollbar.reset();
+ });
+ };
+ $.fn.nanoScroller.Constructor = NanoScroll;
+});
+
+//# sourceMappingURL=jquery.nanoscroller.js.map
diff --git a/debian/missing-sources/jquery.peity.js b/debian/missing-sources/jquery.peity.js
new file mode 100644
index 00000000..8c4c9a52
--- /dev/null
+++ b/debian/missing-sources/jquery.peity.js
@@ -0,0 +1,383 @@
+// Peity jQuery plugin version 3.2.0
+// (c) 2015 Ben Pickles
+//
+// http://benpickles.github.io/peity
+//
+// Released under MIT license.
+(function($, document, Math, undefined) {
+ var peity = $.fn.peity = function(type, options) {
+ if (svgSupported) {
+ this.each(function() {
+ var $this = $(this)
+ var chart = $this.data('_peity')
+
+ if (chart) {
+ if (type) chart.type = type
+ $.extend(chart.opts, options)
+ } else {
+ chart = new Peity(
+ $this,
+ type,
+ $.extend({},
+ peity.defaults[type],
+ $this.data('peity'),
+ options)
+ )
+
+ $this
+ .change(function() { chart.draw() })
+ .data('_peity', chart)
+ }
+
+ chart.draw()
+ });
+ }
+
+ return this;
+ };
+
+ var Peity = function($el, type, opts) {
+ this.$el = $el
+ this.type = type
+ this.opts = opts
+ }
+
+ var PeityPrototype = Peity.prototype
+
+ var svgElement = PeityPrototype.svgElement = function(tag, attrs) {
+ return $(
+ document.createElementNS('http://www.w3.org/2000/svg', tag)
+ ).attr(attrs)
+ }
+
+ // https://gist.github.com/madrobby/3201472
+ var svgSupported = 'createElementNS' in document && svgElement('svg', {})[0].createSVGRect
+
+ PeityPrototype.draw = function() {
+ var opts = this.opts
+ peity.graphers[this.type].call(this, opts)
+ if (opts.after) opts.after.call(this, opts)
+ }
+
+ PeityPrototype.fill = function() {
+ var fill = this.opts.fill
+
+ return $.isFunction(fill)
+ ? fill
+ : function(_, i) { return fill[i % fill.length] }
+ }
+
+ PeityPrototype.prepare = function(width, height) {
+ if (!this.$svg) {
+ this.$el.hide().after(
+ this.$svg = svgElement('svg', {
+ "class": "peity"
+ })
+ )
+ }
+
+ return this.$svg
+ .empty()
+ .data('peity', this)
+ .attr({
+ height: height,
+ width: width
+ })
+ }
+
+ PeityPrototype.values = function() {
+ return $.map(this.$el.text().split(this.opts.delimiter), function(value) {
+ return parseFloat(value)
+ })
+ }
+
+ peity.defaults = {}
+ peity.graphers = {}
+
+ peity.register = function(type, defaults, grapher) {
+ this.defaults[type] = defaults
+ this.graphers[type] = grapher
+ }
+
+ peity.register(
+ 'pie',
+ {
+ fill: ['#ff9900', '#fff4dd', '#ffc66e'],
+ radius: 8
+ },
+ function(opts) {
+ if (!opts.delimiter) {
+ var delimiter = this.$el.text().match(/[^0-9\.]/)
+ opts.delimiter = delimiter ? delimiter[0] : ","
+ }
+
+ var values = $.map(this.values(), function(n) {
+ return n > 0 ? n : 0
+ })
+
+ if (opts.delimiter == "/") {
+ var v1 = values[0]
+ var v2 = values[1]
+ values = [v1, Math.max(0, v2 - v1)]
+ }
+
+ var i = 0
+ var length = values.length
+ var sum = 0
+
+ for (; i < length; i++) {
+ sum += values[i]
+ }
+
+ if (!sum) {
+ length = 2
+ sum = 1
+ values = [0, 1]
+ }
+
+ var diameter = opts.radius * 2
+
+ var $svg = this.prepare(
+ opts.width || diameter,
+ opts.height || diameter
+ )
+
+ var width = $svg.width()
+ , height = $svg.height()
+ , cx = width / 2
+ , cy = height / 2
+
+ var radius = Math.min(cx, cy)
+ , innerRadius = opts.innerRadius
+
+ if (this.type == 'donut' && !innerRadius) {
+ innerRadius = radius * 0.5
+ }
+
+ var pi = Math.PI
+ var fill = this.fill()
+
+ var scale = this.scale = function(value, radius) {
+ var radians = value / sum * pi * 2 - pi / 2
+
+ return [
+ radius * Math.cos(radians) + cx,
+ radius * Math.sin(radians) + cy
+ ]
+ }
+
+ var cumulative = 0
+
+ for (i = 0; i < length; i++) {
+ var value = values[i]
+ , portion = value / sum
+ , $node
+
+ if (portion == 0) continue
+
+ if (portion == 1) {
+ if (innerRadius) {
+ var x2 = cx - 0.01
+ , y1 = cy - radius
+ , y2 = cy - innerRadius
+
+ $node = svgElement('path', {
+ d: [
+ 'M', cx, y1,
+ 'A', radius, radius, 0, 1, 1, x2, y1,
+ 'L', x2, y2,
+ 'A', innerRadius, innerRadius, 0, 1, 0, cx, y2
+ ].join(' ')
+ })
+ } else {
+ $node = svgElement('circle', {
+ cx: cx,
+ cy: cy,
+ r: radius
+ })
+ }
+ } else {
+ var cumulativePlusValue = cumulative + value
+
+ var d = ['M'].concat(
+ scale(cumulative, radius),
+ 'A', radius, radius, 0, portion > 0.5 ? 1 : 0, 1,
+ scale(cumulativePlusValue, radius),
+ 'L'
+ )
+
+ if (innerRadius) {
+ d = d.concat(
+ scale(cumulativePlusValue, innerRadius),
+ 'A', innerRadius, innerRadius, 0, portion > 0.5 ? 1 : 0, 0,
+ scale(cumulative, innerRadius)
+ )
+ } else {
+ d.push(cx, cy)
+ }
+
+ cumulative += value
+
+ $node = svgElement('path', {
+ d: d.join(" ")
+ })
+ }
+
+ $node.attr('fill', fill.call(this, value, i, values))
+
+ $svg.append($node)
+ }
+ }
+ )
+
+ peity.register(
+ 'donut',
+ $.extend(true, {}, peity.defaults.pie),
+ function(opts) {
+ peity.graphers.pie.call(this, opts)
+ }
+ )
+
+ peity.register(
+ "line",
+ {
+ delimiter: ",",
+ fill: "#c6d9fd",
+ height: 16,
+ min: 0,
+ stroke: "#4d89f9",
+ strokeWidth: 1,
+ width: 32
+ },
+ function(opts) {
+ var values = this.values()
+ if (values.length == 1) values.push(values[0])
+ var max = Math.max.apply(Math, opts.max == undefined ? values : values.concat(opts.max))
+ , min = Math.min.apply(Math, opts.min == undefined ? values : values.concat(opts.min))
+
+ var $svg = this.prepare(opts.width, opts.height)
+ , strokeWidth = opts.strokeWidth
+ , width = $svg.width()
+ , height = $svg.height() - strokeWidth
+ , diff = max - min
+
+ var xScale = this.x = function(input) {
+ return input * (width / (values.length - 1))
+ }
+
+ var yScale = this.y = function(input) {
+ var y = height
+
+ if (diff) {
+ y -= ((input - min) / diff) * height
+ }
+
+ return y + strokeWidth / 2
+ }
+
+ var zero = yScale(Math.max(min, 0))
+ , coords = [0, zero]
+
+ for (var i = 0; i < values.length; i++) {
+ coords.push(
+ xScale(i),
+ yScale(values[i])
+ )
+ }
+
+ coords.push(width, zero)
+
+ if (opts.fill) {
+ $svg.append(
+ svgElement('polygon', {
+ fill: opts.fill,
+ points: coords.join(' ')
+ })
+ )
+ }
+
+ if (strokeWidth) {
+ $svg.append(
+ svgElement('polyline', {
+ fill: 'none',
+ points: coords.slice(2, coords.length - 2).join(' '),
+ stroke: opts.stroke,
+ 'stroke-width': strokeWidth,
+ 'stroke-linecap': 'square'
+ })
+ )
+ }
+ }
+ );
+
+ peity.register(
+ 'bar',
+ {
+ delimiter: ",",
+ fill: ["#4D89F9"],
+ height: 16,
+ min: 0,
+ padding: 0.1,
+ width: 32
+ },
+ function(opts) {
+ var values = this.values()
+ , max = Math.max.apply(Math, opts.max == undefined ? values : values.concat(opts.max))
+ , min = Math.min.apply(Math, opts.min == undefined ? values : values.concat(opts.min))
+
+ var $svg = this.prepare(opts.width, opts.height)
+ , width = $svg.width()
+ , height = $svg.height()
+ , diff = max - min
+ , padding = opts.padding
+ , fill = this.fill()
+
+ var xScale = this.x = function(input) {
+ return input * width / values.length
+ }
+
+ var yScale = this.y = function(input) {
+ return height - (
+ diff
+ ? ((input - min) / diff) * height
+ : 1
+ )
+ }
+
+ for (var i = 0; i < values.length; i++) {
+ var x = xScale(i + padding)
+ , w = xScale(i + 1 - padding) - x
+ , value = values[i]
+ , valueY = yScale(value)
+ , y1 = valueY
+ , y2 = valueY
+ , h
+
+ if (!diff) {
+ h = 1
+ } else if (value < 0) {
+ y1 = yScale(Math.min(max, 0))
+ } else {
+ y2 = yScale(Math.max(min, 0))
+ }
+
+ h = y2 - y1
+
+ if (h == 0) {
+ h = 1
+ if (max > 0 && diff) y1--
+ }
+
+ $svg.append(
+ svgElement('rect', {
+ fill: fill.call(this, value, i, values),
+ x: x,
+ y: y1,
+ width: w,
+ height: h
+ })
+ )
+ }
+ }
+ );
+})(jQuery, document, Math);
diff --git a/debian/missing-sources/jquery.sparkline.js b/debian/missing-sources/jquery.sparkline.js
new file mode 100644
index 00000000..721e03b7
--- /dev/null
+++ b/debian/missing-sources/jquery.sparkline.js
@@ -0,0 +1,3054 @@
+/**
+*
+* jquery.sparkline.js
+*
+* v2.1.2
+* (c) Splunk, Inc
+* Contact: Gareth Watts (gareth@splunk.com)
+* http://omnipotent.net/jquery.sparkline/
+*
+* Generates inline sparkline charts from data supplied either to the method
+* or inline in HTML
+*
+* Compatible with Internet Explorer 6.0+ and modern browsers equipped with the canvas tag
+* (Firefox 2.0+, Safari, Opera, etc)
+*
+* License: New BSD License
+*
+* Copyright (c) 2012, Splunk Inc.
+* All rights reserved.
+*
+* Redistribution and use in source and binary forms, with or without modification,
+* are permitted provided that the following conditions are met:
+*
+* * Redistributions of source code must retain the above copyright notice,
+* this list of conditions and the following disclaimer.
+* * Redistributions in binary form must reproduce the above copyright notice,
+* this list of conditions and the following disclaimer in the documentation
+* and/or other materials provided with the distribution.
+* * Neither the name of Splunk Inc nor the names of its contributors may
+* be used to endorse or promote products derived from this software without
+* specific prior written permission.
+*
+* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY
+* EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES
+* OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT
+* SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+* SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT
+* OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION)
+* HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
+* OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
+* SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+*
+*
+* Usage:
+* $(selector).sparkline(values, options)
+*
+* If values is undefined or set to 'html' then the data values are read from the specified tag:
+* <p>Sparkline: <span class="sparkline">1,4,6,6,8,5,3,5</span></p>
+* $('.sparkline').sparkline();
+* There must be no spaces in the enclosed data set
+*
+* Otherwise values must be an array of numbers or null values
+* <p>Sparkline: <span id="sparkline1">This text replaced if the browser is compatible</span></p>
+* $('#sparkline1').sparkline([1,4,6,6,8,5,3,5])
+* $('#sparkline2').sparkline([1,4,6,null,null,5,3,5])
+*
+* Values can also be specified in an HTML comment, or as a values attribute:
+* <p>Sparkline: <span class="sparkline"><!--1,4,6,6,8,5,3,5 --></span></p>
+* <p>Sparkline: <span class="sparkline" values="1,4,6,6,8,5,3,5"></span></p>
+* $('.sparkline').sparkline();
+*
+* For line charts, x values can also be specified:
+* <p>Sparkline: <span class="sparkline">1:1,2.7:4,3.4:6,5:6,6:8,8.7:5,9:3,10:5</span></p>
+* $('#sparkline1').sparkline([ [1,1], [2.7,4], [3.4,6], [5,6], [6,8], [8.7,5], [9,3], [10,5] ])
+*
+* By default, options should be passed in as teh second argument to the sparkline function:
+* $('.sparkline').sparkline([1,2,3,4], {type: 'bar'})
+*
+* Options can also be set by passing them on the tag itself. This feature is disabled by default though
+* as there's a slight performance overhead:
+* $('.sparkline').sparkline([1,2,3,4], {enableTagOptions: true})
+* <p>Sparkline: <span class="sparkline" sparkType="bar" sparkBarColor="red">loading</span></p>
+* Prefix all options supplied as tag attribute with "spark" (configurable by setting tagOptionPrefix)
+*
+* Supported options:
+* lineColor - Color of the line used for the chart
+* fillColor - Color used to fill in the chart - Set to '' or false for a transparent chart
+* width - Width of the chart - Defaults to 3 times the number of values in pixels
+* height - Height of the chart - Defaults to the height of the containing element
+* chartRangeMin - Specify the minimum value to use for the Y range of the chart - Defaults to the minimum value supplied
+* chartRangeMax - Specify the maximum value to use for the Y range of the chart - Defaults to the maximum value supplied
+* chartRangeClip - Clip out of range values to the max/min specified by chartRangeMin and chartRangeMax
+* chartRangeMinX - Specify the minimum value to use for the X range of the chart - Defaults to the minimum value supplied
+* chartRangeMaxX - Specify the maximum value to use for the X range of the chart - Defaults to the maximum value supplied
+* composite - If true then don't erase any existing chart attached to the tag, but draw
+* another chart over the top - Note that width and height are ignored if an
+* existing chart is detected.
+* tagValuesAttribute - Name of tag attribute to check for data values - Defaults to 'values'
+* enableTagOptions - Whether to check tags for sparkline options
+* tagOptionPrefix - Prefix used for options supplied as tag attributes - Defaults to 'spark'
+* disableHiddenCheck - If set to true, then the plugin will assume that charts will never be drawn into a
+* hidden dom element, avoding a browser reflow
+* disableInteraction - If set to true then all mouseover/click interaction behaviour will be disabled,
+* making the plugin perform much like it did in 1.x
+* disableTooltips - If set to true then tooltips will be disabled - Defaults to false (tooltips enabled)
+* disableHighlight - If set to true then highlighting of selected chart elements on mouseover will be disabled
+* defaults to false (highlights enabled)
+* highlightLighten - Factor to lighten/darken highlighted chart values by - Defaults to 1.4 for a 40% increase
+* tooltipContainer - Specify which DOM element the tooltip should be rendered into - defaults to document.body
+* tooltipClassname - Optional CSS classname to apply to tooltips - If not specified then a default style will be applied
+* tooltipOffsetX - How many pixels away from the mouse pointer to render the tooltip on the X axis
+* tooltipOffsetY - How many pixels away from the mouse pointer to render the tooltip on the r axis
+* tooltipFormatter - Optional callback that allows you to override the HTML displayed in the tooltip
+* callback is given arguments of (sparkline, options, fields)
+* tooltipChartTitle - If specified then the tooltip uses the string specified by this setting as a title
+* tooltipFormat - A format string or SPFormat object (or an array thereof for multiple entries)
+* to control the format of the tooltip
+* tooltipPrefix - A string to prepend to each field displayed in a tooltip
+* tooltipSuffix - A string to append to each field displayed in a tooltip
+* tooltipSkipNull - If true then null values will not have a tooltip displayed (defaults to true)
+* tooltipValueLookups - An object or range map to map field values to tooltip strings
+* (eg. to map -1 to "Lost", 0 to "Draw", and 1 to "Win")
+* numberFormatter - Optional callback for formatting numbers in tooltips
+* numberDigitGroupSep - Character to use for group separator in numbers "1,234" - Defaults to ","
+* numberDecimalMark - Character to use for the decimal point when formatting numbers - Defaults to "."
+* numberDigitGroupCount - Number of digits between group separator - Defaults to 3
+*
+* There are 7 types of sparkline, selected by supplying a "type" option of 'line' (default),
+* 'bar', 'tristate', 'bullet', 'discrete', 'pie' or 'box'
+* line - Line chart. Options:
+* spotColor - Set to '' to not end each line in a circular spot
+* minSpotColor - If set, color of spot at minimum value
+* maxSpotColor - If set, color of spot at maximum value
+* spotRadius - Radius in pixels
+* lineWidth - Width of line in pixels
+* normalRangeMin
+* normalRangeMax - If set draws a filled horizontal bar between these two values marking the "normal"
+* or expected range of values
+* normalRangeColor - Color to use for the above bar
+* drawNormalOnTop - Draw the normal range above the chart fill color if true
+* defaultPixelsPerValue - Defaults to 3 pixels of width for each value in the chart
+* highlightSpotColor - The color to use for drawing a highlight spot on mouseover - Set to null to disable
+* highlightLineColor - The color to use for drawing a highlight line on mouseover - Set to null to disable
+* valueSpots - Specify which points to draw spots on, and in which color. Accepts a range map
+*
+* bar - Bar chart. Options:
+* barColor - Color of bars for postive values
+* negBarColor - Color of bars for negative values
+* zeroColor - Color of bars with zero values
+* nullColor - Color of bars with null values - Defaults to omitting the bar entirely
+* barWidth - Width of bars in pixels
+* colorMap - Optional mappnig of values to colors to override the *BarColor values above
+* can be an Array of values to control the color of individual bars or a range map
+* to specify colors for individual ranges of values
+* barSpacing - Gap between bars in pixels
+* zeroAxis - Centers the y-axis around zero if true
+*
+* tristate - Charts values of win (>0), lose (<0) or draw (=0)
+* posBarColor - Color of win values
+* negBarColor - Color of lose values
+* zeroBarColor - Color of draw values
+* barWidth - Width of bars in pixels
+* barSpacing - Gap between bars in pixels
+* colorMap - Optional mappnig of values to colors to override the *BarColor values above
+* can be an Array of values to control the color of individual bars or a range map
+* to specify colors for individual ranges of values
+*
+* discrete - Options:
+* lineHeight - Height of each line in pixels - Defaults to 30% of the graph height
+* thesholdValue - Values less than this value will be drawn using thresholdColor instead of lineColor
+* thresholdColor
+*
+* bullet - Values for bullet graphs msut be in the order: target, performance, range1, range2, range3, ...
+* options:
+* targetColor - The color of the vertical target marker
+* targetWidth - The width of the target marker in pixels
+* performanceColor - The color of the performance measure horizontal bar
+* rangeColors - Colors to use for each qualitative range background color
+*
+* pie - Pie chart. Options:
+* sliceColors - An array of colors to use for pie slices
+* offset - Angle in degrees to offset the first slice - Try -90 or +90
+* borderWidth - Width of border to draw around the pie chart, in pixels - Defaults to 0 (no border)
+* borderColor - Color to use for the pie chart border - Defaults to #000
+*
+* box - Box plot. Options:
+* raw - Set to true to supply pre-computed plot points as values
+* values should be: low_outlier, low_whisker, q1, median, q3, high_whisker, high_outlier
+* When set to false you can supply any number of values and the box plot will
+* be computed for you. Default is false.
+* showOutliers - Set to true (default) to display outliers as circles
+* outlierIQR - Interquartile range used to determine outliers. Default 1.5
+* boxLineColor - Outline color of the box
+* boxFillColor - Fill color for the box
+* whiskerColor - Line color used for whiskers
+* outlierLineColor - Outline color of outlier circles
+* outlierFillColor - Fill color of the outlier circles
+* spotRadius - Radius of outlier circles
+* medianColor - Line color of the median line
+* target - Draw a target cross hair at the supplied value (default undefined)
+*
+*
+*
+* Examples:
+* $('#sparkline1').sparkline(myvalues, { lineColor: '#f00', fillColor: false });
+* $('.barsparks').sparkline('html', { type:'bar', height:'40px', barWidth:5 });
+* $('#tristate').sparkline([1,1,-1,1,0,0,-1], { type:'tristate' }):
+* $('#discrete').sparkline([1,3,4,5,5,3,4,5], { type:'discrete' });
+* $('#bullet').sparkline([10,12,12,9,7], { type:'bullet' });
+* $('#pie').sparkline([1,1,2], { type:'pie' });
+*/
+
+/*jslint regexp: true, browser: true, jquery: true, white: true, nomen: false, plusplus: false, maxerr: 500, indent: 4 */
+
+(function(document, Math, undefined) { // performance/minified-size optimization
+(function(factory) {
+ if(typeof define === 'function' && define.amd) {
+ define(['jquery'], factory);
+ } else if (jQuery && !jQuery.fn.sparkline) {
+ factory(jQuery);
+ }
+}
+(function($) {
+ 'use strict';
+
+ var UNSET_OPTION = {},
+ getDefaults, createClass, SPFormat, clipval, quartile, normalizeValue, normalizeValues,
+ remove, isNumber, all, sum, addCSS, ensureArray, formatNumber, RangeMap,
+ MouseHandler, Tooltip, barHighlightMixin,
+ line, bar, tristate, discrete, bullet, pie, box, defaultStyles, initStyles,
+ VShape, VCanvas_base, VCanvas_canvas, VCanvas_vml, pending, shapeCount = 0;
+
+ /**
+ * Default configuration settings
+ */
+ getDefaults = function () {
+ return {
+ // Settings common to most/all chart types
+ common: {
+ type: 'line',
+ lineColor: '#00f',
+ fillColor: '#cdf',
+ defaultPixelsPerValue: 3,
+ width: 'auto',
+ height: 'auto',
+ composite: false,
+ tagValuesAttribute: 'values',
+ tagOptionsPrefix: 'spark',
+ enableTagOptions: false,
+ enableHighlight: true,
+ highlightLighten: 1.4,
+ tooltipSkipNull: true,
+ tooltipPrefix: '',
+ tooltipSuffix: '',
+ disableHiddenCheck: false,
+ numberFormatter: false,
+ numberDigitGroupCount: 3,
+ numberDigitGroupSep: ',',
+ numberDecimalMark: '.',
+ disableTooltips: false,
+ disableInteraction: false
+ },
+ // Defaults for line charts
+ line: {
+ spotColor: '#f80',
+ highlightSpotColor: '#5f5',
+ highlightLineColor: '#f22',
+ spotRadius: 1.5,
+ minSpotColor: '#f80',
+ maxSpotColor: '#f80',
+ lineWidth: 1,
+ normalRangeMin: undefined,
+ normalRangeMax: undefined,
+ normalRangeColor: '#ccc',
+ drawNormalOnTop: false,
+ chartRangeMin: undefined,
+ chartRangeMax: undefined,
+ chartRangeMinX: undefined,
+ chartRangeMaxX: undefined,
+ tooltipFormat: new SPFormat('<span style="color: {{color}}">&#9679;</span> {{prefix}}{{y}}{{suffix}}')
+ },
+ // Defaults for bar charts
+ bar: {
+ barColor: '#3366cc',
+ negBarColor: '#f44',
+ stackedBarColor: ['#3366cc', '#dc3912', '#ff9900', '#109618', '#66aa00',
+ '#dd4477', '#0099c6', '#990099'],
+ zeroColor: undefined,
+ nullColor: undefined,
+ zeroAxis: true,
+ barWidth: 4,
+ barSpacing: 1,
+ chartRangeMax: undefined,
+ chartRangeMin: undefined,
+ chartRangeClip: false,
+ colorMap: undefined,
+ tooltipFormat: new SPFormat('<span style="color: {{color}}">&#9679;</span> {{prefix}}{{value}}{{suffix}}')
+ },
+ // Defaults for tristate charts
+ tristate: {
+ barWidth: 4,
+ barSpacing: 1,
+ posBarColor: '#6f6',
+ negBarColor: '#f44',
+ zeroBarColor: '#999',
+ colorMap: {},
+ tooltipFormat: new SPFormat('<span style="color: {{color}}">&#9679;</span> {{value:map}}'),
+ tooltipValueLookups: { map: { '-1': 'Loss', '0': 'Draw', '1': 'Win' } }
+ },
+ // Defaults for discrete charts
+ discrete: {
+ lineHeight: 'auto',
+ thresholdColor: undefined,
+ thresholdValue: 0,
+ chartRangeMax: undefined,
+ chartRangeMin: undefined,
+ chartRangeClip: false,
+ tooltipFormat: new SPFormat('{{prefix}}{{value}}{{suffix}}')
+ },
+ // Defaults for bullet charts
+ bullet: {
+ targetColor: '#f33',
+ targetWidth: 3, // width of the target bar in pixels
+ performanceColor: '#33f',
+ rangeColors: ['#d3dafe', '#a8b6ff', '#7f94ff'],
+ base: undefined, // set this to a number to change the base start number
+ tooltipFormat: new SPFormat('{{fieldkey:fields}} - {{value}}'),
+ tooltipValueLookups: { fields: {r: 'Range', p: 'Performance', t: 'Target'} }
+ },
+ // Defaults for pie charts
+ pie: {
+ offset: 0,
+ sliceColors: ['#3366cc', '#dc3912', '#ff9900', '#109618', '#66aa00',
+ '#dd4477', '#0099c6', '#990099'],
+ borderWidth: 0,
+ borderColor: '#000',
+ tooltipFormat: new SPFormat('<span style="color: {{color}}">&#9679;</span> {{value}} ({{percent.1}}%)')
+ },
+ // Defaults for box plots
+ box: {
+ raw: false,
+ boxLineColor: '#000',
+ boxFillColor: '#cdf',
+ whiskerColor: '#000',
+ outlierLineColor: '#333',
+ outlierFillColor: '#fff',
+ medianColor: '#f00',
+ showOutliers: true,
+ outlierIQR: 1.5,
+ spotRadius: 1.5,
+ target: undefined,
+ targetColor: '#4a2',
+ chartRangeMax: undefined,
+ chartRangeMin: undefined,
+ tooltipFormat: new SPFormat('{{field:fields}}: {{value}}'),
+ tooltipFormatFieldlistKey: 'field',
+ tooltipValueLookups: { fields: { lq: 'Lower Quartile', med: 'Median',
+ uq: 'Upper Quartile', lo: 'Left Outlier', ro: 'Right Outlier',
+ lw: 'Left Whisker', rw: 'Right Whisker'} }
+ }
+ };
+ };
+
+ // You can have tooltips use a css class other than jqstooltip by specifying tooltipClassname
+ defaultStyles = '.jqstooltip { ' +
+ 'position: absolute;' +
+ 'left: 0px;' +
+ 'top: 0px;' +
+ 'visibility: hidden;' +
+ 'background: rgb(0, 0, 0) transparent;' +
+ 'background-color: rgba(0,0,0,0.6);' +
+ 'filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);' +
+ '-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";' +
+ 'color: white;' +
+ 'font: 10px arial, san serif;' +
+ 'text-align: left;' +
+ 'white-space: nowrap;' +
+ 'padding: 5px;' +
+ 'border: 1px solid white;' +
+ 'z-index: 10000;' +
+ '}' +
+ '.jqsfield { ' +
+ 'color: white;' +
+ 'font: 10px arial, san serif;' +
+ 'text-align: left;' +
+ '}';
+
+ /**
+ * Utilities
+ */
+
+ createClass = function (/* [baseclass, [mixin, ...]], definition */) {
+ var Class, args;
+ Class = function () {
+ this.init.apply(this, arguments);
+ };
+ if (arguments.length > 1) {
+ if (arguments[0]) {
+ Class.prototype = $.extend(new arguments[0](), arguments[arguments.length - 1]);
+ Class._super = arguments[0].prototype;
+ } else {
+ Class.prototype = arguments[arguments.length - 1];
+ }
+ if (arguments.length > 2) {
+ args = Array.prototype.slice.call(arguments, 1, -1);
+ args.unshift(Class.prototype);
+ $.extend.apply($, args);
+ }
+ } else {
+ Class.prototype = arguments[0];
+ }
+ Class.prototype.cls = Class;
+ return Class;
+ };
+
+ /**
+ * Wraps a format string for tooltips
+ * {{x}}
+ * {{x.2}
+ * {{x:months}}
+ */
+ $.SPFormatClass = SPFormat = createClass({
+ fre: /\{\{([\w.]+?)(:(.+?))?\}\}/g,
+ precre: /(\w+)\.(\d+)/,
+
+ init: function (format, fclass) {
+ this.format = format;
+ this.fclass = fclass;
+ },
+
+ render: function (fieldset, lookups, options) {
+ var self = this,
+ fields = fieldset,
+ match, token, lookupkey, fieldvalue, prec;
+ return this.format.replace(this.fre, function () {
+ var lookup;
+ token = arguments[1];
+ lookupkey = arguments[3];
+ match = self.precre.exec(token);
+ if (match) {
+ prec = match[2];
+ token = match[1];
+ } else {
+ prec = false;
+ }
+ fieldvalue = fields[token];
+ if (fieldvalue === undefined) {
+ return '';
+ }
+ if (lookupkey && lookups && lookups[lookupkey]) {
+ lookup = lookups[lookupkey];
+ if (lookup.get) { // RangeMap
+ return lookups[lookupkey].get(fieldvalue) || fieldvalue;
+ } else {
+ return lookups[lookupkey][fieldvalue] || fieldvalue;
+ }
+ }
+ if (isNumber(fieldvalue)) {
+ if (options.get('numberFormatter')) {
+ fieldvalue = options.get('numberFormatter')(fieldvalue);
+ } else {
+ fieldvalue = formatNumber(fieldvalue, prec,
+ options.get('numberDigitGroupCount'),
+ options.get('numberDigitGroupSep'),
+ options.get('numberDecimalMark'));
+ }
+ }
+ return fieldvalue;
+ });
+ }
+ });
+
+ // convience method to avoid needing the new operator
+ $.spformat = function(format, fclass) {
+ return new SPFormat(format, fclass);
+ };
+
+ clipval = function (val, min, max) {
+ if (val < min) {
+ return min;
+ }
+ if (val > max) {
+ return max;
+ }
+ return val;
+ };
+
+ quartile = function (values, q) {
+ var vl;
+ if (q === 2) {
+ vl = Math.floor(values.length / 2);
+ return values.length % 2 ? values[vl] : (values[vl-1] + values[vl]) / 2;
+ } else {
+ if (values.length % 2 ) { // odd
+ vl = (values.length * q + q) / 4;
+ return vl % 1 ? (values[Math.floor(vl)] + values[Math.floor(vl) - 1]) / 2 : values[vl-1];
+ } else { //even
+ vl = (values.length * q + 2) / 4;
+ return vl % 1 ? (values[Math.floor(vl)] + values[Math.floor(vl) - 1]) / 2 : values[vl-1];
+
+ }
+ }
+ };
+
+ normalizeValue = function (val) {
+ var nf;
+ switch (val) {
+ case 'undefined':
+ val = undefined;
+ break;
+ case 'null':
+ val = null;
+ break;
+ case 'true':
+ val = true;
+ break;
+ case 'false':
+ val = false;
+ break;
+ default:
+ nf = parseFloat(val);
+ if (val == nf) {
+ val = nf;
+ }
+ }
+ return val;
+ };
+
+ normalizeValues = function (vals) {
+ var i, result = [];
+ for (i = vals.length; i--;) {
+ result[i] = normalizeValue(vals[i]);
+ }
+ return result;
+ };
+
+ remove = function (vals, filter) {
+ var i, vl, result = [];
+ for (i = 0, vl = vals.length; i < vl; i++) {
+ if (vals[i] !== filter) {
+ result.push(vals[i]);
+ }
+ }
+ return result;
+ };
+
+ isNumber = function (num) {
+ return !isNaN(parseFloat(num)) && isFinite(num);
+ };
+
+ formatNumber = function (num, prec, groupsize, groupsep, decsep) {
+ var p, i;
+ num = (prec === false ? parseFloat(num).toString() : num.toFixed(prec)).split('');
+ p = (p = $.inArray('.', num)) < 0 ? num.length : p;
+ if (p < num.length) {
+ num[p] = decsep;
+ }
+ for (i = p - groupsize; i > 0; i -= groupsize) {
+ num.splice(i, 0, groupsep);
+ }
+ return num.join('');
+ };
+
+ // determine if all values of an array match a value
+ // returns true if the array is empty
+ all = function (val, arr, ignoreNull) {
+ var i;
+ for (i = arr.length; i--; ) {
+ if (ignoreNull && arr[i] === null) continue;
+ if (arr[i] !== val) {
+ return false;
+ }
+ }
+ return true;
+ };
+
+ // sums the numeric values in an array, ignoring other values
+ sum = function (vals) {
+ var total = 0, i;
+ for (i = vals.length; i--;) {
+ total += typeof vals[i] === 'number' ? vals[i] : 0;
+ }
+ return total;
+ };
+
+ ensureArray = function (val) {
+ return $.isArray(val) ? val : [val];
+ };
+
+ // http://paulirish.com/2008/bookmarklet-inject-new-css-rules/
+ addCSS = function(css) {
+ var tag;
+ //if ('\v' == 'v') /* ie only */ {
+ if (document.createStyleSheet) {
+ document.createStyleSheet().cssText = css;
+ } else {
+ tag = document.createElement('style');
+ tag.type = 'text/css';
+ document.getElementsByTagName('head')[0].appendChild(tag);
+ tag[(typeof document.body.style.WebkitAppearance == 'string') /* webkit only */ ? 'innerText' : 'innerHTML'] = css;
+ }
+ };
+
+ // Provide a cross-browser interface to a few simple drawing primitives
+ $.fn.simpledraw = function (width, height, useExisting, interact) {
+ var target, mhandler;
+ if (useExisting && (target = this.data('_jqs_vcanvas'))) {
+ return target;
+ }
+
+ if ($.fn.sparkline.canvas === false) {
+ // We've already determined that neither Canvas nor VML are available
+ return false;
+
+ } else if ($.fn.sparkline.canvas === undefined) {
+ // No function defined yet -- need to see if we support Canvas or VML
+ var el = document.createElement('canvas');
+ if (!!(el.getContext && el.getContext('2d'))) {
+ // Canvas is available
+ $.fn.sparkline.canvas = function(width, height, target, interact) {
+ return new VCanvas_canvas(width, height, target, interact);
+ };
+ } else if (document.namespaces && !document.namespaces.v) {
+ // VML is available
+ document.namespaces.add('v', 'urn:schemas-microsoft-com:vml', '#default#VML');
+ $.fn.sparkline.canvas = function(width, height, target, interact) {
+ return new VCanvas_vml(width, height, target);
+ };
+ } else {
+ // Neither Canvas nor VML are available
+ $.fn.sparkline.canvas = false;
+ return false;
+ }
+ }
+
+ if (width === undefined) {
+ width = $(this).innerWidth();
+ }
+ if (height === undefined) {
+ height = $(this).innerHeight();
+ }
+
+ target = $.fn.sparkline.canvas(width, height, this, interact);
+
+ mhandler = $(this).data('_jqs_mhandler');
+ if (mhandler) {
+ mhandler.registerCanvas(target);
+ }
+ return target;
+ };
+
+ $.fn.cleardraw = function () {
+ var target = this.data('_jqs_vcanvas');
+ if (target) {
+ target.reset();
+ }
+ };
+
+ $.RangeMapClass = RangeMap = createClass({
+ init: function (map) {
+ var key, range, rangelist = [];
+ for (key in map) {
+ if (map.hasOwnProperty(key) && typeof key === 'string' && key.indexOf(':') > -1) {
+ range = key.split(':');
+ range[0] = range[0].length === 0 ? -Infinity : parseFloat(range[0]);
+ range[1] = range[1].length === 0 ? Infinity : parseFloat(range[1]);
+ range[2] = map[key];
+ rangelist.push(range);
+ }
+ }
+ this.map = map;
+ this.rangelist = rangelist || false;
+ },
+
+ get: function (value) {
+ var rangelist = this.rangelist,
+ i, range, result;
+ if ((result = this.map[value]) !== undefined) {
+ return result;
+ }
+ if (rangelist) {
+ for (i = rangelist.length; i--;) {
+ range = rangelist[i];
+ if (range[0] <= value && range[1] >= value) {
+ return range[2];
+ }
+ }
+ }
+ return undefined;
+ }
+ });
+
+ // Convenience function
+ $.range_map = function(map) {
+ return new RangeMap(map);
+ };
+
+ MouseHandler = createClass({
+ init: function (el, options) {
+ var $el = $(el);
+ this.$el = $el;
+ this.options = options;
+ this.currentPageX = 0;
+ this.currentPageY = 0;
+ this.el = el;
+ this.splist = [];
+ this.tooltip = null;
+ this.over = false;
+ this.displayTooltips = !options.get('disableTooltips');
+ this.highlightEnabled = !options.get('disableHighlight');
+ },
+
+ registerSparkline: function (sp) {
+ this.splist.push(sp);
+ if (this.over) {
+ this.updateDisplay();
+ }
+ },
+
+ registerCanvas: function (canvas) {
+ var $canvas = $(canvas.canvas);
+ this.canvas = canvas;
+ this.$canvas = $canvas;
+ $canvas.mouseenter($.proxy(this.mouseenter, this));
+ $canvas.mouseleave($.proxy(this.mouseleave, this));
+ $canvas.click($.proxy(this.mouseclick, this));
+ },
+
+ reset: function (removeTooltip) {
+ this.splist = [];
+ if (this.tooltip && removeTooltip) {
+ this.tooltip.remove();
+ this.tooltip = undefined;
+ }
+ },
+
+ mouseclick: function (e) {
+ var clickEvent = $.Event('sparklineClick');
+ clickEvent.originalEvent = e;
+ clickEvent.sparklines = this.splist;
+ this.$el.trigger(clickEvent);
+ },
+
+ mouseenter: function (e) {
+ $(document.body).unbind('mousemove.jqs');
+ $(document.body).bind('mousemove.jqs', $.proxy(this.mousemove, this));
+ this.over = true;
+ this.currentPageX = e.pageX;
+ this.currentPageY = e.pageY;
+ this.currentEl = e.target;
+ if (!this.tooltip && this.displayTooltips) {
+ this.tooltip = new Tooltip(this.options);
+ this.tooltip.updatePosition(e.pageX, e.pageY);
+ }
+ this.updateDisplay();
+ },
+
+ mouseleave: function () {
+ $(document.body).unbind('mousemove.jqs');
+ var splist = this.splist,
+ spcount = splist.length,
+ needsRefresh = false,
+ sp, i;
+ this.over = false;
+ this.currentEl = null;
+
+ if (this.tooltip) {
+ this.tooltip.remove();
+ this.tooltip = null;
+ }
+
+ for (i = 0; i < spcount; i++) {
+ sp = splist[i];
+ if (sp.clearRegionHighlight()) {
+ needsRefresh = true;
+ }
+ }
+
+ if (needsRefresh) {
+ this.canvas.render();
+ }
+ },
+
+ mousemove: function (e) {
+ this.currentPageX = e.pageX;
+ this.currentPageY = e.pageY;
+ this.currentEl = e.target;
+ if (this.tooltip) {
+ this.tooltip.updatePosition(e.pageX, e.pageY);
+ }
+ this.updateDisplay();
+ },
+
+ updateDisplay: function () {
+ var splist = this.splist,
+ spcount = splist.length,
+ needsRefresh = false,
+ offset = this.$canvas.offset(),
+ localX = this.currentPageX - offset.left,
+ localY = this.currentPageY - offset.top,
+ tooltiphtml, sp, i, result, changeEvent;
+ if (!this.over) {
+ return;
+ }
+ for (i = 0; i < spcount; i++) {
+ sp = splist[i];
+ result = sp.setRegionHighlight(this.currentEl, localX, localY);
+ if (result) {
+ needsRefresh = true;
+ }
+ }
+ if (needsRefresh) {
+ changeEvent = $.Event('sparklineRegionChange');
+ changeEvent.sparklines = this.splist;
+ this.$el.trigger(changeEvent);
+ if (this.tooltip) {
+ tooltiphtml = '';
+ for (i = 0; i < spcount; i++) {
+ sp = splist[i];
+ tooltiphtml += sp.getCurrentRegionTooltip();
+ }
+ this.tooltip.setContent(tooltiphtml);
+ }
+ if (!this.disableHighlight) {
+ this.canvas.render();
+ }
+ }
+ if (result === null) {
+ this.mouseleave();
+ }
+ }
+ });
+
+
+ Tooltip = createClass({
+ sizeStyle: 'position: static !important;' +
+ 'display: block !important;' +
+ 'visibility: hidden !important;' +
+ 'float: left !important;',
+
+ init: function (options) {
+ var tooltipClassname = options.get('tooltipClassname', 'jqstooltip'),
+ sizetipStyle = this.sizeStyle,
+ offset;
+ this.container = options.get('tooltipContainer') || document.body;
+ this.tooltipOffsetX = options.get('tooltipOffsetX', 10);
+ this.tooltipOffsetY = options.get('tooltipOffsetY', 12);
+ // remove any previous lingering tooltip
+ $('#jqssizetip').remove();
+ $('#jqstooltip').remove();
+ this.sizetip = $('<div/>', {
+ id: 'jqssizetip',
+ style: sizetipStyle,
+ 'class': tooltipClassname
+ });
+ this.tooltip = $('<div/>', {
+ id: 'jqstooltip',
+ 'class': tooltipClassname
+ }).appendTo(this.container);
+ // account for the container's location
+ offset = this.tooltip.offset();
+ this.offsetLeft = offset.left;
+ this.offsetTop = offset.top;
+ this.hidden = true;
+ $(window).unbind('resize.jqs scroll.jqs');
+ $(window).bind('resize.jqs scroll.jqs', $.proxy(this.updateWindowDims, this));
+ this.updateWindowDims();
+ },
+
+ updateWindowDims: function () {
+ this.scrollTop = $(window).scrollTop();
+ this.scrollLeft = $(window).scrollLeft();
+ this.scrollRight = this.scrollLeft + $(window).width();
+ this.updatePosition();
+ },
+
+ getSize: function (content) {
+ this.sizetip.html(content).appendTo(this.container);
+ this.width = this.sizetip.width() + 1;
+ this.height = this.sizetip.height();
+ this.sizetip.remove();
+ },
+
+ setContent: function (content) {
+ if (!content) {
+ this.tooltip.css('visibility', 'hidden');
+ this.hidden = true;
+ return;
+ }
+ this.getSize(content);
+ this.tooltip.html(content)
+ .css({
+ 'width': this.width,
+ 'height': this.height,
+ 'visibility': 'visible'
+ });
+ if (this.hidden) {
+ this.hidden = false;
+ this.updatePosition();
+ }
+ },
+
+ updatePosition: function (x, y) {
+ if (x === undefined) {
+ if (this.mousex === undefined) {
+ return;
+ }
+ x = this.mousex - this.offsetLeft;
+ y = this.mousey - this.offsetTop;
+
+ } else {
+ this.mousex = x = x - this.offsetLeft;
+ this.mousey = y = y - this.offsetTop;
+ }
+ if (!this.height || !this.width || this.hidden) {
+ return;
+ }
+
+ y -= this.height + this.tooltipOffsetY;
+ x += this.tooltipOffsetX;
+
+ if (y < this.scrollTop) {
+ y = this.scrollTop;
+ }
+ if (x < this.scrollLeft) {
+ x = this.scrollLeft;
+ } else if (x + this.width > this.scrollRight) {
+ x = this.scrollRight - this.width;
+ }
+
+ this.tooltip.css({
+ 'left': x,
+ 'top': y
+ });
+ },
+
+ remove: function () {
+ this.tooltip.remove();
+ this.sizetip.remove();
+ this.sizetip = this.tooltip = undefined;
+ $(window).unbind('resize.jqs scroll.jqs');
+ }
+ });
+
+ initStyles = function() {
+ addCSS(defaultStyles);
+ };
+
+ $(initStyles);
+
+ pending = [];
+ $.fn.sparkline = function (userValues, userOptions) {
+ return this.each(function () {
+ var options = new $.fn.sparkline.options(this, userOptions),
+ $this = $(this),
+ render, i;
+ render = function () {
+ var values, width, height, tmp, mhandler, sp, vals;
+ if (userValues === 'html' || userValues === undefined) {
+ vals = this.getAttribute(options.get('tagValuesAttribute'));
+ if (vals === undefined || vals === null) {
+ vals = $this.html();
+ }
+ values = vals.replace(/(^\s*<!--)|(-->\s*$)|\s+/g, '').split(',');
+ } else {
+ values = userValues;
+ }
+
+ width = options.get('width') === 'auto' ? values.length * options.get('defaultPixelsPerValue') : options.get('width');
+ if (options.get('height') === 'auto') {
+ if (!options.get('composite') || !$.data(this, '_jqs_vcanvas')) {
+ // must be a better way to get the line height
+ tmp = document.createElement('span');
+ tmp.innerHTML = 'a';
+ $this.html(tmp);
+ height = $(tmp).innerHeight() || $(tmp).height();
+ $(tmp).remove();
+ tmp = null;
+ }
+ } else {
+ height = options.get('height');
+ }
+
+ if (!options.get('disableInteraction')) {
+ mhandler = $.data(this, '_jqs_mhandler');
+ if (!mhandler) {
+ mhandler = new MouseHandler(this, options);
+ $.data(this, '_jqs_mhandler', mhandler);
+ } else if (!options.get('composite')) {
+ mhandler.reset();
+ }
+ } else {
+ mhandler = false;
+ }
+
+ if (options.get('composite') && !$.data(this, '_jqs_vcanvas')) {
+ if (!$.data(this, '_jqs_errnotify')) {
+ alert('Attempted to attach a composite sparkline to an element with no existing sparkline');
+ $.data(this, '_jqs_errnotify', true);
+ }
+ return;
+ }
+
+ sp = new $.fn.sparkline[options.get('type')](this, values, options, width, height);
+
+ sp.render();
+
+ if (mhandler) {
+ mhandler.registerSparkline(sp);
+ }
+ };
+ if (($(this).html() && !options.get('disableHiddenCheck') && $(this).is(':hidden')) || !$(this).parents('body').length) {
+ if (!options.get('composite') && $.data(this, '_jqs_pending')) {
+ // remove any existing references to the element
+ for (i = pending.length; i; i--) {
+ if (pending[i - 1][0] == this) {
+ pending.splice(i - 1, 1);
+ }
+ }
+ }
+ pending.push([this, render]);
+ $.data(this, '_jqs_pending', true);
+ } else {
+ render.call(this);
+ }
+ });
+ };
+
+ $.fn.sparkline.defaults = getDefaults();
+
+
+ $.sparkline_display_visible = function () {
+ var el, i, pl;
+ var done = [];
+ for (i = 0, pl = pending.length; i < pl; i++) {
+ el = pending[i][0];
+ if ($(el).is(':visible') && !$(el).parents().is(':hidden')) {
+ pending[i][1].call(el);
+ $.data(pending[i][0], '_jqs_pending', false);
+ done.push(i);
+ } else if (!$(el).closest('html').length && !$.data(el, '_jqs_pending')) {
+ // element has been inserted and removed from the DOM
+ // If it was not yet inserted into the dom then the .data request
+ // will return true.
+ // removing from the dom causes the data to be removed.
+ $.data(pending[i][0], '_jqs_pending', false);
+ done.push(i);
+ }
+ }
+ for (i = done.length; i; i--) {
+ pending.splice(done[i - 1], 1);
+ }
+ };
+
+
+ /**
+ * User option handler
+ */
+ $.fn.sparkline.options = createClass({
+ init: function (tag, userOptions) {
+ var extendedOptions, defaults, base, tagOptionType;
+ this.userOptions = userOptions = userOptions || {};
+ this.tag = tag;
+ this.tagValCache = {};
+ defaults = $.fn.sparkline.defaults;
+ base = defaults.common;
+ this.tagOptionsPrefix = userOptions.enableTagOptions && (userOptions.tagOptionsPrefix || base.tagOptionsPrefix);
+
+ tagOptionType = this.getTagSetting('type');
+ if (tagOptionType === UNSET_OPTION) {
+ extendedOptions = defaults[userOptions.type || base.type];
+ } else {
+ extendedOptions = defaults[tagOptionType];
+ }
+ this.mergedOptions = $.extend({}, base, extendedOptions, userOptions);
+ },
+
+
+ getTagSetting: function (key) {
+ var prefix = this.tagOptionsPrefix,
+ val, i, pairs, keyval;
+ if (prefix === false || prefix === undefined) {
+ return UNSET_OPTION;
+ }
+ if (this.tagValCache.hasOwnProperty(key)) {
+ val = this.tagValCache.key;
+ } else {
+ val = this.tag.getAttribute(prefix + key);
+ if (val === undefined || val === null) {
+ val = UNSET_OPTION;
+ } else if (val.substr(0, 1) === '[') {
+ val = val.substr(1, val.length - 2).split(',');
+ for (i = val.length; i--;) {
+ val[i] = normalizeValue(val[i].replace(/(^\s*)|(\s*$)/g, ''));
+ }
+ } else if (val.substr(0, 1) === '{') {
+ pairs = val.substr(1, val.length - 2).split(',');
+ val = {};
+ for (i = pairs.length; i--;) {
+ keyval = pairs[i].split(':', 2);
+ val[keyval[0].replace(/(^\s*)|(\s*$)/g, '')] = normalizeValue(keyval[1].replace(/(^\s*)|(\s*$)/g, ''));
+ }
+ } else {
+ val = normalizeValue(val);
+ }
+ this.tagValCache.key = val;
+ }
+ return val;
+ },
+
+ get: function (key, defaultval) {
+ var tagOption = this.getTagSetting(key),
+ result;
+ if (tagOption !== UNSET_OPTION) {
+ return tagOption;
+ }
+ return (result = this.mergedOptions[key]) === undefined ? defaultval : result;
+ }
+ });
+
+
+ $.fn.sparkline._base = createClass({
+ disabled: false,
+
+ init: function (el, values, options, width, height) {
+ this.el = el;
+ this.$el = $(el);
+ this.values = values;
+ this.options = options;
+ this.width = width;
+ this.height = height;
+ this.currentRegion = undefined;
+ },
+
+ /**
+ * Setup the canvas
+ */
+ initTarget: function () {
+ var interactive = !this.options.get('disableInteraction');
+ if (!(this.target = this.$el.simpledraw(this.width, this.height, this.options.get('composite'), interactive))) {
+ this.disabled = true;
+ } else {
+ this.canvasWidth = this.target.pixelWidth;
+ this.canvasHeight = this.target.pixelHeight;
+ }
+ },
+
+ /**
+ * Actually render the chart to the canvas
+ */
+ render: function () {
+ if (this.disabled) {
+ this.el.innerHTML = '';
+ return false;
+ }
+ return true;
+ },
+
+ /**
+ * Return a region id for a given x/y co-ordinate
+ */
+ getRegion: function (x, y) {
+ },
+
+ /**
+ * Highlight an item based on the moused-over x,y co-ordinate
+ */
+ setRegionHighlight: function (el, x, y) {
+ var currentRegion = this.currentRegion,
+ highlightEnabled = !this.options.get('disableHighlight'),
+ newRegion;
+ if (x > this.canvasWidth || y > this.canvasHeight || x < 0 || y < 0) {
+ return null;
+ }
+ newRegion = this.getRegion(el, x, y);
+ if (currentRegion !== newRegion) {
+ if (currentRegion !== undefined && highlightEnabled) {
+ this.removeHighlight();
+ }
+ this.currentRegion = newRegion;
+ if (newRegion !== undefined && highlightEnabled) {
+ this.renderHighlight();
+ }
+ return true;
+ }
+ return false;
+ },
+
+ /**
+ * Reset any currently highlighted item
+ */
+ clearRegionHighlight: function () {
+ if (this.currentRegion !== undefined) {
+ this.removeHighlight();
+ this.currentRegion = undefined;
+ return true;
+ }
+ return false;
+ },
+
+ renderHighlight: function () {
+ this.changeHighlight(true);
+ },
+
+ removeHighlight: function () {
+ this.changeHighlight(false);
+ },
+
+ changeHighlight: function (highlight) {},
+
+ /**
+ * Fetch the HTML to display as a tooltip
+ */
+ getCurrentRegionTooltip: function () {
+ var options = this.options,
+ header = '',
+ entries = [],
+ fields, formats, formatlen, fclass, text, i,
+ showFields, showFieldsKey, newFields, fv,
+ formatter, format, fieldlen, j;
+ if (this.currentRegion === undefined) {
+ return '';
+ }
+ fields = this.getCurrentRegionFields();
+ formatter = options.get('tooltipFormatter');
+ if (formatter) {
+ return formatter(this, options, fields);
+ }
+ if (options.get('tooltipChartTitle')) {
+ header += '<div class="jqs jqstitle">' + options.get('tooltipChartTitle') + '</div>\n';
+ }
+ formats = this.options.get('tooltipFormat');
+ if (!formats) {
+ return '';
+ }
+ if (!$.isArray(formats)) {
+ formats = [formats];
+ }
+ if (!$.isArray(fields)) {
+ fields = [fields];
+ }
+ showFields = this.options.get('tooltipFormatFieldlist');
+ showFieldsKey = this.options.get('tooltipFormatFieldlistKey');
+ if (showFields && showFieldsKey) {
+ // user-selected ordering of fields
+ newFields = [];
+ for (i = fields.length; i--;) {
+ fv = fields[i][showFieldsKey];
+ if ((j = $.inArray(fv, showFields)) != -1) {
+ newFields[j] = fields[i];
+ }
+ }
+ fields = newFields;
+ }
+ formatlen = formats.length;
+ fieldlen = fields.length;
+ for (i = 0; i < formatlen; i++) {
+ format = formats[i];
+ if (typeof format === 'string') {
+ format = new SPFormat(format);
+ }
+ fclass = format.fclass || 'jqsfield';
+ for (j = 0; j < fieldlen; j++) {
+ if (!fields[j].isNull || !options.get('tooltipSkipNull')) {
+ $.extend(fields[j], {
+ prefix: options.get('tooltipPrefix'),
+ suffix: options.get('tooltipSuffix')
+ });
+ text = format.render(fields[j], options.get('tooltipValueLookups'), options);
+ entries.push('<div class="' + fclass + '">' + text + '</div>');
+ }
+ }
+ }
+ if (entries.length) {
+ return header + entries.join('\n');
+ }
+ return '';
+ },
+
+ getCurrentRegionFields: function () {},
+
+ calcHighlightColor: function (color, options) {
+ var highlightColor = options.get('highlightColor'),
+ lighten = options.get('highlightLighten'),
+ parse, mult, rgbnew, i;
+ if (highlightColor) {
+ return highlightColor;
+ }
+ if (lighten) {
+ // extract RGB values
+ parse = /^#([0-9a-f])([0-9a-f])([0-9a-f])$/i.exec(color) || /^#([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})$/i.exec(color);
+ if (parse) {
+ rgbnew = [];
+ mult = color.length === 4 ? 16 : 1;
+ for (i = 0; i < 3; i++) {
+ rgbnew[i] = clipval(Math.round(parseInt(parse[i + 1], 16) * mult * lighten), 0, 255);
+ }
+ return 'rgb(' + rgbnew.join(',') + ')';
+ }
+
+ }
+ return color;
+ }
+
+ });
+
+ barHighlightMixin = {
+ changeHighlight: function (highlight) {
+ var currentRegion = this.currentRegion,
+ target = this.target,
+ shapeids = this.regionShapes[currentRegion],
+ newShapes;
+ // will be null if the region value was null
+ if (shapeids) {
+ newShapes = this.renderRegion(currentRegion, highlight);
+ if ($.isArray(newShapes) || $.isArray(shapeids)) {
+ target.replaceWithShapes(shapeids, newShapes);
+ this.regionShapes[currentRegion] = $.map(newShapes, function (newShape) {
+ return newShape.id;
+ });
+ } else {
+ target.replaceWithShape(shapeids, newShapes);
+ this.regionShapes[currentRegion] = newShapes.id;
+ }
+ }
+ },
+
+ render: function () {
+ var values = this.values,
+ target = this.target,
+ regionShapes = this.regionShapes,
+ shapes, ids, i, j;
+
+ if (!this.cls._super.render.call(this)) {
+ return;
+ }
+ for (i = values.length; i--;) {
+ shapes = this.renderRegion(i);
+ if (shapes) {
+ if ($.isArray(shapes)) {
+ ids = [];
+ for (j = shapes.length; j--;) {
+ shapes[j].append();
+ ids.push(shapes[j].id);
+ }
+ regionShapes[i] = ids;
+ } else {
+ shapes.append();
+ regionShapes[i] = shapes.id; // store just the shapeid
+ }
+ } else {
+ // null value
+ regionShapes[i] = null;
+ }
+ }
+ target.render();
+ }
+ };
+
+ /**
+ * Line charts
+ */
+ $.fn.sparkline.line = line = createClass($.fn.sparkline._base, {
+ type: 'line',
+
+ init: function (el, values, options, width, height) {
+ line._super.init.call(this, el, values, options, width, height);
+ this.vertices = [];
+ this.regionMap = [];
+ this.xvalues = [];
+ this.yvalues = [];
+ this.yminmax = [];
+ this.hightlightSpotId = null;
+ this.lastShapeId = null;
+ this.initTarget();
+ },
+
+ getRegion: function (el, x, y) {
+ var i,
+ regionMap = this.regionMap; // maps regions to value positions
+ for (i = regionMap.length; i--;) {
+ if (regionMap[i] !== null && x >= regionMap[i][0] && x <= regionMap[i][1]) {
+ return regionMap[i][2];
+ }
+ }
+ return undefined;
+ },
+
+ getCurrentRegionFields: function () {
+ var currentRegion = this.currentRegion;
+ return {
+ isNull: this.yvalues[currentRegion] === null,
+ x: this.xvalues[currentRegion],
+ y: this.yvalues[currentRegion],
+ color: this.options.get('lineColor'),
+ fillColor: this.options.get('fillColor'),
+ offset: currentRegion
+ };
+ },
+
+ renderHighlight: function () {
+ var currentRegion = this.currentRegion,
+ target = this.target,
+ vertex = this.vertices[currentRegion],
+ options = this.options,
+ spotRadius = options.get('spotRadius'),
+ highlightSpotColor = options.get('highlightSpotColor'),
+ highlightLineColor = options.get('highlightLineColor'),
+ highlightSpot, highlightLine;
+
+ if (!vertex) {
+ return;
+ }
+ if (spotRadius && highlightSpotColor) {
+ highlightSpot = target.drawCircle(vertex[0], vertex[1],
+ spotRadius, undefined, highlightSpotColor);
+ this.highlightSpotId = highlightSpot.id;
+ target.insertAfterShape(this.lastShapeId, highlightSpot);
+ }
+ if (highlightLineColor) {
+ highlightLine = target.drawLine(vertex[0], this.canvasTop, vertex[0],
+ this.canvasTop + this.canvasHeight, highlightLineColor);
+ this.highlightLineId = highlightLine.id;
+ target.insertAfterShape(this.lastShapeId, highlightLine);
+ }
+ },
+
+ removeHighlight: function () {
+ var target = this.target;
+ if (this.highlightSpotId) {
+ target.removeShapeId(this.highlightSpotId);
+ this.highlightSpotId = null;
+ }
+ if (this.highlightLineId) {
+ target.removeShapeId(this.highlightLineId);
+ this.highlightLineId = null;
+ }
+ },
+
+ scanValues: function () {
+ var values = this.values,
+ valcount = values.length,
+ xvalues = this.xvalues,
+ yvalues = this.yvalues,
+ yminmax = this.yminmax,
+ i, val, isStr, isArray, sp;
+ for (i = 0; i < valcount; i++) {
+ val = values[i];
+ isStr = typeof(values[i]) === 'string';
+ isArray = typeof(values[i]) === 'object' && values[i] instanceof Array;
+ sp = isStr && values[i].split(':');
+ if (isStr && sp.length === 2) { // x:y
+ xvalues.push(Number(sp[0]));
+ yvalues.push(Number(sp[1]));
+ yminmax.push(Number(sp[1]));
+ } else if (isArray) {
+ xvalues.push(val[0]);
+ yvalues.push(val[1]);
+ yminmax.push(val[1]);
+ } else {
+ xvalues.push(i);
+ if (values[i] === null || values[i] === 'null') {
+ yvalues.push(null);
+ } else {
+ yvalues.push(Number(val));
+ yminmax.push(Number(val));
+ }
+ }
+ }
+ if (this.options.get('xvalues')) {
+ xvalues = this.options.get('xvalues');
+ }
+
+ this.maxy = this.maxyorg = Math.max.apply(Math, yminmax);
+ this.miny = this.minyorg = Math.min.apply(Math, yminmax);
+
+ this.maxx = Math.max.apply(Math, xvalues);
+ this.minx = Math.min.apply(Math, xvalues);
+
+ this.xvalues = xvalues;
+ this.yvalues = yvalues;
+ this.yminmax = yminmax;
+
+ },
+
+ processRangeOptions: function () {
+ var options = this.options,
+ normalRangeMin = options.get('normalRangeMin'),
+ normalRangeMax = options.get('normalRangeMax');
+
+ if (normalRangeMin !== undefined) {
+ if (normalRangeMin < this.miny) {
+ this.miny = normalRangeMin;
+ }
+ if (normalRangeMax > this.maxy) {
+ this.maxy = normalRangeMax;
+ }
+ }
+ if (options.get('chartRangeMin') !== undefined && (options.get('chartRangeClip') || options.get('chartRangeMin') < this.miny)) {
+ this.miny = options.get('chartRangeMin');
+ }
+ if (options.get('chartRangeMax') !== undefined && (options.get('chartRangeClip') || options.get('chartRangeMax') > this.maxy)) {
+ this.maxy = options.get('chartRangeMax');
+ }
+ if (options.get('chartRangeMinX') !== undefined && (options.get('chartRangeClipX') || options.get('chartRangeMinX') < this.minx)) {
+ this.minx = options.get('chartRangeMinX');
+ }
+ if (options.get('chartRangeMaxX') !== undefined && (options.get('chartRangeClipX') || options.get('chartRangeMaxX') > this.maxx)) {
+ this.maxx = options.get('chartRangeMaxX');
+ }
+
+ },
+
+ drawNormalRange: function (canvasLeft, canvasTop, canvasHeight, canvasWidth, rangey) {
+ var normalRangeMin = this.options.get('normalRangeMin'),
+ normalRangeMax = this.options.get('normalRangeMax'),
+ ytop = canvasTop + Math.round(canvasHeight - (canvasHeight * ((normalRangeMax - this.miny) / rangey))),
+ height = Math.round((canvasHeight * (normalRangeMax - normalRangeMin)) / rangey);
+ this.target.drawRect(canvasLeft, ytop, canvasWidth, height, undefined, this.options.get('normalRangeColor')).append();
+ },
+
+ render: function () {
+ var options = this.options,
+ target = this.target,
+ canvasWidth = this.canvasWidth,
+ canvasHeight = this.canvasHeight,
+ vertices = this.vertices,
+ spotRadius = options.get('spotRadius'),
+ regionMap = this.regionMap,
+ rangex, rangey, yvallast,
+ canvasTop, canvasLeft,
+ vertex, path, paths, x, y, xnext, xpos, xposnext,
+ last, next, yvalcount, lineShapes, fillShapes, plen,
+ valueSpots, hlSpotsEnabled, color, xvalues, yvalues, i;
+
+ if (!line._super.render.call(this)) {
+ return;
+ }
+
+ this.scanValues();
+ this.processRangeOptions();
+
+ xvalues = this.xvalues;
+ yvalues = this.yvalues;
+
+ if (!this.yminmax.length || this.yvalues.length < 2) {
+ // empty or all null valuess
+ return;
+ }
+
+ canvasTop = canvasLeft = 0;
+
+ rangex = this.maxx - this.minx === 0 ? 1 : this.maxx - this.minx;
+ rangey = this.maxy - this.miny === 0 ? 1 : this.maxy - this.miny;
+ yvallast = this.yvalues.length - 1;
+
+ if (spotRadius && (canvasWidth < (spotRadius * 4) || canvasHeight < (spotRadius * 4))) {
+ spotRadius = 0;
+ }
+ if (spotRadius) {
+ // adjust the canvas size as required so that spots will fit
+ hlSpotsEnabled = options.get('highlightSpotColor') && !options.get('disableInteraction');
+ if (hlSpotsEnabled || options.get('minSpotColor') || (options.get('spotColor') && yvalues[yvallast] === this.miny)) {
+ canvasHeight -= Math.ceil(spotRadius);
+ }
+ if (hlSpotsEnabled || options.get('maxSpotColor') || (options.get('spotColor') && yvalues[yvallast] === this.maxy)) {
+ canvasHeight -= Math.ceil(spotRadius);
+ canvasTop += Math.ceil(spotRadius);
+ }
+ if (hlSpotsEnabled ||
+ ((options.get('minSpotColor') || options.get('maxSpotColor')) && (yvalues[0] === this.miny || yvalues[0] === this.maxy))) {
+ canvasLeft += Math.ceil(spotRadius);
+ canvasWidth -= Math.ceil(spotRadius);
+ }
+ if (hlSpotsEnabled || options.get('spotColor') ||
+ (options.get('minSpotColor') || options.get('maxSpotColor') &&
+ (yvalues[yvallast] === this.miny || yvalues[yvallast] === this.maxy))) {
+ canvasWidth -= Math.ceil(spotRadius);
+ }
+ }
+
+
+ canvasHeight--;
+
+ if (options.get('normalRangeMin') !== undefined && !options.get('drawNormalOnTop')) {
+ this.drawNormalRange(canvasLeft, canvasTop, canvasHeight, canvasWidth, rangey);
+ }
+
+ path = [];
+ paths = [path];
+ last = next = null;
+ yvalcount = yvalues.length;
+ for (i = 0; i < yvalcount; i++) {
+ x = xvalues[i];
+ xnext = xvalues[i + 1];
+ y = yvalues[i];
+ xpos = canvasLeft + Math.round((x - this.minx) * (canvasWidth / rangex));
+ xposnext = i < yvalcount - 1 ? canvasLeft + Math.round((xnext - this.minx) * (canvasWidth / rangex)) : canvasWidth;
+ next = xpos + ((xposnext - xpos) / 2);
+ regionMap[i] = [last || 0, next, i];
+ last = next;
+ if (y === null) {
+ if (i) {
+ if (yvalues[i - 1] !== null) {
+ path = [];
+ paths.push(path);
+ }
+ vertices.push(null);
+ }
+ } else {
+ if (y < this.miny) {
+ y = this.miny;
+ }
+ if (y > this.maxy) {
+ y = this.maxy;
+ }
+ if (!path.length) {
+ // previous value was null
+ path.push([xpos, canvasTop + canvasHeight]);
+ }
+ vertex = [xpos, canvasTop + Math.round(canvasHeight - (canvasHeight * ((y - this.miny) / rangey)))];
+ path.push(vertex);
+ vertices.push(vertex);
+ }
+ }
+
+ lineShapes = [];
+ fillShapes = [];
+ plen = paths.length;
+ for (i = 0; i < plen; i++) {
+ path = paths[i];
+ if (path.length) {
+ if (options.get('fillColor')) {
+ path.push([path[path.length - 1][0], (canvasTop + canvasHeight)]);
+ fillShapes.push(path.slice(0));
+ path.pop();
+ }
+ // if there's only a single point in this path, then we want to display it
+ // as a vertical line which means we keep path[0] as is
+ if (path.length > 2) {
+ // else we want the first value
+ path[0] = [path[0][0], path[1][1]];
+ }
+ lineShapes.push(path);
+ }
+ }
+
+ // draw the fill first, then optionally the normal range, then the line on top of that
+ plen = fillShapes.length;
+ for (i = 0; i < plen; i++) {
+ target.drawShape(fillShapes[i],
+ options.get('fillColor'), options.get('fillColor')).append();
+ }
+
+ if (options.get('normalRangeMin') !== undefined && options.get('drawNormalOnTop')) {
+ this.drawNormalRange(canvasLeft, canvasTop, canvasHeight, canvasWidth, rangey);
+ }
+
+ plen = lineShapes.length;
+ for (i = 0; i < plen; i++) {
+ target.drawShape(lineShapes[i], options.get('lineColor'), undefined,
+ options.get('lineWidth')).append();
+ }
+
+ if (spotRadius && options.get('valueSpots')) {
+ valueSpots = options.get('valueSpots');
+ if (valueSpots.get === undefined) {
+ valueSpots = new RangeMap(valueSpots);
+ }
+ for (i = 0; i < yvalcount; i++) {
+ color = valueSpots.get(yvalues[i]);
+ if (color) {
+ target.drawCircle(canvasLeft + Math.round((xvalues[i] - this.minx) * (canvasWidth / rangex)),
+ canvasTop + Math.round(canvasHeight - (canvasHeight * ((yvalues[i] - this.miny) / rangey))),
+ spotRadius, undefined,
+ color).append();
+ }
+ }
+
+ }
+ if (spotRadius && options.get('spotColor') && yvalues[yvallast] !== null) {
+ target.drawCircle(canvasLeft + Math.round((xvalues[xvalues.length - 1] - this.minx) * (canvasWidth / rangex)),
+ canvasTop + Math.round(canvasHeight - (canvasHeight * ((yvalues[yvallast] - this.miny) / rangey))),
+ spotRadius, undefined,
+ options.get('spotColor')).append();
+ }
+ if (this.maxy !== this.minyorg) {
+ if (spotRadius && options.get('minSpotColor')) {
+ x = xvalues[$.inArray(this.minyorg, yvalues)];
+ target.drawCircle(canvasLeft + Math.round((x - this.minx) * (canvasWidth / rangex)),
+ canvasTop + Math.round(canvasHeight - (canvasHeight * ((this.minyorg - this.miny) / rangey))),
+ spotRadius, undefined,
+ options.get('minSpotColor')).append();
+ }
+ if (spotRadius && options.get('maxSpotColor')) {
+ x = xvalues[$.inArray(this.maxyorg, yvalues)];
+ target.drawCircle(canvasLeft + Math.round((x - this.minx) * (canvasWidth / rangex)),
+ canvasTop + Math.round(canvasHeight - (canvasHeight * ((this.maxyorg - this.miny) / rangey))),
+ spotRadius, undefined,
+ options.get('maxSpotColor')).append();
+ }
+ }
+
+ this.lastShapeId = target.getLastShapeId();
+ this.canvasTop = canvasTop;
+ target.render();
+ }
+ });
+
+ /**
+ * Bar charts
+ */
+ $.fn.sparkline.bar = bar = createClass($.fn.sparkline._base, barHighlightMixin, {
+ type: 'bar',
+
+ init: function (el, values, options, width, height) {
+ var barWidth = parseInt(options.get('barWidth'), 10),
+ barSpacing = parseInt(options.get('barSpacing'), 10),
+ chartRangeMin = options.get('chartRangeMin'),
+ chartRangeMax = options.get('chartRangeMax'),
+ chartRangeClip = options.get('chartRangeClip'),
+ stackMin = Infinity,
+ stackMax = -Infinity,
+ isStackString, groupMin, groupMax, stackRanges,
+ numValues, i, vlen, range, zeroAxis, xaxisOffset, min, max, clipMin, clipMax,
+ stacked, vlist, j, slen, svals, val, yoffset, yMaxCalc, canvasHeightEf;
+ bar._super.init.call(this, el, values, options, width, height);
+
+ // scan values to determine whether to stack bars
+ for (i = 0, vlen = values.length; i < vlen; i++) {
+ val = values[i];
+ isStackString = typeof(val) === 'string' && val.indexOf(':') > -1;
+ if (isStackString || $.isArray(val)) {
+ stacked = true;
+ if (isStackString) {
+ val = values[i] = normalizeValues(val.split(':'));
+ }
+ val = remove(val, null); // min/max will treat null as zero
+ groupMin = Math.min.apply(Math, val);
+ groupMax = Math.max.apply(Math, val);
+ if (groupMin < stackMin) {
+ stackMin = groupMin;
+ }
+ if (groupMax > stackMax) {
+ stackMax = groupMax;
+ }
+ }
+ }
+
+ this.stacked = stacked;
+ this.regionShapes = {};
+ this.barWidth = barWidth;
+ this.barSpacing = barSpacing;
+ this.totalBarWidth = barWidth + barSpacing;
+ this.width = width = (values.length * barWidth) + ((values.length - 1) * barSpacing);
+
+ this.initTarget();
+
+ if (chartRangeClip) {
+ clipMin = chartRangeMin === undefined ? -Infinity : chartRangeMin;
+ clipMax = chartRangeMax === undefined ? Infinity : chartRangeMax;
+ }
+
+ numValues = [];
+ stackRanges = stacked ? [] : numValues;
+ var stackTotals = [];
+ var stackRangesNeg = [];
+ for (i = 0, vlen = values.length; i < vlen; i++) {
+ if (stacked) {
+ vlist = values[i];
+ values[i] = svals = [];
+ stackTotals[i] = 0;
+ stackRanges[i] = stackRangesNeg[i] = 0;
+ for (j = 0, slen = vlist.length; j < slen; j++) {
+ val = svals[j] = chartRangeClip ? clipval(vlist[j], clipMin, clipMax) : vlist[j];
+ if (val !== null) {
+ if (val > 0) {
+ stackTotals[i] += val;
+ }
+ if (stackMin < 0 && stackMax > 0) {
+ if (val < 0) {
+ stackRangesNeg[i] += Math.abs(val);
+ } else {
+ stackRanges[i] += val;
+ }
+ } else {
+ stackRanges[i] += Math.abs(val - (val < 0 ? stackMax : stackMin));
+ }
+ numValues.push(val);
+ }
+ }
+ } else {
+ val = chartRangeClip ? clipval(values[i], clipMin, clipMax) : values[i];
+ val = values[i] = normalizeValue(val);
+ if (val !== null) {
+ numValues.push(val);
+ }
+ }
+ }
+ this.max = max = Math.max.apply(Math, numValues);
+ this.min = min = Math.min.apply(Math, numValues);
+ this.stackMax = stackMax = stacked ? Math.max.apply(Math, stackTotals) : max;
+ this.stackMin = stackMin = stacked ? Math.min.apply(Math, numValues) : min;
+
+ if (options.get('chartRangeMin') !== undefined && (options.get('chartRangeClip') || options.get('chartRangeMin') < min)) {
+ min = options.get('chartRangeMin');
+ }
+ if (options.get('chartRangeMax') !== undefined && (options.get('chartRangeClip') || options.get('chartRangeMax') > max)) {
+ max = options.get('chartRangeMax');
+ }
+
+ this.zeroAxis = zeroAxis = options.get('zeroAxis', true);
+ if (min <= 0 && max >= 0 && zeroAxis) {
+ xaxisOffset = 0;
+ } else if (zeroAxis == false) {
+ xaxisOffset = min;
+ } else if (min > 0) {
+ xaxisOffset = min;
+ } else {
+ xaxisOffset = max;
+ }
+ this.xaxisOffset = xaxisOffset;
+
+ range = stacked ? (Math.max.apply(Math, stackRanges) + Math.max.apply(Math, stackRangesNeg)) : max - min;
+
+ // as we plot zero/min values a single pixel line, we add a pixel to all other
+ // values - Reduce the effective canvas size to suit
+ this.canvasHeightEf = (zeroAxis && min < 0) ? this.canvasHeight - 2 : this.canvasHeight - 1;
+
+ if (min < xaxisOffset) {
+ yMaxCalc = (stacked && max >= 0) ? stackMax : max;
+ yoffset = (yMaxCalc - xaxisOffset) / range * this.canvasHeight;
+ if (yoffset !== Math.ceil(yoffset)) {
+ this.canvasHeightEf -= 2;
+ yoffset = Math.ceil(yoffset);
+ }
+ } else {
+ yoffset = this.canvasHeight;
+ }
+ this.yoffset = yoffset;
+
+ if ($.isArray(options.get('colorMap'))) {
+ this.colorMapByIndex = options.get('colorMap');
+ this.colorMapByValue = null;
+ } else {
+ this.colorMapByIndex = null;
+ this.colorMapByValue = options.get('colorMap');
+ if (this.colorMapByValue && this.colorMapByValue.get === undefined) {
+ this.colorMapByValue = new RangeMap(this.colorMapByValue);
+ }
+ }
+
+ this.range = range;
+ },
+
+ getRegion: function (el, x, y) {
+ var result = Math.floor(x / this.totalBarWidth);
+ return (result < 0 || result >= this.values.length) ? undefined : result;
+ },
+
+ getCurrentRegionFields: function () {
+ var currentRegion = this.currentRegion,
+ values = ensureArray(this.values[currentRegion]),
+ result = [],
+ value, i;
+ for (i = values.length; i--;) {
+ value = values[i];
+ result.push({
+ isNull: value === null,
+ value: value,
+ color: this.calcColor(i, value, currentRegion),
+ offset: currentRegion
+ });
+ }
+ return result;
+ },
+
+ calcColor: function (stacknum, value, valuenum) {
+ var colorMapByIndex = this.colorMapByIndex,
+ colorMapByValue = this.colorMapByValue,
+ options = this.options,
+ color, newColor;
+ if (this.stacked) {
+ color = options.get('stackedBarColor');
+ } else {
+ color = (value < 0) ? options.get('negBarColor') : options.get('barColor');
+ }
+ if (value === 0 && options.get('zeroColor') !== undefined) {
+ color = options.get('zeroColor');
+ }
+ if (colorMapByValue && (newColor = colorMapByValue.get(value))) {
+ color = newColor;
+ } else if (colorMapByIndex && colorMapByIndex.length > valuenum) {
+ color = colorMapByIndex[valuenum];
+ }
+ return $.isArray(color) ? color[stacknum % color.length] : color;
+ },
+
+ /**
+ * Render bar(s) for a region
+ */
+ renderRegion: function (valuenum, highlight) {
+ var vals = this.values[valuenum],
+ options = this.options,
+ xaxisOffset = this.xaxisOffset,
+ result = [],
+ range = this.range,
+ stacked = this.stacked,
+ target = this.target,
+ x = valuenum * this.totalBarWidth,
+ canvasHeightEf = this.canvasHeightEf,
+ yoffset = this.yoffset,
+ y, height, color, isNull, yoffsetNeg, i, valcount, val, minPlotted, allMin;
+
+ vals = $.isArray(vals) ? vals : [vals];
+ valcount = vals.length;
+ val = vals[0];
+ isNull = all(null, vals);
+ allMin = all(xaxisOffset, vals, true);
+
+ if (isNull) {
+ if (options.get('nullColor')) {
+ color = highlight ? options.get('nullColor') : this.calcHighlightColor(options.get('nullColor'), options);
+ y = (yoffset > 0) ? yoffset - 1 : yoffset;
+ return target.drawRect(x, y, this.barWidth - 1, 0, color, color);
+ } else {
+ return undefined;
+ }
+ }
+ yoffsetNeg = yoffset;
+ for (i = 0; i < valcount; i++) {
+ val = vals[i];
+
+ if (stacked && val === xaxisOffset) {
+ if (!allMin || minPlotted) {
+ continue;
+ }
+ minPlotted = true;
+ }
+
+ if (range > 0) {
+ height = Math.floor(canvasHeightEf * ((Math.abs(val - xaxisOffset) / range))) + 1;
+ } else {
+ height = 1;
+ }
+ if (val < xaxisOffset || (val === xaxisOffset && yoffset === 0)) {
+ y = yoffsetNeg;
+ yoffsetNeg += height;
+ } else {
+ y = yoffset - height;
+ yoffset -= height;
+ }
+ color = this.calcColor(i, val, valuenum);
+ if (highlight) {
+ color = this.calcHighlightColor(color, options);
+ }
+ result.push(target.drawRect(x, y, this.barWidth - 1, height - 1, color, color));
+ }
+ if (result.length === 1) {
+ return result[0];
+ }
+ return result;
+ }
+ });
+
+ /**
+ * Tristate charts
+ */
+ $.fn.sparkline.tristate = tristate = createClass($.fn.sparkline._base, barHighlightMixin, {
+ type: 'tristate',
+
+ init: function (el, values, options, width, height) {
+ var barWidth = parseInt(options.get('barWidth'), 10),
+ barSpacing = parseInt(options.get('barSpacing'), 10);
+ tristate._super.init.call(this, el, values, options, width, height);
+
+ this.regionShapes = {};
+ this.barWidth = barWidth;
+ this.barSpacing = barSpacing;
+ this.totalBarWidth = barWidth + barSpacing;
+ this.values = $.map(values, Number);
+ this.width = width = (values.length * barWidth) + ((values.length - 1) * barSpacing);
+
+ if ($.isArray(options.get('colorMap'))) {
+ this.colorMapByIndex = options.get('colorMap');
+ this.colorMapByValue = null;
+ } else {
+ this.colorMapByIndex = null;
+ this.colorMapByValue = options.get('colorMap');
+ if (this.colorMapByValue && this.colorMapByValue.get === undefined) {
+ this.colorMapByValue = new RangeMap(this.colorMapByValue);
+ }
+ }
+ this.initTarget();
+ },
+
+ getRegion: function (el, x, y) {
+ return Math.floor(x / this.totalBarWidth);
+ },
+
+ getCurrentRegionFields: function () {
+ var currentRegion = this.currentRegion;
+ return {
+ isNull: this.values[currentRegion] === undefined,
+ value: this.values[currentRegion],
+ color: this.calcColor(this.values[currentRegion], currentRegion),
+ offset: currentRegion
+ };
+ },
+
+ calcColor: function (value, valuenum) {
+ var values = this.values,
+ options = this.options,
+ colorMapByIndex = this.colorMapByIndex,
+ colorMapByValue = this.colorMapByValue,
+ color, newColor;
+
+ if (colorMapByValue && (newColor = colorMapByValue.get(value))) {
+ color = newColor;
+ } else if (colorMapByIndex && colorMapByIndex.length > valuenum) {
+ color = colorMapByIndex[valuenum];
+ } else if (values[valuenum] < 0) {
+ color = options.get('negBarColor');
+ } else if (values[valuenum] > 0) {
+ color = options.get('posBarColor');
+ } else {
+ color = options.get('zeroBarColor');
+ }
+ return color;
+ },
+
+ renderRegion: function (valuenum, highlight) {
+ var values = this.values,
+ options = this.options,
+ target = this.target,
+ canvasHeight, height, halfHeight,
+ x, y, color;
+
+ canvasHeight = target.pixelHeight;
+ halfHeight = Math.round(canvasHeight / 2);
+
+ x = valuenum * this.totalBarWidth;
+ if (values[valuenum] < 0) {
+ y = halfHeight;
+ height = halfHeight - 1;
+ } else if (values[valuenum] > 0) {
+ y = 0;
+ height = halfHeight - 1;
+ } else {
+ y = halfHeight - 1;
+ height = 2;
+ }
+ color = this.calcColor(values[valuenum], valuenum);
+ if (color === null) {
+ return;
+ }
+ if (highlight) {
+ color = this.calcHighlightColor(color, options);
+ }
+ return target.drawRect(x, y, this.barWidth - 1, height - 1, color, color);
+ }
+ });
+
+ /**
+ * Discrete charts
+ */
+ $.fn.sparkline.discrete = discrete = createClass($.fn.sparkline._base, barHighlightMixin, {
+ type: 'discrete',
+
+ init: function (el, values, options, width, height) {
+ discrete._super.init.call(this, el, values, options, width, height);
+
+ this.regionShapes = {};
+ this.values = values = $.map(values, Number);
+ this.min = Math.min.apply(Math, values);
+ this.max = Math.max.apply(Math, values);
+ this.range = this.max - this.min;
+ this.width = width = options.get('width') === 'auto' ? values.length * 2 : this.width;
+ this.interval = Math.floor(width / values.length);
+ this.itemWidth = width / values.length;
+ if (options.get('chartRangeMin') !== undefined && (options.get('chartRangeClip') || options.get('chartRangeMin') < this.min)) {
+ this.min = options.get('chartRangeMin');
+ }
+ if (options.get('chartRangeMax') !== undefined && (options.get('chartRangeClip') || options.get('chartRangeMax') > this.max)) {
+ this.max = options.get('chartRangeMax');
+ }
+ this.initTarget();
+ if (this.target) {
+ this.lineHeight = options.get('lineHeight') === 'auto' ? Math.round(this.canvasHeight * 0.3) : options.get('lineHeight');
+ }
+ },
+
+ getRegion: function (el, x, y) {
+ return Math.floor(x / this.itemWidth);
+ },
+
+ getCurrentRegionFields: function () {
+ var currentRegion = this.currentRegion;
+ return {
+ isNull: this.values[currentRegion] === undefined,
+ value: this.values[currentRegion],
+ offset: currentRegion
+ };
+ },
+
+ renderRegion: function (valuenum, highlight) {
+ var values = this.values,
+ options = this.options,
+ min = this.min,
+ max = this.max,
+ range = this.range,
+ interval = this.interval,
+ target = this.target,
+ canvasHeight = this.canvasHeight,
+ lineHeight = this.lineHeight,
+ pheight = canvasHeight - lineHeight,
+ ytop, val, color, x;
+
+ val = clipval(values[valuenum], min, max);
+ x = valuenum * interval;
+ ytop = Math.round(pheight - pheight * ((val - min) / range));
+ color = (options.get('thresholdColor') && val < options.get('thresholdValue')) ? options.get('thresholdColor') : options.get('lineColor');
+ if (highlight) {
+ color = this.calcHighlightColor(color, options);
+ }
+ return target.drawLine(x, ytop, x, ytop + lineHeight, color);
+ }
+ });
+
+ /**
+ * Bullet charts
+ */
+ $.fn.sparkline.bullet = bullet = createClass($.fn.sparkline._base, {
+ type: 'bullet',
+
+ init: function (el, values, options, width, height) {
+ var min, max, vals;
+ bullet._super.init.call(this, el, values, options, width, height);
+
+ // values: target, performance, range1, range2, range3
+ this.values = values = normalizeValues(values);
+ // target or performance could be null
+ vals = values.slice();
+ vals[0] = vals[0] === null ? vals[2] : vals[0];
+ vals[1] = values[1] === null ? vals[2] : vals[1];
+ min = Math.min.apply(Math, values);
+ max = Math.max.apply(Math, values);
+ if (options.get('base') === undefined) {
+ min = min < 0 ? min : 0;
+ } else {
+ min = options.get('base');
+ }
+ this.min = min;
+ this.max = max;
+ this.range = max - min;
+ this.shapes = {};
+ this.valueShapes = {};
+ this.regiondata = {};
+ this.width = width = options.get('width') === 'auto' ? '4.0em' : width;
+ this.target = this.$el.simpledraw(width, height, options.get('composite'));
+ if (!values.length) {
+ this.disabled = true;
+ }
+ this.initTarget();
+ },
+
+ getRegion: function (el, x, y) {
+ var shapeid = this.target.getShapeAt(el, x, y);
+ return (shapeid !== undefined && this.shapes[shapeid] !== undefined) ? this.shapes[shapeid] : undefined;
+ },
+
+ getCurrentRegionFields: function () {
+ var currentRegion = this.currentRegion;
+ return {
+ fieldkey: currentRegion.substr(0, 1),
+ value: this.values[currentRegion.substr(1)],
+ region: currentRegion
+ };
+ },
+
+ changeHighlight: function (highlight) {
+ var currentRegion = this.currentRegion,
+ shapeid = this.valueShapes[currentRegion],
+ shape;
+ delete this.shapes[shapeid];
+ switch (currentRegion.substr(0, 1)) {
+ case 'r':
+ shape = this.renderRange(currentRegion.substr(1), highlight);
+ break;
+ case 'p':
+ shape = this.renderPerformance(highlight);
+ break;
+ case 't':
+ shape = this.renderTarget(highlight);
+ break;
+ }
+ this.valueShapes[currentRegion] = shape.id;
+ this.shapes[shape.id] = currentRegion;
+ this.target.replaceWithShape(shapeid, shape);
+ },
+
+ renderRange: function (rn, highlight) {
+ var rangeval = this.values[rn],
+ rangewidth = Math.round(this.canvasWidth * ((rangeval - this.min) / this.range)),
+ color = this.options.get('rangeColors')[rn - 2];
+ if (highlight) {
+ color = this.calcHighlightColor(color, this.options);
+ }
+ return this.target.drawRect(0, 0, rangewidth - 1, this.canvasHeight - 1, color, color);
+ },
+
+ renderPerformance: function (highlight) {
+ var perfval = this.values[1],
+ perfwidth = Math.round(this.canvasWidth * ((perfval - this.min) / this.range)),
+ color = this.options.get('performanceColor');
+ if (highlight) {
+ color = this.calcHighlightColor(color, this.options);
+ }
+ return this.target.drawRect(0, Math.round(this.canvasHeight * 0.3), perfwidth - 1,
+ Math.round(this.canvasHeight * 0.4) - 1, color, color);
+ },
+
+ renderTarget: function (highlight) {
+ var targetval = this.values[0],
+ x = Math.round(this.canvasWidth * ((targetval - this.min) / this.range) - (this.options.get('targetWidth') / 2)),
+ targettop = Math.round(this.canvasHeight * 0.10),
+ targetheight = this.canvasHeight - (targettop * 2),
+ color = this.options.get('targetColor');
+ if (highlight) {
+ color = this.calcHighlightColor(color, this.options);
+ }
+ return this.target.drawRect(x, targettop, this.options.get('targetWidth') - 1, targetheight - 1, color, color);
+ },
+
+ render: function () {
+ var vlen = this.values.length,
+ target = this.target,
+ i, shape;
+ if (!bullet._super.render.call(this)) {
+ return;
+ }
+ for (i = 2; i < vlen; i++) {
+ shape = this.renderRange(i).append();
+ this.shapes[shape.id] = 'r' + i;
+ this.valueShapes['r' + i] = shape.id;
+ }
+ if (this.values[1] !== null) {
+ shape = this.renderPerformance().append();
+ this.shapes[shape.id] = 'p1';
+ this.valueShapes.p1 = shape.id;
+ }
+ if (this.values[0] !== null) {
+ shape = this.renderTarget().append();
+ this.shapes[shape.id] = 't0';
+ this.valueShapes.t0 = shape.id;
+ }
+ target.render();
+ }
+ });
+
+ /**
+ * Pie charts
+ */
+ $.fn.sparkline.pie = pie = createClass($.fn.sparkline._base, {
+ type: 'pie',
+
+ init: function (el, values, options, width, height) {
+ var total = 0, i;
+
+ pie._super.init.call(this, el, values, options, width, height);
+
+ this.shapes = {}; // map shape ids to value offsets
+ this.valueShapes = {}; // maps value offsets to shape ids
+ this.values = values = $.map(values, Number);
+
+ if (options.get('width') === 'auto') {
+ this.width = this.height;
+ }
+
+ if (values.length > 0) {
+ for (i = values.length; i--;) {
+ total += values[i];
+ }
+ }
+ this.total = total;
+ this.initTarget();
+ this.radius = Math.floor(Math.min(this.canvasWidth, this.canvasHeight) / 2);
+ },
+
+ getRegion: function (el, x, y) {
+ var shapeid = this.target.getShapeAt(el, x, y);
+ return (shapeid !== undefined && this.shapes[shapeid] !== undefined) ? this.shapes[shapeid] : undefined;
+ },
+
+ getCurrentRegionFields: function () {
+ var currentRegion = this.currentRegion;
+ return {
+ isNull: this.values[currentRegion] === undefined,
+ value: this.values[currentRegion],
+ percent: this.values[currentRegion] / this.total * 100,
+ color: this.options.get('sliceColors')[currentRegion % this.options.get('sliceColors').length],
+ offset: currentRegion
+ };
+ },
+
+ changeHighlight: function (highlight) {
+ var currentRegion = this.currentRegion,
+ newslice = this.renderSlice(currentRegion, highlight),
+ shapeid = this.valueShapes[currentRegion];
+ delete this.shapes[shapeid];
+ this.target.replaceWithShape(shapeid, newslice);
+ this.valueShapes[currentRegion] = newslice.id;
+ this.shapes[newslice.id] = currentRegion;
+ },
+
+ renderSlice: function (valuenum, highlight) {
+ var target = this.target,
+ options = this.options,
+ radius = this.radius,
+ borderWidth = options.get('borderWidth'),
+ offset = options.get('offset'),
+ circle = 2 * Math.PI,
+ values = this.values,
+ total = this.total,
+ next = offset ? (2*Math.PI)*(offset/360) : 0,
+ start, end, i, vlen, color;
+
+ vlen = values.length;
+ for (i = 0; i < vlen; i++) {
+ start = next;
+ end = next;
+ if (total > 0) { // avoid divide by zero
+ end = next + (circle * (values[i] / total));
+ }
+ if (valuenum === i) {
+ color = options.get('sliceColors')[i % options.get('sliceColors').length];
+ if (highlight) {
+ color = this.calcHighlightColor(color, options);
+ }
+
+ return target.drawPieSlice(radius, radius, radius - borderWidth, start, end, undefined, color);
+ }
+ next = end;
+ }
+ },
+
+ render: function () {
+ var target = this.target,
+ values = this.values,
+ options = this.options,
+ radius = this.radius,
+ borderWidth = options.get('borderWidth'),
+ shape, i;
+
+ if (!pie._super.render.call(this)) {
+ return;
+ }
+ if (borderWidth) {
+ target.drawCircle(radius, radius, Math.floor(radius - (borderWidth / 2)),
+ options.get('borderColor'), undefined, borderWidth).append();
+ }
+ for (i = values.length; i--;) {
+ if (values[i]) { // don't render zero values
+ shape = this.renderSlice(i).append();
+ this.valueShapes[i] = shape.id; // store just the shapeid
+ this.shapes[shape.id] = i;
+ }
+ }
+ target.render();
+ }
+ });
+
+ /**
+ * Box plots
+ */
+ $.fn.sparkline.box = box = createClass($.fn.sparkline._base, {
+ type: 'box',
+
+ init: function (el, values, options, width, height) {
+ box._super.init.call(this, el, values, options, width, height);
+ this.values = $.map(values, Number);
+ this.width = options.get('width') === 'auto' ? '4.0em' : width;
+ this.initTarget();
+ if (!this.values.length) {
+ this.disabled = 1;
+ }
+ },
+
+ /**
+ * Simulate a single region
+ */
+ getRegion: function () {
+ return 1;
+ },
+
+ getCurrentRegionFields: function () {
+ var result = [
+ { field: 'lq', value: this.quartiles[0] },
+ { field: 'med', value: this.quartiles[1] },
+ { field: 'uq', value: this.quartiles[2] }
+ ];
+ if (this.loutlier !== undefined) {
+ result.push({ field: 'lo', value: this.loutlier});
+ }
+ if (this.routlier !== undefined) {
+ result.push({ field: 'ro', value: this.routlier});
+ }
+ if (this.lwhisker !== undefined) {
+ result.push({ field: 'lw', value: this.lwhisker});
+ }
+ if (this.rwhisker !== undefined) {
+ result.push({ field: 'rw', value: this.rwhisker});
+ }
+ return result;
+ },
+
+ render: function () {
+ var target = this.target,
+ values = this.values,
+ vlen = values.length,
+ options = this.options,
+ canvasWidth = this.canvasWidth,
+ canvasHeight = this.canvasHeight,
+ minValue = options.get('chartRangeMin') === undefined ? Math.min.apply(Math, values) : options.get('chartRangeMin'),
+ maxValue = options.get('chartRangeMax') === undefined ? Math.max.apply(Math, values) : options.get('chartRangeMax'),
+ canvasLeft = 0,
+ lwhisker, loutlier, iqr, q1, q2, q3, rwhisker, routlier, i,
+ size, unitSize;
+
+ if (!box._super.render.call(this)) {
+ return;
+ }
+
+ if (options.get('raw')) {
+ if (options.get('showOutliers') && values.length > 5) {
+ loutlier = values[0];
+ lwhisker = values[1];
+ q1 = values[2];
+ q2 = values[3];
+ q3 = values[4];
+ rwhisker = values[5];
+ routlier = values[6];
+ } else {
+ lwhisker = values[0];
+ q1 = values[1];
+ q2 = values[2];
+ q3 = values[3];
+ rwhisker = values[4];
+ }
+ } else {
+ values.sort(function (a, b) { return a - b; });
+ q1 = quartile(values, 1);
+ q2 = quartile(values, 2);
+ q3 = quartile(values, 3);
+ iqr = q3 - q1;
+ if (options.get('showOutliers')) {
+ lwhisker = rwhisker = undefined;
+ for (i = 0; i < vlen; i++) {
+ if (lwhisker === undefined && values[i] > q1 - (iqr * options.get('outlierIQR'))) {
+ lwhisker = values[i];
+ }
+ if (values[i] < q3 + (iqr * options.get('outlierIQR'))) {
+ rwhisker = values[i];
+ }
+ }
+ loutlier = values[0];
+ routlier = values[vlen - 1];
+ } else {
+ lwhisker = values[0];
+ rwhisker = values[vlen - 1];
+ }
+ }
+ this.quartiles = [q1, q2, q3];
+ this.lwhisker = lwhisker;
+ this.rwhisker = rwhisker;
+ this.loutlier = loutlier;
+ this.routlier = routlier;
+
+ unitSize = canvasWidth / (maxValue - minValue + 1);
+ if (options.get('showOutliers')) {
+ canvasLeft = Math.ceil(options.get('spotRadius'));
+ canvasWidth -= 2 * Math.ceil(options.get('spotRadius'));
+ unitSize = canvasWidth / (maxValue - minValue + 1);
+ if (loutlier < lwhisker) {
+ target.drawCircle((loutlier - minValue) * unitSize + canvasLeft,
+ canvasHeight / 2,
+ options.get('spotRadius'),
+ options.get('outlierLineColor'),
+ options.get('outlierFillColor')).append();
+ }
+ if (routlier > rwhisker) {
+ target.drawCircle((routlier - minValue) * unitSize + canvasLeft,
+ canvasHeight / 2,
+ options.get('spotRadius'),
+ options.get('outlierLineColor'),
+ options.get('outlierFillColor')).append();
+ }
+ }
+
+ // box
+ target.drawRect(
+ Math.round((q1 - minValue) * unitSize + canvasLeft),
+ Math.round(canvasHeight * 0.1),
+ Math.round((q3 - q1) * unitSize),
+ Math.round(canvasHeight * 0.8),
+ options.get('boxLineColor'),
+ options.get('boxFillColor')).append();
+ // left whisker
+ target.drawLine(
+ Math.round((lwhisker - minValue) * unitSize + canvasLeft),
+ Math.round(canvasHeight / 2),
+ Math.round((q1 - minValue) * unitSize + canvasLeft),
+ Math.round(canvasHeight / 2),
+ options.get('lineColor')).append();
+ target.drawLine(
+ Math.round((lwhisker - minValue) * unitSize + canvasLeft),
+ Math.round(canvasHeight / 4),
+ Math.round((lwhisker - minValue) * unitSize + canvasLeft),
+ Math.round(canvasHeight - canvasHeight / 4),
+ options.get('whiskerColor')).append();
+ // right whisker
+ target.drawLine(Math.round((rwhisker - minValue) * unitSize + canvasLeft),
+ Math.round(canvasHeight / 2),
+ Math.round((q3 - minValue) * unitSize + canvasLeft),
+ Math.round(canvasHeight / 2),
+ options.get('lineColor')).append();
+ target.drawLine(
+ Math.round((rwhisker - minValue) * unitSize + canvasLeft),
+ Math.round(canvasHeight / 4),
+ Math.round((rwhisker - minValue) * unitSize + canvasLeft),
+ Math.round(canvasHeight - canvasHeight / 4),
+ options.get('whiskerColor')).append();
+ // median line
+ target.drawLine(
+ Math.round((q2 - minValue) * unitSize + canvasLeft),
+ Math.round(canvasHeight * 0.1),
+ Math.round((q2 - minValue) * unitSize + canvasLeft),
+ Math.round(canvasHeight * 0.9),
+ options.get('medianColor')).append();
+ if (options.get('target')) {
+ size = Math.ceil(options.get('spotRadius'));
+ target.drawLine(
+ Math.round((options.get('target') - minValue) * unitSize + canvasLeft),
+ Math.round((canvasHeight / 2) - size),
+ Math.round((options.get('target') - minValue) * unitSize + canvasLeft),
+ Math.round((canvasHeight / 2) + size),
+ options.get('targetColor')).append();
+ target.drawLine(
+ Math.round((options.get('target') - minValue) * unitSize + canvasLeft - size),
+ Math.round(canvasHeight / 2),
+ Math.round((options.get('target') - minValue) * unitSize + canvasLeft + size),
+ Math.round(canvasHeight / 2),
+ options.get('targetColor')).append();
+ }
+ target.render();
+ }
+ });
+
+ // Setup a very simple "virtual canvas" to make drawing the few shapes we need easier
+ // This is accessible as $(foo).simpledraw()
+
+ VShape = createClass({
+ init: function (target, id, type, args) {
+ this.target = target;
+ this.id = id;
+ this.type = type;
+ this.args = args;
+ },
+ append: function () {
+ this.target.appendShape(this);
+ return this;
+ }
+ });
+
+ VCanvas_base = createClass({
+ _pxregex: /(\d+)(px)?\s*$/i,
+
+ init: function (width, height, target) {
+ if (!width) {
+ return;
+ }
+ this.width = width;
+ this.height = height;
+ this.target = target;
+ this.lastShapeId = null;
+ if (target[0]) {
+ target = target[0];
+ }
+ $.data(target, '_jqs_vcanvas', this);
+ },
+
+ drawLine: function (x1, y1, x2, y2, lineColor, lineWidth) {
+ return this.drawShape([[x1, y1], [x2, y2]], lineColor, lineWidth);
+ },
+
+ drawShape: function (path, lineColor, fillColor, lineWidth) {
+ return this._genShape('Shape', [path, lineColor, fillColor, lineWidth]);
+ },
+
+ drawCircle: function (x, y, radius, lineColor, fillColor, lineWidth) {
+ return this._genShape('Circle', [x, y, radius, lineColor, fillColor, lineWidth]);
+ },
+
+ drawPieSlice: function (x, y, radius, startAngle, endAngle, lineColor, fillColor) {
+ return this._genShape('PieSlice', [x, y, radius, startAngle, endAngle, lineColor, fillColor]);
+ },
+
+ drawRect: function (x, y, width, height, lineColor, fillColor) {
+ return this._genShape('Rect', [x, y, width, height, lineColor, fillColor]);
+ },
+
+ getElement: function () {
+ return this.canvas;
+ },
+
+ /**
+ * Return the most recently inserted shape id
+ */
+ getLastShapeId: function () {
+ return this.lastShapeId;
+ },
+
+ /**
+ * Clear and reset the canvas
+ */
+ reset: function () {
+ alert('reset not implemented');
+ },
+
+ _insert: function (el, target) {
+ $(target).html(el);
+ },
+
+ /**
+ * Calculate the pixel dimensions of the canvas
+ */
+ _calculatePixelDims: function (width, height, canvas) {
+ // XXX This should probably be a configurable option
+ var match;
+ match = this._pxregex.exec(height);
+ if (match) {
+ this.pixelHeight = match[1];
+ } else {
+ this.pixelHeight = $(canvas).height();
+ }
+ match = this._pxregex.exec(width);
+ if (match) {
+ this.pixelWidth = match[1];
+ } else {
+ this.pixelWidth = $(canvas).width();
+ }
+ },
+
+ /**
+ * Generate a shape object and id for later rendering
+ */
+ _genShape: function (shapetype, shapeargs) {
+ var id = shapeCount++;
+ shapeargs.unshift(id);
+ return new VShape(this, id, shapetype, shapeargs);
+ },
+
+ /**
+ * Add a shape to the end of the render queue
+ */
+ appendShape: function (shape) {
+ alert('appendShape not implemented');
+ },
+
+ /**
+ * Replace one shape with another
+ */
+ replaceWithShape: function (shapeid, shape) {
+ alert('replaceWithShape not implemented');
+ },
+
+ /**
+ * Insert one shape after another in the render queue
+ */
+ insertAfterShape: function (shapeid, shape) {
+ alert('insertAfterShape not implemented');
+ },
+
+ /**
+ * Remove a shape from the queue
+ */
+ removeShapeId: function (shapeid) {
+ alert('removeShapeId not implemented');
+ },
+
+ /**
+ * Find a shape at the specified x/y co-ordinates
+ */
+ getShapeAt: function (el, x, y) {
+ alert('getShapeAt not implemented');
+ },
+
+ /**
+ * Render all queued shapes onto the canvas
+ */
+ render: function () {
+ alert('render not implemented');
+ }
+ });
+
+ VCanvas_canvas = createClass(VCanvas_base, {
+ init: function (width, height, target, interact) {
+ VCanvas_canvas._super.init.call(this, width, height, target);
+ this.canvas = document.createElement('canvas');
+ if (target[0]) {
+ target = target[0];
+ }
+ $.data(target, '_jqs_vcanvas', this);
+ $(this.canvas).css({ display: 'inline-block', width: width, height: height, verticalAlign: 'top' });
+ this._insert(this.canvas, target);
+ this._calculatePixelDims(width, height, this.canvas);
+ this.canvas.width = this.pixelWidth;
+ this.canvas.height = this.pixelHeight;
+ this.interact = interact;
+ this.shapes = {};
+ this.shapeseq = [];
+ this.currentTargetShapeId = undefined;
+ $(this.canvas).css({width: this.pixelWidth, height: this.pixelHeight});
+ },
+
+ _getContext: function (lineColor, fillColor, lineWidth) {
+ var context = this.canvas.getContext('2d');
+ if (lineColor !== undefined) {
+ context.strokeStyle = lineColor;
+ }
+ context.lineWidth = lineWidth === undefined ? 1 : lineWidth;
+ if (fillColor !== undefined) {
+ context.fillStyle = fillColor;
+ }
+ return context;
+ },
+
+ reset: function () {
+ var context = this._getContext();
+ context.clearRect(0, 0, this.pixelWidth, this.pixelHeight);
+ this.shapes = {};
+ this.shapeseq = [];
+ this.currentTargetShapeId = undefined;
+ },
+
+ _drawShape: function (shapeid, path, lineColor, fillColor, lineWidth) {
+ var context = this._getContext(lineColor, fillColor, lineWidth),
+ i, plen;
+ context.beginPath();
+ context.moveTo(path[0][0] + 0.5, path[0][1] + 0.5);
+ for (i = 1, plen = path.length; i < plen; i++) {
+ context.lineTo(path[i][0] + 0.5, path[i][1] + 0.5); // the 0.5 offset gives us crisp pixel-width lines
+ }
+ if (lineColor !== undefined) {
+ context.stroke();
+ }
+ if (fillColor !== undefined) {
+ context.fill();
+ }
+ if (this.targetX !== undefined && this.targetY !== undefined &&
+ context.isPointInPath(this.targetX, this.targetY)) {
+ this.currentTargetShapeId = shapeid;
+ }
+ },
+
+ _drawCircle: function (shapeid, x, y, radius, lineColor, fillColor, lineWidth) {
+ var context = this._getContext(lineColor, fillColor, lineWidth);
+ context.beginPath();
+ context.arc(x, y, radius, 0, 2 * Math.PI, false);
+ if (this.targetX !== undefined && this.targetY !== undefined &&
+ context.isPointInPath(this.targetX, this.targetY)) {
+ this.currentTargetShapeId = shapeid;
+ }
+ if (lineColor !== undefined) {
+ context.stroke();
+ }
+ if (fillColor !== undefined) {
+ context.fill();
+ }
+ },
+
+ _drawPieSlice: function (shapeid, x, y, radius, startAngle, endAngle, lineColor, fillColor) {
+ var context = this._getContext(lineColor, fillColor);
+ context.beginPath();
+ context.moveTo(x, y);
+ context.arc(x, y, radius, startAngle, endAngle, false);
+ context.lineTo(x, y);
+ context.closePath();
+ if (lineColor !== undefined) {
+ context.stroke();
+ }
+ if (fillColor) {
+ context.fill();
+ }
+ if (this.targetX !== undefined && this.targetY !== undefined &&
+ context.isPointInPath(this.targetX, this.targetY)) {
+ this.currentTargetShapeId = shapeid;
+ }
+ },
+
+ _drawRect: function (shapeid, x, y, width, height, lineColor, fillColor) {
+ return this._drawShape(shapeid, [[x, y], [x + width, y], [x + width, y + height], [x, y + height], [x, y]], lineColor, fillColor);
+ },
+
+ appendShape: function (shape) {
+ this.shapes[shape.id] = shape;
+ this.shapeseq.push(shape.id);
+ this.lastShapeId = shape.id;
+ return shape.id;
+ },
+
+ replaceWithShape: function (shapeid, shape) {
+ var shapeseq = this.shapeseq,
+ i;
+ this.shapes[shape.id] = shape;
+ for (i = shapeseq.length; i--;) {
+ if (shapeseq[i] == shapeid) {
+ shapeseq[i] = shape.id;
+ }
+ }
+ delete this.shapes[shapeid];
+ },
+
+ replaceWithShapes: function (shapeids, shapes) {
+ var shapeseq = this.shapeseq,
+ shapemap = {},
+ sid, i, first;
+
+ for (i = shapeids.length; i--;) {
+ shapemap[shapeids[i]] = true;
+ }
+ for (i = shapeseq.length; i--;) {
+ sid = shapeseq[i];
+ if (shapemap[sid]) {
+ shapeseq.splice(i, 1);
+ delete this.shapes[sid];
+ first = i;
+ }
+ }
+ for (i = shapes.length; i--;) {
+ shapeseq.splice(first, 0, shapes[i].id);
+ this.shapes[shapes[i].id] = shapes[i];
+ }
+
+ },
+
+ insertAfterShape: function (shapeid, shape) {
+ var shapeseq = this.shapeseq,
+ i;
+ for (i = shapeseq.length; i--;) {
+ if (shapeseq[i] === shapeid) {
+ shapeseq.splice(i + 1, 0, shape.id);
+ this.shapes[shape.id] = shape;
+ return;
+ }
+ }
+ },
+
+ removeShapeId: function (shapeid) {
+ var shapeseq = this.shapeseq,
+ i;
+ for (i = shapeseq.length; i--;) {
+ if (shapeseq[i] === shapeid) {
+ shapeseq.splice(i, 1);
+ break;
+ }
+ }
+ delete this.shapes[shapeid];
+ },
+
+ getShapeAt: function (el, x, y) {
+ this.targetX = x;
+ this.targetY = y;
+ this.render();
+ return this.currentTargetShapeId;
+ },
+
+ render: function () {
+ var shapeseq = this.shapeseq,
+ shapes = this.shapes,
+ shapeCount = shapeseq.length,
+ context = this._getContext(),
+ shapeid, shape, i;
+ context.clearRect(0, 0, this.pixelWidth, this.pixelHeight);
+ for (i = 0; i < shapeCount; i++) {
+ shapeid = shapeseq[i];
+ shape = shapes[shapeid];
+ this['_draw' + shape.type].apply(this, shape.args);
+ }
+ if (!this.interact) {
+ // not interactive so no need to keep the shapes array
+ this.shapes = {};
+ this.shapeseq = [];
+ }
+ }
+
+ });
+
+ VCanvas_vml = createClass(VCanvas_base, {
+ init: function (width, height, target) {
+ var groupel;
+ VCanvas_vml._super.init.call(this, width, height, target);
+ if (target[0]) {
+ target = target[0];
+ }
+ $.data(target, '_jqs_vcanvas', this);
+ this.canvas = document.createElement('span');
+ $(this.canvas).css({ display: 'inline-block', position: 'relative', overflow: 'hidden', width: width, height: height, margin: '0px', padding: '0px', verticalAlign: 'top'});
+ this._insert(this.canvas, target);
+ this._calculatePixelDims(width, height, this.canvas);
+ this.canvas.width = this.pixelWidth;
+ this.canvas.height = this.pixelHeight;
+ groupel = '<v:group coordorigin="0 0" coordsize="' + this.pixelWidth + ' ' + this.pixelHeight + '"' +
+ ' style="position:absolute;top:0;left:0;width:' + this.pixelWidth + 'px;height=' + this.pixelHeight + 'px;"></v:group>';
+ this.canvas.insertAdjacentHTML('beforeEnd', groupel);
+ this.group = $(this.canvas).children()[0];
+ this.rendered = false;
+ this.prerender = '';
+ },
+
+ _drawShape: function (shapeid, path, lineColor, fillColor, lineWidth) {
+ var vpath = [],
+ initial, stroke, fill, closed, vel, plen, i;
+ for (i = 0, plen = path.length; i < plen; i++) {
+ vpath[i] = '' + (path[i][0]) + ',' + (path[i][1]);
+ }
+ initial = vpath.splice(0, 1);
+ lineWidth = lineWidth === undefined ? 1 : lineWidth;
+ stroke = lineColor === undefined ? ' stroked="false" ' : ' strokeWeight="' + lineWidth + 'px" strokeColor="' + lineColor + '" ';
+ fill = fillColor === undefined ? ' filled="false"' : ' fillColor="' + fillColor + '" filled="true" ';
+ closed = vpath[0] === vpath[vpath.length - 1] ? 'x ' : '';
+ vel = '<v:shape coordorigin="0 0" coordsize="' + this.pixelWidth + ' ' + this.pixelHeight + '" ' +
+ ' id="jqsshape' + shapeid + '" ' +
+ stroke +
+ fill +
+ ' style="position:absolute;left:0px;top:0px;height:' + this.pixelHeight + 'px;width:' + this.pixelWidth + 'px;padding:0px;margin:0px;" ' +
+ ' path="m ' + initial + ' l ' + vpath.join(', ') + ' ' + closed + 'e">' +
+ ' </v:shape>';
+ return vel;
+ },
+
+ _drawCircle: function (shapeid, x, y, radius, lineColor, fillColor, lineWidth) {
+ var stroke, fill, vel;
+ x -= radius;
+ y -= radius;
+ stroke = lineColor === undefined ? ' stroked="false" ' : ' strokeWeight="' + lineWidth + 'px" strokeColor="' + lineColor + '" ';
+ fill = fillColor === undefined ? ' filled="false"' : ' fillColor="' + fillColor + '" filled="true" ';
+ vel = '<v:oval ' +
+ ' id="jqsshape' + shapeid + '" ' +
+ stroke +
+ fill +
+ ' style="position:absolute;top:' + y + 'px; left:' + x + 'px; width:' + (radius * 2) + 'px; height:' + (radius * 2) + 'px"></v:oval>';
+ return vel;
+
+ },
+
+ _drawPieSlice: function (shapeid, x, y, radius, startAngle, endAngle, lineColor, fillColor) {
+ var vpath, startx, starty, endx, endy, stroke, fill, vel;
+ if (startAngle === endAngle) {
+ return ''; // VML seems to have problem when start angle equals end angle.
+ }
+ if ((endAngle - startAngle) === (2 * Math.PI)) {
+ startAngle = 0.0; // VML seems to have a problem when drawing a full circle that doesn't start 0
+ endAngle = (2 * Math.PI);
+ }
+
+ startx = x + Math.round(Math.cos(startAngle) * radius);
+ starty = y + Math.round(Math.sin(startAngle) * radius);
+ endx = x + Math.round(Math.cos(endAngle) * radius);
+ endy = y + Math.round(Math.sin(endAngle) * radius);
+
+ if (startx === endx && starty === endy) {
+ if ((endAngle - startAngle) < Math.PI) {
+ // Prevent very small slices from being mistaken as a whole pie
+ return '';
+ }
+ // essentially going to be the entire circle, so ignore startAngle
+ startx = endx = x + radius;
+ starty = endy = y;
+ }
+
+ if (startx === endx && starty === endy && (endAngle - startAngle) < Math.PI) {
+ return '';
+ }
+
+ vpath = [x - radius, y - radius, x + radius, y + radius, startx, starty, endx, endy];
+ stroke = lineColor === undefined ? ' stroked="false" ' : ' strokeWeight="1px" strokeColor="' + lineColor + '" ';
+ fill = fillColor === undefined ? ' filled="false"' : ' fillColor="' + fillColor + '" filled="true" ';
+ vel = '<v:shape coordorigin="0 0" coordsize="' + this.pixelWidth + ' ' + this.pixelHeight + '" ' +
+ ' id="jqsshape' + shapeid + '" ' +
+ stroke +
+ fill +
+ ' style="position:absolute;left:0px;top:0px;height:' + this.pixelHeight + 'px;width:' + this.pixelWidth + 'px;padding:0px;margin:0px;" ' +
+ ' path="m ' + x + ',' + y + ' wa ' + vpath.join(', ') + ' x e">' +
+ ' </v:shape>';
+ return vel;
+ },
+
+ _drawRect: function (shapeid, x, y, width, height, lineColor, fillColor) {
+ return this._drawShape(shapeid, [[x, y], [x, y + height], [x + width, y + height], [x + width, y], [x, y]], lineColor, fillColor);
+ },
+
+ reset: function () {
+ this.group.innerHTML = '';
+ },
+
+ appendShape: function (shape) {
+ var vel = this['_draw' + shape.type].apply(this, shape.args);
+ if (this.rendered) {
+ this.group.insertAdjacentHTML('beforeEnd', vel);
+ } else {
+ this.prerender += vel;
+ }
+ this.lastShapeId = shape.id;
+ return shape.id;
+ },
+
+ replaceWithShape: function (shapeid, shape) {
+ var existing = $('#jqsshape' + shapeid),
+ vel = this['_draw' + shape.type].apply(this, shape.args);
+ existing[0].outerHTML = vel;
+ },
+
+ replaceWithShapes: function (shapeids, shapes) {
+ // replace the first shapeid with all the new shapes then toast the remaining old shapes
+ var existing = $('#jqsshape' + shapeids[0]),
+ replace = '',
+ slen = shapes.length,
+ i;
+ for (i = 0; i < slen; i++) {
+ replace += this['_draw' + shapes[i].type].apply(this, shapes[i].args);
+ }
+ existing[0].outerHTML = replace;
+ for (i = 1; i < shapeids.length; i++) {
+ $('#jqsshape' + shapeids[i]).remove();
+ }
+ },
+
+ insertAfterShape: function (shapeid, shape) {
+ var existing = $('#jqsshape' + shapeid),
+ vel = this['_draw' + shape.type].apply(this, shape.args);
+ existing[0].insertAdjacentHTML('afterEnd', vel);
+ },
+
+ removeShapeId: function (shapeid) {
+ var existing = $('#jqsshape' + shapeid);
+ this.group.removeChild(existing[0]);
+ },
+
+ getShapeAt: function (el, x, y) {
+ var shapeid = el.id.substr(8);
+ return shapeid;
+ },
+
+ render: function () {
+ if (!this.rendered) {
+ // batch the intial render into a single repaint
+ this.group.innerHTML = this.prerender;
+ this.rendered = true;
+ }
+ }
+ });
+
+}))}(document, Math));
diff --git a/debian/missing-sources/morris.css b/debian/missing-sources/morris.css
new file mode 100644
index 00000000..209f0915
--- /dev/null
+++ b/debian/missing-sources/morris.css
@@ -0,0 +1,2 @@
+.morris-hover{position:absolute;z-index:1000}.morris-hover.morris-default-style{border-radius:10px;padding:6px;color:#666;background:rgba(255,255,255,0.8);border:solid 2px rgba(230,230,230,0.8);font-family:sans-serif;font-size:12px;text-align:center}.morris-hover.morris-default-style .morris-hover-row-label{font-weight:bold;margin:0.25em 0}
+.morris-hover.morris-default-style .morris-hover-point{white-space:nowrap;margin:0.1em 0}
diff --git a/debian/missing-sources/morris.js b/debian/missing-sources/morris.js
new file mode 100644
index 00000000..60b3132d
--- /dev/null
+++ b/debian/missing-sources/morris.js
@@ -0,0 +1,1895 @@
+/* @license
+morris.js v0.5.0
+Copyright 2014 Olly Smith All rights reserved.
+Licensed under the BSD-2-Clause License.
+*/
+
+
+(function() {
+ var $, Morris, minutesSpecHelper, secondsSpecHelper,
+ __slice = [].slice,
+ __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },
+ __hasProp = {}.hasOwnProperty,
+ __extends = function(child, parent) {
+ for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; }
+ function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child;
+ },
+ __indexOf = [].indexOf || function(item) { for (var i = 0, l = this.length; i < l; i++) { if (i in this && this[i] === item) return i; } return -1; };
+
+ Morris = window.Morris = {};
+
+ $ = jQuery;
+
+ Morris.EventEmitter = (function() {
+ function EventEmitter() {}
+
+ EventEmitter.prototype.on = function(name, handler) {
+ if (this.handlers == null) {
+ this.handlers = {};
+ }
+ if (this.handlers[name] == null) {
+ this.handlers[name] = [];
+ }
+ this.handlers[name].push(handler);
+ return this;
+ };
+
+ EventEmitter.prototype.fire = function() {
+ var args, handler, name, _i, _len, _ref, _results;
+ name = arguments[0], args = 2 <= arguments.length ? __slice.call(arguments, 1) : [];
+ if ((this.handlers != null) && (this.handlers[name] != null)) {
+ _ref = this.handlers[name];
+ _results = [];
+ for (_i = 0, _len = _ref.length; _i < _len; _i++) {
+ handler = _ref[_i];
+ _results.push(handler.apply(null, args));
+ }
+ return _results;
+ }
+ };
+
+ return EventEmitter;
+
+ })();
+
+ Morris.commas = function(num) {
+ var absnum, intnum, ret, strabsnum;
+ if (num != null) {
+ ret = num < 0 ? "-" : "";
+ absnum = Math.abs(num);
+ intnum = Math.floor(absnum).toFixed(0);
+ ret += intnum.replace(/(?=(?:\d{3})+$)(?!^)/g, ',');
+ strabsnum = absnum.toString();
+ if (strabsnum.length > intnum.length) {
+ ret += strabsnum.slice(intnum.length);
+ }
+ return ret;
+ } else {
+ return '-';
+ }
+ };
+
+ Morris.pad2 = function(number) {
+ return (number < 10 ? '0' : '') + number;
+ };
+
+ Morris.Grid = (function(_super) {
+ __extends(Grid, _super);
+
+ function Grid(options) {
+ this.resizeHandler = __bind(this.resizeHandler, this);
+ var _this = this;
+ if (typeof options.element === 'string') {
+ this.el = $(document.getElementById(options.element));
+ } else {
+ this.el = $(options.element);
+ }
+ if ((this.el == null) || this.el.length === 0) {
+ throw new Error("Graph container element not found");
+ }
+ if (this.el.css('position') === 'static') {
+ this.el.css('position', 'relative');
+ }
+ this.options = $.extend({}, this.gridDefaults, this.defaults || {}, options);
+ if (typeof this.options.units === 'string') {
+ this.options.postUnits = options.units;
+ }
+ this.raphael = new Raphael(this.el[0]);
+ this.elementWidth = null;
+ this.elementHeight = null;
+ this.dirty = false;
+ this.selectFrom = null;
+ if (this.init) {
+ this.init();
+ }
+ this.setData(this.options.data);
+ this.el.bind('mousemove', function(evt) {
+ var left, offset, right, width, x;
+ offset = _this.el.offset();
+ x = evt.pageX - offset.left;
+ if (_this.selectFrom) {
+ left = _this.data[_this.hitTest(Math.min(x, _this.selectFrom))]._x;
+ right = _this.data[_this.hitTest(Math.max(x, _this.selectFrom))]._x;
+ width = right - left;
+ return _this.selectionRect.attr({
+ x: left,
+ width: width
+ });
+ } else {
+ return _this.fire('hovermove', x, evt.pageY - offset.top);
+ }
+ });
+ this.el.bind('mouseleave', function(evt) {
+ if (_this.selectFrom) {
+ _this.selectionRect.hide();
+ _this.selectFrom = null;
+ }
+ return _this.fire('hoverout');
+ });
+ this.el.bind('touchstart touchmove touchend', function(evt) {
+ var offset, touch;
+ touch = evt.originalEvent.touches[0] || evt.originalEvent.changedTouches[0];
+ offset = _this.el.offset();
+ return _this.fire('hovermove', touch.pageX - offset.left, touch.pageY - offset.top);
+ });
+ this.el.bind('click', function(evt) {
+ var offset;
+ offset = _this.el.offset();
+ return _this.fire('gridclick', evt.pageX - offset.left, evt.pageY - offset.top);
+ });
+ if (this.options.rangeSelect) {
+ this.selectionRect = this.raphael.rect(0, 0, 0, this.el.innerHeight()).attr({
+ fill: this.options.rangeSelectColor,
+ stroke: false
+ }).toBack().hide();
+ this.el.bind('mousedown', function(evt) {
+ var offset;
+ offset = _this.el.offset();
+ return _this.startRange(evt.pageX - offset.left);
+ });
+ this.el.bind('mouseup', function(evt) {
+ var offset;
+ offset = _this.el.offset();
+ _this.endRange(evt.pageX - offset.left);
+ return _this.fire('hovermove', evt.pageX - offset.left, evt.pageY - offset.top);
+ });
+ }
+ if (this.options.resize) {
+ $(window).bind('resize', function(evt) {
+ if (_this.timeoutId != null) {
+ window.clearTimeout(_this.timeoutId);
+ }
+ return _this.timeoutId = window.setTimeout(_this.resizeHandler, 100);
+ });
+ }
+ this.el.css('-webkit-tap-highlight-color', 'rgba(0,0,0,0)');
+ if (this.postInit) {
+ this.postInit();
+ }
+ }
+
+ Grid.prototype.gridDefaults = {
+ dateFormat: null,
+ axes: true,
+ grid: true,
+ gridLineColor: '#aaa',
+ gridStrokeWidth: 0.5,
+ gridTextColor: '#888',
+ gridTextSize: 12,
+ gridTextFamily: 'sans-serif',
+ gridTextWeight: 'normal',
+ hideHover: false,
+ yLabelFormat: null,
+ xLabelAngle: 0,
+ numLines: 5,
+ padding: 25,
+ parseTime: true,
+ postUnits: '',
+ preUnits: '',
+ ymax: 'auto',
+ ymin: 'auto 0',
+ goals: [],
+ goalStrokeWidth: 1.0,
+ goalLineColors: ['#666633', '#999966', '#cc6666', '#663333'],
+ events: [],
+ eventStrokeWidth: 1.0,
+ eventLineColors: ['#005a04', '#ccffbb', '#3a5f0b', '#005502'],
+ rangeSelect: null,
+ rangeSelectColor: '#eef',
+ resize: false
+ };
+
+ Grid.prototype.setData = function(data, redraw) {
+ var e, idx, index, maxGoal, minGoal, ret, row, step, total, y, ykey, ymax, ymin, yval, _ref;
+ if (redraw == null) {
+ redraw = true;
+ }
+ this.options.data = data;
+ if ((data == null) || data.length === 0) {
+ this.data = [];
+ this.raphael.clear();
+ if (this.hover != null) {
+ this.hover.hide();
+ }
+ return;
+ }
+ ymax = this.cumulative ? 0 : null;
+ ymin = this.cumulative ? 0 : null;
+ if (this.options.goals.length > 0) {
+ minGoal = Math.min.apply(Math, this.options.goals);
+ maxGoal = Math.max.apply(Math, this.options.goals);
+ ymin = ymin != null ? Math.min(ymin, minGoal) : minGoal;
+ ymax = ymax != null ? Math.max(ymax, maxGoal) : maxGoal;
+ }
+ this.data = (function() {
+ var _i, _len, _results;
+ _results = [];
+ for (index = _i = 0, _len = data.length; _i < _len; index = ++_i) {
+ row = data[index];
+ ret = {
+ src: row
+ };
+ ret.label = row[this.options.xkey];
+ if (this.options.parseTime) {
+ ret.x = Morris.parseDate(ret.label);
+ if (this.options.dateFormat) {
+ ret.label = this.options.dateFormat(ret.x);
+ } else if (typeof ret.label === 'number') {
+ ret.label = new Date(ret.label).toString();
+ }
+ } else {
+ ret.x = index;
+ if (this.options.xLabelFormat) {
+ ret.label = this.options.xLabelFormat(ret);
+ }
+ }
+ total = 0;
+ ret.y = (function() {
+ var _j, _len1, _ref, _results1;
+ _ref = this.options.ykeys;
+ _results1 = [];
+ for (idx = _j = 0, _len1 = _ref.length; _j < _len1; idx = ++_j) {
+ ykey = _ref[idx];
+ yval = row[ykey];
+ if (typeof yval === 'string') {
+ yval = parseFloat(yval);
+ }
+ if ((yval != null) && typeof yval !== 'number') {
+ yval = null;
+ }
+ if (yval != null) {
+ if (this.cumulative) {
+ total += yval;
+ } else {
+ if (ymax != null) {
+ ymax = Math.max(yval, ymax);
+ ymin = Math.min(yval, ymin);
+ } else {
+ ymax = ymin = yval;
+ }
+ }
+ }
+ if (this.cumulative && (total != null)) {
+ ymax = Math.max(total, ymax);
+ ymin = Math.min(total, ymin);
+ }
+ _results1.push(yval);
+ }
+ return _results1;
+ }).call(this);
+ _results.push(ret);
+ }
+ return _results;
+ }).call(this);
+ if (this.options.parseTime) {
+ this.data = this.data.sort(function(a, b) {
+ return (a.x > b.x) - (b.x > a.x);
+ });
+ }
+ this.xmin = this.data[0].x;
+ this.xmax = this.data[this.data.length - 1].x;
+ this.events = [];
+ if (this.options.events.length > 0) {
+ if (this.options.parseTime) {
+ this.events = (function() {
+ var _i, _len, _ref, _results;
+ _ref = this.options.events;
+ _results = [];
+ for (_i = 0, _len = _ref.length; _i < _len; _i++) {
+ e = _ref[_i];
+ _results.push(Morris.parseDate(e));
+ }
+ return _results;
+ }).call(this);
+ } else {
+ this.events = this.options.events;
+ }
+ this.xmax = Math.max(this.xmax, Math.max.apply(Math, this.events));
+ this.xmin = Math.min(this.xmin, Math.min.apply(Math, this.events));
+ }
+ if (this.xmin === this.xmax) {
+ this.xmin -= 1;
+ this.xmax += 1;
+ }
+ this.ymin = this.yboundary('min', ymin);
+ this.ymax = this.yboundary('max', ymax);
+ if (this.ymin === this.ymax) {
+ if (ymin) {
+ this.ymin -= 1;
+ }
+ this.ymax += 1;
+ }
+ if (((_ref = this.options.axes) === true || _ref === 'both' || _ref === 'y') || this.options.grid === true) {
+ if (this.options.ymax === this.gridDefaults.ymax && this.options.ymin === this.gridDefaults.ymin) {
+ this.grid = this.autoGridLines(this.ymin, this.ymax, this.options.numLines);
+ this.ymin = Math.min(this.ymin, this.grid[0]);
+ this.ymax = Math.max(this.ymax, this.grid[this.grid.length - 1]);
+ } else {
+ step = (this.ymax - this.ymin) / (this.options.numLines - 1);
+ this.grid = (function() {
+ var _i, _ref1, _ref2, _results;
+ _results = [];
+ for (y = _i = _ref1 = this.ymin, _ref2 = this.ymax; step > 0 ? _i <= _ref2 : _i >= _ref2; y = _i += step) {
+ _results.push(y);
+ }
+ return _results;
+ }).call(this);
+ }
+ }
+ this.dirty = true;
+ if (redraw) {
+ return this.redraw();
+ }
+ };
+
+ Grid.prototype.yboundary = function(boundaryType, currentValue) {
+ var boundaryOption, suggestedValue;
+ boundaryOption = this.options["y" + boundaryType];
+ if (typeof boundaryOption === 'string') {
+ if (boundaryOption.slice(0, 4) === 'auto') {
+ if (boundaryOption.length > 5) {
+ suggestedValue = parseInt(boundaryOption.slice(5), 10);
+ if (currentValue == null) {
+ return suggestedValue;
+ }
+ return Math[boundaryType](currentValue, suggestedValue);
+ } else {
+ if (currentValue != null) {
+ return currentValue;
+ } else {
+ return 0;
+ }
+ }
+ } else {
+ return parseInt(boundaryOption, 10);
+ }
+ } else {
+ return boundaryOption;
+ }
+ };
+
+ Grid.prototype.autoGridLines = function(ymin, ymax, nlines) {
+ var gmax, gmin, grid, smag, span, step, unit, y, ymag;
+ span = ymax - ymin;
+ ymag = Math.floor(Math.log(span) / Math.log(10));
+ unit = Math.pow(10, ymag);
+ gmin = Math.floor(ymin / unit) * unit;
+ gmax = Math.ceil(ymax / unit) * unit;
+ step = (gmax - gmin) / (nlines - 1);
+ if (unit === 1 && step > 1 && Math.ceil(step) !== step) {
+ step = Math.ceil(step);
+ gmax = gmin + step * (nlines - 1);
+ }
+ if (gmin < 0 && gmax > 0) {
+ gmin = Math.floor(ymin / step) * step;
+ gmax = Math.ceil(ymax / step) * step;
+ }
+ if (step < 1) {
+ smag = Math.floor(Math.log(step) / Math.log(10));
+ grid = (function() {
+ var _i, _results;
+ _results = [];
+ for (y = _i = gmin; step > 0 ? _i <= gmax : _i >= gmax; y = _i += step) {
+ _results.push(parseFloat(y.toFixed(1 - smag)));
+ }
+ return _results;
+ })();
+ } else {
+ grid = (function() {
+ var _i, _results;
+ _results = [];
+ for (y = _i = gmin; step > 0 ? _i <= gmax : _i >= gmax; y = _i += step) {
+ _results.push(y);
+ }
+ return _results;
+ })();
+ }
+ return grid;
+ };
+
+ Grid.prototype._calc = function() {
+ var bottomOffsets, gridLine, h, i, w, yLabelWidths, _ref, _ref1;
+ w = this.el.width();
+ h = this.el.height();
+ if (this.elementWidth !== w || this.elementHeight !== h || this.dirty) {
+ this.elementWidth = w;
+ this.elementHeight = h;
+ this.dirty = false;
+ this.left = this.options.padding;
+ this.right = this.elementWidth - this.options.padding;
+ this.top = this.options.padding;
+ this.bottom = this.elementHeight - this.options.padding;
+ if ((_ref = this.options.axes) === true || _ref === 'both' || _ref === 'y') {
+ yLabelWidths = (function() {
+ var _i, _len, _ref1, _results;
+ _ref1 = this.grid;
+ _results = [];
+ for (_i = 0, _len = _ref1.length; _i < _len; _i++) {
+ gridLine = _ref1[_i];
+ _results.push(this.measureText(this.yAxisFormat(gridLine)).width);
+ }
+ return _results;
+ }).call(this);
+ this.left += Math.max.apply(Math, yLabelWidths);
+ }
+ if ((_ref1 = this.options.axes) === true || _ref1 === 'both' || _ref1 === 'x') {
+ bottomOffsets = (function() {
+ var _i, _ref2, _results;
+ _results = [];
+ for (i = _i = 0, _ref2 = this.data.length; 0 <= _ref2 ? _i < _ref2 : _i > _ref2; i = 0 <= _ref2 ? ++_i : --_i) {
+ _results.push(this.measureText(this.data[i].text, -this.options.xLabelAngle).height);
+ }
+ return _results;
+ }).call(this);
+ this.bottom -= Math.max.apply(Math, bottomOffsets);
+ }
+ this.width = Math.max(1, this.right - this.left);
+ this.height = Math.max(1, this.bottom - this.top);
+ this.dx = this.width / (this.xmax - this.xmin);
+ this.dy = this.height / (this.ymax - this.ymin);
+ if (this.calc) {
+ return this.calc();
+ }
+ }
+ };
+
+ Grid.prototype.transY = function(y) {
+ return this.bottom - (y - this.ymin) * this.dy;
+ };
+
+ Grid.prototype.transX = function(x) {
+ if (this.data.length === 1) {
+ return (this.left + this.right) / 2;
+ } else {
+ return this.left + (x - this.xmin) * this.dx;
+ }
+ };
+
+ Grid.prototype.redraw = function() {
+ this.raphael.clear();
+ this._calc();
+ this.drawGrid();
+ this.drawGoals();
+ this.drawEvents();
+ if (this.draw) {
+ return this.draw();
+ }
+ };
+
+ Grid.prototype.measureText = function(text, angle) {
+ var ret, tt;
+ if (angle == null) {
+ angle = 0;
+ }
+ tt = this.raphael.text(100, 100, text).attr('font-size', this.options.gridTextSize).attr('font-family', this.options.gridTextFamily).attr('font-weight', this.options.gridTextWeight).rotate(angle);
+ ret = tt.getBBox();
+ tt.remove();
+ return ret;
+ };
+
+ Grid.prototype.yAxisFormat = function(label) {
+ return this.yLabelFormat(label);
+ };
+
+ Grid.prototype.yLabelFormat = function(label) {
+ if (typeof this.options.yLabelFormat === 'function') {
+ return this.options.yLabelFormat(label);
+ } else {
+ return "" + this.options.preUnits + (Morris.commas(label)) + this.options.postUnits;
+ }
+ };
+
+ Grid.prototype.drawGrid = function() {
+ var lineY, y, _i, _len, _ref, _ref1, _ref2, _results;
+ if (this.options.grid === false && ((_ref = this.options.axes) !== true && _ref !== 'both' && _ref !== 'y')) {
+ return;
+ }
+ _ref1 = this.grid;
+ _results = [];
+ for (_i = 0, _len = _ref1.length; _i < _len; _i++) {
+ lineY = _ref1[_i];
+ y = this.transY(lineY);
+ if ((_ref2 = this.options.axes) === true || _ref2 === 'both' || _ref2 === 'y') {
+ this.drawYAxisLabel(this.left - this.options.padding / 2, y, this.yAxisFormat(lineY));
+ }
+ if (this.options.grid) {
+ _results.push(this.drawGridLine("M" + this.left + "," + y + "H" + (this.left + this.width)));
+ } else {
+ _results.push(void 0);
+ }
+ }
+ return _results;
+ };
+
+ Grid.prototype.drawGoals = function() {
+ var color, goal, i, _i, _len, _ref, _results;
+ _ref = this.options.goals;
+ _results = [];
+ for (i = _i = 0, _len = _ref.length; _i < _len; i = ++_i) {
+ goal = _ref[i];
+ color = this.options.goalLineColors[i % this.options.goalLineColors.length];
+ _results.push(this.drawGoal(goal, color));
+ }
+ return _results;
+ };
+
+ Grid.prototype.drawEvents = function() {
+ var color, event, i, _i, _len, _ref, _results;
+ _ref = this.events;
+ _results = [];
+ for (i = _i = 0, _len = _ref.length; _i < _len; i = ++_i) {
+ event = _ref[i];
+ color = this.options.eventLineColors[i % this.options.eventLineColors.length];
+ _results.push(this.drawEvent(event, color));
+ }
+ return _results;
+ };
+
+ Grid.prototype.drawGoal = function(goal, color) {
+ return this.raphael.path("M" + this.left + "," + (this.transY(goal)) + "H" + this.right).attr('stroke', color).attr('stroke-width', this.options.goalStrokeWidth);
+ };
+
+ Grid.prototype.drawEvent = function(event, color) {
+ return this.raphael.path("M" + (this.transX(event)) + "," + this.bottom + "V" + this.top).attr('stroke', color).attr('stroke-width', this.options.eventStrokeWidth);
+ };
+
+ Grid.prototype.drawYAxisLabel = function(xPos, yPos, text) {
+ return this.raphael.text(xPos, yPos, text).attr('font-size', this.options.gridTextSize).attr('font-family', this.options.gridTextFamily).attr('font-weight', this.options.gridTextWeight).attr('fill', this.options.gridTextColor).attr('text-anchor', 'end');
+ };
+
+ Grid.prototype.drawGridLine = function(path) {
+ return this.raphael.path(path).attr('stroke', this.options.gridLineColor).attr('stroke-width', this.options.gridStrokeWidth);
+ };
+
+ Grid.prototype.startRange = function(x) {
+ this.hover.hide();
+ this.selectFrom = x;
+ return this.selectionRect.attr({
+ x: x,
+ width: 0
+ }).show();
+ };
+
+ Grid.prototype.endRange = function(x) {
+ var end, start;
+ if (this.selectFrom) {
+ start = Math.min(this.selectFrom, x);
+ end = Math.max(this.selectFrom, x);
+ this.options.rangeSelect.call(this.el, {
+ start: this.data[this.hitTest(start)].x,
+ end: this.data[this.hitTest(end)].x
+ });
+ return this.selectFrom = null;
+ }
+ };
+
+ Grid.prototype.resizeHandler = function() {
+ this.timeoutId = null;
+ this.raphael.setSize(this.el.width(), this.el.height());
+ return this.redraw();
+ };
+
+ return Grid;
+
+ })(Morris.EventEmitter);
+
+ Morris.parseDate = function(date) {
+ var isecs, m, msecs, n, o, offsetmins, p, q, r, ret, secs;
+ if (typeof date === 'number') {
+ return date;
+ }
+ m = date.match(/^(\d+) Q(\d)$/);
+ n = date.match(/^(\d+)-(\d+)$/);
+ o = date.match(/^(\d+)-(\d+)-(\d+)$/);
+ p = date.match(/^(\d+) W(\d+)$/);
+ q = date.match(/^(\d+)-(\d+)-(\d+)[ T](\d+):(\d+)(Z|([+-])(\d\d):?(\d\d))?$/);
+ r = date.match(/^(\d+)-(\d+)-(\d+)[ T](\d+):(\d+):(\d+(\.\d+)?)(Z|([+-])(\d\d):?(\d\d))?$/);
+ if (m) {
+ return new Date(parseInt(m[1], 10), parseInt(m[2], 10) * 3 - 1, 1).getTime();
+ } else if (n) {
+ return new Date(parseInt(n[1], 10), parseInt(n[2], 10) - 1, 1).getTime();
+ } else if (o) {
+ return new Date(parseInt(o[1], 10), parseInt(o[2], 10) - 1, parseInt(o[3], 10)).getTime();
+ } else if (p) {
+ ret = new Date(parseInt(p[1], 10), 0, 1);
+ if (ret.getDay() !== 4) {
+ ret.setMonth(0, 1 + ((4 - ret.getDay()) + 7) % 7);
+ }
+ return ret.getTime() + parseInt(p[2], 10) * 604800000;
+ } else if (q) {
+ if (!q[6]) {
+ return new Date(parseInt(q[1], 10), parseInt(q[2], 10) - 1, parseInt(q[3], 10), parseInt(q[4], 10), parseInt(q[5], 10)).getTime();
+ } else {
+ offsetmins = 0;
+ if (q[6] !== 'Z') {
+ offsetmins = parseInt(q[8], 10) * 60 + parseInt(q[9], 10);
+ if (q[7] === '+') {
+ offsetmins = 0 - offsetmins;
+ }
+ }
+ return Date.UTC(parseInt(q[1], 10), parseInt(q[2], 10) - 1, parseInt(q[3], 10), parseInt(q[4], 10), parseInt(q[5], 10) + offsetmins);
+ }
+ } else if (r) {
+ secs = parseFloat(r[6]);
+ isecs = Math.floor(secs);
+ msecs = Math.round((secs - isecs) * 1000);
+ if (!r[8]) {
+ return new Date(parseInt(r[1], 10), parseInt(r[2], 10) - 1, parseInt(r[3], 10), parseInt(r[4], 10), parseInt(r[5], 10), isecs, msecs).getTime();
+ } else {
+ offsetmins = 0;
+ if (r[8] !== 'Z') {
+ offsetmins = parseInt(r[10], 10) * 60 + parseInt(r[11], 10);
+ if (r[9] === '+') {
+ offsetmins = 0 - offsetmins;
+ }
+ }
+ return Date.UTC(parseInt(r[1], 10), parseInt(r[2], 10) - 1, parseInt(r[3], 10), parseInt(r[4], 10), parseInt(r[5], 10) + offsetmins, isecs, msecs);
+ }
+ } else {
+ return new Date(parseInt(date, 10), 0, 1).getTime();
+ }
+ };
+
+ Morris.Hover = (function() {
+ Hover.defaults = {
+ "class": 'morris-hover morris-default-style'
+ };
+
+ function Hover(options) {
+ if (options == null) {
+ options = {};
+ }
+ this.options = $.extend({}, Morris.Hover.defaults, options);
+ this.el = $("<div class='" + this.options["class"] + "'></div>");
+ this.el.hide();
+ this.options.parent.append(this.el);
+ }
+
+ Hover.prototype.update = function(html, x, y) {
+ if (!html) {
+ return this.hide();
+ } else {
+ this.html(html);
+ this.show();
+ return this.moveTo(x, y);
+ }
+ };
+
+ Hover.prototype.html = function(content) {
+ return this.el.html(content);
+ };
+
+ Hover.prototype.moveTo = function(x, y) {
+ var hoverHeight, hoverWidth, left, parentHeight, parentWidth, top;
+ parentWidth = this.options.parent.innerWidth();
+ parentHeight = this.options.parent.innerHeight();
+ hoverWidth = this.el.outerWidth();
+ hoverHeight = this.el.outerHeight();
+ left = Math.min(Math.max(0, x - hoverWidth / 2), parentWidth - hoverWidth);
+ if (y != null) {
+ top = y - hoverHeight - 10;
+ if (top < 0) {
+ top = y + 10;
+ if (top + hoverHeight > parentHeight) {
+ top = parentHeight / 2 - hoverHeight / 2;
+ }
+ }
+ } else {
+ top = parentHeight / 2 - hoverHeight / 2;
+ }
+ return this.el.css({
+ left: left + "px",
+ top: parseInt(top) + "px"
+ });
+ };
+
+ Hover.prototype.show = function() {
+ return this.el.show();
+ };
+
+ Hover.prototype.hide = function() {
+ return this.el.hide();
+ };
+
+ return Hover;
+
+ })();
+
+ Morris.Line = (function(_super) {
+ __extends(Line, _super);
+
+ function Line(options) {
+ this.hilight = __bind(this.hilight, this);
+ this.onHoverOut = __bind(this.onHoverOut, this);
+ this.onHoverMove = __bind(this.onHoverMove, this);
+ this.onGridClick = __bind(this.onGridClick, this);
+ if (!(this instanceof Morris.Line)) {
+ return new Morris.Line(options);
+ }
+ Line.__super__.constructor.call(this, options);
+ }
+
+ Line.prototype.init = function() {
+ if (this.options.hideHover !== 'always') {
+ this.hover = new Morris.Hover({
+ parent: this.el
+ });
+ this.on('hovermove', this.onHoverMove);
+ this.on('hoverout', this.onHoverOut);
+ return this.on('gridclick', this.onGridClick);
+ }
+ };
+
+ Line.prototype.defaults = {
+ lineWidth: 3,
+ pointSize: 4,
+ lineColors: ['#0b62a4', '#7A92A3', '#4da74d', '#afd8f8', '#edc240', '#cb4b4b', '#9440ed'],
+ pointStrokeWidths: [1],
+ pointStrokeColors: ['#ffffff'],
+ pointFillColors: [],
+ smooth: true,
+ xLabels: 'auto',
+ xLabelFormat: null,
+ xLabelMargin: 24,
+ hideHover: false
+ };
+
+ Line.prototype.calc = function() {
+ this.calcPoints();
+ return this.generatePaths();
+ };
+
+ Line.prototype.calcPoints = function() {
+ var row, y, _i, _len, _ref, _results;
+ _ref = this.data;
+ _results = [];
+ for (_i = 0, _len = _ref.length; _i < _len; _i++) {
+ row = _ref[_i];
+ row._x = this.transX(row.x);
+ row._y = (function() {
+ var _j, _len1, _ref1, _results1;
+ _ref1 = row.y;
+ _results1 = [];
+ for (_j = 0, _len1 = _ref1.length; _j < _len1; _j++) {
+ y = _ref1[_j];
+ if (y != null) {
+ _results1.push(this.transY(y));
+ } else {
+ _results1.push(y);
+ }
+ }
+ return _results1;
+ }).call(this);
+ _results.push(row._ymax = Math.min.apply(Math, [this.bottom].concat((function() {
+ var _j, _len1, _ref1, _results1;
+ _ref1 = row._y;
+ _results1 = [];
+ for (_j = 0, _len1 = _ref1.length; _j < _len1; _j++) {
+ y = _ref1[_j];
+ if (y != null) {
+ _results1.push(y);
+ }
+ }
+ return _results1;
+ })())));
+ }
+ return _results;
+ };
+
+ Line.prototype.hitTest = function(x) {
+ var index, r, _i, _len, _ref;
+ if (this.data.length === 0) {
+ return null;
+ }
+ _ref = this.data.slice(1);
+ for (index = _i = 0, _len = _ref.length; _i < _len; index = ++_i) {
+ r = _ref[index];
+ if (x < (r._x + this.data[index]._x) / 2) {
+ break;
+ }
+ }
+ return index;
+ };
+
+ Line.prototype.onGridClick = function(x, y) {
+ var index;
+ index = this.hitTest(x);
+ return this.fire('click', index, this.data[index].src, x, y);
+ };
+
+ Line.prototype.onHoverMove = function(x, y) {
+ var index;
+ index = this.hitTest(x);
+ return this.displayHoverForRow(index);
+ };
+
+ Line.prototype.onHoverOut = function() {
+ if (this.options.hideHover !== false) {
+ return this.displayHoverForRow(null);
+ }
+ };
+
+ Line.prototype.displayHoverForRow = function(index) {
+ var _ref;
+ if (index != null) {
+ (_ref = this.hover).update.apply(_ref, this.hoverContentForRow(index));
+ return this.hilight(index);
+ } else {
+ this.hover.hide();
+ return this.hilight();
+ }
+ };
+
+ Line.prototype.hoverContentForRow = function(index) {
+ var content, j, row, y, _i, _len, _ref;
+ row = this.data[index];
+ content = "<div class='morris-hover-row-label'>" + row.label + "</div>";
+ _ref = row.y;
+ for (j = _i = 0, _len = _ref.length; _i < _len; j = ++_i) {
+ y = _ref[j];
+ content += "<div class='morris-hover-point' style='color: " + (this.colorFor(row, j, 'label')) + "'>\n " + this.options.labels[j] + ":\n " + (this.yLabelFormat(y)) + "\n</div>";
+ }
+ if (typeof this.options.hoverCallback === 'function') {
+ content = this.options.hoverCallback(index, this.options, content, row.src);
+ }
+ return [content, row._x, row._ymax];
+ };
+
+ Line.prototype.generatePaths = function() {
+ var coords, i, r, smooth;
+ return this.paths = (function() {
+ var _i, _ref, _ref1, _results;
+ _results = [];
+ for (i = _i = 0, _ref = this.options.ykeys.length; 0 <= _ref ? _i < _ref : _i > _ref; i = 0 <= _ref ? ++_i : --_i) {
+ smooth = typeof this.options.smooth === "boolean" ? this.options.smooth : (_ref1 = this.options.ykeys[i], __indexOf.call(this.options.smooth, _ref1) >= 0);
+ coords = (function() {
+ var _j, _len, _ref2, _results1;
+ _ref2 = this.data;
+ _results1 = [];
+ for (_j = 0, _len = _ref2.length; _j < _len; _j++) {
+ r = _ref2[_j];
+ if (r._y[i] !== void 0) {
+ _results1.push({
+ x: r._x,
+ y: r._y[i]
+ });
+ }
+ }
+ return _results1;
+ }).call(this);
+ if (coords.length > 1) {
+ _results.push(Morris.Line.createPath(coords, smooth, this.bottom));
+ } else {
+ _results.push(null);
+ }
+ }
+ return _results;
+ }).call(this);
+ };
+
+ Line.prototype.draw = function() {
+ var _ref;
+ if ((_ref = this.options.axes) === true || _ref === 'both' || _ref === 'x') {
+ this.drawXAxis();
+ }
+ this.drawSeries();
+ if (this.options.hideHover === false) {
+ return this.displayHoverForRow(this.data.length - 1);
+ }
+ };
+
+ Line.prototype.drawXAxis = function() {
+ var drawLabel, l, labels, prevAngleMargin, prevLabelMargin, row, ypos, _i, _len, _results,
+ _this = this;
+ ypos = this.bottom + this.options.padding / 2;
+ prevLabelMargin = null;
+ prevAngleMargin = null;
+ drawLabel = function(labelText, xpos) {
+ var label, labelBox, margin, offset, textBox;
+ label = _this.drawXAxisLabel(_this.transX(xpos), ypos, labelText);
+ textBox = label.getBBox();
+ label.transform("r" + (-_this.options.xLabelAngle));
+ labelBox = label.getBBox();
+ label.transform("t0," + (labelBox.height / 2) + "...");
+ if (_this.options.xLabelAngle !== 0) {
+ offset = -0.5 * textBox.width * Math.cos(_this.options.xLabelAngle * Math.PI / 180.0);
+ label.transform("t" + offset + ",0...");
+ }
+ labelBox = label.getBBox();
+ if (((prevLabelMargin == null) || prevLabelMargin >= labelBox.x + labelBox.width || (prevAngleMargin != null) && prevAngleMargin >= labelBox.x) && labelBox.x >= 0 && (labelBox.x + labelBox.width) < _this.el.width()) {
+ if (_this.options.xLabelAngle !== 0) {
+ margin = 1.25 * _this.options.gridTextSize / Math.sin(_this.options.xLabelAngle * Math.PI / 180.0);
+ prevAngleMargin = labelBox.x - margin;
+ }
+ return prevLabelMargin = labelBox.x - _this.options.xLabelMargin;
+ } else {
+ return label.remove();
+ }
+ };
+ if (this.options.parseTime) {
+ if (this.data.length === 1 && this.options.xLabels === 'auto') {
+ labels = [[this.data[0].label, this.data[0].x]];
+ } else {
+ labels = Morris.labelSeries(this.xmin, this.xmax, this.width, this.options.xLabels, this.options.xLabelFormat);
+ }
+ } else {
+ labels = (function() {
+ var _i, _len, _ref, _results;
+ _ref = this.data;
+ _results = [];
+ for (_i = 0, _len = _ref.length; _i < _len; _i++) {
+ row = _ref[_i];
+ _results.push([row.label, row.x]);
+ }
+ return _results;
+ }).call(this);
+ }
+ labels.reverse();
+ _results = [];
+ for (_i = 0, _len = labels.length; _i < _len; _i++) {
+ l = labels[_i];
+ _results.push(drawLabel(l[0], l[1]));
+ }
+ return _results;
+ };
+
+ Line.prototype.drawSeries = function() {
+ var i, _i, _j, _ref, _ref1, _results;
+ this.seriesPoints = [];
+ for (i = _i = _ref = this.options.ykeys.length - 1; _ref <= 0 ? _i <= 0 : _i >= 0; i = _ref <= 0 ? ++_i : --_i) {
+ this._drawLineFor(i);
+ }
+ _results = [];
+ for (i = _j = _ref1 = this.options.ykeys.length - 1; _ref1 <= 0 ? _j <= 0 : _j >= 0; i = _ref1 <= 0 ? ++_j : --_j) {
+ _results.push(this._drawPointFor(i));
+ }
+ return _results;
+ };
+
+ Line.prototype._drawPointFor = function(index) {
+ var circle, row, _i, _len, _ref, _results;
+ this.seriesPoints[index] = [];
+ _ref = this.data;
+ _results = [];
+ for (_i = 0, _len = _ref.length; _i < _len; _i++) {
+ row = _ref[_i];
+ circle = null;
+ if (row._y[index] != null) {
+ circle = this.drawLinePoint(row._x, row._y[index], this.colorFor(row, index, 'point'), index);
+ }
+ _results.push(this.seriesPoints[index].push(circle));
+ }
+ return _results;
+ };
+
+ Line.prototype._drawLineFor = function(index) {
+ var path;
+ path = this.paths[index];
+ if (path !== null) {
+ return this.drawLinePath(path, this.colorFor(null, index, 'line'), index);
+ }
+ };
+
+ Line.createPath = function(coords, smooth, bottom) {
+ var coord, g, grads, i, ix, lg, path, prevCoord, x1, x2, y1, y2, _i, _len;
+ path = "";
+ if (smooth) {
+ grads = Morris.Line.gradients(coords);
+ }
+ prevCoord = {
+ y: null
+ };
+ for (i = _i = 0, _len = coords.length; _i < _len; i = ++_i) {
+ coord = coords[i];
+ if (coord.y != null) {
+ if (prevCoord.y != null) {
+ if (smooth) {
+ g = grads[i];
+ lg = grads[i - 1];
+ ix = (coord.x - prevCoord.x) / 4;
+ x1 = prevCoord.x + ix;
+ y1 = Math.min(bottom, prevCoord.y + ix * lg);
+ x2 = coord.x - ix;
+ y2 = Math.min(bottom, coord.y - ix * g);
+ path += "C" + x1 + "," + y1 + "," + x2 + "," + y2 + "," + coord.x + "," + coord.y;
+ } else {
+ path += "L" + coord.x + "," + coord.y;
+ }
+ } else {
+ if (!smooth || (grads[i] != null)) {
+ path += "M" + coord.x + "," + coord.y;
+ }
+ }
+ }
+ prevCoord = coord;
+ }
+ return path;
+ };
+
+ Line.gradients = function(coords) {
+ var coord, grad, i, nextCoord, prevCoord, _i, _len, _results;
+ grad = function(a, b) {
+ return (a.y - b.y) / (a.x - b.x);
+ };
+ _results = [];
+ for (i = _i = 0, _len = coords.length; _i < _len; i = ++_i) {
+ coord = coords[i];
+ if (coord.y != null) {
+ nextCoord = coords[i + 1] || {
+ y: null
+ };
+ prevCoord = coords[i - 1] || {
+ y: null
+ };
+ if ((prevCoord.y != null) && (nextCoord.y != null)) {
+ _results.push(grad(prevCoord, nextCoord));
+ } else if (prevCoord.y != null) {
+ _results.push(grad(prevCoord, coord));
+ } else if (nextCoord.y != null) {
+ _results.push(grad(coord, nextCoord));
+ } else {
+ _results.push(null);
+ }
+ } else {
+ _results.push(null);
+ }
+ }
+ return _results;
+ };
+
+ Line.prototype.hilight = function(index) {
+ var i, _i, _j, _ref, _ref1;
+ if (this.prevHilight !== null && this.prevHilight !== index) {
+ for (i = _i = 0, _ref = this.seriesPoints.length - 1; 0 <= _ref ? _i <= _ref : _i >= _ref; i = 0 <= _ref ? ++_i : --_i) {
+ if (this.seriesPoints[i][this.prevHilight]) {
+ this.seriesPoints[i][this.prevHilight].animate(this.pointShrinkSeries(i));
+ }
+ }
+ }
+ if (index !== null && this.prevHilight !== index) {
+ for (i = _j = 0, _ref1 = this.seriesPoints.length - 1; 0 <= _ref1 ? _j <= _ref1 : _j >= _ref1; i = 0 <= _ref1 ? ++_j : --_j) {
+ if (this.seriesPoints[i][index]) {
+ this.seriesPoints[i][index].animate(this.pointGrowSeries(i));
+ }
+ }
+ }
+ return this.prevHilight = index;
+ };
+
+ Line.prototype.colorFor = function(row, sidx, type) {
+ if (typeof this.options.lineColors === 'function') {
+ return this.options.lineColors.call(this, row, sidx, type);
+ } else if (type === 'point') {
+ return this.options.pointFillColors[sidx % this.options.pointFillColors.length] || this.options.lineColors[sidx % this.options.lineColors.length];
+ } else {
+ return this.options.lineColors[sidx % this.options.lineColors.length];
+ }
+ };
+
+ Line.prototype.drawXAxisLabel = function(xPos, yPos, text) {
+ return this.raphael.text(xPos, yPos, text).attr('font-size', this.options.gridTextSize).attr('font-family', this.options.gridTextFamily).attr('font-weight', this.options.gridTextWeight).attr('fill', this.options.gridTextColor);
+ };
+
+ Line.prototype.drawLinePath = function(path, lineColor, lineIndex) {
+ return this.raphael.path(path).attr('stroke', lineColor).attr('stroke-width', this.lineWidthForSeries(lineIndex));
+ };
+
+ Line.prototype.drawLinePoint = function(xPos, yPos, pointColor, lineIndex) {
+ return this.raphael.circle(xPos, yPos, this.pointSizeForSeries(lineIndex)).attr('fill', pointColor).attr('stroke-width', this.pointStrokeWidthForSeries(lineIndex)).attr('stroke', this.pointStrokeColorForSeries(lineIndex));
+ };
+
+ Line.prototype.pointStrokeWidthForSeries = function(index) {
+ return this.options.pointStrokeWidths[index % this.options.pointStrokeWidths.length];
+ };
+
+ Line.prototype.pointStrokeColorForSeries = function(index) {
+ return this.options.pointStrokeColors[index % this.options.pointStrokeColors.length];
+ };
+
+ Line.prototype.lineWidthForSeries = function(index) {
+ if (this.options.lineWidth instanceof Array) {
+ return this.options.lineWidth[index % this.options.lineWidth.length];
+ } else {
+ return this.options.lineWidth;
+ }
+ };
+
+ Line.prototype.pointSizeForSeries = function(index) {
+ if (this.options.pointSize instanceof Array) {
+ return this.options.pointSize[index % this.options.pointSize.length];
+ } else {
+ return this.options.pointSize;
+ }
+ };
+
+ Line.prototype.pointGrowSeries = function(index) {
+ return Raphael.animation({
+ r: this.pointSizeForSeries(index) + 3
+ }, 25, 'linear');
+ };
+
+ Line.prototype.pointShrinkSeries = function(index) {
+ return Raphael.animation({
+ r: this.pointSizeForSeries(index)
+ }, 25, 'linear');
+ };
+
+ return Line;
+
+ })(Morris.Grid);
+
+ Morris.labelSeries = function(dmin, dmax, pxwidth, specName, xLabelFormat) {
+ var d, d0, ddensity, name, ret, s, spec, t, _i, _len, _ref;
+ ddensity = 200 * (dmax - dmin) / pxwidth;
+ d0 = new Date(dmin);
+ spec = Morris.LABEL_SPECS[specName];
+ if (spec === void 0) {
+ _ref = Morris.AUTO_LABEL_ORDER;
+ for (_i = 0, _len = _ref.length; _i < _len; _i++) {
+ name = _ref[_i];
+ s = Morris.LABEL_SPECS[name];
+ if (ddensity >= s.span) {
+ spec = s;
+ break;
+ }
+ }
+ }
+ if (spec === void 0) {
+ spec = Morris.LABEL_SPECS["second"];
+ }
+ if (xLabelFormat) {
+ spec = $.extend({}, spec, {
+ fmt: xLabelFormat
+ });
+ }
+ d = spec.start(d0);
+ ret = [];
+ while ((t = d.getTime()) <= dmax) {
+ if (t >= dmin) {
+ ret.push([spec.fmt(d), t]);
+ }
+ spec.incr(d);
+ }
+ return ret;
+ };
+
+ minutesSpecHelper = function(interval) {
+ return {
+ span: interval * 60 * 1000,
+ start: function(d) {
+ return new Date(d.getFullYear(), d.getMonth(), d.getDate(), d.getHours());
+ },
+ fmt: function(d) {
+ return "" + (Morris.pad2(d.getHours())) + ":" + (Morris.pad2(d.getMinutes()));
+ },
+ incr: function(d) {
+ return d.setUTCMinutes(d.getUTCMinutes() + interval);
+ }
+ };
+ };
+
+ secondsSpecHelper = function(interval) {
+ return {
+ span: interval * 1000,
+ start: function(d) {
+ return new Date(d.getFullYear(), d.getMonth(), d.getDate(), d.getHours(), d.getMinutes());
+ },
+ fmt: function(d) {
+ return "" + (Morris.pad2(d.getHours())) + ":" + (Morris.pad2(d.getMinutes())) + ":" + (Morris.pad2(d.getSeconds()));
+ },
+ incr: function(d) {
+ return d.setUTCSeconds(d.getUTCSeconds() + interval);
+ }
+ };
+ };
+
+ Morris.LABEL_SPECS = {
+ "decade": {
+ span: 172800000000,
+ start: function(d) {
+ return new Date(d.getFullYear() - d.getFullYear() % 10, 0, 1);
+ },
+ fmt: function(d) {
+ return "" + (d.getFullYear());
+ },
+ incr: function(d) {
+ return d.setFullYear(d.getFullYear() + 10);
+ }
+ },
+ "year": {
+ span: 17280000000,
+ start: function(d) {
+ return new Date(d.getFullYear(), 0, 1);
+ },
+ fmt: function(d) {
+ return "" + (d.getFullYear());
+ },
+ incr: function(d) {
+ return d.setFullYear(d.getFullYear() + 1);
+ }
+ },
+ "month": {
+ span: 2419200000,
+ start: function(d) {
+ return new Date(d.getFullYear(), d.getMonth(), 1);
+ },
+ fmt: function(d) {
+ return "" + (d.getFullYear()) + "-" + (Morris.pad2(d.getMonth() + 1));
+ },
+ incr: function(d) {
+ return d.setMonth(d.getMonth() + 1);
+ }
+ },
+ "week": {
+ span: 604800000,
+ start: function(d) {
+ return new Date(d.getFullYear(), d.getMonth(), d.getDate());
+ },
+ fmt: function(d) {
+ return "" + (d.getFullYear()) + "-" + (Morris.pad2(d.getMonth() + 1)) + "-" + (Morris.pad2(d.getDate()));
+ },
+ incr: function(d) {
+ return d.setDate(d.getDate() + 7);
+ }
+ },
+ "day": {
+ span: 86400000,
+ start: function(d) {
+ return new Date(d.getFullYear(), d.getMonth(), d.getDate());
+ },
+ fmt: function(d) {
+ return "" + (d.getFullYear()) + "-" + (Morris.pad2(d.getMonth() + 1)) + "-" + (Morris.pad2(d.getDate()));
+ },
+ incr: function(d) {
+ return d.setDate(d.getDate() + 1);
+ }
+ },
+ "hour": minutesSpecHelper(60),
+ "30min": minutesSpecHelper(30),
+ "15min": minutesSpecHelper(15),
+ "10min": minutesSpecHelper(10),
+ "5min": minutesSpecHelper(5),
+ "minute": minutesSpecHelper(1),
+ "30sec": secondsSpecHelper(30),
+ "15sec": secondsSpecHelper(15),
+ "10sec": secondsSpecHelper(10),
+ "5sec": secondsSpecHelper(5),
+ "second": secondsSpecHelper(1)
+ };
+
+ Morris.AUTO_LABEL_ORDER = ["decade", "year", "month", "week", "day", "hour", "30min", "15min", "10min", "5min", "minute", "30sec", "15sec", "10sec", "5sec", "second"];
+
+ Morris.Area = (function(_super) {
+ var areaDefaults;
+
+ __extends(Area, _super);
+
+ areaDefaults = {
+ fillOpacity: 'auto',
+ behaveLikeLine: false
+ };
+
+ function Area(options) {
+ var areaOptions;
+ if (!(this instanceof Morris.Area)) {
+ return new Morris.Area(options);
+ }
+ areaOptions = $.extend({}, areaDefaults, options);
+ this.cumulative = !areaOptions.behaveLikeLine;
+ if (areaOptions.fillOpacity === 'auto') {
+ areaOptions.fillOpacity = areaOptions.behaveLikeLine ? .8 : 1;
+ }
+ Area.__super__.constructor.call(this, areaOptions);
+ }
+
+ Area.prototype.calcPoints = function() {
+ var row, total, y, _i, _len, _ref, _results;
+ _ref = this.data;
+ _results = [];
+ for (_i = 0, _len = _ref.length; _i < _len; _i++) {
+ row = _ref[_i];
+ row._x = this.transX(row.x);
+ total = 0;
+ row._y = (function() {
+ var _j, _len1, _ref1, _results1;
+ _ref1 = row.y;
+ _results1 = [];
+ for (_j = 0, _len1 = _ref1.length; _j < _len1; _j++) {
+ y = _ref1[_j];
+ if (this.options.behaveLikeLine) {
+ _results1.push(this.transY(y));
+ } else {
+ total += y || 0;
+ _results1.push(this.transY(total));
+ }
+ }
+ return _results1;
+ }).call(this);
+ _results.push(row._ymax = Math.max.apply(Math, row._y));
+ }
+ return _results;
+ };
+
+ Area.prototype.drawSeries = function() {
+ var i, range, _i, _j, _k, _len, _ref, _ref1, _results, _results1, _results2;
+ this.seriesPoints = [];
+ if (this.options.behaveLikeLine) {
+ range = (function() {
+ _results = [];
+ for (var _i = 0, _ref = this.options.ykeys.length - 1; 0 <= _ref ? _i <= _ref : _i >= _ref; 0 <= _ref ? _i++ : _i--){ _results.push(_i); }
+ return _results;
+ }).apply(this);
+ } else {
+ range = (function() {
+ _results1 = [];
+ for (var _j = _ref1 = this.options.ykeys.length - 1; _ref1 <= 0 ? _j <= 0 : _j >= 0; _ref1 <= 0 ? _j++ : _j--){ _results1.push(_j); }
+ return _results1;
+ }).apply(this);
+ }
+ _results2 = [];
+ for (_k = 0, _len = range.length; _k < _len; _k++) {
+ i = range[_k];
+ this._drawFillFor(i);
+ this._drawLineFor(i);
+ _results2.push(this._drawPointFor(i));
+ }
+ return _results2;
+ };
+
+ Area.prototype._drawFillFor = function(index) {
+ var path;
+ path = this.paths[index];
+ if (path !== null) {
+ path = path + ("L" + (this.transX(this.xmax)) + "," + this.bottom + "L" + (this.transX(this.xmin)) + "," + this.bottom + "Z");
+ return this.drawFilledPath(path, this.fillForSeries(index));
+ }
+ };
+
+ Area.prototype.fillForSeries = function(i) {
+ var color;
+ color = Raphael.rgb2hsl(this.colorFor(this.data[i], i, 'line'));
+ return Raphael.hsl(color.h, this.options.behaveLikeLine ? color.s * 0.9 : color.s * 0.75, Math.min(0.98, this.options.behaveLikeLine ? color.l * 1.2 : color.l * 1.25));
+ };
+
+ Area.prototype.drawFilledPath = function(path, fill) {
+ return this.raphael.path(path).attr('fill', fill).attr('fill-opacity', this.options.fillOpacity).attr('stroke', 'none');
+ };
+
+ return Area;
+
+ })(Morris.Line);
+
+ Morris.Bar = (function(_super) {
+ __extends(Bar, _super);
+
+ function Bar(options) {
+ this.onHoverOut = __bind(this.onHoverOut, this);
+ this.onHoverMove = __bind(this.onHoverMove, this);
+ this.onGridClick = __bind(this.onGridClick, this);
+ if (!(this instanceof Morris.Bar)) {
+ return new Morris.Bar(options);
+ }
+ Bar.__super__.constructor.call(this, $.extend({}, options, {
+ parseTime: false
+ }));
+ }
+
+ Bar.prototype.init = function() {
+ this.cumulative = this.options.stacked;
+ if (this.options.hideHover !== 'always') {
+ this.hover = new Morris.Hover({
+ parent: this.el
+ });
+ this.on('hovermove', this.onHoverMove);
+ this.on('hoverout', this.onHoverOut);
+ return this.on('gridclick', this.onGridClick);
+ }
+ };
+
+ Bar.prototype.defaults = {
+ barSizeRatio: 0.75,
+ barGap: 3,
+ barColors: ['#0b62a4', '#7a92a3', '#4da74d', '#afd8f8', '#edc240', '#cb4b4b', '#9440ed'],
+ barOpacity: 1.0,
+ barRadius: [0, 0, 0, 0],
+ xLabelMargin: 50
+ };
+
+ Bar.prototype.calc = function() {
+ var _ref;
+ this.calcBars();
+ if (this.options.hideHover === false) {
+ return (_ref = this.hover).update.apply(_ref, this.hoverContentForRow(this.data.length - 1));
+ }
+ };
+
+ Bar.prototype.calcBars = function() {
+ var idx, row, y, _i, _len, _ref, _results;
+ _ref = this.data;
+ _results = [];
+ for (idx = _i = 0, _len = _ref.length; _i < _len; idx = ++_i) {
+ row = _ref[idx];
+ row._x = this.left + this.width * (idx + 0.5) / this.data.length;
+ _results.push(row._y = (function() {
+ var _j, _len1, _ref1, _results1;
+ _ref1 = row.y;
+ _results1 = [];
+ for (_j = 0, _len1 = _ref1.length; _j < _len1; _j++) {
+ y = _ref1[_j];
+ if (y != null) {
+ _results1.push(this.transY(y));
+ } else {
+ _results1.push(null);
+ }
+ }
+ return _results1;
+ }).call(this));
+ }
+ return _results;
+ };
+
+ Bar.prototype.draw = function() {
+ var _ref;
+ if ((_ref = this.options.axes) === true || _ref === 'both' || _ref === 'x') {
+ this.drawXAxis();
+ }
+ return this.drawSeries();
+ };
+
+ Bar.prototype.drawXAxis = function() {
+ var i, label, labelBox, margin, offset, prevAngleMargin, prevLabelMargin, row, textBox, ypos, _i, _ref, _results;
+ ypos = this.bottom + (this.options.xAxisLabelTopPadding || this.options.padding / 2);
+ prevLabelMargin = null;
+ prevAngleMargin = null;
+ _results = [];
+ for (i = _i = 0, _ref = this.data.length; 0 <= _ref ? _i < _ref : _i > _ref; i = 0 <= _ref ? ++_i : --_i) {
+ row = this.data[this.data.length - 1 - i];
+ label = this.drawXAxisLabel(row._x, ypos, row.label);
+ textBox = label.getBBox();
+ label.transform("r" + (-this.options.xLabelAngle));
+ labelBox = label.getBBox();
+ label.transform("t0," + (labelBox.height / 2) + "...");
+ if (this.options.xLabelAngle !== 0) {
+ offset = -0.5 * textBox.width * Math.cos(this.options.xLabelAngle * Math.PI / 180.0);
+ label.transform("t" + offset + ",0...");
+ }
+ if (((prevLabelMargin == null) || prevLabelMargin >= labelBox.x + labelBox.width || (prevAngleMargin != null) && prevAngleMargin >= labelBox.x) && labelBox.x >= 0 && (labelBox.x + labelBox.width) < this.el.width()) {
+ if (this.options.xLabelAngle !== 0) {
+ margin = 1.25 * this.options.gridTextSize / Math.sin(this.options.xLabelAngle * Math.PI / 180.0);
+ prevAngleMargin = labelBox.x - margin;
+ }
+ _results.push(prevLabelMargin = labelBox.x - this.options.xLabelMargin);
+ } else {
+ _results.push(label.remove());
+ }
+ }
+ return _results;
+ };
+
+ Bar.prototype.drawSeries = function() {
+ var barWidth, bottom, groupWidth, idx, lastTop, left, leftPadding, numBars, row, sidx, size, spaceLeft, top, ypos, zeroPos;
+ groupWidth = this.width / this.options.data.length;
+ numBars = this.options.stacked ? 1 : this.options.ykeys.length;
+ barWidth = (groupWidth * this.options.barSizeRatio - this.options.barGap * (numBars - 1)) / numBars;
+ if (this.options.barSize) {
+ barWidth = Math.min(barWidth, this.options.barSize);
+ }
+ spaceLeft = groupWidth - barWidth * numBars - this.options.barGap * (numBars - 1);
+ leftPadding = spaceLeft / 2;
+ zeroPos = this.ymin <= 0 && this.ymax >= 0 ? this.transY(0) : null;
+ return this.bars = (function() {
+ var _i, _len, _ref, _results;
+ _ref = this.data;
+ _results = [];
+ for (idx = _i = 0, _len = _ref.length; _i < _len; idx = ++_i) {
+ row = _ref[idx];
+ lastTop = 0;
+ _results.push((function() {
+ var _j, _len1, _ref1, _results1;
+ _ref1 = row._y;
+ _results1 = [];
+ for (sidx = _j = 0, _len1 = _ref1.length; _j < _len1; sidx = ++_j) {
+ ypos = _ref1[sidx];
+ if (ypos !== null) {
+ if (zeroPos) {
+ top = Math.min(ypos, zeroPos);
+ bottom = Math.max(ypos, zeroPos);
+ } else {
+ top = ypos;
+ bottom = this.bottom;
+ }
+ left = this.left + idx * groupWidth + leftPadding;
+ if (!this.options.stacked) {
+ left += sidx * (barWidth + this.options.barGap);
+ }
+ size = bottom - top;
+ if (this.options.verticalGridCondition && this.options.verticalGridCondition(row.x)) {
+ this.drawBar(this.left + idx * groupWidth, this.top, groupWidth, Math.abs(this.top - this.bottom), this.options.verticalGridColor, this.options.verticalGridOpacity, this.options.barRadius);
+ }
+ if (this.options.stacked) {
+ top -= lastTop;
+ }
+ this.drawBar(left, top, barWidth, size, this.colorFor(row, sidx, 'bar'), this.options.barOpacity, this.options.barRadius);
+ _results1.push(lastTop += size);
+ } else {
+ _results1.push(null);
+ }
+ }
+ return _results1;
+ }).call(this));
+ }
+ return _results;
+ }).call(this);
+ };
+
+ Bar.prototype.colorFor = function(row, sidx, type) {
+ var r, s;
+ if (typeof this.options.barColors === 'function') {
+ r = {
+ x: row.x,
+ y: row.y[sidx],
+ label: row.label
+ };
+ s = {
+ index: sidx,
+ key: this.options.ykeys[sidx],
+ label: this.options.labels[sidx]
+ };
+ return this.options.barColors.call(this, r, s, type);
+ } else {
+ return this.options.barColors[sidx % this.options.barColors.length];
+ }
+ };
+
+ Bar.prototype.hitTest = function(x) {
+ if (this.data.length === 0) {
+ return null;
+ }
+ x = Math.max(Math.min(x, this.right), this.left);
+ return Math.min(this.data.length - 1, Math.floor((x - this.left) / (this.width / this.data.length)));
+ };
+
+ Bar.prototype.onGridClick = function(x, y) {
+ var index;
+ index = this.hitTest(x);
+ return this.fire('click', index, this.data[index].src, x, y);
+ };
+
+ Bar.prototype.onHoverMove = function(x, y) {
+ var index, _ref;
+ index = this.hitTest(x);
+ return (_ref = this.hover).update.apply(_ref, this.hoverContentForRow(index));
+ };
+
+ Bar.prototype.onHoverOut = function() {
+ if (this.options.hideHover !== false) {
+ return this.hover.hide();
+ }
+ };
+
+ Bar.prototype.hoverContentForRow = function(index) {
+ var content, j, row, x, y, _i, _len, _ref;
+ row = this.data[index];
+ content = "<div class='morris-hover-row-label'>" + row.label + "</div>";
+ _ref = row.y;
+ for (j = _i = 0, _len = _ref.length; _i < _len; j = ++_i) {
+ y = _ref[j];
+ content += "<div class='morris-hover-point' style='color: " + (this.colorFor(row, j, 'label')) + "'>\n " + this.options.labels[j] + ":\n " + (this.yLabelFormat(y)) + "\n</div>";
+ }
+ if (typeof this.options.hoverCallback === 'function') {
+ content = this.options.hoverCallback(index, this.options, content, row.src);
+ }
+ x = this.left + (index + 0.5) * this.width / this.data.length;
+ return [content, x];
+ };
+
+ Bar.prototype.drawXAxisLabel = function(xPos, yPos, text) {
+ var label;
+ return label = this.raphael.text(xPos, yPos, text).attr('font-size', this.options.gridTextSize).attr('font-family', this.options.gridTextFamily).attr('font-weight', this.options.gridTextWeight).attr('fill', this.options.gridTextColor);
+ };
+
+ Bar.prototype.drawBar = function(xPos, yPos, width, height, barColor, opacity, radiusArray) {
+ var maxRadius, path;
+ maxRadius = Math.max.apply(Math, radiusArray);
+ if (maxRadius === 0 || maxRadius > height) {
+ path = this.raphael.rect(xPos, yPos, width, height);
+ } else {
+ path = this.raphael.path(this.roundedRect(xPos, yPos, width, height, radiusArray));
+ }
+ return path.attr('fill', barColor).attr('fill-opacity', opacity).attr('stroke', 'none');
+ };
+
+ Bar.prototype.roundedRect = function(x, y, w, h, r) {
+ if (r == null) {
+ r = [0, 0, 0, 0];
+ }
+ return ["M", x, r[0] + y, "Q", x, y, x + r[0], y, "L", x + w - r[1], y, "Q", x + w, y, x + w, y + r[1], "L", x + w, y + h - r[2], "Q", x + w, y + h, x + w - r[2], y + h, "L", x + r[3], y + h, "Q", x, y + h, x, y + h - r[3], "Z"];
+ };
+
+ return Bar;
+
+ })(Morris.Grid);
+
+ Morris.Donut = (function(_super) {
+ __extends(Donut, _super);
+
+ Donut.prototype.defaults = {
+ colors: ['#0B62A4', '#3980B5', '#679DC6', '#95BBD7', '#B0CCE1', '#095791', '#095085', '#083E67', '#052C48', '#042135'],
+ backgroundColor: '#FFFFFF',
+ labelColor: '#000000',
+ formatter: Morris.commas,
+ resize: false
+ };
+
+ function Donut(options) {
+ this.resizeHandler = __bind(this.resizeHandler, this);
+ this.select = __bind(this.select, this);
+ this.click = __bind(this.click, this);
+ var _this = this;
+ if (!(this instanceof Morris.Donut)) {
+ return new Morris.Donut(options);
+ }
+ this.options = $.extend({}, this.defaults, options);
+ if (typeof options.element === 'string') {
+ this.el = $(document.getElementById(options.element));
+ } else {
+ this.el = $(options.element);
+ }
+ if (this.el === null || this.el.length === 0) {
+ throw new Error("Graph placeholder not found.");
+ }
+ if (options.data === void 0 || options.data.length === 0) {
+ return;
+ }
+ this.raphael = new Raphael(this.el[0]);
+ if (this.options.resize) {
+ $(window).bind('resize', function(evt) {
+ if (_this.timeoutId != null) {
+ window.clearTimeout(_this.timeoutId);
+ }
+ return _this.timeoutId = window.setTimeout(_this.resizeHandler, 100);
+ });
+ }
+ this.setData(options.data);
+ }
+
+ Donut.prototype.redraw = function() {
+ var C, cx, cy, i, idx, last, max_value, min, next, seg, total, value, w, _i, _j, _k, _len, _len1, _len2, _ref, _ref1, _ref2, _results;
+ this.raphael.clear();
+ cx = this.el.width() / 2;
+ cy = this.el.height() / 2;
+ w = (Math.min(cx, cy) - 10) / 3;
+ total = 0;
+ _ref = this.values;
+ for (_i = 0, _len = _ref.length; _i < _len; _i++) {
+ value = _ref[_i];
+ total += value;
+ }
+ min = 5 / (2 * w);
+ C = 1.9999 * Math.PI - min * this.data.length;
+ last = 0;
+ idx = 0;
+ this.segments = [];
+ _ref1 = this.values;
+ for (i = _j = 0, _len1 = _ref1.length; _j < _len1; i = ++_j) {
+ value = _ref1[i];
+ next = last + min + C * (value / total);
+ seg = new Morris.DonutSegment(cx, cy, w * 2, w, last, next, this.data[i].color || this.options.colors[idx % this.options.colors.length], this.options.backgroundColor, idx, this.raphael);
+ seg.render();
+ this.segments.push(seg);
+ seg.on('hover', this.select);
+ seg.on('click', this.click);
+ last = next;
+ idx += 1;
+ }
+ this.text1 = this.drawEmptyDonutLabel(cx, cy - 10, this.options.labelColor, 15, 800);
+ this.text2 = this.drawEmptyDonutLabel(cx, cy + 10, this.options.labelColor, 14);
+ max_value = Math.max.apply(Math, this.values);
+ idx = 0;
+ _ref2 = this.values;
+ _results = [];
+ for (_k = 0, _len2 = _ref2.length; _k < _len2; _k++) {
+ value = _ref2[_k];
+ if (value === max_value) {
+ this.select(idx);
+ break;
+ }
+ _results.push(idx += 1);
+ }
+ return _results;
+ };
+
+ Donut.prototype.setData = function(data) {
+ var row;
+ this.data = data;
+ this.values = (function() {
+ var _i, _len, _ref, _results;
+ _ref = this.data;
+ _results = [];
+ for (_i = 0, _len = _ref.length; _i < _len; _i++) {
+ row = _ref[_i];
+ _results.push(parseFloat(row.value));
+ }
+ return _results;
+ }).call(this);
+ return this.redraw();
+ };
+
+ Donut.prototype.click = function(idx) {
+ return this.fire('click', idx, this.data[idx]);
+ };
+
+ Donut.prototype.select = function(idx) {
+ var row, s, segment, _i, _len, _ref;
+ _ref = this.segments;
+ for (_i = 0, _len = _ref.length; _i < _len; _i++) {
+ s = _ref[_i];
+ s.deselect();
+ }
+ segment = this.segments[idx];
+ segment.select();
+ row = this.data[idx];
+ return this.setLabels(row.label, this.options.formatter(row.value, row));
+ };
+
+ Donut.prototype.setLabels = function(label1, label2) {
+ var inner, maxHeightBottom, maxHeightTop, maxWidth, text1bbox, text1scale, text2bbox, text2scale;
+ inner = (Math.min(this.el.width() / 2, this.el.height() / 2) - 10) * 2 / 3;
+ maxWidth = 1.8 * inner;
+ maxHeightTop = inner / 2;
+ maxHeightBottom = inner / 3;
+ this.text1.attr({
+ text: label1,
+ transform: ''
+ });
+ text1bbox = this.text1.getBBox();
+ text1scale = Math.min(maxWidth / text1bbox.width, maxHeightTop / text1bbox.height);
+ this.text1.attr({
+ transform: "S" + text1scale + "," + text1scale + "," + (text1bbox.x + text1bbox.width / 2) + "," + (text1bbox.y + text1bbox.height)
+ });
+ this.text2.attr({
+ text: label2,
+ transform: ''
+ });
+ text2bbox = this.text2.getBBox();
+ text2scale = Math.min(maxWidth / text2bbox.width, maxHeightBottom / text2bbox.height);
+ return this.text2.attr({
+ transform: "S" + text2scale + "," + text2scale + "," + (text2bbox.x + text2bbox.width / 2) + "," + text2bbox.y
+ });
+ };
+
+ Donut.prototype.drawEmptyDonutLabel = function(xPos, yPos, color, fontSize, fontWeight) {
+ var text;
+ text = this.raphael.text(xPos, yPos, '').attr('font-size', fontSize).attr('fill', color);
+ if (fontWeight != null) {
+ text.attr('font-weight', fontWeight);
+ }
+ return text;
+ };
+
+ Donut.prototype.resizeHandler = function() {
+ this.timeoutId = null;
+ this.raphael.setSize(this.el.width(), this.el.height());
+ return this.redraw();
+ };
+
+ return Donut;
+
+ })(Morris.EventEmitter);
+
+ Morris.DonutSegment = (function(_super) {
+ __extends(DonutSegment, _super);
+
+ function DonutSegment(cx, cy, inner, outer, p0, p1, color, backgroundColor, index, raphael) {
+ this.cx = cx;
+ this.cy = cy;
+ this.inner = inner;
+ this.outer = outer;
+ this.color = color;
+ this.backgroundColor = backgroundColor;
+ this.index = index;
+ this.raphael = raphael;
+ this.deselect = __bind(this.deselect, this);
+ this.select = __bind(this.select, this);
+ this.sin_p0 = Math.sin(p0);
+ this.cos_p0 = Math.cos(p0);
+ this.sin_p1 = Math.sin(p1);
+ this.cos_p1 = Math.cos(p1);
+ this.is_long = (p1 - p0) > Math.PI ? 1 : 0;
+ this.path = this.calcSegment(this.inner + 3, this.inner + this.outer - 5);
+ this.selectedPath = this.calcSegment(this.inner + 3, this.inner + this.outer);
+ this.hilight = this.calcArc(this.inner);
+ }
+
+ DonutSegment.prototype.calcArcPoints = function(r) {
+ return [this.cx + r * this.sin_p0, this.cy + r * this.cos_p0, this.cx + r * this.sin_p1, this.cy + r * this.cos_p1];
+ };
+
+ DonutSegment.prototype.calcSegment = function(r1, r2) {
+ var ix0, ix1, iy0, iy1, ox0, ox1, oy0, oy1, _ref, _ref1;
+ _ref = this.calcArcPoints(r1), ix0 = _ref[0], iy0 = _ref[1], ix1 = _ref[2], iy1 = _ref[3];
+ _ref1 = this.calcArcPoints(r2), ox0 = _ref1[0], oy0 = _ref1[1], ox1 = _ref1[2], oy1 = _ref1[3];
+ return ("M" + ix0 + "," + iy0) + ("A" + r1 + "," + r1 + ",0," + this.is_long + ",0," + ix1 + "," + iy1) + ("L" + ox1 + "," + oy1) + ("A" + r2 + "," + r2 + ",0," + this.is_long + ",1," + ox0 + "," + oy0) + "Z";
+ };
+
+ DonutSegment.prototype.calcArc = function(r) {
+ var ix0, ix1, iy0, iy1, _ref;
+ _ref = this.calcArcPoints(r), ix0 = _ref[0], iy0 = _ref[1], ix1 = _ref[2], iy1 = _ref[3];
+ return ("M" + ix0 + "," + iy0) + ("A" + r + "," + r + ",0," + this.is_long + ",0," + ix1 + "," + iy1);
+ };
+
+ DonutSegment.prototype.render = function() {
+ var _this = this;
+ this.arc = this.drawDonutArc(this.hilight, this.color);
+ return this.seg = this.drawDonutSegment(this.path, this.color, this.backgroundColor, function() {
+ return _this.fire('hover', _this.index);
+ }, function() {
+ return _this.fire('click', _this.index);
+ });
+ };
+
+ DonutSegment.prototype.drawDonutArc = function(path, color) {
+ return this.raphael.path(path).attr({
+ stroke: color,
+ 'stroke-width': 2,
+ opacity: 0
+ });
+ };
+
+ DonutSegment.prototype.drawDonutSegment = function(path, fillColor, strokeColor, hoverFunction, clickFunction) {
+ return this.raphael.path(path).attr({
+ fill: fillColor,
+ stroke: strokeColor,
+ 'stroke-width': 3
+ }).hover(hoverFunction).click(clickFunction);
+ };
+
+ DonutSegment.prototype.select = function() {
+ if (!this.selected) {
+ this.seg.animate({
+ path: this.selectedPath
+ }, 150, '<>');
+ this.arc.animate({
+ opacity: 1
+ }, 150, '<>');
+ return this.selected = true;
+ }
+ };
+
+ DonutSegment.prototype.deselect = function() {
+ if (this.selected) {
+ this.seg.animate({
+ path: this.path
+ }, 150, '<>');
+ this.arc.animate({
+ opacity: 0
+ }, 150, '<>');
+ return this.selected = false;
+ }
+ };
+
+ return DonutSegment;
+
+ })(Morris.EventEmitter);
+
+}).call(this);
diff --git a/debian/source/lintian-overrides b/debian/source/lintian-overrides
new file mode 100644
index 00000000..cc896d9f
--- /dev/null
+++ b/debian/source/lintian-overrides
@@ -0,0 +1,3 @@
+# Source exists in missing-sources as gauge.coffee. It is transpliced into
+# javascript before being minimized
+netdata source: source-is-missing web/lib/gauge.min.js
generated by cgit v1.2.3 (git 2.39.1) at 2024-11-12 15:36:40 +0000