This repository has been archived by the owner on Apr 18, 2020. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 2
/
volunteer.php
652 lines (630 loc) · 33.2 KB
/
volunteer.php
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
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
<?
$page_title = "Volunteer" ;
$page_template = "main";
include_once("includes/mysql_obj.php");
$mysql = new mysql_obj;
?>
<?php include("includes/_header.php"); ?>
<!-- VOLUNTEER PAGE CONTENT -->
<div class="feature_wrapper">
<div class="row">
<div class="nine columns">
<h1>Volunteer</h1>
<p>Become an elf! The Family Giving Tree depends almost entirely on our volunteers to perform the tasks necessary to ensure all wishes are fulfilled. If you'd like to help, check out what we have to offer.</p>
</div>
<div class="three columns">
<img src="images/people/c-photo4.png" alt="Volunteer at Family Giving Tree">
</div>
</div>
</div>
<div class="row">
<div class="three column">
<ul class="side-nav" data-sticky>
<li><a href="#register">Join Us</a></li>
<li><a href="#warehouse">The Warehouse</a></li>
<li><a href="#angelelf">Angel Elves</a></li>
<li><a href="#photos">Photos</a></li>
</ul>
</div>
<div class="nine column">
<section id="joinus">
<br>
<!-- <h2>Year-Round Volunteer Opportunities</h2>
<div class="row">
<div class="three columns">
<p class="text-center"><img src="images/icons/office-help.png" width="120" height="120" alt="Office Help"></p>
<p>General Office Help & Drive Preparation: Help us organize materials and prep for our Back to School Drive and/or Holiday Wish Drive. Great for students!
</p>
</div>
<div class="three columns">
<p class="text-center"><img src="images/icons/no-drop-ins.png" width="120" height="120" alt="No Drop Ins"></p>
<p>Please, no drop-ins. Email <a href="mailto:[email protected]">volunteers@<br>
familygivingtree.org</a> or call (408) 946-3111 first.
</p>
</div>
<div class="three columns">
<p class="text-center"><img src="images/icons/school-drive.png" width="120" height="120" alt="School Drive"></p>
<p>Back to School Drive
</p>
</div>
<div class="three columns">
<p class="text-center"><img src="images/icons/card-sorting.png" width="120" height="120" alt="Card Sorting"></p>
<p>Backpack Card sorting (May)
</p>
</div></div>
<h3> Backpack pick-up and delivery (August)</h3>
<ul class="disc">
<li> BTS Warehouse Duties (August): Help us set-up the warehouse, receive backpacks, sort, quality check, clean-up warehouse and prepare backpacks for distribution to low-income children.</li>
<li> Backpack distributions (August)</li>
</ul>
<h3> Holiday Wish Drive</h3>
<ul class="disc">
<li> Wish Card sorting (October)</li>
<li> Gift pickup and delivery (December)</li>
<li> HWD warehouse duties (December): Help us set-up warehouse, receive gifts, sort, wrap, quality check, clean-up warehouse and distribute gifts to low-income children.</li>
<li> Gift distributions (December & January)</li>
</ul> -->
<p> To learn about our needs as soon as they're posted, Sign up for our newsletter <a href="https://www.facebook.com/familygivingtree" target="_blank">become a friend on Facebook</a></p>
<div class="panel" id="register">
<h3>When can you volunteer?</h3>
<div class="inputrow">
<label for="volunteermonth">Month:</label>
<select id="volunteermonth">
<option selected>Select a month</option>
<option value="january">January</option>
<option value="february">February</option>
<option value="march">March</option>
<option value="april">April</option>
<option value="may">May</option>
<option value="june">June</option>
<option value="july">July</option>
<option value="august">August</option>
<option value="september">September</option>
<option value="october">October</option>
<option value="november">November</option>
<option value="december">December</option>
</select>
</div>
<!--
If a task is available in a specific month, add that month as a class on the li
For warehouse tasks, add class="warehousetask" in order to show the warehouse task dropdown
-->
<ul id="tasklist">
<li class="january february march april may june july august september october november december"><a href="#" class="email-link" data-reveal-id="volEmailModal">General Office Duties</a> <a href="#" data-reveal-id="task1Modal" class="helpicon">?</a></li>
<li class="may june"><a href="#" data-reveal-id="volEmailModal" class="email-link">Back to School Drive Prep</a> <a href="#" data-reveal-id="task2Modal" class="helpicon">?</a></li>
<li class="september october november december"><a href="#" data-reveal-id="volEmailModal" class="email-link">Holiday Wish Drive Prep</a> <a href="#" data-reveal-id="task3Modal" class="helpicon">?</a></li>
<li class="august"><a href="#" class="warehousetask">Back to School Warehouse</a> <a href="#" data-reveal-id="task4Modal" class="helpicon">?</a></li>
<li class="january december"><a href="#" class="warehousetask">Holiday Wish Drive Warehouse</a> <a href="#" data-reveal-id="task5Modal" class="helpicon">?</a></li>
<li class="august december"><a href="#" data-reveal-id="volEmailModal" class="email-link">Donation Pick-ups</a> <a href="#" data-reveal-id="task6Modal" class="helpicon">?</a></li>
<li class="january february march april may june july august september october november december"><a href="#" data-reveal-id="volEmailModal" class="email-link">Agency Interviews</a> <a href="#" data-reveal-id="task7Modal" class="helpicon">?</a></li>
<li class="october november"><a href="#" data-reveal-id="volEmailModal" class="email-link">Wish Editing</a> <a href="#" data-reveal-id="task8Modal" class="helpicon">?</a></li>
</ul>
<div id="warehousetaskform">
<div class="inputrow">
<label>Day/Task:</label>
<?
$first_of_month = date("Y-m-01");
for($i=1;$i<=12;$i++) {
$end_of_month = date("Y-m-t", strtotime($first_of_month) );
$task_sql = "SELECT * FROM taskdetails WHERE status='Y' AND Task like 'warehouse%' AND Date BETWEEN '$first_of_month' AND '$end_of_month' ORDER BY Date";
$first_of_month = date("Y-m-d", strtotime("+1 month", strtotime($first_of_month)) );
$recslot = $mysql->fetch_array($task_sql,MYSQL_ASSOC);
?>
<select class="volunteerday <? echo strtolower(date("F", strtotime($end_of_month))) ?>">
<option selected>Select a day and task</option>
<?
for($j=0;$j<count($recslot);$j++){
$date1 = explode("-",$recslot[$j][Date]);
$noofvolunteer = 0;
$sqlavailable = "select * from slotdetails sd, volunteers vo where sd.SlotId=vo.SlotId and vo.SlotId = '".$recslot[$j][SlotId]."'";
$res = $mysql->fetch_array($sqlavailable,MYSQL_ASSOC);
for($k=0;$k<count($res);$k++){
$noofvolunteer += $res[$k]['noofvolunteers'];
}
$availble += $recslot[$j][NoofVolunteersReq] - $noofvolunteer;
?>
<option value="<? echo $recslot[$j][TaskId]; ?>" <? echo ($noofvolunteer == 0) ? 'disabled=="disabled"' : ''; ?> ><?php echo date("l, M j, Y", mktime(0, 0, 0, $date1[1], $date1[2], $date1[0])); ?> - <? echo $recslot[$j][Task]?></option>
<?
}
?>
</select>
<? } ?>
<a href="#" class="button" data-reveal-id="registerModal" id="registerlink">Go</a>
</div>
</div>
</div>
</section>
<div class="row">
<div class="twelve columns">
<img src="images/horizontal-rule1.png">
</div>
</div>
<section id="warehouse">
<h2>The Warehouse</h2>
<div class="row">
<div class="six column">
<h3> HWD Warehouse</h3>
<!--MAP WILL GO HERE-->
<p> This year the Holiday Wish Drive Warehouse will be located in Cupertino, CA. More information coming soon! </p>
<p> <strong>HWD Warehouse Wishlist: </strong>We need batteries! If you come to the warehouse or office to volunteer, would you consider bringing batteries (AA, C or D size)? For a complete list of things we need to help keep our programs running, check out our <a href="donate.php#wishlist">Wish List</a>.</p>
</div>
<div class="six column">
<h3> BTS Warehouse</h3>
<!--GOOGLE MAP-->
<iframe width="338" height="236" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps?oe=utf-8&client=firefox-a&q=560+Cottonwood+Drive+,+Milpitas,+CA&ie=UTF8&hq=&hnear=560+Cottonwood+Dr,+Milpitas,+California+95035&gl=us&t=m&ll=37.403778,-121.913395&spn=0.016091,0.028925&z=14&iwloc=A&output=embed"></iframe><br /><small><a href="https://maps.google.com/maps?oe=utf-8&client=firefox-a&q=560+Cottonwood+Drive+,+Milpitas,+CA&ie=UTF8&hq=&hnear=560+Cottonwood+Dr,+Milpitas,+California+95035&gl=us&t=m&ll=37.403778,-121.913395&spn=0.016091,0.028925&z=14&iwloc=A&source=embed">View Larger Map</a></small>
<!--END GOOGLE MAP-->
<p>Thank you iStar Financial!</p>
<p> 560 Cottonwood Drive <br>
Milpitas, CA 95035 <br>
<!--Update hoursCalendar at bottom of page-->
<a href="#" data-reveal-id="hoursCalendar">Warehouse Hours</a></p>
BTS Warehouse Wishlist Coming Soon!
</p>
</div>
</div>
<h3> What you should know before you volunteer</h3>
<p> <strong>Shift requirements for both drives: </strong>A minimum commitment of two hours is requested for each volunteer shift, but if we can find more work for you to do on the day you volunteer, we'd love for you to stay! And please, no drop-ins to the warehouse!</p>
<p> <strong>Warehouse Tasks: </strong>Volunteers will be asked to help in various ways at the warehouse. Usually, these tasks are decided immediately before a group arrives, so we are not able to predict what you or your group will be doing in advance.</p>
<p> <strong>Attire and Warehouse Conditions:</strong> Always wear multiple layers for warehouse work. We are never sure what temperatures to expect, but it's usually HOT in the summer and COLD in the winter! We also suggest comfy shoes. That’s because we don’t do much sitting.</p>
<p> <strong>Snacking:</strong> We always have Culligan water available! Snacks and food are available for sale from Gold Rush Catering during the Holiday Wish Drive only. If you are hosting a group of volunteers, you are welcome to bring your own food and we will set tables up for you.</p>
<p> <strong>Little Elves:</strong> Little elf volunteers are welcome, but remember the warehouse is not child-proof so younger volunteers must be strictly supervised.</p>
</section>
<!--<section id="events">
<h2>Events</h2>
<table>
<tr>
<td>October 2012</td>
<td>Details coming soon</td>
</tr>
</table>
</section>-->
<div class="row">
<div class="twelve columns">
<img src="images/horizontal-rule1.png">
</div>
</div>
<section id="angelelf">
<h2>Angel Elves</h2>
<p>Do you want to help the Family Giving Tree in a special way? Angel Elves are experienced volunteers willing to donate their time and skill set to help our programs run smoothly. Some Angel Elves supervise other volunteers at the warehouse on multiple days. Some help with special events and other activities such as the Executive Elf Challenge and Wish Card sorting. In the warehouse during Back to School and Holiday Drive, tasks may involve general set up, greeting other volunteers, store supervision and supervision of gift shipping/receiving. Angel Elf responsibilities depend on the person's experience and comfort level with specific tasks.</p>
<h3>Who are the Angel Elves?</h3>
<p>The contributions of our Angel Elves are tremendous. Their combined efforts are vital to our programs and their constant enthusiasm helps brighten the holidays for thousands of children each year. On behalf of all the children, we thank them for their dedication! </p>
<div class="row">
<div class="four columns"> <img src="images/people/jessy.png" alt="bio image">
<h3>Jessy Rodriguez</h3>
<section><p>Jessy Rodriguez first came to The Family Giving Tree as a volunteer with her young classmates from Calaveras Montessori in 2004. They bagged gifts by 10 and she was already leading her group (she was one of the two children who could count to 10)!
<!-- .readmorecontent is hidden until the closest .readmore is clicked-->
<span class="readmorecontent"> For the next several years, Jessy became a regular warehouse volunteer at the Holiday Wish Drive and Back to School Drive. In 2011 she really blossomed and took over the agency pick up job, working some pretty long shifts and even spent time helping her young friends learn the system! Jessy's hard work earned her Angel Elf of the year award in 2011! She currently attends Monroe Middle School where she is on the honor roll, active in band and plays the flute.</span></p>
<!-- data-hidetext and data-showtext alaternate as the link text on toggle-->
<p class="text-right"><a href="#" class="readmore" data-hidetext="Show Less" data-showtext="Read More">Read More</a></p></section>
</div>
<div class="four columns"> <img src="images/people/joanne.png" alt="bio image">
<h3>Joanne Bodenhammer</h3>
<p>Joanne Bodenhammer has volunteered countless hours helping us contact and sign up hundreds of hosts for our holiday program, and get wish cards ready to send them. Thanks to her dedication and generous spirit for many years, thousands more children's wishes will be fulfilled this season! She is an amazing Angel Elf!</p>
</div>
<div class="four columns"> <img src="images/people/dianne.png" alt="bio image">
<h3>Diane Trevino</h3>
<section><p>Diane Trevino has volunteered with FGT since it’s inception, more than 20 years! She spends endless hours at our warehouses for the Back-to-School Drive and Holiday Wish Drive, doing everything from training fellow volunteers to personally making sure every bag is perfectly packed. <span class="readmorecontent">Her other commitments include serving as lead volunteer with Sacred Heart Community Services and heading the former National Semiconductor's Holiday Workshop Project that provided 800 gift bags for seniors, low-income families, homeless adults and adults with disabilities. Not only does Diane coordinate the hundreds of volunteers that assemble the gift bags, she and her husband Rey shop for each of the items (over 10,400 toiletries, books, etc.) that go into the bags. Diane participates in all of the volunteer projects coordinated by Texas Instruments including bagging groceries for seniors at the Sunnyvale Community Services, beautifying an InnVision shelter for women and children, and pulling invasive weeds with Save the Bay. She also serves on Texas Instrument's Wellness Team, Recycling Team and is a Building Emergency Manager for their headquarters building. She is an inspiration to all of us!</span></p>
<p class="text-right"><a href="#" class="readmore" data-hidetext="Show Less" data-showtext="Read More">Read More</a></p></section>
</div>
</div>
</section>
<div class="row">
<div class="twelve columns">
<img src="images/horizontal-rule1.png">
</div>
</div>
<section id="photos">
<h2>Photos</h2>
<div class="row">
<div class="three columns">
<p><a href="#" data-reveal-id="imgModal"><img src="images/volunteer photos/vol1.jpg" class="imgthumb"></a></p>
</div>
<div class="three columns">
<p><a href="#" data-reveal-id="imgModal"><img src="images/volunteer photos/vol2.jpg" class="imgthumb"></a></p>
</div>
<div class="three columns">
<p><a href="#" data-reveal-id="imgModal"><img src="images/volunteer photos/vol3.jpg" class="imgthumb"></a></p>
</div>
<div class="three columns">
<p><a href="#" data-reveal-id="imgModal"><img src="images/volunteer photos/vol4.jpg" class="imgthumb"></a></p>
</div>
</div>
<div class="row">
<div class="three columns">
<p><a href="#" data-reveal-id="imgModal"><img src="images/volunteer photos/vol5.jpg" class="imgthumb"></a></p>
</div>
<div class="three columns">
<p><a href="#" data-reveal-id="imgModal"><img src="images/volunteer photos/vol6.jpg" class="imgthumb"></a></p>
</div>
<div class="three columns">
<p><a href="#" data-reveal-id="imgModal"><img src="images/volunteer photos/vol7.jpg" class="imgthumb"></a></p>
</div>
<div class="three columns">
<p><a href="#" data-reveal-id="imgModal"><img src="images/volunteer photos/vol8.jpg" class="imgthumb"></a></p>
</div>
</div>
<div class="row">
<div class="three columns">
<p><a href="#" data-reveal-id="imgModal"><img src="images/volunteer photos/vol9.jpg" class="imgthumb"></a></p>
</div>
<div class="three columns end">
<p><a href="#" data-reveal-id="imgModal"><img src="images/volunteer photos/vol10.jpg" class="imgthumb"></a></p>
</div>
</div>
</section>
</div>
</div>
<!--Large image modal-->
<div class="reveal-modal" id="imgModal"> <img src="http://placehold.it/300x300" id="largeimage"> <a class="close-reveal-modal">×</a> </div>
<!--Database-driven volunteer registration-->
<div id="registerModal" class="reveal-modal">
<div id="registerModalContent"></div>
<a class="close-reveal-modal">×</a> </div>
<!--Task description modals-->
<div id="task1Modal" class="reveal-modal">
<h2>General Office Duties</h2>
<p>Help out at the Elves' Office with general office duties such as data input, filing, collateral prep, host calls, and other duties as needed.</p>
<a class="close-reveal-modal">×</a> </div>
<div id="task2Modal" class="reveal-modal">
<h2>Back to School Drive Prep</h2>
<p> Help us organize materials and prep collateral for our Back to School Drive. Great for students!</p>
<a class="close-reveal-modal">×</a> </div>
<div id="task3Modal" class="reveal-modal">
<h2>Holiday Wish Drive Prep</h2>
<p> Help us organize materials and prep collateral for our Holiday Wish Drive. Great for students!</p>
<a class="close-reveal-modal">×</a> </div>
<div id="task4Modal" class="reveal-modal">
<h2>Back to School Warehouse</h2>
<p> Help us set-up the warehouse, receive backpacks, sort supplies, quality check, clean-up and backpack preparation for distribution. </p>
<a class="close-reveal-modal">×</a> </div>
<div id="task5Modal" class="reveal-modal">
<h2>Holiday Wish Drive Warehouse</h2>
<p> Help us set-up warehouse, receive gifts, sort and wrap gifts, quality check, clean-up and distribute gifts.</p>
<a class="close-reveal-modal">×</a> </div>
<div id="task6Modal" class="reveal-modal">
<h2>Donation Pick-ups</h2>
<p> Help bring backpacks or gifts from our public host companies to our warehouse for preparation and distribution.</p>
<a class="close-reveal-modal">×</a> </div>
<div id="task7Modal" class="reveal-modal">
<h2>Agency Interviews</h2>
<p> Make site visits to our agency partners in an effort to evaluate their needs and ensure we stay connected. </p>
<a class="close-reveal-modal">×</a> </div>
<div id="task8Modal" class="reveal-modal">
<h2>Wish Editing</h2>
<p> Help us sort through our database of wishes to ensure each child receives exactly what they want!</p>
<a class="close-reveal-modal">×</a> </div>
<!--Email-based volunteer registration-->
<div id="volEmailModal" class="reveal-modal">
<!--.preconfirm is hidden after successful submit-->
<div class="preconfirm">
<p class="right">
*Required Fields
</p>
<h2>Register to Volunteer</h2>
<form id="volunteerform" method="post" action="volunteer-post-email.php">
<label for="name">*Name</label>
<input type="text" id="name" name="name" class="required" />
<label for="email">Email Address</label>
<input type="text" id="email" name="email" />
<label for="phone">*Phone Number</label>
<input type="text" id="phone" name="phone" class="required" />
<label for="org">Company or School Name</label>
<input type="text" id="org" name="org" />
<label for="under18">*Are you under 18?</label>
<div class="inputrow">
<label>
<input type="radio" name="under18" id="under18yes" value="Yes" class="required" />
Yes </label>
<label>
<input type="radio" name="under18" id="under18no" value="No" class="required" />
No </label>
<label for="grade">If so, grade level</label>
<input type="text" id="grade" name="grade" />
</div>
<div class="inputrow">
<label for="weekday">*Availability (check all that apply)</label>
</div>
<div class="inputrow">
<label for="weekday">Days</label>
<label>
<input type="checkbox" name="weekday[]" id="weekdaym" value="M" class="required" />
M </label>
<label>
<input type="checkbox" name="weekday[]" id="weekdaytu" value="Tu" class="required" />
Tu </label>
<label>
<input type="checkbox" name="weekday[]" id="weekdayw" value="W" class="required" />
W </label>
<label>
<input type="checkbox" name="weekday[]" id="weekdayth" value="Th" class="required" />
Th </label>
<label>
<input type="checkbox" name="weekday[]" id="weekdaym" value="F" class="required" />
F </label>
<label>
<input type="checkbox" name="weekday[]" id="weekdaysat" value="Sat" class="required" />
Sat </label>
<label>
<input type="checkbox" name="weekday[]" id="weekdaysun" value="Sun" class="required" />
Sun </label>
</div>
<div class="inputrow">
<label for="time">Times</label>
<label>
<input type="checkbox" name="time[]" id="timemornings" value="Mornings" />
Mornings</label>
<label>
<input type="checkbox" name="time[]" id="timeafternoons" value="Afternoons" />
Afternoons</label>
<label>
<input type="checkbox" name="time[]" id="timeevenings" value="Evenings" />
Evenings</label>
<label>
<input type="checkbox" name="time[]" id="timeanytime" value="Anytime" />
Anytime</label>
</div>
<label for="purpose">*I am volunteering:</label>
<label>
<div class="inputrow">
<input type="radio" name="purpose" id="purpose_school" value="school" class="required" />
School requirement (# of hours) <input type="text" id="schoolhrs" name="schoolhrs" /></label>
</div>
<div class="inputrow">
<label>
<input type="radio" name="purpose" id="purpose_company" value="company" class="required" />
Company volunteer opportunity</label>
</div>
<div class="inputrow">
(Matching program?
<label>
<input type="radio" name="matching" id="matchingyes" value="yes" />
Yes</label>
<label>
<input type="radio" name="matching" id="matchingno" value="no" />
No</label>)
</div>
<div class="inputrow">
<label>
<input type="radio" name="purpose" id="purpose_fun" value="fun" class="required" />
For fun</label>
</div>
<div class="inputrow">
<label>
<input type="radio" name="purpose" id="purpose_court" value="court" class="required" />
Court Order</label>
</div>
<div class="inputrow">
<label>
<input type="radio" name="purpose" id="purpose_other" value="other" class="required" />
Other</label>
<input type="text" id="purpose_other" name="purpose_other" />
</div>
<label for="skills">Special Skills (i.e. Computer systems, programs, programming, event coordination, etc.)</label>
<textarea id="skills" name="skills"></textarea>
<label for="info">Any additional information?</label>
<textarea id="info" name="info"></textarea>
<!--Submit sends email to [email protected]>
<p class="text-center"><a href="#" class="another-reveal-close">Cancel</a> <input type="submit" value="Submit" class="button">
</form>
</div>
<!--Confirmation below-->
<div class="confirm" style="display:none">
<h2>Thank you</h2>
<p>Thank you for your interest in volunteering for Family Giving Tree. You will be contacted when and if a volunteer match becomes available.</p></div>
<a class="close-reveal-modal">×</a> </div>
<!--Warehouse task shift details-->
<div id="shiftDetailsModal" class="reveal-modal">
<h2>Shift Details</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse posuere gravida magna in tristique. </p>
<p> Nam pretium augue sit amet tortor varius vitae venenatis magna semper. Proin quis erat et massa consectetur feugiat. Morbi sollicitudin mattis ligula, non vehicula est rutrum id. Ut cursus lorem a leo aliquet auctor. </p>
<p>Suspendisse elit felis, pellentesque sed gravida rutrum, ultrices at erat. Aliquam vel ultricies urna. </p>
<p>In interdum luctus magna ac tincidunt. Nullam tortor ligula, venenatis ut aliquet in, lobortis eget nisl. </p>
<p>Ut quis elit mauris, et congue ligula. Mauris vitae tellus non mauris rutrum ultricies a pulvinar nisi. Morbi facilisis dignissim turpis, non aliquet nibh scelerisque ut. Donec quis lacus lectus, in venenatis tellus.</p>
<a class="close-reveal-modal">×</a> </div>
<!--Warehouse hours-->
<div id="hoursCalendar" class="reveal-modal large"> <a class="close-reveal-modal">×</a>
<h4>Warehouse Hours: August</h4>
<table class="calendar">
<thead>
<tr>
<th class="weekend">Sunday</th>
<th>Monday</th>
<th>Tuesday</th>
<th>Wednesday</th>
<th>Thursday</th>
<th>Friday</th>
<th class="weekend">Saturday</th>
</tr>
</thead>
<tbody>
<tr>
<td class="previous weekend"><span class="date">29</span>
<p> </p>
<div class="day"></div></td>
<td class="previous"><span class="date">30</span>
<p> </p>
<div class="day"></div></td>
<td class="previous"><span class="date">31</span>
<p> </p>
<div class="day"></div></td>
<td><span class="date">1</span>
<p> Backpacks DUE!<br />
Warehouse Open
10am - 6pm </p>
<div class="day"></div></td>
<td><span class="date">2</span>
<p>Warehouse Open 10am - 5pm</p>
<div class="day"></div></td>
<td><span class="date">3</span>
<p>Warehouse Open 10am - 5pm</p>
<div class="day"></div></td>
<td class="weekend"><span class="date">4</span>
<p>Warehouse Open 11am - 3pmm</p>
<div class="day"></div></td>
</tr>
<tr>
<td class="weekend"><span class="date">5</span>
<p>Closed</p>
<div class="day"></div></td>
<td><span class="date">6</span>
<p>Warehouse Open 10am - 5pm</p>
<div class="day"></div></td>
<td><span class="date">7</span>
<p>Warehouse Open 10am - 5pm</p>
<div class="day"></div></td>
<td><span class="date">8</span>
<p>Warehouse Open 10am - 5pm</p>
<div class="day"></div></td>
<td><span class="date">9</span>
<p>Warehouse Open 10am - 5pm</p>
<div class="day"></div></td>
<td><span class="date">10</span>
<p>Warehouse Open 10am - 5pm</p>
<div class="day"></div></td>
<td class="weekend"><span class="date">11</span>
<p>Closed</p>
<div class="day"></div></td>
</tr>
<tr>
<td class="weekend"><span class="date">12</span>
<p>Closed</p>
<div class="day"></div></td>
<td><span class="date">13</span>
<p> Backpacks Distributed to Schools <br />
Warehouse Open 10am - 5pm </p>
<div class="day"></div></td>
<td><span class="date">14</span>
<p>Warehouse Open 10am - 5pm</p>
<div class="day"></div></td>
<td><span class="date">15</span>
<p> School Starts! <br />
Warehouse Open 10am - 5pm </p>
<div class="day"></div></td>
<td><span class="date">16</span>
<p>Warehouse Open 10am - 5pm</p>
<div class="day"></div></td>
<td><span class="date">17</span>
<p>Warehouse Open 10am - 5pm</p>
<div class="day"></div></td>
<td class="weekend"><span class="date">18</span>
<p>Closed</p>
<div class="day"></div></td>
</tr>
<tr>
<td class="weekend"><span class="date">19</span>
<p>Closed</p>
<div class="day"></div></td>
<td><span class="date">20</span>
<p>Warehouse Open 10am - 3pm</p>
<div class="day"></div></td>
<td><span class="date">21</span>
<p>Warehouse Open 10am - 3pm</p>
<div class="day"></div></td>
<td><span class="date">22</span>
<p> </p>
<div class="day"></div></td>
<td><span class="date">23</span>
<p> </p>
<div class="day"></div></td>
<td><span class="date">24</span>
<p> </p>
<div class="day"></div></td>
<td class="weekend"><span class="date">25</span>
<p> </p>
<div class="day"></div></td>
</tr>
<tr>
<td class="weekend"><span class="date">26</span>
<p>Closed</p>
<div class="day"></div></td>
<td><span class="date">27</span>
<p> </p>
<div class="day"></div></td>
<td><span class="date">28</span>
<p> </p>
<div class="day"></div></td>
<td><span class="date">29</span>
<p> </p>
<div class="day"></div></td>
<td><span class="date">30</span>
<p> </p>
<div class="day"></div></td>
<td><span class="date">31</span>
<p> </p>
<div class="day"></div></td>
<td class="weekend next"><span class="date">1</span>
<p> </p>
<div class="day"></div></td>
</tr>
</tbody>
</table>
</div>
<?php include("includes/_footer.php"); ?>
<script src="javascripts/jquery.form.js"></script>
<!--For form validation-->
<script src="javascripts/jquery.validate.min.js"></script>
<script>
$(document).ready(function(){
registerSelect();
readMoreToggle();
imagePopup();
$('#volunteerform').validate();
$('#volunteerform').ajaxForm({success: function(response){
$('.preconfirm').hide();
$('.confirm').show();
}})
});
<!--FOR THE REGISTRATION FORM-->
function registerSelect(){
$('#registerlink').hide();
$('#warehousetaskform').hide();
$('.volunteerday').hide();
$('.warehousetask').click(function(e){
e.preventDefault();
$('#warehousetaskform').show();
});
$('#tasklist li').hide();
$('#volunteermonth').val(jQuery('options:first', this).val())
$('#volunteermonth').change(function(){
var month = $(this).val();
$('#tasklist li').hide();
$('.'+month).show();
});
$(".email-link").click(function() {
var description = $(this).text();
$('#volunteerform').append('<input type="hidden" name="category" value="'+description+'">');
});
$('.volunteerday').change(function(){
$('#registerlink').hide();
var taskId = $(this).val();
var desc = $(this).find('option:selected').text();
if(taskId!==''){
$('#registerlink').show();
$('#registerModalContent').load('vol_register.php?taskId='+taskId);
$('#daytask').text(desc);
}
});
$("div.reveal-modal").delegate(".another-reveal-close", "click", function(e) {
e.preventDefault();
$(this).parents("div.reveal-modal").trigger('reveal:close');
});
}
<!--Image popup-->
function imagePopup(){
$('.imgthumb').click(function(){
$('#largeimage').attr('src',$(this).attr('src'));
});
}
<!--FOR THE READ MORE TOGGLE-->
function readMoreToggle(){
$('.readmorecontent').hide();
$('.readmore').toggle(function(){
$(this).text($(this).attr('data-hidetext'))
.closest('section').find('.readmorecontent').show('blind');
},function(){
$(this).text($(this).attr('data-showtext'))
.closest('section').find('.readmorecontent').hide('blind');
});
}
</script>