summaryrefslogtreecommitdiffstats
path: root/afb-client/bower_components/foundation-apps/js/angular/components/popup/popup.js
diff options
context:
space:
mode:
Diffstat (limited to 'afb-client/bower_components/foundation-apps/js/angular/components/popup/popup.js')
-rw-r--r--afb-client/bower_components/foundation-apps/js/angular/components/popup/popup.js160
1 files changed, 160 insertions, 0 deletions
diff --git a/afb-client/bower_components/foundation-apps/js/angular/components/popup/popup.js b/afb-client/bower_components/foundation-apps/js/angular/components/popup/popup.js
new file mode 100644
index 0000000..f51b1c6
--- /dev/null
+++ b/afb-client/bower_components/foundation-apps/js/angular/components/popup/popup.js
@@ -0,0 +1,160 @@
+(function() {
+ 'use strict';
+
+ angular.module('foundation.popup', ['foundation.core'])
+ .directive('zfPopup', zfPopup)
+ .directive('zfPopupToggle', zfPopupToggle)
+ .service('FoundationPopup', FoundationPopup)
+ ;
+
+ FoundationPopup.$inject = ['FoundationApi'];
+
+ function FoundationPopup(foundationApi) {
+ var service = {};
+
+ service.activate = activate;
+ service.deactivate = deactivate;
+
+ return service;
+
+ //target should be element ID
+ function activate(target) {
+ foundationApi.publish(target, 'show');
+ }
+
+ //target should be element ID
+ function deactivate(target) {
+ foundationApi.publish(target, 'hide');
+ }
+
+ function toggle(target, popupTarget) {
+ foundationApi.publish(target, ['toggle', popupTarget]);
+ }
+ }
+
+ zfPopup.$inject = ['FoundationApi'];
+
+ function zfPopup(foundationApi) {
+ var directive = {
+ restrict: 'EA',
+ transclude: true,
+ replace: true,
+ templateUrl: 'components/popup/popup.html',
+ scope: {
+ pinTo: '@?',
+ pinAt: '@?',
+ target: '@?'
+ },
+ compile: compile
+ };
+
+ return directive;
+
+ function compile() {
+ return {
+ pre: preLink,
+ post: postLink
+ };
+
+ function preLink(scope, iElement, iAttrs) {
+ iAttrs.$set('zf-closable', 'popup');
+ }
+
+ function postLink(scope, element, attrs) {
+ scope.active = false;
+ scope.target = scope.target || false;
+
+ var attachment = scope.pinTo || 'top center';
+ var targetAttachment = scope.pinAt || 'bottom center';
+ var tetherInit = false;
+ var tether = {};
+
+ //setup
+ foundationApi.subscribe(attrs.id, function(msg) {
+ if(msg[0] === 'show' || msg[0] === 'open') {
+ scope.show(msg[1]);
+ } else if (msg[0] === 'close' || msg[0] === 'hide') {
+ scope.hide();
+ } else if (msg[0] === 'toggle') {
+ scope.toggle(msg[1]);
+ }
+
+ scope.$apply();
+
+ return;
+ });
+
+
+ scope.hide = function() {
+ scope.active = false;
+ tetherElement();
+ tether.disable();
+ return;
+ };
+
+ scope.show = function(newTarget) {
+ scope.active = true;
+ tetherElement(newTarget);
+ tether.enable();
+
+ return;
+ };
+
+ scope.toggle = function(newTarget) {
+ scope.active = !scope.active;
+ tetherElement(newTarget);
+
+ if(scope.active) {
+ tether.enable();
+ } else {
+ tether.disable();
+ }
+
+ return;
+ };
+
+ function tetherElement(target) {
+ if(tetherInit) {
+ return;
+ }
+
+ scope.target = scope.target ? document.getElementById(scope.target) : document.getElementById(target);
+
+ tether = new Tether({
+ element: element[0],
+ target: scope.target,
+ attachment: attachment,
+ targetAttachment: targetAttachment,
+ enable: false
+ });
+
+ tetherInit = true;
+ }
+
+ }
+ }
+ }
+
+ zfPopupToggle.$inject = ['FoundationApi'];
+
+ function zfPopupToggle(foundationApi) {
+ var directive = {
+ restrict: 'A',
+ link: link
+ };
+
+ return directive;
+
+ function link(scope, element, attrs) {
+ var target = attrs.zfPopupToggle;
+ var id = attrs.id || foundationApi.generateUuid();
+ attrs.$set('id', id);
+
+ element.on('click', function(e) {
+ foundationApi.publish(target, ['toggle', id]);
+ e.preventDefault();
+ });
+ }
+ }
+
+})();