Oliver/ODOO4projects.com
Public Access
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add OCA Modules Status section: searchable scrollable table with v19/v20 support indicators and GitHub icon links

Browse Source
This commit is contained in:
Reef committed 2026-09-27 10:24:03 +00:00
1 parent 246beeb231
commit 3605545838
2 files changed
+110
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

index.html
+47
View File
@@ -99,6 +99,26 @@
.biz-checkbox input[type="checkbox"]{width:1.05rem;height:1.05rem;accent-color:var(--brass);cursor:pointer;flex-shrink:0}
.biz-success{margin-top:1.5rem}.biz-success i{font-size:2.5rem;color:var(--success);margin-bottom:.75rem}
.biz-success h3{color:#fff;margin-bottom:.5rem}.biz-success p{color:rgba(255,255,255,.65);font-size:.95rem;max-width:480px;margin:0 auto 1.25rem;line-height:1.7}
/* OCA Modules */
.oca-section{padding:3.5rem 0;overflow-x:hidden}
.oca-search-wrap{max-width:400px;margin:0 auto 1.5rem}
.oca-search{width:100%;padding:.7rem 1rem;border-radius:var(--radius-pill);border:1px solid var(--line-brass);background:rgba(255,255,255,.06);color:#fff;font-family:Inter,sans-serif;font-size:.85rem;outline:none;transition:border-color .2s,background .2s;box-sizing:border-box}
.oca-search:focus{border-color:var(--brass);background:rgba(255,255,255,.1)}
.oca-search::placeholder{color:rgba(255,255,255,.3)}
.oca-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--radius-lg);border:1px solid var(--line-brass);background:rgba(255,255,255,.03)}
.oca-table{width:100%;border-collapse:collapse;min-width:500px}
.oca-table th{padding:.75rem 1rem;text-align:left;font-family:Marcellus,Georgia,serif;font-size:.85rem;letter-spacing:.06em;text-transform:uppercase;color:var(--brass);border-bottom:1px solid var(--line-brass);background:rgba(13,27,46,.5);white-space:nowrap}
.oca-table th:last-child{width:48px;text-align:center}
.oca-table td{padding:.65rem 1rem;font-size:.85rem;color:rgba(255,255,255,.8);border-bottom:1px solid rgba(201,162,39,.08);vertical-align:middle}
.oca-table tbody tr:hover{background:rgba(201,162,39,.06)}
.oca-table tbody tr:last-child td{border-bottom:none}
.oca-check{color:var(--success);font-size:1rem}
.oca-cross{color:rgba(255,255,255,.2);font-size:1rem}
.oca-icon-link{color:var(--brass);font-size:1.1rem;cursor:pointer;transition:color .2s,transform .2s;display:inline-block}
.oca-icon-link:hover{color:var(--brass-bright);transform:scale(1.2)}
.oca-empty{text-align:center;padding:2rem;color:rgba(255,255,255,.4);font-style:italic;display:none}
.oca-loading{text-align:center;padding:2rem;color:rgba(255,255,255,.4);font-size:.88rem}
@media(max-width:600px){.oca-table td,.oca-table th{padding:.5rem .65rem;font-size:.8rem}}
</style>
<link rel="stylesheet" href="style.css" media="print" onload="this.media='all'" />
<noscript><link rel="stylesheet" href="style.css" /></noscript>
@@ -402,6 +422,33 @@
</div>
</section>
<!-- OCA Modules Status -->
<section class="section-dark oca-section" id="ocaModules">
<div class="container">
<p class="section-kicker">OCA Modules</p>
<h2 class="section-title">Most Used OCA Module Status</h2>
<div class="oca-search-wrap">
<input type="text" class="oca-search" id="ocaSearch" placeholder="Search modules..." />
</div>
<div class="oca-table-wrap">
<table class="oca-table" id="ocaTable">
<thead>
<tr>
<th>Module</th>
<th>Area</th>
<th>19.0</th>
<th>20.0</th>
<th></th>
</tr>
</thead>
<tbody id="ocaTbody"></tbody>
</table>
</div>
<div class="oca-empty" id="ocaEmpty">No modules match your search.</div>
<div class="oca-loading" id="ocaLoading">Loading modules...</div>
</div>
</section>
<!-- Business Wizard -->
<section class="biz-wizard">
<div class="container">
script.js
+63
View File
@@ -666,3 +666,66 @@ var si = 0,
form.submit();
document.body.removeChild(form);
};
/* ---- OCA Modules Status ---- */
(function () {
var tbody = document.getElementById('ocaTbody');
var searchInput = document.getElementById('ocaSearch');
var empty = document.getElementById('ocaEmpty');
var loading = document.getElementById('ocaLoading');
var allModules = [];
function render(filter) {
var q = (filter || '').toLowerCase();
var matched = q ? allModules.filter(function (m) { return (m.name + ' ' + m.area).toLowerCase().indexOf(q) !== -1; }) : allModules;
if (matched.length === 0) {
tbody.innerHTML = '';
empty.style.display = 'block';
return;
}
empty.style.display = 'none';
var html = '';
for (var i = 0; i < matched.length; i++) {
var mod = matched[i];
var v19 = mod.v19 ? '<span class="oca-check">&#10003;</span>' : '<span class="oca-cross">&ndash;</span>';
var v20 = mod.v20 ? '<span class="oca-check">&#10003;</span>' : '<span class="oca-cross">&ndash;</span>';
html += '<tr>' +
'<td>' + esc(mod.name) + '</td>' +
'<td>' + esc(mod.area) + '</td>' +
'<td>' + v19 + '</td>' +
'<td>' + v20 + '</td>' +
'<td><a href="' + esc(mod.URL) + '" target="_blank" rel="noopener" class="oca-icon-link" title="View on GitHub"><i class="fas fa-external-link-alt"></i></a></td>' +
'</tr>';
}
tbody.innerHTML = html;
}
function esc(s) {
var d = document.createElement('div');
d.appendChild(document.createTextNode(s || ''));
return d.innerHTML;
}
fetch('https://n8n.odoo4projects.com/webhook/oc-guy/modules')
.then(function (r) { return r.json(); })
.then(function (data) {
if (data && Array.isArray(data.data)) {
allModules = data.data;
} else if (Array.isArray(data) && data.length > 0 && Array.isArray(data[0].data)) {
allModules = data[0].data;
} else if (Array.isArray(data)) {
allModules = data;
}
loading.style.display = 'none';
render(searchInput ? searchInput.value : '');
})
.catch(function () {
loading.textContent = 'Could not load module status.';
});
if (searchInput) {
searchInput.addEventListener('input', function () {
render(this.value);
});
}
})();