| 1 | #include <string>
|
| 2 |
|
| 3 | namespace souffle {
|
| 4 | namespace profile {
|
| 5 | namespace html {
|
| 6 | std::string jsChartistPlugin = R"___(
|
| 7 | /**
|
| 8 | * Chartist.js plugin to display a data label on top of the points in a line chart.
|
| 9 | * The MIT License (MIT)
|
| 10 | *
|
| 11 | * Copyright (c) 2015 Markus Padourek
|
| 12 | *
|
| 13 | * Permission is hereby granted, free of charge, to any person obtaining a copy
|
| 14 | * of this software and associated documentation files (the "Software"), to deal
|
| 15 | * in the Software without restriction, including without limitation the rights
|
| 16 | * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
| 17 | * copies of the Software, and to permit persons to whom the Software is
|
| 18 | * furnished to do so, subject to the following conditions:
|
| 19 | * The above copyright notice and this permission notice shall be included in all
|
| 20 | * copies or substantial portions of the Software.
|
| 21 | *
|
| 22 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
| 23 | * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
| 24 | * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
| 25 | * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
| 26 | * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
| 27 | * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
| 28 | * SOFTWARE. **/
|
| 29 |
|
| 30 | /* global Chartist */
|
| 31 | (function (window, document, Chartist) {
|
| 32 | 'use strict';
|
| 33 |
|
| 34 | var defaultOptions = {
|
| 35 | currency: undefined,
|
| 36 | currencyFormatCallback: undefined,
|
| 37 | tooltipOffset: {
|
| 38 | x: 0,
|
| 39 | y: -20
|
| 40 | },
|
| 41 | anchorToPoint: false,
|
| 42 | appendToBody: false,
|
| 43 | class: undefined,
|
| 44 | pointClass: 'ct-point'
|
| 45 | };
|
| 46 |
|
| 47 | Chartist.plugins = Chartist.plugins || {};
|
| 48 | Chartist.plugins.tooltip = function (options) {
|
| 49 | options = Chartist.extend({}, defaultOptions, options);
|
| 50 |
|
| 51 | return function tooltip(chart) {
|
| 52 | var tooltipSelector = options.pointClass;
|
| 53 | if (chart instanceof Chartist.Bar) {
|
| 54 | tooltipSelector = 'ct-bar';
|
| 55 | } else if (chart instanceof Chartist.Pie) {
|
| 56 | // Added support for donut graph
|
| 57 | if (chart.options.donut) {
|
| 58 | tooltipSelector = 'ct-slice-donut';
|
| 59 | } else {
|
| 60 | tooltipSelector = 'ct-slice-pie';
|
| 61 | }
|
| 62 | }
|
| 63 |
|
| 64 | var $chart = chart.container;
|
| 65 | var $toolTip = $chart.querySelector('.chartist-tooltip');
|
| 66 | if (!$toolTip) {
|
| 67 | $toolTip = document.createElement('div');
|
| 68 | $toolTip.className = (!options.class) ? 'chartist-tooltip' : 'chartist-tooltip ' + options.class;
|
| 69 | if (!options.appendToBody) {
|
| 70 | $chart.appendChild($toolTip);
|
| 71 | } else {
|
| 72 | document.body.appendChild($toolTip);
|
| 73 | }
|
| 74 | }
|
| 75 | var height = $toolTip.offsetHeight;
|
| 76 | var width = $toolTip.offsetWidth;
|
| 77 |
|
| 78 | hide($toolTip);
|
| 79 |
|
| 80 | function on(event, selector, callback) {
|
| 81 | $chart.addEventListener(event, function (e) {
|
| 82 | if (!selector || hasClass(e.target, selector))
|
| 83 | callback(e);
|
| 84 | });
|
| 85 | }
|
| 86 |
|
| 87 | on('mouseover', tooltipSelector, function (event) {
|
| 88 | var $point = event.target;
|
| 89 | var tooltipText = '';
|
| 90 |
|
| 91 | var isPieChart = (chart instanceof Chartist.Pie) ? $point : $point.parentNode;
|
| 92 | var seriesName = (isPieChart) ? $point.parentNode.getAttribute('ct:meta') || $point.parentNode.getAttribute('ct:series-name') : '';
|
| 93 | var meta = $point.getAttribute('ct:meta') || seriesName || '';
|
| 94 | var hasMeta = !!meta;
|
| 95 | var value = $point.getAttribute('ct:value');
|
| 96 | if (options.transformTooltipTextFnc && typeof options.transformTooltipTextFnc === 'function') {
|
| 97 | value = options.transformTooltipTextFnc(value);
|
| 98 | }
|
| 99 |
|
| 100 | if (options.tooltipFnc && typeof options.tooltipFnc === 'function') {
|
| 101 | tooltipText = options.tooltipFnc(meta, value);
|
| 102 | } else {
|
| 103 | if (options.metaIsHTML) {
|
| 104 | var txt = document.createElement('textarea');
|
| 105 | txt.innerHTML = meta;
|
| 106 | meta = txt.value;
|
| 107 | }
|
| 108 |
|
| 109 | meta = '<span class="chartist-tooltip-meta">' + meta + '</span>';
|
| 110 |
|
| 111 | if (hasMeta) {
|
| 112 | tooltipText += meta + '<br>';
|
| 113 | } else {
|
| 114 | // For Pie Charts also take the labels into account
|
| 115 | // Could add support for more charts here as well!
|
| 116 | if (chart instanceof Chartist.Pie) {
|
| 117 | var label = next($point, 'ct-label');
|
| 118 | if (label) {
|
| 119 | tooltipText += text(label) + '<br>';
|
| 120 | }
|
| 121 | }
|
| 122 | }
|
| 123 |
|
| 124 | if (value) {
|
| 125 | if (value % 1 === 0) {
|
| 126 | value = '<span class="chartist-tooltip-value">' + minify_numbers(value) + '</span>';
|
| 127 | tooltipText += value;
|
| 128 | } else {
|
| 129 | value = '<span class="chartist-tooltip-value">' + humanise_time(parseFloat(value)) + '</span>';
|
| 130 | tooltipText += value;
|
| 131 | }
|
| 132 | }
|
| 133 | }
|
| 134 |
|
| 135 | if(tooltipText) {
|
| 136 | $toolTip.innerHTML = tooltipText;
|
| 137 | setPosition(event);
|
| 138 | show($toolTip);
|
| 139 |
|
| 140 | // Remember height and width to avoid wrong position in IE
|
| 141 | height = $toolTip.offsetHeight;
|
| 142 | width = $toolTip.offsetWidth;
|
| 143 | }
|
| 144 | });
|
| 145 |
|
| 146 | on('mouseout', tooltipSelector, function () {
|
| 147 | hide($toolTip);
|
| 148 | });
|
| 149 |
|
| 150 | on('mousemove', null, function (event) {
|
| 151 | if (false === options.anchorToPoint)
|
| 152 | setPosition(event);
|
| 153 | });
|
| 154 |
|
| 155 | function setPosition(event) {
|
| 156 | height = height || $toolTip.offsetHeight;
|
| 157 | width = width || $toolTip.offsetWidth;
|
| 158 | var offsetX = - width / 2 + options.tooltipOffset.x;
|
| 159 | var offsetY = - height + options.tooltipOffset.y;
|
| 160 | var anchorX, anchorY;
|
| 161 |
|
| 162 | if (!options.appendToBody) {
|
| 163 | var scrollTop = (window.pageYOffset !== undefined) ? window.pageYOffset : (document.documentElement || document.body.parentNode || document.body).scrollTop;
|
| 164 | var top = event.pageY - window.pageYOffset + scrollTop ;
|
| 165 | var left = event.pageX- window.pageXOffset;
|
| 166 |
|
| 167 | if (true === options.anchorToPoint && event.target.x2 && event.target.y2) {
|
| 168 | anchorX = parseInt(event.target.x2.baseVal.value);
|
| 169 | anchorY = parseInt(event.target.y2.baseVal.value);
|
| 170 | }
|
| 171 |
|
| 172 | $toolTip.style.top = (anchorY || top) + offsetY + 'px';
|
| 173 | $toolTip.style.left = (anchorX || left) + offsetX + 'px';
|
| 174 | } else {
|
| 175 | $toolTip.style.top = event.pageY + offsetY + 'px';
|
| 176 | $toolTip.style.left = event.pageX + offsetX + 'px';
|
| 177 | }
|
| 178 | }
|
| 179 | }
|
| 180 | };
|
| 181 |
|
| 182 | function show(element) {
|
| 183 | if(!hasClass(element, 'tooltip-show')) {
|
| 184 | element.className = element.className + ' tooltip-show';
|
| 185 | }
|
| 186 | }
|
| 187 |
|
| 188 | function hide(element) {
|
| 189 | var regex = new RegExp('tooltip-show' + '\\s*', 'gi');
|
| 190 | element.className = element.className.replace(regex, '').trim();
|
| 191 | }
|
| 192 |
|
| 193 | function hasClass(element, className) {
|
| 194 | return (' ' + element.getAttribute('class') + ' ').indexOf(' ' + className + ' ') > -1;
|
| 195 | }
|
| 196 |
|
| 197 | function next(element, className) {
|
| 198 | do {
|
| 199 | element = element.nextSibling;
|
| 200 | } while (element && !hasClass(element, className));
|
| 201 | return element;
|
| 202 | }
|
| 203 |
|
| 204 | function text(element) {
|
| 205 | return element.innerText || element.textContent;
|
| 206 | }
|
| 207 |
|
| 208 | } (window, document, Chartist));
|
| 209 |
|
| 210 | )___";
|
| 211 | }
|
| 212 | } // namespace profile
|
| 213 | } // namespace souffle
|