Skip to content

Instantly share code, notes, and snippets.

@aantipov

aantipov/Factory Popover

Created March 20, 2014 12:08
Show Gist options
  • Save aantipov/9662369 to your computer and use it in GitHub Desktop.
Save aantipov/9662369 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. aantipov created this gist Mar 20, 2014.
    90 changes: 90 additions & 0 deletions Factory Popover
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,90 @@
    'use strict';

    angular.module('ccApp')
    .factory('Popover',
    function ($compile, $templateCache, $timeout, $http) {
    var popoverEnabled = true, openTimeout, $popover, $layer, popoverTarget;

    function isPopoverVisible() {
    return $popover.is(':visible');
    }

    function close() {
    if (popoverTarget) {
    popoverTarget.removeClass('popover-set');
    }
    if ($popover && $popover.length) {
    $popover.remove();
    }
    if ($layer && $layer.length) {
    $layer.remove();
    }
    }

    function open(template, scope, delay) {
    // Do not open, if popover is already open or it is forbidden.
    if (!popoverEnabled || ($popover && isPopoverVisible())) {
    return;
    }
    // Compile popup and link with scope data.
    $popover = $(template);
    // $popover.appendTo(popoverTarget.offsetParent());
    $popover.appendTo('body');
    $compile($popover)(scope);

    // Add layer.
    $layer = $('<div id="cc-popover-layer"></div>').appendTo('body');


    // Destroy popover on outer click.
    $layer.on('click', function () {
    close();
    });

    // Show popup.
    var targetPos = popoverTarget.addClass('popover-set').offset();
    $popover.show().css('top', targetPos.top - 60).css('left', targetPos.left - 210);
    }

    return {
    open: function ($targetEl, templateId, scope, delay) {
    if (!popoverEnabled) {
    return this;
    }
    popoverTarget = $targetEl;
    var template = $templateCache.get(templateId);
    if (!template) {
    $http.get(templateId)
    .success(function (data) {
    template = data;
    $templateCache.put(templateId, template);
    })
    .error(function (data, status) {
    throw 'HTTP Error: status' + status + '\n' + data;
    });
    }
    openTimeout = $timeout(function () {
    open(template, scope, delay);
    }, delay);

    return this;
    },
    close: function () {
    close();
    return this;
    },
    cancelOpening: function () {
    $timeout.cancel(openTimeout);
    return this;
    },
    forbid: function () {
    popoverEnabled = false;
    return this;
    },
    enable: function () {
    popoverEnabled = true;
    return this;
    }
    };
    }
    );