Forked from courajs/components.hider-component.js
Last active
April 18, 2017 14:21
-
-
Save fayimora/a2271ad0b394cc301b07226776104ea1 to your computer and use it in GitHub Desktop.
Conditionally rendered components
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import Ember from 'ember'; | |
import through from '../indirect'; | |
// Inlined, since no addons in twiddles. Really use this: | |
// import through from 'ember-computed-indirect/utils/indirect'; | |
export default Ember.Component.extend({ | |
user: Ember.inject.service('user-permissions'), | |
flagName: '', // specify in extending component | |
flagPath: Ember.computed('flagName', function() { | |
return 'user.permissions.' + this.get('flagName'); | |
}), | |
flagStatus: through('flagPath'), | |
isVisible: Ember.computed.readOnly('flagStatus') | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import Ember from 'ember'; | |
import HiderComponent from './hider-component'; | |
export default HiderComponent.extend({ | |
flagName: 'analytics' | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import Ember from 'ember'; | |
export default Ember.Controller.extend({ | |
user: Ember.inject.service('user-permissions'), | |
appName: 'Ember Twiddle', | |
actions: { | |
toggleVisibility() { | |
this.toggleProperty('user.permissions.analytics'); | |
} | |
} | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import Ember from 'ember'; | |
var get = Ember.get; | |
var set = Ember.set; | |
export default function indirect(pathProperty) { | |
return Ember.computed(pathProperty, { | |
get: function getIndirectPropertyValue(key) { | |
var metaSourceKey = 'source.' + key; | |
var metaObserverKey = 'observer.' + key; | |
// Use a Ember.meta instead of storing meta info on the object itself | |
var _meta = Ember.meta(this, true); | |
_meta = _meta.__indirect__ || (_meta.__indirect__ = {}); | |
var metaObserver = _meta[metaObserverKey]; | |
if (!metaObserver) { | |
_meta[metaObserverKey] = metaObserver = function() { | |
this.notifyPropertyChange(key); | |
}; | |
} | |
var currentKey = get(this, pathProperty); | |
if (currentKey !== _meta[metaSourceKey]) { | |
if (_meta[metaSourceKey]) { | |
Ember.removeObserver(this, _meta[metaSourceKey], this, metaObserver); | |
} | |
if (currentKey) { | |
Ember.addObserver(this, currentKey, this, metaObserver); | |
} | |
_meta[metaSourceKey] = currentKey; | |
} | |
return currentKey && get(this, currentKey); | |
}, | |
set: function setIndirectPropertyValue(key, value) { | |
return set(this, get(this, pathProperty), value); | |
} | |
}); | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import Ember from 'ember'; | |
export default Ember.Service.extend({ | |
permissions: { | |
'analytics': true | |
} | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"version": "0.12.1", | |
"EmberENV": { | |
"FEATURES": {} | |
}, | |
"options": { | |
"use_pods": false, | |
"enable-testing": false | |
}, | |
"dependencies": { | |
"jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.js", | |
"ember": "2.12.0", | |
"ember-template-compiler": "2.12.0", | |
"ember-testing": "2.12.0" | |
}, | |
"addons": { | |
"ember-data": "2.12.1" | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment