<?xml version="1.0" standalone="yes"?>
<!DOCTYPE var:component>
<var:component
  xmlns="http://www.w3.org/1999/xhtml"
  xmlns:var="http://www.skyrix.com/od/binding"
  xmlns:const="http://www.skyrix.com/od/constant"
  xmlns:uix="OGo:uix"
  xmlns:rsrc="OGo:url"
  xmlns:label="OGo:label"
  className="UIxPageFrame"
  title="title"
  const:popup="YES"
  const:jsFiles="RowEditionController.js,PasswordPolicy.js,ckeditor/ckeditor.js,skycalendar.js"
  >
  <script type="text/javascript">
    var localeCode = '<var:string value="localeCode"/>';
  </script>
  <form id="mainForm" var:href="ownPath">
    <div class="tabsContainer" id="preferencesTabs">
      <ul>
        <li target="generalView"><span>
            <var:string label:value="General" /></span></li>
	<var:if condition="userHasCalendarAccess">
          <li target="calendarOptionsView"><span><var:string
                label:value="Calendar Options"/></span></li>
	</var:if
          ><li target="contactsOptionsView"><span><var:string
              label:value="Contacts Options"/></span></li
          ><var:if condition="userHasMailAccess">
          <li target="mailOptionsView"><span><var:string
                label:value="Mail Options"/></span></li>
          <li target="mailAccountsView"><span><var:string
                label:value="IMAP Accounts"/></span></li>
          <var:if condition="isVacationEnabled"><li target="vacationView"><span><var:string
                  label:value="Vacation"/></span></li></var:if
            ><var:if condition="isForwardEnabled"><li target="forwardView"><span><var:string
                  label:value="Forward"/></span></li></var:if>
	</var:if
          ><var:if condition="shouldDisplayAdditionalPreferences">
          <li target="additionalView"><span>
              <var:string label:value="Additional Parameters"/></span></li>
 	</var:if
          ><var:if condition="shouldDisplayPasswordChange">
          <li target="passwordView"><span><var:string label:value="Password"/></span></li>
        </var:if>
      </ul>
      <div class="tabs">
        <div id="generalView" class="tab">
          <label><var:string label:value="Language :"/>
            <var:popup list="languages" item="item"
              const:id="language"
              const:name="language"
              string="languageText" 
              selection="language"
              label:noSelectionString="choose" /></label><br/>
          <label><var:string label:value="Current Time Zone :"/>
            <var:popup list="timeZonesList" item="item"
              const:id="timezone"
              const:name="timezone"
              string="item" selection="userTimeZone" /></label><br/>
          <br/>
          <div id="dateTimeFormat">
            <label><var:string label:value="Short Date Format :"/>
              <var:popup list="shortDateFormatsList" item="item"
                const:id="shortDateFormat"
                const:name="shortDateFormat"
                string="itemShortDateFormatText" selection="userShortDateFormat"
                /></label><br/>
            <label><var:string label:value="Long Date Format :"/>
              <var:popup list="longDateFormatsList" item="item"
                const:id="longDateFormat"
                const:name="longDateFormat"
                string="itemLongDateFormatText" selection="userLongDateFormat"
                /></label><br/>
            <label><var:string label:value="Time Format :"/>
              <var:popup list="timeFormatsList" item="item"
                const:id="timeFormat"
                const:name="timeFormat"
                string="itemTimeFormatText" selection="userTimeFormat"
                /></label><br/>
            <label><var:string label:value="Default module :"/>
              <var:popup list="availableModules" item="item"
                const:id="defaultModule"
                const:name="defaultModule"
                string="itemModuleText" selection="userDefaultModule"
                /></label>
          </div>
        </div>
        <var:if condition="userHasCalendarAccess">
          <div id="calendarOptionsView" class="tab">
            <label><var:string label:value="Week begins on :"/>
              <var:popup list="daysList" item="item"
                const:id="weekStartDay"
                const:name="weekStartDay"
                string="itemWeekStartDay" selection="userWeekStartDay"
                /></label><br/>
            <label><var:string label:value="Day start time :"/>
              <var:popup list="hoursList" item="item"
                const:id="dayStartTime"
                const:name="dayStartTime"
                string="item" selection="userDayStartTime"
                /></label>
            <label><var:string label:value="Day end time :"/>
              <var:popup list="hoursList" item="item"
                const:id="dayEndTime"
                const:name="dayEndTime"
                string="item" selection="userDayEndTime"
                /></label><br/>
            <label><input type="checkbox" 
                const:name="busyOffHours"
                const:id="busyOffHours"
                var:checked="busyOffHours" />
              <var:string label:value="Show time as busy outside working hours"/></label><br/>
            <label><var:string label:value="First week of year :"/>
              <var:popup list="firstWeekList" item="item"
                const:id="firstWeek"
                const:name="firstWeek"
                string="itemFirstWeekText" selection="userFirstWeek"
                /></label><br/>
            <label><var:string label:value="Default calendar :"/>
              <var:popup list="defaultCalendarList" item="item"
                const:id="defaultCalendar"
                const:name="defaultCalendar"
                string="itemCalendarText" selection="userDefaultCalendar"
                /></label><br/>

            <label><var:string label:value="Default events classification :"/>
              <var:popup list="calendarClassificationsList" item="item"
                const:id="eventsClassification"
                const:name="eventsClassification"
                string="itemClassificationText" selection="eventsDefaultClassification"
                /></label><br/>
            <label><var:string label:value="Default tasks classification :"/>
              <var:popup list="calendarClassificationsList" item="item"
                const:id="tasksClassification"
                const:name="tasksClassification"
                string="itemClassificationText" selection="tasksDefaultClassification"
                /></label><br/>

            <label><var:string label:value="Categories"/></label>
            <div id="calendarCategoriesListWrapper" class="listWrapper"
              ><table class="categoriesList" cellspacing="0">
                <thead>
                  <tr class="tableview"
                    ><th const:class="tbtv_headercell" const:id="nameTableHeader"
                      ><var:string label:value="Name"/></th
                      ><th const:class="tbtv_headercell" const:id="colorTableHeader"
                      ><var:string label:value="Color"/></th
                      ></tr
                    ></thead>
                <tbody>
                  <var:foreach list="calendarCategoryList" item="category">
                    <tr const:class="categoryListRow"
                      ><td const:class="categoryListCell"
                        ><var:string var:value="category"/></td
                        ><td const:class="categoryListCell"
                        ><div const:class="colorBox"><var:string var:value="categoryColor"
                            /></div></td
                        ></tr>
                  </var:foreach>
                </tbody>
              </table>
            </div>
            <div class="bottomToolbar">
              <a const:id="calendarCategoryAdd" class="bottomButton" href="#">
                <span><img rsrc:src="add-icon.png" label:title="Add" />
                </span></a>
              <a const:id="calendarCategoryDelete" class="bottomButton" href="#">
                <span><img rsrc:src="remove-icon.png" label:title="Delete" />
                </span></a>
            </div>
            <input type="hidden" const:id="calendarCategoriesValue" 
              const:name="calendarCategoriesValue" var:value="calendarCategoriesValue"/>
          </div>
        </var:if>
        <div id="contactsOptionsView" class="tab">
          <label><var:string label:value="Categories"/></label>
          <div id="contactsCategoriesListWrapper" class="listWrapper"
            ><table class="categoriesList" cellspacing="0">
              <thead>
                <tr class="tableview"
                  ><th const:class="tbtv_headercell" const:id="nameTableHeader"
                    ><var:string label:value="Name"/></th
                    ></tr
                  ></thead>
              <tbody>
                <var:foreach list="contactsCategoryList" item="category">
                  <tr const:class="categoryListRow"
                    ><td const:class="categoryListCell"
                      ><var:string var:value="category"/></td
                      ></tr>
                </var:foreach>
              </tbody>
            </table>
          </div>
          <div class="bottomToolbar">
            <a const:id="contactsCategoryAdd" class="bottomButton" href="#">
              <span><img rsrc:src="add-icon.png" label:title="Add" />
              </span></a>
            <a const:id="contactsCategoryDelete" class="bottomButton" href="#">
              <span><img rsrc:src="remove-icon.png" label:title="Delete" />
              </span></a>
          </div>
          <input type="hidden" const:id="contactsCategoriesValue" 
            const:name="contactsCategoriesValue" var:value="contactsCategoriesValue"/>
        </div>
        <var:if condition="userHasMailAccess">
          <div id="mailOptionsView" class="tab">
            <label><input type="checkbox" 
                const:name="subscribedFoldersOnly"
                const:id="subscribedFoldersOnly"
                var:checked="showSubscribedFoldersOnly" />
              <var:string label:value="Show subscribed mailboxes only"/></label><br/>
            <label><input type="checkbox" 
                const:name="sortByThreads"
                const:id="sortByThreads"
                var:checked="sortByThreads" />
              <var:string label:value="Sort messages by threads"/></label><br/>
            <label><var:string label:value="Check for new mail:"/>
              <var:popup list="messageCheckList" item="item"
                const:id="messageCheck"
                const:name="messageCheck"
                string="itemMessageCheckText" selection="userMessageCheck"/></label><br/>
            <label><var:string label:value="Forward messages:"/>
              <var:popup list="messageForwardingList" item="item"
                const:id="messageForwarding"
                const:name="messageForwarding"
                string="itemMessageForwardingText"
                selection="userMessageForwarding"/></label><br/>
            <var:popup list="replyPlacementList" item="item"
              const:id="replyPlacementList"
              const:name="replyPlacementList"
              string="itemReplyPlacementText"
              selection="userReplyPlacement"/>
            <br /><label><var:string label:value="And place my signature"/></label>
            <var:popup list="signaturePlacementList" item="item"
              const:id="signaturePlacementList"
              const:name="signaturePlacementList"
              string="itemSignaturePlacementText"
              selection="userSignaturePlacement"/>
            <br /><label><var:string label:value="Compose messages in"/></label>
            <var:popup list="composeMessagesType" item="item"
              const:id="composeMessagesType"
              const:name="composeMessagesType"
              string="itemComposeMessagesText"
              selection="userComposeMessagesType"/>
            <var:if condition="isSieveScriptsEnabled"
              ><br/><label><var:string label:value="Filters"/></label>
              <script type="text/javascript">
                var sieveCapabilities = <var:string value="sieveCapabilities" const:escapeHTML="NO"/>;
              </script>
              <div id="filtersListWrapper" class="listWrapper"
                ><table id="filtersList" cellspacing="0">
                  <thead>
                    <tr class="tableview"
                      ><th const:class="tbtv_headercell" const:id="nameTableHeader"
                        ><var:string label:value="Name" /></th
                        ><th const:class="tbtv_headercell" const:id="activeTableHeader"
                        ><var:string label:value="Active" /></th
                        ></tr
                      ></thead>
                  <tbody><!--space --></tbody>
                </table>
                <input type="hidden" const:name="sieveFilters" const:id="sieveFilters"
                  var:value="sieveFiltersValue"/>
              </div>
              <div class="bottomToolbar">
                <a const:id="filterAdd" class="bottomButton" href="#">
                  <span><img rsrc:src="add-icon.png" label:title="Add" />
                  </span></a>
                <a const:id="filterDelete" class="bottomButton" href="#">
                  <span><img rsrc:src="remove-icon.png" label:title="Delete" />
                  </span></a>
                <a const:id="filterMoveUp" class="bottomButton" href="#">
                  <span><img rsrc:src="up-icon.png" label:title="Move Up" />
                  </span></a>
                <a const:id="filterMoveDown" class="bottomButton" href="#">
                  <span><img rsrc:src="down-icon.png" label:title="Move Down" />
                  </span></a>
              </div>
            </var:if>
          </div>

          <div id="mailAccountsView" class="tab">
            <input type="hidden" const:name="mailAccountsJSON" const:id="mailAccountsJSON"
              var:value="mailAccounts"/>
            <div id="mailAccountsListWrapper" class="listWrapper"
                 ><ul id="mailAccountsList"
                      ><!-- space --></ul
                      ></div>
            <var:if condition="mailAuxiliaryUserAccountsEnabled">
              <div const:id="mailAccountsToolbar" class="bottomToolbar">
                <a const:id="mailAccountAdd" class="bottomButton" href="#">
                  <span><img rsrc:src="add-icon.png" label:title="Add" />
                </span></a>
                <a const:id="mailAccountDelete" class="bottomButton" href="#">
                  <span><img rsrc:src="remove-icon.png" label:title="Delete" />
                </span></a>
              </div>
            </var:if>
            <div id="mailAccountEditor">
              <fieldset const:id="accountInfo">
                <label><var:string label:value="Server Name:"/>
                  <input const:name="serverName" const:id="serverName" type="text" const:value=""/></label>
                <label><var:string label:value="Port:"/>
                  <input const:name="port" const:id="port" type="text" const:value=""/></label><br/>
                <var:string label:value="Encryption:"/>
                <label><input const:name="encryption" type="radio" const:value="none"/>
                  <var:string label:value="None"/></label>
                <label><input const:name="encryption" type="radio" const:value="ssl"/>
                  <var:string label:value="SSL"/></label>
                <label><input const:name="encryption" type="radio" const:value="tls"/>
                  <var:string label:value="TLS"/></label><br/>
                <label><var:string label:value="User Name:"/>
                  <input const:name="userName" const:id="userName" type="text" const:value=""/></label><br/>
                <label><var:string label:value="Password:"/>
                  <input const:name="password" const:id="password" type="password" const:value=""/></label>

                  <input const:name="encryption" type="hidden" const:value="none"/>
              </fieldset>

              <script type="text/javascript">
                var mailCustomFromEnabled = <var:string value="mailCustomFromEnabled" const:escapeHTML="NO"/>;
              </script>

              <fieldset const:id="identityInfo">
                <label><var:string label:value="Full Name:"/>
                  <input const:name="fullName" const:id="fullName" type="text" const:value=""
                    /></label><br/>
                <label><var:string label:value="Email:"/>
                  <input const:name="email" const:id="email" type="text" const:value=""/></label><br/>
                <label><var:string label:value="Reply To Email:"/>
                  <input const:name="replyTo" const:id="replyTo" type="text" const:value=""/></label><br/>
                <var:string label:value="Signature:"/>
                <span id="actSignature"><!--space --></span>
              </fieldset>

              <fieldset const:id="returnReceiptsInfo">
                <var:string
                    label:value="When I receive a request for a return receipt:"
                    /><br/>
                <label><input const:name="receipt-action" const:id="receipt-action-ignore"
                    type="radio" const:value="ignore"/>
                  <var:string
                    label:value="Never send a return receipt"/></label
                  ><br/>
                <label><input const:name="receipt-action" const:id="receipt-action-allow"
                    type="radio" const:value="allow"/>
                  <var:string
                    label:value="Allow return receipts for some messages"/></label
                  ><br/>
                <div id="receiptOptions">
                  <var:string
                    label:value="If I'm not in the To or Cc of the message:"/>
                  <select name="receipt-non-recipient-action" id="receipt-non-recipient-action">
                    <option const:value="ignore"><var:string label:value="Never send"/></option>
                    <option const:value="send"><var:string label:value="Always send"/></option>
                    <option const:value="ask"><var:string label:value="Ask me"/></option>
                  </select><br/>

                  <var:string
                    label:value="If the sender is outside my domain:"/>
                  <select name="receipt-outside-domain-action" id="receipt-outside-domain-action">
                    <option const:value="ignore"><var:string label:value="Never send"/></option>
                    <option const:value="send"><var:string label:value="Always send"/></option>
                    <option const:value="ask"><var:string label:value="Ask me"/></option>
                  </select><br/>

                  <var:string
                    label:value="In all other cases:"/>
                  <select name="receipt-any-action" id="receipt-any-action">
                    <option const:value="ignore"><var:string label:value="Never send"/></option>
                    <option const:value="send"><var:string label:value="Always send"/></option>
                    <option const:value="ask"><var:string label:value="Ask me"/></option>
                  </select><br/>
                </div>
              </fieldset>
            </div>
          </div>

          <var:if condition="isVacationEnabled">
            <div id="vacationView" class="tab">
              <label><input type="checkbox" 
                  const:name="enableVacation"
                  const:id="enableVacation"
                  var:checked="enableVacation" />
                <var:string label:value="Enable vacation auto reply"/></label>
              <div id="vacation">
                <label><var:string label:value="Auto reply message :"/><br/>
                  <textarea const:name="autoReplyText"
                    const:id="autoReplyText"
                    var:value="autoReplyText"/>
                </label><br/>
                
                <label><var:string label:value="Email addresses (separated by commas) :"/><br/>
                  <input type="hidden"
                    const:id="defaultEmailAddresses"
                    var:value="defaultEmailAddresses" />
                  <textarea const:name="autoReplyEmailAddresses"
                    const:id="autoReplyEmailAddresses"
                    var:value="autoReplyEmailAddresses" /><br/>
                  <span><a href="#" class="button" id="addDefaultEmailAddresses"><span>
                        <var:string label:value="Add default email addresses" /></span></a>
                  </span>
                </label><br/>

                <label><var:string label:value="Days between responses :"/> 
                  <var:popup list="daysBetweenResponsesList" item="item"
                    const:id="daysBetweenResponsesList"
                    const:name="daysBetweenResponsesList"
                    string="item" 
                    selection="daysBetweenResponses" /></label><br/>

                <label><input type="checkbox" 
                    const:name="ignoreLists"
                    const:id="ignoreLists"
                    var:checked="ignoreLists" />
                  <var:string label:value="Do not send responses to mailing lists" /></label><br/>

                <label class="timeDate"><input var:checked="enableVacationEndDate"
                    const:name="enableVacationEndDate" const:id="enableVacationEndDate" type="checkbox" class="checkBox"
                /><var:string label:value="Disable auto reply on" /><var:component className="UIxTimeDateControl"
                    const:displayTimeControl="0"
                    var:disabled="disableVacationEndDate"
                    const:controlID="vacationEndDate"
                    date="vacationEndDate"
                    const:dayStartHour="0"
                    const:dayEndHour="23"
                /></label>

              </div>
            </div>
          </var:if
            ><var:if condition="isForwardEnabled">
            <div id="forwardView" class="tab">
              <label><input type="checkbox" 
                  const:name="enableForward"
                  const:id="enableForward"
                  var:checked="enableForward" />
                <var:string label:value="Forward incoming messages"/></label><br/>
              
              <div id="forward">
                <label><var:string label:value="Email addresses (separated by commas) :"/><br/>
                  <textarea const:name="forwardAddress"
                    const:id="forwardAddress"
                    var:value="forwardAddress" />
                </label><br/>

                <label><input type="checkbox" 
                    const:name="forwardKeepCopy"
                    const:id="forwardKeepCopy"
                    var:checked="forwardKeepCopy" />
                  <var:string label:value="Keep a copy" /></label><br/>

              </div>
            </div>
          </var:if
            ></var:if
          ><var:if condition="shouldDisplayPasswordChange">
          <div id="passwordView" class="tab">
            <p id="passwordFields"><label><var:string label:value="New password:"
                  /><input const:id="newPasswordField" class="textField"
                  type="password" const:value=""/></label><br/>
              <label><var:string label:value="Confirmation:"
                  /><input const:id="newPasswordConfirmationField" class="textField"
                  type="password" const:value=""/></label><br/>
              <a href="#" class="button" id="changePasswordBtn"
                ><span><var:string label:value="Change"/></span></a><br/>
            </p>
            <p id="passwordError"><!-- space --></p>
          </div>
        </var:if
          ><var:if condition="shouldDisplayAdditionalPreferences"
          ><div id="additionalView" class="tab">
            <var:component className="UIxAdditionalPreferences"/>
          </div></var:if>
        <input type="hidden" id="hasChanged" name="hasChanged"
          var:value="hasChanged"/>
      </div>
    </div>
  </form>
</var:component>
