-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
243 lines (205 loc) · 13.5 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Le mariage... est passé!</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="des infos sur après le mariage">
<meta name="author" content="samy">
<!-- Le styles -->
<link href="./bootstrap/css/bootstrap.min.css" rel="stylesheet">
<style>
body {
padding-top: 40px; /* 40px to make the container go all the way to the bottom of the topbar */
}
</style>
<link href="./bootstrap/css/bootstrap-responsive.min.css" rel="stylesheet">
<!-- le custom -->
<link href="./css/letsjam.css" rel="stylesheet">
<!-- le font -->
<link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<link href="http://fonts.googleapis.com/css?family=Cabin" rel="stylesheet" type="text/css">
<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
<script src="./bootstrap/js/html5shiv.js"></script>
<![endif]-->
<!-- Fav and touch icons -->
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="./bootstrap/ico/apple-touch-icon-144-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="./bootstrap/ico/apple-touch-icon-114-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="./bootstrap/ico/apple-touch-icon-72-precomposed.png">
<link rel="apple-touch-icon-precomposed" href="./bootstrap/ico/apple-touch-icon-57-precomposed.png">
<link rel="shortcut icon" href="./bootstrap/ico/favicon.png">
</head>
<body data-spy="scroll" data-target=".navbar" data-offset="400">
<!--[if lt IE 7]>
<p class="chromeframe">Désolé, mais votre navigateur est vraiment <strong>dépassé</strong>. Merci de <a href="http://browsehappy.com/">mettre à jour votre navigateur</a> ou <a href="http://www.google.com/chromeframe/?redirect=true">d'activer Google Chrome Frame</a> pour voir ce site correctement.</p>
<![endif]-->
<div class="container" style="width:100%">
<div class="navbar navbar-fixed-top navbar-static-top">
<div class="navbar-inner">
<a class="brand hidden-phone" href="#">Mariage Anne-Gaëlle et Samy</a>
<ul class="nav pull-right">
<li class="menu_entry"><a href="#after">Alors c'était comment?</a></li>
<li class="menu_entry"><a href="#nowwhat">Et maintenant?</a></li>
<li class="divider-vertical"></li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
Ok mais moi je veux
<b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li class="menu_entry">
<a href="#photos">... voir des photos!</a>
</li>
<li class="menu_entry">
<a href="#voyage">... en savoir plus sur le voyage!</a>
</li>
<li class="menu_entry">
<a href="#jeu">... savoir qui a gagné au jeu?</a>
</li>
</ul>
</li>
</ul>
</div>
</div>
<div id="content">
<div id="main">
<div class="block" id="after" >
<div >
<h1>Wow!</h1>
<p>Il en aura fallu des choses pour arriver à ce que vous voyez sur la gauche: du temps, de l'énergie, des décisions, beaucoup d'aide de la part d'une quantité de monde que Cecil B. DeMille n'aurait pas renié, et une sacrée dose de chance à certains moments.</p>
<p>Le 21 septembre a brillé comme un phare dans nos esprits pendant si longtemps que nous avons l'impression qu'il est encore là, des sons, des images, des moments qui s'atténuent doucement mais qui n'ont besoin que d'un rien pour se réveiller.</p>
<p>Mais le cap est donné, nous sommes partis pour plein d'autres 21 septembre.</p>
</div>
</div>
<div class="block" id="nowwhat" >
<div >
<h1>Et maintenant?...</h1>
<p>La saison des brumes et des maturations succulentes a commencé, et nous sommes revenus sous un ciel qui entend bien forcer le couvre-feu à l'aide de son armée de nuages.</p>
<p>De notre coté il y a les derniers grains de sable à secouer de nos chaussures de marche. Les costumes ont été pliés soigneusement dans leurs housses et un carton marqué du nom de code <strong>"Projet Marianne Jatma"</strong> se remplit des souvenirs, des notes et de tout ce que nous avons tourné et retourné dans nos têtes et nos doigts.</p>
<p>Il y a ces deux petits garçons qui méritent bien de souffler un coup maintenant que papa et maman sont plus disponibles, et qui réclament le temps et l'espace qu'ils ont bien voulu nous laisser.</p>
<p>Alors pour l'instant nous allons ranger, classer, organiser... avant de penser à la prochaine grande aventure! Et nous lisons toujours les messages envoyés sur <a href="mailto:[email protected]">[email protected]</a> donc n'hésitez pas à nous écrire.</p>
</div>
</div>
<div class="block" id="photos" >
<div >
<h1>Les photos, les photos!</h1>
<p>Suite à la rapidité de nombre de personnes, voici <a href="http://images.beaudoux.net/mariage/le-mariage-lui-meme/">les photos du mariage.</a></p>
<p>Si vous êtes curieux de savoir où nous sommes allés, voici <a href="http://images.beaudoux.net/mariage/ouzbekistan/">les photos d'Ouzbékistan.</a></p>
<p>Enfin nous n'avons pas forcément lancé l'appel à tout le monde, mais si vous avez des photos que vous voulez nous transmettre n'hésitez pas à nous contacter sur <a href="mailto:[email protected]">[email protected]</a> pour qu'on s'affaire à les récupérer!
</div>
</div>
<div class="block" id="voyage">
<div >
<h2>Et ce voyage?</h2>
<p>L'Ouzbekistan est un pays très surprenant pour nous; nous n'en connaissions ni la langue, ni l'écriture ( qui est très très variée puisqu'elle peut mélagner russe, latin, arabe... ) aussi le dépaysement était intégral. C'est aussi la première fois que nous goûtions au mélange d'une culture arabe et soviétique. Surprenant. Vous pouvez avoir un aperçu de ce que nous avons vu et visité avec <a href="http://images.beaudoux.net/mariage/ouzbekistan/">les photos</a>.</p>
<p><strong>Tashkent</strong> la capitale, a été détruite par un séisme en 1966. Sa reconstruction a permis de créer de larges avenues hyper modernes; il faut chercher un peu pour voir autre chose que l'image de ville dynamique et grandiose recherchée par le pouvoir.</p>
<p><strong>Khiva</strong> est une ville musée relativement récente (18ème siècle) qui est restée bien conservée; extrèmement décorée on a l'impression qu'elle cherchait à impressionner à tout prix. Nous y sommes tombés amoureux du minaret Islam Hoja.</p>
<p><strong>Boukhara</strong> nous a surpris; il s'agit de la plus vieille ville; les techniques de construction de l'époque favorisaient l'usage de la brique, ce qui donne aux couchers de soleil une couleur de miel qui rend toutes les vues de la mosquée Qalon magnifiques.</p>
<p><strong>Samarkande</strong> était le moteur de notre décision de partir en Ouzbékistan; siège du conquérant Tamerlan, elle a gardé une imposante collection de medersas et mosquées qui font réaliser la puissance que pouvait déployer l'Asie Centrale.</p>
<p>Nous aimerions vous raconter tout par le détail mais ce sera pour la prochaine fois ou nous nous voyons! En attendant encore merci à vous!</p>
<p><img src="img/Hansoloprofilethumb.jpg" /></p>
</div>
</div>
<div class="block" id="jeu" >
<div>
<h2>Le jeu a donné quoi?</h2>
<p>Pour le dire simplement, lorsqu'on vous annonce que les 200 cartes et quelques que vous aviez réussi à trouver ont été jouées dans leur intégralité après 45 minutes, et que les autres subissent le même sort, on peut se dire qu'il a bien marché. La prochaine fois que nous organisons quelque chose du genre, nous multiplierons par dix les quantités :)</p>
<p>A l'origine le jeu devait être ce qu'on appelle un "Killer" mais nous avons tenté de faire en sorte que le ton soit adouci par rapport aux versions classiques</p>
<p>En tous cas, les cartes ont montré que les invités étaient plutôt joueurs, débrouillards, et qu'ils avaient parfois pas mal d'imagination. Les cartes blanches qui avaient été placées dans le tas pour dépanner en dernier recours ont permis à certain d'entre vous d'exprimer leurs facettes parfois cachées.</p>
<p>Il y a eu les cartes faciles, histoire de se mettre en jambes.<br/><img src="img/killer/facile.jpg"/></br> Vous remarquerez l'honnèteté du joueur qui ne se donne qu'un point.</p>
<p>Il y a aussi les cartes philosophiques, qui amènent à se poser des questions sur le jeu et l'hubris qu'il déclenche en nous.</br><img src="img/killer/talion.jpg" /></p>
<p>Puis dans le bizarre, il y a les cartes carrément déjantées:<br/>
<img src="img/killer/impossible.jpg"/>
<br/>
<img src="img/killer/impossible2.jpg"/>
</p>
<p>Voire des cartes cruelles envers le marié :'( (et en plus elle a été réalisée!!)<br/><img src="img/killer/panardsblesses.jpg"/></p>
<p>Enfin, certaines personnes ont utilisé les cartes pour éviter d'avoir à se déplacer; ils abusent ainsi de ceux qui veulent jouer, autant dire que c'est approuvé:
<img src="img/killer/autravail.jpg"/></p>
<p><br/></p>
<p>Et qui a gagné pour de bon?</p>
<p>Voici les personnes qui se démarquent particulièrement:</p>
<ul>
<li><strong>Candice</strong> a dominé la partie, tant en nombre de missions réalisées que de cartes écrites avec un nombre de points supérieur à 200. Dès que la catégorie "stratosphérique" existe nous l'inscrivons dedans!</li>
<li><strong>Noël</strong> est le premier du véritable peloton avec 89 points. Certaines cartes réalisées relevaient dans l'esprit de ceux qui les écrivaient de l'impossible et on se demande comment il a pu réussir, mais félicitations!</li>
<li><strong>Sarah</strong> talonne avec 85 points au compteur! Un résultat superbe et tout en discrétion puisque les missions ont été très ciblées!</li>
<li>Les points de <strong>Marion</strong> auraient dû être doublés puisque chaque mission était réalisée par deux personnes, ce qui lui aurait permis de prendre la première place avec ses 56.66 points.</li>
<li><strong>Axelle</strong> est la plus jeune joueuse mais déjà une challenger intimidante avec 39 points! Portée par une solide collaboration et un air mignon, elle sera à surveiller dans les prochaines éditions</li>
</ul>
<br/>
<p>Je crois en avoir fini. Si vous voulez votre score exact, contactez nous à <a href="mailto:[email protected]">[email protected]</a>. Et si l'envie vous prend de reprendre le jeu et ses cartes pour le réadapter à votre goût, faites de même!</p>
</div>
</div>
</div>
<div id="company" class="hidden-phone">
<div id="after_illustration" class="illustration">
</div>
<div id="nowwhat_illustration" class="illustration">
</div>
<div id="photos_illustration" class="illustration">
<span class="legend">Le mariage (pas une allégorie) avec Matthias B.</span>
</div>
<div id="voyage_illustration" class="illustration map">
</div>
<div id="jeu_illustration" class="illustration">
</div>
<div id="secret_illustration" class="illustration">
</div>
</div>
</div>
</div>
<!-- Le javascript
================================================== -->
<script src="./bootstrap/js/jquery.js" type="text/javascript"></script> <!-- jquery from bootstrap -->
<script src="./script/konami.1.4.1.pack.js"></script>
<script src="./bootstrap/js/bootstrap.min.js"></script>
<script src="./script/jamminafter.js"></script>
<!-- Piwik -->
<script type="text/javascript">
var _paq = _paq || [];
_paq.push(["trackPageView"]);
_paq.push(["enableLinkTracking"]);
(function() {
var u=(("https:" == document.location.protocol) ? "https" : "http") + "://stats.beaudoux.net/";
_paq.push(["setTrackerUrl", u+"piwik.php"]);
_paq.push(["setSiteId", "1"]);
var d=document, g=d.createElement("script"), s=d.getElementsByTagName("script")[0]; g.type="text/javascript";
g.defer=true; g.async=true; g.src=u+"piwik.js"; s.parentNode.insertBefore(g,s);
})();
function toggleVideo(state) {
// if state == 'hide', hide. Else: show video
var div = document.getElementById("hello_there");
var iframe = div.getElementsByTagName("iframe")[0].contentWindow;
div.style.display = state == 'hide' ? 'none' : '';
func = state == 'hide' ? 'pauseVideo' : 'playVideo';
iframe.postMessage('{"event":"command","func":"' + func + '","args":""}', '*');
}
var easter_egg = new Konami(function() {
$('#hello_there').modal('show');
$("#surprise")[0].src = "http://www.youtube.com/embed/2u7XysaEVBs?rel=0&wmode=transparent&enablejsapi=1&autoplay=1";
});
/*$('#hello_there').on('show', function () {
toggleVideo("");
})
$('#hello_there').on('hidden', function () {
toggleVideo("hide");
})*/
</script>
<!-- Piwik Image Tracker -->
<noscript><img src="http://stats.beaudoux.net/piwik.php?idsite=1&rec=1" style="border:0" alt="" /></noscript>
<!-- End Piwik -->
<!-- End Piwik Code -->
<div class="modal fade hide" id="hello_there" style="width:670px;">
<div class="modal-header">
<a class="close" data-dismiss="modal">×</a>
<h3>Oh! Un code secret!</h3>
</div>
<div class="modal-body">
<p>
<iframe id="surprise" width="640" height="360" src="" frameborder="0" allowfullscreen></iframe>
</p>
</div>
</div>
</body>
</html>