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

   1 class Pettanr.Views.GroundPicture.Element extends Pettanr.View\r
   2   tagName: 'div'\r
   3   className: 'pettanr-comic-ground-picture'\r
   4   \r
   5   initialize: (options) ->\r
   6     @element = options.element\r
   7     @root = options.root\r
   8     @spot = options.spot\r
   9   \r
  10   init_picture: () ->\r
  11   \r
  12   render: () ->\r
  13     @element.get_parent('picture', this, {\r
  14       success: (@picture) =>\r
  15         @init_picture()\r
  16         @restyle()\r
  17     })\r
  18     this\r
  19   \r
  20   restyle: () ->\r
  21     s = @style(@spot)\r
  22     _.extend(s, @style_wh())\r
  23     attr = {\r
  24       style: Pettanr.to_style(s)\r
  25     }\r
  26     this.$el.attr(attr)\r
  27   \r
  28   style: (spot = null, opacity = 20) ->\r
  29     r = {\r
  30       position: 'absolute', \r
  31       top: '0px', \r
  32       left: '0px',\r
  33       'z-index': @element.get('z'), \r
  34       'background-image': 'url(' + @picture.picture_file().src() + ')', \r
  35       'background-repeat': @element.repeat_text(), \r
  36       'background-position': Pettanr.to_s(@element.get('x')) + '% ' + Pettanr.to_s(@element.get('y')) + '%'\r
  37     }\r
  38     r\r
  39   \r
  40   style_wh: () ->\r
  41     {\r
  42       width: Pettanr.to_s(@root.get('width')) + 'px', \r
  43       height: Pettanr.to_s(@root.get('height')) + 'px'\r
  44     }\r
  45   \r
  46 class Pettanr.Views.GroundPicture.Element.Edit extends Pettanr.Views.GroundPicture.Element\r
  47   \r
  48   initialize: (options) ->\r
  49     super(options)\r
  50   \r
  51   init_picture: () ->\r
  52     super()\r
  53     @listenTo(@root, 'resize', @restyle)\r
  54     @listenTo(@root, 'input:width', @restyle)\r
  55     @listenTo(@root, 'input:height', @restyle)\r
  56     @listenTo(@element, 'input:repeat', @restyle)\r
  57     @listenTo(@element, 'input:x', @restyle)\r
  58     @listenTo(@element, 'input:y', @restyle)\r
  59     @listenTo(@element, 'active', @active)\r
  60     @listenTo(@element, 'inactive', @inactive)\r
  61     @listenTo(@element, 'sort', @restyle)\r
  62   \r
  63   active: () ->\r
  64     @root.trigger('active')\r
  65   \r
  66   inactive: () ->\r
  67     @root.trigger('inactive')\r
  68   \r