From e75bc5d39a35c389ab9d196d67848629a3200ce6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.com>
Date: Fri, 5 May 2017 08:56:19 +0200
Subject: [PATCH] docs: added templating docs link to app

---
 docs/sources/reference/templating.md          |  4 ++--
 .../features/templating/partials/editor.html  | 22 ++++++++++++++++++-
 2 files changed, 23 insertions(+), 3 deletions(-)

diff --git a/docs/sources/reference/templating.md b/docs/sources/reference/templating.md
index 7fa71989570..0405251f44d 100644
--- a/docs/sources/reference/templating.md
+++ b/docs/sources/reference/templating.md
@@ -90,8 +90,8 @@ The query expressions are different for each data source.
 - [Prometheus templating queries]({{< relref "features/datasources/prometheus.md#templating" >}})
 - [OpenTSDB templating queries]({{< relref "features/datasources/prometheus.md#templating" >}})
 
-One thing to note is that query expressions can contain references to other variables and in effect create depend & nested
-variables. Grafana will detect this and automatically refresh a variable when one of it's containing variables change.
+One thing to note is that query expressions can contain references to other variables and in effect create linked variables.
+Grafana will detect this and automatically refresh a variable when one of it's containing variables change.
 
 ## Selection Options
 
diff --git a/public/app/features/templating/partials/editor.html b/public/app/features/templating/partials/editor.html
index a0683debc5c..59e304278f7 100644
--- a/public/app/features/templating/partials/editor.html
+++ b/public/app/features/templating/partials/editor.html
@@ -17,6 +17,11 @@
       </li>
       <li class="gf-tabs-item" ng-show="mode === 'new'">
         <span class="active gf-tabs-link">New</span>
+      </li>
+			<li class="gf-tabs-item" >
+        <a class="gf-tabs-link" ng-click="mode = 'help';" ng-class="{active: mode === 'help'}">
+          Help
+        </a>
       </li>
     </ul>
 
@@ -30,7 +35,8 @@
     <div ng-if="mode === 'list'">
       <div ng-if="variables.length === 0">
         <em>No template variables defined</em>
-      </div>
+        <br /> <br />
+			</div>
       <table class="grafana-options-table">
         <tr ng-repeat="variable in variables">
           <td style="width: 1%">
@@ -64,6 +70,20 @@
       </table>
     </div>
 
+    <div ng-show="mode === 'help'">
+			<div class="grafana-info-box col-lg-8">
+				<h3 class="page-heading">What does templating do?</h3>
+				<p>Templating allows for more interactive and dynamic dashboards. Instead of hard-coding things like server, application
+				and sensor name in you metric queries you can use variables in their place. Variables are shown as dropdown select boxes at the top of
+				the dashboard. These dropdowns make it easy to change the data being displayed in your dashboard.
+				<br>
+				<br>
+
+				Checkout the <a class="external-link" target="_blank" href="http://docs.grafana.org/reference/templating/">Templating documentation</a> for more information.
+				</p>
+			</div>
+		</div>
+
     <div class="gf-form" ng-show="mode === 'list'">
       <div class="gf-form-button-row">
         <a type="button" class="btn gf-form-button btn-success" ng-click="mode = 'new';"><i class="fa fa-plus" ></i>&nbsp;&nbsp;New</a>