sogo/UI/Templates/PreferencesUI/UIxPreferences.wox

<?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="PasswordPolicy.js,ckeditor/ckeditor.js"
  >
  <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
	><var:if condition="userHasMailAccess">
          <li target="mailOptionsView"><span><var:string
                label:value="Mail Options"/></span></li>
          <li target="identitiesView"><span><var:string
                label:value="Signature"/></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 id="generalView" class="tab">
	<label><var:string label:value="Language :"/>
          <var:popup list="languages" item="item"
            const:id="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"
            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"
	      string="itemShortDateFormatText" selection="userShortDateFormat"
	      /></label><br/>
	  <label><var:string label:value="Long Date Format :"/>
	    <var:popup list="longDateFormatsList" item="item"
	      const:id="longDateFormat"
	      string="itemLongDateFormatText" selection="userLongDateFormat"
	      /></label><br/>
	  <label><var:string label:value="Time Format :"/>
	    <var:popup list="timeFormatsList" item="item"
	      const:id="timeFormat"
	      string="itemTimeFormatText" selection="userTimeFormat"
              /></label><br/>
          <label><var:string label:value="Default module :"/>
            <var:popup list="availableModules" item="item"
              const:id="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"
	      string="itemWeekStartDay" selection="userWeekStartDay"
	      /></label><br/>
	  <label><var:string label:value="Day start time :"/>
	    <var:popup list="hoursList" item="item"
	      const:id="dayStartTime"
	      string="item" selection="userDayStartTime"
	      /></label>
	  <label><var:string label:value="Day end time :"/>
	    <var:popup list="hoursList" item="item"
	      const:id="dayEndTime"
	      string="item" selection="userDayEndTime"
	      /></label><br/>
	  <label><var:string label:value="First week of year :"/>
	    <var:popup list="firstWeekList" item="item"
	      const:id="firstWeek"
	      string="itemFirstWeekText" selection="userFirstWeek"
	      /></label><br/>
          <label><var:string label:value="Categories"/></label>
          <div id="categoriesListWrapper"
            ><table id="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="categoryList" 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="categoryAdd" class="bottomButton" href="#">
              <span><img rsrc:src="add-icon.png" label:title="Add" />
              </span></a>
            <a const:id="categoryDelete" class="bottomButton" href="#">
              <span><img rsrc:src="remove-icon.png" label:title="Delete" />
              </span></a>
          </div>
          <input type="hidden" const:id="categoriesValue" 
            const:name="categoriesValue" var:value="categoriesValue"/>
          <!-- 	  <br/> -->
          <!-- 	  <label><input class="checkBox" -->
          <!-- 	      type="checkbox" var:selection="reminderEnabled" -->
          <!-- 	      var:checked="reminderEnabled"/><var:string -->
          <!-- 	      label:value="Enable reminders for Calendar items"/></label><br/> -->
          <!-- 	  <label><input class="checkBox" -->
          <!-- 	      type="checkbox" var:selection="remindWithASound" -->
          <!-- 	      var:checked="remindWithASound"/><var:string -->
          <!-- 	      label:value="Play a sound when a reminder comes due"/></label><br/> -->
          <!-- 	  <label><var:string label:value="Default reminder :"/> -->
          <!-- 	    <var:popup list="reminderTimesList" item="item" -->
          <!-- 	      string="itemReminderTimeText" selection="userReminderTime"/></label> -->
	</div>
      </var:if
        ><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><var:string label:value="Check for new mail:"/>
	    <var:popup list="messageCheckList" item="item"
	      const:id="messageCheck"
	      string="itemMessageCheckText" selection="userMessageCheck"/></label><br/>
	  <label><var:string label:value="Forward messages:"/>
	    <var:popup list="messageForwardingList" item="item"
	      const:id="messageForwarding"
	      string="itemMessageForwardingText"
	      selection="userMessageForwarding"/></label><br/>
	  <var:popup list="replyPlacementList" item="item"
            const:id="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"
            string="itemSignaturePlacementText"
            selection="userSignaturePlacement"/>
          <br /><label><var:string label:value="Compose messages in"/></label>
	  <var:popup list="composeMessagesType" item="item"
            const:id="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"
              ><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="identitiesView" class="tab"
	  ><textarea const:id="signature" const:name="signature"
	    var:value="signature"
            /></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"
                  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/>

            </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="Forward to address :"/> 
                <input type="text" 
                  const:id="forwardAddress" 
                  const:name="forwardAddress"
                  var:value="forwardAddress"
                  size="30" /></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>
          </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>
  </form>
</var:component>