-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
357 lines (297 loc) · 13.6 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
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
<!DOCTYPE HTML>
<html>
<head>
<title>Jad Haddad</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<meta name="description" content="Personal Website of Jad Haddad." />
<link rel="stylesheet" href="assets/css/main.css" />
<link rel="icon" type="image/ico" href="images/title.svg" />
<noscript>
<link rel="stylesheet" href="assets/css/noscript.css" /></noscript>
</head>
<body class="is-preload">
<!-- Wrapper -->
<div id="wrapper">
<!-- Header -->
<header id="header">
<div class="logo">
<span class="icon fa-user"></span>
</div>
<div class="content">
<div class="inner">
<h1>Jad Haddad</h1>
<p>BASc in Computer Engineering<br />
University of Ottawa</p>
<!-- TEST ICONS HOME PAGE -->
<ul class="icons">
<li><a target="_blank" rel="noopener noreferrer" href="https://github.com/jadhaddad01"
class="icon brands fa-github"><span class="label">Github</span></a></li>
<li><a href="mailto:jadmail01@gmail.com" class="fas fa-envelope"><span class="label"></span></a>
</li>
<li><a href="private.html" class="fa fa-key"><span class="label"></span></a></li>
</ul>
</div>
</div>
<nav>
<ul>
<li><a href="#intro">Intro</a></li>
<li><a href="#projects">Projects</a></li>
<li><a href="#skills">Skills</a></li>
<!-- Old Gallery No more needed -->
<!-- <li><a href="gallery.html">Gallery</a></li> -->
<li><a href="#contact">Contact</a></li>
</ul>
</nav>
</header>
<!-- Main -->
<div id="main">
<!-- Intro -->
<article id="intro">
<h2 class="major">Intro</h2>
<p>I am currently enrolled as a 4th year student in uOttawa pursuing an undergraduate degree in Computer
Engineering. I am interested in the Software Development field and am seeking exciting opportunities
related to the same.</p>
<p>Doing projects in my free time gave me an understanding of how software works in the real world. I am
always curious about things and enjoy learning. I like to solve problems and fix errors. I am a
detail orientated person and I keep my goals and tasks organized to maintain productivity.</p>
<p>I believe that the skills that I have attained from the dynamic environment and competitive
university life define me and I am looking forward to implementing and polishing them in any
opportunity that I receive. </p>
<p>______________________________________________________________________</p>
<ul class="icons">
<li><a target="_blank" rel="noopener noreferrer" href="https://github.com/jadhaddad01"
class="icon brands fa-github"><span class="label">Github</span></a></li>
<li><a href="mailto:jadmail01@gmail.com" class="fas fa-envelope"><span class="label"></span></a>
</li>
<li><a href="private.html" class="fa fa-key"><span class="label"></span></a></li>
</ul>
</article>
<!-- Skills UNDER CONSTRUCTION -->
<article id="skills">
<h2 class="major">PAGE UNDER CONSTRUCTION</h2>
<span class="image main"><img src="images/under_construction.png" alt="" /></span>
<p>Page will be up in a few days!</p>
</article>
<!-- Work -->
<article id="projects">
<h2 class="major">Projects</h2>
<h3>Filter by: </h3>
<ul class="actions">
<li><a href="#skills" class="button small primary">All</a></li>
<li><a href="#skills" class="button small">Robotics</a></li>
<li><a href="#skills" class="button small">Software Dev</a></li>
<li><a href="#skills" class="button small">App Dev</a></li>
</ul>
<p>______________________________________________________________________</p>
<h3 style="text-transform: none;"><a href="#pump">ARTIFICIAL ARTERIAL PUMP</a> | <span class="smaller">Arduino</span></h3>
<span class="image main"><a href="#pump"><img src="images/Pumppic.jpeg" alt="" /></a></span>
<ul class="actions">
<li><a href="#pump" class="button primary">Details</a></li>
<li><a target="_blank" rel="noopener noreferrer" href="pdf/Pompe Artérielle.pdf"
class="button icon solid fa-download">Report (French)</a></li>
</ul>
<p>______________________________________________________________________</p>
<h3 style="text-transform: none;"><a href="#javaDataBase">OFFLINE DATABASE</a> | <span class="smaller">Java</span></h3>
<span class="image main"><a href="#javaDataBase"><img src="images/thumbvideodatabase.png" alt="" /></a></span>
<ul class="actions">
<li><a href="#javaDataBase" class="button primary">Details</a></li>
<li><a target="_blank" rel="noopener noreferrer"
href="https://github.com/jadhaddad01/offlineJavaDataBase"
class="button icon brands fa-github">Code</a></li>
</ul>
<p>______________________________________________________________________</p>
<h3 style="text-transform: none;"><a href="#work2">COMING SOON</a></h3>
<span class="image main"><a href="#work2"><img src="images/soon.png" alt="" /></a></span>
<p>______________________________________________________________________</p>
<ul class="icons">
<li><a target="_blank" rel="noopener noreferrer" href="https://github.com/jadhaddad01"
class="icon brands fa-github"><span class="label">Github</span></a></li>
<li><a href="mailto:jadmail01@gmail.com" class="fas fa-envelope"><span class="label"></span></a>
</li>
<li><a href="private.html" class="fa fa-key"><span class="label"></span></a></li>
</ul>
</article>
<article id="pump">
<!--
<ul class="back">
<li><a href="#projects" class="fa fa-angle-left" ><span class="label"></span></a></li>
</ul>
-->
<h3><span class="smaller">January 2019 - April 2019</span></h3>
<h3 style="text-transform: none;">ARTIFICIAL ARTERIAL PUMP | <a target="_blank"
rel="noopener noreferrer" href="https://makerepo.com/jhadd078/pompe-arterielle-fc5"><span
class="smaller">Project Website</span></a></h3>
<span class="image main"><img src="images/Pumppic.jpeg" alt="" /></span>
<ul class="actions">
<li><a target="_blank" rel="noopener noreferrer" href="pdf/Pompe Artérielle.pdf"
class="button icon solid fa-download">Report (French)</a></li>
</ul>
<h3>Summary</h3>
<p>My team was approached by the Ottawa Police, specifically the Forensic Department through Sergeant
Ugo Garneau, to create a device for reproducing patterns of propelled blood from severed arteries.
Furthermore, the customer was very specific about what he was looking for in a prototype that
occupies such a role in his daily tasks.</p>
<p>In particular, one can consider the adaptation of many different diameters of tubes as well as
multiple cuts, control of rhythm and multiple blood pressures to reproduce crime scenes and retrace
the steps of the individuals involved. In such situations one resorts to often considered aberrant
values of blood pressure and rhythm due to a series of events that would have shocked the human
body. However, the device will replace the old police technique with a tube and a sigh that will
improve the accuracy and efficiency of blood patterns reproduced.</p>
<p>When our team presented this project in front of students and judges at the Design Day 2019 in the
University of Ottawa, we were very proud and honored to have won the award for the best project in
the same category.</p>
<h3>Materials</h3>
<p>Arduino C, 2 potentiometers, LCD screen, On/Off switch, 250ml bottle, 12V 2200mAh battery, Diaphragm
pump, electrical wire and different diameter flexible tubes with different size cuts.</p>
<h3>Worked With</h3>
<ul class="ch-grid">
<li>
<div class="ch-item ch-img-1">
<div class="ch-info">
<a target="_blank" rel="noopener noreferrer"
href="https://www.linkedin.com/in/mohamed-yassine-bouhamidi/">
<h3>Mohamed Yassine Bouhamidi</h3>
</a>
<p>Electronics</a></p>
</div>
</div>
</li>
<li>
<div class="ch-item ch-img-2">
<div class="ch-info">
<h3>Ahmed Oueslati</h3>
<p>Electronics</a></p>
</div>
</div>
</li>
<li>
<div class="ch-item ch-img-3">
<div class="ch-info">
<h3>Mathieu Lacelle</h3>
<p>Report</a></p>
</div>
</div>
</li>
<li>
<div class="ch-item ch-img-4">
<div class="ch-info">
<a target="_blank" rel="noopener noreferrer"
href="https://www.linkedin.com/in/marc-antoine-mayer-255972193/">
<h3>Marc-Antoine Mayer</h3>
</a>
<p>Fluids</a></p>
</div>
</div>
</li>
</ul>
<p>______________________________________________________________________</p>
<ul class="icons">
<li><a target="_blank" rel="noopener noreferrer" href="https://github.com/jadhaddad01"
class="icon brands fa-github"><span class="label">Github</span></a></li>
<li><a href="mailto:jadmail01@gmail.com" class="fas fa-envelope"><span class="label"></span></a>
</li>
<li><a href="private.html" class="fa fa-key"><span class="label"></span></a></li>
</ul>
</article>
<article id="javaDataBase">
<h3><span class="smaller">June 2020 – August 2020</span></h3>
<h3 style="text-transform: none;">OFFLINE DATABASE | <span class="smaller">Java</span></h3>
<video class="image main" poster="images/thumbvideodatabase.png" controls>
<source src="images/Tutorial.mp4" type="video/mp4">
</video>
<ul class="actions">
<li><a target="_blank" rel="noopener noreferrer"
href="https://github.com/jadhaddad01/offlineJavaDataBase"
class="button icon brands fa-github">Code</a></li>
</ul>
<p>This project was created using only the Java language. <br>
Using the <a target="_blank" rel="noopener noreferrer"
href="https://en.wikipedia.org/wiki/Caesar_cipher">Ceasar Shift Cypher</a> allows for the secure
storage of data and the creation of a password that
would eventually decrypt the data.
The data is comprised of people's personal information (name, phone number, address, etc.).
Prevelent methods include but are not limited to: printing the entire decrypted list of people,
adding people to the list, searching for certain people in the list using known information, and
changing
the password.</p>
<p>______________________________________________________________________</p>
<ul class="icons">
<li><a target="_blank" rel="noopener noreferrer" href="https://github.com/jadhaddad01"
class="icon brands fa-github"><span class="label">Github</span></a></li>
<li><a href="mailto:jadmail01@gmail.com" class="fas fa-envelope"><span class="label"></span></a>
</li>
<li><a href="private.html" class="fa fa-key"><span class="label"></span></a></li>
</ul>
</article>
<!-- Contact -->
<article id="contact">
<h2 class="major">Contact</h2>
<form method="post" role="form" action="https://formspree.io/jadmail01@gmail.com" method="post">
<input type="hidden" name="_next" value="assets/success.html">
<input type="text" name="_format" value="plain" style="display:none">
<div class="fields">
<div class="field half">
<label for="name" class="required">Name</label>
<input type="text" class="form-control" id="name" name="name" required="required">
</div>
<div class="field half">
<label for="email" class="required">Email</label>
<input type="email" class="form-control" id="email" name="email" required="required">
</div>
<div class="field">
<label for="message" class="required">Message</label>
<textarea rows="4" class="form-control" id="message" name="message"
required="required"></textarea>
</div>
<div class="field" style="height: 0; overflow: hidden;">
<label for="antispam">Please leave this field blank (if it's not blank your message will be
marked as spam!):</label>
<input type="text" class="form-control" id="antispam" name="_gotcha">
</div>
</div>
<ul class="actions">
<li><button type="submit" id="submit" class="primary" disabled="disabled">Send Message</button>
</li>
<li><input type="reset" value="Reset" /></li>
</ul>
</form>
<script>
var submitButton = document.getElementById("submit");
document.addEventListener("DOMContentLoaded", function () {
$(submit).prop("disabled", false);
$("#contact_form").submit(function () {
$(submit).prop("disabled", true);
$(submit).text("Sending...");
});
window.addEventListener("pageshow", function () {
submit.disabled = false;
submit.textContent = "Send Message";
});
});
</script>
<p>______________________________________________________________________</p>
<ul class="icons">
<li><a target="_blank" rel="noopener noreferrer" href="https://github.com/jadhaddad01"
class="icon brands fa-github"><span class="label">Github</span></a></li>
<li><a href="mailto:jadmail01@gmail.com" class="fas fa-envelope"><span class="label"></span></a>
</li>
<li><a href="private.html" class="fa fa-key"><span class="label"></span></a></li>
</ul>
</article>
</div>
<!-- Footer -->
<footer id="footer">
<p class="copyright">© Jad Haddad 2020.</p>
</footer>
</div>
<!-- BG -->
<div id="bg"></div>
<!-- Scripts -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/browser.min.js"></script>
<script src="assets/js/breakpoints.min.js"></script>
<script src="assets/js/util.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>