2017-10-30 12:38:01 +03:00
|
|
|
import Service, {inject as service} from '@ember/service';
|
2019-05-20 16:57:21 +03:00
|
|
|
import {get} from '@ember/object';
|
2017-08-02 10:05:59 +03:00
|
|
|
import {not, or, reads} from '@ember/object/computed';
|
2017-08-14 15:30:00 +03:00
|
|
|
|
2019-05-20 17:33:12 +03:00
|
|
|
function collectMetadataClasses(transition, prop) {
|
2019-05-20 16:57:21 +03:00
|
|
|
let oldClasses = [];
|
|
|
|
let newClasses = [];
|
|
|
|
let {from, to} = transition;
|
|
|
|
|
|
|
|
while (from) {
|
2019-05-20 17:33:12 +03:00
|
|
|
oldClasses = oldClasses.concat(get(from, `metadata.${prop}`) || []);
|
2019-05-20 16:57:21 +03:00
|
|
|
from = from.parent;
|
|
|
|
}
|
|
|
|
|
|
|
|
while (to) {
|
2019-05-20 17:33:12 +03:00
|
|
|
newClasses = newClasses.concat(get(to, `metadata.${prop}`) || []);
|
2019-05-20 16:57:21 +03:00
|
|
|
to = to.parent;
|
|
|
|
}
|
|
|
|
|
2019-05-20 17:33:12 +03:00
|
|
|
return {oldClasses, newClasses};
|
|
|
|
}
|
|
|
|
|
|
|
|
function updateBodyClasses(transition) {
|
2019-05-20 16:57:21 +03:00
|
|
|
let {body} = document;
|
2019-05-20 17:33:12 +03:00
|
|
|
let {oldClasses, newClasses} = collectMetadataClasses(transition, 'bodyClasses');
|
|
|
|
|
2019-05-20 16:57:21 +03:00
|
|
|
oldClasses.forEach((oldClass) => {
|
|
|
|
body.classList.remove(oldClass);
|
|
|
|
});
|
|
|
|
newClasses.forEach((newClass) => {
|
|
|
|
body.classList.add(newClass);
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
2017-08-14 15:30:00 +03:00
|
|
|
export default Service.extend({
|
2017-10-30 12:38:01 +03:00
|
|
|
dropdown: service(),
|
|
|
|
mediaQueries: service(),
|
2019-05-20 16:57:21 +03:00
|
|
|
router: service(),
|
2017-08-14 15:30:00 +03:00
|
|
|
|
2017-08-02 10:05:59 +03:00
|
|
|
isFullScreen: false,
|
2017-08-14 15:30:00 +03:00
|
|
|
showMobileMenu: false,
|
|
|
|
showSettingsMenu: false,
|
2019-05-20 17:33:12 +03:00
|
|
|
mainClass: '',
|
2017-08-14 15:30:00 +03:00
|
|
|
|
2017-08-02 10:05:59 +03:00
|
|
|
hasSideNav: not('isSideNavHidden'),
|
|
|
|
isMobile: reads('mediaQueries.isMobile'),
|
2019-01-10 18:00:07 +03:00
|
|
|
isSideNavHidden: or('isFullScreen', 'isMobile'),
|
2017-08-14 15:30:00 +03:00
|
|
|
|
2019-05-20 16:57:21 +03:00
|
|
|
init() {
|
|
|
|
this._super(...arguments);
|
2019-05-20 17:33:12 +03:00
|
|
|
|
2019-05-20 16:57:21 +03:00
|
|
|
this.router.on('routeDidChange', (transition) => {
|
|
|
|
updateBodyClasses(transition);
|
2019-05-20 17:33:12 +03:00
|
|
|
|
|
|
|
let {newClasses: mainClasses} = collectMetadataClasses(transition, 'mainClasses');
|
|
|
|
this.set('mainClass', mainClasses.join(' '));
|
2019-05-20 16:57:21 +03:00
|
|
|
});
|
|
|
|
},
|
|
|
|
|
2017-08-14 15:30:00 +03:00
|
|
|
closeMenus() {
|
2019-03-06 16:53:54 +03:00
|
|
|
this.dropdown.closeDropdowns();
|
2017-08-14 15:30:00 +03:00
|
|
|
this.setProperties({
|
|
|
|
showSettingsMenu: false,
|
|
|
|
showMobileMenu: false
|
|
|
|
});
|
|
|
|
},
|
|
|
|
|
|
|
|
closeMobileMenu() {
|
|
|
|
this.set('showMobileMenu', false);
|
|
|
|
},
|
|
|
|
|
|
|
|
openMobileMenu() {
|
|
|
|
this.set('showMobileMenu', true);
|
|
|
|
},
|
|
|
|
|
|
|
|
openSettingsMenu() {
|
|
|
|
this.set('showSettingsMenu', true);
|
|
|
|
},
|
|
|
|
|
|
|
|
actions: {
|
|
|
|
closeMenus() {
|
|
|
|
this.closeMenus();
|
|
|
|
},
|
|
|
|
|
|
|
|
closeMobileMenu() {
|
|
|
|
this.closeMobileMenu();
|
|
|
|
},
|
|
|
|
|
|
|
|
openMobileMenu() {
|
|
|
|
this.openMobileMenu();
|
|
|
|
},
|
|
|
|
|
|
|
|
openSettingsMenu() {
|
|
|
|
this.openSettingsMenu();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|