This is a Vuejs component to help decide how long you should run your experiment.
Currently the graph works with D3 and C3. You will have to add those libraries to your project in case you want the graph.
To build the files you will need Rollup.
Then you can run $ npm install.
When you want to build the component you will use $ rollup -c.
When you want to develop, rollup has a watch flag, use $ rollup -c -w.
You can change rollup.config.js if the current setup doesn't suit your needs.
We are creating a js and css output files. You need to add both to your project.
After running rollup, you will have a vuejs component you can add to your vuejs application.
Simple example would be:
let { powerCalculator, store } = require('powercalculator');
const storeInstance = new Vuex.Store(store)
new Vue(Object.assign({
store: storeInstance,
el: '.power-calculator',
}, powerCalculator));Please note that the module will actually have 2 different properties:
- component
- store
In the example above we are just using the component to create a vue instance. It could be used with Vue.component as well.
You can create the instance of vuex with the store, merge it with yours.
While we do have an action for testing to easily manipulate the store ('test:reset'), I'd recommend manipulating the store object before creating the vuex instance or creating your own actions.
I'd recommend using Vuex Plugins for this.
| action | description |
|---|---|
| init:calculator | Called when the component is mounted. starts calculations and deal with needed logic |
| field:change | Most important action. Dispatched whenever an input field change. This is the root of all the logic behind most of the mutations will happen. |
| update:proptocalculate | Triggers the calculation of the highlighted block |
There is no dev server. You can play with the github pages as they point to the dist folder.
You can open the index.html directly or use something such as python -m SimpleHTTPServer 8080 to use localhost:8080.
Due to the complexity of the tool we have a few different options of testing.
npm run test: Run all tests - test the mathematical functions, runs eslint and test the store updatesnpm run vue-check: runs eslint and test the store updates (we are unlikely to change the mathematical functions as often as the rest)npm run store: test the store updatesnpm run eslint: runs eslint
This is free software, licensed under:
The MIT (X11) License