Rouge View

Title.coffee

###
  # Title module

  Contains all the stuff related to the title,
  from autogenerating it to storing a different
  one
###
define [
  'app'
  # modules

  # templates
  'templates/layouts/title'

], (app) ->

  # title is a module
  Title = app.module()

  # # Title Layout View
  Title.Views.Layout = Backbone.View.extend(
    template: 'layouts/title'
    
    # a regex to remove tags
    notags : /(<([^>]+)>)/ig

    events:
      # when we click on the .editable h2 we want to edit
      'mousedown .editable' : 'editableClick'
      # when we click elsewhere, we want to handle it
      'blur .editable' : 'editableBlur'
      # we also want to save if the user presses enter
      'keypress' : 'saveOnEnter'

    initialize: ->
      @model.on('change', @render, @)
      @model.on('save', @save, @)

    # we want to use the generated title if the user hasn't
    # written one, the custom one otherwise
    serialize: ->
      title = @model.get('title')
      obj = {}
      if !title.title?
        obj.title = title.generatedTitle
        obj.desc  = ''
      else
        obj.title = title.title
        obj.desc  = title.generatedTitle
      return obj;

    # we update the document's title when we
    # finish rendering
    afterRender: ->
      console.log('Rendered!')
      title = @model.get('title');
      # use the custom title if it's set
      if title.title != '' 
        pagetitle = title.title
      # use the generated otne otherwise
      else 
        pagetitle = model.get('generatedTitle')
      # compose it nicely
      pagetitle = 'Palomino: ' + pagetitle + ' ' + @model.get('desc')
      # and put it on the search bar. 
      $('title').html pagetitle

    # on click, we set the h2 tag to be
    # editable  (html5)
    editableClick: (event)->
      @$('.editable').attr('contenteditable', true)

    # on blur, we save the model
    editableBlur: (event) ->
      @save()

    # when enter is pressed, we save
    saveOnEnter: (event) ->
      if event.keyCode is 13 # ENTER
        event.preventDefault()
        @save()

    # a function to save the new title
    save: ->
      newTitle = @$('.editable').html().replace(@notags, '')
      @model.set title: newTitle
      # notify
      app.trigger 'changedTitle', @model.get('title')
      
      
  )

  return Title
  # return the module