mirror of
https://github.com/codeninjasllc/discourse.git
synced 2024-11-23 23:58:31 -05:00
UX: Don't display the timeline on thinner browser widths
This commit is contained in:
parent
288b407bd1
commit
1584033d7a
6 changed files with 47 additions and 22 deletions
|
@ -0,0 +1,26 @@
|
|||
export default Ember.Component.extend({
|
||||
showTimeline: null,
|
||||
|
||||
_checkSize() {
|
||||
const width = $(window).width();
|
||||
this.set('showTimeline', width > 1012);
|
||||
},
|
||||
|
||||
didInsertElement() {
|
||||
this._super();
|
||||
|
||||
if (!this.site.mobileView) {
|
||||
$(window).on('resize.discourse-topic-navigation', () => this._checkSize());
|
||||
this._checkSize();
|
||||
} else {
|
||||
this.set('showTimeline', false);
|
||||
}
|
||||
},
|
||||
|
||||
willDestroyElement() {
|
||||
this._super();
|
||||
if (!this.site.mobileView) {
|
||||
$(window).off('resize.discourse-topic-navigation');
|
||||
}
|
||||
}
|
||||
});
|
|
@ -15,9 +15,9 @@ export default Ember.Component.extend({
|
|||
(this.get('delegated') || []).forEach(m => this.set(m, m));
|
||||
},
|
||||
|
||||
@computed('userWantsToJump')
|
||||
hidden(userWantsToJump) {
|
||||
return !userWantsToJump && !this.site.mobileView;
|
||||
@computed('userWantsToJump', 'showTimeline')
|
||||
hidden(userWantsToJump, showTimeline) {
|
||||
return !userWantsToJump && showTimeline;
|
||||
},
|
||||
|
||||
keyboardTrigger(kbdEvent) {
|
||||
|
|
|
@ -42,16 +42,6 @@ export default Ember.Controller.extend(SelectedPostsCount, BufferedContent, {
|
|||
'replyToPost'
|
||||
],
|
||||
|
||||
@computed
|
||||
showTimeline() {
|
||||
return !this.site.mobileView;
|
||||
},
|
||||
|
||||
@computed('showTimeline')
|
||||
loadingClass(showTimeline) {
|
||||
return showTimeline ? 'timeline-loading' : undefined;
|
||||
},
|
||||
|
||||
_titleChanged: function() {
|
||||
const title = this.get('model.title');
|
||||
if (!Ember.isEmpty(title)) {
|
||||
|
|
|
@ -0,0 +1,6 @@
|
|||
export default Ember.Mixin.create({
|
||||
init() {
|
||||
this._super();
|
||||
(this.get('delegated') || []).forEach(m => this.set(m, m));
|
||||
},
|
||||
});
|
|
@ -0,0 +1 @@
|
|||
{{yield showTimeline}}
|
|
@ -71,16 +71,18 @@
|
|||
<section class="topic-area" id="topic" data-topic-id="{{unbound model.id}}">
|
||||
<div class="posts-wrapper">
|
||||
|
||||
{{#if showTimeline}}
|
||||
{{topic-timeline topic=model
|
||||
enteredIndex=enteredIndex
|
||||
loading=model.postStream.loading
|
||||
delegated=topicDelegated}}
|
||||
{{else}}
|
||||
{{topic-admin-menu-button topic=model fixed="true" delegated=topicDelegated}}
|
||||
{{/if}}
|
||||
{{#topic-navigation as |showTimeline|}}
|
||||
{{#if showTimeline}}
|
||||
{{topic-timeline topic=model
|
||||
enteredIndex=enteredIndex
|
||||
loading=model.postStream.loading
|
||||
delegated=topicDelegated}}
|
||||
{{else}}
|
||||
{{topic-admin-menu-button topic=model fixed="true" delegated=topicDelegated}}
|
||||
{{/if}}
|
||||
|
||||
{{topic-progress topic=model delegated=topicDelegated}}
|
||||
{{topic-progress topic=model delegated=topicDelegated showTimeline=showTimeline}}
|
||||
{{/topic-navigation}}
|
||||
|
||||
{{conditional-loading-spinner condition=model.postStream.loadingAbove}}
|
||||
|
||||
|
|
Loading…
Reference in a new issue