[%# This Source Code Form is subject to the terms of the Mozilla Public
  # License, v. 2.0. If a copy of the MPL was not distributed with this
  # file, You can obtain one at http://mozilla.org/MPL/2.0/.
  #
  # This Source Code Form is "Incompatible With Secondary Licenses", as
  # defined by the Mozilla Public License, v. 2.0.
  #%]

[%# initialise product to component mapping #%]

[% SET selectable_products = user.get_selectable_products %]

<script>
var Dom = YAHOO.util.Dom;
var useclassification = false;
var first_load = true;
var last_sel = [];
var cpts = new Array();
var watch_users = new Array();
[% n = 0 %]
[% FOREACH prod = selectable_products %]
  cpts['[% n %]'] = [
    [%- FOREACH comp = prod.components %]'[% comp.name FILTER js %]'[% ", " UNLESS loop.last %] [%- END -%] ];
  [% n = n + 1 %]
  [% FOREACH comp = prod.components %]
    [% IF comp.watch_user %]
      if (!watch_users['[% prod.name FILTER js %]'])
        watch_users['[% prod.name FILTER js %]'] = new Array();
      watch_users['[% prod.name FILTER js %]']['[% comp.name FILTER js %]'] = '[% comp.watch_user.login FILTER js %]';
    [% END %]
  [% END %]
[% END %]
</script>
<script type="text/javascript" src="[% 'js/productform.js' FILTER mtime FILTER html %]">
</script>

<script>
function onSelectProduct() {
  var component = Dom.get('component');
  selectProduct(Dom.get('product'), component);
  // selectProduct only supports __Any__ on both elements
  // we only want it on component, so add it back in
  try {
    component.add(new Option('__Any__', ''), component.options[0]);
  } catch(e) {
    // support IE
    component.add(new Option('__Any__', ''), 0);
  }
  onSelectComponent();
}

function onSelectComponent() {
  var product_select = Dom.get('product');
  var product = product_select.options[product_select.selectedIndex].value;
  var component = Dom.get('component').value;
  if (component && watch_users[product] && watch_users[product][component]) {
    Dom.get('watch-user-email').innerHTML = watch_users[product][component];
    Dom.get('watch-user-div').style.display = '';
  } else {
    Dom.get('watch-user-div').style.display = 'none';
  }
}

YAHOO.util.Event.onDOMReady(onSelectProduct);
</script>

<p>
Select the components you want to watch.  To watch all components in a product,
watch "__Any__".
</p>

<table border="0" cellpadding="3" cellspacing="0">
<tr>
  <td align="right">Product:</td>
  <td colspan="2">
    <select name="add_product" id="product" onChange="onSelectProduct()">
    [% FOREACH product IN selectable_products %]
      <option>[% product.name FILTER html %]</option>
    [% END %]
    </select>
  </td>
</tr>
<tr>
  <td align="right" valign="top">Component:</td>
  <td>
    <select name="add_component" id="component" multiple size="5" onChange="onSelectComponent()">
      <option value="">__Any__</option>
    [% FOREACH product IN selectable_products %]
      [% FOREACH component IN product.components %]
        <option>[% component.name FILTER html %]</option>
      [% END %]
    [% END %]
    </select>
  </td>
  <td valign="top">
    <div id="watch-user-div"
         title="You can also watch a component by following this user. [% ~%]
                CC'ing this user on a [% terms.bug %] will trigger notifications to all watchers of this component."
         style="cursor:help">
      Watch User: <span id="watch-user-email"></span>
    </div>
  </td>
</tr>
<tr>
  <td>&nbsp;</td>
  <td><input type="submit" id="add" name="add" value="Add"></td>
</tr>
</table>

<p>
Use <a href="userprefs.cgi?tab=email">Email Preferences</a> to filter which
notification emails you receive.
</p>

<hr>
<p>
You are currently watching:
</p>

[% IF watches.size %]

<table border="0" cellpadding="5" cellspacing="0">
<tr>
  <td>&nbsp;</td>
  <td><b>Product</b></td>
  <td><b>Component</b></td>
</tr>
[% FOREACH watch IN watches %]
  <tr>
  [% IF (watch.component) %]
    <td><input type="checkbox" name="del_[% watch.product.id FILTER html %]_[% watch.component.id FILTER html %]" value="1"></td>
    <td>[% watch.component.product.name FILTER html %]</td>
    <td>
      <a href="buglist.cgi?product=[% watch.product.name FILTER uri ~%]
               &component=[% watch.component.name FILTER uri %]&resolution=---">
      [% watch.component.name FILTER html %]
      </a>
    </td>
  [% ELSE %]
    <td><input type="checkbox" name="del_[% watch.product.id FILTER html %]" value="1"></td>
    <td>[% watch.product.name FILTER html %]</td>
    <td>
      <a href="describecomponents.cgi?product=[% watch.product.name FILTER html %]">
      __Any__
      </a>
    </td>
  [% END %]
  </tr>
[% END %]
</table>

<p>
Select the items you want to stop watching.
</p>

[% ELSE %]

<p>
<i>You are not watching any components.</i>
</p>

[% END %]