-
Notifications
You must be signed in to change notification settings - Fork 3
/
index-de.html
236 lines (233 loc) · 15.5 KB
/
index-de.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
229
230
231
232
233
234
235
236
<!DOCTYPE html>
<html lang='de'>
<head>
<meta charset="UTF-8">
<title>metalab</title>
<link rel="stylesheet" href="fonts/fonts.css">
<link rel="stylesheet" href="metalab.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="scripts.js" defer></script>
</head>
<body>
<div class="content">
<header>
<video autoplay loop muted playsinline poster="images/header.webp">
<source src="videos/header.mp4" type="video/mp4">
<div class="heading">
<h1>metalab</h1>
<h2>Hackspace im Herzen Wiens</h2>
</div>
</video>
<img class="heading reducedmotion" src="images/header.webp" alt="Bild vom Eingang zum Metalab">
<div class="playpause">
<svg class="pausesymbol" version="1.1" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 478.125 478.125">
<path d="M201.654,127.525h-31.9c-10.557,0-19.125,8.645-19.125,19.125v184.9c0,10.558,8.645,19.125,19.125,19.125h31.9
c10.557,0,19.125-8.645,19.125-19.125v-184.9C220.779,136.094,212.211,127.525,201.654,127.525z" />
<path d="M308.448,127.525h-31.9c-10.558,0-19.125,8.645-19.125,19.125v184.9c0,10.558,8.645,19.125,19.125,19.125h31.9
c10.557,0,19.125-8.645,19.125-19.125v-184.9C327.573,136.094,318.929,127.525,308.448,127.525z" />
<path d="M239.062,0C107.023,0,0,107.023,0,239.062s107.023,239.062,239.062,239.062s239.062-107.023,239.062-239.062
S371.102,0,239.062,0z M239.292,409.811c-94.171,0-170.519-76.424-170.519-170.519S145.197,68.773,239.292,68.773
c94.095,0,170.519,76.424,170.519,170.519S333.54,409.811,239.292,409.811z" />
</svg>
<svg class="playsymbol" version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 140 140">
<path d="M142.411,68.9C141.216,31.48,110.968,1.233,73.549,0.038c-20.361-0.646-39.41,7.104-53.488,21.639
C6.527,35.65-0.584,54.071,0.038,73.549c1.194,37.419,31.442,67.667,68.861,68.861c0.779,0.025,1.551,0.037,2.325,0.037
c19.454,0,37.624-7.698,51.163-21.676C135.921,106.799,143.033,88.377,142.411,68.9z M111.613,110.336
c-10.688,11.035-25.032,17.112-40.389,17.112c-0.614,0-1.228-0.01-1.847-0.029c-29.532-0.943-53.404-24.815-54.348-54.348
c-0.491-15.382,5.122-29.928,15.806-40.958c10.688-11.035,25.032-17.112,40.389-17.112c0.614,0,1.228,0.01,1.847,0.029
c29.532,0.943,53.404,24.815,54.348,54.348C127.91,84.76,122.296,99.306,111.613,110.336z" />
<path d="M94.585,67.086L63.001,44.44c-3.369-2.416-8.059-0.008-8.059,4.138v45.293
c0,4.146,4.69,6.554,8.059,4.138l31.583-22.647C97.418,73.331,97.418,69.118,94.585,67.086z" />
</svg>
</div>
<aside class='door-overlay'>Tür ist <span id="door">ladend</span></aside>
</header>
<nav aria-label="Main Navigation">
<ul>
<li class="atomic"><img src="images/atomic.svg"
alt="Metalab Logo: eine Telefonzelle, dahinter ein rutherfordsches Atommodell"></li>
<li><a href="#" class="active">Home</a></li>
<li><a href="rooms-de.html">Räume</a></li>
<!-- <li><a href="events.html">Veranstaltungen</a></li> -->
<li><a href="location-de.html">Standort</a></li>
<li><a href="https://metalab.at/calendar/">Kalender</a></li>
<li><a href="https://dome.metalab.at">Der Dome</a></li>
<li><a href="https://metalab.at/wiki/Code_of_Conduct">Code of Conduct</a></li>
<li><a href="https://metalab.at/mos">Stammgast?</a></li>
<li><a href="https://metalab.at/wiki/Sponsoren">Unterstützer</a></li>
<li><a href="https://metalab.at/wiki/Impressum">Impressum</a></li>
<li><a href="index.html">🇬🇧</a></li>
<li><a href="#">🇦🇹</a></li>
</ul>
</nav>
<main>
<section>
<h3>Metalab</h3>
<div class="text">
<p> Das Metalab ist ein Ort, an dem du deiner Neugierde nachgehen, einzigartige Ideen verwirklichen
oder dich mit Anderen treffen und austauschen kannst. Als Wiens ältester und größter Hackspace
bietet das Metalab eine Atmosphäre, in der Menschen die sich für Kunst, Technologie,
Gesellschaft und Wissenschaft interessieren, zusammenkommen, um Wissen auszutauschen und an
persönlichen und gemeinsamen Projekten zu arbeiten. </p>
</div>
<img src="images/otterspace_main.webp" alt="Lachende Personen im Hauptraum">
</section>
<section>
<h3>Was ist ein Hackspace?</h3>
<div class="text">
<p> Der Begriff Hacking beschreibt nicht nur das Eindringen in Computersysteme. Bevor Hollywood
den Begriff für wenig überzeugende Actionfilme übernahm, bedeutete Hacken, Wissen und Neugier zu
nutzen, um technische und kreative Herausforderungen zu meistern. Viele Dinge, seien es
Softwaresysteme, Kleidung, Hardware oder sogar der eigene Körper, können und sollten gehackt
werden. </p>
<p> Ein Hackspace ist ein gemeinschaftlich betriebener Arbeitsbereich, in dem sich Hacker mit
gemeinsamen Interessen treffen, Wissen austauschen und mit Gleichgesinnten an Projekten arbeiten
können. </p>
</div>
<img src="images/hackspace.webp" alt="Metalab von der Straße aus gesehen">
</section>
<section>
<h3>Kreativität und Wissen</h3>
<div class="text">
<p> Das Metalab lebt von seinen Mitgliedern und ihrer Community und ermöglicht so einen horizontalen
Wissenstransfer. Du findest im Metalab Gruppen, die sich für Programmierung, Netzwerktechnik,
Amateurfunk, Elektronik, Robotik, Kunst, Aktivismus und Inklusion interessieren. </p>
<p> Interessengruppen treffen sich im Metalab für regelmäßige Meetups und Workshops, die Vorträge
und praktische Einführungen in diverse Themen bieten. Unsere Veranstaltungen sind in der Regel
öffentlich zugänglich und kostenlos. </p>
</div>
<img src="images/creativity.webp"
alt="Eine Person, die vor einem Laptop sitzend an einer Analogkamera arbeitet">
</section>
<section>
<h3>Veranstaltungen</h3>
<div class="text">
<p> Im Metalab finden fast täglich Events, Vorträge, Workshops und Meetups statt, die in der Regel
ohne Voranmeldung besucht werden können. Der Kalender enthält die nächsten öffentlichen
Veranstaltungen im Metalab. Schau ob etwas dabei ist das dein Interesse weckt und komm vorbei!
</p>
</div>
<figure title="Der Metalab Kalender">
<div class="calendar-content"> Lade... </div>
<figcaption>Die kommenden Veranstaltungen aus unserem Kalender. Du kannst auch <a
href='https://metalab.at/calendar/'>die eigene Kalenderseite</a> besuchen, um zukünftige
Veranstaltungen zu finden. </figcaption>
</figure>
</section>
<section>
<h3>Inklusion und Barrierefreiheit</h3>
<div class="text">
<p> Wir verstehen uns als inklusive Gemeinschaft, in der alle willkommen sind, unabhängig von Alter,
Herkunft, Geschlecht, Sexualität, Einkommen oder Religion. Unser Ziel ist es, ein Umfeld zu
schaffen, das von gegenseitigem Respekt, Toleranz und Ermutigung geprägt ist. </p>
<p> Das Metalab arbeitet mit <a href="https://defineblind.at">Define</a> und <a
href="https://machs-auf.at">MACH'S AUF!</a> zusammen um den Raum für gehörlose, blinde und
sehbehinderte Menschen zugänglicher zu machen. </p>
<p> Leider ist das Metalab nicht vollständig rollstuhlgerecht, am Eingang und vor der Toilette
befinden sich jeweils Stufen. Es gibt kein Leitsystem und nur wenige Beschriftungen in Braile. </p>
</div>
<figure aria-label="Vorstellung des Metalabs in Österreichischer Gebärdensprache">
<video muted playsinline controls poster="images/mach_s_auf_poster.webp">
<source src="videos/mach_s_auf_introduction_720p.mp4" type="video/mp4"> Du kannst die
gebärdensprachliche Vorstellung des Metalab auch <a
href="https://www.youtube.com/watch?v=7S8ZVDvWld0">auf YouTube</a> ansehen.
</video>
<figcaption aria-hidden="true">Vorstellung des Metalabs in ÖGS (Österreichischer Gebärdensprache).
</figcaption>
</figure>
</section>
<section>
<h3>Werkzeuge und Infrastruktur</h3>
<div class="text">
<p> Wir haben viele Werkzeuge und Maschinen, darunter einen Lasercutter, 3D-Drucker, eine CNC-Fräse,
eine Drehbank, Nähmaschinen, einen Vinylplotter und ein gut ausgestattetes Elektroniklabor. Alle
unsere Werkzeuge können von Gästen benutzt werden, erfordern aber möglicherweise eine
Einführung. Wenn du Werkzeuge wie den 3D-Drucker, die CNC-Fräse oder den Lasercutter benutzen
möchtest, zögere nicht, dich an <a href='mailto:[email protected]'>[email protected]</a> zu wenden,
um einen Termin zu vereinbaren, an dem dich jemand beaufsichtigen oder dir helfen kann. </p>
</div>
<img src="images/infrastructure.webp" alt="Zwei Personen, die vor einem 3D-Drucker stehen">
</section>
<section>
<h3>Was kostet es?</h3>
<div class="text">
<p> Unser Raum wird hauptsächlich durch Mitgliedschaften finanziert. Für die Nutzung des Raums und
die Durchführung von Veranstaltungen ist eine Mitgliedschaft nicht erforderlich, aber bei
regelmäßigem Besuch ist sie gerne gesehen. Der Standardbeitrag für die Mitgliedschaft beträgt
30€, für Student*innen und Menschen in finanziell prekären Situationen gibt es ermäßigte
Mitgliedsbeiträge. </p>
<p> Viele Werkzeuge und Maschinen können kostenlos genutzt werden, aber wir freuen uns immer über
Spenden für Material und Wartung. Die wichtigste Ausnahme ist unser Lasercutter, bei dem 0,60 €
pro Minute Schnittzeit verrechnet werden. </p>
</div>
<img src="images/costs.webp" alt="Spendenbox auf einem Tisch im Metalab">
</section>
<section>
<h3>Besuch uns!</h3>
<div class="text">
<p> Das Metalab ist in der Regel jeden Tag ab 18 Uhr geöffnet, oft auch früher, wenn bereits ein
Mitglied vor Ort ist. </p>
<p> Für deinen ersten Besuch empfehlen wir dir, an einem unserer regelmäßigen Open Days (jeden
zweiten Donnerstag und vierten Freitag im Monat) vorbeizukommen. Am Open Day führen Mitglieder
des Vereins euch gerne durch die Räumlichkeiten und helfen euch bei der Benutzung der Geräte.
Alternativ kannst du auch am <a href='https://metalab.at/wiki/MetaInvasion_Day'>MetaInvasion
Day</a> vorbeikommen, an dem der Raum ausschließlich für Frauen, agender, inter-, non-binäre
und trans Menschen sowie für alle, die ihr Geschlecht noch in Frage stellen, geöffnet ist. </p>
<p> Wenn du Fragen hast, kontaktiere uns per E-Mail unter <a
href='mailto:[email protected]'>[email protected]</a>, ruf uns unter <a
href='tel:+43720002323'>+43 720 002323</a> an, oder besuche uns in der <strong>Rathausstraße
6, 1010 Wien</strong>. Du kannst uns auch auf
<a rel="me" href="https://chaos.social/@metalab">Mastodon</a> erreichen.
</p>
<p> Du kannst dir auch die detaillierte Beschreibung auf der <a href='location-de.html'>Seite zum
Standort</a> ansehen. </p>
</div>
<figure>
<iframe title="Interaktive Karte die den Standort des Metalab zeigt" frameborder="0" scrolling="no"
marginheight="0" marginwidth="0"
src="https://www.openstreetmap.org/export/embed.html?bbox=16.353868246078495%2C48.207976537426354%2C16.358374357223514%2C48.21106167125026&layer=transportmap&marker=48.20951912757066%2C16.356121301651"
style="border: 1px solid black"></iframe>
<figcaption>Lageplan des Metalab [<a
href="https://www.openstreetmap.org/?mlat=48.20945&mlon=16.35612#map=18/48.20945/16.35612&layers=T">Große
Karte anzeigen</a>]</figcaption>
</figure>
</section>
</main>
</div>
<footer>
<p>©2022-2023 Metalab. Mit <a href='http://vanilla-js.com/'>Vanilla JS</a> erstellt.<a
href='https://metalab.at/wiki/Datenschutzerkl%C3%A4rung'>Datenschutzerklärung</a>.</p>
</footer>
<script>
function escapeHtml(str) {
return str.replace(/&/g, "&")
.replace(/</g, "<")
.replace(/>/g, ">")
.replace(/"/g, """)
.replace(/'/g, "'");
}
function createEventHtml(event) {
return `<li>
<div>
<p class="event">
<span class="event_date">${escapeHtml(event.date)}</span><a
href="${event.url}"><span class="name">${escapeHtml(event.title)}</span></a
><span class="teaser">${escapeHtml(event.subtitle)}</span>
</p>
</div>
</li>`;
}
window.addEventListener('DOMContentLoaded', () => {
const calendarContent = document.querySelector('.calendar-content');
fetch('https://metalab.at/calendar/api/public_upcoming').then(async (response) => {
if (response.ok) {
const json = await response.json();
const events = json.map(createEventHtml);
calendarContent.innerHTML = `<ul>${events.join('')}</ul>`;
}
});
});
</script>
</body>
</html>