-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
116 lines (88 loc) · 5.26 KB
/
index.html
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
<!-- <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>GLTF Model in A-Frame</title>
<script src="https://aframe.io/releases/1.2.0/aframe.min.js"></script> -->
<!-- Include aframe-extras for animation-mixer if needed -->
<!-- <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/aframe-extras.min.js"></script>
</head>
<body> -->
<!-- <a-scene> -->
<!-- Adjust the scale attribute as needed -->
<!-- <a-gltf-model src="assets/rubiks_cube/scene.gltf" animation-mixer="clip: Animation" scale="0.5 0.5 0.5"></a-gltf-model>
<a-text value="Happy Birthday Anay" position="-5 5 -5" color="#FFD700" scale="5 5 5"></a-text>
<a-camera wasd-controls look-controls position="-2.3 1.75 5"></a-camera>
</a-scene>
</body>
</html> -->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Anay's Bday</title>
<script src="https://aframe.io/releases/1.2.0/aframe.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/aframe-extras.min.js"></script>
</head>
<body>
<a-scene>
<!-- Blue Sky -->
<a-sky color="#87CEEB"></a-sky>
<!-- Ambient Light -->
<a-light type="ambient" color="#445451"></a-light>
<!-- Sunlight -->
<a-light type="directional" position="-1 1 0" intensity="0.5" color="#ffffff"></a-light>
<!-- Ground -->
<a-plane position="-1 -1 -1" rotation="-90 0 0" width="50" height="50" color="#556B2F"></a-plane>
<!-- Sparse Forest Trees -->
<!-- Original and Mirrored Sparse Forest Trees -->
<!-- Original and Fully Mirrored Sparse Forest Trees -->
<!-- Tree 1 and its Mirrors -->
<a-cylinder position="5 0 -10" radius="0.5" height="2" color="#8B4513"></a-cylinder>
<a-cone position="5 2 -10" radius-bottom="2" height="3" color="#228B22"></a-cone>
<a-cylinder position="-5 0 -10" radius="0.5" height="2" color="#8B4513"></a-cylinder>
<a-cone position="-5 2 -10" radius-bottom="2" height="3" color="#228B22"></a-cone>
<a-cylinder position="5 0 10" radius="0.5" height="2" color="#8B4513"></a-cylinder>
<a-cone position="5 2 10" radius-bottom="2" height="3" color="#228B22"></a-cone>
<a-cylinder position="-5 0 10" radius="0.5" height="2" color="#8B4513"></a-cylinder>
<a-cone position="-5 2 10" radius-bottom="2" height="3" color="#228B22"></a-cone>
<!-- Tree 2 and its Mirrors -->
<a-cylinder position="-10 0 -5" radius="0.3" height="1.5" color="#8B4513"></a-cylinder>
<a-cone position="-10 1.5 -5" radius-bottom="1.5" height="2.5" color="#228B22"></a-cone>
<a-cylinder position="10 0 -5" radius="0.3" height="1.5" color="#8B4513"></a-cylinder>
<a-cone position="10 1.5 -5" radius-bottom="1.5" height="2.5" color="#228B22"></a-cone>
<a-cylinder position="-10 0 5" radius="0.3" height="1.5" color="#8B4513"></a-cylinder>
<a-cone position="-10 1.5 5" radius-bottom="1.5" height="2.5" color="#228B22"></a-cone>
<a-cylinder position="10 0 5" radius="0.3" height="1.5" color="#8B4513"></a-cylinder>
<a-cone position="10 1.5 5" radius-bottom="1.5" height="2.5" color="#228B22"></a-cone>
<!-- Tree 3 and its Mirrors -->
<a-cylinder position="0 0 -15" radius="0.4" height="2" color="#8B4513"></a-cylinder>
<a-cone position="0 2 -15" radius-bottom="1.8" height="3" color="#228B22"></a-cone>
<a-cylinder position="0 0 15" radius="0.4" height="2" color="#8B4513"></a-cylinder>
<a-cone position="0 2 15" radius-bottom="1.8" height="3" color="#228B22"></a-cone>
<!-- Tree 4 and its Mirrors -->
<a-cylinder position="15 0 -20" radius="0.6" height="2.5" color="#8B4513"></a-cylinder>
<a-cone position="15 2.5 -20" radius-bottom="2.2" height="3.5" color="#228B22"></a-cone>
<a-cylinder position="-15 0 -20" radius="0.6" height="2.5" color="#8B4513"></a-cylinder>
<a-cone position="-15 2.5 -20" radius-bottom="2.2" height="3.5" color="#228B22"></a-cone>
<a-cylinder position="15 0 20" radius="0.6" height="2.5" color="#8B4513"></a-cylinder>
<a-cone position="15 2.5 20" radius-bottom="2.2" height="3.5" color="#228B22"></a-cone>
<a-cylinder position="-15 0 20" radius="0.6" height="2.5" color="#8B4513"></a-cylinder>
<a-cone position="-15 2.5 20" radius-bottom="2.2" height="3.5" color="#228B22"></a-cone>
<!-- Cake -->
<a-cylinder position="0 0.25 -2" radius="1.5" height="0.5" color="#FFD700"></a-cylinder> <!-- Bottom Layer -->
<a-cylinder position="0 0.75 -2" radius="1" height="0.5" color="#E9967A"></a-cylinder> <!-- Middle Layer -->
<a-cylinder position="0 1.0 -2" radius="0.5" height="0.5" color="#FFA07A"></a-cylinder> <!-- Top Layer -->
<!-- Cake Candles -->
<a-cylinder position="0.5 1.5 -2" radius="0.05" height="0.5" color="#FFD700"></a-cylinder>
<a-cylinder position="-0.5 1.5 -2" radius="0.05" height="0.5" color="#FFD700"></a-cylinder>
<!-- GLTF Model -->
<a-gltf-model src="assets/rubiks_cube/scene.gltf" animation-mixer="clip: Animation" position="-2 4 -1" scale="0.5 0.5 0.5"></a-gltf-model>
<!-- Text -->
<a-text value="Happy Birthday Anay!!!" position="-5 11 -5" color="#FF0000" scale="5 5 5"></a-text>
<a-text value="All The Best For Your Championship!!!" position="-5 10 -5" color="#1e1e1e" scale="2 2 2"></a-text>
<!-- Camera -->
<a-camera id="camera" wasd-controls="fly: true" look-controls position="-2.3 4 8"></a-camera>
</a-scene>
</body>
</html>