Fixed the editor

Gemfile

@@ -1,4 +1,5 @@
 # A sample Gemfile
 source "http://rubygems.org"
 
-gem "qtbindings"
+gem "qtbindings"
+gem 'htmlentities'

Gemfile.lock

@@ -1,10 +1,12 @@
 GEM
   remote: http://rubygems.org/
   specs:
+    htmlentities (4.2.3)
     qtbindings (4.6.3.2)
 
 PLATFORMS
   ruby
 
 DEPENDENCIES
+  htmlentities
   qtbindings

app/models/runner.rb

@@ -1,9 +1,14 @@
+require 'htmlentities'
+
 class Runner < Qt::Process
   def initialize(main)
     super
 
     @main_widget = main
+    @coder = HTMLEntities.new
+
     connect(SIGNAL(:readyReadStandardOutput), &method(:read_data))
+    connect(SIGNAL(:readyReadStandardError),  &method(:read_error))
   end
 
   def run(code = default_code, code_file_name = default_kid_code_location)
@@ -15,6 +20,10 @@ def read_data
     @main_widget.append(self.readAllStandardOutput())
   end
 
+  def read_error
+    @main_widget.append(self.readAllStandardError())
+  end
+
   def save_kid_code(code, code_file_name)
     ensure_tmp_dir
 

app/widgets/main.rb

@@ -2,37 +2,45 @@
 # this is the main view widget
 class Runner < Qt::Process
   def read_data
-    out = self.readAllStandardOutput
-    string = []
-    (out.length-1).times do |i|
-      string[i] = out[i].chr
+    out = self.readAllStandardOutput.data
+    out.split("\n").each do |line|
+      code = "updateStdOut('#{@coder.encode(line)}<br/>')"
+      @main_widget.evaluateJavaScript(code)
+    end
+  end
+
+  def read_error
+    err = self.readAllStandardError.data
+    err.split("\n").each do |line|
+      code = "updateStdErr('#{@coder.encode(line)}<br/>')"
+      @main_widget.evaluateJavaScript(code)
     end
-    string = string.join("")
-    @main_widget.evaluateJavaScript('updateOutputView("' + string + '");')
   end
 end
 
 class MainWidget < Qt::WebView
-  slots 'evaluateRuby(QString)'
+  slots 'evaluateRuby(QString)', 'setupQtBridge()'
 
   def initialize(parent = nil)
     super(parent)
 
     self.window_title = "KidsRuby v" + KidsRuby::VERSION    
 
     @frame = self.page.mainFrame
-    @frame.addToJavaScriptWindowObject("QTApi", self);
 
-    Qt::Object.connect(@frame, SIGNAL("javaScriptWindowObjectCleared()"), self, SLOT('evaluateRuby()') )
+    Qt::Object.connect(@frame,  SIGNAL("javaScriptWindowObjectCleared()"), self, SLOT('setupQtBridge()') )
 
     self.load Qt::Url.new("#{File.dirname(__FILE__)}/../../public/index.html")
     show
   end
 
   private
 
+  def setupQtBridge
+    @frame.addToJavaScriptWindowObject("QTApi", self);
+  end
+
   def evaluateRuby(code)
-    puts code
     runner = Runner.new(@frame)
     runner.run(code)
   end

public/css/master.css

@@ -15,6 +15,12 @@ body {
 }
 
 #output {
-	background: #eee;
 	margin: 10px;
+}
+#stdout {
+	background: #eee;
+}
+
+#stderr {
+	color: red;
 }

public/index.html

@@ -16,14 +16,19 @@
 
   <div id="input">
 <textarea id="rubycode" rows="8" cols="40">
+#!/usr/bin/ruby
 # Go ahead, type some ruby in here
 puts "Hello"
 </textarea>
   <button id="run">Run</button>
   </div>
 
   <div id="output">
-    Output
+    <div id="stdout">
+    </div>
+
+    <div id="stderr">
+    </div>
   </div>
 </body>
 </html>

public/js/app.js

@@ -1,24 +1,41 @@
-function updateOutputView(newHtml) {
-	$("#output").html(newHtml);
+function updateStdOut(newHtml) {
+	$("#stdout").append(newHtml);
 };
 
+function updateStdErr(newHtml) {
+	$("#stderr").append(newHtml);
+}
+
+function clearOutputs() {
+	$.each(["stdout", "stderr"], function(i, item) {
+		$("#" + item).html("");
+	});
+}
+
+function submitRubyCode(editor) {
+	var ruby = editor.getCode();
+	QTApi['evaluateRuby(QString)'](ruby);
+}
+
 $(document).ready(function() {		
 	var editor = CodeMirror.fromTextArea('rubycode', {
-      parserfile: ["../../js/tokenizeruby.js", "../../js/parseruby.js"],
-      stylesheet: "css/rubycolors.css",
-      path: "codemirror/js/",
-      lineNumbers: true,
-      textWrapping: false,
-      indentUnit: 2,
-      parserConfig: {},
-      width: '500px',
-      height: '30%',
-	    autoMatchParens: true
-  });
-
+	      parserfile: ["../../js/tokenizeruby.js", "../../js/parseruby.js"],
+	      stylesheet: "css/rubycolors.css",
+	      path: "codemirror/js/",
+	      lineNumbers: true,
+	      textWrapping: false,
+	      indentUnit: 2,
+				indentUnit: 4,
+				content: $('#rubycode').val(),
+	      parserConfig: {},
+	      width: '500px',
+	      height: '30%',
+				iframeClass: 'editor-window',
+	    	autoMatchParens: true
+	  });
+
 	$("#input button").click(function(e) {
-		var ruby = $('#rubycode').val();
-		alert(ruby);
-		QTApi.evaluateRuby(ruby);
+		clearOutputs();
+		submitRubyCode(editor);
 	});
 });