smalruby-editor 0.2.1 → 0.2.2

data/app/assets/javascripts/{smalruby.js.coffee → smalruby.js.coffee.erb}

@@ -1,3 +1,8 @@
+<%
+  require 'smalruby_editor'
+  require 'smalruby_editor/blockly_message_helper'
+%>
+
 window.SmalrubyEditor = {}
 window.changed = false
 window.textEditor = null
@@ -16,7 +21,7 @@ window.successMessage = (title, msg = '', selector = '#messages') ->
 window.errorMessage = (msg, selector = '#messages') ->
   html = $('<div class="alert alert-error" style="display: none">')
     .append('<button type="button" class="close" data-dismiss="alert">×</button>')
-    .append('<h4><i class="icon-exclamation-sign"></i>エラー</h4>')
+    .append("<h4><i class=\"icon-exclamation-sign\"></i>#{<%= bm('common_error') %>}</h4>")
     .append(msg)
   $(selector).append(html)
   html.fadeIn('slow')
@@ -30,12 +35,16 @@ window.Smalruby =
   Collections: {}
   Views: {}
   Routers: {}
+  Features: []
+
+  username: null
+
   initialize: ->
     $.ajaxSetup
       headers:
         'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
 
-    # HACK: Underscoreのテンプレートの<%, %>はHamlと組み合わせたときに
+    # HACK: Underscoreのテンプレートの\<\%, \%\>はHamlと組み合わせたときに
     #   HTML要素の属性がHamlによってエスケープされてしまうため使いにく
     #   い。そこで、それぞれ{{, }}に変更する。
     _.extend(_.templateSettings, {
@@ -44,17 +53,6 @@ window.Smalruby =
       interpolate: /{{=([\s\S]+?)}}/
     })
 
-    # HACK: 一度開いたジャンルを2回クリックしても閉じないように修正
-    Blockly.Toolbox.TreeNode.prototype.onMouseDown = (e) ->
-      if @hasChildren() && @isUserCollapsible_
-        @toggle()
-        @select()
-      else if @isSelected()
-        #@getTree().setSelectedItem(null)
-      else
-        @select()
-      @updateRow()
-
     @Collections.CharacterSet = new Smalruby.CharacterSet()
 
     @Views.MainMenuView = new Smalruby.MainMenuView()
@@ -72,7 +70,7 @@ window.Smalruby =
     Smalruby.downloading = false
     window.onbeforeunload = (event) ->
       if !Smalruby.downloading && window.changed
-        return '作成中のプログラムが消えてしまうよ！'
+        return <%= bm('.will_disapper_your_program') %>
       else
         Smalruby.downloading = false
         return
@@ -85,8 +83,6 @@ window.Smalruby =
       toolbox: document.getElementById('toolbox')
       trashcan: true
 
-    Blockly.Toolbox.tree_.expandAll()
-
     @blocklyFirst = true
     @blocklyLoading = false
     Blockly.addChangeListener =>
@@ -110,6 +106,7 @@ window.Smalruby =
     textEditor.setTheme('ace/theme/clouds')
     textEditor.setShowInvisibles(true)
     textEditor.gotoLine(0, 0)
+    textEditor.setReadOnly(@isEnabled('readonly_ruby_mode'))
     textEditor.on 'change', (e) =>
       unless @translating
         window.changed = true
@@ -120,6 +117,8 @@ window.Smalruby =
     session.setTabSize(2)
     session.setUseSoftTabs(true)
 
+    @addCharacterFromBeginning()
+
   loadXml: (data, workspace = Blockly.mainWorkspace) ->
     xml = Blockly.Xml.textToDom(data)
     workspace.clear()
@@ -172,6 +171,7 @@ window.Smalruby =
     $('#filename').val('')
     window.textEditor.getSession().getDocument().setValue('')
     window.textEditor.moveCursorTo(0, 0)
+    @addCharacterFromBeginning()
     window.changed = false
 
   # 国際化したメッセージを取得する
@@ -182,5 +182,24 @@ window.Smalruby =
     else
       name
 
+  addCharacterFromBeginning: ->
+    if @isEnabled('add_character_from_beginning')
+      constume = 'cat1.png'
+      c = new Smalruby.Character
+        name: @Collections.CharacterSet.uniqueName(constume)
+        costumes: [constume]
+        x: 200
+        y: 200
+      @Collections.CharacterSet.add(c)
+      @Views.CharacterSelectorView.prevBlock = null
+      @Views.CharacterSelectorView.addBlock_(c)
+      window.changed = false
+
+  isEnabled: (feature) ->
+    @Features.indexOf(feature) != -1
+
 $(document).ready ->
   Smalruby.initialize()
+
+  if Smalruby.username == null && Smalruby.isEnabled('must_signin')
+    Smalruby.Views.SigninModalView.render()

data/app/assets/javascripts/views/character_selector_view.js.coffee

@@ -61,14 +61,14 @@ Smalruby.CharacterSelectorView = Backbone.View.extend({
     @render()
 
   addBlock_: (character) ->
-    newBlock = new Blockly.Block(Blockly.mainWorkspace, 'character_new')
+    newBlock = Blockly.Block.obtain(Blockly.mainWorkspace, 'character_new')
     newBlock.setCharacter(character)
     newBlock.initSvg()
     newBlock.render()
     @moveByNewBlock_(newBlock)
     newBlock.select()
 
-    onStartBlock = new Blockly.Block(Blockly.mainWorkspace, 'events_on_start')
+    onStartBlock = Blockly.Block.obtain(Blockly.mainWorkspace, 'events_on_start')
     onStartBlock.initSvg()
     onStartBlock.render()
     newBlock.getInput('DO').connection.connect(onStartBlock.previousConnection)

data/app/assets/javascripts/views/{load_modal_view.js.coffee → load_modal_view.js.coffee.erb}

@@ -1,4 +1,9 @@
-# ロードダイアログを表現するビュー
+<%
+  require 'smalruby_editor'
+  require 'smalruby_editor/blockly_message_helper'
+%>
+
+# load dialog view
 Smalruby.LoadModalView = Backbone.View.extend
   events:
     'click #load-modal-ok-button': 'onOk'
@@ -26,6 +31,7 @@ Smalruby.LoadModalView = Backbone.View.extend
 
     unblock = =>
       @$el.find('.modal-body').unblock()
+      null # HACK: if return unblock(), does not call fail().
 
     @$el.modal('show')
 
@@ -51,7 +57,7 @@ Smalruby.LoadModalView = Backbone.View.extend
       .then(unblock, unblock)
       .fail =>
         @$el.modal('hide')
-        errorMessage('ロードに失敗しました')
+        errorMessage(<%= bm('.error') %>)
 
   onOk: ->
     switch @type

data/app/assets/javascripts/views/main_menu_view.js.coffee.erb

@@ -3,7 +3,7 @@
   require 'smalruby_editor/blockly_message_helper'
 %>
 
-# ナビゲーションメニューを表現するビュー
+# navigation menu view
 Smalruby.MainMenuView = Backbone.View.extend
   el: '#main-menu'
 
@@ -152,34 +152,26 @@ Smalruby.MainMenuView = Backbone.View.extend
     clearMessages()
 
     @blockUI
-      title:
-        """
-        #{<%= bm('.download_blockui_title') %>}
-        """
+      title: <%= bm('.download_blockui_title') %>
       message: <%= bm('.download_blockui_message') %>
-      notice:
-        """
-        ダウンロードしたプログラムは、<br>
-        Windowsだと「ruby #{sourceCode.get('filename')}」、<br>
-        Macだと「rsdl #{sourceCode.get('filename')}」で実行できます。
-        """
 
     sourceCode.save2()
       .then (data) ->
         window.changed = false
-        window.successMessage('ダウンロードしました')
+        window.successMessage(goog.getMsg(<%= bm('.download_succeeded') %>,
+                              { filename: sourceCode.get('filename') }))
         Smalruby.downloading = true
         $('#download-link').click()
       .then(@unblockUI, @unblockUI)
       .fail ->
-        window.errorMessage('ダウンロードできませんでした')
+        window.errorMessage(<%= bm('.download_error') %>)
 
   onLoadLocal: (e) ->
     e.preventDefault()
 
     # TODO: window.changed -> Smalruby.Models.SourceCode.changed
     if window.changed
-      return unless confirm('まだセーブしていないのでロードするとプログラムが消えてしまうよ！\nそれでもロードしますか？')
+      return unless confirm(<%= bm('.load_confirm') %>)
 
     Smalruby.Views.LoadModalView.render()
 
@@ -188,7 +180,7 @@ Smalruby.MainMenuView = Backbone.View.extend
 
     # TODO: window.changed -> Smalruby.Models.SourceCode.changed
     if window.changed
-      return unless confirm('まだセーブしていないのでロードするとプログラムが消えてしまうよ！\nそれでもロードしますか？')
+      return unless confirm(<%= bm('.load_confirm') %>)
     $('input#load-file[name="source_code[file]"]').click()
 
   onSave: (e) ->
@@ -196,7 +188,7 @@ Smalruby.MainMenuView = Backbone.View.extend
 
     filename = $.trim($('#filename').val())
     if filename.length <= 0
-      window.errorMessage('セーブする前にプログラムに名前をつけてね！')
+      window.errorMessage(<%= bm('.save_error_no_name') %>)
       $('#filename').focus()
       return
 
@@ -208,29 +200,23 @@ Smalruby.MainMenuView = Backbone.View.extend
     clearMessages()
 
     @blockUI
-      title:
-        """
-        プログラムのセーブ中
-        """
-      message: 'プログラムをセーブしています。'
-      notice:
-        """
-        プログラムの名前は「#{sourceCode.get('filename')}」です。<br>
-        プログラムはホームディレクトリにセーブします。<br>
-        """
+      title: <%= bm('.save_blockui_title') %>
+      message: <%= bm('.save_blockui_message') %>
+      notice: goog.getMsg(<%= bm('.save_blockui_notice') %>,
+                          { filename: sourceCode.get('filename') })
 
-    errorMsg = 'セーブできませんでした'
+    errorMsg = <%= bm('.save_error_message') %>
     sourceCode.save2()
       .then (data) ->
         sourceCode.write()
       .then (data) =>
         @confirmOverwrite_.call @, data, sourceCode, ->
-          errorMsg = 'セーブをキャンセルしました'
+          errorMsg = <%= bm('.save_canceled') %>
       .then(@unblockUI, @unblockUI)
       .done ->
         Smalruby.savedFilename = sourceCode.get('filename')
         window.changed = false
-        window.successMessage('セーブしました')
+        window.successMessage(<%= bm('.save_succeeded') %>)
       .fail ->
         window.errorMessage(errorMsg)
 
@@ -242,31 +228,24 @@ Smalruby.MainMenuView = Backbone.View.extend
     sourceCode = @getSourceCode()
 
     @blockUI
-      title:
-        """
-        プログラムのチェック中
-        """
-      message: 'プログラムの文法をチェックしています。'
-      notice:
-        """
-        このチェックは簡易的なものですので、<br>
-        プログラムを動かすとエラーが見つかるかもしれません。
-        """
+      title: <%= bm('.check_blockui_title') %>
+      message: <%= bm('.check_blockui_message') %>
+      notice: <%= bm('.check_blockui_notice') %>
 
     sourceCode.check()
       .then (data) ->
         if data.length == 0
-          window.successMessage('チェックしました', 'ただし、プログラムを動かすとエラーが見つかるかもしれません。')
+          window.successMessage(<%= bm('.check_succeeded') %>, <%= bm('.check_succeeded_notice') %>)
         else
           for errorInfo in data
             do (errorInfo) ->
-              msg = "#{errorInfo.row}行"
+              msg = "#{errorInfo.row}#{<%= bm('.common_lines') %>}"
               if errorInfo.column > 0
-                msg += "、#{errorInfo.column}文字"
+                msg += "#{<%= bm('.common_comma') %>}#{errorInfo.column}#{<%= bm('.common_letters') %>}"
               window.errorMessage(msg + ": #{errorInfo.message}")
       .then(@unblockUI, @unblockUI)
       .fail ->
-        errorMessage('チェックできませんでした')
+        errorMessage(<%= bm('.check_error') %>)
 
   onReset: (e) ->
     e.preventDefault()
@@ -291,13 +270,17 @@ Smalruby.MainMenuView = Backbone.View.extend
     })
       .then(
         (data) ->
+          Smalruby.username = null
           $('#signin-button').show()
           $('#signout-button').hide()
           $('#username-label').text('')
           $('#username-button').hide()
-          successMessage('ログアウトしました')
+          successMessage(<%= bm('.signout_succeeded') %>)
+
+          if Smalruby.isEnabled('must_signin')
+            Smalruby.Views.SigninModalView.render()
         ->
-          errorMessage('ログアウトに失敗しました')
+          errorMessage(<%= bm('.signout_error') %>)
       )
 
   onUsername: (e) ->
@@ -358,7 +341,8 @@ Smalruby.MainMenuView = Backbone.View.extend
   confirmOverwrite_: (data, sourceCode, canceled = $.noop) ->
     if data.source_code.error
       if sourceCode.get('filename') == Smalruby.savedFilename ||
-         confirm("前に#{sourceCode.get('filename')}という名前でセーブしているけど本当にセーブしますか？\nセーブすると前に作成したプログラムは消えてしまうよ！")
+         confirm(goog.getMsg(<%= bm('.common_confirm_overwrite') %>,
+                             { filename: sourceCode.get('filename') }))
         sourceCode.write(true)
       else
         canceled.call()
@@ -366,7 +350,8 @@ Smalruby.MainMenuView = Backbone.View.extend
 
   load: (info) ->
     if info.error
-      window.errorMessage(info.filename + 'は' + info.error)
+      window.errorMessage(goog.getMsg(<%= bm('.load_error') %>,
+                          { filename: info.filename, error: info.error }))
     else
       clearMessages()
 
@@ -395,4 +380,4 @@ Smalruby.MainMenuView = Backbone.View.extend
       # TODO: window.changed -> Smalruby.Models.SourceCode.changed
       window.changed = false
       Smalruby.changedAfterTranslating = true
-      window.successMessage('ロードしました')
+      window.successMessage(<%= bm('.load_succeeded') %>)

data/app/assets/javascripts/views/signin_modal_view.js.coffee.erb

@@ -0,0 +1,43 @@
+<%
+  require 'smalruby_editor'
+  require 'smalruby_editor/blockly_message_helper'
+%>
+
+# signin dialog view
+Smalruby.SigninModalView = Backbone.View.extend
+  events:
+    'click #signin-modal-ok-button': 'onOk' # FIXME: 本当は#signin-modal .ok-buttonを指定したいができなかった
+
+  initialize: ->
+    Smalruby.ignoreEnterKey(@$el)
+    @$el.on 'shown', =>
+      @$el.find('#signin-modal-username')
+        .focus()
+
+  render: ->
+    @$el.find('#signin-modal-username')
+      .val($('#username-label').text())
+    @$el.modal
+      backdrop: 'static'
+    @$el.modal('show')
+
+  onOk: (e) ->
+    username = @$el.find('input[name=username]').val()
+    if $.trim(username).length > 0
+      $.post('/sessions/', { username: username })
+        .then(
+          (data) ->
+            Smalruby.username = data
+            $('#signin-button').hide()
+            $('#signout-button').show()
+            $('#username-label').text(data)
+            $('#username-button').show()
+            successMessage(<%= bm('.signed_in') %>)
+            new $.Deferred().resolve().promise()
+          ->
+            errorMessage(<%= bm('.error') %>)
+            new $.Deferred().resolve().promise()
+        )
+        .done =>
+          if Smalruby.username != null || !Smalruby.isEnabled('must_signin')
+            @$el.modal('hide')

data/app/assets/stylesheets/application.css

@@ -10,7 +10,9 @@
  *
  *= require flatstrap-custom
  *= require_self
- *= require_tree .
+ *= require editor
+ *= require load-modal
+ *= require toolbox
  */
 
 html, body {

data/app/assets/stylesheets/toolbox.css.scss.erb

@@ -1,58 +1,11 @@
-<%
-  # hsv_to_rgb メソッドは http://c4se.hatenablog.com/entry/2013/08/04/190937 をほぼコピーした
-  def hsv_to_rgb(h, s, v)
-    s /= 100.0
-    v /= 100.0
-    c = v * s
-    x = c * (1 - ((h / 60.0) % 2 - 1).abs)
-    m = v - c
-    r, g, b = *(
-      case
-      when h < 60  then [c, x, 0]
-      when h < 120 then [x, c, 0]
-      when h < 180 then [0, c, x]
-      when h < 240 then [0, x, c]
-      when h < 300 then [x, 0, c]
-      else              [c, 0, x]
-      end
-    )
-    [r, g, b].map { |channel|
-      ((channel + m) * 255).ceil
-    }.map { |c|
-      '%02x' % c
-    }.join
-  end
-
-  require 'smalruby_editor'
-  colors = SmalrubyEditor::COLORS
-
-  hues = [
-    colors[:motion],
-    colors[:looks],
-    colors[:sound],
-    colors[:pen],
-    colors[:data],
-    colors[:events],
-    colors[:control],
-    colors[:sensing],
-    colors[:operators],
-    colors[:etc],
-  ]
-
-  colors = hues.map { |h|
-    [hsv_to_rgb(h, 100, 80), hsv_to_rgb(h, 100, 100)]
-  }
-
-  colors.each.with_index(1) do |(color, active_color), index|
-%>
+div.blocklyTreeRoot {
+    padding: 0;
 
-div[aria-level="1"][aria-posinset="<%= index %>"] {
     .blocklyTreeRow {
         margin-bottom: 1px;
         padding-top: 1px;
         padding-bottom: 1px;
         color: white;
-        background-color: #<%= color %> !important;
 
         span.blocklyTreeIcon, span.blocklyTreeLabel {
           font-size: 14px;
@@ -61,12 +14,5 @@ div[aria-level="1"][aria-posinset="<%= index %>"] {
 
     .blocklyTreeRow.blocklyTreeSelected {
         font-weight: bold;
-        background-color: #<%= active_color %> !important;
     }
 }
-
-<% end %>
-
-div.blocklyTreeRoot {
-    padding: 0;
-}