[%# The contents of this file are subject to the Mozilla Public
  # License Version 1.1 (the "License"); you may not use this file
  # except in compliance with the License. You may obtain a copy of
  # the License at http://www.mozilla.org/MPL/
  #
  # Software distributed under the License is distributed on an "AS
  # IS" basis, WITHOUT WARRANTY OF ANY KIND, either express or
  # implied. See the License for the specific language governing
  # rights and limitations under the License.
  #
  # The Original Code is the REMO Bugzilla Extension.
  #
  # The Initial Developer of the Original Code is the Mozilla Foundation
  # Portions created by the Initial Developers are Copyright (C) 2011 the
  # Initial Developer. All Rights Reserved.
  #
  # Contributor(s): Byron Jones <glob@mozilla.com>
  #%]

[% PROCESS global/variables.none.tmpl %]

[% PROCESS global/header.html.tmpl
   title = "Mozilla Reps - Application Form"
   style_urls = [ "extensions/REMO/web/styles/moz_reps.css" ]
%]

[% USE Bugzilla %]
[% mandatory = '<span class="mandatory" title="Required">*</span>' %]

<script type="text/javascript">
var Dom = YAHOO.util.Dom;

function mandatory(ids) {
  result = true;
  for (i in ids) {
    id = ids[i];
    el = Dom.get(id);

    if (el.type.toString() == "checkbox") {
      value = el.checked;
    } else {
      value = el.value.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
      el.value = value;
    }

    if (value == '') {
      Dom.addClass(id, 'missing');
      result = false;
    } else {
      Dom.removeClass(id, 'missing');
    }
  }
  return result;
}

function underageWarning (el) {
  if (el.checked) {
    Dom.removeClass('underage_warning', 'bz_default_hidden');
    Dom.get('submit').disabled = true;
  }
  else {
    Dom.addClass('underage_warning', 'bz_default_hidden');
    Dom.get('submit').disabled = false;
  }
}

function submitForm() {
  if (!mandatory([ 'first_name', 'last_name', 'sex', 'city', 'country',
                   'languages', 'learn', 'motivation', 'privacy' ])
  ) {
    alert('Please enter all the required fields.');
    return false;
  }

  Dom.get('short_desc').value =
    "Application Form: " + Dom.get('first_name').value + ' ' + Dom.get('last_name').value;

  return true;
}

</script>

<noscript>
<h1>Javascript is required to use this form.</h1>
</noscript>

<h1>Mozilla Reps - Application Form</h1>

<form method="post" action="post_bug.cgi" id="tmRequestForm">
<input type="hidden" name="product" value="Mozilla Reps">
<input type="hidden" name="component" value="Mentorship">
<input type="hidden" name="bug_severity" value="normal">
<input type="hidden" name="rep_platform" value="All">
<input type="hidden" name="priority" value="--">
<input type="hidden" name="op_sys" value="Other">
<input type="hidden" name="version" value="unspecified">
<input type="hidden" name="groups" value="mozilla-reps">
<input type="hidden" name="format" value="[% format FILTER html %]">
<input type="hidden" name="created-format" value="[% format FILTER html %]">
<input type="hidden" name="comment" id="comment" value="">
<input type="hidden" name="short_desc" id="short_desc" value="">
<input type="hidden" name="token" value="[% token FILTER html %]">

<table id="reps-form">

<tr class="odd">
  <th>First Name:[% mandatory FILTER none %]</th>
  <td><input id="first_name" name="first_name" size="40" placeholder="John"></td>
</tr>

<tr class="even">
  <th>Last Name:[% mandatory FILTER none %]</th>
  <td><input id="last_name" name="last_name" size="40" placeholder="Doe"></td>
</tr>

<tr class="odd">
  <th>Are you under 18 years old?:</th>
  <td>
    <input type="checkbox" id="underage" name="underage" 
           value="1" onclick="underageWarning(this);"><br>
  </td>
</tr>

<tr id="underage_warning" class="odd bz_default_hidden">
  <td colspan="2">
    Mozilla Reps program is not currently accepting people under 18 years old.
    Sorry for the inconvenience. In the meantime please check with your local Mozilla
    group for other contribution opportunities
  </td>
</tr>

<tr class="even">
  <th>Sex:[% mandatory FILTER none %]</th>
  <td>
    <select id="sex" name="sex">
      <option value="Male">Male</option>
      <option value="Female">Female</option>
      <option value="Other">Other</option>
    </select>
  </td>
</tr>

<tr class="odd">
  <th>City:[% mandatory FILTER none %]</th>
  <td><input id="city" name="city" size="40" placeholder="Your city"></td>
</tr>

<tr class="even">
  <th>Country:[% mandatory FILTER none %]</th>
  <td><input id="country" name="country" size="40" placeholder="Your country"></td>
</tr>

<tr class="odd">
  <th>Local Community you participate in:</th>
  <td><input id="community" name="community" size="40" placeholder="Name of your community"></td>
</tr>

<tr class="even">
  <th>IM (specify service):</th>
  <td><input id="im" name="im" size="40"></td>
</tr>

<tr class="odd">
  <th>Mozillians.org Account:</th>
  <td><input id="mozillian" name="mozillian" size="40"></td>
</tr>

<tr class="even">
  <th colspan="2">
    References:
  </th>
</tr>
<tr class="even">
  <td colspan="2">
    <textarea id="references" name="references" rows="4"
              placeholder="Add contact info of people referencing you."></textarea>
  </td>
</tr>

<tr class="odd">
  <th colspan="2">
    How are you involved with Mozilla?
  </th>
</tr>
<tr class="odd">
  <td colspan="2">
    <textarea id="involved" name="involved" rows="4" placeholder="Add-ons,  l10n,  SUMO,  QA,  ..."></textarea>
  </td>
</tr>

<tr class="even">
  <th>
    When did you first start contributing to Mozilla?
  </th>
  <td><input id="firstcontribute" name="firstcontribute" size="40"></td>
</tr>

<tr class="odd">
  <th>Languages Spoken:[% mandatory FILTER none %]</th>
  <td><input id="languages" name="languages" size="40"></td>
</tr>

<tr class="even">
  <th>How did you learn about Mozilla Reps?[% mandatory FILTER none %]</th>
  <td><input id="learn" name="learn" size="40"></td>
</tr>

<tr class="odd">
  <th colspan="2">What motivates you most about joining Mozilla Reps?[% mandatory FILTER none %]</th>
</tr>
<tr class="odd">
  <td colspan="2"><textarea id="motivation" name="motivation" rows="4"></textarea></td>
</tr>

<tr class="even">
  <th colspan="2">Comments:</th>
</tr>
<tr class="even">
  <td colspan="2"><textarea id="comments" name="comments" rows="4"></textarea></td>
</tr>

<tr class="odd">
  <th>
    I have read the
    <a href="http://www.mozilla.com/en-US/privacy-policy" target="_blank">Mozilla Privacy Policy</a>:[% mandatory FILTER none %]
  </th>
  <td><input id="privacy" type="checkbox"></td>
</tr>

<tr class="even">
  <td>&nbsp;</td>
  <td align="right">
    <input id="submit" type="submit" value="Submit" onclick="return submitForm()">
  </td>
</tr>

</table>

</form>

[% PROCESS global/footer.html.tmpl %]