|
0
|
1 local Luan = require "luan:Luan.luan"
|
|
|
2 local error = Luan.error
|
|
|
3 local Parsers = require "luan:Parsers.luan"
|
|
|
4 local json_string = Parsers.json_string or error()
|
|
|
5 local Io = require "luan:Io.luan"
|
|
|
6 local Http = require "luan:http/Http.luan"
|
|
|
7 local Shared = require "site:/lib/Shared.luan"
|
|
|
8 local head = Shared.head or error()
|
|
|
9 local body_header = Shared.body_header or error()
|
|
|
10 local footer = Shared.footer or error()
|
|
|
11 local compressed = Shared.compressed or error()
|
|
|
12 local User = require "site:/lib/User.luan"
|
|
|
13 local Reporting = require "site:/lib/Reporting.luan"
|
|
|
14 local get_data = Reporting.get_data or error()
|
|
|
15 local Logging = require "luan:logging/Logging.luan"
|
|
|
16 local logger = Logging.logger "analytics_new.html"
|
|
|
17
|
|
|
18
|
|
|
19 return function()
|
|
|
20 local user = User.current_required()
|
|
|
21 if user==nil then return end
|
|
|
22 local user_name = user.name
|
|
|
23 Io.stdout = Http.response.text_writer()
|
|
|
24 %>
|
|
|
25 <!doctype html>
|
|
|
26 <html lang="en">
|
|
|
27 <head>
|
|
|
28 <% head() %>
|
|
|
29 <title>Link My Style</title>
|
|
|
30 <style>
|
|
|
31 h1 {
|
|
|
32 text-align: center;
|
|
|
33 margin-bottom: 0;
|
|
|
34 }
|
|
|
35 p[top] {
|
|
|
36 text-align: center;
|
|
|
37 }
|
|
|
38 div[report] {
|
|
|
39 max-width: 600px;
|
|
|
40 margin-left: auto;
|
|
|
41 margin-right: auto;
|
|
|
42 margin-top: 20px;
|
|
|
43 margin-bottom: 20px;
|
|
|
44 }
|
|
|
45 @media (max-width: 700px) {
|
|
|
46 div[report] {
|
|
|
47 max-width: 90%;
|
|
|
48 }
|
|
|
49 }
|
|
|
50 </style>
|
|
|
51 <script src="https://cdn.jsdelivr.net/npm/apexcharts"></script>
|
|
|
52 <script>
|
|
|
53 <%
|
|
|
54 do
|
|
|
55 local data = get_data( "+type:visit +owner:"..user_name )
|
|
|
56 %>
|
|
|
57 function initTraffic() {
|
|
|
58 let options = {
|
|
|
59 chart: {
|
|
|
60 type: 'line'
|
|
|
61 },
|
|
|
62 series: [{
|
|
|
63 name: 'Visitors',
|
|
|
64 data: <%=json_string(data,compressed)%>,
|
|
|
65 }],
|
|
|
66 xaxis: {
|
|
|
67 type: 'datetime'
|
|
|
68 },
|
|
|
69 title: {
|
|
|
70 text: 'Traffic'
|
|
|
71 }
|
|
|
72 };
|
|
|
73 let div = document.querySelector('div[report="traffic"]');
|
|
|
74 let chart = new ApexCharts( div, options );
|
|
|
75 chart.render();
|
|
|
76 }
|
|
|
77 <%
|
|
|
78 end_do
|
|
|
79 do
|
|
|
80 local data = get_data( "+type:page_view +owner:"..user_name, "value" )
|
|
|
81 %>
|
|
|
82 function initPages() {
|
|
|
83 let data = <%=json_string(data,compressed)%>;
|
|
|
84 let options = {
|
|
|
85 chart: {
|
|
|
86 type: 'bar',
|
|
|
87 height: barChartHeight(data.length)
|
|
|
88 },
|
|
|
89 plotOptions: {
|
|
|
90 bar: {
|
|
|
91 horizontal: true
|
|
|
92 }
|
|
|
93 },
|
|
|
94 series: [{
|
|
|
95 name: 'Visitors',
|
|
|
96 data: data,
|
|
|
97 }],
|
|
|
98 title: {
|
|
|
99 text: 'Pages'
|
|
|
100 }
|
|
|
101 };
|
|
|
102 let div = document.querySelector('div[report="pages"]');
|
|
|
103 let chart = new ApexCharts( div, options );
|
|
|
104 chart.render();
|
|
|
105 }
|
|
|
106 <%
|
|
|
107 end_do
|
|
|
108 do
|
|
|
109 local data = get_data( "+type:link_click +owner:"..user_name, "value" )
|
|
|
110 %>
|
|
|
111 function initClicks() {
|
|
|
112 let data = <%=json_string(data,compressed)%>;
|
|
|
113 let options = {
|
|
|
114 chart: {
|
|
|
115 type: 'bar',
|
|
|
116 height: barChartHeight(data.length)
|
|
|
117 },
|
|
|
118 plotOptions: {
|
|
|
119 bar: {
|
|
|
120 horizontal: true
|
|
|
121 }
|
|
|
122 },
|
|
|
123 series: [{
|
|
|
124 name: 'Clicks',
|
|
|
125 data: data,
|
|
|
126 }],
|
|
|
127 title: {
|
|
|
128 text: 'Clicks by page and link'
|
|
|
129 }
|
|
|
130 };
|
|
|
131 let div = document.querySelector('div[report="clicks"]');
|
|
|
132 let chart = new ApexCharts( div, options );
|
|
|
133 chart.render();
|
|
|
134 }
|
|
|
135 <%
|
|
|
136 end_do
|
|
|
137 do
|
|
|
138 local data = get_data( "+type:referrer +owner:"..user_name, "value" )
|
|
|
139 %>
|
|
|
140 function initReferrers() {
|
|
|
141 let data = <%=json_string(data,compressed)%>;
|
|
|
142 let options = {
|
|
|
143 chart: {
|
|
|
144 type: 'bar',
|
|
|
145 height: barChartHeight(data.length)
|
|
|
146 },
|
|
|
147 plotOptions: {
|
|
|
148 bar: {
|
|
|
149 horizontal: true
|
|
|
150 }
|
|
|
151 },
|
|
|
152 series: [{
|
|
|
153 name: 'Visitors',
|
|
|
154 data: data,
|
|
|
155 }],
|
|
|
156 title: {
|
|
|
157 text: 'Referring Domains'
|
|
|
158 }
|
|
|
159 };
|
|
|
160 let div = document.querySelector('div[report="referrers"]');
|
|
|
161 let chart = new ApexCharts( div, options );
|
|
|
162 chart.render();
|
|
|
163 }
|
|
|
164 <%
|
|
|
165 end_do
|
|
|
166 %>
|
|
|
167 function init() {
|
|
|
168 initTraffic();
|
|
|
169 initPages();
|
|
|
170 initClicks();
|
|
|
171 initReferrers();
|
|
|
172 }
|
|
|
173 </script>
|
|
|
174 </head>
|
|
|
175 <body onload="init()">
|
|
|
176 <div full>
|
|
|
177 <% body_header() %>
|
|
|
178 <h1>Analytics</h1>
|
|
|
179 <p top>For the last 30 days</p>
|
|
|
180 <div report=traffic></div>
|
|
|
181 <div report=pages></div>
|
|
|
182 <div report=clicks></div>
|
|
|
183 <div report=referrers></div>
|
|
|
184 <% footer() %>
|
|
|
185 </div>
|
|
|
186 </body>
|
|
|
187 </html>
|
|
|
188 <%
|
|
|
189 end
|
