smalruby-editor 0.0.12 → 0.1.0

data/app/helpers/application_helper.rb

@@ -1,2 +1,3 @@
+# -*- coding: utf-8 -*-
 module ApplicationHelper
 end

data/app/helpers/editor_helper.rb

@@ -1,2 +1,48 @@
+# -*- coding: utf-8 -*-
 module EditorHelper
+  # ツールボックスのブロックに対して、キャラクターの入力フィールドの値を設定する
+  #
+  # @param [String] name 名前
+  # @return [String] XML
+  def toolbox_character_field(name = 'VAR')
+    %(<field name="#{h name}">char1</field>).html_safe
+  end
+
+  # ツールボックスのブロックに対して、キーの入力フィールドの値を設定する
+  #
+  # @param [String] name 名前
+  # @param [String] value キーの名前。K_SPACE、K_Aなど
+  # @return [String] XML
+  def toolbox_key_field(name = 'KEY', value = 'K_SPACE')
+    %(<field name="#{h name}">#{h value}</field>).html_safe
+  end
+  # ツールボックスのブロックに対して、数値型の入力のブロックを設定する
+  #
+  # @param [String] name 入力値の名前
+  # @param [Numeric] value 数値
+  # @return [String] XML
+  def toolbox_number_value(name, value = 0)
+    <<-XML.strip_heredoc.html_safe
+      <value name="#{h name}">
+        <block type="math_number">
+          <field name="NUM">#{h value.to_i}</field>
+        </block>
+      </value>
+    XML
+  end
+
+  # ツールボックスのブロックに対して、テキスト型の入力のブロックを設定する
+  #
+  # @param [String] name 入力値の名前
+  # @param [String] value 文字列
+  # @return [String] XML
+  def toolbox_text_value(name = 'TEXT', value = '')
+    <<-XML.strip_heredoc.html_safe
+      <value name="#{h name}">
+        <block type="text">
+          <field name="TEXT">#{h value}</field>
+        </block>
+      </value>
+    XML
+  end
 end

data/app/models/source_code.rb

@@ -3,6 +3,7 @@
 require 'tempfile'
 require 'open3'
 require 'digest/sha2'
+require 'bundler'
 
 # ソースコードを表現するモデル
 class SourceCode < ActiveRecord::Base
@@ -24,6 +25,14 @@ class SourceCode < ActiveRecord::Base
     }
   end
 
+  # プログラムを実行する
+  def run(path)
+    _, stderr_str, status = *open3_capture3_run_program(path)
+    return [] if status.success?
+
+    parse_ruby_error_messages(stderr_str)
+  end
+
   # ハッシュ値を計算する
   def digest
     Digest::SHA256.hexdigest(data)
@@ -31,19 +40,53 @@ class SourceCode < ActiveRecord::Base
 
   private
 
+  def validate_filename
+    if File.basename(filename) != filename
+      errors.add(:filename, 'includes directory separator(s)')
+    end
+  end
+
+  def ruby_cmd
+    path = Pathname('rsdl').expand_path(RbConfig::CONFIG['bindir'])
+    if path.exist?
+      path
+    else
+      Pathname(RbConfig::CONFIG['RUBY_INSTALL_NAME'])
+        .expand_path(RbConfig::CONFIG['bindir'])
+    end
+  end
+
   def open3_capture3_ruby_c
     tempfile = Tempfile.new('smalruby-editor')
     tempfile.write(data)
     path = tempfile.path
     tempfile.close
-    ruby_cmd = File.join(RbConfig::CONFIG['bindir'],
-                         RbConfig::CONFIG['RUBY_INSTALL_NAME'])
-    Open3.capture3("#{ruby_cmd} -c #{path}")
+
+    Bundler.with_clean_env do
+      Open3.capture3("#{ruby_cmd} -c #{path}")
+    end
   end
 
-  def validate_filename
-    if File.basename(filename) != filename
-      errors.add(:filename, 'includes directory separator(s)')
+  def open3_capture3_run_program(path)
+    Bundler.with_clean_env do
+      Open3.capture3("#{ruby_cmd} #{path}")
     end
   end
+
+  # rubocop:disable MethodLength
+  def parse_ruby_error_messages(stderr_str)
+    stderr_str.lines.each.with_object([]) { |line, res|
+      if (md = /^\tfrom .*:(\d+):(in .*)$/.match(line))
+        res << { row: md[1].to_i, column: 0, message: md[2] }
+      elsif (md = /^.*:(\d+):(in .*)$/.match(line))
+        res << { row: md[1].to_i, column: 0, message: md[2] }
+      elsif (md = /( +)\^$/.match(line))
+        res[-1][:column] = md[1].length
+      else
+        row = res[-1] ? res[-1][:row] : 0
+        res << { row: row, column: 0, message: line.chomp }
+      end
+    }
+  end
+  # rubocop:enable MethodLength
 end

data/app/views/editor/_block_tab.html.haml

@@ -0,0 +1,53 @@
+#block-tab-right-pane{:class => 'right-pane'}
+  #blockly-div
+
+  = render 'toolbox'
+
+#block-tab-left-pane{:class => 'left-pane'}
+  #selectors-container
+    %ul.nav{:class => 'nav-pills'}
+      %li.active
+        %a{:href => '#character-selector-tab', :'data-toggle' => 'tab'}<
+          キャラクター
+      -#%li
+        -#%a{:href => '#scene-selector-tab', :'data-toggle' => 'tab'}<
+          -#ステージ
+
+    #selectors-tab-content{:class => 'tab-content'}
+      #character-selector-tab{:class => 'tab-pane active selector-tab'}
+        #character-selector-character-set
+        .item
+          %a#add-character-button{:class => 'character'}
+            %i.icon-plus-sign-alt
+            %br
+            新しいキャラクター
+
+      #scene-selector-tab{:class => 'tab-pane selector-tab'}
+        .item
+          %a{:href => '#', :onclick => 'window.event.preventDefault();'}
+            %div
+        .item
+          %a{:href => '#', :onclick => 'window.event.preventDefault();'}
+            %div
+
+= render 'character_modal'
+
+%script#character-selector-template{:type => 'text/template'}
+  .item
+    .item-info
+      .name
+        {{- get('name') }}
+      .attributes
+        X: {{- get('x') }} Y: {{- get('y') }}
+        %br
+        向き: {{- get('angle') }}°
+
+      %a.add-block-button
+        %i.icon-folder-close-alt
+        %i.icon-double-angle-right
+
+      %a.remove-button
+        %i.icon-remove
+
+    %a.character
+      %img{:src => '{{- costumeUrl() }}'}

data/app/views/editor/_character_modal.html.haml

@@ -0,0 +1,53 @@
+#character-modal{:class => 'modal hide fade', :tabindex => '-1',
+                 :role => 'dialog', :'aria-hidden' => 'true'}
+  .modal-body
+    #character-modal-right-pane{:class => 'right-pane'}
+      #character-modal-costume-selector
+        .row-fluid
+          %ul.thumbnails
+            - %w(car1 car2 car3 car4 cat1 cat2 cat3 frog1 ball1 ball2 ball3 ball4 ball5 ball6).each do |name|
+              %li
+                %a.thumbnail
+                  %img{:src => "/smalruby/assets/#{name}.png", :alt => "#{name}.png"}
+
+    #character-modal-left-pane{:class => 'left-pane'}
+      #character-modal-preview
+        #character-modal-character
+          %img{:src => "/smalruby/assets/car1.png"}
+
+      #character-modal-attributes
+        %form#character-modal-form{:class => 'form-horizontal'}
+          .control-group
+            %label.control-label{:for => 'character_name'}<
+              名前
+            .controls
+              %input#character_name{:name => 'character[name]', :type => 'text', :placeholder => 'car1やball1など', :class => 'input-medium'}
+          .control-group
+            %label.control-label{:for => 'character_x'}<
+              X座標
+            .controls
+              %input#character_x{:name => 'character[x]', :type => 'range', :min => '0', :max => '639', :class => 'input-medium'}
+              %span#character_x_value{:class => 'character_value'}
+                300
+          .control-group
+            %label.control-label{:for => 'character_y'}<
+              Y座標
+            .controls
+              %input#character_y{:name => 'character[y]', :type => 'range', :min => '0', :max => '439', :class => 'input-medium'}
+              %span#character_y_value{:class => 'character_value'}
+                200
+          .control-group
+            %label.control-label{:for => 'character_angle'}<
+              向き
+            .controls
+              %input#character_angle{:name => 'character[angle]', :type => 'range', :min => '0', :max => '359', :class => 'input-medium'}
+              %span#character_angle_value{:class => 'character_value'}
+                100°
+
+  .modal-footer
+    %button.btn{:'data-dismiss' => 'modal', :'aria-hidden' => 'true'}<
+      %i.icon-remove
+      やめる
+    %button#character-modal-ok-button{:class => 'btn btn-primary'}<
+      %i.icon-circle-blank
+      決めた！

data/app/views/editor/_toolbox.html.haml

@@ -0,0 +1,384 @@
+%xml{:id => 'toolbox', :style => 'display: none'}
+  - category = 'motion'
+  %category{:name => '動き'}
+    -# (　)歩動かす
+    %block{:type => "#{category}_move"}
+      = toolbox_number_value('STEP', 10)
+
+    -# 時計回りに(　)度回す
+    %block{:type => "#{category}_rotate_right"}
+      = toolbox_number_value('ANGLE', 15)
+
+    -# 半時計回りに(　)度回す
+    %block{:type => "#{category}_rotate_left"}
+      = toolbox_number_value('ANGLE', 15)
+
+    -# (　)度に向ける
+    %block{:type => "#{category}_set_angle"}
+      = toolbox_number_value('ANGLE', 90)
+
+    -# マウスポインターへ向ける
+    %block{:type => "#{category}_point_towards_mouse"}
+
+    -# [▼]へ向ける
+    %block{:type => "#{category}_point_towards_character"}
+      = toolbox_character_field
+
+    -# x座標を(　)、y座標を(　)にする
+    %block{:type => "#{category}_set_x_y"}
+      = toolbox_number_value('X')
+      = toolbox_number_value('Y')
+
+    -# マウスポインターへ行く
+    -#%block{:type => "#{category}_go_to_mouse"}
+
+    -# [▼]へ行く
+    -#%block{:type => "#{category}_go_to_character"}
+
+    -# (　)秒でx座標を(　)、y座標を(　)に変える
+    -#%block{:type => "#{category}_glide_to_x_y"}
+    -#  = toolbox_number_value('SEC', 1)
+    -#  = toolbox_number_value('X')
+    -#  = toolbox_number_value('Y')
+
+    -# x座標を(　)ずつ変える
+    %block{:type => "#{category}_change_x_by"}
+      = toolbox_number_value('X', 10)
+
+    -# x座標を(　)にする
+    %block{:type => "#{category}_set_x"}
+      = toolbox_number_value('X', 0)
+
+    -# y座標を(　)ずつ変える
+    %block{:type => "#{category}_change_y_by"}
+      = toolbox_number_value('Y', 10)
+
+    -# y座標を(　)にする
+    %block{:type => "#{category}_set_y"}
+      = toolbox_number_value('Y', 0)
+
+    -# もし端に着いたら、跳ね返る
+    %block{:type => "#{category}_turn_if_reach_wall"}
+
+    -# 条件:端に着いた
+    %block{:type => "#{category}_reach_wall"}
+
+    -# 跳ね返る
+    %block{:type => "#{category}_turn"}
+
+    -# 回転方法を[▼]にする
+    -#%block{:type => "#{category}_set_rotation_style"}
+
+    -# 変数:x座標
+    %block{:type => "#{category}_self_x"}
+
+    -# 変数:y座標
+    %block{:type => "#{category}_self_y"}
+
+    -# 変数:向き
+    %block{:type => "#{category}_self_angle"}
+
+  - category = 'looks'
+  %category{:name => '見た目'}
+    -# [　]と(　)秒言う
+    -#%block{:type => "#{category}_say_second"}
+    -#  = toolbox_text_value('TEXT', 'こんにちは！')
+    -#  = toolbox_number_value('SEC', 2)
+
+    -# [　]と言う
+    %block{:type => "#{category}_say"}
+      = toolbox_text_value('TEXT', 'こんにちは！')
+
+    -# [　]と(　)秒考える
+    -#%block{:type => "#{category}_think_second"}
+    -#  = toolbox_text_value('TEXT', 'ふーん')
+    -#  = toolbox_number_value('SEC', 2)
+
+    -# [　]と考える
+    -#%block{:type => "#{category}_think"}
+    -#  = toolbox_text_value('TEXT', 'ふーん')
+
+    -# 表示する
+    %block{:type => "#{category}_show"}
+
+    -# 隠す
+    %block{:type => "#{category}_hide"}
+
+    -# 消滅する
+    %block{:type => "#{category}_vanish"}
+
+    -# 大きさを(　)％ずつ変える
+    -#%block{:type => "#{category}_change_scale_by"}
+    -#  = toolbox_number_value('SCALE', 10)
+
+    -# 大きさを(　)％にする
+    -#%block{:type => "#{category}_set_scale"}
+    -#  = toolbox_number_value('SCALE', 100)
+
+    -# 変数:大きさ
+    -#%block{:type => "#{category}_self_scale"}
+
+    -# [▼プリセット画像]
+    -#%block{:type => "#{category}_preset_images"}
+
+  - category = 'sound'
+  %category{:name => '音'}
+    -# [▼プリセット音声]の音を鳴らす
+    %block{:type => "#{category}_play"}
+      %value{:name => 'NAME'}
+        %block{:type => "#{category}_preset_sounds"}
+
+    -# すべての音を止める
+    -#%block{:type => "#{category}_stop"}
+
+    -# 変数:ボリューム
+    -#%block{:type => "#{category}_volume"}
+
+  - category = 'events'
+  %category{:name => '～のとき'}
+    -# まずは
+    %block{:type => "#{category}_on_start"}
+
+    -# キーボードの[▼キー]が[▼押された/押され続けている]とき
+    %block{:type => "#{category}_on_key_push_or_down"}
+      = toolbox_key_field
+
+    -# キャラクターがクリックされたとき
+    %block{:type => "#{category}_on_click"}
+
+    -# [▼キャラクター]にぶつかったとき
+    %block{:type => "#{category}_on_hit"}
+
+  - category = 'control'
+  %category{:name => '繰り返し'}
+    -# ずっと
+    %block{:type => "#{category}_loop"}
+
+    -# (　)回繰り返す
+    %block{:type => "#{category}_times"}
+      = toolbox_number_value('COUNT', 10)
+
+    -# <　>まで繰り返す
+    %block{:type => "#{category}_until"}
+
+    -# 繰り返しから脱出する
+    %block{:type => "#{category}_break"}
+
+    -# 次の繰り返しにジャンプする
+    %block{:type => "#{category}_next"}
+
+    -# 現在の繰り返しをやり直す
+    %block{:type => "#{category}_redo"}
+
+  %category{:name => '待つ'}
+    -# (　)秒待つ
+    %block{:type => "#{category}_sleep"}
+      = toolbox_number_value('SEC', 1)
+
+    -# <　>まで待つ
+    %block{:type => "#{category}_await_until"}
+
+    -# 1フレーム待つ
+    %block{:type => "#{category}_await"}
+
+  %category{:name => 'もし～なら'}
+    -# もし<　>なら
+    %block{:type => "#{category}_if"}
+
+    -# もし<　>なら～でなければ
+    %block{:type => "#{category}_if_else"}
+
+  - category = 'sensing'
+  %category{:name => '調べる'}
+    -# 条件:キーボードの[▼キー]が[▼押された]
+    %block{:type => "#{category}_input_key_push_or_down"}
+      = toolbox_key_field
+
+    -# 条件:マウスの[▼左ボタン]が[▼押された]
+    %block{:type => "#{category}_input_mouse_push_or_down"}
+
+    -# 変数:マウスのx座標
+    %block{:type => "#{category}_input_mouse_pos_x"}
+
+    -# 変数:マウスのy座標
+    %block{:type => "#{category}_input_mouse_pos_y"}
+
+    -# 条件:[▼キャラクター]に触れた
+    %block{:type => "#{category}_hit"}
+
+    -# [　]と聞いて待つ
+    -#%block{:type => "#{category}_ask"}
+    -#  = toolbox_text_value('TEXT', 'あなたのお名前は？')
+
+    -# 変数:答え
+    -#%block{:type => "#{category}_answer"}
+
+    -# 変数:タイマー
+    -#%block{:type => "#{category}_timer_count"}
+
+    -# タイマーをリセット
+    -#%block{:type => "#{category}_timer_reset"}
+
+    -# 変数:[▼キャラクター]の[▼プロパティ]
+    %block{:type => "#{category}_character_property"}
+
+    -# 変数:現在の[▼時]
+    %block{:type => "#{category}_time_now"}
+
+    -# 変数:2000年からの日数
+    -#%block{:type => "#{category}_days_since_2000"}
+
+  - category = 'operators'
+  %category{:name => '計算'}
+    -# 変数:(　) + (　)
+    %block{:type => "#{category}_add"}
+
+    -# 変数:(　) - (　)
+    %block{:type => "#{category}_minus"}
+
+    -# 変数:(　) * (　)
+    %block{:type => "#{category}_multiply"}
+
+    -# 変数:(　) / (　)
+    %block{:type => "#{category}_divide"}
+
+    -# 変数:(　)から(　)までの乱数
+    %block{:type => "#{category}_rand"}
+      = toolbox_number_value('A', 1)
+      = toolbox_number_value('B', 10)
+
+    -# 変数:(　)の[　]番目
+    %block{:type => "#{category}_index_of"}
+      = toolbox_text_value('A', 'あいうえお')
+      = toolbox_number_value('INDEX', 1)
+
+    -# 変数:[　]の長さ
+    %block{:type => "#{category}_length"}
+      = toolbox_text_value('A', 'あいうえお')
+
+    -# 変数:(　)を(　)で割った余り
+    %block{:type => "#{category}_modulo"}
+      = toolbox_number_value('A', 5)
+      = toolbox_number_value('B', 2)
+
+    -# 変数:(　)を丸める
+    %block{:type => "#{category}_round"}
+      = toolbox_number_value('A', 0.5)
+
+    -# 変数:(　)の[▼数学関数]
+    %block{:type => "#{category}_math_method"}
+      = toolbox_number_value('NUM', 9)
+      %field{:name => 'METHOD'}<
+        Math.sqrt(%num%)
+
+    -# テキスト
+    %block{:type => 'text'}
+      %field{:name => 'TEXT'}<
+        文章
+
+    -# 数値
+    %block{:type => 'math_number'}
+      %field{:name => 'NUM'}<
+        0
+
+  %category{:name => '条件'}
+    -# 条件:(　) < (　)
+    %block{:type => "#{category}_compare_gt"}
+
+    -# 条件:(　) <= (　)
+    %block{:type => "#{category}_compare_gte"}
+
+    -# 条件:(　) = (　)
+    %block{:type => "#{category}_compare_eq"}
+
+    -# 条件:(　) >= (　)
+    %block{:type => "#{category}_compare_lte"}
+
+    -# 条件:(　) > (　)
+    %block{:type => "#{category}_compare_lt"}
+
+    -# 条件:<　> かつ <　>
+    %block{:type => "#{category}_and"}
+
+    -# 条件:<　> または <　>
+    %block{:type => "#{category}_or"}
+
+    -# 条件:<　> ではない
+    %block{:type => "#{category}_negate"}
+
+    -# 条件:真
+    %block{:type => "#{category}_true"}
+
+    -# 条件:偽
+    %block{:type => "#{category}_false"}
+
+  -#%category{:name => '変数', :custom => 'VARIABLE'}
+
+  - category = 'ruby'
+  %category{:name => 'Ruby'}
+    -# 文
+    %block{:type => "#{category}_statement"}
+
+    -# 式
+    %block{:type => "#{category}_expression"}
+
+    -# コメント
+    %block{:type => "#{category}_comment"}
+
+    -# p
+    %block{:type => "#{category}_p"}
+
+  - category = 'hardware'
+  %category{:name => 'ハードウェア'}
+    %category{:name => '準備'}
+      -# ハードウェアを準備する
+      %block{:type => "#{category}_init_hardware"}
+
+    %category{:name => 'LED'}
+      -# LED[▼ピン]をオンにする
+      %block{:type => "#{category}_led_on"}
+
+      -# LED[▼ピン]をオフにする
+      %block{:type => "#{category}_led_off"}
+
+    %category{:name => 'RGB LED'}
+      -# RGB LED[▼アノード]コモン[▼ピン]を[カラー]にする
+      %block{:type => "#{category}_rgb_led_on"}
+
+      -# RGB LED[▼アノード]コモン[▼ピン]をオフにする
+      %block{:type => "#{category}_rgb_led_off"}
+
+    -#%category{:name => '7セグディスプレイ'}
+    -#  -# 7セグディスプレイに[▼0-9]を表示する
+    -#  %block{:type => "#{category}_seven_segment_display_show"}
+    -#
+    -#  -# 7セグディスプレイをオフにする
+    -#  %block{:type => "#{category}_seven_segment_display_off"}
+
+    -#%category{:name => 'LCD'}
+    -#  -# LCDに(　)を表示する
+    -#  %block{:type => "#{category}_lcd_puts"}
+    -#    = toolbox_text_value('TEXT', 'Hello')
+    -#
+    -#  -# LCDをクリアする
+    -#  %block{:type => "#{category}_lcd_clear"}
+
+    -#%category{:name => 'ボタン'}
+    -#  -# 条件:ボタン[▼]を押している
+    -#  %block{:type => "#{category}_button_down"}
+    -#
+    -#  -# 条件:ボタン[▼]を離している
+    -#  %block{:type => "#{category}_button_up"}
+    -#
+    -#  -# ボタン[▼]を押したとき
+    -#  %block{:type => "#{category}_on_button_down"}
+    -#
+    -#  -# ボタン[▼]を離したとき
+    -#  %block{:type => "#{category}_on_button_up"}
+
+    %category{:name => 'センサー'}
+      -# センサー[▼PIN]
+      %block{:type => "#{category}_sensor_value"}
+
+      -# センサー[▼PIN]が変化したとき
+      %block{:type => "#{category}_on_sensor_change"}