<dtml-var manage_page_header>
<dtml-var manage_tabs>

<p class="form-help">
Edit <dtml-var meta_type> method TALES expressions here.
<dtml-if "not isTALESAvailable()"><br>
<span style="color: #FF0000;">
Zope Page Templates and therefore TALES is not installed.
This tab can therefore not be used.
</span>
</dtml-if>
</p>


<form action="manage_tales" method="POST">
<table cellspacing="0" cellpadding="2" border="0">


  <dtml-in "override_form.get_groups()">
  <dtml-let group=sequence-item fields="tales_form.get_fields_in_group(group)">

  <dtml-if fields>
  <tr>
  <td colspan="3" class="form-title">
    Proxy Widget properties
  </td>
  </tr>

  <dtml-var fieldListHeader>

  <dtml-let current_field="this()">
  <dtml-in fields>
  <dtml-let field=sequence-item field_id="field.id"
            value="current_field.get_tales(field.id)">
    <tr>
      <td align="left" valign="top">
      <div class="form-label">
      <dtml-var "field.title()">
      </div>
      </td>
      <td align="left" valign="top">
      <dtml-var "field.render(value)">
      </td>
      <td><div class="form-element">
      <dtml-var "current_field.form.get_field(field.id).meta_type">
      </div></td>
    </tr>
  </dtml-let>
  </dtml-in>
  </dtml-let>
  </dtml-if>
  </dtml-let>
  </dtml-in>




<!-- XXX Loop until find not a proxy field -->
<dtml-let proxy_field="this()"
          current_field="proxy_field.getRecursiveTemplateField()">

  <dtml-if "current_field is not None">
    <dtml-let form="current_field.tales_form">

  <dtml-in "form.get_groups()">
    <dtml-let group=sequence-item fields="form.get_fields_in_group(group)">
      <dtml-if fields>
        <tr>
          <td colspan="3" class="form-title">
            <dtml-var "_.string.capitalize(group)"> properties
          </td>
        </tr>

        <dtml-var proxyFieldListHeader>

        <dtml-in fields>


          <dtml-let field=sequence-item field_id="field.id"
                    value="proxy_field.get_recursive_tales(field_id)">
            <tr>
              <td align="left" valign="top">
                <dtml-let checkbox_key="'surcharge_%s' % field_id" >
                  <dtml-if "proxy_field.is_delegated(field_id)">
                    <input type="checkbox" 
                           name="<dtml-var checkbox_key>" 
                           onclick="toggleFieldState(event)"
                           checked="checked" />
                  <dtml-else >
                    <input type="checkbox" 
                           onclick="toggleFieldState(event)"
                           name="<dtml-var checkbox_key>" />
                  </dtml-if >
                </dtml-let >
              </td>



              <td align="left" valign="top">
              <div class="form-label">
              <dtml-var "field.title()">
              </div>
              </td>
              <dtml-if "proxy_field.is_delegated(field_id)">
                <td align="left" valign="top" class="to_disable delegated">
                <dtml-var "field.render(value)">
                </td>
              <dtml-else >
                <td align="left" valign="top" class="to_disable">
                <dtml-var "field.render(value)">
                </td>
              </dtml-if>
              <td><div class="form-element">
              <dtml-var "current_field.form.get_field(field.id).meta_type">
              </div></td>
            </tr>
          </dtml-let>

        </dtml-in>

      </dtml-if>
    </dtml-let>
  </dtml-in>

  </dtml-let>
  </dtml-if>
  </dtml-let>

  <tr>
    <td align="left" valign="top">
    <div class="form-element">
    <input class="form-element" type="submit" name="submit" 
     value="Save Changes" /> 
    </div>
    </td>
  </tr>


</table>
</form>
<script type="text/javascript">
function isClass(object, className) {
        if (object.className != undefined){
        return (object.className.search('(^|\\s)' + className + '(\\s|$)') != -1);
        }
        return false;
}
function GetElementsWithClassName(elementName,className) {
        var allElements = document.getElementsByTagName(elementName);
        var elemColl = new Array();
        for (i = 0; i< allElements.length; i++) {
                if (isClass(allElements[i], className)) {
                        elemColl[elemColl.length] = allElements[i];
                }
        }
        return elemColl;
}
function normalEvent() { return true; }
function ignoreEvent() { return false; }

var class_deletaged_list = GetElementsWithClassName('td','delegated');
for(var i=0; i<class_deletaged_list.length; i++) {
  element = class_deletaged_list[i].childNodes[1];
  if (element.type == 'hidden'){
    element = element.nextSibling;
  }
  element.readOnly = true;
  if (element.type == 'checkbox'){
    element.onclick = ignoreEvent;
  }
}

function toggleFieldState(evt) {
  evt=(evt)?evt:event;
  var target=(evt.target)?evt.target:evt.srcElement;
  tr_parent = target.parentNode.parentNode;
  allElements = tr_parent.childNodes;
  for (i=0; i<allElements.length; i++) {
    if (isClass(allElements[i], 'to_disable')) {
      field = allElements[i].childNodes[1];
      if (field.type == 'hidden'){
        field = field.nextSibling;
      }
      if (field.readOnly){
        field.readOnly = false;
        if (field.type == 'checkbox'){
          field.onclick = normalEvent;
        }
      }
      else{
        field.readOnly = true;
        if (field.type == 'checkbox'){
          field.onclick = ignoreEvent;
        }
      }
    }
  }
}
</script>
<dtml-var manage_page_footer>