Identify/index.html at main · htmluser-hub/Identify · GitHub

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
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
<!doctype html>
<html lang="fr">
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width,initial-scale=1" />
  <title>Outil d'information système (navigateur)</title>
  <style>
    :root{--bg:#0f1724;--card:#0b1220;--accent:#3b82f6;--muted:#9aa4b2}
    body{font-family:Inter,system-ui,Arial;background:linear-gradient(180deg,#071027 0%, #07121a 100%);color:#e6eef8;margin:0;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
    .card{width:100%;max-width:920px;background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));border-radius:12px;padding:20px;box-shadow:0 8px 30px rgba(2,6,23,0.6);border:1px solid rgba(255,255,255,0.03)}
    h1{margin:0 0 12px;font-size:20px}
    p.lead{margin:0 0 18px;color:var(--muted)}
    .grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
    .item{background:var(--card);padding:12px;border-radius:8px;border:1px solid rgba(255,255,255,0.02)}
    .label{font-size:12px;color:var(--muted);margin-bottom:6px}
    .value{font-weight:600;font-size:15px;word-break:break-all}
    .warn{color:#ffb86b}
    .ok{color:#8ef57a}
    button{margin-top:14px;padding:8px 10px;border-radius:8px;border:0;background:var(--accent);color:#081022;font-weight:700;cursor:pointer}
    .note{margin-top:10px;color:var(--muted);font-size:13px}
    pre{white-space:pre-wrap;word-break:break-word;margin:0;font-size:13px}
  </style>
</head>
<body>
  <div class="card">
    <h1>Outil d'information système (navigateur)</h1>
    <p class="lead">Ce qui est accessible depuis une page web : GPU (souvent), nombre de cœurs, userAgent. <strong>Ce qui n'est pas accessible :</strong> température réelle du matériel, noms des processus. 🚫</p>

    <div class="grid">
      <div class="item">
        <div class="label">GPU (WebGL renderer)</div>
        <div id="gpu" class="value">Recherche...</div>
      </div>
      <div class="item">
        <div class="label">Nombre de cœurs logiques (hardwareConcurrency)</div>
        <div id="cores" class="value">Recherche...</div>
      </div>
      <div class="item">
        <div class="label">UserAgent</div>
        <div id="ua" class="value"></div>
      </div>
      <div class="item">
        <div class="label">Température réelle du système</div>
        <div id="temp" class="value warn">Je ne sais pas. (non accessible depuis le navigateur)</div>
      </div>
      <div class="item">
        <div class="label">Nom des processus CPU</div>
        <div id="proc" class="value warn">Je ne sais pas. (non accessible depuis le navigateur)</div>
      </div>
      <div class="item">
        <div class="label">Informations additionnelles</div>
        <div id="extra" class="value"></div>
      </div>
    </div>

    <button id="refresh">Rafraîchir les infos</button>
    <div class="note">Identify</div>
  </div>

  <script>
    function getGPUInfo() {
      try {
        const canvas = document.createElement('canvas');
        const gl = canvas.getContext('webgl') || canvas.getContext('experimental-webgl');
        if (!gl) return null;
        const dbgRenderInfo = gl.getExtension('WEBGL_debug_renderer_info');
        if (dbgRenderInfo) {
          const vendor = gl.getParameter(dbgRenderInfo.UNMASKED_VENDOR_WEBGL);
          const renderer = gl.getParameter(dbgRenderInfo.UNMASKED_RENDERER_WEBGL);
          return { vendor, renderer };
        } else {
          // fallback: limited info
          const renderer = gl.getParameter(gl.RENDERER);
          const vendor = gl.getParameter(gl.VENDOR);
          return { vendor, renderer };
        }
      } catch (e) {
        return null;
      }
    }

    function updateAll() {
      const gpu = getGPUInfo();
      const gpuEl = document.getElementById('gpu');
      if (gpu && (gpu.renderer || gpu.vendor)) {
        gpuEl.innerHTML = `<div style="font-size:13px">${gpu.renderer || 'Inconnu'}</div><div style="color:var(--muted);font-size:12px">${gpu.vendor||''}</div>`;
        gpuEl.className = 'value ok';
      } else {
        gpuEl.textContent = 'Non disponible (bloqué par le navigateur ou pas pris en charge)';
        gpuEl.className = 'value warn';
      }

      const cores = navigator.hardwareConcurrency || 'Inconnu';
      document.getElementById('cores').textContent = cores;

      document.getElementById('ua').textContent = navigator.userAgent;

      // Extra: approximate CPU benchmark (simple)
      const extraEl = document.getElementById('extra');
      extraEl.innerHTML = 'Mesure rapide de performance (approx.) — Exécution d\'une petite boucle...';
      // tiny benchmark to infer perf (non fiable)
      const t0 = performance.now();
      let s = 0;
      for (let i=0;i<20_000_00;i++){ s += i % 7; }
      const t1 = performance.now();
      const elapsed = (t1 - t0).toFixed(1);
      extraEl.innerHTML = `Boucle ~20M itérations: ${elapsed} ms (valeur indicative, non fiable).`;
    }

    document.getElementById('refresh').addEventListener('click', updateAll);
    updateAll();
  </script>
</body>
</html>