import React from 'react'
import Store from '../store/Store'
import reactMixin from 'react-mixin'
import {Navigation} from 'react-router'

export default class Form extends React.Component {

  handleClick(e) {
    e.preventDefault();
    let text = document.getElementById('text').value;
    this.transition(text);
  }

  transition(text) {
    Store.saveText(text);
    this.transitionTo('prompteur')
  }

  render(){
    return(
      <div className="form" >
        <input type="text" id="text" placeholder="text you wanna display" />
        <input type="number" id="number" placeholder="font size" />
        <button onClick={this.handleClick.bind(this)}>Click</button>
      </div>
    )
  }

}

reactMixin.onClass(Form, Navigation)

@@ -455,16 +455,57 @@
 form%22 %3E%0A
+        %3Cform action=%22return false;%22 %3E%0A  
         
@@ -579,74 +579,8 @@
 %3E%0A  
-      %3Cinput type=%22number%22 id=%22number%22 placeholder=%22font size%22 /%3E%0A
     
@@ -644,16 +644,32 @@
 button%3E%0A
+        %3C/form%3E%0A
       %3C/

delete input and add enter to submit