Skip to main content

INIT_JS

Constant INIT_JS 

Source
pub const INIT_JS: &str = "/*\n * Turns every <canvas data-chart=\"...\"> on the page into a Chart.js chart.\n *\n * This file exists because a Content-Security-Policy worth having forbids\n * inline script, so `new Chart(...)` cannot be written into the page beside\n * the data. The configuration travels in an escaped attribute instead and is\n * read back here.\n */\n(function () {\n  \"use strict\";\n\n  function ticks(scale) {\n    // `rustlavelTicks` is ours, not Chart.js\'s: a prefix and a suffix survive\n    // JSON, and the callback that applies them cannot.\n    var spec = scale && scale.rustlavelTicks;\n    if (!spec) return;\n    delete scale.rustlavelTicks;\n    var prefix = spec.prefix || \"\";\n    var suffix = spec.suffix || \"\";\n    scale.ticks = Object.assign({}, scale.ticks, {\n      callback: function (value) {\n        return prefix + value.toLocaleString() + suffix;\n      },\n    });\n  }\n\n  function draw(canvas) {\n    if (canvas.dataset.chartDrawn === \"true\") return;\n\n    var config;\n    try {\n      config = JSON.parse(canvas.dataset.chart);\n    } catch (error) {\n      // A chart that cannot be parsed must not take the page down, and must\n      // not fail silently either.\n      console.error(\"rustlavel-chart: could not read the chart configuration\", error, canvas);\n      return;\n    }\n\n    if (config.options && config.options.scales) {\n      Object.keys(config.options.scales).forEach(function (name) {\n        ticks(config.options.scales[name]);\n      });\n    }\n\n    if (typeof Chart === \"undefined\") {\n      console.error(\"rustlavel-chart: chart.umd.js has not loaded; is the Charts plugin registered?\");\n      return;\n    }\n\n    // Follow the page into dark mode. Chart.js draws its own labels and grid\n    // lines, and its defaults are for a white page.\n    var styles = getComputedStyle(document.documentElement);\n    var ink = styles.getPropertyValue(\"--chart-ink\").trim();\n    var grid = styles.getPropertyValue(\"--chart-grid\").trim();\n    if (ink) Chart.defaults.color = ink;\n    if (grid) Chart.defaults.borderColor = grid;\n\n    canvas.dataset.chartDrawn = \"true\";\n    new Chart(canvas, config);\n  }\n\n  function drawAll(root) {\n    (root || document).querySelectorAll(\"canvas[data-chart]\").forEach(draw);\n  }\n\n  if (document.readyState === \"loading\") {\n    document.addEventListener(\"DOMContentLoaded\", function () {\n      drawAll(document);\n    });\n  } else {\n    drawAll(document);\n  }\n\n  // A chart swapped in later \u{2014} a tab, a fragment fetched after load \u{2014} draws\n  // itself without the page having to call anything.\n  if (typeof MutationObserver !== \"undefined\") {\n    new MutationObserver(function (records) {\n      records.forEach(function (record) {\n        record.addedNodes.forEach(function (node) {\n          if (node.nodeType !== 1) return;\n          if (node.matches && node.matches(\"canvas[data-chart]\")) draw(node);\n          else drawAll(node);\n        });\n      });\n    }).observe(document.documentElement, { childList: true, subtree: true });\n  }\n\n  window.rustlavelCharts = { draw: draw, drawAll: drawAll };\n})();\n";
Expand description

The script that reads data-chart and draws it.