-
Notifications
You must be signed in to change notification settings - Fork 2
/
ri3d.html
185 lines (169 loc) · 8.9 KB
/
ri3d.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
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>RI3D | OTU Robotics</title>
<link rel="stylesheet" href="css/ri3d.css">
<link href="https://fonts.googleapis.com/css?family=Poppins:100,200,300,400,600,700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<meta name="description" content="<model-viewer> template">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="images/OTRobotics.ico">
</head>
<body>
<section class="header">
<nav>
<a href="/" class="logo"><img src="images/logo.webp"></a>
<div class="nav-links" id="navLinks">
<i class="fa fa-close" onclick="hideMenu()"></i>
<ul>
<li><a href="/">HOME</a></li>
<li><a href="robomaster">ROBOMASTER</a></li>
<li><a href="apply">APPLY</a></li>
<li><a href="members">MEMBERS</a></li>
<li><a href="sponsor">SPONSOR US</a></li>
<li><a href="photos">PHOTOS</a></li>
<li><a href="news">NEWS</a></li>
<li><a href="contact">CONTACT</a></li>
</ul>
</div>
<i class="fa fa-bars" onclick="showMenu()"></i>
</nav>
<div class="text-box">
<h1 class="text heading">RI3D</h1>
<p class="text paragraph">Built in three days</p>
</div>
<video autoplay muted loop playsinline id="background-video">
<source src="media/RI3DBackground.mp4" type="video/mp4">
</video>
</section>
<!---------- course ----------->
<section class="about-us">
<div class="row">
<div class="about-col">
<h1>Rapid Robot Innovation - Ri3D</h1>
<p>Discover the essence of <strong>Rapid Robot Innovation (Ri3D)</strong>, an exceptional project located at Ontario Tech's Automotive Centre of Excellence. Every year, our dedicated team of over 100 students undertakes the challenge of designing, building, and programming robots within a tight three-day timeframe, all in response to the annual challenges set forth by the <strong>FIRST Robotics Competition</strong>.</p>
<p>At <strong>Ri3D</strong>, <strong>innovation</strong> is not just a goal; it's a process. We strive to provide creative and forward-thinking solutions to contemporary engineering challenges faced by society. Through live-streamed build seasons on YouTube and Twitch, we share our insights and diverse design concepts with the global robotics community. Additionally, our commitment extends to mentorship programs for local high school robotics teams, fostering collaboration and knowledge-sharing. Join us in the pursuit of excellence, where <strong>Ri3D</strong> exemplifies the power of rapid innovation and the spirit of engineering creativity.</p>
<a href="apply" class="hero-btn red-btn">Join Now</a>
</div>
<div class="about-col">
<img src="images/Ri3D.webp">
</div>
</div>
</section>
<section class="robot-view centered-model">
<div class="centered-text">
<h2>Ri3D challenge 1</h2>
</div>
<model-viewer src="media/trident.glb" ar ar-modes="webxr scene-viewer quick-look" camera-controls tone-mapping="commerce" poster="poster.webp" shadow-intensity="1">
<div class="progress-bar hide" slot="progress-bar">
<div class="update-bar"></div>
</div>
<button slot="ar-button" id="ar-button">
View in your space
</button>
<div id="ar-prompt">
<img src="media/ar_hand_prompt.webp">
</div>
</model-viewer>
</section>
<section class="course">
<h1 class="hidden animate__animated text">Our Subteams</h1>
<p class="hidden animate__animated text">These subteams are what make up our Robotic teams.</p>
<div class="row">
<div class="course-col hidden animate__animated animate__delay-750ms">
<h3>Mechanical Team</h3>
<p>The Mechanical Team in Ri3D is the backbone, turning design concepts into tangible reality. They are responsible for crafting the physical components, ensuring precision and functionality in the limited three-day timeframe.</p>
</div>
<div class="course-col hidden animate__animated animate__delay-750ms">
<h3>Programming Team</h3>
<p>The Programming Team in Ri3D injects intelligence into our robots by crafting efficient and effective code. Their expertise ensures seamless communication and precise execution during the intense three-day build season.</p>
</div>
<div class="course-col hidden animate__animated animate__delay-750ms">
<h3>Electrical Team</h3>
<p>Powering the Ri3D projects, the Electrical Team meticulously handles the design and implementation of electrical systems. From wiring to power distribution, they ensure the robotic creations operate at their best.</p>
</div>
<div class="course-col hidden animate__animated animate__delay-750ms">
<h3>Design Team</h3>
<p>The Design Team in Ri3D is the creative force behind the project, shaping the visual and functional aspects of our robots with innovative concepts and thoughtful engineering.</p>
</div>
</div>
</section>
<section class="Goals">
<div class="container" data-aos="fade-up">
<h1 class="text heading animate__animated">Our Goals</h1>
<p class="text paragraph animate__animated">Setting Ambitious Goals, Achieving Robotics Mastery</p>
<link rel="stylesheet" href="assets/css/picturealign.css">
<div class="column1">
<div class="row1">
<div class="centered-skill-bars">
<div class="skill-bars">
<div class="bar">
<div class="info">
<span18>Come up with a Design</span18>
</div>
<div class="progress-line html">
<span18></span18>
</div>
</div>
<div class="bar">
<div class="info">
<span18>Building the robot</span18>
</div>
<div class="progress-line css">
<span18></span18>
</div>
</div>
<div class="bar">
<div class="info">
<span18>Programming</span18>
</div>
<div class="progress-line jquery">
<span18></span18>
</div>
</div>
<div class="bar">
<div class="info">
<span18>Finishing Goal</span18>
</div>
<div class="progress-line python">
<span18></span18>
</div>
</div>
<div class="bar">
<div class="info">
<span18>Outreach</span18>
</div>
<div class="progress-line python">
<span18></span18>
</div>
</div>
<div class="bar">
<div class="info">
<span18>Skill development workshops</span18>
</div>
<div class="progress-line python">
<span18></span18>
</div>
</div>
</div>
</div>
</section>
<section class="footer">
<h4>RI3D</h4>
<p>Ontario Tech Robotics</p>
<div class="icons">
<a href="https://www.facebook.com/otrobomaster" target="_blank"><i class="fa fa-facebook"></i></a>
<a href="https://twitter.com/otrobomaster" target="_blank"><i class="fa fa-twitter"></i></a>
<a href="https://www.instagram.com/otrobomaster/" target="_blank"><i class="fa fa-instagram"></i></a>
<a href="https://www.linkedin.com/company/otrobomaster" target="_blank"><i class="fa fa-linkedin"></i></a>
</div>
<h5 style = "font-weight: 700; font-size:0.83em">MADE BY  <a style = "font-weight: 500;">MIRISAN, MATTHEW, SHEKINA, AND MEMBERS</a></h5>
</section>
<script type="module" src="https://ajax.googleapis.com/ajax/libs/model-viewer/3.2.0/model-viewer.min.js"></script>
<script src="https://kit.fontawesome.com/6975114518.js" crossorigin="anonymous"></script>
<script src="js/robomaster.js"></script>
<!-- gsap -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.5/gsap.min.js" integrity="sha512-cOH8ndwGgPo+K7pTvMrqYbmI8u8k6Sho3js0gOqVWTmQMlLIi6TbqGWRTpf1ga8ci9H3iPsvDLr4X7xwhC/+DQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="js/animations.js"></script>
<script src="js/main.js"></script>
</body>