{{#if resultsLoading}}
- {{loading-indicator size="small"}}
+ {{ui/controls/loading-indicator size="small"}}
{{else}}
{{#each discussion in content}}
- {{discussions-list-item discussion=discussion}}
+ {{discussions/discussion-listing discussion=discussion}}
{{/each}}
{{#if moreResults}}
{{#if loadingMore}}
- {{loading-indicator size="small"}}
+ {{ui/controls/loading-indicator size="small"}}
{{else}}
-
+ {{#ui/controls/action-button class="control-loadMore" action="loadMore"}}Load More{{/ui/controls/action-button}}
{{/if}}
{{/if}}
diff --git a/framework/core/ember/app/utils/menu.js b/framework/core/ember/app/utils/menu.js
deleted file mode 100644
index 533eef4da..000000000
--- a/framework/core/ember/app/utils/menu.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import Ember from 'ember';
-
-import NamedContainerView from './named-container-view';
-import MenuItemSeparator from '../components/menu-item-separator';
-
-export default NamedContainerView.extend({
-
- i: 1,
- addSeparator: function(index) {
- var item = MenuItemSeparator;
- this.addItem('separator'+(this.i++), item, index);
- }
-
-});
diff --git a/framework/core/ember/app/utils/named-container-view.js b/framework/core/ember/app/utils/named-container-view.js
deleted file mode 100644
index ca1f7b9b3..000000000
--- a/framework/core/ember/app/utils/named-container-view.js
+++ /dev/null
@@ -1,56 +0,0 @@
-import Ember from 'ember';
-
-export default Ember.ArrayProxy.extend({
-
- content: null,
- namedViews: null,
-
- init: function() {
- this.set('content', Ember.A()); // this is an important line.
- this.set('namedViews', Ember.Object.create());
- this._super();
- },
-
- // Add an item to the container.
- addItem: function(name, viewClass, index) {
- // view = this.createChildView(view);
-
- if (typeof index == 'undefined') {
- index = this.get('length');
- }
- this.replace(index, 0, [viewClass]);
- this.get('namedViews').set(name, viewClass);
- },
-
- // Remove an item from the container.
- removeItem: function(name) {
- this.removeObject(this.get('namedViews').get(name));
- this.get('namedViews').set(name, null);
- },
-
- // Replace an item in the container with another one.
- replaceItem: function(name, viewClass) {
- // view = this.createChildView(view);
-
- var oldView = this.get('namedViews').get(name);
- var index = this.indexOf(oldView);
- this.replace(index, 1, [viewClass])
- this.get('namedViews').set(name, viewClass);
- },
-
- // Move an item in the container to a new position.
- moveItem: function(name, index) {
- var view = this.get('namedViews').get(name);
- this.removeItem(name);
- this.addItem(name, view, index);
- },
-
- firstItem: function() {
- return this.objectAt(0);
- }.property('content.@each'),
-
- getItem: function(name) {
- return this.get('namedViews').get(name);
- }
-
-});
diff --git a/framework/core/ember/app/utils/tagged-array.js b/framework/core/ember/app/utils/tagged-array.js
new file mode 100644
index 000000000..76b253082
--- /dev/null
+++ b/framework/core/ember/app/utils/tagged-array.js
@@ -0,0 +1,57 @@
+import Ember from 'ember';
+
+export default Ember.ArrayProxy.extend({
+ content: null,
+ taggedObjects: null,
+
+ init: function() {
+ this.set('content', []);
+ this.set('taggedObjects', {});
+ this._super();
+ },
+
+ pushObjectWithTag: function(obj, tag) {
+ this.insertAtWithTag(this.get('length'), obj, tag);
+ },
+
+ insertAtWithTag: function(idx, obj, tag) {
+ this.insertAt(idx, obj);
+ this.get('taggedObjects')[tag] = obj;
+ },
+
+ insertAfterTag: function(anchorTag, obj, tag) {
+ var idx = this.indexOfTag(anchorTag);
+ this.insertAtWithTag(idx + 1, obj, newTag);
+ },
+
+ insertBeforeTag: function(anchorTag, obj, tag) {
+ var idx = this.indexOfTag(anchorTag);
+ this.insertAtWithTag(idx - 1, obj, tag);
+ },
+
+ removeByTag: function(tag) {
+ var idx = this.indexOfTag(tag);
+ this.removeAt(idx);
+ delete this.get('taggedObjects')[tag];
+ },
+
+ replaceByTag: function(tag, obj) {
+ var idx = this.indexOfTag(tag);
+ this.removeByTag(tag);
+ this.insertAtWithTag(idx, obj, tag);
+ },
+
+ moveByTag: function(tag, idx) {
+ var obj = this.objectByTag(tag);
+ this.removeByTag(tag);
+ this.insertAtWithTag(idx, obj, tag);
+ },
+
+ indexOfTag: function(tag) {
+ return this.indexOf(this.get('taggedObjects')[tag]);
+ },
+
+ objectByTag: function(tag) {
+ return this.get('taggedObjects')[tag];
+ }
+});
diff --git a/framework/core/ember/app/views/discussion.js b/framework/core/ember/app/views/discussion.js
index 2b5a92e30..dff73d884 100644
--- a/framework/core/ember/app/views/discussion.js
+++ b/framework/core/ember/app/views/discussion.js
@@ -1,16 +1,15 @@
import Ember from 'ember';
-import NamedContainerView from '../utils/named-container-view';
-import Menu from '../utils/menu';
-import MenuItem from '../components/menu-item';
-import DropdownSplit from '../components/dropdown-split';
-import DropdownButton from '../components/dropdown-button';
-import DiscussionScrollbar from '../components/discussion-scrollbar';
+import TaggedArray from '../utils/tagged-array';
+import ActionButton from '../components/ui/controls/action-button';
+import DropdownSplit from '../components/ui/controls/dropdown-split';
+import DropdownButton from '../components/ui/controls/dropdown-button';
+import DiscussionScrollbar from '../components/discussions/stream-scrollbar';
import PostStreamMixin from '../mixins/post-stream';
export default Ember.View.extend(Ember.Evented, PostStreamMixin, {
- sidebar: Ember.ContainerView,
+ sidebarItems: Ember.ContainerView,
// Set up a new menu view that will contain controls to be shown in the
// footer. The template will only render these controls if the last post is
@@ -30,7 +29,7 @@ export default Ember.View.extend(Ember.Evented, PostStreamMixin, {
didInsertElement: function() {
// We've just inserted the discussion view.
- this.trigger('populateSidebar', this.get('sidebar'));
+ // this.trigger('populateSidebar', this.get('sidebar'));
// Whenever the window's scroll position changes, we want to check to
// see if any terminal 'gaps' are in the viewport and trigger their
@@ -60,14 +59,14 @@ export default Ember.View.extend(Ember.Evented, PostStreamMixin, {
},
setupSidebar: function(sidebar) {
- this.set('controls', Menu.create());
- this.trigger('populateControls', this.get('controls'));
- sidebar.pushObject(DropdownSplit.create({
- items: this.get('controls'),
+ var items = TaggedArray.create();
+ this.trigger('populateControls', items);
+ sidebarItems.pushObject(DropdownSplit.create({
+ items: items,
icon: 'reply',
buttonClass: 'btn-primary',
menuClass: 'pull-right'
- }));
+ }), 'controls');
sidebar.pushObject(DropdownButton.create({items: this.get('controls')}));
diff --git a/framework/core/ember/app/views/discussions.js b/framework/core/ember/app/views/discussions.js
index b16e7ed47..30e1e4ec0 100644
--- a/framework/core/ember/app/views/discussions.js
+++ b/framework/core/ember/app/views/discussions.js
@@ -1,13 +1,13 @@
import Ember from 'ember';
-import DropdownSelect from '../components/dropdown-select';
-import ButtonItem from '../components/button-item';
-import NavItem from '../components/nav-item';
-import Menu from '../utils/menu';
+import DropdownSelect from '../components/ui/controls/dropdown-select';
+import ActionButton from '../components/ui/controls/action-button';
+import NavItem from '../components/ui/items/nav-item';
+import TaggedArray from '../utils/tagged-array';
export default Ember.View.extend({
- sidebarView: Ember.ContainerView.extend(),
+ sidebarItems: null,
classNameBindings: ['pinned'],
@@ -17,7 +17,9 @@ export default Ember.View.extend({
didInsertElement: function() {
- this.trigger('populateSidebar', this.get('sidebar'));
+ var sidebarItems = TaggedArray.create();
+ this.trigger('populateSidebar', sidebarItems);
+ this.set('sidebarItems', sidebarItems);
var view = this;
@@ -58,44 +60,37 @@ export default Ember.View.extend({
});
},
- setupSidebar: function(sidebar) {
- sidebar.pushObject(ButtonItem.create({
+ populateSidebarDefault: function(sidebar) {
+ var newDiscussion = ActionButton.create({
title: 'Start a Discussion',
icon: 'edit',
class: 'btn-primary'
- }));
+ })
+ sidebar.pushObjectWithTag(newDiscussion, 'newDiscussion');
- var nav = Menu.create();
+ var nav = TaggedArray.create();
this.trigger('populateNav', nav);
- sidebar.pushObject(DropdownSelect.create({
- items: nav
- }));
+ sidebar.pushObjectWithTag(DropdownSelect.createWithItems(nav), 'nav');
}.on('populateSidebar'),
- setupNav: function(nav) {
- nav.addItem('all', NavItem.create({
+ populateNavDefault: function(nav) {
+ nav.pushObjectWithTag(NavItem.create({
title: 'All Discussions',
icon: 'comments-o',
linkTo: '"discussions" (query-params filter="")'
- }));
+ }), 'all');
- nav.addItem('private', NavItem.create({
+ nav.pushObjectWithTag(NavItem.create({
title: 'Private',
icon: 'envelope-o',
linkTo: '"discussions" (query-params filter="private")'
- }));
+ }), 'private');
- nav.addItem('following', NavItem.create({
+ nav.pushObjectWithTag(NavItem.create({
title: 'Following',
icon: 'star',
linkTo: '"discussions" (query-params filter="following")'
- }));
-
- nav.addItem('categories', NavItem.create({
- title: 'Categories',
- icon: 'reorder',
- linkTo: '"categories"'
- }));
+ }), 'following');
}.on('populateNav'),
willDestroyElement: function() {