Result fix

Author: HadesD

src/css/style.css

@@ -48,6 +48,7 @@ body {
 
 .content-debug {
   padding: 0 5px;
+  overflow-x: auto;
 }
 .myButton {
 	-moz-box-shadow:inset 0px 1px 0px 0px #54a3f7;
@@ -90,3 +91,8 @@ body {
 	position:relative;
 	top:1px;
 }
+.myButton:disabled {
+  background: #eee;
+  box-shadow: none;
+  border: #ccc 1px solid;
+}

src/js/components/BottomBox.jsx

@@ -39,7 +39,7 @@ class BottomBox extends React.Component
       <div className="bottom-box">
         <ul className="tab-nav">
           <li><a name="tab-stdin" onClick={this.onClickTabNav}>STDIN</a></li>
-          <li><a name="tab-debug" onClick={this.onClickTabNav}>Debug</a></li>
+          <li><a name="tab-debug" onClick={this.onClickTabNav}>Result</a></li>
         </ul>
         <div className="tab-content">
           <div className="content-stdin" style={{display: 'block'}}>

src/js/components/ComplieButton.jsx renamed to src/js/components/CompileButton.jsx

@@ -3,7 +3,7 @@ import Editor from './Editor.jsx';
 import $ from 'jquery'
 
 
-class ComplieButton extends React.Component
+class CompileButton extends React.Component
 {
   constructor(props)
   {
@@ -24,10 +24,10 @@ class ComplieButton extends React.Component
         className="myButton"
         onClick={this.onClick}
       >
-        Complie
+        Compile
       </button>
     );
   }
 }
 
-export default ComplieButton;
+export default CompileButton;

src/js/main.jsx

@@ -2,11 +2,11 @@ import React from 'react';
 import ReactDOM from 'react-dom';
 import $ from 'jquery';
 
-import ComplieButton from './components/ComplieButton.jsx';
+import CompileButton from './components/CompileButton.jsx';
 import Editor from './components/Editor.jsx';
 import BottomBox from './components/BottomBox.jsx';
 
-const COMPLIER_SITE = 'https://paiza.io/api/projects.json';
+const COMPILER_SITE = 'https://paiza.io/api/projects.json';
 var data = {
   project: {
     language: 'cpp',
@@ -35,7 +35,7 @@ class App extends React.Component
     };
 
     this.onChangeEditor = this.onChangeEditor.bind(this);
-    this.onClickComplieButton = this.onClickComplieButton.bind(this);
+    this.onClickCompileButton = this.onClickCompileButton.bind(this);
     this.onChangeSTDIN = this.onChangeSTDIN.bind(this);
   }
 
@@ -48,24 +48,33 @@ class App extends React.Component
     });
   }
 
-  onClickComplieButton(e)
+  onClickCompileButton(e)
   {
     data.project.source_files.push({
       filename: 'Main.cpp',
       body: this.state.editor.value
     });
     data.project.input = this.state.bottomBox.stdin;
 
+    this.setState({
+      bottomBox: {
+        debug: 'Compiling'
+      }
+    });
+    $('.tab-content > *').hide();
+    $('.content-debug').show();
+    $('.myButton').attr('disabled', 'disabled');
+
     $.ajax({
-      url: COMPLIER_SITE,
+      url: COMPILER_SITE,
       headers: {
         'Content-Type': 'application/json',
       },
       method: 'POST',
       data: JSON.stringify(data),
       success: function(rs) {
         // console.log(this.state.editor.value);
-        if (rs.build_exit_code !== 0)
+        if (rs.build_exit_code !== 0 || rs.build_stderr !== "")
         {
           var build_errors = rs.build_stderr.split('\n');
           if (build_errors.length < 3)
@@ -92,20 +101,26 @@ class App extends React.Component
                 build_errors[i+1],
                 build_errors[i+2]
               ];
-              annotations.push({
+              /*annotations.push({
                 row: parseInt(err_split[1]),
                 column: parseInt(err_split[2]),
                 type: 'error',
                 text: text.join('\n'),
+              });*/
+              this.setState({
+                editor: {
+                  value: this.state.editor.value,
+                  annotations: [
+                    {
+                      row: parseInt(err_split[1]),
+                      column: parseInt(err_split[2]),
+                      type: 'error',
+                      text: text.join('\n'),
+                    }
+                  ]
+                }
               });
             }
-            /*this.setState({
-              editor: {
-                value: this.state.editor.value,
-                annotations: annotations
-              }
-            });*/
-            console.log(this.state.editor.annotations);
           }
           this.setState({
             bottomBox: {
@@ -117,14 +132,13 @@ class App extends React.Component
         {
           this.setState({
             bottomBox: {
-              debug: rs.stdout
+              debug: [/*rs.stderr, */rs.stdout].join('\n')
             }
           });
         }
       }.bind(this),
       complete: function(rs) {
-        $('.tab-content > *').hide();
-        $('.content-debug').show();
+        $('.myButton').removeAttr('disabled');
       }
     });
 
@@ -153,9 +167,9 @@ class App extends React.Component
           stdin={this.state.bottomBox.stdin}
           onChangeSTDIN={this.onChangeSTDIN}
         />
-        <ComplieButton
+        <CompileButton
           editorValue={this.state.editor.value}
-          onClick={this.onClickComplieButton}
+          onClick={this.onClickCompileButton}
         />
       </div>
     );