UX Improvement: Autofocus the topic field on edit

- After clicking on the pencil icon to edit a topic, the focus is not set on the input.
- This leads to cases where using keyboard shorcuts (e.g. cmd + left) leads to navigation instead.
- Searching around online, it seems the cleanest way to add a text-field that autofocuses is to create a component.
- I followed the [cookbook](http://emberjs.com/guides/cookbook/user_interface_and_interaction/focusing_a_textfield_after_its_been_inserted/) and did the most naive implementation.
- This focuses the text-field but at the start of the input. Setting selectionStart and selectionEnd solves this problem, but does not work on IE 8 and below.

app/assets/javascripts/discourse/components/autofocus-text-field.js.es6

@@ -0,0 +1,7 @@
+export default Ember.TextField.extend({
+  becomeFocused: function() {
+    var input = this.get("element");
+    input.focus();
+    input.selectionStart = input.selectionEnd = input.value.length;
+  }.on('didInsertElement')
+});

app/assets/javascripts/discourse/templates/topic.hbs

@@ -17,9 +17,9 @@
           {{#if editingTopic}}
             {{#if isPrivateMessage}}
               <span class="private-message-glyph">{{fa-icon envelope}}</span>
-              {{text-field id='edit-title' value=newTitle maxLength=maxTitleLength}}
+              {{autofocus-text-field id='edit-title' value=newTitle maxLength=maxTitleLength}}
             {{else}}
-              {{text-field id='edit-title' value=newTitle maxLength=maxTitleLength}}
+              {{autofocus-text-field id='edit-title' value=newTitle maxLength=maxTitleLength}}
               </br>
               {{category-chooser valueAttribute="id" value=newCategoryId source=category_id}}
             {{/if}}