summaryrefslogtreecommitdiff
path: root/priv/static/metrics-graphics-3.0-alpha3/src
diff options
context:
space:
mode:
Diffstat (limited to 'priv/static/metrics-graphics-3.0-alpha3/src')
-rw-r--r--priv/static/metrics-graphics-3.0-alpha3/src/index.html238
-rw-r--r--priv/static/metrics-graphics-3.0-alpha3/src/scss/.gitignore0
2 files changed, 238 insertions, 0 deletions
diff --git a/priv/static/metrics-graphics-3.0-alpha3/src/index.html b/priv/static/metrics-graphics-3.0-alpha3/src/index.html
new file mode 100644
index 0000000..4f9ce02
--- /dev/null
+++ b/priv/static/metrics-graphics-3.0-alpha3/src/index.html
@@ -0,0 +1,238 @@
+<html lang='en'>
+<head>
+ <meta content='text/html; charset=utf-8' http-equiv='Content-Type'>
+ <link href='images/og-logo.png' rel='icon' type='image/png' />
+ <title>MetricsGraphics.js (DEV)</title>
+
+ <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,700' rel='stylesheet' type='text/css'>
+ <link href='https://fonts.googleapis.com/css?family=PT+Serif:400,700,400italic' rel='stylesheet' type='text/css'>
+ <link href='https://netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.css' rel='stylesheet' type='text/css'>
+ <link href='https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css' rel='stylesheet' type='text/css'>
+
+ <!-- loaded from dist -->
+ <link href='metricsgraphics.css' rel='stylesheet' type='text/css'>
+ <!-- loaded from examples/ -->
+ <link href='css/metricsgraphics-demo.css' rel='stylesheet' type='text/css'>
+
+ <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js'></script>
+ <script src="https://d3js.org/d3.v4.min.js"></script>
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.9/ace.js" charset="utf-8"></script>
+
+ <!-- dev start -->
+ <script src='js/MG.js'></script>
+ <script src='js/misc/utility.js'></script>
+ <script src='js/common/data_graphic.js'></script>
+ <script src='js/common/hooks.js'></script>
+ <script src='js/common/register.js'></script>
+ <script src='js/common/bootstrap_tooltip_popover.js'></script>
+ <script src='js/common/chart_title.js'></script>
+ <script src='js/common/scales.js'></script>
+ <script src='js/common/y_axis.js'></script>
+ <script src='js/common/x_axis.js'></script>
+ <script src='js/common/init.js'></script>
+ <script src='js/common/markers.js'></script>
+ <script src='js/common/rollover.js'></script>
+ <script src='js/common/zoom.js'></script>
+ <script src='js/common/brush.js'></script>
+ <script src='js/common/window_listeners.js'></script>
+ <script src='js/layout/bootstrap_dropdown.js'></script>
+ <script src='js/layout/button.js'></script>
+ <script src='js/charts/line.js'></script>
+ <script src='js/charts/histogram.js'></script>
+ <script src='js/charts/point.js'></script>
+ <script src='js/charts/bar.js'></script>
+ <script src='js/charts/table.js'></script>
+ <script src='js/charts/missing.js'></script>
+ <script src='js/misc/process.js'></script>
+ <script src='js/misc/smoothers.js'></script>
+ <script src='js/misc/formatters.js'></script>
+ <script src='js/misc/transitions.js'></script>
+ <script src='js/misc/error.js'></script>
+ <!-- dev end -->
+
+ <style>
+ body {
+ background-color: #fcfcfc;
+ }
+
+ .container {
+ width: 90%;
+ min-width: 960px;
+ }
+
+ .data textarea {
+ font-family: Menlo,Monaco,Consolas,"Courier New",monospace;
+ font-size: 11px;
+ height: 100%;
+ width: 100%;
+ }
+
+ .footer {
+ background-image: url(images/divider.png);
+ background-repeat: no-repeat;
+ background-position: center 115px;
+ padding-top: 70px;
+ margin-bottom: 20px;
+ }
+
+ .hightop {
+ margin-top: 40px;
+ }
+
+ #logo {
+ margin: 15px 0 10px 0;
+ }
+
+ .main-windows-titles {
+ color: #3b3b3b;
+ font-size: 16px;
+ padding-bottom: 5px;
+ text-align: center;
+ }
+
+ .main-windows-titles .js-title a {
+ position: absolute;
+ right: 0;
+ font-size: 70%;
+ margin: 7px 1px 0 0;
+ }
+
+ .main-windows .data,
+ .main-windows .js,
+ .main-windows .result {
+ height: 400px;
+ }
+
+ p {
+ padding-top: 6px;
+ }
+
+ textarea,
+ #editor {
+ border-radius: 3px;
+ border: none;
+ overflow: auto;
+ outline: none;
+ -webkit-box-shadow: none;
+ -moz-box-shadow: none;
+ box-shadow: none;
+ padding: 10px;
+ border: 1px solid #ccc;
+ }
+
+ .btn {
+ background-color: steelblue;
+ color: white;
+ margin-top: 34px;
+ outline: none;
+ position: absolute;
+ right: 7px;
+ z-index: 99;
+ }
+
+ .btn.reset {
+ right: 65px;
+ }
+
+ .btn:hover,
+ .btn:active,
+ .btn:visited {
+ color: #efefef;
+ outline: none;
+ }
+ </style>
+</head>
+
+<body>
+ <div class='container'>
+ <div class='head'>
+ <img src='images/logo.svg' id='logo' class='svg' />
+ </div>
+ </div>
+
+ <div class='container'>
+ <div class='row main-windows-titles'>
+ <div class='col-xs-2'>Data</div>
+ <div class='js-title col-xs-5'>
+ JavaScript <a href='https://github.com/mozilla/metrics-graphics/wiki/List-of-Options#list-of-options' target='_blank'>See Full List of Options</a>
+ <button type='button' class='update btn'>Run</button>
+ <button type='button' class='reset btn'>Reset</button>
+ </div>
+ </div>
+ <div class='row main-windows'>
+ <div class='data col-xs-2'>
+ <textarea></textarea>
+ </div>
+ <div class='js col-xs-5' id='editor'></div>
+ <div class='result text-center col-xs-5'></div>
+ </div>
+ </div>
+
+ <div class='container footer'>
+ Created by <a href='https://twitter.com/alialmossawi'>Ali Almossawi</a> and
+ <a href='https://github.com/hamilton'>Hamilton Ulmer</a>
+ <br />2014-2015 &middot; Shared under a <a href='http://www.mozilla.org/MPL/2.0/'>
+ Mozilla Public License</a>
+ </div>
+
+ <script>
+ var mgKey = 'mg-dev',
+ editor,
+ persisted,
+ defaultCall = '//modify away!\n'
+ + 'MG.data_graphic({\n'
+ + ' title: "UFO Sightings",\n'
+ + ' description: "Yearly UFO sightings from 1945 to 2010.",\n'
+ + ' data: JSON.parse(document.querySelector(\'.data textarea\').value),\n'
+ + ' markers: [{\'year\': 1964, \'label\': \'"The Creeping Terror" released\'}],\n'
+ + ' width: 400,\n'
+ + ' height: 250,\n'
+ + ' target: ".result",\n'
+ + ' x_accessor: "year",\n'
+ + ' y_accessor: "sightings",\n'
+ + '});';
+
+ persisted = JSON.parse(localStorage.getItem(mgKey), null, 2) || {};
+
+ editor = ace.edit("editor");
+ editor.getSession().setMode("ace/mode/javascript");
+ editor.setValue(persisted.script || defaultCall);
+ editor.gotoLine(persisted.line || 1);
+ editor.setHighlightActiveLine(false);
+
+ d3.select('.update').on('click', function() {
+ persisted.script = editor.getValue();
+ persisted.data = JSON.parse(document.querySelector('.data textarea').value);
+ saveState();
+ run();
+ });
+
+ d3.select('.reset').on('click', function() {
+ clearState();
+ document.location = document.location;
+ });
+
+ if (persisted.data) {
+ document.querySelector('.data textarea').value = JSON.stringify(persisted.data, null, 2);
+ run();
+ } else {
+ d3.json('data/ufo-sightings.json', function(data) {
+ document.querySelector('.data textarea').value = JSON.stringify(data, null, 2);
+ run();
+ })
+ }
+
+ function run() {
+ eval(editor.getValue());
+ }
+
+ function saveState(){
+ localStorage.setItem(mgKey, JSON.stringify(persisted));
+ }
+
+ function clearState() {
+ localStorage.clear(mgKey);
+ }
+ </script>
+</body>
+</html>
diff --git a/priv/static/metrics-graphics-3.0-alpha3/src/scss/.gitignore b/priv/static/metrics-graphics-3.0-alpha3/src/scss/.gitignore
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/priv/static/metrics-graphics-3.0-alpha3/src/scss/.gitignore