ruby-x/rubyx-debugger
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

showing active instruction with bg

Browse Source
This commit is contained in:
Torsten Ruger 2015-07-25 15:28:59 +03:00
parent 2f66bd9f08
commit b693f55a29
4 changed files with 31 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
app/block_view.rb
View File

@ -1,5 +1,6 @@
require "source_view" require "source_view"
require "instruction_view"
class BlockView class BlockView
@ -26,7 +27,7 @@ class BlockView
div.col_md_5 do div.col_md_5 do
h6 { "Block: #{block.name}"} h6 { "Block: #{block.name}"}
block.codes.each do |code| block.codes.each do |code|
code.to_s.br InstructionView :interpreter => interpreter , :instruction => code
end end
end end
div.col_md_2 do div.col_md_2 do

25
app/instruction_view.rb Normal file
View File

@ -0,0 +1,25 @@
class InstructionView
include React::Component
required_param :interpreter
required_param :instruction
define_state :active => ""
before_mount do
interpreter.register_event(:instruction_changed, self)
end
def instruction_changed old , ins
active! instruction == ins ? "active" : ""
end
def render
return unless instruction
div :class => active do
instruction.to_s
end
end
end

1
index.html.erb
View File

@ -2,6 +2,7 @@
<head> <head>
<title>Salama Debugger</title> <title>Salama Debugger</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="/static/main.css">
<script src="https://code.jquery.com/jquery-2.1.3.min.js"></script> <script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
<script src="/assets/react-with-addons.js"></script> <script src="/assets/react-with-addons.js"></script>
<%= javascript_include_tag 'main' %> <%= javascript_include_tag 'main' %>

3
static/main.css Normal file
View File

@ -0,0 +1,3 @@
.active {
background-color: orange ;
}