Skip to content

Commit 3070149

Browse files
committed
Raetselseite ausgebaut. Archiv fuer alte Raetsel
1 parent ce5e110 commit 3070149

File tree

6 files changed

+294
-26
lines changed

6 files changed

+294
-26
lines changed

archiv.html

Lines changed: 222 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,222 @@
1+
<!DOCTYPE html>
2+
<html lang="de">
3+
4+
<head>
5+
6+
<meta charset="utf-8">
7+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
8+
<meta name="viewport" content="width=device-width, initial-scale=1">
9+
<meta name="description" content="Informationen zum CoderDojo Karlsruhe">
10+
<meta name="author" content="CoderDojo Karlsruhe">
11+
<meta name="keywords"
12+
content="CoderDojo,Karlsruhe,Programmieren,Schüler,Schueler,Kinder,Jugendliche,Schule,KIT,Informatik,Scratch,HTML,CSS,JavaScript,Java,PHP,C#,C,C++,Python">
13+
14+
<title>CoderDojo Karlsruhe</title>
15+
16+
<!-- Favicon -->
17+
<link rel="icon" href="favicon.ico" type="image/x-icon">
18+
19+
<!-- Bootstrap Core CSS -->
20+
<link href="css/bootstrap.min.css" rel="stylesheet">
21+
22+
<!-- Lightbox Image Viewer CSS -->
23+
<link href="css/lightbox.css" rel="stylesheet">
24+
25+
<!-- Custom CSS -->
26+
<link href="css/coderdojoka.css" rel="stylesheet">
27+
28+
<!-- Custom Fonts -->
29+
<link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
30+
<link href="https://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic" rel="stylesheet"
31+
type="text/css">
32+
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css">
33+
34+
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
35+
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
36+
<!--[if lt IE 9]>
37+
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
38+
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
39+
<![endif]-->
40+
41+
<script>
42+
(function (i, s, o, g, r, a, m) {
43+
i['GoogleAnalyticsObject'] = r;
44+
i[r] = i[r] || function () {
45+
(i[r].q = i[r].q || []).push(arguments)
46+
}, i[r].l = 1 * new Date();
47+
a = s.createElement(o),
48+
m = s.getElementsByTagName(o)[0];
49+
a.async = 1;
50+
a.src = g;
51+
m.parentNode.insertBefore(a, m)
52+
})(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');
53+
54+
ga('create', 'UA-61795572-1', 'auto');
55+
ga('send', 'pageview');
56+
</script>
57+
</head>
58+
59+
<body id="page-top" data-spy="scroll" data-target=".navbar-fixed-top">
60+
61+
<!-- Navigation -->
62+
<nav class="navbar navbar-custom navbar-fixed-top" role="navigation">
63+
<div class="container">
64+
<div class="navbar-header">
65+
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-main-collapse">
66+
<i class="fa fa-bars"></i>
67+
</button>
68+
<span>
69+
<a class="navbar-brand" href="index.html">
70+
<img src="img/logo.png" alt="CoderDojo Karlsruhe Logo" class="navbar-brand-logo"/>
71+
<span id="navbar-brand-name-collapse">
72+
<span class="light">CoderDojo</span> Karlsruhe
73+
</span>
74+
</a>
75+
</span>
76+
<span class="navbar-breadcrumb navbar-breadcrumb-sep">
77+
<i class="fa fa-angle-double-right"></i>
78+
</span>
79+
<a class="navbar-breadcrumb page-scroll" href="raetsel.html">Rätsel</a>
80+
<span class="navbar-breadcrumb navbar-breadcrumb-sep">
81+
<i class="fa fa-angle-double-right"></i>
82+
</span>
83+
<a class="navbar-breadcrumb page-scroll" href="#page-top">Archiv</a>
84+
</div>
85+
86+
87+
<!-- Collect the nav links, forms, and other content for toggling -->
88+
<div class="collapse navbar-collapse navbar-right navbar-main-collapse">
89+
<ul class="nav navbar-nav">
90+
<!-- Hidden li included to remove active class from about link when scrolled up past about section -->
91+
<li class="hidden">
92+
<a href="#page-top"></a>
93+
</li>
94+
</ul>
95+
</div>
96+
<!-- /.navbar-collapse -->
97+
</div>
98+
<!-- /.container -->
99+
</nav>
100+
101+
102+
<!-- Puzzle Section -->
103+
<section class="content-section text-center">
104+
<div class="container">
105+
<div class="row">
106+
<div class="col-lg-8 col-lg-offset-2">
107+
108+
<h1>Rätsel-Archiv</h1>
109+
110+
<p>
111+
Hier findest du alle alten Rätsel, die bisher gestellt wurden. Das aktuelle Rätsel kannst du <a
112+
href="raetsel.html">hier</a> zu finden.
113+
</p>
114+
115+
<h2>Alte Rätsel</h2>
116+
<ul id="old_puzzles">
117+
<!-- <li data-md="zeichen_code.md" title="Text entschlüsseln"><a href="#old_puzzles">Text verschlüsseln</a> (20.11.2015)</li> -->
118+
<li data-md="hindernisse.md" title="Roboter im Labyrinth"><a
119+
href="#old_puzzles">Roboter-Labyrinth</a> (4.11.2015)
120+
</li>
121+
</ul>
122+
123+
<hr class="space100">
124+
125+
<div id="puzzle_view"></div>
126+
127+
</div>
128+
</div>
129+
</div>
130+
</section>
131+
132+
<!-- Footer -->
133+
<footer>
134+
<div class="container text-center">
135+
<p>Copyright &copy; CoderDojo Karlsruhe 2015</p>
136+
137+
<p><a class="twitter-follow-button" href="https://twitter.com/CoderDojoKa" data-show-count="false">Follow
138+
@CoderDojoKa</a></p>
139+
140+
<div class="fb-like" data-href="https://facebook.com/pages/CoderDojo-Karlsruhe/1455190411441732"
141+
data-layout="button" data-action="like" data-show-faces="false" data-share="true"></div>
142+
<p><span style="font-size:16px;"><a
143+
href="https://www.sharelatex.com/github/repos/coderdojoka/satzung-hochschulgruppe/builds/latest/output.pdf">Satzung</a> (<a
144+
href="https://github.com/coderdojoka/satzung-hochschulgruppe">Github</a>)</span></p>
145+
</div>
146+
</footer>
147+
148+
<!-- jQuery -->
149+
<script src="js/jquery.min.js"></script>
150+
151+
<!-- Bootstrap Core JavaScript -->
152+
<script src="js/bootstrap.min.js"></script>
153+
154+
<!-- Plugin JavaScript -->
155+
<script src="js/jquery.easing.min.js"></script>
156+
157+
<!-- Mardown to Html Plugin -->
158+
<script src="js/showdown.min.js"></script>
159+
160+
<!-- Aktuelles Rätsel laden -->
161+
<script>
162+
window.onload = function () {
163+
164+
var $container = $('#puzzle_view');
165+
var url = "https://raw.githubusercontent.com/coderdojoka/coderdojoka.github.io/master/raetsel/";
166+
167+
$('#old_puzzles').find('li').each(function () {
168+
var _this = $(this);
169+
_this.click(function () {
170+
loadPuzzle(_this.data("md"), _this.attr("title"))
171+
});
172+
});
173+
174+
function loadPuzzle(name, title) {
175+
$container.text("Lade Rätsel...");
176+
$.get(url + name).done(function (data) {
177+
178+
var converter = new showdown.Converter();
179+
var html = converter.makeHtml(data);
180+
181+
$container.empty().append("<h2>" + title + "</h2>").append(html);
182+
}).fail(function () {
183+
$container.empty().append("Es ist ein Fehler beim Laden des Rätsels aufgetreten... :(");
184+
});
185+
}
186+
}
187+
188+
</script>
189+
190+
<script>window.twttr = (function (d, s, id) {
191+
var js, fjs = d.getElementsByTagName(s)[0],
192+
t = window.twttr || {};
193+
if (d.getElementById(id)) return t;
194+
js = d.createElement(s);
195+
js.id = id;
196+
js.src = "https://platform.twitter.com/widgets.js";
197+
fjs.parentNode.insertBefore(js, fjs);
198+
199+
t._e = [];
200+
t.ready = function (f) {
201+
t._e.push(f);
202+
};
203+
204+
return t;
205+
}(document, "script", "twitter-wjs"));</script>
206+
207+
<script>(function (d, s, id) {
208+
var js, fjs = d.getElementsByTagName(s)[0];
209+
if (d.getElementById(id)) return;
210+
js = d.createElement(s);
211+
js.id = id;
212+
js.src = "//connect.facebook.net/de_DE/sdk.js#xfbml=1&version=v2.3";
213+
fjs.parentNode.insertBefore(js, fjs);
214+
}(document, 'script', 'facebook-jssdk'));</script>
215+
216+
<!-- Custom Theme JavaScript -->
217+
<script src="js/coderdojoka.js"></script>
218+
219+
220+
</body>
221+
222+
</html>

css/coderdojoka.css

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -735,3 +735,10 @@ body {
735735
margin-right: 10px;
736736
}
737737

738+
#old_puzzles {
739+
text-align: left;
740+
}
741+
742+
.space100 {
743+
margin: 100px 0;
744+
}

img/ninjas.png

53.4 KB
Loading

material.html

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -179,6 +179,9 @@ <h2>Scratch</h2>
179179
es muss nichts installiert werden.
180180
</p>
181181

182+
183+
<iframe allowtransparency="true" width="485" height="402" src="//scratch.mit.edu/projects/embed/63674944/?autostart=false" frameborder="0" allowfullscreen="true"></iframe>
184+
182185
<h3>Nützliche links</h3>
183186

184187
<p>

raetsel.html

Lines changed: 55 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -65,67 +65,98 @@
6565
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-main-collapse">
6666
<i class="fa fa-bars"></i>
6767
</button>
68-
<a class="navbar-brand page-scroll" href="index.html">
69-
<img src="img/logo.png" alt="CoderDojo Karlsruhe Logo"
70-
class="navbar-brand-logo"/> <span id="navbar-brand-name"><span
71-
class="light">CoderDojo</span> Karlsruhe</span>
72-
</a>
68+
<span>
69+
<a class="navbar-brand" href="index.html">
70+
<img src="img/logo.png" alt="CoderDojo Karlsruhe Logo" class="navbar-brand-logo"/>
71+
<span id="navbar-brand-name-collapse">
72+
<span class="light">CoderDojo</span> Karlsruhe
73+
</span>
74+
</a>
75+
</span>
76+
<span class="navbar-breadcrumb navbar-breadcrumb-sep"><i class="fa fa-angle-double-right"></i>
77+
</span><a class="navbar-breadcrumb page-scroll" href="#page-top">Rätsel</a>
7378
</div>
7479

80+
7581
<!-- Collect the nav links, forms, and other content for toggling -->
7682
<div class="collapse navbar-collapse navbar-right navbar-main-collapse">
7783
<ul class="nav navbar-nav">
7884
<!-- Hidden li included to remove active class from about link when scrolled up past about section -->
7985
<li class="hidden">
8086
<a href="#page-top"></a>
81-
</li>
87+
</li>
8288
</ul>
8389
</div>
8490
<!-- /.navbar-collapse -->
8591
</div>
8692
<!-- /.container -->
8793
</nav>
8894

89-
90-
<!-- About Section -->
91-
<section id="about" class="content-section text-center">
95+
<!-- Puzzle Section -->
96+
<section class="content-section text-center">
9297
<div class="container">
9398
<div class="row">
9499
<div class="col-lg-8 col-lg-offset-2">
95-
<h1>Rätsel der Woche</h1>
100+
101+
<h1>Das Rätsel der Woche</h1>
102+
<img src="img/ninjas.png">
96103

97104
<p>
98-
Dir ist die Lücke zwischen 2 CoderDojo Treffen zu groß? Dann bist du hier richtig. Auf dieser Seite
99-
stellen wir nach jeden Treffen ein neues Rätsel hoch, das du in Ruhe von daheim aus bearbeiten
105+
Dir ist die Lücke zwischen 2 CoderDojo Treffen zu groß? Dann bist du hier richtig. Auf
106+
dieser Seite
107+
stellen wir nach jeden Treffen ein neues <a href="#puzzle"
108+
class="page-scroll">Rätsel</a> hoch, das
109+
du in Ruhe von
110+
daheim aus bearbeiten
100111
kannst,
101112
um die Zeit bis zum nächsten Treffen zu überbrücken.
102-
<br>
103-
Die Rätsel zu lösen ist natürlich freiwillig. CoderDojo-Teilnehmer können die Aufgaben bearbeiten
104-
und uns
105-
die Lösungen per Mail schicken bzw. im nächsten Dojo mitbringen. In regelmäßigen Abständen werden
106-
wir
113+
</p>
114+
115+
<h3>Wie funktionierts?</h3>
116+
117+
<p>
118+
Jeder CoderDojo-Teilnehmer kann die Aufgaben bearbeiten und uns die Lösungen per Mail
119+
schicken
120+
oder beim nächsten Dojo mitbringen. In regelmäßigen Abständen werden wir
107121
die besten Lösungen vorstellen und man kann sogar einen kleinen Preis gewinnen :)
108-
<br>
109-
Es geht hier nicht darum die Aufgabe perfekt zu lösen, sondern du sollst dir selbst
110-
einen Lösungsweg überlegen und bestenfalls auch zu einer Antwort kommen. Du musst die Aufgabe nicht
111-
100% korrekt lösen,
112-
viel wichtiger ist, dass du versuchst sie zu lösen und dir Gedanken dazu gemacht hast.
122+
</p>
113123

124+
<p>
125+
Es geht hier nicht darum die Aufgabe perfekt zu lösen, sondern du sollst dir selbst
126+
einen Lösungsweg überlegen. Du musst die Aufgabe nicht
127+
100% korrekt lösen, viel wichtiger ist, dass du versuchst sie zu lösen und dir Gedanken
128+
dazu gemacht
129+
hast.
130+
Als Lösung kannst du abgeben, was dir am Liebsten ist: Text, Bild, ein Scratch- oder
131+
Pythonprogramm,
132+
etc...
114133
</p>
115134

116135
<p>
117136
Die Aufgaben sind so gestellet, dass alle Teilnehmer diese lösen können.
118-
Anderenfalls gibt es mehrere Teilaufgaben/Schwierigkeitsgrade, die ihr euch aussuchen könnt.
137+
Anderenfalls gibt es mehrere Teilaufgaben/Schwierigkeitsgrade, die ihr euch aussuchen
138+
könnt.
119139
</p>
120140

121141

142+
<hr class="space100">
143+
122144
<h2>Aktuelles Rätsel</h2>
123145

124146
<div id="puzzle">
125147
Lade Rätsel...
126148
</div>
127149

128150

151+
<h2>Alte Rätsel</h2>
152+
153+
<p>
154+
Alle bisherigen Rätsel kannst du im <a href="archiv.html">Archiv</a> finden. Du kannst
155+
diese, wenn
156+
du Lust hast, auch noch nachträglich lösen.
157+
</p>
158+
159+
129160
</div>
130161
</div>
131162
</div>
@@ -156,7 +187,7 @@ <h2>Aktuelles Rätsel</h2>
156187
<!-- Plugin JavaScript -->
157188
<script src="js/jquery.easing.min.js"></script>
158189

159-
<!-- Image Viewer Plugin -->
190+
<!-- Mardown to Html Plugin -->
160191
<script src="js/showdown.min.js"></script>
161192

162193
<!-- Aktuelles Rätsel laden -->
Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,12 @@
1-
Die drei Ninjas Karl, Bruno, Leyla haben das Handy ihres Sensei's versteckt. Damit sie nicht vergessen wo sie das Handy versteckt haben, haben sie aufgeschrieben, wo sie es versteckt haben. Um zu verhindern, dass ihr Sensei den Text lesen kann, haben sie diesen verschlüsselt.
1+
Die drei Ninjas Karl, Bruno, Leyla haben das Handy ihres Senseis versteckt.
2+
Damit sie nicht vergessen wo sie das Handy versteckt haben, haben sie aufgeschrieben,
3+
wo sie es versteckt haben. Um zu verhindern, dass ihr Sensei den Text lesen kann, haben sie diesen verschlüsselt.
24

35
### Zeichen zuordnen
4-
Als ersten Schritt haben sich die Drei paar neue Symbole ausgedacht, um die Zahlen von 0-15 darzustellen. Dabei haben sie für die Zahlen 10-15 neue Symbole erfunden. Dummerweise haben die drei Ninjas vergessen welches Symbol zu welcher Zahl gehört... Allerdings haben sie sich genau für diesen Fall ein paar Hinweise aufgeschrieben:
6+
Als ersten Schritt haben sich die Drei paar neue Symbole ausgedacht,
7+
um die Zahlen von 0-15 darzustellen. Dabei haben sie für die Zahlen 10-15 neue Symbole erfunden.
8+
Dummerweise haben die drei Ninjas vergessen welches Symbol zu welcher Zahl gehört...
9+
Allerdings haben sie sich genau für diesen Fall ein paar Hinweise aufgeschrieben:
510

611
`☂ - 2 = 9`
712
`⚑ + ☢ = 24`

0 commit comments

Comments
 (0)