mountain-goat 0.0.4 → 0.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/lib/flotilla.rb +169 -0
- data/lib/mountain_goat/controllers/mountain_goat/mountain_goat_controller.rb +11 -1
- data/lib/mountain_goat/metric_tracking.rb +2 -1
- data/lib/mountain_goat/public/containerbg.png +0 -0
- data/lib/mountain_goat/public/dirtyred.png +0 -0
- data/lib/mountain_goat/public/dottedblack.png +0 -0
- data/lib/mountain_goat/public/dottedblue.png +0 -0
- data/lib/mountain_goat/public/jquery.flot.js +2615 -0
- data/lib/mountain_goat/public/mg.css +334 -0
- data/lib/mountain_goat/public/mg.png +0 -0
- data/lib/mountain_goat/public/raster.png +0 -0
- data/lib/mountain_goat/version.rb +1 -1
- data/lib/mountain_goat/views/mountain_goat/layouts/.tmp_mountain_goat.html.erb.2801~ +53 -0
- data/lib/mountain_goat/views/mountain_goat/layouts/mountain_goat.html.erb +16 -21
- data/lib/mountain_goat/views/mountain_goat/mountain_goat_converts/.tmp_index.html.erb.67861~ +33 -0
- data/lib/mountain_goat/views/mountain_goat/mountain_goat_converts/.tmp_index.html.erb.97796~ +49 -0
- data/lib/mountain_goat/views/mountain_goat/mountain_goat_converts/index.html.erb +37 -21
- data/lib/mountain_goat/views/mountain_goat/mountain_goat_metric_variants/.tmp_show.html.erb.24381~ +14 -0
- data/lib/mountain_goat/views/mountain_goat/mountain_goat_metrics/.tmp_show.html.erb.21427~ +59 -0
- data/lib/mountain_goat/views/mountain_goat/mountain_goat_metrics/.tmp_show.html.erb.65988~ +59 -0
- data/lib/mountain_goat/views/mountain_goat/mountain_goat_metrics/show.html.erb +49 -36
- data/mountain-goat-0.0.3.gem +0 -0
- data/mountain-goat-0.0.4.gem +0 -0
- metadata +21 -4
|
@@ -0,0 +1,334 @@
|
|
|
1
|
+
|
|
2
|
+
body {
|
|
3
|
+
color: #666666;
|
|
4
|
+
margin: 0px;
|
|
5
|
+
padding: 0px;
|
|
6
|
+
text-decoration: none;
|
|
7
|
+
background: rgb(167,207,223); /* Old browsers */
|
|
8
|
+
background: -moz-linear-gradient(top, rgba(167,207,223,1) 0%, rgba(35,83,138,1) 100%); /* FF3.6+ */
|
|
9
|
+
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(167,207,223,1)), color-stop(100%,rgba(35,83,138,1))); /* Chrome,Safari4+ */
|
|
10
|
+
background: -webkit-linear-gradient(top, rgba(167,207,223,1) 0%,rgba(35,83,138,1) 100%); /* Chrome10+,Safari5.1+ */
|
|
11
|
+
background: -o-linear-gradient(top, rgba(167,207,223,1) 0%,rgba(35,83,138,1) 100%); /* Opera11.10+ */
|
|
12
|
+
background: -ms-linear-gradient(top, rgba(167,207,223,1) 0%,rgba(35,83,138,1) 100%); /* IE10+ */
|
|
13
|
+
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a7cfdf', endColorstr='#23538a',GradientType=0 ); /* IE6-9 */
|
|
14
|
+
background: linear-gradient(top, rgba(167,207,223,1) 0%,rgba(35,83,138,1) 100%); /* W3C */
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
body, select, pre {
|
|
18
|
+
font: 14px/20px Calibri,Helvetica,Arial;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
a {
|
|
22
|
+
color: #fff;
|
|
23
|
+
text-decoration: none;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
a:hover {
|
|
27
|
+
color: #000;
|
|
28
|
+
text-decoration: underline;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
.header {
|
|
32
|
+
top: 0;
|
|
33
|
+
width: 100%;
|
|
34
|
+
position: fixed;
|
|
35
|
+
height: 107px;
|
|
36
|
+
background-color: rgba(2,2,2,0.7);
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
.header .head {
|
|
40
|
+
width: 900px;
|
|
41
|
+
margin: 0 auto;
|
|
42
|
+
height: 107px;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
.header ul.nav {
|
|
46
|
+
margin: 0;
|
|
47
|
+
float: right;
|
|
48
|
+
height: 100%;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
.header ul.nav li {
|
|
52
|
+
float: left;
|
|
53
|
+
list-style: none outside none;
|
|
54
|
+
width: 140px;
|
|
55
|
+
box-shadow: 0px 0px 3px rgba(222,222,222,0.2) inset;
|
|
56
|
+
height: 107px;
|
|
57
|
+
margin-right: -1px;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
.header ul.nav li:hover {
|
|
61
|
+
background-color: #FF2800;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
.header ul.nav li > a{
|
|
65
|
+
display: block;
|
|
66
|
+
font-size: 24px;
|
|
67
|
+
padding: 42px 0px;
|
|
68
|
+
width: 100%;
|
|
69
|
+
vertical-align: baseline;
|
|
70
|
+
text-align: center;
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
.content {
|
|
74
|
+
margin: 0 auto 0 auto;
|
|
75
|
+
width: 1010px;
|
|
76
|
+
padding: 117px 0 0 0;
|
|
77
|
+
background-color: rgba(50,50,50,0.2);
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
.content .content-inner {
|
|
81
|
+
margin: 15px 25px 0px 25px;
|
|
82
|
+
background: url(/mg/public/containerbg_png);
|
|
83
|
+
min-height: 520px;
|
|
84
|
+
padding: 30px;
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
h1 {
|
|
88
|
+
padding: 6px 18px;
|
|
89
|
+
width: 500px;
|
|
90
|
+
margin: 10px auto 10px auto;
|
|
91
|
+
background: url(/mg/public/dottedblack_png) repeat;
|
|
92
|
+
font-size: 30px;
|
|
93
|
+
color: white;
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
/* The Converts Page */
|
|
97
|
+
|
|
98
|
+
.conversions .explanation {
|
|
99
|
+
display: block;
|
|
100
|
+
width: 33%;
|
|
101
|
+
margin: 40px;
|
|
102
|
+
padding-right: 40px;
|
|
103
|
+
border-right: 1px solid black;
|
|
104
|
+
float: left;
|
|
105
|
+
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
.conversions .explanation .inner {
|
|
109
|
+
color: #fff;
|
|
110
|
+
font-size: 18px;
|
|
111
|
+
display: block;
|
|
112
|
+
background: url(/mg/public/dirtyred_png) repeat;
|
|
113
|
+
padding: 30px;
|
|
114
|
+
width: 80%;
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
.conversions .converts {
|
|
118
|
+
width: 40%;
|
|
119
|
+
float: left;
|
|
120
|
+
margin-top: 50px;
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
.conversions .converts h2 {
|
|
124
|
+
padding: 6px 18px;
|
|
125
|
+
width: 40%;
|
|
126
|
+
margin: 10px auto 10px auto;
|
|
127
|
+
background: url(/mg/public/dirtyred_png) repeat;
|
|
128
|
+
font-size: 30px;
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
.metric-category {
|
|
132
|
+
width: 100%;
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
.mt-metrics .metric-category {
|
|
136
|
+
padding: 50px 0;
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
.metric-category .metric a{
|
|
140
|
+
display: block;
|
|
141
|
+
width: 70%;
|
|
142
|
+
color: #000;
|
|
143
|
+
font-size: 18px;
|
|
144
|
+
font-weight: bold;
|
|
145
|
+
margin-bottom: 5px;
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
.metric-category .item.rate {
|
|
149
|
+
width: 400px;
|
|
150
|
+
height: 40px;
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
.metric-category .item.rate .rate-holder{
|
|
154
|
+
display: block;
|
|
155
|
+
width: 70%;
|
|
156
|
+
background: rgba(20, 20, 20, 0.2);
|
|
157
|
+
height: 30px;
|
|
158
|
+
float: left;
|
|
159
|
+
overflow: hidden;
|
|
160
|
+
}
|
|
161
|
+
|
|
162
|
+
.metric-category .item.rate .title{
|
|
163
|
+
position: relative;
|
|
164
|
+
left: 0px;
|
|
165
|
+
float: left;
|
|
166
|
+
z-index: 5;
|
|
167
|
+
padding: 3px;
|
|
168
|
+
}
|
|
169
|
+
|
|
170
|
+
.metric-category .item.rate .rates{
|
|
171
|
+
height: 100%;
|
|
172
|
+
display: block;
|
|
173
|
+
background: url(/mg/public/dottedblue_png) repeat;
|
|
174
|
+
z-index: 1;
|
|
175
|
+
}
|
|
176
|
+
|
|
177
|
+
.metric-category .item.rate .percent-holder {
|
|
178
|
+
float: left;
|
|
179
|
+
margin-left: 30px;
|
|
180
|
+
}
|
|
181
|
+
|
|
182
|
+
.content ul.nav {
|
|
183
|
+
margin: 0;
|
|
184
|
+
width: 100%;
|
|
185
|
+
height: 50px;
|
|
186
|
+
}
|
|
187
|
+
|
|
188
|
+
.content ul.nav li {
|
|
189
|
+
color: white;
|
|
190
|
+
float: left;
|
|
191
|
+
list-style: none outside none;
|
|
192
|
+
width: 170px;
|
|
193
|
+
height: 30px;
|
|
194
|
+
font-size: 20px;
|
|
195
|
+
box-shadow: 0px 0px 3px rgba(222,222,222,0.2) inset;
|
|
196
|
+
margin-right: 6px;
|
|
197
|
+
background-color: red;
|
|
198
|
+
padding-left: 10px;
|
|
199
|
+
padding-top: 10px;
|
|
200
|
+
border-radius: 5px;
|
|
201
|
+
box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);
|
|
202
|
+
text-shadow: 0 0 4px #333333;
|
|
203
|
+
background: -moz-linear-gradient(center top , #6699CC, #3366AA) repeat scroll 0 0 transparent;
|
|
204
|
+
}
|
|
205
|
+
|
|
206
|
+
.button {
|
|
207
|
+
display: block;
|
|
208
|
+
color: white;
|
|
209
|
+
width: 170px;
|
|
210
|
+
height: 30px;
|
|
211
|
+
font-size: 20px;
|
|
212
|
+
box-shadow: 0px 0px 3px rgba(222,222,222,0.2) inset;
|
|
213
|
+
margin-right: 6px;
|
|
214
|
+
background-color: red;
|
|
215
|
+
padding-left: 10px;
|
|
216
|
+
padding-top: 10px;
|
|
217
|
+
border-radius: 5px;
|
|
218
|
+
box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);
|
|
219
|
+
text-shadow: 0 0 4px #333333;
|
|
220
|
+
background: -moz-linear-gradient(center top , #6699CC, #3366AA) repeat scroll 0 0 transparent;
|
|
221
|
+
}
|
|
222
|
+
|
|
223
|
+
.actions {
|
|
224
|
+
height: 50px;
|
|
225
|
+
width: 400px;
|
|
226
|
+
margin: 50px auto;
|
|
227
|
+
}
|
|
228
|
+
|
|
229
|
+
.actions .button {
|
|
230
|
+
float: left;
|
|
231
|
+
}
|
|
232
|
+
|
|
233
|
+
/* ANALYTICS */
|
|
234
|
+
.statboard{
|
|
235
|
+
float: left;
|
|
236
|
+
background: rgb(30,30,30);
|
|
237
|
+
background: rgba(0,0,0,.9);
|
|
238
|
+
|
|
239
|
+
width: 900px;
|
|
240
|
+
margin: 0px 0px 0px 40px;
|
|
241
|
+
padding: 0px 10px 10px 10px;
|
|
242
|
+
color: #D6D6D6;
|
|
243
|
+
}
|
|
244
|
+
.stat-header, .statpad .title, .statpad .statbody{
|
|
245
|
+
background: #222222;
|
|
246
|
+
border-top: 1px solid #333333;
|
|
247
|
+
border-bottom: 1px solid #151617;
|
|
248
|
+
}
|
|
249
|
+
.stat-header, .statpad, .statnote{
|
|
250
|
+
box-shadow: 2px 0 3px #0D0D0D, -2px 0 3px #0D0D0D, 0 3px 3px #0D0D0D, 0 -2px 3px #0D0D0D;
|
|
251
|
+
}
|
|
252
|
+
.stat-header{
|
|
253
|
+
float: left;
|
|
254
|
+
width: 100%;
|
|
255
|
+
height: 50px;
|
|
256
|
+
line-height: 50px;
|
|
257
|
+
margin: 10px 0px 0px 0px;
|
|
258
|
+
font-size: 30px;
|
|
259
|
+
text-align: center;
|
|
260
|
+
}
|
|
261
|
+
.statpad{
|
|
262
|
+
float: left;
|
|
263
|
+
width: 445px;
|
|
264
|
+
margin-top: 10px;
|
|
265
|
+
|
|
266
|
+
}
|
|
267
|
+
.statpad .title{
|
|
268
|
+
float: left;
|
|
269
|
+
width: 100%;
|
|
270
|
+
padding: 3px 0px;
|
|
271
|
+
font-size: 17px;
|
|
272
|
+
text-align: center;
|
|
273
|
+
}
|
|
274
|
+
.statpad .statbody{
|
|
275
|
+
float: left;
|
|
276
|
+
width: 425px;
|
|
277
|
+
height: 260px;
|
|
278
|
+
padding: 10px;
|
|
279
|
+
}
|
|
280
|
+
.statpads >:nth-child(2n+1) {
|
|
281
|
+
margin-right: 10px;
|
|
282
|
+
}
|
|
283
|
+
.statbody.pie{
|
|
284
|
+
width: 345px;
|
|
285
|
+
padding-left: 90px;
|
|
286
|
+
}
|
|
287
|
+
.statbody.pie .legend{
|
|
288
|
+
display: none;
|
|
289
|
+
}
|
|
290
|
+
|
|
291
|
+
.quad.statpad{
|
|
292
|
+
box-shadow: none;
|
|
293
|
+
}
|
|
294
|
+
.statnote {
|
|
295
|
+
float: left;
|
|
296
|
+
width: 220px;
|
|
297
|
+
}
|
|
298
|
+
.statnote .statbody {
|
|
299
|
+
width: 200px;
|
|
300
|
+
height: 100px;
|
|
301
|
+
line-height: 100px;
|
|
302
|
+
text-align: center;
|
|
303
|
+
font-size: 70px;
|
|
304
|
+
font-family: Arial,Helvetica,sans-serif;
|
|
305
|
+
text-shadow: 1px 1px 1px #3F3F3F, -1px -1px 1px #3F3F3F;
|
|
306
|
+
}
|
|
307
|
+
.quad.statpad > *:nth-child(2n+1) {
|
|
308
|
+
margin-right: 5px;
|
|
309
|
+
}
|
|
310
|
+
.quad.statpad > *:nth-child(3), .quad.statpad > *:nth-child(4) {
|
|
311
|
+
margin-top: 10px;
|
|
312
|
+
}
|
|
313
|
+
.statbody.attendance{
|
|
314
|
+
color: #99DD66;
|
|
315
|
+
}
|
|
316
|
+
.statbody.views{
|
|
317
|
+
color: #DDDD66;
|
|
318
|
+
}
|
|
319
|
+
.statbody.interactions{
|
|
320
|
+
color: #6666DD;
|
|
321
|
+
}
|
|
322
|
+
.statbody.remaining{
|
|
323
|
+
color: #DD6666;
|
|
324
|
+
}
|
|
325
|
+
|
|
326
|
+
.legendLabel{
|
|
327
|
+
width: 150px;
|
|
328
|
+
padding-left: 3px;
|
|
329
|
+
font-size: 12px;
|
|
330
|
+
}
|
|
331
|
+
.asterisk{
|
|
332
|
+
font-size: 12px;
|
|
333
|
+
}
|
|
334
|
+
|
|
Binary file
|
|
Binary file
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
|
2
|
+
|
|
3
|
+
<% is_mobile = false if local_assigns[:is_mobile].nil? %>
|
|
4
|
+
|
|
5
|
+
<html xmlns="http://www.w3.org/1999/xhtml">
|
|
6
|
+
|
|
7
|
+
<head>
|
|
8
|
+
<title>Mountain Goat <% if @title %> - <%=h @title %><% end %></title>
|
|
9
|
+
|
|
10
|
+
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
|
11
|
+
|
|
12
|
+
<%# These are mobile specific settings. We are disabling zooming and fixing the width. %>
|
|
13
|
+
<meta content='True' name='HandheldFriendly' />
|
|
14
|
+
<!--<meta content='width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;' name='viewport' />-->
|
|
15
|
+
<meta name="viewport" content="width=device-width" />
|
|
16
|
+
|
|
17
|
+
|
|
18
|
+
</head>
|
|
19
|
+
|
|
20
|
+
<body>
|
|
21
|
+
|
|
22
|
+
<% if !flash[:message].blank? %>
|
|
23
|
+
<div class="ocelot-flash message">
|
|
24
|
+
<div class="message"><%= flash[:message] %></div>
|
|
25
|
+
</div>
|
|
26
|
+
<% end %>
|
|
27
|
+
|
|
28
|
+
<% if !flash[:model].blank? %>
|
|
29
|
+
<div class="ocelot-flash-model model">
|
|
30
|
+
<div class="jqmWindow" id="dialog">
|
|
31
|
+
<a href="#" class="jqmClose">Close</a>
|
|
32
|
+
<div class="model"><%= flash[:model] %></div>
|
|
33
|
+
</div>
|
|
34
|
+
</div>
|
|
35
|
+
<% end %>
|
|
36
|
+
|
|
37
|
+
<% if !flash[:notice].blank? || !flash[:error].blank? %>
|
|
38
|
+
<div class="ocelot-flash">
|
|
39
|
+
<% if !flash[:error].blank? %><div class="error"><%= flash[:error] %></div><% end %>
|
|
40
|
+
<% if !flash[:notice].blank? %><div class="notice"><%= flash[:notice] %></div><% end %>
|
|
41
|
+
</div>
|
|
42
|
+
<% end %>
|
|
43
|
+
|
|
44
|
+
<div id="ocelot-main">
|
|
45
|
+
<%= yield %>
|
|
46
|
+
|
|
47
|
+
<div id="container-footer">
|
|
48
|
+
|
|
49
|
+
</div>
|
|
50
|
+
</div>
|
|
51
|
+
</body>
|
|
52
|
+
|
|
53
|
+
</html>
|
|
@@ -14,6 +14,8 @@
|
|
|
14
14
|
<!--<meta content='width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;' name='viewport' />-->
|
|
15
15
|
<meta name="viewport" content="width=device-width" />
|
|
16
16
|
|
|
17
|
+
<link rel="stylesheet" href="/mg/public/mg_css" type="text/css" />
|
|
18
|
+
|
|
17
19
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
|
|
18
20
|
<script src="/mg/public/jquery_flot_js" type="text/javascript"></script>
|
|
19
21
|
|
|
@@ -21,31 +23,24 @@
|
|
|
21
23
|
|
|
22
24
|
<body>
|
|
23
25
|
|
|
24
|
-
|
|
25
|
-
<div class="
|
|
26
|
-
<
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
<a href="#" class="jqmClose">Close</a>
|
|
34
|
-
<div class="model"><%= flash[:model] %></div>
|
|
35
|
-
</div>
|
|
26
|
+
<div class="header">
|
|
27
|
+
<div class="head">
|
|
28
|
+
<a href="/mg" class="logo">
|
|
29
|
+
<img src="/mg/public/mg_png" />
|
|
30
|
+
</a>
|
|
31
|
+
<ul class="nav">
|
|
32
|
+
<li><a href="<%= mountain_goat_converts_url %>">Goals</a></li>
|
|
33
|
+
<li><a href="<%= mountain_goat_metrics_url %>">Metrics</a></li>
|
|
34
|
+
</ul>
|
|
36
35
|
</div>
|
|
37
|
-
|
|
36
|
+
</div>
|
|
38
37
|
|
|
39
|
-
|
|
40
|
-
<div class="
|
|
41
|
-
|
|
42
|
-
<% if !flash[:notice].blank? %><div class="notice"><%= flash[:notice] %></div><% end %>
|
|
38
|
+
<div class="content">
|
|
39
|
+
<div class="content-inner">
|
|
40
|
+
<%= yield %>
|
|
43
41
|
</div>
|
|
44
|
-
|
|
42
|
+
</div>
|
|
45
43
|
|
|
46
|
-
<div id="ocelot-main">
|
|
47
|
-
<%= yield %>
|
|
48
|
-
|
|
49
44
|
<div id="container-footer">
|
|
50
45
|
|
|
51
46
|
</div>
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
|
|
2
|
+
|
|
3
|
+
<div id="container-main" class="mt-converts">
|
|
4
|
+
<div class="mountain-goat-panel centered">
|
|
5
|
+
|
|
6
|
+
<h2>Conversion Goals</h2>
|
|
7
|
+
<span class="explanation">Below are a list of conversion goals. Each goal has a set of metrics designed to achieve that goal. For each metric, there is a list of variants, each coupled with its conversation rate.</span>
|
|
8
|
+
<% @converts.each do |convert| %>
|
|
9
|
+
<h2><a href="<%= mountain_goat_convert_url :id => convert.id %>"><%=h convert.name %></a></h2>
|
|
10
|
+
<% convert.metrics.each do |metric| %>
|
|
11
|
+
<div class="metric-category">
|
|
12
|
+
<span class="metric"><a href="<%= mountain_goat_metric_url :id => metric.id %>"><%= metric.title %></a></span>
|
|
13
|
+
<% if metric.metric_variants.count == 0 %>
|
|
14
|
+
<span class="none">No metric variants [<a href="<%= new_mountain_goat_metric_mountain_goat_metric_variant_url :mountain_goat_metric_id => metric.id %>">Add one</a>]</span>
|
|
15
|
+
<% else %>
|
|
16
|
+
<% metric.metric_variants.each do |mv| %>
|
|
17
|
+
<div class="item rate">
|
|
18
|
+
<span class="rates"><%=h mv.name %></span>:
|
|
19
|
+
<span class="conversions"><%= mv.conversions %></span> /
|
|
20
|
+
<span class="served"><%= mv.served %></span>
|
|
21
|
+
(<span class="val"><%= number_to_percentage(mv.conversion_rate, :precision => 0) %></span>)
|
|
22
|
+
</div>
|
|
23
|
+
<% end %>
|
|
24
|
+
<% end %>
|
|
25
|
+
</div>
|
|
26
|
+
<% end %>
|
|
27
|
+
<% end %>
|
|
28
|
+
|
|
29
|
+
<div class="new">
|
|
30
|
+
<a href="<%= new_mountain_goat_convert_url %>">New conversation type</a>
|
|
31
|
+
</div>
|
|
32
|
+
</div>
|
|
33
|
+
</div>
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
|
|
2
|
+
|
|
3
|
+
<div id="container-main" class="mt-converts">
|
|
4
|
+
<div class="mountain-goat-panel centered">
|
|
5
|
+
|
|
6
|
+
<h1>Conversion Goals</h1>
|
|
7
|
+
|
|
8
|
+
<div class="conversions">
|
|
9
|
+
<div class="explanation">
|
|
10
|
+
<span class="inner">
|
|
11
|
+
Below are a list of conversion goals. Each goal has a set of metrics designed to achieve that goal. For each metric, there is a list of variants, each coupled with its conversation rate.</span>
|
|
12
|
+
</span>
|
|
13
|
+
</div>
|
|
14
|
+
|
|
15
|
+
<div class="converts">
|
|
16
|
+
<% @converts.each do |convert| %>
|
|
17
|
+
<h2><a href="<%= mountain_goat_convert_url :id => convert.id %>"><%=h convert.name %></a></h2>
|
|
18
|
+
<% convert.metrics.each do |metric| %>
|
|
19
|
+
<div class="metric-category">
|
|
20
|
+
<span class="metric"><a href="<%= mountain_goat_metric_url :id => metric.id %>"><%= metric.title %></a></span>
|
|
21
|
+
<% if metric.metric_variants.count == 0 %>
|
|
22
|
+
<span class="none">No metric variants [<a href="<%= new_mountain_goat_metric_mountain_goat_metric_variant_url :mountain_goat_metric_id => metric.id %>">Add one</a>]</span>
|
|
23
|
+
<% else %>
|
|
24
|
+
<% metric.metric_variants.each do |mv| %>
|
|
25
|
+
<div class="item rate">
|
|
26
|
+
<span class="rate-holder">
|
|
27
|
+
<span class="title"><%=h mv.name %></span>
|
|
28
|
+
<span class="rates" style="width:<%= number_to_percentage(mv.conversion_rate, :precision => 0) %>"></span>
|
|
29
|
+
</span>
|
|
30
|
+
|
|
31
|
+
<span class="percent-holder">
|
|
32
|
+
<span class="val"><%= number_to_percentage(mv.conversion_rate, :precision => 0) %></span>
|
|
33
|
+
(<span class="conversions"><%= mv.conversions %></span> /
|
|
34
|
+
<span class="served"><%= mv.served %></span>)
|
|
35
|
+
</span>
|
|
36
|
+
</div>
|
|
37
|
+
<% end %>
|
|
38
|
+
<% end %>
|
|
39
|
+
</div>
|
|
40
|
+
<% end %>
|
|
41
|
+
<% end %>
|
|
42
|
+
</div>
|
|
43
|
+
</div>
|
|
44
|
+
|
|
45
|
+
<div class="new">
|
|
46
|
+
<a href="<%= new_mountain_goat_convert_url %>">New conversation type</a>
|
|
47
|
+
</div>
|
|
48
|
+
</div>
|
|
49
|
+
</div>
|
|
@@ -3,28 +3,44 @@
|
|
|
3
3
|
<div id="container-main" class="mt-converts">
|
|
4
4
|
<div class="mountain-goat-panel centered">
|
|
5
5
|
|
|
6
|
-
<
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
<
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
6
|
+
<h1>Conversion Goals</h1>
|
|
7
|
+
|
|
8
|
+
<div class="conversions">
|
|
9
|
+
<div class="explanation">
|
|
10
|
+
<span class="inner">
|
|
11
|
+
Below are a list of conversion goals. Each goal has a set of metrics designed to achieve that goal. For each metric, there is a list of variants, each coupled with its conversation rate.</span>
|
|
12
|
+
</span>
|
|
13
|
+
</div>
|
|
14
|
+
|
|
15
|
+
<div class="converts">
|
|
16
|
+
<% @converts.each do |convert| %>
|
|
17
|
+
<h2><a href="<%= mountain_goat_convert_url :id => convert.id %>"><%=h convert.name %></a></h2>
|
|
18
|
+
<% convert.metrics.each do |metric| %>
|
|
19
|
+
<div class="metric-category">
|
|
20
|
+
<span class="metric"><a href="<%= mountain_goat_metric_url :id => metric.id %>"><%= metric.title %></a></span>
|
|
21
|
+
<% if metric.metric_variants.count == 0 %>
|
|
22
|
+
<span class="none">No metric variants [<a href="<%= new_mountain_goat_metric_mountain_goat_metric_variant_url :mountain_goat_metric_id => metric.id %>">Add one</a>]</span>
|
|
23
|
+
<% else %>
|
|
24
|
+
<% metric.metric_variants.each do |mv| %>
|
|
25
|
+
<div class="item rate">
|
|
26
|
+
<span class="rate-holder">
|
|
27
|
+
<span class="title"><a href="<%= mountain_goat_metric_variant_url mv %>"><%=h mv.name %></a></span>
|
|
28
|
+
<span class="rates" style="width:<%= number_to_percentage(mv.conversion_rate, :precision => 0) %>"></span>
|
|
29
|
+
</span>
|
|
30
|
+
|
|
31
|
+
<span class="percent-holder">
|
|
32
|
+
<span class="val"><%= number_to_percentage(mv.conversion_rate, :precision => 0) %></span>
|
|
33
|
+
(<span class="conversions"><%= mv.conversions %></span> /
|
|
34
|
+
<span class="served"><%= mv.served %></span>)
|
|
35
|
+
</span>
|
|
36
|
+
</div>
|
|
37
|
+
<% end %>
|
|
38
|
+
<% end %>
|
|
39
|
+
</div>
|
|
24
40
|
<% end %>
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
41
|
+
<% end %>
|
|
42
|
+
</div>
|
|
43
|
+
</div>
|
|
28
44
|
|
|
29
45
|
<div class="new">
|
|
30
46
|
<a href="<%= new_mountain_goat_convert_url %>">New conversation type</a>
|
data/lib/mountain_goat/views/mountain_goat/mountain_goat_metric_variants/.tmp_show.html.erb.24381~
ADDED
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
|
|
2
|
+
|
|
3
|
+
<div id="container-main" class="mt-metric-variants">
|
|
4
|
+
<div class="mountain-goat-panel cenetered">
|
|
5
|
+
<a href="<%= mountain_goat_converts_url %>">Goals</a> > <a href="<%= mountain_goat_convert_url :id => @metric_variant.metric.convert.id %>"><%=h @metric_variant.metric.convert.name %> Goal</a> > <a href="<%= mountain_goat_metric_url :id => @metric_variant.metric.id %>"><%=h @metric_variant.metric.title %></a>
|
|
6
|
+
|
|
7
|
+
<h2><%=h @metric_variant.name %></h2>
|
|
8
|
+
|
|
9
|
+
<div class="value"><%=h @metric_variant.value %></div>
|
|
10
|
+
<div class="serves-converts"><%=h @metric_variant.served %> / <%=h @metric_variant.conversions %> (<%=h number_to_percentage(@metric_variant.conversion_rate, :precision => 0) %>)</div>
|
|
11
|
+
|
|
12
|
+
<a href="<%= edit_mountain_goat_metric_variant_url :id => @metric_variant.id %>">Edit</a>
|
|
13
|
+
</div>
|
|
14
|
+
</div>
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
|
|
2
|
+
<% if !respond_to?(:chart) %>
|
|
3
|
+
<% def chart(*args); 'Please install Flotilla plugin (http://flotilla.rubyforge.org/) for charts'; end; %>
|
|
4
|
+
<% end %>
|
|
5
|
+
|
|
6
|
+
<div id="container-main" class="mt-metrics">
|
|
7
|
+
<div class="mountain-goat-panel cenetered">
|
|
8
|
+
<a href="<%= mountain_goat_converts_url %>">Goals</a> > <a href="<%= mountain_goat_convert_url :id => @metric.convert.id %>"><%=h @metric.convert.name %> Goal</a> > <span class="metric-type"><%=h @metric.metric_type %></span>
|
|
9
|
+
|
|
10
|
+
<h2><%=h @metric.title %></h2>
|
|
11
|
+
|
|
12
|
+
<div class="variants">
|
|
13
|
+
<% if @metric.metric_variants.count == 0 %>
|
|
14
|
+
<span class="none">No metric variants</span>
|
|
15
|
+
<% else %>
|
|
16
|
+
<div class="flyer-analysis countbar">
|
|
17
|
+
<div class="title">Conversion Rates</div>
|
|
18
|
+
<div class="graph">
|
|
19
|
+
<%= chart("analysis_graph#{@metric.id}",
|
|
20
|
+
{ "Served" => { :collection => @rates[:served], :x => :variant_type, :y => :value },
|
|
21
|
+
"Conversions" => { :collection => @rates[:conversions], :x => :variant_type, :y => :value } },
|
|
22
|
+
{ :xaxis => {:autoscaleMargin => 0.1, :ticks => @rates[:titles].map { |i,t| [i + 0.5, t] }.sort }, :yaxis => { :min => 0, :minTickSize => 1 }, :bars => { :show => true }, :legend => { :position => "ne" } }, :placeholder_size => "300x200") %>
|
|
23
|
+
|
|
24
|
+
</div>
|
|
25
|
+
<div class="graph">
|
|
26
|
+
<%= chart("analysis_conv_graph#{@metric.id}",
|
|
27
|
+
{ "Conversion Rate (%)" => { :collection => @rates[:conversion_rates], :x => :variant_type, :y => :value } },
|
|
28
|
+
{ :xaxis => {:autoscaleMargin => 0.1, :ticks => @rates[:titles].map { |i,t| [i + 0.5, t] }.sort }, :yaxis => { :min => 0, :minTickSize => 1 }, :bars => { :show => true }, :legend => { :position => "ne" } }, :placeholder_size => "300x200") %>
|
|
29
|
+
|
|
30
|
+
</div>
|
|
31
|
+
</div>
|
|
32
|
+
<% @metric.metric_variants.each do |mv| %>
|
|
33
|
+
<div class="metric-variant">
|
|
34
|
+
<div class="item name">
|
|
35
|
+
<span class="desc">Name</span>
|
|
36
|
+
<span class="val"><a href="<%= mountain_goat_metric_variant_url mv %>"><%= mv.name %></a> [<a href="<%= edit_mountain_goat_metric_variant_url :id => mv.id %>">Edit</a>]</span>
|
|
37
|
+
</div>
|
|
38
|
+
|
|
39
|
+
<div class="item value">
|
|
40
|
+
<span class="desc">Value</span>
|
|
41
|
+
<span class="val"><%= mv.value %></span>
|
|
42
|
+
</div>
|
|
43
|
+
|
|
44
|
+
<div class="item rate">
|
|
45
|
+
<span class="rates">Conversion:</span>
|
|
46
|
+
<span class="conversions"><%= mv.conversions %></span> /
|
|
47
|
+
<span class="served"><%= mv.served %></span>
|
|
48
|
+
(<span class="val"><%= number_to_percentage(mv.conversion_rate, :precision => 0) %></span>)
|
|
49
|
+
</div>
|
|
50
|
+
</div>
|
|
51
|
+
|
|
52
|
+
<% end %>
|
|
53
|
+
<% end %>
|
|
54
|
+
</div>
|
|
55
|
+
|
|
56
|
+
<a href="<%= edit_mountain_goat_metric_url :id => @metric %>">Edit Metric</a> |
|
|
57
|
+
<a href="<%= new_mountain_goat_metric_mountain_goat_metric_variant_url :mountain_goat_metric_id => @metric.id %>">New Variant</a>
|
|
58
|
+
</div>
|
|
59
|
+
</div>
|