framework/ember/app/templates/index.hbs
Toby Zerner c28307903b Upgrade to Ember 1.11-beta.1
HTMLBars goodness! Since there was some breakage and a lot of fiddling
around to get some things working, I took this opportunity to do a big
cleanup of the whole Ember app. I accidentally worked on some new
features too :3

Note that the app is still broken right now, pending on
https://github.com/emberjs/ember.js/issues/10401

Cleanup:
- Restructuring of components
- Consolidation of some stuff into mixins, cleanup of some APIs that
will be public
- Change all instances of .property() / .observes() / .on() to
Ember.computed() / Ember.observer() / Ember.on() respectively (I think
it is more readable)
- More comments
- Start conforming to a code style (2 spaces for indentation)

New features:
- Post hiding/restoring
- Mark individual discussions as read by clicking
- Clicking on a read discussion jumps to the end
- Mark all discussions as read
- Progressively mark the discussion as read as the page is scrolled
- Unordered list post formatting
- Post permalink popup

Demo once that Ember regression is fixed!
2015-02-10 18:05:40 +10:30

60 lines
1.8 KiB
Handlebars

<div {{bind-attr class=":index-area paned paneIsShowing:showing"}}>
{{#if view.hero}}
{{view view.hero}}
{{/if}}
<div class="container">
<nav class="index-nav">
{{ui/item-list items=view.sidebar}}
</nav>
<div class="index-results">
<div class="index-toolbar">
<div class="index-toolbar-view">
<span class="btn-group control-show">
{{#link-to (query-params show="discussions") class="btn btn-default btn-icon"}}{{fa-icon "bars"}}{{/link-to}}
{{#link-to (query-params show="posts") class="btn btn-default btn-icon"}}{{fa-icon "square-o"}}{{/link-to}}
</span>
{{ui/select-input class="control-sort" content=index.sortOptions optionValuePath="content.key" optionLabelPath="content.label" value=index.sort}}
</div>
<div class="index-toolbar-action">
{{ui/action-button class="control-markAllAsRead btn btn-default btn-icon" icon="check" title="Mark All as Read" action="markAllAsRead"}}
</div>
</div>
<ul class="discussions-list">
{{#each discussion in index.model}}
{{index/discussion-listing
discussion=discussion
searchQuery=index.searchQuery
terminalPostType=index.terminalPostType
countType=index.countType}}
{{/each}}
</ul>
{{#if index.resultsLoading}}
{{ui/loading-indicator size="small"}}
{{/if}}
{{#if index.moreResults}}
{{#unless index.resultsLoading}}
<div class="load-more">
{{ui/action-button class="control-loadMore btn btn-default" action="loadMore" label="Load More"}}
</div>
{{/unless}}
{{/if}}
</div>
</div>
</div>
<div class="discussion-area">
{{outlet}}
</div>