Hugging Face's logo

Spaces:
awacke1
/
GPU-Memory-Detector-HTML5
Running

App Files Community
awacke1 commited on
Commit
8229346
·
1 Parent(s): 53edbb9

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +60 -52
index.html CHANGED
@@ -1,54 +1,62 @@
 
1
  <html>
2
-
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
3
  <body>
4
- <canvas id="glcanvas" width="0" height="0"></canvas>
5
- <script>
6
- var performance = window.performance || window.mozPerformance || window.msPerformance || window.webkitPerformance || {};
7
-
8
- document.write("<br>");
9
- for (var value in performance) {
10
- document.write(value + "<br>");
11
- }
12
-
13
- document.write("<br><br><br>");
14
-
15
- var canvas;
16
- canvas = document.getElementById("glcanvas");
17
- var gl = canvas.getContext("experimental-webgl");
18
-
19
- document.write(gl.getParameter(gl.RENDERER) + "<br>");
20
- document.write(gl.getParameter(gl.VENDOR) + "<br>");
21
- document.write(getUnmaskedInfo(gl).vendor + "<br>");
22
- document.write(getUnmaskedInfo(gl).renderer + "<br>");
23
-
24
-
25
- function getUnmaskedInfo(gl) {
26
- var unMaskedInfo = {
27
- renderer: '',
28
- vendor: ''
29
- };
30
-
31
- var dbgRenderInfo = gl.getExtension("WEBGL_debug_renderer_info");
32
- if (dbgRenderInfo != null) {
33
- unMaskedInfo.renderer = gl.getParameter(dbgRenderInfo.UNMASKED_RENDERER_WEBGL);
34
- unMaskedInfo.vendor = gl.getParameter(dbgRenderInfo.UNMASKED_VENDOR_WEBGL);
35
- }
36
-
37
- return unMaskedInfo;
38
-
39
- const response = await fetch("https://awacke1-gradioautoplotfromcsv.hf.space/run/predict", {
40
- method: "POST",
41
- headers: { "Content-Type": "application/json" },
42
- body: JSON.stringify({
43
- data: [
44
- inputText,
45
- ]
46
- })
47
-
48
- });
49
- }
50
-
51
- const data = await data.json();
52
-
53
- </script>
54
- </body>
 
1
+ <!DOCTYPE html>
2
  <html>
3
+ <head>
4
+ <title>Three.js GPU Detector</title>
5
+ <meta charset="utf-8">
6
+ <meta name="viewport" content="width=device-width, initial-scale=1">
7
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js"></script>
8
+ <style>
9
+ body {
10
+ margin: 0;
11
+ padding: 0;
12
+ }
13
+ canvas {
14
+ width: 100%;
15
+ height: 100%;
16
+ }
17
+ </style>
18
+ </head>
19
  <body>
20
+ <script>
21
+ // Create a WebGL renderer
22
+ var renderer = new THREE.WebGLRenderer();
23
+ renderer.setSize(window.innerWidth, window.innerHeight);
24
+ document.body.appendChild(renderer.domElement);
25
+
26
+ // Create a scene and camera
27
+ var scene = new THREE.Scene();
28
+ var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
29
+ camera.position.z = 5;
30
+
31
+ // Create a cube
32
+ var geometry = new THREE.BoxGeometry();
33
+ var material = new THREE.MeshBasicMaterial();
34
+ var cube = new THREE.Mesh(geometry, material);
35
+ scene.add(cube);
36
+
37
+ // Detect the GPU memory and type
38
+ var gl = renderer.getContext();
39
+ var extension = gl.getExtension('WEBGL_debug_renderer_info');
40
+ var memory = gl.getParameter(gl.MAX_TEXTURE_SIZE);
41
+ var type = gl.getParameter(extension.UNMASKED_RENDERER_WEBGL);
42
+
43
+ // Display the GPU information
44
+ var info = document.createElement('div');
45
+ info.innerHTML = 'GPU Memory: ' + memory + '<br>GPU Type: ' + type;
46
+ info.style.position = 'absolute';
47
+ info.style.top = '10px';
48
+ info.style.left = '10px';
49
+ info.style.color = '#fff';
50
+ document.body.appendChild(info);
51
+
52
+ // Render the scene
53
+ function render() {
54
+ requestAnimationFrame(render);
55
+ cube.rotation.x += 0.01;
56
+ cube.rotation.y += 0.01;
57
+ renderer.render(scene, camera);
58
+ }
59
+ render();
60
+ </script>
61
+ </body>
62
+ </html>