Fixes #3624, add donation form w/ slider and link to paypal in multiple places including: after update, default superuser dashboard, feedback popup.

Notes:
  * Fixed css bug in updater language selector.


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

10 files changed, 411 insertions, 1 deletions

diff --git a/plugins/CoreAdminHome/CoreAdminHome.php b/plugins/CoreAdminHome/CoreAdminHome.php
index f6dcc4ddeb..5eb2bd3f12 100644
--- a/plugins/CoreAdminHome/CoreAdminHome.php
+++ b/plugins/CoreAdminHome/CoreAdminHome.php
@@ -32,6 +32,7 @@ class Piwik_CoreAdminHome extends Piwik_Plugin
 			'AssetManager.getCssFiles' => 'getCssFiles',
 			'AssetManager.getJsFiles' => 'getJsFiles',
 			'AdminMenu.add' => 'addMenu',
+			'TopMenu.add' => 'addTopMenu',
 			'TaskScheduler.getScheduledTasks' => 'getScheduledTasks',
 		);
 	}
@@ -71,6 +72,7 @@ class Piwik_CoreAdminHome extends Piwik_Plugin
 		$cssFiles[] = "plugins/CoreAdminHome/templates/menu.css";	
 		$cssFiles[] = "themes/default/common.css";
 		$cssFiles[] = "plugins/CoreAdminHome/templates/styles.css";
+		$cssFiles[] = "plugins/CoreHome/templates/donate.css";
 	}
 
 	/**
@@ -88,6 +90,7 @@ class Piwik_CoreAdminHome extends Piwik_Plugin
 		$jsFiles[] = "libs/jquery/jquery.history.js";
 		$jsFiles[] = "plugins/CoreHome/templates/broadcast.js";
 		$jsFiles[] = "plugins/CoreAdminHome/templates/generalSettings.js";
+		$jsFiles[] = "plugins/CoreHome/templates/donate.js";
 	}
 	
 	function addMenu()
@@ -98,6 +101,17 @@ class Piwik_CoreAdminHome extends Piwik_Plugin
 							$order = 6);
 	}
 	
+	function addTopMenu()
+	{
+		$donateLinkTitle = Piwik_Translate('CoreHome_OnlyForAdmin');
+		Piwik_AddTopMenu('General_Donate',
+							'<a href="http://piwik.org/donate/" target="_blank" title="'.$donateLinkTitle.'">'
+								.Piwik_Translate('General_Donate').'</a> |',
+							Piwik::isUserHasSomeAdminAccess(),
+							$order = 21,
+							$isHTML = true);
+	}
+	
 	function purgeOutdatedArchives()
 	{
 		$archiveTables = Piwik::getTablesArchivesInstalled();
diff --git a/plugins/CoreHome/Controller.php b/plugins/CoreHome/Controller.php
index 6ac73d91d5..74ab887847 100644
--- a/plugins/CoreHome/Controller.php
+++ b/plugins/CoreHome/Controller.php
@@ -200,4 +200,17 @@ class Piwik_CoreHome_Controller extends Piwik_Controller
 		$this->setGeneralVariablesView($view);
 		echo $view->render();
 	}
+	
+	/**
+	 * Renders and echo's the in-app donate form w/ slider.
+	 */
+	public function getDonateForm()
+	{
+		$view = Piwik_View::factory('donate');
+		if (Piwik_Common::getRequestVar('widget', false))
+		{
+			$view->footerMessage = Piwik_Translate('CoreHome_OnlyForAdmin');
+		}
+		echo $view->render();
+	}
 }
diff --git a/plugins/CoreHome/CoreHome.php b/plugins/CoreHome/CoreHome.php
index 9a6b079ed4..dc82b0cc26 100644
--- a/plugins/CoreHome/CoreHome.php
+++ b/plugins/CoreHome/CoreHome.php
@@ -30,9 +30,23 @@ class Piwik_CoreHome extends Piwik_Plugin
 	{
 		return array(
 			'AssetManager.getCssFiles' => 'getCssFiles',
-			'AssetManager.getJsFiles' => 'getJsFiles'
+			'AssetManager.getJsFiles' => 'getJsFiles',
+			'WidgetsList.add' => 'addWidgets',
 		);
 	}
+	
+	/**
+	 * Adds the donate form widget.
+	 * 
+	 * @param Piwik_Event_Notification $notification  notification object
+	 */
+	public function addWidgets()
+	{
+		if (Piwik::isUserIsSuperUser())
+		{
+			Piwik_AddWidget('Example Widgets', 'CoreHome_SupportPiwik', 'CoreHome', 'getDonateForm');
+		}
+	}
 
 	/**
 	 * @param Piwik_Event_Notification $notification  notification object
@@ -49,6 +63,7 @@ class Piwik_CoreHome extends Piwik_Plugin
 		$cssFiles[] = "plugins/CoreHome/templates/cloud.css";
 		$cssFiles[] = "plugins/CoreHome/templates/jquery.ui.autocomplete.css";
 		$cssFiles[] = "plugins/CoreHome/templates/jqplot.css";
+		$cssFiles[] = "plugins/CoreHome/templates/donate.css";
 	}
 
 	/**
@@ -79,6 +94,7 @@ class Piwik_CoreHome extends Piwik_Plugin
 		$jsFiles[] = "plugins/CoreHome/templates/autocomplete.js";
 		$jsFiles[] = "plugins/CoreHome/templates/sparkline.js";
 		$jsFiles[] = "plugins/CoreHome/templates/misc.js";
+		$jsFiles[] = "plugins/CoreHome/templates/donate.js";
 		
 		$jsFiles[] = "plugins/CoreHome/templates/jqplot.js";
 		$jsFiles[] = "libs/jqplot/jqplot-custom.min.js";
diff --git a/plugins/CoreHome/templates/donate.css b/plugins/CoreHome/templates/donate.css
new file mode 100755
index 0000000000..a805ac5538
--- /dev/null
+++ b/plugins/CoreHome/templates/donate.css
@@ -0,0 +1,126 @@
+.piwik-donate-call {
+	padding: 1em 1em 1em 1em;
+	border: 1px solid #CCC;
+	
+	border-radius:4px;
+	-moz-border-radius:4px;
+	-webkit-border-radius:4px;
+	
+	max-width: 432px;
+	position:relative;
+}
+
+#piwik-worth {
+	font-size:1.2em;
+	font-weight:bold;
+	font-style:italic;
+	display:block;
+	margin: 0 1em 0 1em;
+}
+
+.piwik-donate-slider {
+	height:56px;
+	margin: 1em 0 1em 1em;
+}
+
+.piwik-donate-slider > .slider-range {
+	vertical-align:top;
+	position:relative;
+	display: inline-block;
+	border: 1px solid #999;
+	
+	background-color: #f7f7f7;
+	
+	border-radius:6px;
+	-moz-border-radius:6px;
+	-webkit-border-radius:6px;
+	
+	height: 14px;
+	width: 270px;
+	margin:22px 8px 0 0;
+	cursor:pointer;
+}
+
+.piwik-donate-slider .slider-position {
+	border: 1px solid #999;
+	background-color:#CCC;
+
+	border-radius:3px;
+	-moz-border-radius:3px;
+	-webkit-border-radius:3px;
+	
+	height:18px;
+	width:10px;
+	
+	position:absolute;
+	top:-3px;
+	left:-1px;
+}
+
+.piwik-donate-slider .slider-donate-amount {
+	display:inline-block;
+	
+	padding: .3em .5em .3em .5em;
+	margin:16px 8px 0 0;
+	vertical-align:top;
+	width:48px;
+	text-align:center;
+	background-color: #CCC;
+	color:#333;
+	cursor:pointer;
+}
+
+.piwik-donate-slider .slider-smiley-face {
+	margin:8px 0 8px 0;
+	display:inline-block;
+	cursor:pointer;
+}
+
+.piwik-donate-call .donate-submit {
+	height:55px;
+	position:relative;
+}
+
+.piwik-donate-call .donate-submit input {
+	margin-left:13px;
+	border-style:none;
+	background-image:none;
+	padding:0;
+}
+
+.piwik-donate-call .donate-submit a {
+	display:inline-block;
+	position:absolute;
+	bottom:.5em;
+	right:1.2em;
+	margin-left:1.2em;
+	font-size:1em;
+	font-style:italic;
+}
+
+.piwik-donate-call > .piwik-donate-message {
+	margin-bottom:.5em;
+}
+
+.piwik-donate-call > .piwik-donate-message p {
+	margin-left: 1em;
+}
+
+.piwik-donate-call > .form-description {
+	margin-top:1.25em;
+}
+
+.donate-form-instructions {
+	font-size:.8em;
+	margin: 0 1.25em 0 1.25em;
+	color:#666;
+	font-style:italic;
+}
+
+.widget .piwik-donate-call {
+	border-style:none;
+}
+
+.widget .piwik-donate-slider > .slider-range {
+	width: 240px;
+}
diff --git a/plugins/CoreHome/templates/donate.js b/plugins/CoreHome/templates/donate.js
new file mode 100755
index 0000000000..f800b38c4e
--- /dev/null
+++ b/plugins/CoreHome/templates/donate.js
@@ -0,0 +1,156 @@
+/*!
+ * Piwik - Web Analytics
+ *
+ * @link http://piwik.org
+ * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
+ */
+(function($) {
+
+$(document).ready(function() {
+	
+	var donateAmounts = [0, 30, 60, 90, 120];
+	
+	// returns the space between each donation amount in the donation slider
+	var getTickWidth = function(slider)
+	{
+		var effectiveSliderWidth = $('.slider-range', slider).width() - $('.slider-position', slider).width();
+		return effectiveSliderWidth / (donateAmounts.length - 1);
+	};
+	
+	// returns the position index on a slider based on a x coordinate value
+	var getPositionFromPageCoord = function(slider, pageX)
+	{
+		return Math.round((pageX - $('.slider-range', slider).offset().left) / getTickWidth(slider));
+	};
+	
+	// set's the correct amount text & smiley face image based on the position of the slider
+	var setSmileyFaceAndAmount = function(slider, pos)
+	{
+		// set text yearly amount
+		$('.slider-donate-amount', slider).text('$' + donateAmounts[pos] + '/' + _pk_translate('CoreHome_YearShort_js'));
+		
+		// set the right smiley face
+		$('.slider-smiley-face').attr('src', 'themes/default/images/smileyprog_' + pos + '.png');
+		
+		// set the hidden option input for paypal
+		var option = Math.max(1, pos);
+		$('.piwik-donate-call input[name=os0]').val("Option " + option);
+	};
+	
+	// move's a slider's position to a specific spot
+	var moveSliderPosition = function(slider, to)
+	{
+		// make sure 'to' is valid
+		if (to < 0)
+		{
+			to = 0;
+		}
+		else if (to >= donateAmounts.length)
+		{
+			to = donateAmounts.length - 1;
+		}
+		
+		// set the slider position
+		var left = to * getTickWidth(slider);
+		if (left == 0)
+		{
+			left = -1; // at position 0 we move one pixel left to cover up some of slider bar
+		}
+		
+		$('.slider-position', slider).css({
+			left: left + 'px'
+		});
+		
+		// reset the smiley face & amount based on the new position
+		setSmileyFaceAndAmount(slider, to);
+	};
+	
+	// when a slider is clicked, set the amount & smiley face appropriately
+	$('body').on('click', '.piwik-donate-slider>.slider-range', function(e) {
+		var slider = $(this).parent(),
+			currentPageX = $('.slider-position', this).offset().left,
+			currentPos = getPositionFromPageCoord(slider, currentPageX),
+			pos = getPositionFromPageCoord(slider, e.pageX);
+		
+		// if the closest position is the current one, use the other position since
+		// the user obviously wants to move the slider.
+		if (currentPos == pos)
+		{
+			// if click is to right, go forward one, else backwards one
+			if (e.pageX > currentPageX)
+			{
+				++pos;
+			}
+			else
+			{
+				--pos;
+			}
+		}
+		
+		moveSliderPosition(slider, pos);
+	});
+	
+	// when the smiley icon is clicked, move the position up one to demonstrate how to use the slider
+	$('body').on('click', '.piwik-donate-slider .slider-smiley-face,.piwik-donate-slider .slider-donate-amount',
+		function(e) {
+			var slider = $(this).closest('.piwik-donate-slider'),
+				currentPageX = $('.slider-position', slider).offset().left,
+				currentPos = getPositionFromPageCoord(slider, currentPageX);
+		
+			moveSliderPosition(slider, currentPos + 1);
+		}
+	);
+	
+	// stores the current slider being dragged
+	var draggingSlider = false;
+	
+	// start dragging on mousedown for a slider's position bar
+	$('body').on('mousedown', '.piwik-donate-slider .slider-position', function () {
+		draggingSlider = $(this).parent().parent();
+	});
+	
+	// move the slider position if currently dragging when the mouse moves anywhere over the entire page
+	$('body').on('mousemove', function(e) {
+		if (draggingSlider)
+		{
+			var slider = draggingSlider.find('.slider-range'),
+				sliderPos = slider.find('.slider-position'),
+				left = e.pageX - slider.offset().left;
+			
+			// only move slider if the mouse x-coord is still on the slider (w/ some padding for borders)
+			if (left <= slider.width() - sliderPos.width() + 2
+				&& left >= -2)
+			{
+				sliderPos.css({left: left + 'px'});
+				
+				var closestPos = Math.round(left / getTickWidth(draggingSlider));
+				setSmileyFaceAndAmount(draggingSlider, closestPos);
+			}
+		}
+	});
+	
+	// stop dragging and normalize a slider's position on mouseup over the entire page
+	$('body').on('mouseup', function() {
+		if (draggingSlider)
+		{
+			var sliderPos = $('.slider-position', draggingSlider),
+				slider = sliderPos.parent();
+			
+			if (sliderPos.length)
+			{
+				// move the slider to the nearest donation amount position
+				var pos = getPositionFromPageCoord(draggingSlider, sliderPos.offset().left);
+				moveSliderPosition(draggingSlider, pos);
+			}
+		
+			draggingSlider = false; // stop dragging
+		}
+	});
+	
+	// event for programatically changing the position
+	$('body').on('piwik:changePosition', '.piwik-donate-slider', function(e, data) {
+		moveSliderPosition(this, data.position);
+	});
+});
+
+}(jQuery));
diff --git a/plugins/CoreHome/templates/donate.tpl b/plugins/CoreHome/templates/donate.tpl
new file mode 100755
index 0000000000..87477bf125
--- /dev/null
+++ b/plugins/CoreHome/templates/donate.tpl
@@ -0,0 +1,61 @@
+<div class="piwik-donate-call">
+	<div class="piwik-donate-message">
+		{if isset($msg)}
+			{$msg}
+		{else}
+		<p>{'CoreHome_DonateCall1'|translate}</p>
+		<p><strong><em>{'CoreHome_DonateCall2'|translate}</em></strong></p>
+		<p>{'CoreHome_DonateCall3'|translate:'<em><strong>':'</strong></em>'}:</p>
+		{/if}
+	</div>
+	
+	<span id="piwik-worth">{'CoreHome_HowMuchIsPiwikWorth'|translate}</span>
+	<div class="donate-form-instructions">({'CoreHome_DonateFormInstructions'|translate})</div>
+	
+	<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_blank">
+		<input type="hidden" name="cmd" value="_s-xclick"/>
+		<input type="hidden" name="hosted_button_id" value="DVKLY73RS7JTE"/>
+		<input type="hidden" name="currency_code" value="USD"/>
+		<input type="hidden" name="on0" value="Piwik Supporter"/>
+		
+		<div class="piwik-donate-slider">
+			 <div class="slider-range">
+			 	<div class="slider-position"></div>
+			 </div>
+			 <div style="display:inline-block">
+				 <div class="slider-donate-amount">$30/{'CoreHome_YearShort_js'|translate}</div>
+			 
+				 <img class="slider-smiley-face" width="40" height="40" src="themes/default/images/smileyprog_1.png"/>
+			 </div>
+			 
+			 <input type="hidden" name="os0" value="Option 1"/>
+		</div>
+		
+		<div class="donate-submit">
+			<a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=RPL23NJURMTFA&bb2_screener_=1357583494+83.233.186.82" target="_blank">{'CoreHome_MakeOneTimeDonation'|translate}</a>
+			<input type="image" src="themes/default/images/paypal_subscribe.gif" border="0" name="submit" title="{'CoreHome_SubscribeAndBecomePiwikSupporter'|translate}"/>
+		</div>
+		
+		<!-- to cache images -->
+		<img style="display:none" src="themes/default/images/smileyprog_0.png"/>
+		<img style="display:none" src="themes/default/images/smileyprog_1.png"/>
+		<img style="display:none" src="themes/default/images/smileyprog_2.png"/>
+		<img style="display:none" src="themes/default/images/smileyprog_3.png"/>
+		<img style="display:none" src="themes/default/images/smileyprog_4.png"/>
+	</form>
+	{if isset($footerMessage)}
+	<div class="form-description">
+		{$footerMessage}
+	</div>
+	{/if}
+</div>
+{literal}
+<script type="text/javascript">
+$(document).ready(function() {
+	// Note: this will cause problems if more than one donate form is on the page
+	$('.piwik-donate-slider').each(function() {
+		$(this).trigger('piwik:changePosition', {position: 1});
+	});
+});
+</script>
+{/literal}
diff --git a/plugins/CoreUpdater/templates/header.tpl b/plugins/CoreUpdater/templates/header.tpl
index 06e39f8b2e..65670a7728 100644
--- a/plugins/CoreUpdater/templates/header.tpl
+++ b/plugins/CoreUpdater/templates/header.tpl
@@ -9,6 +9,8 @@
 	<link rel="stylesheet" type="text/css" href="themes/default/simple_structure.css" />
 	<link rel="stylesheet" type="text/css" href="libs/jquery/themes/base/jquery-ui.css" />
 	<link rel="stylesheet" type="text/css" href="themes/default/styles.css" />
+	<link rel="stylesheet" type="text/css" href="plugins/CoreHome/templates/donate.css"></link>
+	<link rel="stylesheet" type="text/css" href="plugins/CoreHome/templates/jquery.ui.autocomplete.css"></link>
 {literal}
 <style type="text/css">
 * {
@@ -20,14 +22,20 @@
         font-size:13px;
         line-height:1.33;
 }
+
+#donate-form-container {
+	margin: 0 0 2em 2em;
+}
 </style>
 {/literal}
 
 	<script type="text/javascript" src="libs/jquery/jquery.js"></script>
 	<script type="text/javascript" src="libs/jquery/jquery-ui.js"></script>
+	<script type="text/javascript" src="plugins/CoreHome/templates/donate.js"></script>
 {if 'General_LayoutDirection'|translate =='rtl'}
 <link rel="stylesheet" type="text/css" href="themes/default/rtl.css" />
 {/if}
+{loadJavascriptTranslations plugins='CoreHome'}
 </head>
 <body id="simple">
 <div id="contentsimple">
diff --git a/plugins/CoreUpdater/templates/update_database_done.tpl b/plugins/CoreUpdater/templates/update_database_done.tpl
index 585b85ad6a..649321c57f 100644
--- a/plugins/CoreUpdater/templates/update_database_done.tpl
+++ b/plugins/CoreUpdater/templates/update_database_done.tpl
@@ -51,6 +51,10 @@
 		</p>
 	{else}
 		<p class="success">{'CoreUpdater_PiwikHasBeenSuccessfullyUpgraded'|translate}</p>
+		
+		<div id="donate-form-container">
+			{include file="CoreHome/templates/donate.tpl"}
+		</div>
 	{/if}
 
 	<form action="index.php">
diff --git a/plugins/Dashboard/Controller.php b/plugins/Dashboard/Controller.php
index ba29b8dbb8..4d42a6b88a 100644
--- a/plugins/Dashboard/Controller.php
+++ b/plugins/Dashboard/Controller.php
@@ -364,6 +364,13 @@ class Piwik_Dashboard_Controller extends Piwik_Controller
         $defaultLayout = $this->_getLayoutForUser('', 1);
 
         if (empty($defaultLayout)) {
+        	$donateWidget = '';
+        	if (Piwik::isUserIsSuperUser())
+        	{
+        		$donateWidget = '{"uniqueId":"widgetCoreHomegetDonateForm",'
+        					  .  '"parameters":{"module":"CoreHome","action":"getDonateForm"}},';
+        	}
+        	
             $defaultLayout = '[
                 [
                     {"uniqueId":"widgetVisitsSummarygetEvolutionGraphcolumnsArray","parameters":{"module":"VisitsSummary","action":"getEvolutionGraph","columns":"nb_visits"}},
@@ -371,6 +378,7 @@ class Piwik_Dashboard_Controller extends Piwik_Controller
                     {"uniqueId":"widgetVisitorInterestgetNumberOfVisitsPerVisitDuration","parameters":{"module":"VisitorInterest","action":"getNumberOfVisitsPerVisitDuration"}}
                 ],
                 [
+                	'.$donateWidget.'
                     {"uniqueId":"widgetReferersgetKeywords","parameters":{"module":"Referers","action":"getKeywords"}},
                     {"uniqueId":"widgetReferersgetWebsites","parameters":{"module":"Referers","action":"getWebsites"}}
                 ],
diff --git a/plugins/Feedback/templates/index.tpl b/plugins/Feedback/templates/index.tpl
index a07c75f3bd..0794ad1e2c 100644
--- a/plugins/Feedback/templates/index.tpl
+++ b/plugins/Feedback/templates/index.tpl
@@ -39,6 +39,10 @@ $(function() {
     <br />
     <p><strong>{'Feedback_SpecialRequest'|translate}</strong></p>
     <p> &bull;  <a target='_blank' href="#" id="feedback-contact">{'Feedback_ContactThePiwikTeam'|translate}</a></p>
+    <br/>
+    <p><strong>{'Feedback_WantToThankConsiderDonating'|translate}</strong></p>
+    <br/>
+    {include file="CoreHome/templates/donate.tpl" msg=""}
   </div>
   <div id="feedback-form" style="display:none;">
     <form method="post" action="index.php?module=Feedback&action=sendFeedback">