-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
310 lines (279 loc) · 18.4 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
302
303
304
305
306
307
308
309
310
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<link href="https://fonts.googleapis.com/css?family=Raleway:100,300,400,500,700,900" rel="stylesheet">
<title>Projet1 POO2 LI3 GL</title>
<!--
Elegance Template
https://templatemo.com/tm-528-elegance
-->
<!-- Additional CSS Files -->
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/font-awesome.css">
<link rel="stylesheet" type="text/css" href="css/fullpage.min.css">
<link rel="stylesheet" type="text/css" href="css/owl.carousel.css">
<link rel="stylesheet" href="css/animate.css">
<link rel="stylesheet" href="css/templatemo-style.css">
<link rel="stylesheet" href="css/responsive.css">
</head>
<body>
<div id="video">
<div class="preloader">
<div class="preloader-bounce">
<span></span>
<span></span>
<span></span>
</div>
</div>
<header id="header">
<div class="container-fluid">
<div class="navbar">
<a href="#" id="logo" title="Projet1-POO2-GL-2021">
Projet1 POO2 GL 2021
</a>
</div>
</div>
</header>
<video autoplay muted loop id="myVideo">
<source src="images/facade.mp4" type="video/mp4">
</video>
<div id="fullpage" class="fullpage-default">
<div class="section animated-row" data-section="slide01">
<div class="section-inner">
<div class="welcome-box">
<span class="welcome-first animate" data-animate="fadeInUp">Bienvenu au</span>
<h1 class="welcome-title animate" data-animate="fadeInUp">Projet1 POO2 GL 2021</h1>
<p class="animate" data-animate="fadeInUp">Il s’agira de construire une bibliothèque de fonction, qui permettra le dessin de figures en utilisant l’outil turtle de python.</p>
<div class="scroll-down next-section animate data-animate="fadeInUp><img src="images/mouse-scroll.png" alt=""><span>Defiler</span></div>
</div>
</div>
</div>
<div class="section animated-row" data-section="slide06">
<div class="section-inner">
<div class="row justify-content-center">
<div class="col-md-8 wide-col-laptop">
<div class="title-block animate" data-animate="fadeInUp">
<span>Bibliotheque</span>
<h2>genieCivilOuvrage2D.py</h2>
</div>
<div class="gallery-section">
<div class="gallery-list owl-carousel">
<div class="item animate" data-animate="fadeInUp">
<div class="portfolio-item">
<div class="thumb">
<img src="images/cercle.png" alt="">
</div>
<div class="thumb-inner animate" data-animate="fadeInUp">
<h4>Cercle</h4>
<p>Cette methode dessine un cercle en utilisant la methode circle de la bibliotheque turtle. Elle prend en parametre le rayon du cercle a tracer en pixel, la couleur qui est optionnelle.</p>
</div>
</div>
</div>
<div class="item animate" data-animate="fadeInUp">
<div class="portfolio-item">
<div class="thumb">
<img src="images/demiCercle.png" alt="">
</div>
<div class="thumb-inner animate" data-animate="fadeInUp">
<h4>Demi Cercle</h4>
<p>Cette methode va nous permettre de dessiner un demi-cercle avec toujours la methode circle de turtle, mais dans ce cas nous allons renseigner l'angle d'arret. Elle prend un parametre obligatoire, le rayon et un optionnel, la couleur.</p>
</div>
</div>
</div>
<div class="item animate" data-animate="fadeInUp">
<div class="portfolio-item">
<div class="thumb">
<img src="images/carre.png" alt="">
</div>
<div class="thumb-inner animate" data-animate="fadeInUp">
<h4>Carre</h4>
<p>Cette methode va nous permettre de dessiner un carre avec turtle en utilisant une boucle for. Elle prend un parametre obligatoire, cote du carre en pixel et deux optionnels, la couleur et le remplissage ici remplis.</p>
</div>
</div>
</div>
<div class="item animate" data-animate="fadeInUp">
<div class="portfolio-item">
<div class="thumb">
<img src="images/triangle.png" alt="">
</div>
<div class="thumb-inner animate" data-animate="fadeInUp">
<h4>Triangle</h4>
<p>Cette methode va nous permettre de dessiner un triangle avec turtle en utilisant le théorème d’Al Kashi!. Elle prend trois parametres obligatoires, coteA, coteB, coteC qui represente la mesure des trois cotes en pixel et deux optionnels, la couleur et le remplissage ici couleur1.</p>
</div>
</div>
</div>
<div class="item animate" data-animate="fadeInUp">
<div class="portfolio-item">
<div class="thumb">
<img src="images/rectangle.png" alt="">
</div>
<div class="thumb-inner animate" data-animate="fadeInUp">
<h4>Rectangle</h4>
<p>Cette methode va nous permettre de dessiner un rectangle avec turtle en utilisant une boucle for. Elle prend deux parametres obligatoires, longueur, largeur en pixel et deux optionnels, la couleur du contour et le remplissage ici couleur2.</p>
</div>
</div>
</div>
<div class="item animate" data-animate="fadeInUp">
<div class="portfolio-item">
<div class="thumb">
<img src="images/polygone.png" alt="">
</div>
<div class="thumb-inner animate" data-animate="fadeInUp">
<h4>Polygone</h4>
<p>Cette methode va nous permettre de dessiner un polygone avec turtle en utilisant une boucle for. Elle prend deux parametres obligatoires, nbrCote, cote1 et deux optionnels, cote2 et cote3.</p>
</div>
</div>
</div>
<div class="item animate" data-animate="fadeInUp">
<div class="portfolio-item">
<div class="thumb">
<img src="images/trapez.png" alt="">
</div>
<div class="thumb-inner animate" data-animate="fadeInUp">
<h4>Trapeze</h4>
<p>Cette methode va nous permettre de dessiner un tapeze avec turtle en utilisant des methodes telles que forward et left. Elle prend 4 parametres obligatoires, base1, base2, coteD, coteG et deux optionnels, couleur et couleur2.</p>
</div>
</div>
</div>
<div class="item animate" data-animate="fadeInUp">
<div class="portfolio-item">
<div class="thumb">
<img src="images/losange.png" alt="">
</div>
<div class="thumb-inner animate" data-animate="fadeInUp">
<h4>Losange</h4>
<p>Cette methode va nous permettre de dessiner un losange avec turtle en utilisant des methodes telles que forward qui nous permet d'avancer et right qui nous permet de tourner a l'angle voulu dans une boucle for. Elle prend un parametre obligatoires, cote et deux optionnels, couleur et couleur2 pour le contour et le remplissage.</p>
</div>
</div>
</div>
<div class="item animate" data-animate="fadeInUp">
<div class="portfolio-item">
<div class="thumb">
<img src="images/elypse.png" alt="">
</div>
<div class="thumb-inner animate" data-animate="fadeInUp">
<h4>Elypse</h4>
<p>Cette methode va nous permettre de dessiner un elypse avec turtle en utilisant des methodes telles que forward qui nous permet d'avancer, left qui nous permet de tourner a gauche selon l'angle voulu, circle et une boucle for. Elle prend un parametre obligatoires, rayon et un optionnel, couleur.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="section animated-row" data-section="slide02">
<div class="section-inner">
<div class="about-section">
<div class="row justify-content-center">
<div class="col-lg-8 wide-col-laptop">
<div class="row">
<div class="col-md-6">
<div class="about-contentbox">
<div class="animate" data-animate="fadeInUp">
<span>Fichier</span>
<h2>pont.py</h2>
<p>Dans ce fichier on a dessine un pont grace aux bibliotheques genieCivilOuvrage2D et turtle.</p>
</div>
</div>
</div>
<div class="col-md-6">
<figure class="about-img animate" data-animate="fadeInUp"><img src="images/pont.png" class="rounded" alt=""></figure>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="section animated-row" data-section="slide02">
<div class="section-inner">
<div class="about-section">
<div class="row justify-content-center">
<div class="col-lg-8 wide-col-laptop">
<div class="row">
<div class="col-md-6">
<div class="about-contentbox">
<div class="animate" data-animate="fadeInUp">
<span>Fichier</span>
<h2>facade.py</h2>
<p>Dans ce fichier on a dessine la facade d'un maison grace aux bibliotheques genieCivilOuvrage2D et turtle.</p>
</div>
</div>
</div>
<div class="col-md-6">
<figure class="about-img animate" data-animate="fadeInUp"><img src="images/facade.png" class="rounded" alt=""></figure>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="section animated-row" data-section="slide05">
<div class="section-inner">
<div class="row justify-content-center">
<div class="col-md-8 wide-col-laptop">
<div class="title-block animate" data-animate="fadeInUp">
<span>Realise</span>
<h2>Par</h2>
</div>
<div class="col-md-8 offset-md-2">
<div class="testimonials-section">
<div class="testimonials-slider owl-carousel">
<div class="item animate" data-animate="fadeInUp">
<div class="testimonial-item">
<div class="client-row">
<img src="images/profil1.JPG" class="rounded-circle" alt="profile 1">
</div>
<div class="testimonial-content">
<h4>Makhtar SARR</h4>
<p>"Ce projet nous a permis de nous familiariser à la bibliothèque Turtle. De plus nous avons eu l'occasion d'appliquer les notions apprises en classe sur la modularité"</p>
<span>Etudiant en Genie Logiciel</span>
</div>
</div>
</div>
<div class="item animate" data-animate="fadeInUp">
<div class="testimonial-item">
<div class="client-row">
<img src="images/profil2.jpg" class="rounded-circle" alt="profile 2">
</div>
<div class="testimonial-content">
<h4>Fatou DIOUF</h4>
<p>"Dans ce projet nous avons eu l'opportunité de découvrir d'autres connaissances en python. En plus on a eu une expérience de travailler à distance dans un même projet grace a github."</p>
<span>Etudiante en Genie Logiciel</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="social-icons">
<div class="text-right">
<ul class="social-icons">
<li><a href="https://github.com/makhtar-sarr/Projet1-POO2-GL-2021.git" title="Voir le projet complet"><i class="fa fa-github"></i></a></li>
<li><a href="https://github.com/makhtar-sarr/Projet1-POO2-GL-2021/blob/main/Projet1%20POO2%20LI3%20GL.pdf" title="voir la documentation"><i class="fa fa-book"></i></a></li>
</ul>
</div>
</div>
</div>
<script src="js/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/fullpage.min.js"></script>
<script src="js/scrolloverflow.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/jquery.inview.min.js"></script>
<script src="js/form.js"></script>
<script src="js/custom.js"></script>
</body>
</html>