IntenseWebs/discourse
3
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-02-25 18:55:32 -06:00
Code Issues Packages Projects Releases Wiki Activity

UX: Hide close mobile navigation on click.

Browse Source
This commit is contained in:
Guo Xiang Tan 2016-02-19 15:22:41 +08:00
parent f18f6dc31f
commit 7a261e5e4f
1 changed files with 21 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
app/assets/javascripts/discourse/components/mobile-nav.js.es6
View File

@ -1,6 +1,9 @@
import { on, observes } from 'ember-addons/ember-computed-decorators';
export default Ember.Component.extend({ export default Ember.Component.extend({
_init: function(){ @on('init')
_init() {
if (!this.get('site.mobileView')) { if (!this.get('site.mobileView')) {
var classes = this.get('desktopClass'); var classes = this.get('desktopClass');
if (classes) { if (classes) {
@ -8,16 +11,17 @@ export default Ember.Component.extend({
this.set('classNames', classes); this.set('classNames', classes);
} }
} }
}.on('init'), },
tagName: 'ul', tagName: 'ul',
classNames: ['mobile-nav'], classNames: ['mobile-nav'],
currentPathChanged: function(){ @observes('currentPath')
currentPathChanged() {
this.set('expanded', false); this.set('expanded', false);
Em.run.next(() => this._updateSelectedHtml()); Em.run.next(() => this._updateSelectedHtml());
}.observes('currentPath'), },
_updateSelectedHtml(){ _updateSelectedHtml(){
const active = this.$('.active'); const active = this.$('.active');
@ -26,10 +30,22 @@ export default Ember.Component.extend({
} }
}, },
didInsertElement(){ didInsertElement() {
this._updateSelectedHtml(); this._updateSelectedHtml();
}, },
@on('didInsertElement')
_bindClick() {
this.$().on("click.mobile-nav", 'ul li', () => {
this.set('expanded', false);
});
},
@on('willDestroyElement')
_unbindClick() {
this.$().off("click.mobile-nav", 'ul li');
},
actions: { actions: {
toggleExpanded(){ toggleExpanded(){
this.toggleProperty('expanded'); this.toggleProperty('expanded');