fix: element edit

diff --git a/app/assets/javascripts/views/balloons/element.js.coffee b/app/assets/javascripts/views/balloons/element.js.coffee
index 6f04c0c..89cc58d 100644 (file)
--- a/app/assets/javascripts/views/balloons/element.js.coffee
+++ b/app/assets/javascripts/views/balloons/element.js.coffee
@@ -1,9 +1,6 @@
 class Pettanr.Views.Balloon.Element extends Backbone.View\r
   tagName: 'img'\r
   className: 'pettanr-balloon'\r
 class Pettanr.Views.Balloon.Element extends Backbone.View\r
   tagName: 'img'\r
   className: 'pettanr-balloon'\r

-  events: {\r
-    'ready:picture': 'set_style'\r
-  }\r

   \r
   initialize: (options) ->\r
     @element = options.element\r
   \r
   initialize: (options) ->\r
     @element = options.element\r


@@ -12,17 +9,16 @@ class Pettanr.Views.Balloon.Element extends Backbone.View
     @speech_balloon = options.parent\r
   \r
   clear: () ->\r
     @speech_balloon = options.parent\r
   \r
   clear: () ->\r

+    this\r
+  \r
+  render: () ->\r
+    this.$el.html('')\r

     retriever = @element.system_picture()\r
     @listenTo(retriever, 'retrieve', @retrieve_system_picture)\r
     retriever.retrieve()\r
     retriever = @element.system_picture()\r
     @listenTo(retriever, 'retrieve', @retrieve_system_picture)\r
     retriever.retrieve()\r

-    this\r

   \r
   retrieve_system_picture: (@system_picture) ->\r
   \r
   retrieve_system_picture: (@system_picture) ->\r

-    @render()\r
-  \r
-  render: () ->\r

     @set_style()\r
     @set_style()\r

-    this\r

   \r
   set_style: () ->\r
     attr = {\r
   \r
   set_style: () ->\r
     attr = {\r


@@ -50,8 +46,8 @@ class Pettanr.Views.Balloon.Element.Edit extends Pettanr.Views.Balloon.Element
     @listenTo(@element, 'input:width', @resize)\r
     @listenTo(@element, 'input:height', @resize)\r
   \r
     @listenTo(@element, 'input:width', @resize)\r
     @listenTo(@element, 'input:height', @resize)\r
   \r

-  render: () ->\r
-    super()\r
+  retrieve_system_picture: (@system_picture) ->\r
+    super(@system_picture)\r

     sb = @speech_balloon\r
     elm = @element\r
     this.$el.resizable {\r
     sb = @speech_balloon\r
     elm = @element\r
     this.$el.resizable {\r


@@ -91,8 +87,15 @@ class Pettanr.Views.Balloon.Element.Edit extends Pettanr.Views.Balloon.Element
     }\r
     this\r
   \r
     }\r
     this\r
   \r

+  style: () ->\r
+    {\r
+      width: Pettanr.to_s(@element.get('width')) + 'px', \r
+      height: Pettanr.to_s(@element.get('height')) + 'px',\r
+      'z-index': 1  # play case\r
+    }\r
+  \r

   input_r: () ->\r
   input_r: () ->\r

-    @clear()\r
+    @render()\r

     resize_div = this.$el.parent()\r
     resize_div.css('z-index', 1)\r
   \r
     resize_div = this.$el.parent()\r
     resize_div.css('z-index', 1)\r
   \r

diff --git a/app/assets/javascripts/views/panel_pictures/element.js.coffee b/app/assets/javascripts/views/panel_pictures/element.js.coffee
index d7289e7..a36768d 100644 (file)
--- a/app/assets/javascripts/views/panel_pictures/element.js.coffee
+++ b/app/assets/javascripts/views/panel_pictures/element.js.coffee
@@ -6,21 +6,26 @@ class Pettanr.Views.PanelPicture.Element extends Backbone.View
     @element = options.element\r
     @root = options.root\r
     @spot = options.spot\r
     @element = options.element\r
     @root = options.root\r
     @spot = options.spot\r

+  \r
+  clear: () ->\r
+    this\r
+  \r
+  render: () ->\r
+    retriever = @element.picture()\r
+    @listenTo(retriever, 'retrieve', @retrieve_picture)\r
+    retriever.retrieve()\r
+    this\r
+  \r
+  retrieve_picture: (@picture) ->\r

     img_class = @img_class()\r
     @img = new img_class({\r
       wrapper: this,\r
       element: @element,\r
     img_class = @img_class()\r
     @img = new img_class({\r
       wrapper: this,\r
       element: @element,\r

+      picture: @picture,\r

       spot: @spot\r
     })\r
       spot: @spot\r
     })\r

-    @add_element()\r
-  \r
-  clear: () ->\r
-    this\r
-  \r
-  render: () ->\r

     @restyle()\r
     @restyle()\r

-    this.$el.html(@img.clear().el)\r
-    this\r
+    this.$el.html(@img.render().el)\r

   \r
   restyle: () ->\r
     attr = {style: Pettanr.to_style(@style())}\r
   \r
   restyle: () ->\r
     attr = {style: Pettanr.to_style(@style())}\r


@@ -49,20 +54,14 @@ class Pettanr.Views.PanelPicture.Element.Img extends Backbone.View
   initialize: (options) ->\r
     @wrapper = options.wrapper\r
     @element = options.element\r
   initialize: (options) ->\r
     @wrapper = options.wrapper\r
     @element = options.element\r

+    @picture = options.picture\r

     @spot = options.spot\r
     @spot = options.spot\r

-    @picture = \r
-    @listenTo(this, 'ready', @render)\r
-    retriever = @element.picture()\r
-    @listenTo(retriever, 'retrieve', @retrieve_picture)\r
-    retriever.retrieve()\r
-  \r
-  retrieve_picture: (@picture) ->\r
-    @trigger('ready')\r

   \r
   clear: () ->\r
     this\r
   \r
   render: () ->\r
   \r
   clear: () ->\r
     this\r
   \r
   render: () ->\r

+    this.$el.html('')\r

     @restyle()\r
     this\r
   \r
     @restyle()\r
     this\r
   \r


@@ -92,11 +91,10 @@ class Pettanr.Views.PanelPicture.Element.Edit extends Pettanr.Views.PanelPicture
     @listenTo(@element, 'active', @active)\r
     @listenTo(@element, 'inactive', @inactive)\r
   \r
     @listenTo(@element, 'active', @active)\r
     @listenTo(@element, 'inactive', @inactive)\r
   \r

-  render: () ->\r
-    super()\r
+  retrieve_picture: (@picture) ->\r
+    super(@picture)\r

     img = @img\r
     wrapper = this\r
     img = @img\r
     wrapper = this\r

-    elm = @element\r

     this.$el.draggable {\r
       stop: (event, ui) ->\r
         left = img.$el.parent().position().left + wrapper.$el.position().left\r
     this.$el.draggable {\r
       stop: (event, ui) ->\r
         left = img.$el.parent().position().left + wrapper.$el.position().left\r


@@ -104,34 +102,8 @@ class Pettanr.Views.PanelPicture.Element.Edit extends Pettanr.Views.PanelPicture
         elm.set({x: parseInt(left), y: parseInt(top)}, {silent: true})\r
         elm.trigger('move')\r
     }\r
         elm.set({x: parseInt(left), y: parseInt(top)}, {silent: true})\r
         elm.trigger('move')\r
     }\r

-    this\r
-  \r
-  active: () ->\r
-    $('.ui-resizable-handle', this.el).map ->\r
-      $(@).css('display', 'block')\r
-  \r
-  inactive: () ->\r
-    $('.ui-resizable-handle', this.el).map ->\r
-      $(@).css('display', 'none')\r
-  \r
-  element_class: (element) ->\r
-    Pettanr.Views[element.singular()].Element.Edit\r
-  \r
-  img_class: () ->\r
-    Pettanr.Views.PanelPicture.Element.Img.Edit\r
-  \r
-class Pettanr.Views.PanelPicture.Element.Img.Edit extends Pettanr.Views.PanelPicture.Element.Img\r
-  \r
-  initialize: (options) ->\r
-    super(options)\r
-    @listenTo(@element, 'input:width', @restyle)\r
-    @listenTo(@element, 'input:height', @restyle)\r
-  \r
-  render: () ->\r
-    super()\r
-    wrapper = @wrapper\r

     elm = @element\r
     elm = @element\r

-    this.$el.resizable {\r
+    @img.$el.resizable {\r

       stop: (event, ui) ->\r
         resize_div = ui.element\r
         panel_picture_div = wrapper.$el\r
       stop: (event, ui) ->\r
         resize_div = ui.element\r
         panel_picture_div = wrapper.$el\r


@@ -166,6 +138,31 @@ class Pettanr.Views.PanelPicture.Element.Img.Edit extends Pettanr.Views.PanelPic
       handles: 'all',\r
       autoHide: true\r
     }\r
       handles: 'all',\r
       autoHide: true\r
     }\r

+    this\r
+  \r
+  active: () ->\r
+    $('.ui-resizable-handle', this.el).map ->\r
+      $(@).css('display', 'block')\r
+  \r
+  inactive: () ->\r
+    $('.ui-resizable-handle', this.el).map ->\r
+      $(@).css('display', 'none')\r
+  \r
+  element_class: (element) ->\r
+    Pettanr.Views[element.singular()].Element.Edit\r
+  \r
+  img_class: () ->\r
+    Pettanr.Views.PanelPicture.Element.Img.Edit\r
+  \r
+class Pettanr.Views.PanelPicture.Element.Img.Edit extends Pettanr.Views.PanelPicture.Element.Img\r
+  \r
+  initialize: (options) ->\r
+    super(options)\r
+    @listenTo(@element, 'input:width', @restyle)\r
+    @listenTo(@element, 'input:height', @restyle)\r
+  \r
+  render: () ->\r
+    super()\r

   \r
   restyle: () ->\r
     super()\r
   \r
   restyle: () ->\r
     super()\r

diff --git a/app/assets/javascripts/views/panels/body.js.coffee b/app/assets/javascripts/views/panels/body.js.coffee
index af8f938..17a5dd8 100644 (file)
--- a/app/assets/javascripts/views/panels/body.js.coffee
+++ b/app/assets/javascripts/views/panels/body.js.coffee
@@ -39,7 +39,8 @@ class Pettanr.Views.Panel.Body extends Backbone.View
     view = new c({element: element, root: @panel, spot: @spot})\r
     @views.splice(index, 0, view)\r
     if @is_visible()\r
     view = new c({element: element, root: @panel, spot: @spot})\r
     @views.splice(index, 0, view)\r
     if @is_visible()\r

-      this.$el.append(view.render().el)\r
+      this.$el.append(view.clear().el)\r
+      view.render()\r

     view\r
   \r
   element_class: (element) ->\r
     view\r
   \r
   element_class: (element) ->\r


@@ -67,6 +68,8 @@ class Pettanr.Views.Panel.Body.Edit extends Pettanr.Views.Panel.Body
     @listenTo(@panel, 'input:border', @restyle)\r
     @listenTo(@panel, 'active', @active)\r
     @listenTo(@panel, 'inactive', @inactive)\r
     @listenTo(@panel, 'input:border', @restyle)\r
     @listenTo(@panel, 'active', @active)\r
     @listenTo(@panel, 'inactive', @inactive)\r

+    @listenTo(this, 'active', @active)\r
+    @listenTo(this, 'inactive', @inactive)\r

   \r
   render: () ->\r
     super()\r
   \r
   render: () ->\r
     super()\r


@@ -76,8 +79,14 @@ class Pettanr.Views.Panel.Body.Edit extends Pettanr.Views.Panel.Body
         h = parseInt(this.$el.height())\r
         @panel.set({width: w, height: h}, {silent: true})\r
         @panel.trigger('resize')\r
         h = parseInt(this.$el.height())\r
         @panel.set({width: w, height: h}, {silent: true})\r
         @panel.trigger('resize')\r

-      , autoHide: true\r
+      , autoHide: false\r

     }\r
     }\r

+    @inactive()\r
+    _this = this\r
+    this.$el.mouseover -> \r
+      _this.trigger('active')\r
+    this.$el.mouseout -> \r
+      _this.trigger('inactive')\r

     this\r
   \r
   is_visible: () ->\r
     this\r
   \r
   is_visible: () ->\r

diff --git a/app/assets/javascripts/views/speech_balloons/element.js.coffee b/app/assets/javascripts/views/speech_balloons/element.js.coffee
index f2a3869..8eee1f5 100644 (file)
--- a/app/assets/javascripts/views/speech_balloons/element.js.coffee
+++ b/app/assets/javascripts/views/speech_balloons/element.js.coffee
@@ -33,10 +33,15 @@ class Pettanr.Views.SpeechBalloon.Element extends Backbone.View
       spot: @spot\r
     })\r
   \r
       spot: @spot\r
     })\r
   \r

+  clear: () ->\r
+    this\r
+  \r

   render: () ->\r
     this.$el.html('')\r
     this.$el.append(@balloon_view.clear().el)\r
     this.$el.append(@speech_view.render().el)\r
   render: () ->\r
     this.$el.html('')\r
     this.$el.append(@balloon_view.clear().el)\r
     this.$el.append(@speech_view.render().el)\r

+    @set_style()\r
+    @balloon_view.render()\r

     this\r
   \r
   set_style: () ->\r
     this\r
   \r
   set_style: () ->\r


@@ -86,7 +91,6 @@ class Pettanr.Views.SpeechBalloon.Element.Edit extends Pettanr.Views.SpeechBallo
   set_style: () ->\r
     super()\r
   \r
   set_style: () ->\r
     super()\r
   \r

-  # listen from speech\r

   input_r: () ->\r
     @trigger('input:r')\r
   \r
   input_r: () ->\r
     @trigger('input:r')\r
   \r