forked from hackergarten/hackergarten.github.io
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
301 lines (263 loc) · 19.8 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
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
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
<!DOCTYPE html>
<html lang="en" ng-app="hackergartenPage">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>Hackergarten</title>
<link rel="alternate" type="application/rss+xml" title="RSS" href="feed.rss" />
<link rel="icon" href="/favicon.ico" type="image/x-icon" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<!-- Bootstrap core CSS -->
<link href="https://cdn.jsdelivr.net/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet">
<link href="ng-dialog/css/ngDialog.min.css" rel="stylesheet">
<link href="ng-dialog/css/ngDialog-theme-default.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"
integrity="sha256-kLaT2GOSpHechhsozzB+flnD+zUyjE2LlfWPgU04xyI="
crossorigin=""/>
<link href="css/main.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<link href="css/mastodon.widget.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<!-- Main jumbotron for a primary marketing message or call to action -->
<div class="jumbotron" random-header-image="image">
<div class="container">
<img id="logo" src="pictures/hg-logo-white-small.svg" alt="hackergarten" class="visible-xs pull-left img-responsive" style="max-width: 125px" />
<img id="logo" src="pictures/hg-logo-white-large.svg" alt="hackergarten" class="hidden-xs pull-left img-responsive" style="min-width: 250px; max-width: 500px"/>
<div id="rss-icon" class="hidden-xs"><a href="feed.xml"><img src="pictures/rss.png" width="48" height="48"/></a></div>
</div>
</div>
<div class="container fade" ng-controller="eventlistController" ng-strict-di ng-init="ngLoaded = true" ng-class="{ in: ngLoaded }">
<div class="row">
<div class="col-md-6">
<!-- next events -->
<div class="panel panel-default">
<div class="panel-heading">Next Events</div>
<div class="panel-body">
<ul class="next-events">
<li id="event-{{event.hashCode}}" class="{{event.status.key}}" title="{{event.status.title}}" ng-repeat="event in futureEventlist">
<span>Hack #{{allEventlistLength + $index}} {{event.title}}</span>
<span class="reason" ng-if="event.status.title"><br/>→ {{event.status.title}}</span>
<ul ng-if="event.links.length > 0">
<li ng-repeat="link in event.links"><a href="{{link.url}}">{{link.title}}</a></li>
</ul>
</li>
</ul>
<span class="hidden-sm hidden-xs"> more coming up ...look at the <em>Join</em> section on the <a href="#joinSection">right...</a></span><span class="visible-sm visible-xs"> more coming up ...look at the <em>Join</em> section <a href="#joinSection">below...</a></span>
</div>
</div>
<!-- about -->
<div class="panel panel-default visible-sm visible-xs">
<div class="panel-heading">About</div>
<div class="panel-body">
Hackergarten is a craftmen's workshop, classroom, a laboratory, a social circle, a writing group, a playground, and an artist's studio. Our goal is to create something that others can use; whether it be working software, improved documentation, or better educational materials. Our intent is to end each meeting with a patch or similar contribution submitted to an open and public project. Membership is open to anyone willing to contribute their time.
</div>
</div>
<!-- locations -->
<div class="panel panel-default">
<div class="panel-heading">Locations</div>
<div class="panel-body">
<div id="map"></div>
</div>
</div>
<!-- past events -->
<div class="panel panel-default">
<div class="panel-heading">Past Events</div>
<div class="panel-body scrollable">
<ul>
<li ng-if="event.status.key != 'canceled'" id="event-{{event.hashCode}}" class="{{event.status.key}}" title="{{event.status.title}}" ng-repeat="event in pastEventlist | limitTo:totalPEventDisplayed">
<span>Hack #{{pastEventlistLength - $index}} {{event.title}}</span>
<span class="reason" ng-if="event.status.title"><br/>→ {{event.status.title}}</span>
<ul ng-if="event.links.length > 0">
<li ng-repeat="link in event.links"><a href="{{link.url}}">{{link.title}}</a></li>
</ul>
<ul ng-if="event.achievements.length > 0">
<li><a href="#achievements" ng-click="openModal(event)">Achievements</a></li>
</ul>
</li>
</ul>
<div>
<button type="button" class="btn btn-secondary btn-lg btn-block" ng-click="loadMore()">Load more events</button>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">Open Hackergarten Issues from GitHub (max. 30)</div>
<div class="panel-body" id="githubissues">
</div>
<div class="panel-footer">See the complete list on <a href="https://github.com/search?q=label%3Ahackergarten+state%3Aopen">GitHub</a>.</div>
</div>
<div class="panel panel-default">
<div id="downloadSection" class="panel-heading">Downloads</div>
<div class="panel-body">
<p>
Please note: To use the Hackergarten logo, you must agree to the
<a href="#licenseSection">license terms</a>, which you can also find on
<a href="#licenseSection">this page</a>.
</p>
<form>
<input type="checkbox" id="acceptLicense" />
<label for="acceptLicense">Yes, I accept the license agreement!</label>
</form>
<ul>
<li><a download href="pictures/hackergarten-logo.png" onclick="return checkLicense();">Hackergarten Logo (PNG)</a></li>
<li><a download href="pictures/hg-logo-black.png" onclick="return checkLicense();">Hackergarten Logo black (PNG)</a><br>
<li><a download href="pictures/hg-logo-white.png" onclick="return checkLicense();">Hackergarten Logo white (PNG)</a><br>
<li><a download href="pictures/hg-logo-white-large.svg" onclick="return checkLicense();">Hackergarten Logo white large (SVG)</a><br>
<li><a download href="pictures/hg-logo-white-small.svg" onclick="return checkLicense();">Hackergarten Logo white small (SVG)</a><br>
</ul>
</div>
</div>
</div>
<!-- about -->
<div class="col-md-6">
<div class="panel panel-default hidden-sm hidden-xs">
<div class="panel-heading">About</div>
<div class="panel-body">
Hackergarten is a craftmen's workshop, classroom, a laboratory, a social circle, a writing group, a playground, and an artist's studio. Our goal is to create something that others can use; whether it be working software, improved documentation, or better educational materials. Our intent is to end each meeting with a patch or similar contribution submitted to an open and public project. Membership is open to anyone willing to contribute their time.
</div>
</div>
<div class="panel panel-default">
<div id="joinSection" class="panel-heading">Join</div>
<div class="panel-body">
<a href="https://hackergarten.slack.com/" title="Enter Slack Workspace"><img src="pictures/slack.png" alt="Slack Workspace" id="slack" /></a>
<ul>
<li><a href="feed.xml">Hackergarten Events RSS Feed</a></li>
<li><a href="http://github.com/hackergarten">Public Git Repository</a><br>
<li><a href="https://fosstodon.org/@hackergarten">@Hackergarten on Mastodon</a></li>
<li><a href="http://www.twitter.com/Hackergarten">@Hackergarten on Twitter</a></li>
<li><a href="https://gitter.im/hackergarten?utm_source=share-link&utm_medium=link&utm_campaign=share-link">Gitter</a></li>
<li>Slack: <a href="https://forms.gle/93guiZ3rXtW4azdo6">request invitation</a> and/or <a href="https://hackergarten.slack.com/">enter workspace</a></li>
</ul>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">Mastodon</div>
<div class="mastodon-timeline mastodon-timeline-light" id="mastodon-timeline"></div>
</div>
<div class="panel panel-default">
<div class="panel-heading">Twitter</div>
<div class="panel-body">
<a class="twitter-timeline" data-width="500" data-height="500" data-dnt="true" data-link-color="#428bca" href="https://twitter.com/Hackergarten?ref_src=twsrc%5Etfw">Tweets by Hackergarten</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
</div>
</div>
<div class="panel panel-default">
<div id="projectSection" class="panel-heading">Top Contributed Projects</div>
<div class="panel-body">
<iframe src="projects.html" width="100%" frameBorder="0"></iframe>
</div>
</div>
<div class="panel panel-default">
<div id="startSection" class="panel-heading">How to get started</div>
<div class="panel-body">
<p>If you want to organize a Hackergarten for the first time, it is a good idea to have visited another Hackergarten as a participant yourself. Then of course you need a room where the Hackergarten can take place. There must be enough connection possibilities (electricity) for the notebooks of the participants and a WiFi with Internet access. Every Hackergarten offers drinks, snacks and pizza for the participants. The pizza is for the break in between, which is very important for networking. We do not order one pizza for each participant, we simply put together a selection of different pizzas. Not everyone always eats a whole pizza and so there is less waste. A formula that has proven itself in Lucerne, for example, is "number of participants multiplied by 0.8, rounded up to a whole number". 😀</p>
<p>In order to facilitate the organization, we recommend the use of <a href="https://www.meetup.com/">Meetup</a>. This platform has proven itself at many events, e.g. in <a href="https://www.meetup.com/Hackergarten-Basel/">Basel</a> and <a href="https://www.meetup.com/Hackergarten-Luzern/">Lucerne</a>. We are happy to add your Hackergarten to our list of events. You can fork our <a href="https://github.com/hackergarten/hackergarten.github.io/">repository</a>, add your event to the file <a href="https://github.com/hackergarten/hackergarten.github.io/blob/master/events.json">events.json</a> and create a pull request.</p>
<p>If you want to use the Hackergarten logo, you can download it in the <a href="#downloadSection">download section</a> on this page after you agree to the <a href="#licenseSection">license terms</a>.</p>
</div>
</div>
<div class="panel panel-default panel-sponsors">
<div class="panel-heading">Sponsors</div>
<div class="panel-body">
<ul>
<li>
<a href="https://www.karakun.com"><img src="pictures/karakun.png" alt="Karakun AG Logo" height="80px"></a>
<p><a href="https://www.karakun.com">Karakun AG</a> is a group of experts who started a startup with a history. Karakun offers technology consulting, full-stack services, and carefree package solutions any of your software-related projects, always customer benefit and success in focus.</p>
<p>Karakun provides us a place to meet in the center of Basel, Internet access, a pizza budget, and (for some of the Hackergarteners) a place to work.</p>
</li>
<li>
<p><a href="https://www.css.ch/"><img src="pictures/css.svg" alt="CSS" style="float: left; clear:both; margin-right: 15px; width: 150px;"></a><a href="https://www.css.ch/">CSS</a>, headquartered in Lucerne, is a Swiss insurance group specializing in health insurance. With 1.34 million insured persons in compulsory health insurance, <a href="https://www.css.ch/">CSS</a> is the largest basic insurer in Switzerland. <a href="https://www.css.ch/">CSS</a> provides us snacks, drinks and a pizza budget.</p>
</li>
<li>
<p><a href="https://www.jug.ch/"><img src="pictures/jugch.png" alt="Java User Group Switzerland" style="float: left; clear:both; margin-right: 15px;"></a>The <a href="https://www.jug.ch/">Java User Group Switzerland</a> aims at promoting the application of Java technology in Switzerland. The Java User Group Switzerland facilitates the sharing of experience and information among its members. This is accomplished through workshops, seminars and conferences. JUG Switzerland also encourages the cooperation between commercial organizations and research institutions.</p>
<p><a href="https://www.jug.ch/">JUG.CH</a> provides us snacks, drinks and a pizza budget.</p>
</li>
<li>
<p><a href="https://www.quatico.com"><img src="pictures/quatico.svg" alt="Quatico" style="float: left; clear:both; margin-right: 15px; max-width: 100px;"></a>
We at <a href="https://www.quatico.com/">Quatico</a> believe in quality, standards and modern architectures powered with and by open source software. We love the web, build our long-term relationships on microservices and actively date microfrontends.</p>
<p><a href="https://www.quatico.com">Quatico</a> supports Hackergarten with a place to meet in the tech heart of Zurich and provides Drinks, Pizza and Internet.</p>
</li>
<li>
<a href="https://www.codecentric.de"><img src="pictures/codecentric.png" alt="codecentric AG logo" height="80"></a>
<p>
As a pioneer for agile and custom software development, <a href="https://www.codecentric.de">codecentric AG</a> has been a thought leader for innovative technologies in Germany for 19 years. codecentric helps companies to meet the challenges of digital transformation proactively, and empowers them to develop and sustain digital competitive advantages.
<p>
<p>codecentric provides us a place to meet, Internet access, drinks, and a pizza budget.</p>
</li>
<li>
Want to see the Sponsor of your Hackergarten here?
<a href="https://github.com/hackergarten/hackergarten.github.io/edit/master/index.html"
target="_blank">Edit & Create a Pull Request on GitHub!</a>
</li>
</ul>
</div>
</div>
<div class="panel panel-default">
<div id="licenseSection" class="panel-heading">License / Rights</div>
<div class="panel-body">
As we were asked many times about the license / copyright of "Hackergarten", we decided to put it under a creative commons license:
<br />
<p>
<a rel="license" href="http://creativecommons.org/licenses/by-sa/4.0/"><img alt="Creative Commons License" style="border-width:0" src="https://i.creativecommons.org/l/by-sa/4.0/88x31.png" /></a><br /><span xmlns:dct="http://purl.org/dc/terms/" property="dct:title">Hackergarten</span> by <a xmlns:cc="http://creativecommons.org/ns#" href="https://hackergarten.net" property="cc:attributionName" rel="cc:attributionURL">https://hackergarten.net</a> is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by-sa/4.0/">Creative Commons Attribution-ShareAlike 4.0 International License</a>.<br />Permissions beyond the scope of this license may be available at <a xmlns:cc="http://creativecommons.org/ns#" href="https://hackergarten.net" rel="cc:morePermissions">https://hackergarten.net</a>.
</p>
</div>
</div>
</div>
</div>
<hr>
<footer>
<p>Copyright © Hackergarten</p>
</footer>
</div> <!-- /container -->
<script type="text/ng-template" id="event-achievements">
<div class="ngdialog-message">
<h4><strong>Hack {{ngDialogData.title}}.</strong></h4>
<ul>
<li ng-repeat="item in ngDialogData.achievements"><a ng-if="item.url" href="{{item.url}}">{{item.title}}</a><span ng-if="!item.url">{{item.title}}</span></li>
</ul>
</div>
</script>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/js-xss/0.3.3/xss.js"></script>
<script src="https://unpkg.com/[email protected]/dist/leaflet.js"
integrity="sha256-WBkoXOwTeyKclOHuWtc+i2uENFpDZ9YPdf5Hf+D7ewM="
crossorigin=""></script>
<script src="ng-dialog/js/ngDialog.js"></script>
<script src="scripts/hgMainPage.js"></script>
<script src="scripts/eventlist.js"></script>
<script src="scripts/github.js"></script>
<script src="scripts/locations.js"></script>
<script src="scripts/mastodon.widget.js"></script>
<script>
document.addEventListener("DOMContentLoaded", function() {
var mapi = new MastodonApi({
target_selector: '#mastodon-timeline',
pic_icon : '<i class="fa fa-picture-o"></i>',
boosts_count_icon : '<i class="fa fa-retweet"></i>',
favourites_count_icon : '<i class="fa fa-star"></i>'
});
});
</script>
<script>
function checkLicense() {
if (document.getElementById("acceptLicense").checked) {
return true; // license accepted, download okay
}
alert("Please accept the license agreement before downloading!");
return false;
}
</script>
</body>
</html>