-
Notifications
You must be signed in to change notification settings - Fork 0
/
astrophotography.html
228 lines (185 loc) · 13.8 KB
/
astrophotography.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
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
<!DOCTYPE html>
<html lang="en" data-bs-theme="dark">
<head>
<!-- Bootstrap -->
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-4bw+/aepP/YC94hEpVNVgiZdgIC5+VKNBQNGCHeKRQN+PtmoHDEXuppvnDJzQIu9" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/js/bootstrap.bundle.min.js"
integrity="sha384-HwwvtgBNo3bZJJLYd8oVXjrBZt8cqVSpeBNS5n7C8IVInixGAoxmnlMuBnhbgrkm"
crossorigin="anonymous"></script>
<!-- My stuff -->
<script type="module" src="scripts/astrophotography.js"></script>
<link rel="stylesheet" href="style.css">
<title>Mateo</title>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark mb-4">
<div class="container-fluid">
<a class="navbar-brand" href="./index.html">Mateo portfolio</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown"
aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<!-- Don't forget to include the ID! -->
<div class="collapse navbar-collapse" id="navbarNavDropdown">
</div>
</div>
</nav>
<main class="py-2 container">
<!-- Intro and links -->
<div class="row mb-4 text-white text-center">
<div class="col-lg-3 ">
<!-- Animation -->
<div
style="width: 180px; height: 180px; border-radius: 50%; object-fit: cover; border: 2px solid white; padding: 20px;">
<img src="./images/astrophotography/movement.gif" class="img-fluid" alt="Tracker Movement">
</div>
</div>
<div class="col-lg-9 ">
<p class="lead text-white">
This page is dedicated to my astrophotography hobby. It contains information about my DIY barn door
tracker. It also has the code for the microcontroller in the project boxes that control the machine.
Finally, it includes a recording of one of my presentations, delivered at the StarNights Festival,
along with the presentation slides.
</p>
<div class="d-flex gap-2 mb-3 justify-content-center">
<!-- Github tracker -->
<button type="button" id="btnGitHubAstrophotography" class="btn btn-primary"
style="background-color: rgb(51, 51, 51); border:none; ">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="16" fill="currentColor"
class="bi bi-github" viewBox="0 0 16 16">
<path
d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z" />
</svg>
Code
</button>
<!-- Instagram -->
<button type="button" id="btnInstagramMateoAstro" class="btn btn-primary"
style="background-color: rgb(172, 43, 172); border:none; ">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="16" fill="currentColor"
class="bi bi-instagram" viewBox="0 0 16 16">
<path
d="M8 0C5.829 0 5.556.01 4.703.048 3.85.088 3.269.222 2.76.42a3.917 3.917 0 0 0-1.417.923A3.927 3.927 0 0 0 .42 2.76C.222 3.268.087 3.85.048 4.7.01 5.555 0 5.827 0 8.001c0 2.172.01 2.444.048 3.297.04.852.174 1.433.372 1.942.205.526.478.972.923 1.417.444.445.89.719 1.416.923.51.198 1.09.333 1.942.372C5.555 15.99 5.827 16 8 16s2.444-.01 3.298-.048c.851-.04 1.434-.174 1.943-.372a3.916 3.916 0 0 0 1.416-.923c.445-.445.718-.891.923-1.417.197-.509.332-1.09.372-1.942C15.99 10.445 16 10.173 16 8s-.01-2.445-.048-3.299c-.04-.851-.175-1.433-.372-1.941a3.926 3.926 0 0 0-.923-1.417A3.911 3.911 0 0 0 13.24.42c-.51-.198-1.092-.333-1.943-.372C10.443.01 10.172 0 7.998 0h.003zm-.717 1.442h.718c2.136 0 2.389.007 3.232.046.78.035 1.204.166 1.486.275.373.145.64.319.92.599.28.28.453.546.598.92.11.281.24.705.275 1.485.039.843.047 1.096.047 3.231s-.008 2.389-.047 3.232c-.035.78-.166 1.203-.275 1.485a2.47 2.47 0 0 1-.599.919c-.28.28-.546.453-.92.598-.28.11-.704.24-1.485.276-.843.038-1.096.047-3.232.047s-2.39-.009-3.233-.047c-.78-.036-1.203-.166-1.485-.276a2.478 2.478 0 0 1-.92-.598 2.48 2.48 0 0 1-.6-.92c-.109-.281-.24-.705-.275-1.485-.038-.843-.046-1.096-.046-3.233 0-2.136.008-2.388.046-3.231.036-.78.166-1.204.276-1.486.145-.373.319-.64.599-.92.28-.28.546-.453.92-.598.282-.11.705-.24 1.485-.276.738-.034 1.024-.044 2.515-.045v.002zm4.988 1.328a.96.96 0 1 0 0 1.92.96.96 0 0 0 0-1.92zm-4.27 1.122a4.109 4.109 0 1 0 0 8.217 4.109 4.109 0 0 0 0-8.217zm0 1.441a2.667 2.667 0 1 1 0 5.334 2.667 2.667 0 0 1 0-5.334z" />
</svg>
Pictures
</button>
<!-- Facebook -->
<button type="button" id="btnFacebookMateo" class="btn btn-primary"
style="background-color: rgb(59, 89, 152); border:none; ">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="16" fill="currentColor"
viewBox="0 0 16 16">
<path
d="M16 8.049c0-4.446-3.582-8.05-8-8.05C3.58 0-.002 3.603-.002 8.05c0 4.017 2.926 7.347 6.75 7.951v-5.625h-2.03V8.05H6.75V6.275c0-2.017 1.195-3.131 3.022-3.131.876 0 1.791.157 1.791.157v1.98h-1.009c-.993 0-1.303.621-1.303 1.258v1.51h2.218l-.354 2.326H9.25V16c3.824-.604 6.75-3.934 6.75-7.951z">
</path>
</svg>
Facebook
</button>
</div>
</div>
</div>
<!-- Content -->
<div class="d-flex flex-column">
<div class="py-4 row mb-4 ">
<div class="col-lg-6">
<div class="card mb-4 h-100">
<img class="card-img-top" src="./images/astrophotography/starnighs-presentation.jpg"
alt="Card image cap">
<div class="card-body">
<h5 class="card-title text-center ">DIY Barn door tracker</h5>
<p class="lead text-center ">
What is it?
</p>
<p class="card-text">
A barn door tracker, also known as a "volgplank" in Dutch, is a simple device used in
astrophotography to counteract the Earth's rotation. It's designed to
allow a camera or telescope to capture long-exposure images of the night sky without the
stars appearing as streaks due to Earth's movement. Here's how it works:
<br><br>
The barn door tracker consists of two hinged boards, with one board acting as a fixed
base and the other as a movable lid or door. The camera or telescope is mounted on the
movable lid. A hinge connects the two boards at one end, and the other end of the
movable board has a threaded rod.
<br><br>
As the Earth rotates, a motor makes the threaded rod turn. This causes the movable lid
to open at a rate that matches the Earth's rotation. Because the camera/telescope is
mounted on the movable lid, it now also turns. This allows for
long-exposure photography without star trailing.
</p>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="card mb-4 h-100">
<img class="card-img-top" src="./images/astrophotography/project-boxes.jpg"
alt="Card image cap">
<div class="card-body">
<h5 class="card-title">The code that makes the project "tick"</h5>
<p>
The barn door tracker operates using a stepper motor, which advances a set distance with
each step. This means someone needs to send step commands at the correct interval. This
seemingly simple task took more work than expected. For instance, issuing step commands
at a
constant interval doesn't result in a uniform rotation due to the barn door tracker's
unique
geometry. When to step is calculated by tiny microcontrollers, such as the Arduino Nano
and
Xiao Seed BLE. These microcontrollers run code written in CircuitPython and C++ (Arduino
variant), which you can access in the linked repository.
</p>
<!-- Github tracker -->
<button type="button" id="btnGitHubAstrophotography2" class="btn btn-primary"
style="background-color: rgb(51, 51, 51); border:none; position: absolute; bottom: 2.5em">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="16" fill="currentColor"
class="bi bi-github" viewBox="0 0 16 16">
<path
d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z" />
</svg>
Microcontroller Code
</button>
</div>
</div>
</div>
</div>
<!-- Presentation slides-->
<div class="card mb-4 text-center">
<div class="card-body">
<h5 class="card-title">Presentation slides</h5>
<p class="card-text">
This presentation explains the purpose of my tracker, and what makes it tick on the inside. It
was used for my talks at Starnights and VVS Scheldeland.
</p>
</div>
<div class="ratio ratio-16x9">
<iframe
src="https://onedrive.live.com/embed?resid=E76A49AEE151975D%2123526&authkey=!AE_0GxGdSZB3YME&em=2&wdAr=1.7790811339198436"
frameborder="0">This is an embedded <a target="_blank" href="https://office.com">Microsoft
Office</a> presentation, powered by <a target="_blank"
href="https://office.com/webapps">Office</a>.
</iframe>
</div>
</div>
<!-- Presentation recording -->
<div class="card mb-4 text-center">
<div class="card-body">
<h5 class="card-title">Presentation recording</h5>
<p class="card-text">
This recording features my presentation at the annual Starnights astrophotography gathering,
where I had a great time sharing insights and connecting with fellow hobbyists.
</p>
</div>
<div class="ratio ratio-16x9">
<iframe
src="https://www.facebook.com/plugins/video.php?height=314&href=https%3A%2F%2Fwww.facebook.com%2Fstijn.vanderheiden%2Fvideos%2F644308567461143%2F&show_text=false&width=560&t=2900"
width="560" height="314" style="border:none;overflow:hidden" scrolling="no" frameborder="0"
allowfullscreen="true"
allow="autoplay; clipboard-write; encrypted-media; picture-in-picture; web-share"
allowFullScreen="true"></iframe>
</div>
</div>
</div>
</main>
</body>
</html>