<?xml version="1.0"?>
<!-- ***** BEGIN LICENSE BLOCK *****
   - Version: MPL 1.1/GPL 2.0/LGPL 2.1
   -
   - 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 Mozilla Communicator client code, released
   - March 31, 1998.
   -
   - The Initial Developer of the Original Code is
   - Netscape Communications Corporation.
   - Portions created by the Initial Developer are Copyright (C) 1998-1999
   - the Initial Developer. All Rights Reserved.
   -
   - Contributor(s):
   -   Ben "Count XULula" Goodger
   -
   - Alternatively, the contents of this file may be used under the terms of
   - either of the GNU General Public License Version 2 or later (the "GPL"),
   - or the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
   - in which case the provisions of the GPL or the LGPL are applicable instead
   - of those above. If you wish to allow use of your version of this file only
   - under the terms of either the GPL or the LGPL, and not to allow others to
   - use your version of this file under the terms of the MPL, indicate your
   - decision by deleting the provisions above and replace them with the notice
   - and other provisions required by the GPL or the LGPL. If you do not delete
   - the provisions above, a recipient may use your version of this file under
   - the terms of any one of the MPL, the GPL or the LGPL.
   -
   - ***** END LICENSE BLOCK ***** -->

<!-- first checkin of the year 2000!      -->
<!-- Ben Goodger, 12:50AM, 01/00/00 NZST  -->

<?xml-stylesheet href="chrome://editor/skin/editor.css" type="text/css"?>
<?xml-stylesheet href="chrome://editor/skin/EditorDialog.css" type="text/css"?>

<!-- May not need this here -->
<!-- <?xul-overlay href="chrome://editor/content/EdDialogOverlay.xul"?> -->

<!DOCTYPE dialog SYSTEM "chrome://editor/locale/EdAdvancedEdit.dtd">
<dialog title="&WindowTitle.label;"
    id="advancedEditDlg"
    style="width: 40em;"
    xmlns ="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
    onload="Startup()"
    buttons="accept,cancel"
    ondialogaccept="return onAccept();"
    ondialogcancel="return onCancel();">

  <!-- Methods common to all editor dialogs -->
  <script type="application/javascript" src="chrome://editor/content/editorUtilities.js"/>
  <script type="application/javascript" src="chrome://editor/content/EdDialogCommon.js"/>
  <!-- element page functions -->
  <script type="application/javascript" src="chrome://editor/content/EdAEHTMLAttributes.js"/>
  <script type="application/javascript" src="chrome://editor/content/EdAECSSAttributes.js"/>
  <script type="application/javascript" src="chrome://editor/content/EdAEJSEAttributes.js"/>
  <script type="application/javascript" src="chrome://editor/content/EdAEAttributes.js"/>

  <!-- global dialog functions -->
  <script type="application/javascript" src="chrome://editor/content/EdAdvancedEdit.js"/>

  <broadcaster id="args" value=""/>

  <hbox>
    <label value="&currentattributesfor.label;"/>
    <label class="header" id="tagLabel"/>
  </hbox>
  
  <separator class="thin"/>
  
  <tabbox flex="1">
    <tabs>
      <tab label="&tabHTML.label;"/>
      <tab label="&tabCSS.label;"/>
      <tab label="&tabJSE.label;" id="tabJSE"/>
    </tabs>
    <tabpanels flex="1">
      <!-- ============================================================== -->
      <!--                        HTML Attributes                         -->
      <!-- ============================================================== -->
      <vbox>
        <tree id="HTMLATree" class="AttributesTree" flex="1"
          hidecolumnpicker="true" seltype="single"
          onselect="onSelectHTMLTreeItem();"
          onclick="onSelectHTMLTreeItem();"
          ondblclick="editHTMLAttributeValue(event.target);">
          <treecols>
            <treecol id="HTMLAttrCol" flex="35" label="&tree.attributeHeader.label;"/>
            <splitter class="tree-splitter"/>
            <treecol id="HTMLValCol" flex="65" label="&tree.valueHeader.label;"/>
          </treecols>
          <treechildren id="HTMLAList" class="gridlines" flex="1"/>
        </tree>
        <hbox align="center">
          <label value="&editAttribute.label;"/>
          <spacer flex="1"/>
          <button label="&removeAttribute.label;" oncommand="RemoveHTMLAttribute();"/>
        </hbox>
        <grid>
          <columns>
            <column flex="1"/><column flex="1"/>
          </columns>
          <rows>
            <row equalsize="always">
              <label control="AddHTMLAttributeNameInput" value="&AttName.label;"/>
              <label control="AddHTMLAttributeValueInput" value="&AttValue.label;"/>
            </row>
            <row align="top" equalsize="always">
              <!-- Lists are built at runtime -->
              <menulist id="AddHTMLAttributeNameInput" editable="true" flex="1"
                        oninput="onInputHTMLAttributeName();"
                        oncommand="onInputHTMLAttributeName();"/>
              <deck id="AddHTMLAttributeValueDeck" selectedIndex="0">
                <hbox align="top">
                  <textbox id="AddHTMLAttributeValueTextbox" flex="1"
                           oninput="onInputHTMLAttributeValue();"/>
                </hbox>
                <hbox align="top">
                  <menulist id="AddHTMLAttributeValueMenulist" editable="true" flex="1"
                            oninput="onInputHTMLAttributeValue();"
                            oncommand="onInputHTMLAttributeValue();"/>
                </hbox>
              </deck>
            </row>
          </rows>
        </grid>
      </vbox>
      <!-- ============================================================== -->
      <!--                         CSS Attributes                         -->
      <!-- ============================================================== -->
      <vbox>
        <tree id="CSSATree" class="AttributesTree" flex="1"
          hidecolumnpicker="true" seltype="single"
          onselect="onSelectCSSTreeItem();"
          onclick="onSelectCSSTreeItem();"
          ondblclick="editCSSAttributeValue(event.target);">
          <treecols>
            <treecol id="CSSPropCol" flex="35" label="&tree.propertyHeader.label;"/>
            <splitter class="tree-splitter"/>
            <treecol id="CSSValCol" flex="65" label="&tree.valueHeader.label;"/>
          </treecols>
          <treechildren id="CSSAList" class="gridlines" flex="1"/>
        </tree>
        <hbox align="center">
          <label value="&editAttribute.label;"/>
          <spacer flex="1"/>
          <button label="&removeAttribute.label;" oncommand="RemoveCSSAttribute();"/>
        </hbox>
        <grid>
          <columns>
            <column flex="1"/><column flex="1"/>
          </columns>
          <rows>
            <row equalsize="always">
              <label value="&PropertyName.label;"/>
              <label value="&AttValue.label;"/>
            </row>
            <row align="top" equalsize="always">
              <textbox id="AddCSSAttributeNameInput" flex="1"
                oninput="onInputCSSAttributeName();"/>
          	  <textbox id="AddCSSAttributeValueInput" flex="1"
                oninput="onChangeCSSAttribute();"/>
            </row>
          </rows>
        </grid>
      </vbox>
      <!-- ============================================================== -->
      <!--                    JavaScript Event Handlers                   -->
      <!-- ============================================================== -->
      <vbox>
        <tree id="JSEATree" class="AttributesTree" flex="1"
          hidecolumnpicker="true" seltype="single"
          onselect="onSelectJSETreeItem();"
          onclick="onSelectJSETreeItem();"
          ondblclick="editJSEAttributeValue(event.target);">
          <treecols>
            <treecol id="AttrCol" flex="35" label="&tree.attributeHeader.label;"/>
            <splitter class="tree-splitter"/>
            <treecol id="HeaderCol" flex="65" label="&tree.valueHeader.label;"/>
          </treecols>
          <treechildren id="JSEAList" class="gridlines" flex="1"/>
        </tree>
        <hbox align="center">
          <label value="&editAttribute.label;"/>
          <spacer flex="1"/>
          <button label="&removeAttribute.label;" oncommand="RemoveJSEAttribute()"/>
        </hbox>
        <grid>
          <columns>
            <column flex="1"/><column flex="1"/>
          </columns>
          <rows>
            <row equalsize="always">
              <label value="&AttName.label;"/>
              <label value="&AttValue.label;"/>
            </row>
            <row align="top" equalsize="always">
              <!-- List is built at runtime -->
              <menulist id="AddJSEAttributeNameList" flex="1"
                oncommand="onSelectJSEAttribute();"/>
          	  <textbox id="AddJSEAttributeValueInput" flex="1"
                oninput="onInputJSEAttributeValue();"/>
            </row>
          </rows>
        </grid>
      </vbox>
    </tabpanels>
  </tabbox>
</dialog>
