Permalink
Browse files

feat(toggle directives): allow simple elements to use directive (#651)

* [Toggle directive] allow simple elements to use directive
* [Modal directive] modified according to _target helper changes
* [Toggle directive] Some more refactoring
  • Loading branch information...
mosinve committed Jul 6, 2017
1 parent e13e093 commit 3361911a5d3cb7bf427d9f010359210a23e32168
Showing with 17 additions and 19 deletions.
  1. +4 −10 lib/directives/_target.js
  2. +4 −3 lib/directives/modal.js
  3. +9 −6 lib/directives/toggle.js
@@ -1,12 +1,6 @@
const all_listen_types = {hover: true, click: true, focus: true};
export default function targets(el, binding, listen_types, fn) {
const vm = el.__vue__;
if (!vm) {
console.warn('__vue__ is not available on element', el);
return [];
}
export default function targets (vnode, binding, listen_types, fn) {
const targets = Object.keys(binding.modifiers || {})
.filter(t => !all_listen_types[t]);
@@ -16,15 +10,15 @@ export default function targets(el, binding, listen_types, fn) {
}
const listener = () => {
fn({targets, vm});
fn({targets, vnode});
};
Object.keys(all_listen_types).forEach(type => {
if (listen_types[type] || binding.modifiers[type]) {
el.addEventListener(type, listener);
vnode.elm.addEventListener(type, listener);
}
});
// Return the list of targets
return targets;
}
@@ -3,10 +3,11 @@ import target from './_target';
const listen_types = {click: true};
export default {
bind(el, binding) {
target(el, binding, listen_types, ({targets, vm}) => {
// eslint-disable-next-line no-shadow-restricted-names
bind(undefined, binding, vnode) {
target(vnode, binding, listen_types, ({targets, vnode}) => {
targets.forEach(target => {
vm.$root.$emit('show::modal', target, el);
vnode.context.$root.$emit('show::modal', target, vnode.elm);
});
});
}
@@ -1,20 +1,23 @@
const inBrowser = typeof window !== 'undefined';
import target from './_target';
const listen_types = {click: true};
export default {
bind(el, binding) {
const targets = target(el, binding, listen_types, ({targets, vm}) => {
bind(el, binding, vnode) {
const targets = target(vnode, binding, listen_types, ({targets, vnode}) => {
targets.forEach(target => {
vm.$root.$emit('collapse::toggle', target);
vnode.context.$root.$emit('collapse::toggle', target);
});
});
if (inBrowser && el.__vue__ && targets.length > 0) {
if (inBrowser && vnode.context && targets.length > 0) {
el.setAttribute('aria-controls', targets.join(' '));
el.setAttribute('aria-expanded', 'false');
el.__vue__.$root.$on('collapse::toggle::state', (id, state) => {
vnode.context.$root.$on('collapse::toggle::state', (id, state) => {
if (targets.indexOf(id) !== -1) {
el.setAttribute('aria-expanded', state ? 'true' : 'false');
}

0 comments on commit 3361911

Please sign in to comment.