Hugging Face's logo

Spaces:
eaglelandsonce
/
AIstronauts_Launch_System
Running

App Files Community
eaglelandsonce commited on
Commit
7a20ab4
·
verified ·
1 Parent(s): 4c9ff05

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +121 -18
index.html CHANGED
@@ -1,19 +1,122 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
19
  </html>
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <title>Spin Launch Simulation</title>
6
+ <style>
7
+ body { margin: 0; overflow: hidden; }
8
+ #info { position: absolute; top: 10px; left: 10px; color: white; }
9
+ </style>
10
+ </head>
11
+ <body>
12
+ <div id="info">Spin Launch Simulation: Adjust parameters using the GUI.</div>
13
+ <!-- Include Three.js and dat.GUI from CDN -->
14
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r152/three.min.js"></script>
15
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.7.9/dat.gui.min.js"></script>
16
+ <script>
17
+ // Set up Three.js scene, camera, and renderer
18
+ const scene = new THREE.Scene();
19
+ const camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 10000);
20
+ const renderer = new THREE.WebGLRenderer({ antialias: true });
21
+ renderer.setSize(window.innerWidth, window.innerHeight);
22
+ document.body.appendChild(renderer.domElement);
23
+
24
+ // Add basic lighting
25
+ const light = new THREE.PointLight(0xffffff, 1);
26
+ light.position.set(50, 50, 50);
27
+ scene.add(light);
28
+
29
+ // Create simple geometries for launcher, payload, and manned vehicle
30
+ const payloadGeometry = new THREE.CylinderGeometry(1, 1, 3, 32);
31
+ const payloadMaterial = new THREE.MeshLambertMaterial({ color: 0xff0000 });
32
+ const payload = new THREE.Mesh(payloadGeometry, payloadMaterial);
33
+ scene.add(payload);
34
+
35
+ // Position payload at the end of a "spin arm"
36
+ payload.position.set(20, 0, 0); // Starting position
37
+
38
+ // Create a simple representation for the manned vehicle (e.g., a box)
39
+ const vehicleGeometry = new THREE.BoxGeometry(3, 3, 3);
40
+ const vehicleMaterial = new THREE.MeshLambertMaterial({ color: 0x0000ff });
41
+ const mannedVehicle = new THREE.Mesh(vehicleGeometry, vehicleMaterial);
42
+ mannedVehicle.position.set(-20, 10, 0); // Pre-positioned in orbit for rendezvous
43
+ scene.add(mannedVehicle);
44
+
45
+ // Set camera position
46
+ camera.position.z = 50;
47
+
48
+ // Define control parameters for each stage
49
+ const params = {
50
+ stage: 1,
51
+ spinRate: 0.1, // radians per second
52
+ launchVelocity: 0, // computed from spin rate and radius
53
+ thrusterBurn: 1.0, // duration (seconds)
54
+ despinRate: 0.05, // decrease in rotation per second
55
+ dockingSpeed: 0.1, // approach speed
56
+ nextStage: function() {
57
+ if (this.stage < 5) {
58
+ this.stage++;
59
+ }
60
+ }
61
+ };
62
+
63
+ // Setup GUI
64
+ const gui = new dat.GUI();
65
+ gui.add(params, 'stage', 1, 5, 1).name('Stage').listen();
66
+ gui.add(params, 'spinRate', 0.01, 1.0).name('Spin Rate');
67
+ gui.add(params, 'thrusterBurn', 0.5, 5.0).name('Thruster Burn');
68
+ gui.add(params, 'despinRate', 0.01, 0.2).name('Despin Rate');
69
+ gui.add(params, 'dockingSpeed', 0.01, 0.5).name('Docking Speed');
70
+ gui.add(params, 'nextStage').name('Next Stage');
71
+
72
+ // Animation variables
73
+ let elapsedTime = 0;
74
+ const clock = new THREE.Clock();
75
+
76
+ function animate() {
77
+ requestAnimationFrame(animate);
78
+ const delta = clock.getDelta();
79
+ elapsedTime += delta;
80
+
81
+ // Example Stage Behavior: Stage 1 (Spin-Up)
82
+ if (params.stage === 1) {
83
+ // Rotate payload around a central axis (simulate spin)
84
+ payload.position.x = 20 * Math.cos(elapsedTime * params.spinRate);
85
+ payload.position.y = 20 * Math.sin(elapsedTime * params.spinRate);
86
+ // Update computed launch velocity (v = ω*r)
87
+ params.launchVelocity = params.spinRate * 20;
88
+ }
89
+
90
+ // Stage 2: Brief thruster burn (simulate orbital insertion)
91
+ if (params.stage === 2 && elapsedTime < 5) {
92
+ // Slightly adjust payload trajectory upward (simplified)
93
+ payload.position.z += params.thrusterBurn * delta * 2;
94
+ }
95
+
96
+ // Stage 3: Despin and stabilization
97
+ if (params.stage === 3 && elapsedTime < 10) {
98
+ // Gradually reduce rotation (despin effect)
99
+ // For illustration, we slow the rotation by reducing spinRate over time
100
+ params.spinRate = Math.max(0.01, params.spinRate - params.despinRate * delta);
101
+ }
102
+
103
+ // Stage 4: Rendezvous with manned vehicle (approach simulation)
104
+ if (params.stage === 4) {
105
+ // Linearly interpolate payload's position toward the manned vehicle’s docking port
106
+ payload.position.lerp(mannedVehicle.position, params.dockingSpeed * delta);
107
+ }
108
+
109
+ // Stage 5: Integrated mission operations (combined orbit)
110
+ if (params.stage === 5) {
111
+ // Have payload and manned vehicle move together along an orbital path (for illustration)
112
+ payload.position.x += 0.05;
113
+ mannedVehicle.position.x += 0.05;
114
+ }
115
+
116
+ renderer.render(scene, camera);
117
+ }
118
+
119
+ animate();
120
+ </script>
121
+ </body>
122
  </html>