- 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.
161 lines
5.0 KiB
Handlebars
161 lines
5.0 KiB
Handlebars
<div class='container'>
|
|
{{custom-html "top"}}
|
|
{{global-notice}}
|
|
{{discourse-banner user=currentUser banner=site.banner overlay=view.hasScrolled}}
|
|
</div>
|
|
|
|
{{#if postStream.loaded}}
|
|
|
|
{{#if postStream.firstPostPresent}}
|
|
<div id='topic-title'>
|
|
<div class='container'>
|
|
{{#if showStarButton}}
|
|
<a {{bind-attr class=":star starred:starred"}} {{action "toggleStar"}} href='#' {{bind-attr title="starTooltip"}}></a>
|
|
{{/if}}
|
|
|
|
<div class="title-wrapper">
|
|
{{#if editingTopic}}
|
|
{{#if isPrivateMessage}}
|
|
<span class="private-message-glyph">{{fa-icon envelope}}</span>
|
|
{{autofocus-text-field id='edit-title' value=newTitle maxLength=maxTitleLength}}
|
|
{{else}}
|
|
{{autofocus-text-field id='edit-title' value=newTitle maxLength=maxTitleLength}}
|
|
</br>
|
|
{{category-chooser valueAttribute="id" value=newCategoryId source=category_id}}
|
|
{{/if}}
|
|
|
|
<button class='btn btn-primary btn-small no-text' {{action "finishedEditingTopic"}}>{{fa-icon check}}</button>
|
|
<button class='btn btn-small no-text' {{action "cancelEditingTopic"}}>{{fa-icon times}}</button>
|
|
{{else}}
|
|
<h1>
|
|
{{#unless is_warning}}
|
|
<span class="private-message-glyph">{{fa-icon envelope}}</span>
|
|
{{/unless}}
|
|
|
|
{{#if details.loaded}}
|
|
{{topic-status topic=model}}
|
|
<a href='{{unbound url}}' {{action "jumpTop"}}>
|
|
{{#if topicSaving}}
|
|
{{fancy_title}}
|
|
{{else}}
|
|
{{{fancy_title}}}
|
|
{{/if}}
|
|
</a>
|
|
{{/if}}
|
|
|
|
|
|
{{#if details.can_edit}}
|
|
<a href='#' {{action "editTopic"}} class='edit-topic' title='{{i18n edit}}'>{{fa-icon pencil}}</a>
|
|
{{/if}}
|
|
</h1>
|
|
|
|
{{#unless isPrivateMessage}}
|
|
{{#if category.parentCategory}}
|
|
{{bound-category-link category.parentCategory}}
|
|
{{/if}}
|
|
{{bound-category-link category}}
|
|
{{/unless}}
|
|
{{/if}}
|
|
</div>
|
|
{{plugin-outlet "topic-title"}}
|
|
</div>
|
|
</div>
|
|
{{/if}}
|
|
|
|
<div class="container posts">
|
|
|
|
{{view "selected-posts"}}
|
|
|
|
<div class="row">
|
|
<section class="topic-area" id='topic' data-topic-id='{{unbound id}}'>
|
|
<div class='posts-wrapper'>
|
|
|
|
{{render 'topic-progress'}}
|
|
|
|
{{#if postStream.loadingAbove}}
|
|
<div class='spinner'></div>
|
|
{{/if}}
|
|
|
|
{{#unless postStream.loadingFilter}}
|
|
{{cloaked-collection cloakView="post"
|
|
idProperty="post_number"
|
|
defaultHeight="200"
|
|
content=postStream.posts
|
|
slackRatio="15"
|
|
loadingHTML=controller.loadingHTML
|
|
preservesContext="true"
|
|
uncloakDefault="true"
|
|
offsetFixedTop="header"
|
|
offsetFixedBottom="#reply-control"}}
|
|
{{/unless}}
|
|
|
|
{{#if postStream.loadingBelow}}
|
|
<div class='spinner'></div>
|
|
{{/if}}
|
|
</div>
|
|
<div id='topic-bottom'></div>
|
|
|
|
{{#if postStream.loadingFilter}}
|
|
<div class='spinner small'></div>
|
|
{{else}}
|
|
{{#if postStream.loadedAllPosts}}
|
|
|
|
{{view 'topic-closing' topic=model}}
|
|
{{view 'topic-footer-buttons' topic=model}}
|
|
|
|
{{#if details.suggested_topics.length}}
|
|
<div id='suggested-topics'>
|
|
<h3>{{i18n suggested_topics.title}}</h3>
|
|
<div class='topics'>
|
|
{{basic-topic-list topics=details.suggested_topics postsAction="showTopicEntrance"}}
|
|
</div>
|
|
<h3>{{{view.browseMoreMessage}}}</h3>
|
|
</div>
|
|
{{/if}}
|
|
{{/if}}
|
|
{{/if}}
|
|
|
|
</section>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
{{else}}
|
|
{{#if hasError}}
|
|
<div class='container'>
|
|
{{#if notFoundHtml}}
|
|
{{{notFoundHtml}}}
|
|
{{else}}
|
|
<div class="topic-error">
|
|
<div>{{message}}</div>
|
|
{{#if noRetry}}
|
|
{{#unless currentUser}}
|
|
<button {{action "showLogin"}} class='btn btn-primary topic-retry'>{{fa-icon user}} {{i18n log_in}}</button>
|
|
{{/unless}}
|
|
{{else}}
|
|
<button class="btn btn-primary topic-retry" {{action "retryLoading"}}><i class="fa fa-refresh"></i> {{i18n errors.buttons.again}}</button>
|
|
{{/if}}
|
|
</div>
|
|
{{#if retrying}}
|
|
<div class='spinner'></div>
|
|
{{/if}}
|
|
{{/if}}
|
|
</div>
|
|
{{else}}
|
|
<div class='container'>
|
|
<div class='spinner'></div>
|
|
</div>
|
|
{{/if}}
|
|
{{/if}}
|
|
|
|
{{render "share"}}
|
|
|
|
{{#if currentUser.enable_quoting}}
|
|
{{render "quote-button"}}
|
|
{{/if}}
|
|
|
|
{{#if currentUser.canManageTopic}}
|
|
{{show-topic-admin show="showTopicAdminMenu"}}
|
|
{{render "topic-admin-menu"}}
|
|
{{/if}}
|