-
Notifications
You must be signed in to change notification settings - Fork 8
/
Copy pathvariants.html
86 lines (76 loc) · 2.76 KB
/
variants.html
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
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" conteSpt="width=device-width, initial-scale=1">
<title>Spack Packages</title>
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="icon" href="favicon.ico" type="image/x-icon">
<style>
@import url(https://fonts.googleapis.com/css?family=Raleway:400,700,900);
.title {
padding-top:20px;
padding-left:10px;
font-family: 'Raleway', sans-serif;
font-weight: 700;
}
.linkything {
font-size:12px;
color:#F7F7F7;
padding-left:5px;
}
.linkythink:hover {
color:#CCC;
}
</style>
</head>
<body>
<div class="container" style="padding:30px;">
<h1 class='title'><img src="img/spack-logo.svg" style="width:60px; padding-right:15px; padding-bottom:20px">Variants</h1>
<div id="variants_div"></div>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
function loadJSON(path, success, error)
{
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function()
{
if (xhr.readyState === XMLHttpRequest.DONE) {
if (xhr.status === 200) {
if (success)
success(JSON.parse(xhr.responseText));
} else {
if (error)
error(xhr);
}
}
};
xhr.open("GET", path, true);
xhr.send();
}
loadJSON('data/variants.json',
function(data) {
$.each(data, function(key, item) {
var falses = ""
var trues = ""
$.each(item, function(i, subitem) {
if (subitem['default'] == false) {
falses += "<span class='badge badge-warning'><a style='color:black' href='package.html?name=" + subitem['package'] + "'>" + subitem['package'] + "</a></span> ";
} else {
trues += "<span class='badge badge-success'><a style='color:white' href='package.html?name=" + subitem['package'] + "'>" + subitem['package'] + "</a></span> ";
}
});
if (trues.length > 0) {
$("#variants_div").append("<div style='padding-bottom:10px' class='row'><div class='col-md-12'><h4 id='" + key + "_true'>"+ key + " (true) <a class='linkything' href='#" + key + "_true'>¶</a></h4>" + trues + "</div></div>");
}
if (falses.length > 0) {
$("#variants_div").append("<div style='padding-bottom:10px' class='row'><div class='col-md-12'><h4 id='" + key + "_false'>"+ key + " (false)<a class='linkything' href='#" + key + "_false'>¶</a></h4>" + falses + "</div></div>");
}
});
})
</script>
</body>
</html>