Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

angularjs-tooltips

Package Overview
Dependencies
Maintainers
1
Versions
6
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

angularjs-tooltips - npm Package Compare versions

Comparing version 1.0.0 to 1.0.1

2

bower.json
{
"name": "angular-tooltips",
"description": "Tooltip Directive For AngularJS",
"version": "1.0.0",
"version": "1.0.1",
"homepage": "https://github.com/intellipharm/angular-tooltips",

@@ -6,0 +6,0 @@ "repository": {

@@ -7,3 +7,5 @@ (function() {

restrict: 'A',
scope: true,
scope: {
title: '@'
},
link: function ($scope, element, attrs) {

@@ -16,19 +18,34 @@ // adds the tooltip to the body

// create the tooltip
var tooltip = angular.element('<div>')
.addClass('angular-tooltip angular-tooltip-' + direction)
.html(attrs.title || attrs.tooltip);
$scope.tooltipElement = angular.element('<div>')
.addClass('angular-tooltip angular-tooltip-' + direction);
// append to the body
angular.element(document).find('body').append(tooltip);
angular.element(document).find('body').append($scope.tooltipElement);
// position the tooltip
var css = $scope.calculatePosition(tooltip, direction);
$scope.updateTooltip(attrs.title || attrs.tooltip);
tooltip.css(css);
// fade in
tooltip.addClass('angular-tooltip-fade-in');
$scope.tooltipElement.addClass('angular-tooltip-fade-in');
}
};
$scope.updateTooltip = function(title) {
$scope.tooltipElement.html(title);
var css = $scope.calculatePosition($scope.tooltipElement, $scope.getDirection());
$scope.tooltipElement.css(css);
// stop the standard tooltip from being shown
$timeout(function () {
element.removeAttr('ng-attr-title');
element.removeAttr('title');
});
};
$scope.$watch('title', function(newTitle) {
if($scope.tooltipElement) {
$scope.updateTooltip(newTitle);
}
});
// removes all tooltips from the document to reduce ghosts

@@ -129,8 +146,2 @@ $scope.removeTooltip = function () {

if (attrs.title || attrs.tooltip) {
// stop the standard tooltip from being shown
$timeout(function () {
element.removeAttr('ng-attr-title');
element.removeAttr('title');
});
// attach events to show tooltip

@@ -137,0 +148,0 @@ element.on('mouseover', $scope.createTooltip);

@@ -1,1 +0,1 @@

!function(){"use strict";var t=function(t){return{restrict:"A",scope:!0,link:function(e,o,i){e.createTooltip=function(t){if(i.title||i.tooltip){var o=e.getDirection(),l=angular.element("<div>").addClass("angular-tooltip angular-tooltip-"+o).html(i.title||i.tooltip);angular.element(document).find("body").append(l);var r=e.calculatePosition(l,o);l.css(r),l.addClass("angular-tooltip-fade-in")}},e.removeTooltip=function(){var t=angular.element(document.querySelectorAll(".angular-tooltip"));t.remove()},e.getDirection=function(){return o.attr("tooltip-direction")||o.attr("title-direction")||"top"},e.calculatePosition=function(t,e){var i=t[0].getBoundingClientRect(),l=o[0].getBoundingClientRect(),r=window.scrollX||document.documentElement.scrollLeft,p=window.scrollY||document.documentElement.scrollTop,n=12;switch(e){case"top":case"top-center":case"top-middle":return{left:l.left+l.width/2-i.width/2+r+"px",top:l.top-i.height-n/2+p+"px"};case"top-right":return{left:l.left+l.width-n+r+"px",top:l.top-i.height-n/2+p+"px"};case"right-top":return{left:l.left+l.width+n/2+r+"px",top:l.top-i.height+n+p+"px"};case"right":case"right-center":case"right-middle":return{left:l.left+l.width+n/2+r+"px",top:l.top+l.height/2-i.height/2+p+"px"};case"right-bottom":return{left:l.left+l.width+n/2+r+"px",top:l.top+l.height-n+p+"px"};case"bottom-right":return{left:l.left+l.width-n+r+"px",top:l.top+l.height+n/2+p+"px"};case"bottom":case"bottom-center":case"bottom-middle":return{left:l.left+l.width/2-i.width/2+r+"px",top:l.top+l.height+n/2+p+"px"};case"bottom-left":return{left:l.left-i.width+n+r+"px",top:l.top+l.height+n/2+p+"px"};case"left-bottom":return{left:l.left-i.width-n/2+r+"px",top:l.top+l.height-n+p+"px"};case"left":case"left-center":case"left-middle":return{left:l.left-i.width-n/2+r+"px",top:l.top+l.height/2-i.height/2+p+"px"};case"left-top":return{left:l.left-i.width-n/2+r+"px",top:l.top-i.height+n+p+"px"};case"top-left":return{left:l.left-i.width+n+r+"px",top:l.top-i.height-n/2+p+"px"}}},i.title||i.tooltip?(t(function(){o.removeAttr("ng-attr-title"),o.removeAttr("title")}),o.on("mouseover",e.createTooltip),o.on("mouseout",e.removeTooltip)):(o.off("mouseover",e.createTooltip),o.off("mouseout",e.removeTooltip)),o.on("destroy",e.removeTooltip),e.$on("$destroy",e.removeTooltip)}}};t.$inject=["$timeout"],angular.module("tooltips",[]).directive("title",t).directive("tooltip",t)}();
!function(){"use strict";var t=function(t){return{restrict:"A",scope:{title:"@"},link:function(e,o,i){e.createTooltip=function(t){if(i.title||i.tooltip){var o=e.getDirection();e.tooltipElement=angular.element("<div>").addClass("angular-tooltip angular-tooltip-"+o),angular.element(document).find("body").append(e.tooltipElement),e.updateTooltip(i.title||i.tooltip),e.tooltipElement.addClass("angular-tooltip-fade-in")}},e.updateTooltip=function(i){e.tooltipElement.html(i);var l=e.calculatePosition(e.tooltipElement,e.getDirection());e.tooltipElement.css(l),t(function(){o.removeAttr("ng-attr-title"),o.removeAttr("title")})},e.$watch("title",function(t){e.tooltipElement&&e.updateTooltip(t)}),e.removeTooltip=function(){var t=angular.element(document.querySelectorAll(".angular-tooltip"));t.remove()},e.getDirection=function(){return o.attr("tooltip-direction")||o.attr("title-direction")||"top"},e.calculatePosition=function(t,e){var i=t[0].getBoundingClientRect(),l=o[0].getBoundingClientRect(),p=window.scrollX||document.documentElement.scrollLeft,n=window.scrollY||document.documentElement.scrollTop,r=12;switch(e){case"top":case"top-center":case"top-middle":return{left:l.left+l.width/2-i.width/2+p+"px",top:l.top-i.height-r/2+n+"px"};case"top-right":return{left:l.left+l.width-r+p+"px",top:l.top-i.height-r/2+n+"px"};case"right-top":return{left:l.left+l.width+r/2+p+"px",top:l.top-i.height+r+n+"px"};case"right":case"right-center":case"right-middle":return{left:l.left+l.width+r/2+p+"px",top:l.top+l.height/2-i.height/2+n+"px"};case"right-bottom":return{left:l.left+l.width+r/2+p+"px",top:l.top+l.height-r+n+"px"};case"bottom-right":return{left:l.left+l.width-r+p+"px",top:l.top+l.height+r/2+n+"px"};case"bottom":case"bottom-center":case"bottom-middle":return{left:l.left+l.width/2-i.width/2+p+"px",top:l.top+l.height+r/2+n+"px"};case"bottom-left":return{left:l.left-i.width+r+p+"px",top:l.top+l.height+r/2+n+"px"};case"left-bottom":return{left:l.left-i.width-r/2+p+"px",top:l.top+l.height-r+n+"px"};case"left":case"left-center":case"left-middle":return{left:l.left-i.width-r/2+p+"px",top:l.top+l.height/2-i.height/2+n+"px"};case"left-top":return{left:l.left-i.width-r/2+p+"px",top:l.top-i.height+r+n+"px"};case"top-left":return{left:l.left-i.width+r+p+"px",top:l.top-i.height-r/2+n+"px"}}},i.title||i.tooltip?(o.on("mouseover",e.createTooltip),o.on("mouseout",e.removeTooltip)):(o.off("mouseover",e.createTooltip),o.off("mouseout",e.removeTooltip)),o.on("destroy",e.removeTooltip),e.$on("$destroy",e.removeTooltip)}}};t.$inject=["$timeout"],angular.module("tooltips",[]).directive("title",t).directive("tooltip",t)}();
{
"name": "angularjs-tooltips",
"version": "1.0.0",
"version": "1.0.1",
"license": "MIT",

@@ -5,0 +5,0 @@ "main": "dist/angular-tooltips.js",

@@ -7,3 +7,5 @@ (function() {

restrict: 'A',
scope: true,
scope: {
title: '@'
},
link: function ($scope, element, attrs) {

@@ -16,19 +18,34 @@ // adds the tooltip to the body

// create the tooltip
var tooltip = angular.element('<div>')
.addClass('angular-tooltip angular-tooltip-' + direction)
.html(attrs.title || attrs.tooltip);
$scope.tooltipElement = angular.element('<div>')
.addClass('angular-tooltip angular-tooltip-' + direction);
// append to the body
angular.element(document).find('body').append(tooltip);
angular.element(document).find('body').append($scope.tooltipElement);
// position the tooltip
var css = $scope.calculatePosition(tooltip, direction);
$scope.updateTooltip(attrs.title || attrs.tooltip);
tooltip.css(css);
// fade in
tooltip.addClass('angular-tooltip-fade-in');
$scope.tooltipElement.addClass('angular-tooltip-fade-in');
}
};
$scope.updateTooltip = function(title) {
$scope.tooltipElement.html(title);
var css = $scope.calculatePosition($scope.tooltipElement, $scope.getDirection());
$scope.tooltipElement.css(css);
// stop the standard tooltip from being shown
$timeout(function () {
element.removeAttr('ng-attr-title');
element.removeAttr('title');
});
};
$scope.$watch('title', function(newTitle) {
if($scope.tooltipElement) {
$scope.updateTooltip(newTitle);
}
});
// removes all tooltips from the document to reduce ghosts

@@ -129,8 +146,2 @@ $scope.removeTooltip = function () {

if (attrs.title || attrs.tooltip) {
// stop the standard tooltip from being shown
$timeout(function () {
element.removeAttr('ng-attr-title');
element.removeAttr('title');
});
// attach events to show tooltip

@@ -137,0 +148,0 @@ element.on('mouseover', $scope.createTooltip);

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc