1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
|
import Vue from 'vue';
import { compareVersions } from 'compare-versions';
import DeprecationFilters from './components/deprecation_filters.vue';
/**
* Builds an array of removal milestone options from page content.
*
* Each milestone object contains:
* - A text string, used for labels in the select options list.
* This also appears as a query string value in the URL when filtering.
* - A value string, which is the same as the text string, but without periods.
* This is used to match the query with CSS classes on deprecations.
* CSS classes cannot include periods, so we drop those for this element.
*
* @param {String} showAllText
* Label for default/unselected state.
* @return {Array}
*/
const buildMilestonesList = (showAllText) => {
let milestones = [];
document.querySelectorAll('.removal-milestone').forEach(function addOption(el) {
if (!milestones.includes(el.innerText)) {
milestones.push(el.innerText);
}
});
milestones.sort(compareVersions).reverse();
milestones = milestones.map(function addValues(el) {
return { value: el.replaceAll('.', ''), text: el };
});
milestones.unshift({ value: showAllText, text: showAllText });
return milestones;
};
document.addEventListener('DOMContentLoaded', () => {
const showAllText = 'Show all';
const milestonesList = buildMilestonesList(showAllText);
return new Vue({
el: '.js-deprecation-filters',
components: {
DeprecationFilters,
},
render(createElement) {
return createElement(DeprecationFilters, {
props: {
milestonesList,
showAllText,
},
});
},
});
});
|
