Hugging Face's logo

Spaces:
vish85521
/
3d
Sleeping

App Files Community
vish85521 commited on
Commit
8af0c62
·
verified ·
1 Parent(s): 6496b60

Create index.html

Browse files
Files changed (1) hide show
  1. index.html +103 -0
index.html ADDED
@@ -0,0 +1,103 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Hunyuan3D-2 API Tester</title>
7
+ <style>
8
+ body { font-family: Arial, sans-serif; max-width: 600px; margin: 40px auto; padding: 20px; }
9
+ .form-group { margin-bottom: 15px; }
10
+ label { display: block; font-weight: bold; margin-bottom: 5px; }
11
+ input[type="file"] { display: block; margin-bottom: 10px; }
12
+ button { padding: 10px 20px; background-color: #007bff; color: white; border: none; cursor: pointer; font-size: 16px; }
13
+ button:disabled { background-color: #cccccc; }
14
+ #status { margin-top: 20px; font-weight: bold; }
15
+ #result { margin-top: 20px; }
16
+ a.download-btn { display: inline-block; padding: 10px 20px; background-color: #28a745; color: white; text-decoration: none; border-radius: 5px; }
17
+ </style>
18
+ </head>
19
+ <body>
20
+
21
+ <h2>Hunyuan3D-2 Multi-View Generator</h2>
22
+ <p>Upload 4 structured views to generate a 3D model.</p>
23
+
24
+ <form id="uploadForm">
25
+ <div class="form-group">
26
+ <label for="front">Front View:</label>
27
+ <input type="file" id="front" accept="image/*" required>
28
+ </div>
29
+ <div class="form-group">
30
+ <label for="back">Back View:</label>
31
+ <input type="file" id="back" accept="image/*" required>
32
+ </div>
33
+ <div class="form-group">
34
+ <label for="left">Left View:</label>
35
+ <input type="file" id="left" accept="image/*" required>
36
+ </div>
37
+ <div class="form-group">
38
+ <label for="right">Right View:</label>
39
+ <input type="file" id="right" accept="image/*" required>
40
+ </div>
41
+
42
+ <button type="submit" id="submitBtn">Generate 3D Model</button>
43
+ </form>
44
+
45
+ <div id="status"></div>
46
+ <div id="result"></div>
47
+
48
+ <script>
49
+ document.getElementById('uploadForm').addEventListener('submit', async (e) => {
50
+ e.preventDefault();
51
+
52
+ const submitBtn = document.getElementById('submitBtn');
53
+ const statusDiv = document.getElementById('status');
54
+ const resultDiv = document.getElementById('result');
55
+
56
+ submitBtn.disabled = true;
57
+ statusDiv.style.color = 'black';
58
+ statusDiv.textContent = 'Processing... This may take a few minutes on the GPU.';
59
+ resultDiv.innerHTML = '';
60
+
61
+ const formData = new FormData();
62
+ formData.append('front', document.getElementById('front').files[0]);
63
+ formData.append('back', document.getElementById('back').files[0]);
64
+ formData.append('left', document.getElementById('left').files[0]);
65
+ formData.append('right', document.getElementById('right').files[0]);
66
+
67
+ // Your specific Hugging Face Space direct URL
68
+ const apiUrl = 'https://vish85521-3d.hf.space/generate-3d';
69
+
70
+ try {
71
+ const response = await fetch(apiUrl, {
72
+ method: 'POST',
73
+ body: formData
74
+ });
75
+
76
+ if (!response.ok) {
77
+ const errorText = await response.text();
78
+ throw new Error(`Server Error (${response.status}): ${errorText}`);
79
+ }
80
+
81
+ const blob = await response.blob();
82
+ const downloadUrl = URL.createObjectURL(blob);
83
+
84
+ statusDiv.style.color = 'green';
85
+ statusDiv.textContent = 'Success! Model generated.';
86
+
87
+ const link = document.createElement('a');
88
+ link.href = downloadUrl;
89
+ link.download = 'generated_model.glb';
90
+ link.className = 'download-btn';
91
+ link.textContent = 'Download .glb File';
92
+ resultDiv.appendChild(link);
93
+
94
+ } catch (error) {
95
+ statusDiv.style.color = 'red';
96
+ statusDiv.textContent = `Error: ${error.message}`;
97
+ } finally {
98
+ submitBtn.disabled = false;
99
+ }
100
+ });
101
+ </script>
102
+ </body>
103
+ </html>