-
Notifications
You must be signed in to change notification settings - Fork 0
/
Portfolio.html
361 lines (348 loc) · 13.4 KB
/
Portfolio.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
358
359
360
361
<!DOCTYPE html>
<html>
<head>
<link href="StyleSheets/ResumeStyleSheetBody.css" rel="stylesheet" type="text/css">
<link href="StyleSheets/ResumeStyleSheet.css" rel="stylesheet" type="text/css">
<title>My Work</title>
</head>
<link rel="shortcut icon" href="Icons/web-ico-infi.png">
<body>
<!--Top Menu -->
<div>
<table width=100%>
<td width =30%>
<div align = "left" class="c4Color noDecoration topName">
Pavithran Pathmarajah
</div>
</td>
<td width = 70%>
<div align = "right" class="c3Color noDecoration topLinks fontSmall">
<a class="topLinksMakeHeight noDecoration c1Color"></a>
<a class="topLinks noDecoration c3Color" href="index.html">Home</a>
<a class="topLinksSelected noDecoration c4Color">Portfolio</a>
<a class="topLinks noDecoration c3Color" href="CurrentWork.html">Current Work</a>
<a class="topLinks noDecoration c3Color" href="Resume.html">Resume</a>
<a class="topLinks noDecoration c3Color" href="Contact.html">Contact</a>
</div>
</td>
</table>
</div>
<br>
<!--NOTES-->
<!--1x1 images = 80%--->
<!--9x16 images = 50%-->
<!--Weather Station Analyzer-->
<div class="c2Bg">
<br>
<table width=90% align="center">
<td width=30% align="center">
<img src="Images/Weather.png" width="80%" align="center">
</td>
<td width=70%>
<a name="PersonalWeb"class="c4Color headerSmall">
Weather Station Analyzer
</a>
<br>
<p class="c3Color fontMedium" style="line-height: 20%;">
Language: HTML; CSS; Javascript; Ruby;
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Api: D3; Sinatra;
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Created: 02/22/16
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Time Span: 2 Months
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Team Size: 4
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Reason: School - Data Analysis Project
</p>
<p></p>
<a class="c3Color">
This application's intended purpose is to identify weather stations which are not required and may be relocated. The application does this by first placing all stations in a un-directed edge weighted graph, After this the graph is converted into a minimum spanning tree while only keeping edges between stations whom's weather data is accurate to one another's within the user's specified tolerances. At this point the nodes with the greatest number of edges is removed, which leaves one of three node types. The first are stations which cannot be used to predict other stations, the seconds stations used to predict stations, and the third stations predicted. At this point the program then checks if the new layout is still accurate within user tolerances and to do this the program checks the layout over two additional years. At this point all data processing has been completed where it is put into a Json file and is displayed for the user.
<br>
<br>
On the technical side, the program uses a Model View Controller design. The Model being the backend which is built in ruby and harnesses an SQLite3 database for the data storage and manipulation. The Controller is the server which uses the Sinatra API to effectively connect the Front-end to the Back-end. The View is written in HTML/CSS/Java-Script, and uses an electron wrapper to allow it to act as a standalone application.
<br>
<br>
<a style="color: red;">
Working out a few final bugs, GitHub will be available soon <!--Bootstrap 3? -->
</a>
</a>
</td>
</table>
<br>
</div>
<div class="c5Bg" align="center">
<a class="noDecoration c3Color " href="https://drive.google.com/file/d/0Bw2B-7OLfsDAY1ZyeThrNmpmZFk/view?usp=sharing">
Available via Google Drive <img class="iconAlign iconFontSmall padding5" src="Icons/drive.png">
</a>
<br>
</div>
<Br>
<br>
<!--Personal WebSite-->
<div class="c2Bg">
<br>
<table width=90% align="center">
<td width=30% align="center">
<img src="Images/Website.png" width="80%" align="center">
</td>
<td width=70%>
<a name="PersonalWeb"class="c4Color headerSmall">
Personal WebSite
</a>
<br>
<p class="c3Color fontMedium" style="line-height: 20%;">
Language: HTML5; CSS; Javascript
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Created: 01/10/16
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Time Span: OnGoing
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Team Size: 1
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Reason: Display CV
</p>
<p></p>
<a class="c3Color">
This is my personal website. Hosted via GitHub and with a domain name provided by name cheap. I created this website because I wanted a way to showcase my CV easily for everyone to see, and so I can keep track of what I've done. I dabbled with WordPress, which boasts an intuitive interface, but I found it cumbersome and was unable to find the layout that I desired. At this point I decided since I knew enough about HTML and CSS, from when I played with it in high school, I would construct my own site from scratch. I took out my pencil and paper drew out a design, chose a colour palette, and got to work.
</a>
<br>
<br>
<a style="color: red;">
Currently working on new website with updated colour scheme and Responsive Design <!--Bootstrap 3? -->
</a>
</td>
</table>
<br>
</div>
<div class="c5Bg" align="center">
<a class="noDecoration c3Color " href="https://github.com/awesomePavi/awesomePavi.github.io">
Available on GitHub <img class="iconAlign iconFontSmall padding5" src="Icons/git.png">
</a>
<a class="noDecoration c3Color " href="Sources.html">
| Sources <img class="iconAlign iconFontSmall padding5" src="Icons/Resources.png">
</a>
<br>
</div>
<Br>
<br>
<!--About Canada-->
<div class="c2Bg">
<br>
<table width=90% align="center">
<td width=30% align="center">
<img src="Images/WelclomeToCanada.png" width="50%" align="center">
</td>
<td width=70%>
<a name="AboutCanada" class="c4Color headerSmall">
Welcome To Canada
</a>
<br>
<p class="c3Color fontMedium" style="line-height: 20%;">
Language: Java (Android)
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Created: 27/11/15
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Time Span: 34.5 Hours
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Team Size: 4
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Hackathon: HackWestern 2
</p>
<p class="c3Color fontSmall" style="line-height: 20%;">
Location: Western University
</p>
<p></p>
<a class="c3Color ">
This application was made for android by Mike Hong, Jack Li, Matthew Ngai and myself. This application is targeted to those who are new to the country and do not know much about the culture and customs and is designed to make the transition to Canadian life simpler. <br>Some key features the application offers include:
<ul>
<li> Push Notification for national Holidays</li>
<li> Translations of Commonly used English words into 9 different Languages</li>
<li> Currency Exchange Rates</li>
</ul>
</a>
</td>
</table>
<br>
</div>
<div class="c5Bg" align="center">
<a class="noDecoration c3Color " href="https://github.com/mykongee/About_Canada">
Available on GitHub <img class="iconAlign iconFontSmall padding5" src="Icons/git.png">
</a>
<a class="noDecoration c3Color " href="https://ca.linkedin.com/in/haibing-mike-hong-99b2a4104">
| Mike Hong <img class="iconAlign iconFontSmall padding5" src="Icons/link.png">
</a>
<a class="noDecoration c3Color " href="https://ca.linkedin.com/in/thejackli">
| Jack Li <img class="iconAlign iconFontSmall padding5" src="Icons/link.png">
</a>
<a class="noDecoration c3Color " href="https://ca.linkedin.com/in/matthewngai">
| Matthew Ngai <img class="iconAlign iconFontSmall padding5" src="Icons/link.png">
</a>
<br>
</div>
<br>
<br>
<!--Block Evader-->
<div class="c2Bg">
<br>
<table width=90% align="center">
<td width=30% align="center">
<img src="Images/BlockEvader.png" width="50%" align="center">
</td>
<td width=70%>
<a name="BlockEvader" class="c4Color headerSmall">
Block Evader
</a>
<br>
<p class="c3Color fontMedium" style="line-height: 20%;">
Language: Java (Android)
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Created: 19/03/14
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Time Span: 3 days
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Team Size: 1
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Reason: Recieved First Android Phone
</p>
<p></p>
<a class="c3Color ">
This was truly my first android app, I worked on intensively for a few days and then quit on android (until a Hackathon in 2015). I made this application because I wanted a game that was simple and fun to play while waiting at the bus stop. The game is straight forward all you must do is dodge the falling blocks. The game itself is very inefficient but the idea was simple enough, on first load it would create the images based on the phone’s resolution and size, then the gameplay would be randomly spaced and placed falling blocks. <br> The game had features that I believe more applications should have:
<ul>
<li> Personalized: The app allowed users to select there preferred colour scheme</li>
<li> Input: The user could select to use touch input or the phones gyroscope </li>
</ul>
NOTE: This application was made on a Motorola RAZR (not the v3), and is quite buggy on other phones
</a>
</td>
</table>
<br>
</div>
<div class="c5Bg" align="center">
<a class="noDecoration c3Color " href="https://www.dropbox.com/s/qdap1mhb4poaj2m/BlockEvader1.3.apk?dl=0 ">
Apk Available on Dropbox <img class="iconAlign iconFontSmall padding5" src="Icons/drop.png">
</a>
</div>
<br>
<br>
<!--Tetraverse-->
<div class="c2Bg">
<br>
<table width=90% align="center">
<td width=30% align="center">
<img src="Images/TetraverseHome.png" width="80%" align="center">
</td>
<td width=70%>
<a name="Tetraverse" class="c4Color headerSmall">
Tetraverse
</a>
<br>
<p class="c3Color fontMedium" style="line-height: 20%;">
Language: Java
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Created: 01/03/14
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Time Span: 3 Months
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Team Size: 4
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Reason: Class Project
</p>
<p class="c3Color fontSmall" style="line-height: 20%;">
Location: Newmarket High School
</p>
<p></p>
<a class="c3Color ">
This was the first large program that I worked on in a team. Working along side Stephen Webb, Shirley Xiao and Christopher Wilson. Over 3 months we made a custom rendition of the classic game Tetris. We designed and implemented a 3D-Render engine from scratch and implemented our rendition on the classic game Tetris. <br>The features that set this game apart from the rest were:
<ul>
<li> New Blocks: 1x1, 2x1, 3x1, miniature L, Bomb (Blew up blocks)</li>
<li> Screen Rotation: Rotating the game and phsycis 90, 180 and 270 degrees randomly</li>
<li> Custom Game Mode: You can include or exclude any features</li>
<li>A variety of 3D-Depths</li>
</ul>
</a>
</td>
</table>
<br>
</div>
<div class="c5Bg" align="center">
<a class="noDecoration c3Color " href="https://github.com/awesomePavi/Tetraverse">
Available on GitHub <img class="iconAlign iconFontSmall padding5" src="Icons/git.png">
</a>
<a class="noDecoration c3Color " href="https://www.linkedin.com/in/shirley-xiao-b72335a7">
| Shirley Xiao <img class="iconAlign iconFontSmall padding5" src="Icons/link.png">
</a>
<br>
</div>
<br>
<br>
<!--Grade 9 Snake-->
<div class="c2Bg">
<br>
<table width=90% align="center">
<td width=30% align="center">
<img src="Images/Snake.png" width="80%" align="center">
</td>
<td width=70%>
<a name="SnakeGr9" class="c4Color headerSmall">
Snake
</a>
<br>
<p class="c3Color fontMedium" style="line-height: 20%;">
Language: Turing
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Created: 2010
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Time Span: 75 minutes
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Team Size: 1
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Reason: Was just introduced to programming and was playing around
</p>
<p class="c3Color fontMedium" style="line-height: 20%;">
Location: Newmarket High School
</p>
<p></p>
<a class="c3Color ">
This was the first program that I made with graphics. In high school I was not able to appreciate the text based programs we worked on because it seemed too simple. During class I would typically finish my work early and use the reference guide to find new things. I taught myself arrays, graphics, and loops. Than made this snake game to show my work, this very high level language is what made me finally decide to become a Software Engineer.
</a>
</td>
</table>
<br>
</div>
<div class="c5Bg" align="center">
<a class="noDecoration c3Color " href="https://github.com/awesomePavi/Grade9-SnakeGame">
Available on GitHub <img class="iconAlign iconFontSmall padding5" src="Icons/git.png">
</a>
<br>
</div>
<br>
<br>
</body>
</html>