From af76fce85ff4283061c5a83328d6b592d8b4f102 Mon Sep 17 00:00:00 2001 From: Rasmus Milesson Date: Thu, 29 May 2014 20:22:10 +0200 Subject: [PATCH] Now allows the user to specify which controller to use for popups and tooltips in options-object --- example-app/js/app.js | 29 +------ example-app/partials/annotation-tooltip.html | 4 +- example-app/partials/annotation.html | 3 +- js/src/ng-annotate.coffee | 87 ++++++++++++-------- 4 files changed, 57 insertions(+), 66 deletions(-) diff --git a/example-app/js/app.js b/example-app/js/app.js index 15e9f0a..f1cbfa5 100644 --- a/example-app/js/app.js +++ b/example-app/js/app.js @@ -18,7 +18,7 @@ app.controller("AnnotationController", function($scope) $scope.reject = function() { - $scope.$reject(); + $scope.$reject() }; }); @@ -26,34 +26,11 @@ app.controller("MainController", function($scope, $timeout, NGAnnotation) { $scope.text = "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum."; $scope.annotations = []; - /* - $scope.annotations[0] = new NGAnnotation({ - id: 0, - startIndex: 0, - endIndex: 600, - type: "red" - }); - $scope.annotations[0].children[0] = new NGAnnotation({ - id: 1, - startIndex: 10, - endIndex: 590, - type: "green" - }); - $scope.annotations[0].children[0].children[0] = new NGAnnotation({ - id: 2, - startIndex: 10, - endIndex: 550, - type: "yellow strike", - }); - $scope.annotations[0].children[0].children[0].children[0] = new NGAnnotation({ - id: 3, - startIndex: 0, - endIndex: 55, - type: "pink" - });*/ $scope.options = { + popupController: "AnnotationController", popupTemplateUrl: "partials/annotation.html", + tooltipController: "AnnotationController", tooltipTemplateUrl: "partials/annotation-tooltip.html" }; diff --git a/example-app/partials/annotation-tooltip.html b/example-app/partials/annotation-tooltip.html index 841f1fb..e5c2e9c 100644 --- a/example-app/partials/annotation-tooltip.html +++ b/example-app/partials/annotation-tooltip.html @@ -2,9 +2,9 @@ -

{{$annotation.data.comment}}

+

{{$annotation.data.comment}}

-

{{$annotation.data.score}}

+

{{$annotation.data.score}}

\ No newline at end of file diff --git a/example-app/partials/annotation.html b/example-app/partials/annotation.html index 35c3d47..265d873 100644 --- a/example-app/partials/annotation.html +++ b/example-app/partials/annotation.html @@ -1,4 +1,4 @@ -
+
@@ -13,7 +13,6 @@ -
diff --git a/js/src/ng-annotate.coffee b/js/src/ng-annotate.coffee index 37a1feb..6a0af78 100644 --- a/js/src/ng-annotate.coffee +++ b/js/src/ng-annotate.coffee @@ -127,7 +127,7 @@ ngAnnotate.factory "NGAnnotation", -> return Annotation -ngAnnotate.directive "ngAnnotate", ($rootScope, $compile, $http, $q, NGAnnotation, NGAnnotatePopup, NGAnnotateTooltip)-> +ngAnnotate.directive "ngAnnotate", ($rootScope, $compile, $http, $q, $controller, NGAnnotation, NGAnnotatePopup, NGAnnotateTooltip)-> return { restrict: "A" scope: @@ -143,7 +143,6 @@ ngAnnotate.directive "ngAnnotate", ($rootScope, $compile, $http, $q, NGAnnotatio activePopups = [] activeTooltips = [] - # Cache the template when we fetch it popupTemplateData = "" tooltipTemplateData = "" @@ -160,7 +159,9 @@ ngAnnotate.directive "ngAnnotate", ($rootScope, $compile, $http, $q, NGAnnotatio # Setting options options = + popupController: "" popupTemplateUrl: "" + tooltipController: "" tooltipTemplateUrl: "" options = angular.extend options, $scope.options @@ -178,25 +179,11 @@ ngAnnotate.directive "ngAnnotate", ($rootScope, $compile, $http, $q, NGAnnotatio clearPopups() clearTooltips() - getPopupTemplate = (url)-> - if popupTemplateData.length - deferred = $q.defer() - deferred.resolve popupTemplateData - return deferred.promise - - return $http.get(url).then (response)-> - popupTemplateData = response.data - return response.data - - getTooltipTemplate = (url)-> - if tooltipTemplateData.length - deferred = $q.defer() - deferred.resolve tooltipTemplateData - return deferred.promise + $http.get(options.popupTemplateUrl).then (response)-> + popupTemplateData = response.data - return $http.get(url).then (response)-> - tooltipTemplateData = response.data - return response.data + $http.get(options.tooltipTemplateUrl).then (response)-> + tooltipTemplateData = response.data removeChildren = (annotation)-> for i in [annotation.children.length - 1..0] by -1 @@ -257,6 +244,9 @@ ngAnnotate.directive "ngAnnotate", ($rootScope, $compile, $http, $q, NGAnnotatio return annotation onSelect = (event)-> + if popupTemplateData.length is 0 + return + try annotation = createAnnotation() $scope.$apply() @@ -273,6 +263,9 @@ ngAnnotate.directive "ngAnnotate", ($rootScope, $compile, $http, $q, NGAnnotatio loadAnnotationPopup annotation, $span, true onClick = (event)-> + if popupTemplateData.length is 0 + return + $target = angular.element event.target targetId = if (attrId = $target.attr("data-annotation-id"))? then parseInt(attrId, 10) @@ -292,6 +285,9 @@ ngAnnotate.directive "ngAnnotate", ($rootScope, $compile, $http, $q, NGAnnotatio loadAnnotationPopup annotation, $target, false onMouseEnter = (event)-> + if tooltipTemplateData.length is 0 + return + event.stopPropagation() $target = angular.element event.target targetId = if (attrId = $target.attr("data-annotation-id"))? then parseInt(attrId, 10) @@ -318,17 +314,27 @@ ngAnnotate.directive "ngAnnotate", ($rootScope, $compile, $http, $q, NGAnnotatio activeTooltips.push tooltip - getTemplatePromise = getTooltipTemplate options.tooltipTemplateUrl - getTemplatePromise.then (template)-> - $compile(angular.element(template)) tooltip.scope, ($content)-> - tooltip.$el.html $content - tooltip.$el.appendTo "body" - tooltip.positionTop() - tooltip.positionLeft element.offset().left - tooltip.$el.innerWidth() - tooltip.show() + locals = + $scope: tooltip.scope + $template: tooltipTemplateData + + tooltip.$el.html locals.$template + tooltip.$el.appendTo "body" + + if options.tooltipController + controller = $controller options.tooltipController, locals + tooltip.$el.data "$ngControllerController", controller + tooltip.$el.children().data "$ngControllerController", controller + + $compile(tooltip.$el) tooltip.scope + tooltip.positionTop() + tooltip.positionLeft element.offset().left - tooltip.$el.innerWidth() + tooltip.scope.$apply() + tooltip.show() onMouseLeave = (event)-> event.stopPropagation() + $target = angular.element event.target targetId = if (attrId = $target.attr("data-annotation-id"))? then parseInt(attrId, 10) @@ -368,14 +374,23 @@ ngAnnotate.directive "ngAnnotate", ($rootScope, $compile, $http, $q, NGAnnotatio activePopups.push popup - getTemplatePromise = getPopupTemplate options.popupTemplateUrl - getTemplatePromise.then (template)-> - $compile(angular.element(template)) popup.scope, ($content)-> - popup.$el.html $content - popup.$el.appendTo "body" - popup.positionTop() - popup.positionLeft element.offset().left - popup.$el.innerWidth() - popup.show() + locals = + $scope: popup.scope + $template: popupTemplateData + + popup.$el.html locals.$template + popup.$el.appendTo "body" + + if options.popupController + controller = $controller options.popupController, locals + popup.$el.data "$ngControllerController", controller + popup.$el.children().data "$ngControllerController", controller + + $compile(popup.$el) popup.scope + popup.positionTop() + popup.positionLeft element.offset().left - popup.$el.innerWidth() + popup.scope.$apply() + popup.show() element.on "mouseover", "span", onMouseEnter element.on "mouseleave", "span", onMouseLeave