diff --git a/scripts/fractal.js b/scripts/fractal.js index fdc3afe..db09f71 100644 --- a/scripts/fractal.js +++ b/scripts/fractal.js @@ -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 ; + return