Refactored all ``handleFoo` to `onFoo``

based on feedback from @jari

public/js/components/ErrorMessages.jsx

@@ -12,23 +12,22 @@ var ErrorMessages = React.createClass({
 
         return (
             <div className="container">
-            <div className="mod shadow mtm mrn">
-              <div className="inner bg-red-lt">
-                <div className="bd">
-                  <div className="media centerify">
-	             <div className="imgExt">
-                        <a
-                           onClick={this.props.onClearErrors}
-                           className="icon-kryss1 linkblock sharp">
-                        </a>
-                     </div>
-	             <div className="bd">
-                        <ul>{errorNodes}</ul>
-                     </div>
-                  </div>
+                <div className="mod shadow mtm mrn">
+                    <div className="inner bg-red-lt">
+                        <div className="bd">
+                            <div className="media centerify">
+                                <div className="imgExt">
+                                    <a  onClick={this.props.onClearErrors}
+                                        className="icon-kryss1 linkblock sharp">
+                                    </a>
+                                </div>
+                                <div className="bd">
+                                    <ul>{errorNodes}</ul>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
                 </div>
-              </div>
-            </div>
             </div>
         );
     }

public/js/components/TabView.jsx

@@ -21,7 +21,7 @@ var TabView = React.createClass({
         return {activeTab: activeTab};
     },
 
-    handleChangeTab: function(tabPane) {
+    onChangeTab: function(tabPane) {
         this.setState({activeTab: tabPane});
     },
 
@@ -30,7 +30,7 @@ var TabView = React.createClass({
             return (
                 <li  key={tabPane.name} className={tabPane.name===this.state.activeTab.name ? "active": ""}>
                     <a  href={"#" + tabPane.name}
-                        onClick={this.handleChangeTab.bind(this, tabPane)}>{tabPane.name}
+                        onClick={this.onChangeTab.bind(this, tabPane)}>{tabPane.name}
                     </a>
                 </li>
             );

public/js/components/form/TextInput.jsx

@@ -27,7 +27,7 @@ var TextInput = React.createClass({
 
     render: function() {
         return (
-            <div className="formelement">
+            <div className="formelement required">
                 <label htmlFor="strategy_name" className="t4">{this.props.label}</label>
                 <div className="input">
                     <input type="text"

public/js/components/strategy/StrategiesComponent.jsx

@@ -20,27 +20,27 @@ var StrategiesComponent = React.createClass({
     },
 
     initError: function() {
-        this.handleError("Could not load inital strategies from server");
+        this.onError("Could not load inital strategies from server");
     },
 
     clearErrors: function() {
         this.setState({errors: []});
     },
 
-    handleError: function(error) {
+    onError: function(error) {
         var errors = this.state.errors.concat([error]);
         this.setState({errors: errors});
     },
 
-    handleNewStrategy: function() {
+    onNewStrategy: function() {
         this.setState({createView: true});
     },
 
-    handleCancelNewStrategy: function() {
+    onCancelNewStrategy: function() {
         this.setState({createView: false});
     },
 
-    handleSave: function(strategy) {
+    onSave: function(strategy) {
         var strategies = this.state.strategies.concat([strategy]);
         this.setState({
             createView: false,
@@ -64,12 +64,12 @@ var StrategiesComponent = React.createClass({
     },
 
     renderCreateView: function() {
-        return (<StrategyForm handleCancelNewStrategy={this.handleCancelNewStrategy} handleSave={this.handleSave} />)
+        return (<StrategyForm onCancelNewStrategy={this.onCancelNewStrategy} onSave={this.onSave} />)
     },
 
     renderCreateButton: function() {
         return (
-            <button className="mal" onClick={this.handleNewStrategy}>Create strategy</button>
+            <button className="mal" onClick={this.onNewStrategy}>Create strategy</button>
         );
     }
 });

public/js/components/strategy/StrategyForm.jsx

@@ -32,17 +32,17 @@ var StrategyForm = React.createClass({
             }
         });
 
-        this.props.handleSave(strategy);
+        this.props.onSave(strategy);
     },
 
-    handleAddParam: function(event) {
+    onAddParam: function(event) {
         event.preventDefault();
         var id = this.state.parameters.length + 1;
         var params = this.state.parameters.concat([{id:id, name: "param_" + id, label: "Parameter " +id}]);
         this.setState({parameters: params});
     },
 
-    handleRemoveParam: function(event) {
+    onRemoveParam: function(event) {
         event.preventDefault();
         var id = this.state.parameters.length + 1;
         var params = this.state.parameters.slice(0, -1);
@@ -118,14 +118,14 @@ var StrategyForm = React.createClass({
 
     renderAddLink: function() {
         if(this.state.parameters.length < this.props.maxParams) {
-            return <a href="#add" onClick={this.handleAddParam}>+ Add required parameter</a>;
+            return <a href="#add" onClick={this.onAddParam}>+ Add required parameter</a>;
         }
     },
     renderRemoveLink: function() {
         if(this.state.parameters.length > 0) {
             return (
                 <div className="formelement mtn">
-                    <a href="#add" className="negative" onClick={this.handleRemoveParam}>- Remove parameter</a>
+                    <a href="#add" className="negative" onClick={this.onRemoveParam}>- Remove parameter</a>
                 </div>
                 );
         }