diff --git a/assets/javascripts/discourse/components/knowledge-explorer-topic-link.js.es6 b/assets/javascripts/discourse/components/knowledge-explorer-topic-link.js.es6 new file mode 100644 index 0000000..547dd18 --- /dev/null +++ b/assets/javascripts/discourse/components/knowledge-explorer-topic-link.js.es6 @@ -0,0 +1,7 @@ +export default Ember.Component.extend({ + click() { + const topic = this.get("topic"); + + this.set("selectedTopic", topic.id); + } +}); diff --git a/assets/javascripts/discourse/components/knowledge-explorer-topic.js.es6 b/assets/javascripts/discourse/components/knowledge-explorer-topic.js.es6 new file mode 100644 index 0000000..8f9bda0 --- /dev/null +++ b/assets/javascripts/discourse/components/knowledge-explorer-topic.js.es6 @@ -0,0 +1,9 @@ +import { default as computed } from "ember-addons/ember-computed-decorators"; + +export default Ember.Component.extend({ + classNames: "knowledge-explorer-topic", + @computed("topic") + originalPostContent(topic) { + return topic.post_stream.posts[0].cooked; + } +}); diff --git a/assets/javascripts/discourse/controllers/knowledge-explorer.js.es6 b/assets/javascripts/discourse/controllers/knowledge-explorer.js.es6 index ffb46e9..11eb492 100644 --- a/assets/javascripts/discourse/controllers/knowledge-explorer.js.es6 +++ b/assets/javascripts/discourse/controllers/knowledge-explorer.js.es6 @@ -7,7 +7,8 @@ export default Ember.Controller.extend({ application: Ember.inject.controller(), queryParams: { filterCategory: "category", - filterTags: "tags" + filterTags: "tags", + selectedTopic: "topic" }, filterTags: null, filterCategory: null, @@ -15,6 +16,8 @@ export default Ember.Controller.extend({ searchTerm: null, searchResults: null, + selectedTopic: null, + @computed("searchResults") hasSearchResults(results) { return !!results; diff --git a/assets/javascripts/discourse/routes/knowledge-explorer.js.es6 b/assets/javascripts/discourse/routes/knowledge-explorer.js.es6 index 58a5eb5..2523589 100644 --- a/assets/javascripts/discourse/routes/knowledge-explorer.js.es6 +++ b/assets/javascripts/discourse/routes/knowledge-explorer.js.es6 @@ -4,21 +4,34 @@ export default Ember.Route.extend({ queryParams: { filterTags: { refreshModel: true + }, + selectedTopic: { + refreshModel: true } }, model(params) { if (params.filterTags) { const tags = params.filterTags; return ajax(`/knowledge-explorer.json?tags=${tags}`); + } else if (params.selectedTopic) { + return ajax(`/t/${params.selectedTopic}.json`); } else { return ajax("/knowledge-explorer.json"); } }, setupController(controller, model) { - controller.setProperties({ - tags: model.tags, - topics: model.topics - }); + if (model.tags && model.topics) { + controller.setProperties({ + tags: model.tags, + topics: model.topics + }); + } else { + controller.setProperties({ + tags: [], + topics: [], + topic: model + }); + } } }); diff --git a/assets/javascripts/discourse/templates/components/knowledge-explorer-topic-link.hbs b/assets/javascripts/discourse/templates/components/knowledge-explorer-topic-link.hbs new file mode 100644 index 0000000..82d6760 --- /dev/null +++ b/assets/javascripts/discourse/templates/components/knowledge-explorer-topic-link.hbs @@ -0,0 +1 @@ +{{topic.title}} diff --git a/assets/javascripts/discourse/templates/components/knowledge-explorer-topic-list.hbs b/assets/javascripts/discourse/templates/components/knowledge-explorer-topic-list.hbs index ec418ef..40cb789 100644 --- a/assets/javascripts/discourse/templates/components/knowledge-explorer-topic-list.hbs +++ b/assets/javascripts/discourse/templates/components/knowledge-explorer-topic-list.hbs @@ -8,7 +8,7 @@ - {{topic.title}} + {{knowledge-explorer-topic-link topic=topic selectedTopic=selectedTopic}} {{#each topic.tags as |tag|}} diff --git a/assets/javascripts/discourse/templates/components/knowledge-explorer-topic.hbs b/assets/javascripts/discourse/templates/components/knowledge-explorer-topic.hbs new file mode 100644 index 0000000..b80aadf --- /dev/null +++ b/assets/javascripts/discourse/templates/components/knowledge-explorer-topic.hbs @@ -0,0 +1,5 @@ +Return to Knowledge Explorer +
+ {{{originalPostContent}}} +
+View the discussion on this topic diff --git a/assets/javascripts/discourse/templates/knowledge-explorer.hbs b/assets/javascripts/discourse/templates/knowledge-explorer.hbs index e81594f..af39278 100644 --- a/assets/javascripts/discourse/templates/knowledge-explorer.hbs +++ b/assets/javascripts/discourse/templates/knowledge-explorer.hbs @@ -1,23 +1,27 @@
- -
- {{knowledge-explorer-tag-list - tags=tags - filterTags=filterTags - }} -
- {{#if hasSearchResults}} - {{#if emptySearchResults}} -
{{i18n 'search.no_results'}}
- {{else}} -
{{i18n 'knowledge_explorer.search.results' count=searchCount}}
- {{knowledge-explorer-topic-list topics=searchResults}} - {{/if}} - {{else}} - {{knowledge-explorer-topic-list topics=topics}} - {{/if}} + {{#if selectedTopic}} + {{knowledge-explorer-topic topic=topic}} + {{else}} + -
+
+ {{knowledge-explorer-tag-list + tags=tags + filterTags=filterTags + }} +
+ {{#if hasSearchResults}} + {{#if emptySearchResults}} +
{{i18n 'search.no_results'}}
+ {{else}} +
{{i18n 'knowledge_explorer.search.results' count=searchCount}}
+ {{knowledge-explorer-topic-list topics=searchResults selectedTopic=selectedTopic}} + {{/if}} + {{else}} + {{knowledge-explorer-topic-list topics=topics selectedTopic=selectedTopic}} + {{/if}} +
+
+ {{/if}}
diff --git a/assets/stylesheets/common/knowledge-explorer.scss b/assets/stylesheets/common/knowledge-explorer.scss index 9911627..ae97ef1 100644 --- a/assets/stylesheets/common/knowledge-explorer.scss +++ b/assets/stylesheets/common/knowledge-explorer.scss @@ -1,4 +1,27 @@ .knowledge-explorer { + .knowledge-explorer-topic { + width: 80%; + margin: 0 auto; + .knowledge-explorer-nav-link { + font-weight: bold; + &.return { + font-size: .8em; + &::before { + content: "«"; + margin-right: 3px; + } + } + &.more { + float: right; + font-size: 1.2em; + padding: 10px 0; + &::after { + content: "»"; + margin-left: 3px; + } + } + } + } .knowledge-explorer-search { align-items: center; background-color: $primary-very-low; @@ -65,6 +88,10 @@ } .knowledge-explorer-topic-list { flex-basis: 100%; + .knowledge-explorer-topic-link { + color: $tertiary; + cursor: pointer; + } .discourse-tag { padding-right: 5px; } diff --git a/assets/stylesheets/mobile/knowledge-explorer.scss b/assets/stylesheets/mobile/knowledge-explorer.scss index ea7ba9c..0845d14 100644 --- a/assets/stylesheets/mobile/knowledge-explorer.scss +++ b/assets/stylesheets/mobile/knowledge-explorer.scss @@ -1,5 +1,9 @@ .mobile-view { .knowledge-explorer { + .knowledge-explorer-topic { + width: calc(100vw - 35px); + margin: 10px 0; + } .knowledge-explorer-search { font-size: $font-up-2; padding: .5em 0;