'use strict';

import * as React from 'react';

/**
 * Render app controls
 */
export class Controls extends React.Component {
    constructor(props) {
        super(props);

        this.state = {

        };
    }

    render() {
        return <aside>
            <header>
                <a href="/">
                    <img src="images/avatar.jpg" alt="Photo de Mattéo" />
                    <span>Mattéo Delabre ✏️</span><br />
                    Back to home
                </a>
            </header>

            <h1>The Chaos Game</h1>
            <h3>Creating fractals with the chaos game</h3>

            Sommets <input id="vertices" type="range" min="3" max="12" step="1" defaultValue="3" /><br />
            Fraction 1/<input id="fraction" type="range" min="1" max="6" step="0.01" defaultValue="2" />
        </aside>;
    }
}