github.com/DerekStrickland/consul@v1.4.5/ui-v2/app/components/app-view.js (about) 1 import Component from '@ember/component'; 2 import SlotsMixin from 'block-slots'; 3 import { get } from '@ember/object'; 4 import templatize from 'consul-ui/utils/templatize'; 5 const $html = document.documentElement; 6 export default Component.extend(SlotsMixin, { 7 loading: false, 8 authorized: true, 9 enabled: true, 10 classNames: ['app-view'], 11 classNameBindings: ['enabled::disabled', 'authorized::unauthorized'], 12 didReceiveAttrs: function() { 13 // right now only manually added classes are hoisted to <html> 14 let cls = get(this, 'class') || ''; 15 if (get(this, 'loading')) { 16 cls += ' loading'; 17 } else { 18 $html.classList.remove(...templatize(['loading'])); 19 } 20 if (cls) { 21 // its possible for 'layout' templates to change after insert 22 // check for these specific layouts and clear them out 23 [...$html.classList].forEach(function(item, i) { 24 if (templatize(['edit', 'show', 'list']).indexOf(item) !== -1) { 25 $html.classList.remove(item); 26 } 27 }); 28 $html.classList.add(...templatize(cls.split(' '))); 29 } 30 }, 31 didInsertElement: function() { 32 this.didReceiveAttrs(); 33 }, 34 didDestroyElement: function() { 35 const cls = get(this, 'class') + ' loading'; 36 if (cls) { 37 $html.classList.remove(...templatize(cls.split(' '))); 38 } 39 }, 40 });