implement instruction view , almost complete

lib/instruction_view.rb

@@ -1,38 +1,30 @@
-class InstructionView
+require "base/constant_view"
+require "base/list_view"
 
-  include React::Component
+class InstructionView < ListView
-  required_param :interpreter
-  required_param :instruction
 
-  define_state :active => ""
+  def initialize interpreter
-
+    @interpreter = interpreter
-  before_mount do
+    super([ConstantView.new( "span.bright" , "starting" )])
-    check_active interpreter.instruction
+    @interpreter.register_event(:instruction_changed,  self)
   end
 
-  def check_active i
+  def instruction_changed
-    active! instruction == i ? "bright" : ""
+    @element.at_css(".bright").remove_class("bright")
-
+    instruction = append( ConstantView.new( "span.bright" , instruction_text ) )
-  end
+    wrap_node_with instruction , div
-  def instruction_changed old , ins
+    remove_first if( @elements.length > 5)
-    check_active ins
   end
 
-  def render
+  def draw
-    div :class => active do
+    super()
-      instruction.to_s if instruction
+    wrap_node_with @elements.first , div
-    end
+    wrap_element div(".source_view") << div("h4" ,"Virtual Machine Instruction")
+    @element
+  end
+
+  def instruction_text
+    return "" unless @interpreter.instruction
+    @interpreter.instruction.to_s
   end
 end
-
-
-<div class="source-view">
-  <h4> Virtual Machine Instruction </h4>
-  {{page._sources.each do |source| }}
-    <div>
-      <span class="{{source._class_name}}">
-        {{source._name}}
-      </span>
-    </div>
-  {{end}}
-</div>

lib/main_view.rb

@@ -8,6 +8,7 @@ require_relative "classes_view"
 require_relative "status_view"
 require_relative "file_view"
 require_relative "blocks_view"
+require_relative "instruction_view"
 require_relative "registers_view"
 
 class MainView < ListView
@@ -31,6 +32,7 @@ class MainView < ListView
     super( [ClassesView.new(@interpreter)      ,
             FileView.new                     ,
             BlocksView.new(@interpreter)     ,
+            InstructionView.new(@interpreter)     ,
             StatusView.new(@interpreter)     ,
             RegistersView.new(@interpreter) ] )
   end