class Pettanr.PanelPicture extends Peta.Element
  url: '/panel_pictures/'
  
  @singular: () ->
    'PanelPicture'
  
  @plural: () ->
    'PanelPictures'
  
  defaults: {
    id: null
  } 
  
  picture: () ->
    new Pettanr.Picture({id: @get('picture_id')})
  
  panel: (options = {}) ->
    new Pettanr.Panel({id: @get('panel_id')}, options)
  
  @has_picture: () ->
    true
  
  flip: () ->
    v = if @get('height') > 0
      ''
    else
      'v'
    h = if @get('width') > 0
      ''
    else
      'h'
    res = v + h
    res = res # format of /1.png?subdir=v
    # res += '/' unless res.empty? # format of /v/1.png
    res
  
  filename: (picture) ->
    q = if _.isEmpty(@flip())
      ''
    else
      '?subdir=' + @flip()
    picture.filename() + q
  
  r_url: (picture) ->
    '/pictures/' + @filename(picture)
  
  tmb_opt_img_tag: (picture) ->
    new Pettanr.Image.SymbolPicture({
      attr: {
        src: picture.r_url(), 
        alt: @escape('caption')
      },
      picture: picture
    })
  
  symbol_option: () ->
    i = @picture()
    i.fetch({cache: true}).done =>
      @trigger('ready:symbol', i.tmb_opt_img_tag())
  
  element_face: () ->
    new Pettanr.Views.PanelPicture.ElementFace({element: this})
  
  initialize: () ->
    if @id
      @url = @url + @id
    @bind('change:width', () ->
      console.log('cng')
    )