UX: Improve the interface for selecting a subcategory in a dropdown

This commit is contained in:
Robin Ward 2014-07-17 15:51:00 -04:00
parent 98907c0e81
commit 38619b5a31
2 changed files with 38 additions and 13 deletions

View file

@ -22,10 +22,38 @@ Discourse.Site = Discourse.Model.extend({
return postActionTypes.filterProperty('is_flag', true);
}.property('post_action_types.@each'),
sortedCategories: Em.computed.sort('categories', function(a, b) {
categoriesByCount: Em.computed.sort('categories', function(a, b) {
return (b.get('topic_count') || 0) - (a.get('topic_count') || 0);
}),
// Sort subcategories under parents
sortedCategories: function() {
var cats = this.get('categoriesByCount'),
result = [],
remaining = {};
cats.forEach(function(c) {
var parentCategoryId = parseInt(c.get('parent_category_id'), 10);
if (!parentCategoryId) {
result.pushObject(c);
} else {
remaining[parentCategoryId] = remaining[parentCategoryId] || [];
remaining[parentCategoryId].pushObject(c);
}
});
Ember.keys(remaining).forEach(function(parentCategoryId) {
var category = result.findBy('id', parseInt(parentCategoryId, 10)),
index = result.indexOf(category);
if (index !== -1) {
result.replace(index+1, 0, remaining[parentCategoryId]);
}
});
return result;
}.property(),
postActionTypeById: function(id) {
return this.get("postActionByIdLookup.action" + id);
},

View file

@ -1,13 +1,7 @@
/**
This view handles rendering of a combobox that can view a category
@class CategoryChooserView
@extends Discourse.ComboboxView
@namespace Discourse
@module Discourse
**/
import ComboboxView from 'discourse/views/combo-box';
var badgeHtml = Discourse.HTML.categoryBadge;
export default ComboboxView.extend({
classNames: ['combobox category-combobox'],
overrideWidths: true,
@ -19,12 +13,11 @@ export default ComboboxView.extend({
return c.get('permission') === Discourse.PermissionType.FULL && c.get('id') !== uncategorized_id;
}),
init: function() {
this._super();
_setCategories: function() {
if (!this.get('categories')) {
this.set('categories', Discourse.Category.list());
}
},
}.on('init'),
none: function() {
if (Discourse.User.currentProp('staff') || Discourse.SiteSettings.allow_uncategorized_topics) {
@ -42,7 +35,11 @@ export default ComboboxView.extend({
var category = Discourse.Category.findById(parseInt(item.id,10));
if (!category) return item.text;
var result = Discourse.HTML.categoryBadge(category, {showParent: true, link: false, allowUncategorized: true});
var result = badgeHtml(category, {showParent: false, link: false, allowUncategorized: true}),
parentCategoryId = category.get('parent_category_id');
if (parentCategoryId) {
result = badgeHtml(Discourse.Category.findById(parentCategoryId), {link: false}) + " " + result;
}
result += " <span class='topic-count'>&times; " + category.get('topic_count') + "</span>";