|
1
|
|
|
#!/usr/bin/env python3 |
|
|
|
|
|
|
2
|
|
|
# -*- coding: utf-8 -*- |
|
3
|
|
|
|
|
4
|
|
|
import datetime |
|
5
|
|
|
import jinja2 |
|
6
|
|
|
import os |
|
|
|
|
|
|
7
|
|
|
|
|
8
|
|
|
import lighthouse_garden |
|
9
|
|
|
from lighthouse_garden import info |
|
10
|
|
|
from lighthouse_garden.utility import output, system |
|
11
|
|
|
from lighthouse_garden.lighthouse import database, utility |
|
12
|
|
|
|
|
13
|
|
|
""" |
|
14
|
|
|
CONSTANTS |
|
15
|
|
|
""" |
|
|
|
|
|
|
16
|
|
|
ASSETS_CSS = '/templates/assets/css' |
|
17
|
|
|
ASSETS_JS = '/templates/assets/js' |
|
18
|
|
|
|
|
19
|
|
|
TAG_CSS = 'style' |
|
20
|
|
|
TAG_JS = 'script' |
|
21
|
|
|
|
|
22
|
|
|
|
|
23
|
|
|
def generate_dashboard(): |
|
24
|
|
|
""" |
|
25
|
|
|
Generate the static html dashboard |
|
26
|
|
|
:return: |
|
27
|
|
|
""" |
|
28
|
|
|
_now = datetime.datetime.now() |
|
29
|
|
|
_file = f'{system.config["export_path"]}index.html' |
|
30
|
|
|
output.println(f'{output.Subject.INFO} Generating dashboard {output.CliFormat.BLACK}{_file}{output.CliFormat.ENDC}') |
|
|
|
|
|
|
31
|
|
|
|
|
32
|
|
|
html = open(_file, "w") |
|
33
|
|
|
|
|
34
|
|
|
_rendered_html = render_template('index.html.j2', |
|
35
|
|
|
logo=render_logo(), |
|
36
|
|
|
date=_now.strftime("%Y-%m-%dT%H:%M:%SZ"), |
|
37
|
|
|
assets_css=render_assets(ASSETS_CSS, TAG_CSS), |
|
38
|
|
|
assets_js=render_assets(ASSETS_JS, TAG_JS), |
|
39
|
|
|
items=render_items(), |
|
40
|
|
|
title=system.config['title'], |
|
41
|
|
|
description=system.config['description'], |
|
42
|
|
|
version=info.__version__, |
|
43
|
|
|
homepage=info.__homepage__, |
|
44
|
|
|
lighthouse_version=system.config['lighthouse']['version'] |
|
45
|
|
|
) |
|
46
|
|
|
html.write(_rendered_html) |
|
47
|
|
|
html.close() |
|
48
|
|
|
|
|
49
|
|
|
|
|
50
|
|
|
def render_items(): |
|
51
|
|
|
""" |
|
52
|
|
|
Render the target items for the dashboard |
|
53
|
|
|
@ToDo: Outsource description text? |
|
54
|
|
|
:return: |
|
55
|
|
|
""" |
|
56
|
|
|
_items = '' |
|
57
|
|
|
results = database.sort_by_average( |
|
58
|
|
|
database.get_last_results() |
|
59
|
|
|
) |
|
60
|
|
|
|
|
61
|
|
|
for result in results: |
|
62
|
|
|
_target = database.get_target_by_attribute(result['title'], 'title') |
|
63
|
|
|
_item = render_template('partials/item.html.j2', |
|
64
|
|
|
title=result['title'], |
|
65
|
|
|
url=result['url'], |
|
66
|
|
|
last_report=result['report'], |
|
67
|
|
|
identifier=_target['identifier'], |
|
68
|
|
|
graph_values_y=','.join(map(str, database.get_history_by_attribute( |
|
69
|
|
|
_target, 'performance'))), |
|
70
|
|
|
graph_values_x=','.join(map(str, database.get_history_by_attribute( |
|
71
|
|
|
_target, 'date'))), |
|
72
|
|
|
graph_values_text=','.join(map(str, database.get_history_by_attribute( |
|
|
|
|
|
|
73
|
|
|
_target, 'report'))), |
|
74
|
|
|
circle_average=render_percentage_circle( |
|
75
|
|
|
description=f'<strong>Average</strong><br/>' |
|
76
|
|
|
f'Calculates all available performance values to an average value.<br/><br/>' |
|
|
|
|
|
|
77
|
|
|
f'Maximum value: {int(result["average"]["max"])}<br/>' |
|
|
|
|
|
|
78
|
|
|
f'Minimum value: {int(result["average"]["min"])}<br/>', |
|
|
|
|
|
|
79
|
|
|
value=result['average']['value'] |
|
80
|
|
|
), |
|
81
|
|
|
circle_performance=render_percentage_circle( |
|
82
|
|
|
trend=render_trend(result), |
|
83
|
|
|
description=f'<strong>Performance</strong><br/>' |
|
|
|
|
|
|
84
|
|
|
f'The performance score is calculated directly from various metrics.<br/><br/>' |
|
|
|
|
|
|
85
|
|
|
f'Click here to get more information from the last report.', |
|
|
|
|
|
|
86
|
|
|
url=f'{result["report"]}#performance', |
|
87
|
|
|
title=f'Report {result["date"]}', |
|
88
|
|
|
value=result['performance'] |
|
89
|
|
|
), |
|
90
|
|
|
circle_accessibility=render_percentage_circle( |
|
91
|
|
|
description=f'<strong>Accessibility</strong><br/>' |
|
|
|
|
|
|
92
|
|
|
f'These checks highlight opportunities to improve the accessibility of ' |
|
|
|
|
|
|
93
|
|
|
f'your web app.<br/><br/>' |
|
94
|
|
|
f'Click here to get more information from the last report.', |
|
|
|
|
|
|
95
|
|
|
value=result['accessibility'], |
|
96
|
|
|
url=f'{result["report"]}#accessibility', |
|
97
|
|
|
title=f'Report {result["date"]}', |
|
98
|
|
|
additional_class='small' |
|
99
|
|
|
), |
|
100
|
|
|
circle_best_practices=render_percentage_circle( |
|
101
|
|
|
description=f'<strong>Best practices</strong><br/>' |
|
|
|
|
|
|
102
|
|
|
f'Further information about best practices.' |
|
103
|
|
|
f'See the lighthouse report for further information.<br/><br/>' |
|
|
|
|
|
|
104
|
|
|
f'Click here to get more information from the last report.', |
|
|
|
|
|
|
105
|
|
|
value=result['best-practices'], |
|
106
|
|
|
url=f'{result["report"]}#best-practices', |
|
107
|
|
|
title=f'Report {result["date"]}', |
|
108
|
|
|
additional_class='small' |
|
109
|
|
|
), |
|
110
|
|
|
circle_seo=render_percentage_circle( |
|
111
|
|
|
description=f'<strong>SEO</strong><br/>' |
|
|
|
|
|
|
112
|
|
|
f'These checks ensure that your page is optimized for search engine ' |
|
|
|
|
|
|
113
|
|
|
f'results ranking.<br/><br/>' |
|
114
|
|
|
f'Click here to get more information from the last report.', |
|
|
|
|
|
|
115
|
|
|
value=result['seo'], |
|
116
|
|
|
url=f'{result["report"]}#seo', |
|
117
|
|
|
title=f'Report {result["date"]}', |
|
118
|
|
|
additional_class='small' |
|
119
|
|
|
), |
|
120
|
|
|
api_json=f'{utility.get_data_dir(absolute_path=False)}_{_target["identifier"]}.json', |
|
|
|
|
|
|
121
|
|
|
badge_average=f'{utility.get_data_dir(absolute_path=False)}_{_target["identifier"]}.average.svg', |
|
|
|
|
|
|
122
|
|
|
badge_performance=f'{utility.get_data_dir(absolute_path=False)}_{_target["identifier"]}.performance.svg', |
|
|
|
|
|
|
123
|
|
|
badge_accessibility=f'{utility.get_data_dir(absolute_path=False)}_{_target["identifier"]}.accessibility.svg', |
|
|
|
|
|
|
124
|
|
|
badge_best_practices=f'{utility.get_data_dir(absolute_path=False)}_{_target["identifier"]}.best-practices.svg', |
|
|
|
|
|
|
125
|
|
|
badge_seo=f'{utility.get_data_dir(absolute_path=False)}_{_target["identifier"]}.seo.svg', |
|
|
|
|
|
|
126
|
|
|
) |
|
127
|
|
|
_items += _item |
|
128
|
|
|
return _items |
|
129
|
|
|
|
|
130
|
|
|
|
|
131
|
|
|
def render_percentage_circle(description, value, trend='', url='', title='', additional_class=None): |
|
|
|
|
|
|
132
|
|
|
""" |
|
133
|
|
|
Render the percentage circle for a specific attribute |
|
134
|
|
|
:param description: String |
|
135
|
|
|
:param value: Integer |
|
136
|
|
|
:param trend: String |
|
137
|
|
|
:param url: String |
|
138
|
|
|
:param additional_class: |
|
139
|
|
|
:return: |
|
140
|
|
|
""" |
|
141
|
|
|
return render_template('partials/circle.html.j2', |
|
142
|
|
|
url=url, |
|
143
|
|
|
title=title, |
|
144
|
|
|
value=str(int(round(value))), |
|
145
|
|
|
description=description, |
|
146
|
|
|
color=get_percentage_classification(int(round(value))), |
|
147
|
|
|
small=additional_class, |
|
148
|
|
|
trend=trend |
|
149
|
|
|
) |
|
150
|
|
|
|
|
151
|
|
|
|
|
152
|
|
|
def render_trend(result): |
|
153
|
|
|
""" |
|
154
|
|
|
Render the performance trend |
|
155
|
|
|
:param result: Dict |
|
156
|
|
|
:return: |
|
157
|
|
|
""" |
|
158
|
|
|
_description = '' |
|
159
|
|
|
_class = '' |
|
160
|
|
|
if result['average']['trend'] == 1: |
|
161
|
|
|
_description = f'<strong>Performance trend</strong><br/>' \ |
|
|
|
|
|
|
162
|
|
|
f'Ascending trend in dependence of the last performance measurement to the average value.' |
|
|
|
|
|
|
163
|
|
|
_class = 'asc' |
|
164
|
|
|
elif result['average']['trend'] == -1: |
|
165
|
|
|
_description = f'<strong>Performance trend</strong><br/>' \ |
|
|
|
|
|
|
166
|
|
|
f'Descending trend in dependence of the last performance measurement to the average value.' |
|
|
|
|
|
|
167
|
|
|
_class = 'desc' |
|
168
|
|
|
|
|
169
|
|
|
if result['average']['trend'] == 0: |
|
|
|
|
|
|
170
|
|
|
return '' |
|
171
|
|
|
else: |
|
172
|
|
|
return render_template('partials/trend.html.j2', |
|
173
|
|
|
description=_description, |
|
|
|
|
|
|
174
|
|
|
trend=_class |
|
|
|
|
|
|
175
|
|
|
) |
|
|
|
|
|
|
176
|
|
|
|
|
177
|
|
|
|
|
178
|
|
|
def get_percentage_classification(value): |
|
179
|
|
|
""" |
|
180
|
|
|
Get the percentage classification by a value |
|
181
|
|
|
@ToDo: Make this configurable |
|
182
|
|
|
:param value: |
|
183
|
|
|
:return: |
|
184
|
|
|
""" |
|
185
|
|
|
if value >= 90: |
|
|
|
|
|
|
186
|
|
|
return 'green' |
|
187
|
|
|
elif value >= 50: |
|
188
|
|
|
return 'orange' |
|
189
|
|
|
else: |
|
190
|
|
|
return 'red' |
|
191
|
|
|
|
|
192
|
|
|
|
|
193
|
|
|
def render_assets(path, tag): |
|
194
|
|
|
""" |
|
195
|
|
|
Render the css/js assets |
|
196
|
|
|
:param path: String |
|
197
|
|
|
:param tag: String |
|
198
|
|
|
:return: String |
|
199
|
|
|
""" |
|
200
|
|
|
_html = '' |
|
201
|
|
|
for file in os.listdir(os.path.dirname(lighthouse_garden.__file__) + path): |
|
202
|
|
|
with open(os.path.dirname(lighthouse_garden.__file__) + path + '/' + file, 'r') as read_file: |
|
|
|
|
|
|
203
|
|
|
_html += f'<!-- {file} -->\n<{tag}>\n{read_file.read()}\n</{tag}>\n' |
|
204
|
|
|
return _html |
|
205
|
|
|
|
|
206
|
|
|
|
|
207
|
|
|
def render_logo(): |
|
208
|
|
|
""" |
|
209
|
|
|
Render the SVG logo file |
|
210
|
|
|
:return: |
|
211
|
|
|
""" |
|
212
|
|
|
with open(os.path.dirname(lighthouse_garden.__file__) + '/templates/assets/tower.svg', 'r') as read_file: |
|
|
|
|
|
|
213
|
|
|
return read_file.read() |
|
214
|
|
|
|
|
215
|
|
|
|
|
216
|
|
|
def render_template(template, **args): |
|
217
|
|
|
""" |
|
218
|
|
|
Render a template with jinja2 |
|
219
|
|
|
:param template: String Template file |
|
220
|
|
|
:param args: Dictionary Template arguments |
|
221
|
|
|
:return: String Rendered Template |
|
222
|
|
|
""" |
|
223
|
|
|
_template_loader = jinja2.FileSystemLoader(searchpath=os.path.dirname(lighthouse_garden.__file__) + "/templates/") |
|
|
|
|
|
|
224
|
|
|
_template_environment = jinja2.Environment(loader=_template_loader) |
|
225
|
|
|
_template = _template_environment.get_template(template) |
|
226
|
|
|
return _template.render(args) |
|
227
|
|
|
|
jackd248 /
lighthouse-garden
Loading history...