Skip to content

Commit f366df7

Browse files
Anas-ElhounsriAnas-Elhounsri
committed
Added catalog page to RSMetaCheck repo to be the new host
1 parent 5dc8cb3 commit f366df7

1 file changed

Lines changed: 155 additions & 0 deletions

File tree

‎docs/index.html‎

Lines changed: 155 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,155 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>RsMetaCheck Catalog</title>
6+
7+
<!-- DataTables CSS -->
8+
<link rel="stylesheet" href="https://cdn.datatables.net/1.13.6/css/jquery.dataTables.min.css">
9+
10+
<!-- jQuery -->
11+
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
12+
13+
<!-- DataTables JS -->
14+
<script src="https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js"></script>
15+
16+
<style>
17+
body {
18+
font-family: Arial, sans-serif;
19+
padding: 2em;
20+
background: #f9f9f9;
21+
}
22+
h1 {
23+
color: #333;
24+
text-align: center;
25+
margin-bottom: 1em;
26+
}
27+
.intro {
28+
text-align: center;
29+
margin-bottom: 2em;
30+
color: #555;
31+
font-size: 1.3em;
32+
line-height: 1.2;
33+
max-width: 1400px;
34+
margin-left: auto;
35+
margin-right: auto;
36+
}
37+
.table-container {
38+
background: white;
39+
padding: 20px;
40+
border-radius: 8px;
41+
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
42+
}
43+
#myTable {
44+
width: 100%;
45+
}
46+
.dataTables_wrapper {
47+
margin-top: 20px;
48+
}
49+
</style>
50+
</head>
51+
<body>
52+
53+
<h1>RsMetaCheck Catalog</h1>
54+
55+
<div class="intro">
56+
<p>
57+
This is a catalog of the pitfalls and warnings we have come across during our research on software metadata quality.
58+
Based on these findings, we at <a href="https://oeg.fi.upm.es/" target="_blank">Ontology Engineering Group (OEG)</a>
59+
have developed our tool <strong>RsMetaCheck</strong> to automatically diagnose and identify these common issues in software metadata files.
60+
Warnings do not have a severity level because originally they were opted due to their low severity and classified as "Warnings" instead of "Pitfalls"
61+
</p>
62+
</div>
63+
64+
<!-- TABLE -->
65+
<div class="table-container">
66+
<table id="myTable" class="display">
67+
<thead>
68+
<tr>
69+
<th>Identifier</th>
70+
<th>Source</th>
71+
<th>Pitfall</th>
72+
<th>Description</th>
73+
<th>Suggestion</th>
74+
<th>Examples</th>
75+
<th>Importance</th>
76+
</tr>
77+
</thead>
78+
<tbody>
79+
80+
</tbody>
81+
</table>
82+
</div>
83+
84+
<script>
85+
function loadTableData() {
86+
const timestamp = new Date().getTime();
87+
fetch(`catalog.md?v=${timestamp}`)
88+
.then(response => response.text())
89+
.then(markdown => {
90+
const lines = markdown.trim().split('\n');
91+
const tableBody = $('#myTable tbody');
92+
93+
for (let i = 2; i < lines.length; i++) {
94+
const line = lines[i].trim();
95+
if (line.startsWith('|') && line.endsWith('|')) {
96+
const cells = line.split('|').slice(1, -1).map(cell => cell.trim());
97+
if (cells.length >= 7) {
98+
const [identifier, source, pitfall, description, suggestion, examples, importance] = cells;
99+
100+
let exampleCell = examples;
101+
if (examples.startsWith('http')) {
102+
exampleCell = `<a href="${examples}" target="_blank">${examples}</a>`;
103+
}
104+
105+
const row = `<tr id="${identifier}">
106+
<td>${identifier}</td>
107+
<td>${source}</td>
108+
<td>${pitfall}</td>
109+
<td>${description}</td>
110+
<td>${suggestion}</td>
111+
<td>${exampleCell}</td>
112+
<td>${importance}</td>
113+
</tr>`;
114+
tableBody.append(row);
115+
}
116+
}
117+
}
118+
119+
const table = $('#myTable').DataTable({
120+
pageLength: 25,
121+
order: [[0, 'asc']],
122+
initComplete: function(settings, json) {
123+
if (window.location.hash) {
124+
const targetId = window.location.hash;
125+
const api = this.api();
126+
127+
const rowIndex = api.row(targetId).index();
128+
129+
if (rowIndex !== undefined) {
130+
const pageInfo = api.page.info();
131+
const targetPage = Math.floor(rowIndex / pageInfo.length);
132+
api.page(targetPage).draw(false);
133+
134+
setTimeout(() => {
135+
$('html, body').animate({
136+
scrollTop: $(targetId).offset().top - 20
137+
}, 500);
138+
139+
$(targetId).css('background-color', '#ffff99');
140+
setTimeout(() => $(targetId).css('background-color', ''), 2000);
141+
}, 100);
142+
}
143+
}
144+
}
145+
});
146+
})
147+
.catch(error => console.error('Error loading table data:', error));
148+
}
149+
150+
$(document).ready(function () {
151+
loadTableData();
152+
});
153+
</script>
154+
</body>
155+
</html>

0 commit comments

Comments
 (0)