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