💡 Add default fractal settings

This commit is contained in:
Mattéo Delabre 2015-12-24 12:21:09 +01:00
parent 9fb99b63ff
commit eb689f452f
1 changed files with 24 additions and 12 deletions

View File

@ -7,12 +7,12 @@ import { applyChaos } from './chaos';
* Render a canvas element that draws a fractal out of a
* given iterated function system
*/
export class Fractal extends React.Component {
class Fractal extends React.Component {
constructor(props) {
super(props);
this.state = {
zoom: 200,
zoom: 30,
dragging: false,
center: null,
points: null
@ -158,10 +158,13 @@ export class Fractal extends React.Component {
this.ctx.putImageData(image, 0, 0);
}
// this is dirty. TODO: make it less coupled
/**
* Get the container size
*
* @return {Array} Width and height of the container
*/
getSize() {
const wrapping = document.querySelector('#content');
return [wrapping.clientWidth, wrapping.clientHeight];
return [this.container.clientWidth, this.container.clientHeight];
}
/**
@ -223,12 +226,21 @@ export class Fractal extends React.Component {
* Create a canvas with correct listeners
*/
render() {
return <canvas
return <div id="content" ref={div => this.container = div}>
<canvas
ref={canvas => this.ctx = canvas.getContext('2d')}
onWheel={this.wheel.bind(this)}
onMouseDown={this.mouseDown.bind(this)}
onMouseUp={this.mouseUp.bind(this)}
onMouseMove={this.mouseMove.bind(this)}
></canvas>;
></canvas>
</div>;
}
}
Fractal.defaultProps = {
iterations: 200000,
system: [[], []]
};
export { Fractal };