adam/Paillasse
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Maquettes Claude Design avec visio de classe

Browse source
This commit is contained in:
Adam Belkacemi 2026-10-06 23:28:18 +02:00
parent 238070ae54
commit 236d2d3567
243 changed files with 27992 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

52
design/js/ressource-page.js Normal file
View file

@ -0,0 +1,52 @@
(function () {
var L = window.RESSOURCES, id = new URLSearchParams(location.search).get('outil');
var R = L.find(function (r) { return r.id === id; }) || L[0];
var el = function (i) { return document.getElementById(i); };
var demo = (window.URL_DEMOS && window.URL_DEMOS[R.id]) || R.demo;
document.title = R.titre + ' · Syllabus';
el('r-titre-k').textContent = R.titre;
el('r-titre').textContent = R.accroche;
el('r-probleme').textContent = R.probleme;
el('r-pour').textContent = 'Pour : ' + R.pour;
el('r-accroche-fin').textContent = 'Essayez ' + R.titre.toLowerCase() + ' en quelques clics.';
el('r-demo').href = el('r-demo2').href = demo;
var ul = el('r-points');
R.points.forEach(function (pt) {
var li = document.createElement('li'), h = document.createElement('h3'), t = document.createElement('p');
h.style.cssText = 'margin:0;font-size:20px;font-weight:800;letter-spacing:-0.01em;color:#0b1220';
t.style.cssText = 'margin:12px 0 0;font-size:16px;line-height:1.65;font-weight:500;color:#374151';
h.textContent = pt[0]; t.textContent = pt[1]; li.appendChild(h); li.appendChild(t); ul.appendChild(li);
});
var ol = el('r-etapes');
R.etapes.forEach(function (e, i) {
var li = document.createElement('li'), n = document.createElement('span'), t = document.createElement('p');
li.style.cssText = 'display:grid;grid-template-columns:48px 1fr;align-items:baseline;gap:16px';
n.style.cssText = 'font-size:28px;font-weight:800;color:#1d5cf5;font-variant-numeric:tabular-nums';
t.style.cssText = 'margin:0;font-size:20px;line-height:1.5;font-weight:600;color:#0b1220';
n.textContent = String(i + 1).padStart(2, '0'); t.textContent = e;
li.appendChild(n); li.appendChild(t); ol.appendChild(li);
});
var box = el('r-video'), base = window.URL_VIDEOS || 'videos', reduit = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
var v = document.createElement('video');
v.muted = true; v.loop = true; v.playsInline = true; v.autoplay = !reduit; v.preload = 'metadata';
v.setAttribute('aria-label', 'Démonstration vidéo : ' + R.titre);
v.style.cssText = 'display:block;width:100%;height:100%;object-fit:cover';
v.src = base + '/' + R.id + '.mp4';
var btn = document.createElement('button');
btn.type = 'button';
btn.style.cssText = 'position:absolute;right:20px;bottom:20px;width:44px;height:44px;border-radius:999px;border:0;background:rgba(255,255,255,.92);color:#0b1220;font-size:14px;font-weight:800;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.15)';
var maj = function () { btn.textContent = v.paused ? '▶' : '❚❚'; btn.setAttribute('aria-label', v.paused ? 'Lire la vidéo' : 'Mettre en pause'); };
btn.addEventListener('click', function () { v.paused ? v.play() : v.pause(); });
v.addEventListener('play', maj); v.addEventListener('pause', maj);
v.addEventListener('error', function () {
box.innerHTML = '';
var d = document.createElement('div');
d.style.cssText = 'height:100%;display:grid;place-items:center;text-align:center;padding:32px';
d.innerHTML = '<div><p style="margin:0;font-size:18px;font-weight:700;color:#0b1220">Vidéo de démonstration</p><p style="margin:8px 0 0;font-size:14px;font-weight:600;color:#4b5563">Fichier attendu : <code>videos/' + R.id + '.mp4</code></p></div>';
box.appendChild(d);
el('r-video-legende').textContent = '';
});
box.appendChild(v); box.appendChild(btn); maj();
el('r-video-legende').textContent = R.titre + ', en conditions réelles.';
if (!reduit) { var pr = v.play(); if (pr && pr.catch) pr.catch(function () {}); }
})();