src/tools/clippy/util/gh-pages/index.html

   1 <!DOCTYPE html>
   2 <html lang="en">
   3 <head>
   4     <meta charset="UTF-8"/>
   5     <meta name="viewport" content="width=device-width, initial-scale=1"/>
   6
   7     <title>ALL the Clippy Lints</title>
   8
   9     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.min.css"/>
  10     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.5.0/styles/github.min.css"/>
  11
  12     <!-- The files are not copied over into the Clippy project since they use the MPL-2.0 License -->
  13     <link rel="stylesheet" href="https://rust-lang.github.io/mdBook/css/variables.css"/>
  14     <link id="styleHighlight" rel="stylesheet" href="https://rust-lang.github.io/mdBook/highlight.css">
  15     <link id="styleNight" rel="stylesheet" href="https://rust-lang.github.io/mdBook/tomorrow-night.css" disabled="true">
  16     <link id="styleAyu" rel="stylesheet" href="https://rust-lang.github.io/mdBook/ayu-highlight.css" disabled="true">
  17     <style>
  18         blockquote { font-size: 1em; }
  19         [ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak { display: none !important; }
  20
  21         .form-inline .checkbox { margin-right: 0.6em }
  22
  23         .panel-heading { cursor: pointer; }
  24
  25         .panel-title { display: flex; }
  26         .panel-title .label { display: inline-block; }
  27
  28         .panel-title-name { flex: 1; }
  29         .panel-title-name span { vertical-align: bottom; }
  30
  31         .panel .panel-title-name .anchor { display: none; }
  32         .panel:hover .panel-title-name .anchor { display: inline;}
  33
  34     </style>
  35     <style>
  36         /* Expanding the mdBoom theme*/
  37         .light {
  38             --inline-code-bg: #f6f7f6;
  39         }
  40         .rust {
  41             --inline-code-bg: #f6f7f6;
  42         }
  43         .coal {
  44             --inline-code-bg: #1d1f21;
  45         }
  46         .navy {
  47             --inline-code-bg: #1d1f21;
  48         }
  49         .ayu {
  50             --inline-code-bg: #191f26;
  51         }
  52
  53         /* Applying the mdBook theme */
  54         .theme-icon {
  55             position: absolute;
  56             text-align: center;
  57             width: 2em;
  58             height: 2em;
  59             margin: 0.7em;
  60             line-height: 2em;
  61             border: solid 1px var(--icons);
  62             border-radius: 5px;
  63             user-select: none;
  64             cursor: pointer;
  65         }
  66         .theme-icon:hover {
  67             background: var(--theme-hover);
  68         }
  69         .theme-choice {
  70             position: absolute;
  71             margin-top: calc(2em + 0.7em);
  72             margin-left: 0.7em;
  73             list-style: none;
  74             border: 1px solid var(--theme-popup-border);
  75             border-radius: 5px;
  76             color: var(--fg);
  77             background: var(--theme-popup-bg);
  78             padding: 0 0;
  79         }
  80         .theme-choice > li {
  81             padding: 5px 10px;
  82             font-size: 0.8em;
  83             user-select: none;
  84             cursor: pointer;
  85         }
  86         .theme-choice > li:hover {
  87             background: var(--theme-hover);
  88         }
  89
  90         .alert {
  91             color: var(--fg);
  92             background: var(--theme-hover);
  93             border: 1px solid var(--theme-popup-border);
  94         }
  95         .page-header {
  96             border-color: var(--theme-popup-border);
  97         }
  98         .panel-default > .panel-heading {
  99             background: var(--theme-hover);
 100             color: var(--fg);
 101             border: 1px solid var(--theme-popup-border);
 102         }
 103         .panel-default > .panel-heading:hover {
 104             filter: brightness(90%);
 105         }
 106         .list-group-item {
 107             background: 0%;
 108             border: 1px solid var(--theme-popup-border);
 109         }
 110         .panel, pre, hr {
 111             background: var(--bg);
 112             border: 1px solid var(--theme-popup-border);
 113         }
 114
 115         #filter-label, #filter-clear {
 116             background: var(--searchbar-bg);
 117             color: var(--searchbar-fg);
 118             border-color: var(--theme-popup-border);
 119             filter: brightness(95%);
 120         }
 121         #filter-label:hover, #filter-clear:hover {
 122             filter: brightness(90%);
 123         }
 124         #filter-input {
 125             background: var(--searchbar-bg);
 126             color: var(--searchbar-fg);
 127             border-color: var(--theme-popup-border);
 128         }
 129
 130         #filter-input::-webkit-input-placeholder,
 131         #filter-input::-moz-placeholder {
 132             color: var(--searchbar-fg);
 133             opacity: 30%;
 134         }
 135
 136         p > code {
 137             color: var(--inline-code-color);
 138             background-color: var(--inline-code-bg);
 139         }
 140         html {
 141             scrollbar-color: var(--scrollbar) var(--bg);
 142         }
 143         body {
 144             background: var(--bg);
 145             color: var(--fg);
 146         }
 147
 148     </style>
 149 </head>
 150 <body>
 151     <div id="theme-icon" class="theme-icon">&#128396;</div>
 152     <ul id="theme-menu" class="theme-choice" style="display: none;">
 153         <li id="light">Light</li>
 154         <li id="rust">Rust</li>
 155         <li id="coal">Coal</li>
 156         <li id="navy">Navy</li>
 157         <li id="ayu">Ayu</li>
 158     </ul>
 159
 160     <div class="container" ng-app="clippy" ng-controller="lintList">
 161         <div class="page-header">
 162             <h1>ALL the Clippy Lints</h1>
 163         </div>
 164
 165         <noscript>
 166             <div class="alert alert-danger" role="alert">
 167                 Sorry, this site only works with JavaScript! :(
 168             </div>
 169         </noscript>
 170
 171         <div ng-cloak>
 172
 173             <div class="alert alert-info" role="alert" ng-if="loading">
 174                 Loading&#x2026;
 175             </div>
 176             <div class="alert alert-danger" role="alert" ng-if="error">
 177                 Error loading lints!
 178             </div>
 179
 180             <div class="panel panel-default" ng-show="data">
 181                 <div class="panel-body row filter-panel">
 182                     <div class="col-md-6 form-inline">
 183                         <div class="form-group form-group-lg">
 184                             <p class="h4">Lint levels</p>
 185                             <div class="checkbox" ng-repeat="(level, enabled) in levels">
 186                                 <label>
 187                                     <input type="checkbox" ng-model="levels[level]" />
 188                                     {{level}}
 189                                 </label>
 190                             </div>
 191                         </div>
 192                     </div>
 193                     <div class="col-md-6 form-inline">
 194                         <div class="form-group form-group-lg">
 195                             <p class="h4">Lint groups</p>
 196                             <div class="checkbox" ng-repeat="(group, enabled) in groups">
 197                                 <label class="text-capitalize">
 198                                     <input type="checkbox" ng-model="groups[group]" />
 199                                     {{group}}
 200                                 </label>
 201                             </div>
 202                         </div>
 203                     </div>
 204                 </div>
 205                 <div class="panel-body row">
 206                     <div class="col-md-12 form-horizontal">
 207                         <div class="input-group">
 208                             <label class="input-group-addon" id="filter-label" for="filter-input">Filter:</label>
 209                             <input type="text" class="form-control" placeholder="Keywords or search string" id="filter-input" ng-model="search" ng-model-options="{debounce: 50}"/>
 210                             <span class="input-group-btn">
 211                                 <button id="filter-clear" class="btn" type="button" ng-click="search = ''">
 212                                     Clear
 213                                 </button>
 214                             </span>
 215                         </div>
 216                     </div>
 217                 </div>
 218             </div>
 219
 220             <article class="panel panel-default" id="{{lint.id}}"
 221                 ng-repeat="lint in data | filter:byLevels | filter:byGroups | filter:bySearch | orderBy:'id' track by lint.id">
 222                 <header class="panel-heading" ng-click="open[lint.id] = !open[lint.id]">
 223                     <h2 class="panel-title">
 224                         <div class="panel-title-name">
 225                             <span>{{lint.id}}</span>
 226                             <a href="#{{lint.id}}" class="anchor label label-default" ng-click="open[lint.id] = true; $event.stopPropagation()">&para;</a>
 227                         </div>
 228
 229                         <div class="panel-title-addons">
 230                             <span class="label label-default text-capitalize">{{lint.group}}</span>
 231
 232                             <span ng-if="lint.level == 'Allow'" class="label label-success">Allow</span>
 233                             <span ng-if="lint.level == 'Warn'" class="label label-warning">Warn</span>
 234                             <span ng-if="lint.level == 'Deny'" class="label label-danger">Deny</span>
 235                             <span ng-if="lint.level == 'Deprecated'" class="label label-default">Deprecated</span>
 236
 237                             <button class="btn btn-default btn-xs">
 238                                 <span ng-show="open[lint.id]">&minus;</span>
 239                                 <span ng-hide="open[lint.id]">&plus;</span>
 240                             </button>
 241                         </div>
 242                     </h2>
 243                 </header>
 244
 245                 <ul class="list-group lint-docs" ng-if="lint.docs" ng-class="{collapse: true, in: open[lint.id]}">
 246                     <li class="list-group-item" ng-repeat="(title, text) in lint.docs">
 247                         <h4 class="list-group-item-heading">
 248                             {{title}}
 249                         </h4>
 250                         <div class="list-group-item-text" ng-bind-html="text | markdown"></div>
 251                         <a ng-if="title == 'Known problems'" href="https://github.com/rust-lang/rust-clippy/issues?q=is%3Aissue+is%3Aopen+{{lint.id}}">Search on GitHub</a>
 252                     </li>
 253                 </ul>
 254             </article>
 255         </div>
 256     </div>
 257
 258     <a href="https://github.com/rust-lang/rust-clippy">
 259         <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"/>
 260     </a>
 261
 262     <script src="https://cdnjs.cloudflare.com/ajax/libs/markdown-it/7.0.0/markdown-it.min.js"></script>
 263     <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.5.0/highlight.min.js"></script>
 264     <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.5.0/languages/rust.min.js"></script>
 265     <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.12/angular.min.js"></script>
 266     <script>
 267     (function () {
 268         var md = window.markdownit({
 269             html: true,
 270             linkify: true,
 271             typographer: true,
 272             highlight: function (str, lang) {
 273                 if (lang && hljs.getLanguage(lang)) {
 274                     try {
 275                         return '<pre class="hljs"><code>' +
 276                             hljs.highlight(lang, str, true).value +
 277                             '</code></pre>';
 278                     } catch (__) {}
 279                 }
 280
 281                 return '<pre class="hljs"><code>' + md.utils.escapeHtml(str) + '</code></pre>';
 282             }
 283         });
 284
 285         function scrollToLint(lintId) {
 286             var target = document.getElementById(lintId);
 287             if (!target) {
 288                 return;
 289             }
 290             target.scrollIntoView();
 291         }
 292
 293         function scrollToLintByURL($scope) {
 294             var removeListener = $scope.$on('ngRepeatFinished', function(ngRepeatFinishedEvent) {
 295                 scrollToLint(window.location.hash.slice(1));
 296                 removeListener();
 297             });
 298         }
 299
 300         function selectGroup($scope, selectedGroup) {
 301             var groups = $scope.groups;
 302             for (var group in groups) {
 303                 if (groups.hasOwnProperty(group)) {
 304                     if (group === selectedGroup) {
 305                         groups[group] = true;
 306                     } else {
 307                         groups[group] = false;
 308                     }
 309                 }
 310             }
 311         }
 312
 313         function searchLint(lint, term) {
 314             for (const field in lint.docs) {
 315                 // Continue if it's not a property
 316                 if (!lint.docs.hasOwnProperty(field)) {
 317                     continue;
 318                 }
 319
 320                 // Return if not found
 321                 if (lint.docs[field].toLowerCase().indexOf(term) !== -1) {
 322                     return true;
 323                 }
 324             }
 325
 326             return false;
 327         }
 328
 329         angular.module("clippy", [])
 330         .filter('markdown', function ($sce) {
 331             return function (text) {
 332                 return $sce.trustAsHtml(
 333                     md.render(text || '')
 334                     // Oh deer, what a hack :O
 335                     .replace('<table', '<table class="table"')
 336                 );
 337             };
 338         })
 339         .directive('onFinishRender', function ($timeout) {
 340             return {
 341                 restrict: 'A',
 342                 link: function (scope, element, attr) {
 343                     if (scope.$last === true) {
 344                         $timeout(function () {
 345                             scope.$emit(attr.onFinishRender);
 346                         });
 347                     }
 348                 }
 349             };
 350         })
 351         .controller("lintList", function ($scope, $http, $timeout) {
 352             // Level filter
 353             var LEVEL_FILTERS_DEFAULT = {Allow: true, Warn: true, Deny: true, Deprecated: true};
 354             $scope.levels = LEVEL_FILTERS_DEFAULT;
 355             $scope.byLevels = function (lint) {
 356                 return $scope.levels[lint.level];
 357             };
 358
 359             $scope.groups = {};
 360             $scope.byGroups = function (lint) {
 361                 return $scope.groups[lint.group];
 362             };
 363
 364             $scope.bySearch = function (lint, index, array) {
 365                 let searchStr = $scope.search;
 366                 // It can be `null` I haven't missed this value
 367                 if (searchStr == null || searchStr.length < 3) {
 368                     return true;
 369                 }
 370                 searchStr = searchStr.toLowerCase();
 371
 372                 // Search by id
 373                 if (lint.id.indexOf(searchStr.replace("-", "_")) !== -1) {
 374                     return true;
 375                 }
 376
 377                 // Search the description
 378                 // The use of `for`-loops instead of `foreach` enables us to return early
 379                 let terms = searchStr.split(" ");
 380                 for (index = 0; index < terms.length; index++) {
 381                     if (lint.id.indexOf(terms[index]) !== -1) {
 382                         continue;
 383                     }
 384
 385                     if (searchLint(lint, terms[index])) {
 386                         continue;
 387                     }
 388
 389                     return false;
 390                 }
 391
 392                 return true;
 393             }
 394
 395             // Get data
 396             $scope.open = {};
 397             $scope.loading = true;
 398
 399             if (window.location.hash.length > 1) {
 400                 $scope.search = window.location.hash.slice(1);
 401                 $scope.open[window.location.hash.slice(1)] = true;
 402                 scrollToLintByURL($scope);
 403             }
 404
 405             $http.get('./lints.json')
 406             .success(function (data) {
 407                 $scope.data = data;
 408                 $scope.loading = false;
 409
 410                 // Initialize lint groups (the same structure is also used to enable filtering)
 411                 $scope.groups = data.reduce(function (result, val) {
 412                     result[val.group] = true;
 413                     return result;
 414                 }, {});
 415
 416                 var selectedGroup = getQueryVariable("sel");
 417                 if (selectedGroup) {
 418                     selectGroup($scope, selectedGroup.toLowerCase());
 419                 }
 420
 421                 scrollToLintByURL($scope);
 422             })
 423             .error(function (data) {
 424                 $scope.error = data;
 425                 $scope.loading = false;
 426             });
 427
 428             window.addEventListener('hashchange', function () {
 429                 // trigger re-render
 430                 $timeout(function () {
 431                     $scope.levels = LEVEL_FILTERS_DEFAULT;
 432                     $scope.search = window.location.hash.slice(1);
 433                     $scope.open[window.location.hash.slice(1)] = true;
 434
 435                     scrollToLintByURL($scope);
 436                 });
 437                 return true;
 438             }, false);
 439         });
 440     })();
 441
 442     function getQueryVariable(variable) {
 443         var query = window.location.search.substring(1);
 444         var vars = query.split('&');
 445         for (var i = 0; i < vars.length; i++) {
 446             var pair = vars[i].split('=');
 447             if (decodeURIComponent(pair[0]) == variable) {
 448                 return decodeURIComponent(pair[1]);
 449             }
 450         }
 451     }
 452
 453     function setupListeners() {
 454         let themeIcon = document.getElementById("theme-icon");
 455         let themeMenu = document.getElementById("theme-menu");
 456         themeIcon.addEventListener("click", function(e) {
 457             if (themeMenu.style.display == "none") {
 458                 themeMenu.style.display = "block";
 459             } else {
 460                 themeMenu.style.display = "none";
 461             }
 462         });
 463
 464         let children = themeMenu.children;
 465         for (let index = 0; index < children.length; index++) {
 466             let child = children[index];
 467             child.addEventListener("click", function(e) {
 468                 setTheme(child.id, true);
 469             });
 470         }
 471     }
 472
 473     setupListeners();
 474
 475     function setTheme(theme, store) {
 476         let enableHighlight = false;
 477         let enableNight = false;
 478         let enableAyu = false;
 479
 480         if (theme == "ayu") {
 481             enableAyu = true;
 482         } else if (theme == "coal" || theme == "navy") {
 483             enableNight = true;
 484         } else if (theme == "rust") {
 485             enableHighlight = true;
 486         } else {
 487             enableHighlight = true;
 488             // this makes sure that an unknown theme request gets set to a known one
 489             theme = "light";
 490         }
 491         document.getElementsByTagName("body")[0].className = theme;
 492
 493         document.getElementById("styleHighlight").disabled = !enableHighlight;
 494         document.getElementById("styleNight").disabled = !enableNight;
 495         document.getElementById("styleAyu").disabled = !enableAyu;
 496
 497         if (store) {
 498             try {
 499                 localStorage.setItem('clippy-lint-list-theme', theme);
 500             } catch (e) { }
 501         }
 502     }
 503
 504     // loading the theme after the initial load
 505     setTheme(localStorage.getItem('clippy-lint-list-theme'), false);
 506     </script>
 507 </body>
 508 </html>