 
 class LC.TextWidget extends LC.ToolWidget
 
+  getFamilies: -> [
+    {name: 'Sans-serif', value: '"Helvetica Neue",Helvetica,Arial,sans-serif'},
+    {name: 'Serif', value: (
+      'Garamond,Baskerville,"Baskerville Old Face",'
+      '"Hoefler Text","Times New Roman",serif')}
+    {name: 'Typewriter', value: (
+      '"Courier New",Courier,"Lucida Sans Typewriter",'
+      '"Lucida Typewriter",monospace')},
+  ]
+
   title: "Text"
   cssSuffix: "text"
 


  button: -> "<img src='#{@opts.imageURLPrefix}/text.png'>"
  select: (lc) ->
    @updateToolStyle()
    lc.setTool(@tool)
    # not sure why we need to defer this, but I don't get paid enough to work
    # on this to find out why.

    new LC.TextTool()

  options: ->
    familyOptions = []
    i = 0
    for family in @getFamilies()
      familyOptions.push "<option value=#{i}>#{family.name}</option>"
      i += 1

    @$el = $(
      "<div>
       <input type='text' id='text' placeholder='Enter text here'
        value='#{@tool.text}'>
       <input type='text' id='font-size' value='18'>
       <select id='family'>#{familyOptions.join('')}</select>
       <label for='italic'><input type='checkbox' id='italic'>italic</label>
       <label for='bold'><input type='checkbox' id='bold'>bold</label>
       <span class='instructions'>Click and hold to place text.</span>
       </div>")

    @$input = @$el.find('input#text')
    $fontSize = @$el.find('input#font-size')

    @$input.change => @updateTool()
    @$input.keyup => @updateTool()
    $fontSize.change => @updateTool()
    $fontSize.keyup => @updateTool()
    @$el.find('input#italic').change => @updateTool()
    @$el.find('input#bold').change => @updateTool()
    @$el.find('#family').change =>
      @updateTool()
      @$input.focus()
      @$input.select()

    @$el

  updateTool: ->
    items = []
    if @$el.find('input#italic').is(':checked')
      items.push('italic')
    if @$el.find('input#bold').is(':checked')
      items.push('bold')
    items.push("#{parseInt(@$el.find('input#font-size').val(), 10)}px")

    familyIndex = parseInt(@$el.find('select#family').val(), 10)
    items.push(@getFamilies()[familyIndex].value)

    @tool.font = items.join(' ')
    @tool.text = @$el.find('input#text').val()
