feat(alerting): list all series in alert email

emails/templates/alert_notification.html

@@ -6,7 +6,7 @@
 			<table class="twelve columns">
 				<tr>
 					<td class="center">
-						<h3 style="text-align:center;color: [[.SeverityColor]]; font-weight: bold;">[[.Title]]</h3>
+						<h3 style="/*text-align:center*/;color: [[.SeverityColor]]; font-weight: bold;">[[.Title]]</h3>
 					</td>
 				</tr>
 			</table>
@@ -20,12 +20,46 @@
 			<table class="twelve columns">
 				<tr>
                     <td class="center">
-                        <p style="text-align:center">[[.Message]]</p>
+                        <p style="/*text-align:center*/">[[.Message]]</p>
 					</td>
 				</tr>
 			</table>
 		</td>
 	</tr>
+</table>
+
+[[if ne .State "ok" ]]
+<table class="row" >
+	<tr>
+        <td class="wrapper last">
+			<center>
+			<table class="twelve columns" >
+				<tr>
+					<td class="wrapper last" style="font-weight: bold;">
+						Metric name
+					</td>
+					<td style="font-weight: bold;">
+						Value
+					</td>
+				</tr>
+				[[range .Events]]
+				<tr>
+					<td class="wrapper last">
+						[[.Metric]]
+					</td>
+					<td>
+						[[.Value]]
+					</td>
+				</tr>
+				[[end]]
+			</table>
+			</center>
+		</td>
+	</tr>
+</table>
+[[end]]
+
+<table class="row" >
     <tr>
 		<td class="wrapper last">
 			<table class="twelve columns">
@@ -39,6 +73,7 @@
 	</tr>
 </table>
 
+
 <table class="row">
 	<tr>
 		<td class="wrapper last">

pkg/services/alerting/notifiers/email.go

@@ -55,9 +55,11 @@ func (this *EmailNotifier) Notify(context *alerting.EvalContext) {
 			"Name":          context.Rule.Name,
 			"Severity":      context.Rule.Severity,
 			"SeverityColor": context.GetColor(),
+			"Message":       context.Rule.Message,
 			"RuleUrl":       ruleUrl,
 			"ImageLink":     context.ImagePublicUrl,
 			"AlertPageUrl":  setting.AppUrl + "alerting",
+			"Events":        context.Events,
 		},
 		To:       this.Addresses,
 		Template: "alert_notification.html",

pkg/services/notifications/send_email_integration_test.go

@@ -34,12 +34,22 @@ func TestEmailIntegrationTest(t *testing.T) {
 					"Title":         "[CRITICAL] Imaginary timeserie alert",
 					"State":         "Firing",
 					"Name":          "Imaginary timeserie alert",
-					"Severity":      "Critical",
+					"Severity":      "ok",
+					"SeverityColor": "#D63232",
 					"Message":       "Alert message that will support markdown in some distant future.",
 					"RuleUrl":       "http://localhost:3000/dashboard/db/graphite-dashboard",
-					"AlertPageUrl":  "http://localhost:3000/alerting",
 					"ImageLink":     "http://localhost:3000/render/dashboard-solo/db/graphite-dashboard?panelId=1&from=1471008499616&to=1471012099617&width=1000&height=500",
-					"SeverityColor": "#D63232",
+					"AlertPageUrl":  "http://localhost:3000/alerting",
+					"Events": []map[string]string{
+						{
+							"Metric": "desktop",
+							"Value":  "40",
+						},
+						{
+							"Metric": "mobile",
+							"Value":  "20",
+						},
+					},
 				},
 				To:       []string{"asdf@asdf.com "},
 				Template: "alert_notification.html",

public/emails/alert_notification.html

@@ -121,7 +121,7 @@ color: #FFFFFF !important;
 			<table class="twelve columns" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: left; vertical-align: top; width: 580px">
 				<tr style="padding: 0; text-align: left; vertical-align: top" align="left">
 					<td class="center" style="-moz-hyphens: auto; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 0px 0px 10px; text-align: center; vertical-align: top; word-break: break-word" align="center" valign="top">
-						<h3 style="-webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none; color: {{.SeverityColor}}; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 22px; font-weight: bold; line-height: 1.3; margin: 20px 0 0; padding: 0; text-align: center; word-break: normal" align="center">{{.Title}}</h3>
+						<h3 style="-webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none; /*text-align: center*/; color: {{.SeverityColor}}; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 22px; font-weight: bold; line-height: 1.3; margin: 20px 0 0; padding: 0; text-align: left; word-break: normal" align="left">{{.Title}}</h3>
 					</td>
 				</tr>
 			</table>
@@ -135,12 +135,46 @@ color: #FFFFFF !important;
 			<table class="twelve columns" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: left; vertical-align: top; width: 580px">
 				<tr style="padding: 0; text-align: left; vertical-align: top" align="left">
                     <td class="center" style="-moz-hyphens: auto; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 0px 0px 10px; text-align: center; vertical-align: top; word-break: break-word" align="center" valign="top">
-                        <p style="-webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; line-height: 19px; margin: 0 0 10px; padding: 0; text-align: center" align="center">{{.Message}}</p>
+                        <p style="-webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none; /*text-align: center*/; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; line-height: 19px; margin: 0 0 10px; padding: 0; text-align: left" align="left">{{.Message}}</p>
 					</td>
 				</tr>
 			</table>
 		</td>
 	</tr>
+</table>
+
+{{if ne .State "ok" }}
+<table class="row" style="border-collapse: collapse; border-spacing: 0; display: block; padding: 0px; position: relative; text-align: left; vertical-align: top; width: 100%">
+	<tr style="padding: 0; text-align: left; vertical-align: top" align="left">
+        <td class="wrapper last" style="-moz-hyphens: auto; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 10px 0px 0px; position: relative; text-align: left; vertical-align: top; word-break: break-word" align="left" valign="top">
+			<center style="min-width: 580px; width: 100%">
+			<table class="twelve columns" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: left; vertical-align: top; width: 580px">
+				<tr style="padding: 0; text-align: left; vertical-align: top" align="left">
+					<td class="wrapper last" style="-moz-hyphens: auto; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: bold; hyphens: auto; line-height: 19px; margin: 0; padding: 0px 0px 10px; position: relative; text-align: left; vertical-align: top; word-break: break-word" align="left" valign="top">
+						Metric name
+					</td>
+					<td style="-moz-hyphens: auto; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: bold; hyphens: auto; line-height: 19px; margin: 0; padding: 0px 0px 10px; text-align: left; vertical-align: top; word-break: break-word" align="left" valign="top">
+						Value
+					</td>
+				</tr>
+				{{range .Events}}
+				<tr style="padding: 0; text-align: left; vertical-align: top" align="left">
+					<td class="wrapper last" style="-moz-hyphens: auto; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 0px 0px 10px; position: relative; text-align: left; vertical-align: top; word-break: break-word" align="left" valign="top">
+						{{.Metric}}
+					</td>
+					<td style="-moz-hyphens: auto; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 0px 0px 10px; text-align: left; vertical-align: top; word-break: break-word" align="left" valign="top">
+						{{.Value}}
+					</td>
+				</tr>
+				{{end}}
+			</table>
+			</center>
+		</td>
+	</tr>
+</table>
+{{end}}
+
+<table class="row" style="border-collapse: collapse; border-spacing: 0; display: block; padding: 0px; position: relative; text-align: left; vertical-align: top; width: 100%">
     <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
 		<td class="wrapper last" style="-moz-hyphens: auto; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 10px 0px 0px; position: relative; text-align: left; vertical-align: top; word-break: break-word" align="left" valign="top">
 			<table class="twelve columns" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: left; vertical-align: top; width: 580px">
@@ -154,6 +188,7 @@ color: #FFFFFF !important;
 	</tr>
 </table>
 
+
 <table class="row" style="border-collapse: collapse; border-spacing: 0; display: block; padding: 0px; position: relative; text-align: left; vertical-align: top; width: 100%">
 	<tr style="padding: 0; text-align: left; vertical-align: top" align="left">
 		<td class="wrapper last" style="-moz-hyphens: auto; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 10px 0px 0px; position: relative; text-align: left; vertical-align: top; word-break: break-word" align="left" valign="top">