implemented UI for filtered down by category view
This commit is contained in:
parent
572f036e74
commit
a65407b2cb
|
@ -22,7 +22,7 @@ Discourse.ListController = Discourse.Controller.extend({
|
|||
category: category
|
||||
});
|
||||
}).filter(function(i) {
|
||||
return i !== null && !(category && i.get("name") === "categories");
|
||||
return i !== null && !(category && i.get("name").indexOf("categor") === 0);
|
||||
});
|
||||
}.property("category"),
|
||||
|
||||
|
@ -134,7 +134,11 @@ Discourse.ListController = Discourse.Controller.extend({
|
|||
} else {
|
||||
return false;
|
||||
}
|
||||
}.property('category')
|
||||
}.property('category'),
|
||||
|
||||
categories: function() {
|
||||
return Discourse.Category.list();
|
||||
}.property()
|
||||
|
||||
});
|
||||
|
||||
|
|
|
@ -34,6 +34,13 @@ Discourse.Category = Discourse.Model.extend({
|
|||
return Discourse.getURL("/category/") + (this.get('slug'));
|
||||
}.property('name'),
|
||||
|
||||
unreadUrl: function() {
|
||||
return this.get('url') + '/unread';
|
||||
}.property('url'),
|
||||
|
||||
newUrl: function() {
|
||||
return this.get('url') + '/new';
|
||||
}.property('url'),
|
||||
|
||||
style: function() {
|
||||
return "background-color: #" + (this.get('category.color')) + "; color: #" + (this.get('category.text_color')) + ";";
|
||||
|
|
|
@ -31,11 +31,21 @@ Discourse.NavItem = Discourse.Model.extend({
|
|||
|
||||
// href from this item
|
||||
href: function() {
|
||||
return Discourse.getURL("/") + this.get('filterMode');
|
||||
}.property('filterMode'),
|
||||
|
||||
// href from this item
|
||||
filterMode: function() {
|
||||
var name = this.get('name');
|
||||
if( name.split('/')[0] === 'category' ) {
|
||||
return Discourse.getURL("/") + 'category/' + this.get('categorySlug');
|
||||
return 'category/' + this.get('categorySlug');
|
||||
} else {
|
||||
return Discourse.getURL("/") + name.replace(' ', '-');
|
||||
var mode = "";
|
||||
var category = this.get("category");
|
||||
if(category){
|
||||
mode += "category/" + category.get("slug") + "/";
|
||||
}
|
||||
return mode + name.replace(' ', '-');
|
||||
}
|
||||
}.property('name'),
|
||||
|
||||
|
|
|
@ -146,7 +146,6 @@ Discourse.TopicList.reopenClass({
|
|||
return Ember.RSVP.resolve(list);
|
||||
}
|
||||
session.setProperties({topicList: null, topicListScrollPos: null});
|
||||
|
||||
return Discourse.TopicList.find(filter, menuItem.get('excludeCategory'));
|
||||
}
|
||||
});
|
||||
|
|
|
@ -22,11 +22,14 @@ Discourse.ListCategoryRoute = Discourse.FilteredListRoute.extend({
|
|||
}
|
||||
|
||||
var listController = this.controllerFor('list'),
|
||||
urlId = Discourse.Category.slugFor(category),
|
||||
categorySlug = Discourse.Category.slugFor(category),
|
||||
self = this;
|
||||
|
||||
listController.set('filterMode', "category/" + urlId);
|
||||
listController.load("category/" + urlId).then(function(topicList) {
|
||||
var filter = this.filter || "latest";
|
||||
var url = "category/" + categorySlug + "/" + filter;
|
||||
|
||||
listController.set('filterMode', url);
|
||||
listController.load(url).then(function(topicList) {
|
||||
listController.setProperties({
|
||||
canCreateTopic: topicList.get('can_create_topic'),
|
||||
category: category
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
{{#if category}}
|
||||
{{categoryLink category}}
|
||||
{{else}}
|
||||
<a href="/">{{title}}</a>
|
||||
<a href="/"><i class='icon icon-home'></i></a>
|
||||
{{/if}}
|
||||
|
||||
{{#if categories}}
|
||||
|
|
|
@ -1,5 +1,10 @@
|
|||
<div id='list-controls'>
|
||||
<div class='list-controls'>
|
||||
<div class="container">
|
||||
|
||||
{{#if category}}
|
||||
{{discourse-breadcrumbs category=category categories=categories}}
|
||||
{{/if}}
|
||||
|
||||
<ul class="nav nav-pills" id='category-filter'>
|
||||
{{each availableNavItems itemViewClass="Discourse.NavItemView"}}
|
||||
</ul>
|
||||
|
|
|
@ -41,9 +41,11 @@
|
|||
{{/if}}
|
||||
</td>
|
||||
|
||||
{{#unless controller.category}}
|
||||
<td class='category'>
|
||||
{{categoryLink category}}
|
||||
</td>
|
||||
{{/unless}}
|
||||
|
||||
<td class='posters'>
|
||||
{{#each posters}}
|
||||
|
|
|
@ -10,10 +10,6 @@
|
|||
</button>
|
||||
{{/if}}
|
||||
|
||||
{{#if category}}
|
||||
{{discourse-breadcrumbs title=Discourse.SiteSettings.title category=category categories=categories}}
|
||||
{{/if}}
|
||||
|
||||
<table id='topic-list'>
|
||||
<thead>
|
||||
<tr>
|
||||
|
@ -23,7 +19,9 @@
|
|||
<th class='main-link'>
|
||||
{{i18n topic.title}}
|
||||
</th>
|
||||
{{#unless category}}
|
||||
<th class='category'>{{i18n category_title}}</th>
|
||||
{{/unless}}
|
||||
<th class='posters'>{{i18n top_contributors}}</th>
|
||||
<th class='num posts'>{{i18n posts}}</th>
|
||||
<th class='num likes'>{{i18n likes}}</th>
|
||||
|
|
|
@ -22,10 +22,10 @@
|
|||
{{/if}}
|
||||
{{categoryLink this allowUncategorized=true}}
|
||||
{{#if unreadTopics}}
|
||||
<a href={{unbound url}} class='badge new-posts badge-notification' title='{{i18n topic.unread_topics count="unreadTopics"}}'>{{unbound unreadTopics}}</a>
|
||||
<a href={{unbound unreadUrl}} class='badge new-posts badge-notification' title='{{i18n topic.unread_topics count="unreadTopics"}}'>{{unbound unreadTopics}}</a>
|
||||
{{/if}}
|
||||
{{#if newTopics}}
|
||||
<a href={{unbound url}} class='badge new-posts badge-notification' title='{{i18n topic.new_topics count="newTopics"}}'>{{unbound newTopics}} <i class='icon icon-asterisk'></i></a>
|
||||
<a href={{unbound newUrl}} class='badge new-posts badge-notification' title='{{i18n topic.new_topics count="newTopics"}}'>{{unbound newTopics}} <i class='icon icon-asterisk'></i></a>
|
||||
{{/if}}
|
||||
<div class='featured-users'>
|
||||
{{#each featured_users}}
|
||||
|
|
|
@ -14,7 +14,7 @@ Discourse.NavItemView = Discourse.View.extend({
|
|||
hidden: Em.computed.not('content.visible'),
|
||||
count: Ember.computed.alias('content.count'),
|
||||
shouldRerender: Discourse.View.renderIfChanged('count'),
|
||||
active: Discourse.computed.propertyEqual('contentNameSlug', 'controller.filterMode'),
|
||||
active: Discourse.computed.propertyEqual('content.filterMode', 'controller.filterMode'),
|
||||
|
||||
title: function() {
|
||||
var categoryName, extra, name;
|
||||
|
@ -27,13 +27,6 @@ Discourse.NavItemView = Discourse.View.extend({
|
|||
return I18n.t("filters." + name + ".help", extra);
|
||||
}.property("content.filter"),
|
||||
|
||||
contentNameSlug: function() {
|
||||
return this.get("content.name").toLowerCase().replace(' ','-');
|
||||
}.property('content.name'),
|
||||
|
||||
// active: function() {
|
||||
// return (this.get("contentNameSlug") === this.get("controller.filterMode"));
|
||||
// }.property("contentNameSlug", "controller.filterMode"),
|
||||
|
||||
name: function() {
|
||||
var categoryName, extra, name;
|
||||
|
|
|
@ -8,7 +8,7 @@
|
|||
// List controls
|
||||
// --------------------------------------------------
|
||||
|
||||
#list-controls {
|
||||
.list-controls {
|
||||
.nav {
|
||||
float: left;
|
||||
margin-bottom: 15px;
|
||||
|
@ -349,8 +349,7 @@
|
|||
// Misc. stuff
|
||||
// --------------------------------------------------
|
||||
|
||||
#main {
|
||||
#list-controls {
|
||||
.list-controls {
|
||||
.badge-category {
|
||||
display: inline-block;
|
||||
background-color: yellow;
|
||||
|
@ -358,8 +357,8 @@
|
|||
float: left;
|
||||
}
|
||||
clear: both;
|
||||
}
|
||||
#list-area {
|
||||
}
|
||||
#list-area {
|
||||
margin-bottom: 300px;
|
||||
|
||||
|
||||
|
@ -378,8 +377,8 @@
|
|||
font-size: 13px;
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
#topic-list {
|
||||
}
|
||||
#topic-list {
|
||||
.alert {
|
||||
margin-bottom: 0;
|
||||
font-size: 14px;
|
||||
|
@ -387,8 +386,8 @@
|
|||
.spinner {
|
||||
margin-top: 40px;
|
||||
}
|
||||
}
|
||||
span.posted {
|
||||
}
|
||||
span.posted {
|
||||
display: inline-block;
|
||||
text-indent: -9999em;
|
||||
width: 15px;
|
||||
|
@ -396,5 +395,4 @@
|
|||
background: {
|
||||
image: image-url("posted.png");
|
||||
};
|
||||
}
|
||||
}
|
||||
|
|
|
@ -199,17 +199,20 @@ i {background: #e4f2f8;
|
|||
}
|
||||
|
||||
ol.category-breadcrumb {
|
||||
display: block;
|
||||
float: left;
|
||||
list-style: none;
|
||||
margin: 0 0 10px 0;
|
||||
margin: 0 10px 0 0;
|
||||
padding: 0;
|
||||
|
||||
li {
|
||||
float: left;
|
||||
margin-right: 5px;
|
||||
border: 1px solid transparent;
|
||||
line-height: 31px;
|
||||
|
||||
&.no-category {
|
||||
font-size: 13px;
|
||||
font-size: 22px;
|
||||
|
||||
a {
|
||||
margin-right: 3px;
|
||||
|
@ -243,7 +246,9 @@ ol.category-breadcrumb {
|
|||
.badge-category {
|
||||
margin: 0;
|
||||
display: inline-block;
|
||||
padding: 1px 6px 2px 6px;
|
||||
font-size: 14px;
|
||||
padding: 0px 10px;
|
||||
float: none;
|
||||
}
|
||||
|
||||
button {
|
||||
|
@ -286,6 +291,12 @@ ol.category-breadcrumb {
|
|||
padding: 8px 5px 0 7px;
|
||||
z-index: 100;
|
||||
|
||||
.badge-category {
|
||||
font-size: 13px;
|
||||
line-height: 26px;
|
||||
padding: 0px 8px;
|
||||
}
|
||||
|
||||
div {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
|
|
@ -8,7 +8,7 @@
|
|||
// List controls
|
||||
// --------------------------------------------------
|
||||
|
||||
#list-controls {
|
||||
.list-controls {
|
||||
margin: 5px;
|
||||
.nav {
|
||||
float: left;
|
||||
|
@ -239,8 +239,7 @@
|
|||
// Misc. stuff
|
||||
// --------------------------------------------------
|
||||
|
||||
#main {
|
||||
#list-controls {
|
||||
.list-controls {
|
||||
.badge-category {
|
||||
display: inline-block;
|
||||
background-color: yellow;
|
||||
|
@ -248,8 +247,8 @@
|
|||
float: left;
|
||||
}
|
||||
clear: both;
|
||||
}
|
||||
#list-area {
|
||||
}
|
||||
#list-area {
|
||||
margin-bottom: 300px;
|
||||
.empty-topic-list {
|
||||
padding: 10px;
|
||||
|
@ -262,8 +261,8 @@
|
|||
font-size: 13px;
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
#topic-list {
|
||||
}
|
||||
#topic-list {
|
||||
.alert {
|
||||
margin-bottom: 0;
|
||||
font-size: 14px;
|
||||
|
@ -271,8 +270,8 @@
|
|||
.spinner {
|
||||
margin-top: 40px;
|
||||
}
|
||||
}
|
||||
span.posted {
|
||||
}
|
||||
span.posted {
|
||||
display: inline-block;
|
||||
text-indent: -9999em;
|
||||
width: 15px;
|
||||
|
@ -280,7 +279,6 @@
|
|||
background: {
|
||||
image: image-url("posted.png");
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
@ -364,3 +362,23 @@ clear: both;
|
|||
opacity: 1;
|
||||
}
|
||||
|
||||
|
||||
ol.category-breadcrumb {
|
||||
display: block;
|
||||
margin-top: 5px;
|
||||
float: left;
|
||||
list-style: none;
|
||||
.icon-home {
|
||||
font-size: 20px;
|
||||
}
|
||||
.badge-category {
|
||||
margin: 3px 8px 0;
|
||||
}
|
||||
button {
|
||||
padding: 5px 10px;
|
||||
font-size: 16px;
|
||||
}
|
||||
li {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue