app/assets/javascripts/views/speech_balloons/element.js.coffee

   1 class Pettanr.Views.SpeechBalloon.Element extends Pettanr.View\r
   2   tagName: 'div'\r
   3   className: 'pettanr-comic-balloon'\r
   4   \r
   5   initialize: (options) ->\r
   6     @element = options.element\r
   7     @root = options.root\r
   8     @spot = options.spot\r
   9     @add_element()\r
  10   \r
  11   add_element: () ->\r
  12     @add_balloon()\r
  13     @add_speech()\r
  14   \r
  15   add_balloon: () ->\r
  16     @balloon = @element.get('balloon')\r
  17     @set_style()\r
  18     klass = @balloon_class()\r
  19     @balloon_view = new klass({\r
  20       parent: this, \r
  21       element: @balloon, \r
  22       root: @root,\r
  23       spot: @spot\r
  24     })\r
  25   \r
  26   add_speech: () ->\r
  27     @speech = @element.get('speech')\r
  28     klass = @speech_class()\r
  29     @speech_view = new klass({\r
  30       parent: this, \r
  31       element: @speech, \r
  32       root: @root,\r
  33       spot: @spot\r
  34     })\r
  35   \r
  36   clear: () ->\r
  37     this\r
  38   \r
  39   render: () ->\r
  40     this.$el.html('')\r
  41     this.$el.append(@balloon_view.clear().el)\r
  42     this.$el.append(@speech_view.render().el)\r
  43     @set_style()\r
  44     @balloon_view.render()\r
  45     this\r
  46   \r
  47   set_style: () ->\r
  48     attr = {style: Pettanr.to_style(@style())}\r
  49     this.$el.attr(attr)\r
  50   \r
  51   style: () ->\r
  52     {\r
  53       width: Pettanr.to_s(@balloon.get('width')) + 'px', \r
  54       height: Pettanr.to_s(@balloon.get('height')) + 'px',\r
  55       top: Pettanr.to_s(@balloon.get('y')) + 'px',\r
  56       left: Pettanr.to_s(@balloon.get('x')) + 'px',\r
  57       'z-index': @element.get('z')\r
  58     }\r
  59   \r
  60   balloon_class: () ->\r
  61     Pettanr.Views.Balloon.Element\r
  62   \r
  63   speech_class: () ->\r
  64     Pettanr.Views.Speech.Element\r
  65   \r
  66 class Pettanr.Views.SpeechBalloon.Element.Edit extends Pettanr.Views.SpeechBalloon.Element\r
  67   \r
  68   initialize: (options) ->\r
  69     super(options)\r
  70     @listenTo(@element, 'sort', @set_style)\r
  71     @listenTo(@element, 'active', @active)\r
  72     @listenTo(@element, 'inactive', @inactive)\r
  73   \r
  74   render: () ->\r
  75     super()\r
  76     @listenTo(@balloon, 'input:r', @input_r)\r
  77     @listenTo(@balloon, 'input:x', @set_style)\r
  78     @listenTo(@balloon, 'input:y', @set_style)\r
  79     @listenTo(@balloon, 'input:width', @set_style)\r
  80     @listenTo(@balloon, 'input:height', @set_style)\r
  81     bln = @balloon\r
  82     this.$el.draggable {\r
  83       stop: (event, ui) ->\r
  84         left = Math.floor($(@).position().left)\r
  85         top = Math.floor($(@).position().top)\r
  86         bln.set({x: left, y: top}, {silent: true})\r
  87         bln.trigger('move')\r
  88     }\r
  89     this\r
  90   \r
  91   set_style: () ->\r
  92     super()\r
  93   \r
  94   input_r: () ->\r
  95     @trigger('input:r')\r
  96   \r
  97   active: () ->\r
  98     $('.ui-resizable-handle', this.el).map ->\r
  99       $(@).css('display', 'block')\r
 100   \r
 101   inactive: () ->\r
 102     $('.ui-resizable-handle', this.el).map ->\r
 103       $(@).css('display', 'none')\r
 104   \r
 105   element_class: (element) ->\r
 106     Pettanr.Views[element.singular()].Element.Edit\r
 107   \r
 108   balloon_class: () ->\r
 109     Pettanr.Views.Balloon.Element.Edit\r
 110   \r
 111   speech_class: () ->\r
 112     Pettanr.Views.Speech.Element.Edit\r
 113   \r