diff --git a/app/lib/frontend/color.dart b/app/lib/frontend/color.dart new file mode 100644 index 0000000000..567ae23dc7 --- /dev/null +++ b/app/lib/frontend/color.dart @@ -0,0 +1,113 @@ +// Copyright (c) 2018, the Dart project authors. Please see the AUTHORS file +// for details. All rights reserved. Use of this source code is governed by a +// BSD-style license that can be found in the LICENSE file. + +/// Represents an RGBA color code. +class Color { + static const black = const Color(0, 0, 0); + static const blue = const Color(0, 0, 255); + static const green = const Color(0, 255, 0); + static const peach = const Color(255, 229, 180); + static const red = const Color(255, 0, 0); + static const silver = const Color(192, 192, 192); + static const slateGray = const Color(112, 128, 144); + static const white = const Color(255, 255, 255); + + final int r; + final int g; + final int b; + final double a; + + const Color(this.r, this.g, this.b, [this.a = 1.0]); + + Color change({int r, int g, int b, double a}) => + new Color(r ?? this.r, g ?? this.g, b ?? this.b, a ?? this.a); + + Color interpolateTo(Color to, double value) { + final red = ((to.r - r) * value).round() + r; + final green = ((to.g - g) * value).round() + g; + final blue = ((to.b - b) * value).round() + b; + final alpha = ((to.a - a) * value) + a; + return new Color(red, green, blue, alpha); + } + + Color multipleValues(double value) { + return change( + r: (r * value).round(), + g: (g * value).round(), + b: (b * value).round(), + ); + } + + @override + String toString() => a == 1.0 + ? 'rgb($r, $g, $b)' + : 'rgba($r, $g, $b, ${a.toStringAsFixed(4)})'; +} + +/// Represents the selection of colors that will be used to draw a specific shape. +class Brush { + final Color background; + final Color color; + final Color shadow; + + const Brush({this.background, this.color, this.shadow}); + + Brush interpolateTo(Brush to, double value) { + return new Brush( + background: background.interpolateTo(to.background, value), + color: color.interpolateTo(to.color, value), + shadow: shadow.interpolateTo(to.shadow, value), + ); + } + + Brush change({Color background, Color color, Color shadow}) { + return new Brush( + background: background ?? this.background, + color: color ?? this.color, + shadow: shadow ?? this.shadow); + } +} + +/// A semi-transparent black for using as a non-intrusive shadow. +final _blackShadow = Color.black.change(a: 0.5); + +/// Color to use when the analysis/score is missing (skipped or not done yet). +final _scoreBoxMissing = new Color(204, 204, 204); + +/// Color to use when the analysis result was top of the range (70+). +final _scoreBoxSolid = new Color(1, 117, 194); + +/// Color to use when the analysis result was in the middle of the range (40-70) +final _scoreBoxGood = new Color(0, 196, 179); + +/// Color to use when the analysis result was in the lower range (0-40) +final _scoreBoxRotten = new Color(187, 36, 0); + +/// The default set of colors to use. +final _defaultBrush = new Brush( + background: _scoreBoxMissing, color: Color.white, shadow: _blackShadow); + +/// Get the [Brush] that will be used to render the overall score progress bar. +Brush overallScoreBrush(double score) { + if (score == null) { + return _defaultBrush; + } + if (score <= 0.4) { + return _defaultBrush.change(background: _scoreBoxRotten); + } + if (score <= 0.7) { + return _defaultBrush.change(background: _scoreBoxGood); + } + return _defaultBrush.change(background: _scoreBoxSolid); +} + +/// Get the [Brush] that will be used to render the generic score progress bars +/// (e.g. popularity or health score). +Brush genericScoreBrush(double score) { + if (score == null) { + return _defaultBrush; + } + final bg = Color.slateGray.interpolateTo(Color.silver, score); + return _defaultBrush.change(background: bg); +} diff --git a/app/lib/frontend/templates.dart b/app/lib/frontend/templates.dart index 74f41acbce..4528adea1a 100644 --- a/app/lib/frontend/templates.dart +++ b/app/lib/frontend/templates.dart @@ -20,6 +20,7 @@ import '../shared/search_service.dart' show SearchQuery, serializeSearchOrder; import '../shared/urls.dart' as urls; import '../shared/utils.dart'; +import 'color.dart'; import 'model_properties.dart' show Author; import 'models.dart'; import 'static_files.dart'; @@ -276,10 +277,7 @@ class TemplateService { 'has_dev': devDeps.isNotEmpty, 'dev': devDeps, }, - 'health': _formatScore(extract?.health), - 'maintenance': _formatScore(extract?.maintenance), - 'popularity': _formatScore(extract?.popularity), - 'score_box_html': _renderScoreBox(analysisStatus, extract?.overallScore), + 'score_bars': _renderScoreBars(extract), }; return _renderTemplate('pkg/analysis_tab', data); @@ -420,6 +418,34 @@ class TemplateService { return values; } + Map _renderScoreBars(AnalysisExtract extract) { + String renderScoreBar(double score, Brush brush) { + return _renderTemplate('pkg/score_bar', { + 'percent': _formatScore(score ?? 0.0), + 'score': _formatScore(score), + 'background': brush.background.toString(), + 'color': brush.color.toString(), + 'shadow': brush.shadow.toString(), + }); + } + + final analysisSkipped = _isAnalysisSkipped(extract?.analysisStatus); + final healthScore = extract?.health; + final maintenanceScore = extract?.maintenance; + final popularityScore = extract?.popularity; + final overallScore = analysisSkipped ? null : extract?.overallScore ?? 0.0; + return { + 'health_html': + renderScoreBar(healthScore, genericScoreBrush(healthScore)), + 'maintenance_html': + renderScoreBar(maintenanceScore, genericScoreBrush(maintenanceScore)), + 'popularity_html': + renderScoreBar(popularityScore, genericScoreBrush(popularityScore)), + 'overall_html': + renderScoreBar(overallScore, overallScoreBrush(overallScore)), + }; + } + String _renderLicenses(String baseUrl, List licenses) { if (licenses == null || licenses.isEmpty) return null; return licenses.map((license) { @@ -835,10 +861,12 @@ String _getAuthorsHtml(List authors) { }).join('
'); } +bool _isAnalysisSkipped(AnalysisStatus status) => + status == AnalysisStatus.outdated || status == AnalysisStatus.discontinued; + String _renderScoreBox(AnalysisStatus status, double overallScore, {bool isNewPackage, String package}) { - final skippedAnalysis = status == AnalysisStatus.outdated || - status == AnalysisStatus.discontinued; + final skippedAnalysis = _isAnalysisSkipped(status); final score = skippedAnalysis ? null : overallScore; final String formattedScore = _formatScore(score); final String scoreClass = _classifyScore(score); diff --git a/app/test/frontend/golden/analysis_tab_aborted.html b/app/test/frontend/golden/analysis_tab_aborted.html index 1b25faf363..a066d5199a 100644 --- a/app/test/frontend/golden/analysis_tab_aborted.html +++ b/app/test/frontend/golden/analysis_tab_aborted.html @@ -1,20 +1,3 @@ -

Analysis

- -

- We analyzed this package on Dec 18, 2017, and provided a score, details, and suggestions below. - Analysis was completed with status aborted using: -

- -
    -
  • Dart:
    • -
  • pana: 0.8.0
    • - -
- -
- -

Scores

- - - + - - + - - + - +
@@ -26,8 +9,19 @@

Scores

--/ 100 + +
+
--
+
+ +
+
+
+
+
+ +
@@ -39,8 +33,17 @@

Scores

--/ 100 +
+
--
+
+ +
+
+
+
+
+
@@ -52,24 +55,56 @@

Scores

--/ 100 +
+
--
+
+ +
+
+
+
+
+
- Overall score: + Overall:
Weighted score of the above. [more]
--
 +
+
0
+
+ +
+
+
+
+
+
-Learn more about scoring. +
Learn more about scoring.
+ +
+ +

+ We analyzed this package on Dec 18, 2017, and provided a score, details, and suggestions below. + Analysis was completed with status aborted using: +

+ +
    +
  • Dart:
    • +
  • pana: 0.8.0
    • + +

Platforms

diff --git a/app/test/frontend/golden/analysis_tab_http.html b/app/test/frontend/golden/analysis_tab_http.html index 697c31c37a..37a592cc25 100644 --- a/app/test/frontend/golden/analysis_tab_http.html +++ b/app/test/frontend/golden/analysis_tab_http.html @@ -1,20 +1,3 @@ -

Analysis

- -

- We analyzed this package on May 9, 2018, and provided a score, details, and suggestions below. - Analysis was completed with status completed using: -

- -
    -
  • Dart: 2.0.0-dev.52.0
    • -
  • pana: 0.11.0
    • - -
- -
- -

Scores

- - - + - - + - - + - +
@@ -26,8 +9,19 @@

Scores

23/ 100 + +
+
23
+
+ +
+
+
+
+
+ +
@@ -39,8 +33,17 @@

Scores

97/ 100 +
+
97
+
+ +
+
+
+
+
+
@@ -52,24 +55,56 @@

Scores

90/ 100 +
+
90
+
+ +
+
+
+
+
+
- Overall score: + Overall:
Weighted score of the above. [more]
59
 +
+
59
+
+ +
+
+
+
+
+
-Learn more about scoring. +
Learn more about scoring.
+ +
+ +

+ We analyzed this package on May 9, 2018, and provided a score, details, and suggestions below. + Analysis was completed with status completed using: +

+ +
    +
  • Dart: 2.0.0-dev.52.0
    • +
  • pana: 0.11.0
    • + +

Platforms

diff --git a/app/test/frontend/golden/analysis_tab_mock.html b/app/test/frontend/golden/analysis_tab_mock.html index 38b61e78ef..61da71af9e 100644 --- a/app/test/frontend/golden/analysis_tab_mock.html +++ b/app/test/frontend/golden/analysis_tab_mock.html @@ -1,20 +1,3 @@ -

Analysis

- -

- We analyzed this package on Oct 26, 2017, and provided a score, details, and suggestions below. - Analysis was completed with status tool failures using: -

- -
    -
  • Dart: 2.0.0-dev.7.0
    • -
  • pana: 0.6.2
    • -
  • Flutter: 0.0.18
    • -
- -
- -

Scores

- - - + - - + - - + - +
@@ -26,8 +9,19 @@

Scores

23/ 100 + +
+
23
+
+ +
+
+
+
+
+ +
@@ -39,8 +33,17 @@

Scores

90/ 100 +
+
90
+
+ +
+
+
+
+
+
@@ -52,24 +55,56 @@

Scores

89/ 100 +
+
89
+
+ +
+
+
+
+
+
- Overall score: + Overall:
Weighted score of the above. [more]
57
 +
+
57
+
+ +
+
+
+
+
+
-Learn more about scoring. +
Learn more about scoring.
+ +
+ +

+ We analyzed this package on Oct 26, 2017, and provided a score, details, and suggestions below. + Analysis was completed with status tool failures using: +

+ +
    +
  • Dart: 2.0.0-dev.7.0
    • +
  • pana: 0.6.2
    • +
  • Flutter: 0.0.18
    • +

Platforms

diff --git a/app/test/frontend/golden/analysis_tab_outdated.html b/app/test/frontend/golden/analysis_tab_outdated.html index 53230988cc..80964a8939 100644 --- a/app/test/frontend/golden/analysis_tab_outdated.html +++ b/app/test/frontend/golden/analysis_tab_outdated.html @@ -1,4 +1,99 @@ -

Analysis

+ + + + + + + + + + + + + + + + + +
+
+ Popularity: +
+ Describes how popular the package is relative to other packages. + [more] +
+
+ 		+ +
+
--
+
+ +
+
+
+
+
+ +
+
+ Health: +
+ Code health derived from static analysis. + [more] +
+
+ 		+
+
--
+
+ +
+
+
+
+
+
+
+ Maintenance: +
+ Reflects how tidy and up-to-date the package is. + [more] +
+
+ 		+
+
--
+
+ +
+
+
+
+
+
+
+ Overall: +
+ Weighted score of the above. + [more] +
+
+ 		+
+
0
+
+ +
+
+
+
+
+
+ +
Learn more about scoring.
+ +

This package version is not analyzed, because it is more than two years old. diff --git a/app/test/frontend/golden/pkg_show_page.html b/app/test/frontend/golden/pkg_show_page.html index 6e86b1ad12..423df9d7af 100644 --- a/app/test/frontend/golden/pkg_show_page.html +++ b/app/test/frontend/golden/pkg_show_page.html @@ -177,24 +177,7 @@

3. Import it

-

Analysis

- -

- We analyzed this package on Feb 5, 2018, and provided a score, details, and suggestions below. - Analysis was completed with status completed using: -

- -
    -
  • Dart: 2.0.0-dev.7.0
    • -
  • pana: 0.6.2
    • -
  • Flutter: 0.0.18
    • -
- -
- -

Scores

- - +
- - + - - + - - + - +
@@ -205,8 +188,19 @@

Scores

--/ 100 + +
+
--
+
+ +
+
+
+
+
+ +
@@ -218,8 +212,17 @@

Scores

--/ 100 +
+
--
+
+ +
+
+
+
+
+
@@ -231,24 +234,56 @@

Scores

--/ 100 +
+
--
+
+ +
+
+
+
+
+
- Overall score: + Overall:
Weighted score of the above. [more]
0
 +
+
0
+
+ +
+
+
+
+
+
-Learn more about scoring. +
Learn more about scoring.
+ +
+ +

+ We analyzed this package on Feb 5, 2018, and provided a score, details, and suggestions below. + Analysis was completed with status completed using: +

+ +
    +
  • Dart: 2.0.0-dev.7.0
    • +
  • pana: 0.6.2
    • +
  • Flutter: 0.0.18
    • +

Platforms

diff --git a/app/test/frontend/golden/pkg_show_page_discontinued.html b/app/test/frontend/golden/pkg_show_page_discontinued.html index d2422e8665..c353b01fc5 100644 --- a/app/test/frontend/golden/pkg_show_page_discontinued.html +++ b/app/test/frontend/golden/pkg_show_page_discontinued.html @@ -174,7 +174,102 @@

3. Import it

-

Analysis

+ + + + + + + + + + + + + + + + + +
+
+ Popularity: +
+ Describes how popular the package is relative to other packages. + [more] +
+
+ 		+ +
+
--
+
+ +
+
+
+
+
+ +
+
+ Health: +
+ Code health derived from static analysis. + [more] +
+
+ 		+
+
--
+
+ +
+
+
+
+
+
+
+ Maintenance: +
+ Reflects how tidy and up-to-date the package is. + [more] +
+
+ 		+
+
--
+
+ +
+
+
+
+
+
+
+ Overall: +
+ Weighted score of the above. + [more] +
+
+ 		+
+
--
+
+ +
+
+
+
+
+
+ +
Learn more about scoring.
+ +

This package is not analyzed, because it is discontinued.

diff --git a/app/test/frontend/golden/pkg_show_page_flutter_plugin.html b/app/test/frontend/golden/pkg_show_page_flutter_plugin.html index 2dc1c414f6..83b265dbf8 100644 --- a/app/test/frontend/golden/pkg_show_page_flutter_plugin.html +++ b/app/test/frontend/golden/pkg_show_page_flutter_plugin.html @@ -164,24 +164,7 @@

3. Import it

-

Analysis

- -

- We analyzed this package on Feb 5, 2018, and provided a score, details, and suggestions below. - Analysis was completed with status completed using: -

- -
    -
  • Dart: 2.0.0-dev.7.0
    • -
  • pana: 0.6.2
    • -
  • Flutter: 0.0.18
    • -
- -
- -

Scores

- - +
- - + - - + - - + - +
@@ -192,8 +175,19 @@

Scores

30/ 100 + +
+
30
+
+ +
+
+
+
+
+ +
@@ -205,8 +199,17 @@

Scores

99/ 100 +
+
99
+
+ +
+
+
+
+
+
@@ -218,24 +221,56 @@

Scores

99/ 100 +
+
99
+
+ +
+
+
+
+
+
- Overall score: + Overall:
Weighted score of the above. [more]
65
 +
+
65
+
+ +
+
+
+
+
+
-Learn more about scoring. +
Learn more about scoring.
+ +
+ +

+ We analyzed this package on Feb 5, 2018, and provided a score, details, and suggestions below. + Analysis was completed with status completed using: +

+ +
    +
  • Dart: 2.0.0-dev.7.0
    • +
  • pana: 0.6.2
    • +
  • Flutter: 0.0.18
    • +

Platforms

diff --git a/app/test/frontend/golden/pkg_show_page_outdated.html b/app/test/frontend/golden/pkg_show_page_outdated.html index ccaa2f4833..436f43fa51 100644 --- a/app/test/frontend/golden/pkg_show_page_outdated.html +++ b/app/test/frontend/golden/pkg_show_page_outdated.html @@ -175,7 +175,102 @@

3. Import it

-

Analysis

+ + + + + + + + + + + + + + + + + +
+
+ Popularity: +
+ Describes how popular the package is relative to other packages. + [more] +
+
+ 		+ +
+
--
+
+ +
+
+
+
+
+ +
+
+ Health: +
+ Code health derived from static analysis. + [more] +
+
+ 		+
+
--
+
+ +
+
+
+
+
+
+
+ Maintenance: +
+ Reflects how tidy and up-to-date the package is. + [more] +
+
+ 		+
+
--
+
+ +
+
+
+
+
+
+
+ Overall: +
+ Weighted score of the above. + [more] +
+
+ 		+
+
--
+
+ +
+
+
+
+
+
+ +
Learn more about scoring.
+ +

This package version is not analyzed, because it is more than two years old. diff --git a/app/test/frontend/golden/pkg_show_version_page.html b/app/test/frontend/golden/pkg_show_version_page.html index 2308335d9f..cf6cbb3100 100644 --- a/app/test/frontend/golden/pkg_show_version_page.html +++ b/app/test/frontend/golden/pkg_show_version_page.html @@ -179,24 +179,7 @@

3. Import it

-

Analysis

- -

- We analyzed this package on Feb 5, 2018, and provided a score, details, and suggestions below. - Analysis was completed with status completed using: -

- -
    -
  • Dart: 2.0.0-dev.7.0
    • -
  • pana: 0.6.2
    • -
  • Flutter: 0.0.18
    • -
- -
- -

Scores

- - +
- - + - - + - - + - +
@@ -207,8 +190,19 @@

Scores

--/ 100 + +
+
--
+
+ +
+
+
+
+
+ +
@@ -220,8 +214,17 @@

Scores

--/ 100 +
+
--
+
+ +
+
+
+
+
+
@@ -233,24 +236,56 @@

Scores

--/ 100 +
+
--
+
+ +
+
+
+
+
+
- Overall score: + Overall:
Weighted score of the above. [more]
0
 +
+
0
+
+ +
+
+
+
+
+
-Learn more about scoring. +
Learn more about scoring.
+ +
+ +

+ We analyzed this package on Feb 5, 2018, and provided a score, details, and suggestions below. + Analysis was completed with status completed using: +

+ +
    +
  • Dart: 2.0.0-dev.7.0
    • +
  • pana: 0.6.2
    • +
  • Flutter: 0.0.18
    • +

Platforms

diff --git a/app/views/pkg/analysis_tab.mustache b/app/views/pkg/analysis_tab.mustache index 341eb574a0..0d56a53ef5 100644 --- a/app/views/pkg/analysis_tab.mustache +++ b/app/views/pkg/analysis_tab.mustache @@ -1,33 +1,6 @@ {{! Copyright (c) 2018, the Dart project authors. Please see the AUTHORS file for details. All rights reserved. Use of this source code is governed by a BSD-style license that can be found in the LICENSE file. }} -

Analysis

- -{{#show_discontinued}} -

This package is not analyzed, because it is discontinued.

-{{/show_discontinued}} -{{#show_outdated}} -

- This package version is not analyzed, because it is more than two years old. - Check the latest stable version for its analysis. -

-{{/show_outdated}} -{{#show_analysis}} -

- We analyzed this package on {{date_completed}}, and provided a score, details, and suggestions below. - Analysis was completed with status {{analysis_status}} using: -

- -
    -
  • Dart: {{dart_sdk_version}}
    • -
  • pana: {{pana_version}}
    • -{{#flutter_version}}
  • Flutter: {{flutter_version}}
    • {{/flutter_version}} -
- -
- -

Scores

- - - + - - + - - + - +
@@ -39,8 +12,9 @@ {{popularity}}/ 100 + {{& score_bars.popularity_html}} +
@@ -52,8 +26,7 @@ {{health}}/ 100{{& score_bars.health_html}}
@@ -65,24 +38,46 @@ {{maintenance}}/ 100{{& score_bars.maintenance_html}}
- Overall score: + Overall:
Weighted score of the above. [more]
{{& score_box_html }}{{& score_bars.overall_html }}
-Learn more about scoring. +
Learn more about scoring.
+ +
+ +{{#show_discontinued}} +

This package is not analyzed, because it is discontinued.

+{{/show_discontinued}} +{{#show_outdated}} +

+ This package version is not analyzed, because it is more than two years old. + Check the latest stable version for its analysis. +

+{{/show_outdated}} +{{#show_analysis}} +

+ We analyzed this package on {{date_completed}}, and provided a score, details, and suggestions below. + Analysis was completed with status {{analysis_status}} using: +

+ +
    +
  • Dart: {{dart_sdk_version}}
    • +
  • pana: {{pana_version}}
    • +{{#flutter_version}}
  • Flutter: {{flutter_version}}
    • {{/flutter_version}} +

Platforms

diff --git a/app/views/pkg/score_bar.mustache b/app/views/pkg/score_bar.mustache new file mode 100644 index 0000000000..3fead3d510 --- /dev/null +++ b/app/views/pkg/score_bar.mustache @@ -0,0 +1,13 @@ +{{! Copyright (c) 2018, the Dart project authors. Please see the AUTHORS file + for details. All rights reserved. Use of this source code is governed by a + BSD-style license that can be found in the LICENSE file. }} + +
+
{{score}}
+
+ +
+
+
+
+
diff --git a/static/css/style.css b/static/css/style.css index d8710f418f..394b19ea54 100644 --- a/static/css/style.css +++ b/static/css/style.css @@ -1006,24 +1006,63 @@ pre > code { Analysis tab ******************************************************/ +.score-percent-row { + margin: 0px 24px; + height: 28px; + position: relative; +} + +.score-percent { + background: black; + color: white; + display: inline-block; + padding: 2px 4px; + margin-left: -12px; + position: absolute; + top: -4px; + font-size: 10pt; +} + +.score-percent::after { + content: " "; + position: absolute; + top: 100%; + left: 12px; + margin-left: -5px; + border-width: 5px; + border-style: solid; + border-color: black transparent transparent transparent; +} + +.score-progress-row { + padding: 3px 0px; + margin: 0px 24px; +} + +.score-progress-frame { + background: #f0f0f0; +} + +.score-progress-frame > .score-progress { + height: 4px; +} + #scores-table { margin-bottom: 1em; } -#scores-table .score-name { - min-width: 100px; - padding-right: 24px; +#scores-table tr { + vertical-align: baseline; } -#scores-table .score-value { - min-width: 60px; +#scores-table .score-name { + min-width: 100px; + padding-right: 4px; text-align: right; - padding-right: 18px; } -#scores-table .score-range { - color: #666; - font-size: 10pt; +#scores-table .score-value { + width: 100%; } .tooltip-base {