mirror of
https://github.com/codeninjasllc/discourse.git
synced 2024-11-27 17:46:05 -05:00
Moved more into components, including summary stuff.
This commit is contained in:
Robin Ward
parent
52048d2d2b
commit
f2659a5916
16 changed files with 163 additions and 167 deletions
|
|
@ -1,3 +1,11 @@
|
|||
/**
|
||||
The controls at the top of a private message in the map area.
|
||||
|
||||
@class DiscoursePrivateMessageMapComponent
|
||||
@extends Ember.Component
|
||||
@namespace Discourse
|
||||
@module Discourse
|
||||
**/
|
||||
Discourse.DiscoursePrivateMessageMapComponent = Ember.Component.extend({
|
||||
templateName: 'components/discourse-private-message-map',
|
||||
tagName: 'section',
|
||||
|
|
|
|||
|
|
@ -1,3 +1,11 @@
|
|||
/**
|
||||
The controls for toggling the summarized view on/off
|
||||
|
||||
@class DiscourseToggleBestOfComponent
|
||||
@extends Ember.Component
|
||||
@namespace Discourse
|
||||
@module Discourse
|
||||
**/
|
||||
Discourse.DiscourseToggleBestOfComponent = Ember.Component.extend({
|
||||
templateName: 'components/discourse-toggle-best-of',
|
||||
tagName: 'section',
|
||||
|
|
|
|||
|
|
@ -0,0 +1,45 @@
|
|||
/**
|
||||
The information that sits in the topic map.
|
||||
|
||||
@class DiscourseTopicInformationComponent
|
||||
@extends Ember.Component
|
||||
@namespace Discourse
|
||||
@module Discourse
|
||||
**/
|
||||
|
||||
var LINKS_SHOWN = 5;
|
||||
|
||||
Discourse.DiscourseTopicInformationComponent = Ember.Component.extend({
|
||||
mapCollapsed: true,
|
||||
templateName: 'components/discourse-topic-information',
|
||||
details: Em.computed.alias('topic.details'),
|
||||
allLinksShown: false,
|
||||
|
||||
toggleMapClass: function() {
|
||||
return this.get('mapCollapsed') ? 'icon-chevron-down' : 'icon-chevron-up';
|
||||
}.property('mapCollapsed'),
|
||||
|
||||
showAllLinksControls: function() {
|
||||
if (this.get('allLinksShown')) return false;
|
||||
if ((this.get('details.links.length') || 0) <= LINKS_SHOWN) return false;
|
||||
return true;
|
||||
}.property('allLinksShown', 'topic.details.links'),
|
||||
|
||||
infoLinks: function() {
|
||||
if (Em.isNone('details.links')) return [];
|
||||
|
||||
var allLinks = this.get('details.links');
|
||||
if (this.get('allLinksShown')) return allLinks;
|
||||
return allLinks.slice(0, LINKS_SHOWN);
|
||||
}.property('details.links', 'allLinksShown'),
|
||||
|
||||
actions: {
|
||||
toggleMap: function() {
|
||||
this.toggleProperty('mapCollapsed');
|
||||
},
|
||||
|
||||
showAllLinks: function() {
|
||||
this.set('allLinksShown', true);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
Discourse.DiscourseTopicParticipantComponent = Ember.Component.extend({
|
||||
|
||||
postStream: Em.computed.alias('participant.topic.postStream'),
|
||||
|
||||
toggled: function() {
|
||||
return this.get('postStream.userFilters').contains(this.get('participant.username'));
|
||||
}.property('postStream.userFilters.[]'),
|
||||
|
||||
actions: {
|
||||
toggle: function() {
|
||||
var postStream = this.get('postStream');
|
||||
if (postStream) {
|
||||
postStream.toggleParticipant(this.get('participant.username'));
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
@ -8,7 +8,6 @@
|
|||
**/
|
||||
Discourse.TopicController = Discourse.ObjectController.extend(Discourse.SelectedPostsCount, {
|
||||
multiSelect: false,
|
||||
summaryCollapsed: true,
|
||||
needs: ['header', 'modal', 'composer', 'quoteButton'],
|
||||
allPostsSelected: false,
|
||||
editingTopic: false,
|
||||
|
|
@ -30,10 +29,6 @@ Discourse.TopicController = Discourse.ObjectController.extend(Discourse.Selected
|
|||
Discourse.URL.routeTo(this.get('lastPostUrl'));
|
||||
},
|
||||
|
||||
toggleSummary: function() {
|
||||
this.toggleProperty('summaryCollapsed');
|
||||
},
|
||||
|
||||
selectAll: function() {
|
||||
var posts = this.get('postStream.posts');
|
||||
var selectedPosts = this.get('selectedPosts');
|
||||
|
|
|
|||
|
|
@ -23,6 +23,14 @@ Discourse.TopicDetails = Discourse.Model.extend({
|
|||
});
|
||||
}
|
||||
|
||||
if (details.participants) {
|
||||
var topic = this.get('topic');
|
||||
details.participants = details.participants.map(function (p) {
|
||||
p.topic = topic;
|
||||
return Em.Object.create(p);
|
||||
});
|
||||
}
|
||||
|
||||
this.setProperties(details);
|
||||
this.set('loaded', true);
|
||||
},
|
||||
|
|
|
|||
|
|
@ -0,0 +1,68 @@
|
|||
<nav class='buttons'>
|
||||
<button class='btn' {{action toggleMap}} title="{{i18n topic.toggle_information}}">
|
||||
<i {{bindAttr class=":icon toggleMapClass"}}></i>
|
||||
</button>
|
||||
</nav>
|
||||
|
||||
<section class='map collapsed'>
|
||||
<ul class="clearfix">
|
||||
<li>
|
||||
<a href='{{unbound topic.url}}'>
|
||||
<h4>{{i18n created}}</h4>
|
||||
{{avatar details.created_by imageSize="tiny"}}
|
||||
{{date topic.created_at}}
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a {{bindAttr href="topic.lastPostUrl"}}>
|
||||
<h4>{{i18n last_post}}</h4>
|
||||
{{avatar details.last_poster imageSize="tiny"}}
|
||||
{{date topic.last_posted_at}}
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<h4>{{i18n posts}}</h4>
|
||||
{{number topic.posts_count}}
|
||||
</li>
|
||||
<li>
|
||||
<h4>{{i18n views}}</h4>
|
||||
{{number topic.views}}
|
||||
</li>
|
||||
<li>
|
||||
<h4>{{i18n links}}</h4>
|
||||
{{number details.links.length}}
|
||||
</li>
|
||||
<li {{bindAttr class=":avatars mapCollapsed::hidden"}}>
|
||||
{{#groupedEach participant in details.fewParticipants}}{{discourse-topic-participant participant=participant}}{{/groupedEach}}
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
{{#unless mapCollapsed}}
|
||||
<section class='avatars clearfix'>
|
||||
{{#groupedEach participant in details.participants}}{{discourse-topic-participant participant=participant}}{{/groupedEach}}
|
||||
</section>
|
||||
|
||||
{{#if infoLinks}}
|
||||
<section class='links'>
|
||||
<ul class='topic-links'>
|
||||
{{#groupedEach infoLinks}}
|
||||
<li>
|
||||
<span class='badge badge-notification clicks' title='{{i18n topic_map.clicks}}'>{{clicks}}</span>
|
||||
<a href="{{unbound url}}" target="_blank" class='topic-link track-link' data-user-id="{{unbound user_id}}" data-ignore-post-id="true" title="{{unbound url}}">
|
||||
{{#if title}}{{shorten title}}{{else}}{{shortenUrl url}}{{/if}}
|
||||
{{#if internal}}<i class='icon-arrow-right' title='{{i18n topic_map.topic_link}}'></i>{{/if}}
|
||||
</a>
|
||||
</li>
|
||||
{{/groupedEach}}
|
||||
</ul>
|
||||
|
||||
{{#if showAllLinksControls}}
|
||||
<div class='link-summary'>
|
||||
<a href='#' {{action showAllLinks}}>{{i18n topic_map.links_shown totalLinks="details.links.length"}}</a>
|
||||
</div>
|
||||
{{/if}}
|
||||
|
||||
</section>
|
||||
{{/if}}
|
||||
{{/unless}}
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
<a href='#' {{bindAttr class=":poster toggled"}} {{action toggle}} title="{{unbound participant.username}}">
|
||||
<span class='post-count'>{{unbound participant.post_count}}</span>
|
||||
{{avatar participant imageSize="medium"}}
|
||||
</a>
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
<a href='#' {{bindAttr class=":poster view.toggled:toggled"}} {{action toggleParticipant this}} title="{{unbound username}}">
|
||||
<span class='post-count'>{{unbound post_count}}</span>
|
||||
{{avatar this imageSize="medium"}}
|
||||
</a>
|
||||
|
|
@ -1,105 +0,0 @@
|
|||
<nav class='buttons'>
|
||||
{{#if summaryCollapsed}}
|
||||
<button class='btn collapsed' {{action toggleSummary}} title="{{i18n topic.toggle_information}}">
|
||||
<i class='icon icon-chevron-down'></i>
|
||||
</button>
|
||||
{{else}}
|
||||
<button class='btn' {{action toggleSummary}} title="{{i18n topic.toggle_information}}">
|
||||
<i class='icon icon-chevron-up'></i>
|
||||
</button>
|
||||
{{/if}}
|
||||
</nav>
|
||||
|
||||
{{#if summaryCollapsed}}
|
||||
<section class='summary collapsed'>
|
||||
<ul class="clearfix">
|
||||
<li>
|
||||
<a {{bindAttr href="url"}}>
|
||||
<h4>{{i18n created}}</h4>
|
||||
{{avatar details.created_by imageSize="tiny"}}
|
||||
{{date created_at}}
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a {{bindAttr href="lastPostUrl"}}>
|
||||
<h4>{{i18n last_post}}</h4>
|
||||
{{avatar details.last_poster imageSize="tiny"}}
|
||||
{{date last_posted_at}}
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<h4>{{i18n posts}}</h4>
|
||||
{{number posts_count}}
|
||||
</li>
|
||||
<li>
|
||||
<h4>{{i18n views}}</h4>
|
||||
{{number views}}
|
||||
</li>
|
||||
<li>
|
||||
<h4>{{i18n links}}</h4>
|
||||
{{number details.links.length}}
|
||||
</li>
|
||||
{{#if details.fewParticipants}}
|
||||
<li class='avatars'>
|
||||
{{#groupedEach details.fewParticipants}}{{participant participant=this}}{{/groupedEach}}
|
||||
</li>
|
||||
{{/if}}
|
||||
</ul>
|
||||
</section>
|
||||
{{else}}
|
||||
|
||||
<section class='summary'>
|
||||
<ul class="clearfix">
|
||||
<li>
|
||||
<h4>{{i18n created}}</h4>
|
||||
{{avatar details.created_by imageSize="tiny"}}
|
||||
<a {{bindAttr href="url"}}>{{date created_at}}</a>
|
||||
</li>
|
||||
<li>
|
||||
<h4>{{i18n last_post}}</h4>
|
||||
{{avatar details.last_poster imageSize="tiny"}}
|
||||
<a {{bindAttr href="lastPostUrl"}}>{{date last_posted_at}}</a>
|
||||
</li>
|
||||
<li>
|
||||
<h4>{{i18n posts}}</h4>
|
||||
{{number posts_count}}
|
||||
</li>
|
||||
<li>
|
||||
<h4>{{i18n views}}</h4>
|
||||
{{number views}}
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
{{#if details.participants}}
|
||||
<section class='avatars clearfix'>
|
||||
{{#groupedEach details.participants}}{{participant participant=this}}{{/groupedEach}}
|
||||
</section>
|
||||
{{/if}}
|
||||
|
||||
{{#if view.parentView.infoLinks}}
|
||||
<section class='links'>
|
||||
<ul class='topic-links'>
|
||||
{{#groupedEach view.parentView.infoLinks}}
|
||||
<li>
|
||||
<span class='badge badge-notification clicks' title='{{i18n topic_map.clicks}}'>{{clicks}}</span>
|
||||
<a href="{{unbound url}}" target="_blank" class='topic-link track-link' data-user-id="{{unbound user_id}}" data-ignore-post-id="true" title="{{unbound url}}">
|
||||
{{#if title}}{{shorten title}}{{else}}{{shortenUrl url}}{{/if}}
|
||||
{{#if internal}}<i class='icon-arrow-right' title='{{i18n topic_map.topic_link}}'></i>{{/if}}
|
||||
</a>
|
||||
</li>
|
||||
{{/groupedEach}}
|
||||
</ul>
|
||||
|
||||
{{#if view.parentView.showAllLinksControls}}
|
||||
<div class='link-summary'>
|
||||
<a href='#' {{action showAllLinks target="view.parentView"}}>{{i18n topic_map.links_shown totalLinks="details.links.length"}}</a>
|
||||
</div>
|
||||
{{/if}}
|
||||
|
||||
</section>
|
||||
{{/if}}
|
||||
|
||||
|
||||
|
||||
{{/if}}
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
/**
|
||||
This view renders a participant in a topic
|
||||
|
||||
@class ParticipantView
|
||||
@extends Discourse.View
|
||||
@namespace Discourse
|
||||
@module Discourse
|
||||
**/
|
||||
Discourse.ParticipantView = Discourse.View.extend({
|
||||
templateName: 'participant',
|
||||
|
||||
toggled: function() {
|
||||
return this.get('controller.postStream.userFilters').contains(this.get('participant.username'));
|
||||
}.property('controller.postStream.userFilters.[]')
|
||||
|
||||
});
|
||||
|
||||
|
||||
Discourse.View.registerHelper('participant', Discourse.ParticipantView);
|
||||
|
|
@ -6,27 +6,8 @@
|
|||
@namespace Discourse
|
||||
@module Discourse
|
||||
**/
|
||||
|
||||
var LINKS_SHOWN = 5;
|
||||
|
||||
Discourse.TopicMapView = Discourse.ContainerView.extend({
|
||||
classNameBindings: ['hidden', ':topic-map'],
|
||||
allLinksShown: false,
|
||||
|
||||
showAllLinksControls: function() {
|
||||
if (this.get('allLinksShown')) return false;
|
||||
if ((this.get('topic.details.links.length') || 0) <= LINKS_SHOWN) return false;
|
||||
return true;
|
||||
}.property('allLinksShown', 'topic.details.links'),
|
||||
|
||||
infoLinks: function() {
|
||||
if (this.blank('topic.details.links')) return [];
|
||||
|
||||
var allLinks = this.get('topic.details.links');
|
||||
if (this.get('allLinksShown')) return allLinks;
|
||||
return allLinks.slice(0, LINKS_SHOWN);
|
||||
}.property('topic.details.links', 'allLinksShown'),
|
||||
|
||||
shouldRerender: Discourse.View.renderIfChanged('topic.posts_count'),
|
||||
|
||||
hidden: function() {
|
||||
|
|
@ -42,20 +23,10 @@ Discourse.TopicMapView = Discourse.ContainerView.extend({
|
|||
this._super();
|
||||
if (this.get('hidden')) return;
|
||||
|
||||
this.attachViewWithArgs({
|
||||
templateName: 'topic_map/info',
|
||||
content: this.get('controller')
|
||||
}, Discourse.GroupedView);
|
||||
|
||||
this.attachViewWithArgs({ topic: this.get('topic') }, Discourse.DiscourseTopicInformationComponent);
|
||||
this.trigger('appendMapInformation', this);
|
||||
},
|
||||
|
||||
actions: {
|
||||
showAllLinks: function() {
|
||||
this.set('allLinksShown', true);
|
||||
},
|
||||
},
|
||||
|
||||
appendMapInformation: function(container) {
|
||||
var topic = this.get('topic');
|
||||
|
||||
|
|
|
|||
|
|
@ -267,7 +267,7 @@ a.star {
|
|||
margin-right: 4px;
|
||||
}
|
||||
|
||||
.summary {
|
||||
.map {
|
||||
&.collapsed {
|
||||
}
|
||||
li {
|
||||
|
|
|
|||
|
|
@ -64,7 +64,7 @@
|
|||
margin: 20px 0 10px 0;
|
||||
}
|
||||
|
||||
.summary {
|
||||
.map {
|
||||
height: 50px;
|
||||
}
|
||||
.avatar {
|
||||
|
|
|
|||
|
|
@ -186,7 +186,7 @@ a.star {
|
|||
margin-right: 4px;
|
||||
}
|
||||
|
||||
.summary {
|
||||
.map {
|
||||
&.collapsed {
|
||||
}
|
||||
li {
|
||||
|
|
|
|||
|
|
@ -61,7 +61,7 @@
|
|||
border-left: 0;
|
||||
border-right: 0;
|
||||
}
|
||||
.summary {
|
||||
.map {
|
||||
height: 50px;
|
||||
}
|
||||
.avatar {
|
||||
|
|
|
|||
Loading…
Reference in a new issue