angular-stackables
Advanced tools
Comparing version 0.0.14 to 0.0.15
{ | ||
"name": "angular-stackables", | ||
"version": "0.0.14", | ||
"version": "0.0.15", | ||
"description": "AngularJS stackable widgets built on HTML5 dialog.", | ||
@@ -5,0 +5,0 @@ "authors": [ |
{ | ||
"name": "angular-stackables", | ||
"version": "0.0.14", | ||
"version": "0.0.15", | ||
"dependencies": {} | ||
} |
@@ -61,7 +61,7 @@ angular-stackables | ||
<div ng-controller="TestController as test"> | ||
<a class="btn" | ||
<button | ||
stackable-trigger="test.popoverState" | ||
stackable-toggle="'active'"> | ||
<i class="caret"></i> | ||
</a> | ||
</button> | ||
@@ -84,5 +84,5 @@ <div stackable-popover="test.popoverState" | ||
<div ng-controller="TestController as test"> | ||
<a class="btn" stackable-trigger="test.menuState"> | ||
<button stackable-trigger="test.menuState"> | ||
<i class="caret"></i> | ||
</a> | ||
</button> | ||
@@ -89,0 +89,0 @@ <div stackable-popover="test.menuState" |
@@ -76,3 +76,3 @@ /*! | ||
dialog.addEventListener('cancel', function(e) { | ||
var cancelListener = function(e) { | ||
if(!!scope.disableEscape) { | ||
@@ -84,5 +84,6 @@ e.preventDefault(); | ||
} | ||
}); | ||
}; | ||
dialog.addEventListener('cancel', cancelListener); | ||
dialog.addEventListener('close', function(e) { | ||
var closeListener = function(e) { | ||
e.stopPropagation(); | ||
@@ -102,3 +103,4 @@ scope.show = open = false; | ||
} | ||
}); | ||
}; | ||
dialog.addEventListener('close', closeListener); | ||
@@ -128,2 +130,7 @@ scope.$watch('show', function(value) { | ||
}); | ||
scope.$on('$destroy', function() { | ||
dialog.removeEventListener(cancelListener); | ||
dialog.removeEventListener(closeListener); | ||
}); | ||
} | ||
@@ -137,5 +144,13 @@ } | ||
link: function(scope, element, attrs, ctrl) { | ||
element.on('click', function() { | ||
element.on('click', cancel); | ||
scope.$on('$destroy', cleanup); | ||
element.on('$destroy', cleanup); | ||
function cancel() { | ||
ctrl.close('canceled', null); | ||
}); | ||
} | ||
function cleanup() { | ||
element.off('click', cancel).off('$destroy', cleanup); | ||
} | ||
} | ||
@@ -161,4 +176,3 @@ }; | ||
<div class="stackable-popover-content stackable-fadein" \ | ||
style="display: none" \ | ||
ng-show="positioned" \ | ||
style="display: none; opacity: 0" \ | ||
ng-class="{ \ | ||
@@ -185,3 +199,3 @@ \'stackable-place-top\': !placement || placement == \'top\', \ | ||
// popover not positioned yet | ||
scope.positioned = false; | ||
var positioned = false; | ||
@@ -196,3 +210,3 @@ var doc = angular.element(document); | ||
doc.off('keyup', closeOnEscape).off('click', closeOnClick); | ||
scope.positioned = false; | ||
positioned = false; | ||
} | ||
@@ -289,5 +303,5 @@ } | ||
content.css(position); | ||
if(!scope.positioned) { | ||
content.css('display', ''); | ||
scope.positioned = true; | ||
if(!positioned) { | ||
content.css({display: '', opacity: ''}); | ||
positioned = true; | ||
scope.$digest(); | ||
@@ -317,8 +331,2 @@ } | ||
// update element position when window resized | ||
angular.element(window).resize(resized); | ||
scope.$on('$destroy', function() { | ||
angular.element(window).off('resize', resized); | ||
}); | ||
// update state and add/remove toggle classes when state.show changes | ||
@@ -338,33 +346,33 @@ scope.$watch(function() { | ||
// ensure event handlers are cleaned up | ||
scope.$on('$destroy', cleanup); | ||
element.on('$destroy', cleanup); | ||
// update element position when window resized | ||
angular.element(window).resize(resize); | ||
var toggleEvent = attrs.stackableToggle || 'click'; | ||
if(toggleEvent === 'hover') { | ||
// show on enter, hide on leave | ||
element.hover(function() { | ||
state.show = true; | ||
updateState(state); | ||
scope.$apply(); | ||
}, function() { | ||
state.show = false; | ||
updateState(state); | ||
scope.$apply(); | ||
}); | ||
element.on('mouseenter', enter).on('mouseleave', leave); | ||
} else { | ||
// default to click | ||
element.on('click', function() { | ||
// clear any selection | ||
if(document.selection && document.selection.empty) { | ||
document.selection.empty(); | ||
} else if(window.getSelection) { | ||
window.getSelection().removeAllRanges(); | ||
} | ||
element.on('click', click); | ||
} | ||
// indicate trigger was clicked | ||
state.triggerClicked = true; | ||
state.show = !state.show; | ||
updateState(state); | ||
scope.$apply(); | ||
}); | ||
function resize() { | ||
updateState(state); | ||
scope.$apply(); | ||
} | ||
function resized() { | ||
function enter() { | ||
setVisible(true); | ||
} | ||
function leave() { | ||
setVisible(false); | ||
} | ||
function setVisible(show) { | ||
state.show = show; | ||
updateState(state); | ||
@@ -374,2 +382,19 @@ scope.$apply(); | ||
function click() { | ||
// indicate trigger was clicked | ||
state.triggerClicked = true; | ||
state.show = !state.show; | ||
updateState(state); | ||
scope.$apply(); | ||
} | ||
function cleanup() { | ||
angular.element(window).off('resize', resize); | ||
element | ||
.off('mouseenter', enter) | ||
.off('mouseleave', leave) | ||
.off('click', click) | ||
.off('$destroy', cleanup); | ||
} | ||
function initState(expr) { | ||
@@ -399,3 +424,2 @@ var get = $parse(expr); | ||
}; | ||
return state; | ||
} | ||
@@ -402,0 +426,0 @@ } |
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
24603
703