Fixes #1253, fix bug where resizing element does not reposition evolution icons and tweak translation keys.

git-svn-id: http://dev.piwik.org/svn/trunk@7650 59fd770c-687e-43c8-a1e3-f5a4ff64c105

6 files changed, 50 insertions, 30 deletions

diff --git a/plugins/Annotations/templates/annotationManager.tpl b/plugins/Annotations/templates/annotationManager.tpl
index 7ba893a972..852c09bbc4 100755
--- a/plugins/Annotations/templates/annotationManager.tpl
+++ b/plugins/Annotations/templates/annotationManager.tpl
@@ -18,7 +18,7 @@
 
 <div class="annotation-controls">
 	{if $canUserAddNotes}
-	<a href="#" class="add-annotation">{'Annotations_CreateNewAnnotation'|translate}</a>
+	<a href="#" class="add-annotation" title="{'Annotations_CreateNewAnnotation'|translate}">{'Annotations_CreateNewAnnotation'|translate}</a>
 	{elseif $userLogin eq 'anonymous'}
 	<a href="index.php?module=Login">{'Annotations_LoginToAnnotate'|translate}</a>
 	{/if}
diff --git a/plugins/Annotations/templates/annotations.js b/plugins/Annotations/templates/annotations.js
index 925c652567..447df6a2e5 100755
--- a/plugins/Annotations/templates/annotations.js
+++ b/plugins/Annotations/templates/annotations.js
@@ -589,9 +589,33 @@ var showAnnotationViewer = function(domElem, idSite, date, period, lastN, callba
 	}
 };
 
-// make showAnnotationViewer & annotationsApi globally accessible
+/**
+ * Determines the x-coordinates of a set of evolution annotation icons.
+ * 
+ * @param {Element} annotations The '.evolution-annotations' element.
+ * @param {Element} graphElem The evolution graph's datatable element.
+ */
+var placeEvolutionIcons = function (annotations, graphElem)
+{
+	var canvases = $('.piwik-graph .jqplot-xaxis canvas', graphElem),
+		noteSize = 16;
+	
+	// set position of each individual icon
+	$('span', annotations).each(function(i) {
+		var canvas = $(canvases[i]),
+			canvasCenterX = canvas.position().left + (canvas.width() / 2);
+		$(this).css({
+			left: canvasCenterX - noteSize / 2,
+			// show if there are annotations for this x-axis tick
+			opacity: +$(this).attr('data-count') > 0 ? 1 : 0
+		});
+	});
+};
+
+// make showAnnotationViewer, placeEvolutionIcons & annotationsApi globally accessible
 piwik.annotations = {
 	showAnnotationViewer: showAnnotationViewer,
+	placeEvolutionIcons: placeEvolutionIcons,
 	api: annotationsApi
 };
 
diff --git a/plugins/Annotations/templates/evolutionAnnotations.tpl b/plugins/Annotations/templates/evolutionAnnotations.tpl
index 5248bddbf2..50a7479797 100755
--- a/plugins/Annotations/templates/evolutionAnnotations.tpl
+++ b/plugins/Annotations/templates/evolutionAnnotations.tpl
@@ -3,8 +3,8 @@
 	{assign var=date value=$dateCountPair[0]}
 	{assign var=counts value=$dateCountPair[1]}
 	<span data-date="{$date}" data-count="{$counts.count}" data-starred="{$counts.starred}"
-		{if $counts.count eq 0}title="{'CoreHome_Annotations_AddAnnotationsFor_js'|translate:$date}"
-		{else}title="{'CoreHome_Annotations_ViewAndAddAnnotations_js'|translate:$date}"
+		{if $counts.count eq 0}title="{'Annotations_AddAnnotationsFor_js'|translate:$date}"
+		{else}title="{'Annotations_ViewAndAddAnnotations_js'|translate:$date}"
 		{/if}>
 		<img src="themes/default/images/{if $counts.starred > 0}yellow_marker.png{else}grey_marker.png{/if}" width="16" height="16"/>
 	</span>
diff --git a/plugins/CoreHome/templates/datatable.js b/plugins/CoreHome/templates/datatable.js
index 7b56b7e744..07ef52bcf1 100644
--- a/plugins/CoreHome/templates/datatable.js
+++ b/plugins/CoreHome/templates/datatable.js
@@ -553,32 +553,28 @@ dataTable.prototype =
 				self.param['evolution_' + self.param.period + '_last_n'],
 				function (response)
 				{
-					var canvases = $('.piwik-graph .jqplot-xaxis canvas', domElem),
-						datatableFeatures = $('.dataTableFeatures', domElem),
+					var annotations = $(response),
+					    datatableFeatures = $('.dataTableFeatures', domElem),
 						noteSize = 16,
 						annotationAxisHeight = 30 // css height + padding + margin
 						;
-				
+	
 					// set position of evolution annotation icons
-					var annotations = $(response).css({
+					annotations.css({
 						top: -datatableFeatures.height() - annotationAxisHeight + noteSize / 2,
 						left: 6 // padding-left of .jqplot-evolution element (in graph.tpl)
 					});
-				
-					// set position of each individual icon
-					$('span', annotations).each(function(i) {
-						var canvas = $(canvases[i]),
-							canvasCenterX = canvas.position().left + (canvas.width() / 2);
-						$(this).css({
-							left: canvasCenterX - noteSize / 2,
-							// show if there are annotations for this x-axis tick
-							opacity: +$(this).attr('data-count') > 0 ? 1 : 0
-						});
-					});
-				
+
+					piwik.annotations.placeEvolutionIcons(annotations, domElem);
+					
 					// add new section under axis
 					datatableFeatures.append(annotations);
-				
+					
+					// reposition annotation icons every time the graph is resized
+					$('.piwik-graph', domElem).on('resizeGraph', function() {
+						piwik.annotations.placeEvolutionIcons(annotations, domElem);
+					});
+					
 					// on hover of x-axis, show note icon over correct part of x-axis
 					$('span', annotations).hover(
 						function() { $(this).css('opacity', 1); },
@@ -612,10 +608,10 @@ dataTable.prototype =
 								function (manager) {
 									manager.attr('data-is-range', 0);
 									$('.annotationView img', domElem)
-										.attr('title', _pk_translate('CoreHome_Annotations_IconDesc_js'));
+										.attr('title', _pk_translate('Annotations_IconDesc_js'));
 									
-									var viewAndAdd = _pk_translate('CoreHome_Annotations_ViewAndAddAnnotations_js'),
-										hideNotes = _pk_translate('CoreHome_Annotations_HideAnnotationsFor_js');
+									var viewAndAdd = _pk_translate('Annotations_ViewAndAddAnnotations_js'),
+										hideNotes = _pk_translate('Annotations_HideAnnotationsFor_js');
 									
 									// change the tooltip of the previously clicked evolution icon (if any)
 									if (oldDate)
@@ -665,12 +661,12 @@ dataTable.prototype =
 				if (annotationManager.is(':hidden'))
 				{
 					annotationManager.slideDown('slow'); // showing
-					$('img', this).attr('title', _pk_translate('CoreHome_Annotations_IconDescHideNotes_js'));
+					$('img', this).attr('title', _pk_translate('Annotations_IconDescHideNotes_js'));
 				}
 				else
 				{
 					annotationManager.slideUp('slow'); // hiding
-					$('img', this).attr('title', _pk_translate('CoreHome_Annotations_IconDesc_js'));
+					$('img', this).attr('title', _pk_translate('Annotations_IconDesc_js'));
 				}
 			}
 			else
@@ -689,7 +685,7 @@ dataTable.prototype =
 				);
 				
 				// change the tooltip of the view annotation icon
-				$('img', this).attr('title', _pk_translate('CoreHome_Annotations_IconDescHideNotes_js'));
+				$('img', this).attr('title', _pk_translate('Annotations_IconDescHideNotes_js'));
 			}
 		});
 	},
diff --git a/plugins/CoreHome/templates/datatable_footer.tpl b/plugins/CoreHome/templates/datatable_footer.tpl
index 11222fac2d..a37031a08f 100644
--- a/plugins/CoreHome/templates/datatable_footer.tpl
+++ b/plugins/CoreHome/templates/datatable_footer.tpl
@@ -95,8 +95,8 @@
 			</ul>
 		</div>
 		{if !$properties.hide_annotations_view}
-		<div class="annotationView">
-			<a class="tableIcon"><img width="16" height="16" src="themes/default/images/grey_marker.png" title="{'CoreHome_Annotations_IconDesc_js'|translate}"/></a>
+		<div class="annotationView" title="{'Annotations_IconDesc_js'|translate}">
+			<a class="tableIcon"><img width="16" height="16" src="themes/default/images/grey_marker.png"/></a>
 			<span>{'Annotations_Annotations'|translate}</span>
 		</div>
 		{/if}
diff --git a/plugins/CoreHome/templates/header.tpl b/plugins/CoreHome/templates/header.tpl
index 7eaa264671..db2193f207 100644
--- a/plugins/CoreHome/templates/header.tpl
+++ b/plugins/CoreHome/templates/header.tpl
@@ -6,7 +6,7 @@
 <meta name="generator" content="Piwik - Open Source Web Analytics" />
 <meta name="description" content="Web Analytics report for '{$siteName}' - Piwik" />
 <link rel="shortcut icon" href="plugins/CoreHome/templates/images/favicon.ico" /> 
-{loadJavascriptTranslations plugins='CoreHome'}
+{loadJavascriptTranslations plugins='CoreHome Annotations'}
 {include file="CoreHome/templates/js_global_variables.tpl"}
 <!--[if lt IE 9]>
 <script language="javascript" type="text/javascript" src="libs/jqplot/excanvas.min.js"></script>