util/gh-pages/index.html

   1 <!DOCTYPE html>
   2 <!--
   3 Welcome to a Clippy's lint list, at least the source code of it. If you are
   4 interested in contributing to this website checkout `util/gh-pages/index.html`
   5 inside the rust-clippy repository.
   6
   7 Otherwise, have a great day =^.^=
   8 -->
   9 <html lang="en">
  10 <head>
  11     <meta charset="UTF-8"/>
  12     <meta name="viewport" content="width=device-width, initial-scale=1"/>
  13
  14     <title>Clippy Lints</title>
  15
  16     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.min.css"/>
  17     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.5.0/styles/github.min.css"/>
  18
  19     <!-- The files are not copied over into the Clippy project since they use the MPL-2.0 License -->
  20     <link rel="stylesheet" href="https://rust-lang.github.io/mdBook/css/variables.css"/>
  21     <link id="styleHighlight" rel="stylesheet" href="https://rust-lang.github.io/mdBook/highlight.css">
  22     <link id="styleNight" rel="stylesheet" href="https://rust-lang.github.io/mdBook/tomorrow-night.css" disabled="true">
  23     <link id="styleAyu" rel="stylesheet" href="https://rust-lang.github.io/mdBook/ayu-highlight.css" disabled="true">
  24     <style>
  25         blockquote { font-size: 1em; }
  26         [ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak { display: none !important; }
  27
  28         .form-inline .checkbox { margin-right: 0.6em }
  29
  30         .panel-heading { cursor: pointer; }
  31
  32         .panel-title { display: flex; flex-wrap: wrap;}
  33         .panel-title .label { display: inline-block; }
  34
  35         .panel-title-name { flex: 1; min-width: 400px;}
  36         .panel-title-name span { vertical-align: bottom; }
  37
  38         .panel .panel-title-name .anchor { display: none; }
  39         .panel:hover .panel-title-name .anchor { display: inline;}
  40
  41         .label {
  42             padding-top: 0.3em;
  43             padding-bottom: 0.3em;
  44         }
  45
  46         .label-lint-group {
  47             min-width: 8em;
  48         }
  49         .label-lint-level {
  50             min-width: 4em;
  51         }
  52
  53         .label-lint-level-allow {
  54             background-color: #5cb85c;
  55         }
  56         .label-lint-level-warn {
  57             background-color: #f0ad4e;
  58         }
  59         .label-lint-level-deny {
  60             background-color: #d9534f;
  61         }
  62         .label-lint-level-none {
  63             background-color: #777777;
  64             opacity: 0.5;
  65         }
  66
  67         .label-group-deprecated {
  68             opacity: 0.5;
  69         }
  70
  71         .label-doc-folding {
  72             color: #000;
  73             background-color: #fff;
  74             border: 1px solid var(--theme-popup-border);
  75         }
  76         .label-doc-folding:hover {
  77             background-color: #e6e6e6;
  78         }
  79
  80         .lint-doc-md > h3 {
  81             border-top: 1px solid var(--theme-popup-border);
  82             padding: 10px 15px;
  83             margin: 0 -15px;
  84             font-size: 18px;
  85         }
  86         .lint-doc-md > h3:first-child {
  87             border-top: none;
  88             padding-top: 0px;
  89         }
  90
  91         @media (max-width:749px) {
  92             .lint-additional-info-container {
  93                 display: flex;
  94                 flex-flow: column;
  95             }
  96             .lint-additional-info-item + .lint-additional-info-item {
  97                 border-top: 1px solid var(--theme-popup-border);
  98             }
  99         }
 100         @media (min-width:750px) {
 101             .lint-additional-info-container {
 102                 display: flex;
 103                 flex-flow: row;
 104             }
 105             .lint-additional-info-item + .lint-additional-info-item {
 106                 border-left: 1px solid var(--theme-popup-border);
 107             }
 108         }
 109
 110         .lint-additional-info-item {
 111             display: inline-flex;
 112             min-width: 200px;
 113             flex-grow: 1;
 114             padding: 9px 5px 5px 15px;
 115         }
 116
 117         .label-applicability {
 118             background-color: #777777;
 119             margin: auto 5px;
 120         }
 121     </style>
 122     <style>
 123         /* Expanding the mdBoom theme*/
 124         .light {
 125             --inline-code-bg: #f6f7f6;
 126         }
 127         .rust {
 128             --inline-code-bg: #f6f7f6;
 129         }
 130         .coal {
 131             --inline-code-bg: #1d1f21;
 132         }
 133         .navy {
 134             --inline-code-bg: #1d1f21;
 135         }
 136         .ayu {
 137             --inline-code-bg: #191f26;
 138         }
 139
 140         /* Applying the mdBook theme */
 141         .theme-icon {
 142             position: absolute;
 143             text-align: center;
 144             width: 2em;
 145             height: 2em;
 146             margin: 0.7em;
 147             line-height: 2em;
 148             border: solid 1px var(--icons);
 149             border-radius: 5px;
 150             user-select: none;
 151             cursor: pointer;
 152         }
 153         .theme-icon:hover {
 154             background: var(--theme-hover);
 155         }
 156         .theme-choice {
 157             position: absolute;
 158             margin-top: calc(2em + 0.7em);
 159             margin-left: 0.7em;
 160             list-style: none;
 161             border: 1px solid var(--theme-popup-border);
 162             border-radius: 5px;
 163             color: var(--fg);
 164             background: var(--theme-popup-bg);
 165             padding: 0 0;
 166         }
 167         .theme-choice > li {
 168             padding: 5px 10px;
 169             font-size: 0.8em;
 170             user-select: none;
 171             cursor: pointer;
 172         }
 173         .theme-choice > li:hover {
 174             background: var(--theme-hover);
 175         }
 176
 177         .alert {
 178             color: var(--fg);
 179             background: var(--theme-hover);
 180             border: 1px solid var(--theme-popup-border);
 181         }
 182         .page-header {
 183             border-color: var(--theme-popup-border);
 184         }
 185         .panel-default > .panel-heading {
 186             background: var(--theme-hover);
 187             color: var(--fg);
 188             border: 1px solid var(--theme-popup-border);
 189         }
 190         .panel-default > .panel-heading:hover {
 191             filter: brightness(90%);
 192         }
 193         .list-group-item {
 194             background: 0%;
 195             border: 1px solid var(--theme-popup-border);
 196         }
 197         .panel, pre, hr {
 198             background: var(--bg);
 199             border: 1px solid var(--theme-popup-border);
 200         }
 201
 202         #filter-label, #filter-clear {
 203             background: var(--searchbar-bg);
 204             color: var(--searchbar-fg);
 205             border-color: var(--theme-popup-border);
 206             filter: brightness(95%);
 207         }
 208         #filter-label:hover, #filter-clear:hover {
 209             filter: brightness(90%);
 210         }
 211         #filter-input {
 212             background: var(--searchbar-bg);
 213             color: var(--searchbar-fg);
 214             border-color: var(--theme-popup-border);
 215         }
 216
 217         #filter-input::-webkit-input-placeholder,
 218         #filter-input::-moz-placeholder {
 219             color: var(--searchbar-fg);
 220             opacity: 30%;
 221         }
 222
 223         :not(pre) > code {
 224             color: var(--inline-code-color);
 225             background-color: var(--inline-code-bg);
 226         }
 227         html {
 228             scrollbar-color: var(--scrollbar) var(--bg);
 229         }
 230         body {
 231             background: var(--bg);
 232             color: var(--fg);
 233         }
 234
 235     </style>
 236 </head>
 237 <body>
 238     <div id="theme-icon" class="theme-icon">&#128396;</div>
 239     <ul id="theme-menu" class="theme-choice" style="display: none;">
 240         <li id="light">Light</li>
 241         <li id="rust">Rust</li>
 242         <li id="coal">Coal</li>
 243         <li id="navy">Navy</li>
 244         <li id="ayu">Ayu</li>
 245     </ul>
 246
 247     <div class="container" ng-app="clippy" ng-controller="lintList">
 248         <div class="page-header">
 249             <h1>Clippy Lints</h1>
 250         </div>
 251
 252         <noscript>
 253             <div class="alert alert-danger" role="alert">
 254                 Sorry, this site only works with JavaScript! :(
 255             </div>
 256         </noscript>
 257
 258         <div ng-cloak>
 259
 260             <div class="alert alert-info" role="alert" ng-if="loading">
 261                 Loading&#x2026;
 262             </div>
 263             <div class="alert alert-danger" role="alert" ng-if="error">
 264                 Error loading lints!
 265             </div>
 266
 267             <div class="panel panel-default" ng-show="data">
 268                 <div class="panel-body row filter-panel">
 269                     <div class="col-md-6 form-inline">
 270                         <div class="form-group form-group-lg">
 271                             <p class="h4">
 272                                 Lint levels
 273                                 <a href="https://doc.rust-lang.org/rustc/lints/levels.html">(?)</a>
 274                             </p>
 275                             <div class="checkbox" ng-repeat="(level, enabled) in levels">
 276                                 <label class="text-capitalize">
 277                                     <input type="checkbox" ng-model="levels[level]" />
 278                                     {{level}}
 279                                 </label>
 280                             </div>
 281                         </div>
 282                     </div>
 283                     <div class="col-md-6 form-inline">
 284                         <div class="form-group form-group-lg">
 285                             <p class="h4">
 286                                 Lint groups
 287                                 <a href="https://github.com/rust-lang/rust-clippy/#clippy">(?)</a>
 288                             </p>
 289                             <div class="checkbox" ng-repeat="(group, enabled) in groups">
 290                                 <label class="text-capitalize">
 291                                     <input type="checkbox" ng-model="groups[group]" />
 292                                     {{group}}
 293                                 </label>
 294                             </div>
 295                         </div>
 296                     </div>
 297                 </div>
 298                 <div class="panel-body row">
 299                     <div class="col-md-12 form-horizontal">
 300                         <div class="input-group">
 301                             <label class="input-group-addon" id="filter-label" for="filter-input">Filter:</label>
 302                             <input type="text" class="form-control" placeholder="Keywords or search string" id="filter-input" ng-model="search" ng-model-options="{debounce: 50}"/>
 303                             <span class="input-group-btn">
 304                                 <button id="filter-clear" class="btn" type="button" ng-click="search = ''">
 305                                     Clear
 306                                 </button>
 307                             </span>
 308                         </div>
 309                     </div>
 310                 </div>
 311             </div>
 312             <!-- The order of the filters should be from most likely to remove a lint to least likely to improve performance. -->
 313             <article class="panel panel-default" id="{{lint.id}}" ng-repeat="lint in data | filter:bySearch | filter:byGroups | filter:byLevels">
 314                 <header class="panel-heading" ng-click="open[lint.id] = !open[lint.id]">
 315                     <h2 class="panel-title">
 316                         <div class="panel-title-name">
 317                             <span>{{lint.id}}</span>
 318                             <a href="#{{lint.id}}" class="anchor label label-default" ng-click="open[lint.id] = true; $event.stopPropagation()">&para;</a>
 319                         </div>
 320
 321                         <div class="panel-title-addons">
 322                             <span class="label label-lint-group label-default label-group-{{lint.group}}">{{lint.group}}</span>
 323
 324                             <span class="label label-lint-level label-lint-level-{{lint.level}}">{{lint.level}}</span>
 325
 326
 327                             <span class="label label-doc-folding" ng-show="open[lint.id]">&minus;</span>
 328                             <span class="label label-doc-folding" ng-hide="open[lint.id]">&plus;</span>
 329                         </div>
 330                     </h2>
 331                 </header>
 332
 333                 <ul class="list-group lint-docs" ng-class="{collapse: true, in: open[lint.id]}">
 334                     <div class="list-group-item lint-doc-md" ng-bind-html="lint.docs | markdown"></div>
 335                     <div class="lint-additional-info-container">
 336                         <!-- Applicability -->
 337                         <div class="lint-additional-info-item">
 338                             <span> Applicability: </span>
 339                             <span class="label label-default label-applicability">{{lint.applicability.applicability}}</span>
 340                             <a href="https://doc.rust-lang.org/nightly/nightly-rustc/rustc_lint_defs/enum.Applicability.html#variants">(?)</a>
 341                         </div>
 342                         <!-- TODO xFrednet 2021-05-19: Somehow collect and show the version See rust-clippy#6492 -->
 343                         <!-- Open related issues -->
 344                         <div class="lint-additional-info-item">
 345                             <a href="https://github.com/rust-lang/rust-clippy/issues?q=is%3Aissue+{{lint.id}}">Related Issues</a>
 346                         </div>
 347                         <!-- Jump to source -->
 348                         <div class="lint-additional-info-item">
 349                             <a href="https://github.com/rust-lang/rust-clippy/blob/{{docVersion}}/clippy_lints/{{lint.id_span.path}}#L{{lint.id_span.line}}">View Source</a>
 350                         </div>
 351                     </div>
 352                 </ul>
 353             </article>
 354         </div>
 355     </div>
 356
 357     <a href="https://github.com/rust-lang/rust-clippy">
 358         <img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on Github"/>
 359     </a>
 360
 361     <script src="https://cdnjs.cloudflare.com/ajax/libs/markdown-it/7.0.0/markdown-it.min.js"></script>
 362     <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.5.0/highlight.min.js"></script>
 363     <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.5.0/languages/rust.min.js"></script>
 364     <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.12/angular.min.js"></script>
 365     <script>
 366     (function () {
 367         var md = window.markdownit({
 368             html: true,
 369             linkify: true,
 370             typographer: true,
 371             highlight: function (str, lang) {
 372                 if (lang && hljs.getLanguage(lang)) {
 373                     try {
 374                         return '<pre class="hljs"><code>' +
 375                             hljs.highlight(lang, str, true).value +
 376                             '</code></pre>';
 377                     } catch (__) {}
 378                 }
 379
 380                 return '<pre class="hljs"><code>' + md.utils.escapeHtml(str) + '</code></pre>';
 381             }
 382         });
 383
 384         function scrollToLint(lintId) {
 385             var target = document.getElementById(lintId);
 386             if (!target) {
 387                 return;
 388             }
 389             target.scrollIntoView();
 390         }
 391
 392         function scrollToLintByURL($scope) {
 393             var removeListener = $scope.$on('ngRepeatFinished', function(ngRepeatFinishedEvent) {
 394                 scrollToLint(window.location.hash.slice(1));
 395                 removeListener();
 396             });
 397         }
 398
 399         function selectGroup($scope, selectedGroup) {
 400             var groups = $scope.groups;
 401             for (var group in groups) {
 402                 if (groups.hasOwnProperty(group)) {
 403                     if (group === selectedGroup) {
 404                         groups[group] = true;
 405                     } else {
 406                         groups[group] = false;
 407                     }
 408                 }
 409             }
 410         }
 411
 412         angular.module("clippy", [])
 413         .filter('markdown', function ($sce) {
 414             return function (text) {
 415                 return $sce.trustAsHtml(
 416                     md.render(text || '')
 417                     // Oh deer, what a hack :O
 418                     .replace('<table', '<table class="table"')
 419                 );
 420             };
 421         })
 422         .directive('onFinishRender', function ($timeout) {
 423             return {
 424                 restrict: 'A',
 425                 link: function (scope, element, attr) {
 426                     if (scope.$last === true) {
 427                         $timeout(function () {
 428                             scope.$emit(attr.onFinishRender);
 429                         });
 430                     }
 431                 }
 432             };
 433         })
 434         .controller("lintList", function ($scope, $http, $timeout) {
 435             // Level filter
 436             var LEVEL_FILTERS_DEFAULT = {allow: true, warn: true, deny: true, none: true};
 437             $scope.levels = LEVEL_FILTERS_DEFAULT;
 438             $scope.byLevels = function (lint) {
 439                 return $scope.levels[lint.level];
 440             };
 441
 442             var GROUPS_FILTER_DEFAULT = {
 443                 cargo: true,
 444                 complexity: true,
 445                 correctness: true,
 446                 deprecated: false,
 447                 nursery: true,
 448                 pedantic: true,
 449                 perf: true,
 450                 restriction: true,
 451                 style: true,
 452                 suspicious: true,
 453             };
 454             $scope.groups = GROUPS_FILTER_DEFAULT;
 455             $scope.byGroups = function (lint) {
 456                 return $scope.groups[lint.group];
 457             };
 458
 459             $scope.bySearch = function (lint, index, array) {
 460                 let searchStr = $scope.search;
 461                 // It can be `null` I haven't missed this value
 462                 if (searchStr == null || searchStr.length < 3) {
 463                     return true;
 464                 }
 465                 searchStr = searchStr.toLowerCase();
 466
 467                 // Search by id
 468                 if (lint.id.indexOf(searchStr.replace("-", "_")) !== -1) {
 469                     return true;
 470                 }
 471
 472                 // Search the description
 473                 // The use of `for`-loops instead of `foreach` enables us to return early
 474                 let terms = searchStr.split(" ");
 475                 let docsLowerCase = lint.docs.toLowerCase();
 476                 for (index = 0; index < terms.length; index++) {
 477                     // This is more likely and will therefor be checked first
 478                     if (docsLowerCase.indexOf(terms[index]) !== -1) {
 479                         continue;
 480                     }
 481
 482                     if (lint.id.indexOf(terms[index]) !== -1) {
 483                         continue;
 484                     }
 485
 486                     return false;
 487                 }
 488
 489                 return true;
 490             }
 491
 492             // Get data
 493             $scope.open = {};
 494             $scope.loading = true;
 495             // This will be used to jump into the source code of the version that this documentation is for.
 496             $scope.docVersion = window.location.pathname.split('/')[2] || "master";
 497
 498             if (window.location.hash.length > 1) {
 499                 $scope.search = window.location.hash.slice(1);
 500                 $scope.open[window.location.hash.slice(1)] = true;
 501                 scrollToLintByURL($scope);
 502             }
 503
 504             $http.get('./lints.json')
 505             .success(function (data) {
 506                 $scope.data = data;
 507                 $scope.loading = false;
 508
 509                 var selectedGroup = getQueryVariable("sel");
 510                 if (selectedGroup) {
 511                     selectGroup($scope, selectedGroup.toLowerCase());
 512                 }
 513
 514                 scrollToLintByURL($scope);
 515             })
 516             .error(function (data) {
 517                 $scope.error = data;
 518                 $scope.loading = false;
 519             });
 520
 521             window.addEventListener('hashchange', function () {
 522                 // trigger re-render
 523                 $timeout(function () {
 524                     $scope.levels = LEVEL_FILTERS_DEFAULT;
 525                     $scope.search = window.location.hash.slice(1);
 526                     $scope.open[window.location.hash.slice(1)] = true;
 527
 528                     scrollToLintByURL($scope);
 529                 });
 530                 return true;
 531             }, false);
 532         });
 533     })();
 534
 535     function getQueryVariable(variable) {
 536         var query = window.location.search.substring(1);
 537         var vars = query.split('&');
 538         for (var i = 0; i < vars.length; i++) {
 539             var pair = vars[i].split('=');
 540             if (decodeURIComponent(pair[0]) == variable) {
 541                 return decodeURIComponent(pair[1]);
 542             }
 543         }
 544     }
 545
 546     function setupListeners() {
 547         let themeIcon = document.getElementById("theme-icon");
 548         let themeMenu = document.getElementById("theme-menu");
 549         themeIcon.addEventListener("click", function(e) {
 550             if (themeMenu.style.display == "none") {
 551                 themeMenu.style.display = "block";
 552             } else {
 553                 themeMenu.style.display = "none";
 554             }
 555         });
 556
 557         let children = themeMenu.children;
 558         for (let index = 0; index < children.length; index++) {
 559             let child = children[index];
 560             child.addEventListener("click", function(e) {
 561                 setTheme(child.id, true);
 562             });
 563         }
 564     }
 565
 566     setupListeners();
 567
 568     function setTheme(theme, store) {
 569         let enableHighlight = false;
 570         let enableNight = false;
 571         let enableAyu = false;
 572
 573         if (theme == "ayu") {
 574             enableAyu = true;
 575         } else if (theme == "coal" || theme == "navy") {
 576             enableNight = true;
 577         } else if (theme == "rust") {
 578             enableHighlight = true;
 579         } else {
 580             enableHighlight = true;
 581             // this makes sure that an unknown theme request gets set to a known one
 582             theme = "light";
 583         }
 584         document.getElementsByTagName("body")[0].className = theme;
 585
 586         document.getElementById("styleHighlight").disabled = !enableHighlight;
 587         document.getElementById("styleNight").disabled = !enableNight;
 588         document.getElementById("styleAyu").disabled = !enableAyu;
 589
 590         if (store) {
 591             try {
 592                 localStorage.setItem('clippy-lint-list-theme', theme);
 593             } catch (e) { }
 594         }
 595     }
 596
 597     // loading the theme after the initial load
 598     setTheme(localStorage.getItem('clippy-lint-list-theme'), false);
 599     </script>
 600 </body>
 601 </html>