Skip to content

Commit 801e5b3

Browse files
samueltardieusamueltardieu
authored
Fix website history interactions (#16060)
cc @GuillaumeGomez - Searching/filtering no longer creates a new history entry per keystroke/change - Loading a URL with a specified search query now works. The search is now stored as `?search=foo` instead of `#/foo`, not a breaking change since this didn't work before - The browser back/forward actions now update the filters/search and displayed lints The bulk of the changes are to support that last one, previously the filter state was stored both in the DOM and as JS objects. The DOM is now the single source of truth changelog: none
2 parents 0ac6646 + 4e35148 commit 801e5b3

File tree

3 files changed

+233
-377
lines changed

3 files changed

+233
-377
lines changed

‎util/gh-pages/index_template.html‎

Lines changed: 54 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@
2828
<script src="script.js" defer></script> {# #}
2929
</head> {# #}
3030
<body> {# #}
31-
<div id="settings-dropdown"> {# #}
31+
<div id="settings-dropdown" class="dropdown"> {# #}
3232
<button class="settings-icon" tabindex="-1"></button> {# #}
3333
<div class="settings-menu" tabindex="-1"> {# #}
3434
<div class="setting-radio-name">Theme</div> {# #}
@@ -59,72 +59,104 @@ <h1 class="page-header">Clippy Lints <span class="badge">Total number: {{+ count
5959
<div id="menu-filters"> {# #}
6060
<div class="panel-body row"> {# #}
6161
<div id="upper-filters"> {# #}
62-
<div id="lint-levels" tabindex="-1"> {# #}
62+
<div class="dropdown" data-filter="levels" tabindex="-1"> {# #}
6363
<button type="button" class="btn-default dropdown-toggle"> {# #}
64-
Lint levels <span class="badge">4</span> <span class="caret"></span> {# #}
64+
Lint levels <span id="levels-count" class="badge">4</span> <span class="caret"></span> {# #}
6565
</button> {# #}
66-
<ul class="dropdown-menu" id="lint-levels-selector"> {# #}
66+
<ul class="dropdown-menu"> {# #}
6767
<li class="checkbox"> {# #}
68-
<button onclick="toggleElements('levels_filter', true)">All</button> {# #}
68+
<button class="reset-all">All</button> {# #}
6969
</li> {# #}
7070
<li class="checkbox"> {# #}
71-
<button onclick="toggleElements('levels_filter', false)">None</button> {# #}
71+
<button class="reset-none">None</button> {# #}
7272
</li> {# #}
7373
<li role="separator" class="divider"></li> {# #}
74+
{% for level in ["allow", "warn", "deny", "none"] %}
75+
<li class="checkbox"> {# #}
76+
<label> {# #}
77+
<input type="checkbox" name="{{ level }}" checked />
78+
{{ level | capitalize }}
79+
</label> {# #}
80+
</li> {# #}
81+
{% endfor %}
7482
</ul> {# #}
7583
</div> {# #}
76-
<div id="lint-groups" tabindex="-1"> {# #}
84+
<div class="dropdown" data-filter="groups" tabindex="-1"> {# #}
7785
<button type="button" class="btn-default dropdown-toggle"> {# #}
78-
Lint groups <span class="badge">9</span> <span class="caret"></span> {# #}
86+
Lint groups <span id="groups-count" class="badge">9</span> <span class="caret"></span> {# #}
7987
</button> {# #}
80-
<ul class="dropdown-menu" id="lint-groups-selector"> {# #}
88+
<ul class="dropdown-menu"> {# #}
8189
<li class="checkbox"> {# #}
82-
<button onclick="toggleElements('groups_filter', true)">All</button> {# #}
90+
<button class="reset-all">All</button> {# #}
8391
</li> {# #}
8492
<li class="checkbox"> {# #}
85-
<button onclick="resetGroupsToDefault()">Default</button> {# #}
93+
<button class="reset-default">Default</button> {# #}
8694
</li> {# #}
8795
<li class="checkbox"> {# #}
88-
<button onclick="toggleElements('groups_filter', false)">None</button> {# #}
96+
<button class="reset-none">None</button> {# #}
8997
</li> {# #}
9098
<li role="separator" class="divider"></li> {# #}
99+
{% for group in ["cargo", "complexity", "correctness", "nursery", "pedantic", "perf", "restriction", "style", "suspicious", "deprecated"] %}
100+
<li class="checkbox"> {# #}
101+
<label> {# #}
102+
<input type="checkbox" name="{{ group }}" {% if *group != "deprecated" +%} checked {% endif %} />
103+
{{ group | capitalize }}
104+
</label> {# #}
105+
</li> {# #}
106+
{% endfor %}
91107
</ul> {# #}
92108
</div> {# #}
93-
<div id="version-filter" tabindex="-1"> {# #}
109+
<div id="version-filter" class="dropdown" tabindex="-1"> {# #}
94110
<button type="button" class="btn-default dropdown-toggle"> {# #}
95111
Version {#+ #}
96-
<span id="version-filter-count" class="badge">0</span> {#+ #}
112+
<span id="versions-count" class="badge">0</span> {#+ #}
97113
<span class="caret"></span> {# #}
98114
</button> {# #}
99-
<ul id="version-filter-selector" class="dropdown-menu"> {# #}
115+
<ul class="dropdown-menu"> {# #}
100116
<li class="checkbox"> {# #}
101-
<button onclick="clearVersionFilters()">Clear filters</button> {# #}
117+
<button id="reset-versions">Clear filters</button> {# #}
102118
</li> {# #}
103119
<li role="separator" class="divider"></li> {# #}
120+
{% for (sym, name) in [("≥", "gte"), ("≤", "lte"), ("=", "eq")] %}
121+
<li class="checkbox"> {# #}
122+
<label>{{ sym }}</label> {#+ #}
123+
<span>1.</span> {# #}
124+
<input type="number" name="{{ name }}" min="29" maxlength="2" class="version-filter-input form-control filter-input" /> {# #}
125+
<span>.0</span> {# #}
126+
</li> {# #}
127+
{% endfor %}
104128
</ul> {# #}
105129
</div> {# #}
106-
<div id="lint-applicabilities" tabindex="-1"> {# #}
130+
<div class="dropdown" data-filter="applicabilities" tabindex="-1"> {# #}
107131
<button type="button" class="btn-default dropdown-toggle"> {# #}
108132
Applicability {#+ #}
109-
<span class="badge">4</span> {#+ #}
133+
<span id="applicabilities-count" class="badge">4</span> {#+ #}
110134
<span class="caret"></span> {# #}
111135
</button> {# #}
112-
<ul class="dropdown-menu" id="lint-applicabilities-selector"> {# #}
136+
<ul class="dropdown-menu"> {# #}
113137
<li class="checkbox"> {# #}
114-
<button onclick="toggleElements('applicabilities_filter', true)">All</button> {# #}
138+
<button class="reset-all">All</button> {# #}
115139
</li> {# #}
116140
<li class="checkbox"> {# #}
117-
<button onclick="toggleElements('applicabilities_filter', false)">None</button> {# #}
141+
<button class="reset-none">None</button> {# #}
118142
</li> {# #}
119143
<li role="separator" class="divider"></li> {# #}
144+
{% for applicability in ["Unspecified", "MachineApplicable", "MaybeIncorrect", "HasPlaceholders"] %}
145+
<li class="checkbox"> {# #}
146+
<label> {# #}
147+
<input type="checkbox" name="{{ applicability }}" checked />
148+
{{ applicability }}
149+
</label> {# #}
150+
</li> {# #}
151+
{% endfor %}
120152
</ul> {# #}
121153
</div> {# #}
122154
</div> {# #}
123155
<div class="search-control"> {# #}
124156
<div class="input-group"> {# #}
125157
<label class="input-group-addon" id="filter-label" for="search-input">Filter:</label> {# #}
126158
<input type="text" class="form-control filter-input" placeholder="Keywords or search string (`S` or `/` to focus)" id="search-input" /> {# #}
127-
<button class="filter-clear" type="button" onclick="searchState.clearInput(event)"> {# #}
159+
<button id="filter-clear" type="button"> {# #}
128160
Clear {# #}
129161
</button> {# #}
130162
</div> {# #}

0 commit comments

Comments
 (0)