Add charts.js plugin, basic chart component

This commit is contained in:
2018-07-14 16:36:23 +02:00
parent 6efc3ea790
commit 7a35f5177c
7 changed files with 207 additions and 28 deletions
@@ -0,0 +1,22 @@
import Component from '@ember/component';
export default Component.extend({
chartData: {
datasets: [{
data: [10, 20, 30]
}],
labels: [
'Red',
'Yellow',
'Blue'
]
},
chartOptions: {
legend: {
display: false
}
}
});
@@ -0,0 +1,5 @@
{{ember-chart type='doughnut'
data=chartData
options=chartOptions
width=200
height=200}}
+2 -2
View File
@@ -10,7 +10,7 @@ main {
display: grid;
grid-row-gap: 2rem;
grid-template-areas:
"people"
"stats"
"contributions";
}
}
@@ -22,7 +22,7 @@ main {
grid-row-gap: 2rem;
grid-template-columns: 2fr 4fr;
grid-template-areas:
"people contributions";
"stats contributions";
}
}
}
+23 -12
View File
@@ -1,18 +1,29 @@
<main id="index">
<section id="people">
<header>
<h2>Contributors</h2>
</header>
<div class="content">
{{contributor-list contributors=contributorsSorted}}
<div id="stats">
<section id="people">
<header>
<h2>Contributors</h2>
</header>
<div class="content">
{{contributor-list contributors=contributorsSorted}}
<p class="stats">
<span class="number">{{await kredits.totalSupply}}</span> kredits issued and distributed among
<span class="number">{{contributorsWithKredits.length}}</span> contributors.
</p>
</div>
</section>
<p class="stats">
<span class="number">{{await kredits.totalSupply}}</span> kredits issued and distributed among
<span class="number">{{contributorsWithKredits.length}}</span> contributors.
</p>
</div>
</section>
<section id="contributions-by-type">
<header>
<h2>Contributions by type</h2>
</header>
<div class="content">
{{chart-contributions-by-type contributions=proposalsClosed}}
</div>
</section>
</div>
<div id="contributions">
{{#if proposalsOpen}}
+128 -14
View File
@@ -3289,7 +3289,8 @@
},
"dependencies": {
"babel-code-frame": {
"version": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.22.0.tgz",
"version": "6.22.0",
"resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.22.0.tgz",
"integrity": "sha512-Dmx3yJCO/UHWgFTKUlBPHUm7h5hCjI5Lfc07gmSv7H4AbUwxS7NHyorp8HN1YEd4xSDCf7P4zqnS63I3aaJTwg==",
"dev": true,
"requires": {
@@ -3399,7 +3400,8 @@
}
},
"babel-messages": {
"version": "https://registry.npmjs.org/babel-messages/-/babel-messages-6.23.0.tgz",
"version": "6.23.0",
"resolved": "https://registry.npmjs.org/babel-messages/-/babel-messages-6.23.0.tgz",
"integrity": "sha512-Bl3ZiA+LjqaMtNYopA9TYE9HP1tQ+E5dLxE0XrAzcIJeK2UqF0/EaqXwBn9esd4UmTfEab+P+UYQ1GnioFIb/w==",
"dev": true,
"requires": {
@@ -3434,7 +3436,8 @@
}
},
"babel-runtime": {
"version": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.23.0.tgz",
"version": "6.23.0",
"resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.23.0.tgz",
"integrity": "sha512-9Vdluea/MpskdLsLYTH10Wtc5z2U0THGHVJeqec0EHUbfEt2q3zM1piQ+/GjMl9h0drUY1hF8zHV9nmH8Kl+Og==",
"dev": true,
"requires": {
@@ -3582,7 +3585,8 @@
"dev": true
},
"debug": {
"version": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz",
"version": "2.6.0",
"resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz",
"integrity": "sha512-XMYwiKKX0jdij1QRlpYn0O6gks0hW3iYUsx/h/RLPKouDGVeun2wlMYl29C85KBjnv1vw2vj+yti1ziHsXd7cg==",
"dev": true,
"requires": {
@@ -3623,7 +3627,8 @@
}
},
"invariant": {
"version": "https://registry.npmjs.org/invariant/-/invariant-2.2.2.tgz",
"version": "2.2.2",
"resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.2.tgz",
"integrity": "sha512-FUiAFCOgp7bBzHfa/fK+Uc/vqywvdN9Wg3CiTprLcE630mrhxjDS5MlBkHzeI6+bC/6bq9VX/hxBt05fPAT5WA==",
"dev": true,
"requires": {
@@ -3649,7 +3654,8 @@
"dev": true
},
"minimatch": {
"version": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.3.tgz",
"version": "3.0.3",
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.3.tgz",
"integrity": "sha512-NyXjqu1IwcqH6nv5vmMtaG3iw7kdV3g6MwlUBZkc3Vn5b5AMIWYKfptvzipoyFfhlfOgBQ9zoTxQMravF1QTnw==",
"dev": true,
"requires": {
@@ -3657,12 +3663,14 @@
}
},
"os-homedir": {
"version": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
"integrity": "sha512-B5JU3cabzk8c67mRRd3ECmROafjYMXbuzlwtqdM8IbS8ktlTix8aFGb2bAGKrSRIlnfKwovGUUr72JUPyOb6kQ==",
"dev": true
},
"os-tmpdir": {
"version": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
"integrity": "sha512-D2FR03Vir7FIu45XBY20mTb+/ZSWB00sjU9jdQXt83gDrI4Ztz5Fs7/yy74g2N5SVQY4xY1qDr4rNddwYRVX0g==",
"dev": true
},
@@ -3704,7 +3712,8 @@
}
},
"to-fast-properties": {
"version": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-1.0.2.tgz",
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-1.0.2.tgz",
"integrity": "sha512-pe0e0JdQLxVTcG0KZrafFA53KqR1J7ufHIg9sYtVY303jTkRF/w3PWwJX2dzdW5hlWFQueIb35Z5LUqR7nr3Vw==",
"dev": true
}
@@ -4638,7 +4647,7 @@
}
},
"mkdirp": {
"version": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
"version": "0.5.1",
"integrity": "sha512-SknJC52obPfGQPnjIkXbmA6+5H15E+fR+E4iR2oQ3zzCLbd7/ONua69R/Gw7AgkTLsRG+r5fzksYwWe1AgTyWA==",
"dev": true,
"requires": {
@@ -4723,6 +4732,22 @@
"md5-hex": "^2.0.0"
}
},
"broccoli-merge-trees": {
"version": "1.2.4",
"resolved": "https://registry.npmjs.org/broccoli-merge-trees/-/broccoli-merge-trees-1.2.4.tgz",
"integrity": "sha1-oAFRm7UGfwZYnZGvopQkRaLQ/bU=",
"dev": true,
"requires": {
"broccoli-plugin": "^1.3.0",
"can-symlink": "^1.0.0",
"fast-ordered-set": "^1.0.2",
"fs-tree-diff": "^0.5.4",
"heimdalljs": "^0.2.1",
"heimdalljs-logger": "^0.1.7",
"rimraf": "^2.4.3",
"symlink-or-copy": "^1.0.0"
}
},
"broccoli-middleware": {
"version": "1.2.1",
"resolved": "https://registry.npmjs.org/broccoli-middleware/-/broccoli-middleware-1.2.1.tgz",
@@ -5303,6 +5328,43 @@
"inherits": "^2.0.1"
}
},
"chart.js": {
"version": "2.7.2",
"resolved": "https://registry.npmjs.org/chart.js/-/chart.js-2.7.2.tgz",
"integrity": "sha512-90wl3V9xRZ8tnMvMlpcW+0Yg13BelsGS9P9t0ClaDxv/hdypHDr/YAGf+728m11P5ljwyB0ZHfPKCapZFqSqYA==",
"dev": true,
"requires": {
"chartjs-color": "^2.1.0",
"moment": "^2.10.2"
}
},
"chartjs-color": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/chartjs-color/-/chartjs-color-2.2.0.tgz",
"integrity": "sha1-hKL7dVeH7YXDndbdjHsdiEKbrq4=",
"dev": true,
"requires": {
"chartjs-color-string": "^0.5.0",
"color-convert": "^0.5.3"
},
"dependencies": {
"color-convert": {
"version": "0.5.3",
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-0.5.3.tgz",
"integrity": "sha1-vbbGnOZg+t/+CwAHzER+G59ygr0=",
"dev": true
}
}
},
"chartjs-color-string": {
"version": "0.5.0",
"resolved": "https://registry.npmjs.org/chartjs-color-string/-/chartjs-color-string-0.5.0.tgz",
"integrity": "sha512-amWNvCOXlOUYxZVDSa0YOab5K/lmEhbFNKI55PWc4mlv28BDzA7zaoQTGxSBgJMHIW+hGX8YUrvw/FH4LyhwSQ==",
"dev": true,
"requires": {
"color-name": "^1.0.0"
}
},
"chokidar": {
"version": "1.7.0",
"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-1.7.0.tgz",
@@ -5760,6 +5822,12 @@
"integrity": "sha1-vXJ6f67XfnH/OYWskzUakSczrQ8=",
"dev": true
},
"convert-source-map": {
"version": "1.5.1",
"resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.5.1.tgz",
"integrity": "sha1-uCeAl7m8IpNl3lxiz1/K7YtVmeU=",
"dev": true
},
"cookie": {
"version": "0.3.1",
"resolved": "https://registry.npmjs.org/cookie/-/cookie-0.3.1.tgz",
@@ -8594,6 +8662,18 @@
"sane": "^2.4.1"
}
},
"ember-cli-chart": {
"version": "3.4.0",
"resolved": "https://registry.npmjs.org/ember-cli-chart/-/ember-cli-chart-3.4.0.tgz",
"integrity": "sha512-FS/evjbwATriA70TpSXIEmoyCv1DJEdlc0utJ8vPELOsGL0KqVzd1MC0x5w54WOkaZ6ItP9IKIZQvCGAy9ierw==",
"dev": true,
"requires": {
"chart.js": "^2.7.0",
"ember-cli-babel": "^6.6.0",
"ember-cli-node-assets": "^0.2.2",
"fastboot-transform": "^0.1.2"
}
},
"ember-cli-dependency-checker": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/ember-cli-dependency-checker/-/ember-cli-dependency-checker-2.1.0.tgz",
@@ -8683,6 +8763,20 @@
"integrity": "sha1-IMtop5D+D94kiN39jvu332/nZvI=",
"dev": true
},
"ember-cli-node-assets": {
"version": "0.2.2",
"resolved": "https://registry.npmjs.org/ember-cli-node-assets/-/ember-cli-node-assets-0.2.2.tgz",
"integrity": "sha1-0tVWJufMZhn4gtf+VXUfkmYCJwg=",
"dev": true,
"requires": {
"broccoli-funnel": "^1.0.1",
"broccoli-merge-trees": "^1.1.1",
"broccoli-source": "^1.1.0",
"debug": "^2.2.0",
"lodash": "^4.5.1",
"resolve": "^1.1.7"
}
},
"ember-cli-normalize-entity-name": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/ember-cli-normalize-entity-name/-/ember-cli-normalize-entity-name-1.0.0.tgz",
@@ -10606,6 +10700,16 @@
}
}
},
"fastboot-transform": {
"version": "0.1.3",
"resolved": "https://registry.npmjs.org/fastboot-transform/-/fastboot-transform-0.1.3.tgz",
"integrity": "sha512-6otygPIJw1ARp1jJb+6KVO56iKBjhO+5x59RSC9qiZTbZRrv+HZAuP00KD3s+nWMvcFDemtdkugki9DNFTTwCQ==",
"dev": true,
"requires": {
"broccoli-stew": "^1.5.0",
"convert-source-map": "^1.5.1"
}
},
"faye-websocket": {
"version": "0.10.0",
"resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz",
@@ -14703,6 +14807,12 @@
}
}
},
"moment": {
"version": "2.22.2",
"resolved": "https://registry.npmjs.org/moment/-/moment-2.22.2.tgz",
"integrity": "sha1-PCV/mDn8DpP/UxSWMiOeuQeD/2Y=",
"dev": true
},
"morgan": {
"version": "1.9.0",
"resolved": "https://registry.npmjs.org/morgan/-/morgan-1.9.0.tgz",
@@ -19502,7 +19612,8 @@
"dev": true
},
"private": {
"version": "https://registry.npmjs.org/private/-/private-0.1.7.tgz",
"version": "0.1.7",
"resolved": "",
"integrity": "sha512-YmFOCNzqPkis1UxGH6pr8zN4DLoFNcJPvrD+ZLr7aThaOpaHufbWy+UhCa6PM0XszYIWkcJZUg40eKHR5+w+8w==",
"dev": true
},
@@ -20590,7 +20701,8 @@
}
},
"slash": {
"version": "https://registry.npmjs.org/slash/-/slash-1.0.0.tgz",
"version": "1.0.0",
"resolved": "",
"integrity": "sha512-3TYDR7xWt4dIqV2JauJr+EJeW356RXijHeUlO+8djJ+uBXPn8/2dpzBc8yQhh583sVvc9CvFAeQVgijsH+PNNg==",
"dev": true
},
@@ -20839,7 +20951,8 @@
}
},
"source-map": {
"version": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
"version": "0.5.6",
"resolved": "",
"integrity": "sha512-MjZkVp0NHr5+TPihLcadqnlVoGIoWo4IBHptutGh9wI3ttUYvCG26HkSuDi+K6lsZ25syXJXcctwgyVCt//xqA==",
"dev": true
},
@@ -21572,7 +21685,8 @@
"dev": true
},
"trim-right": {
"version": "https://registry.npmjs.org/trim-right/-/trim-right-1.0.1.tgz",
"version": "1.0.1",
"resolved": "",
"integrity": "sha512-WZGXGstmCWgeevgTL54hrCuw1dyMQIzWy7ZfqRJfSmJZBwklI15egmQytFP6bPidmw3M8d5yEowl1niq4vmqZw==",
"dev": true
},
+1
View File
@@ -30,6 +30,7 @@
"ember-cli": "~3.1.2",
"ember-cli-app-version": "^3.0.0",
"ember-cli-babel": "^6.6.0",
"ember-cli-chart": "^3.4.0",
"ember-cli-dependency-checker": "^2.0.0",
"ember-cli-eslint": "^4.2.1",
"ember-cli-htmlbars": "^2.0.1",
@@ -0,0 +1,26 @@
import { module, test } from 'qunit';
import { setupRenderingTest } from 'ember-qunit';
import { render } from '@ember/test-helpers';
import hbs from 'htmlbars-inline-precompile';
module('Integration | Component | chart-contributions-by-type', function(hooks) {
setupRenderingTest(hooks);
test('it renders', async function(assert) {
// Set any properties with this.set('myProperty', 'value');
// Handle any actions with this.set('myAction', function(val) { ... });
await render(hbs`{{chart-contributions-by-type}}`);
assert.equal(this.element.textContent.trim(), '');
// Template block usage:
await render(hbs`
{{#chart-contributions-by-type}}
template block text
{{/chart-contributions-by-type}}
`);
assert.equal(this.element.textContent.trim(), 'template block text');
});
});