<%@ page buffer="8kb" autoFlush="true" %>
<%@ page pageEncoding="UTF-8" contentType="text/html; charset=UTF-8" %>
<%@ taglib prefix="zm" uri="com.zimbra.zm" %>
<%@ taglib prefix="app" uri="com.zimbra.htmlclient" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="fmt" uri="com.zimbra.i18n" %>
<app:handleError>
<zm:getMailbox var="mailbox"/>
<zm:composeUploader var="uploader"/>
<c:choose>
<c:when test="${not empty mailbox.prefs.locale}">
    <fmt:setLocale value='${mailbox.prefs.locale}' scope='request' />
</c:when>
<c:otherwise>
    <fmt:setLocale value='${pageContext.request.locale}' scope='request' />
</c:otherwise>
</c:choose>
<fmt:setBundle basename="/messages/ZhMsg" scope="request"/>

<c:choose>
    <c:when test="${zm:actionSet(param, 'actionNewGroup')or (param.action eq 'newcontactgroup')}">
        <c:set var="contactId" value=""/>
        <c:set var="newGroup" value="true"/>
        <fmt:message var="title" key="newGroup"/>
        <!--- yeah -->
    </c:when>
    <c:otherwise>
        <c:set var="contactId" value="${param.id}"/>
    </c:otherwise>
</c:choose>

<zm:computeSearchContext var="context" types="contact" usecache="true"/>
<c:set var="isCreate" value="${empty contactId}"/>

<c:choose>
    <c:when test="${isCreate}">
        <c:set var="contact" value="${null}"/>
    </c:when>
    <c:otherwise>
        <zm:getContact id="${contactId}" var="contact"/>
        <c:set var="messageKey" value="${contact.isGroup ? 'editGroup': 'editContact'}"/>
        <fmt:message var="title" key="${messageKey}">
            <fmt:param>${contact.displayFileAs}</fmt:param>
        </fmt:message>
    </c:otherwise>
</c:choose>

<c:choose>
    <c:when test="${not empty param.contactSearchQuery or not empty param.contactSearchNameQuery or not empty param.contactSearchPhoneticQuery or not empty param.contactSearchEmailQuery or not empty param.contactSearchDeptQuery}">
        <c:choose>
            <c:when test="${mailbox.features.contactsDetailedSearch}">
                <c:set var="nameQuery" value="${param.contactSearchNameQuery}"/>
                <c:set var="phoneticQuery" value="${param.contactSearchPhoneticQuery}"/>
                <c:set var="emailQuery" value="${param.contactSearchEmailQuery}"/>
                <c:set var="deptQuery" value="${param.contactSearchDeptQuery}"/>
                <c:set var="query" value="${nameQuery}"/>
            </c:when>
            <c:otherwise>
                <c:set var="query" value="${param.contactSearchQuery}"/>
            </c:otherwise>
        </c:choose>
        <c:choose>
            <c:when test="${param.contactLocation eq 'gal'}">
                <zm:searchGal var="searchGal" query="${query}" dept="${deptQuery}" email="${emailQuery}" type="account"/>
            </c:when>
            <c:otherwise>
                <c:if test="${not empty phoneticQuery}">
                    <c:set var="phoneticQueryString" value="#phoneticFirstName:${phoneticQuery} OR #phoneticLastName:${phoneticQuery}"/>
                    <c:choose>
                        <c:when test="${not empty query}">
                            <c:set var="query" value="(${query} OR ${phoneticQueryString})"/>
                        </c:when>
                        <c:otherwise>
                            <c:set var="query" value="(${phoneticQueryString})"/>
                        </c:otherwise>
                    </c:choose>
                </c:if>
                <c:if test="${not empty emailQuery}">
                    <c:set var="query" value="${query} to:${emailQuery}*"/>
                </c:if>
                <zm:search var="search" query="${query}" sort="nameAsc" types="contact" field="contact:" start="${0}" end="${0}" timezone="${mailbox.prefs.timeZone}" folderid=""/>
            </c:otherwise>
        </c:choose>
    </c:when>
    <c:otherwise>
        <zm:search var="search" query="is:local" limit="100" sort="nameAsc" types="contact" field="contact:" start="${0}" end="${0}" timezone="${mailbox.prefs.timeZone}" folderid=""/>
        <c:set var="query" value=""/>
    </c:otherwise>
</c:choose>

<c:choose>
    <c:when test="${zm:actionSet(param,'actionAddSepMembers')}">
        <c:set var="groupSearchContacts" value="${fn:split(param.nGroupMembers,',')}" scope="request"/>
    </c:when>
    <c:when test="${zm:actionSet(param,'actionContactAdd')}">
        <c:set var="groupSearchContacts" value="${paramValues.addToGroup}" scope="request"/>
    </c:when>
</c:choose>
    
</app:handleError>

<c:set var="isGroup" value="${contact.isGroup or newGroup}"/>

<c:set var="focusField" value="${isGroup ? 'nickname' : 'lastName'}"/>
<c:set var="toolbar">
    <table width=100%>
        <tr valign='middle'>
            <td class='TbBt'>
                <table class='Tb'>
                    <tr>
                        <app:button name="actionContactAdd" src="/img/contacts/ImgContactsPicker.png" tooltip="addSelected" text="addSelected"/>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
</c:set>


<app:view mailbox="${mailbox}" title="${title}" context="${context}" selected="contacts" contacts="true" tags="true" keys="false"
          onload="var e=document.getElementById('${focusField}'); if (e) e.focus();">

<zm:currentResultUrl var="currentUrl" disp="${isCreate ? 0 : 1}" value="" action="actionNewGroup" context="${context}"/>
<form action="${currentUrl}" method="post" accept-charset="utf-8">
    <table width=100%>
    <tr>
        <td class='TbTop' colspan="2">
            <app:editContactToolbar create="${isCreate}" context="${context}" keys="true"/>
        </td>
    </tr>
    <tr>
    <td class='ZhAppContent' valign="top">
    <table width="100%" >
        <tr>
        <td valign="top" width="50%">
            <app:editContact title="${title}" contact="${contact}" context="${context}" isgroup="true"/>
        </td>
        <td valign="top" width="50%">
        <table width=100% class="ZPropertySheet" cellspacing="6">
        <tr>
            <td class='TbTop'>
                ${toolbar}
            </td>
        </tr>
        <tr>
            <td class='SearchBar'>
                &nbsp;
                <c:choose>
                    <c:when test="${mailbox.features.contactsDetailedSearch}">

                        <label for="nameField"><fmt:message key="name"/>:</label>
                        <input type="text" id="nameField" class="searchField" style='width:10%' maxlength=2048 name='contactSearchNameQuery' value="${fn:escapeXml(nameQuery)}" onkeypress="return checkEnter(this,event)"/>

                        <span id="phoneticNameDisplay" style="display:${(empty param.contactLocation || param.contactLocation eq 'personal' || param.contactLocation eq 'contact') ? 'inline':'none'}">
                            <label for="phoneticNameField"><fmt:message key="phoneticName"/>:</label>
                            <input type="text" id="phoneticNameField" class="searchField" style='width:10%' maxlength=2048 name='contactSearchPhoneticQuery' value="${fn:escapeXml(phoneticQuery)}" onkeypress="return checkEnter(this,event)"/>
                        </span>

                        <label for="emailField"><fmt:message key="email"/>:</label>
                        <input type="text" id="emailField" class="searchField" style='width:10%' maxlength=2048 name='contactSearchEmailQuery' value="${fn:escapeXml(emailQuery)}" onkeypress="return checkEnter(this,event)"/>

                        <span id="departmentDisplay" style="display:${param.contactLocation eq 'gal' ? 'inline':'none'}">
                            <label for="deptField"><fmt:message key="department"/>:</label>
                            <input type="text" id="deptField" class="searchField" style='width:10%' maxlength=2048 name='contactSearchDeptQuery' value="${fn:escapeXml(deptQuery)}" onkeypress="return checkEnter(this,event)"/>
                        </span>

                    </c:when>
                    <c:otherwise>
                        <label for="findField"><fmt:message key="find"/>:</label>
                        <input type="text" id="findField" class="searchField" style='width:30%' maxlength=2048 name='contactSearchQuery' value="${fn:escapeXml(query)}" onkeypress="return checkEnter(this,event)">
                    </c:otherwise>
                </c:choose>
                <c:if test="${mailbox.features.contactsDetailedSearch}">
                    <script type="text/javascript">
                        function changeSearchType(value) {
                            var phonetic = document.getElementById("phoneticNameDisplay");
                            var department = document.getElementById("departmentDisplay");
                            if (phonetic) {
                                phonetic.style.display = (value=="contact") ? "inline":"none";
                            }
                            if (department) {
                                department.style.display = (value=="gal") ? "inline":"none";
                            }
                        }
                    </script>
                </c:if>
                &nbsp;
                <fmt:message key="in"/>
                &nbsp;
                <select name="contactLocation" <c:if test="${mailbox.features.contactsDetailedSearch}">onchange="changeSearchType(this.value)"</c:if>>
                    <c:if test="${mailbox.features.contacts}">
                        <option
                        <c:if test="${empty param.contactLocation eq 'personal'}">
                            selected
                        </c:if> value="contact"/>
                        <fmt:message key="searchPersonalContacts"/>
                    </c:if>
                    <c:if test="${mailbox.features.gal}">
                        <option
                        <c:if test="${param.contactLocation eq 'gal'}">selected</c:if> value="gal"/>
                        <fmt:message key="GAL"/>
                    </c:if>
                </select>
                <input id="doSearch" class="SearchButton" type=submit name='actionContactSearch' value="<fmt:message key="searchContacts"/>">
            </td>
        </tr>
        <tr>
            <td class='List' colspan="2">
                <app:contactAddListView groupMode="${true}" searchResult="${search}" searchGalResult="${searchGal}" uploader="${uploader}"/>
            </td>
        </tr>
        <!-- tr>
            <td>
                <span><fmt:message key="enterAddrBelow"/></span>
                <table width=100%>
                    <tr>
                        <td>
                            <textarea id="ngroupmembers" rows="4" cols="40" style="width:100%" name="nGroupMembers"></textarea>
                        </td>
                        <td align="center">
                            <input id="doAddMembers" class="tbButton" type=submit name='actionAddSepMembers' value="<fmt:message key="add"/>">
                        </td>
                    </tr>
                </table>
            </td>
        </tr -->
    </table>
</td>
        </tr>
        </table>
        </td>
        </tr>
<tr>
<td class='TbBottom'>
    <app:editContactToolbar create="${isCreate}" context="${context}" keys="false"/>
</td>
</tr>
        </table>
    <input type="hidden" name="doContactListViewAction" value="1"/>
    <input type="hidden" name="id" value="${contact.id}"/>
    <input type="hidden" name="crumb" value="${fn:escapeXml(mailbox.accountInfo.crumb)}"/>

        </form>

<SCRIPT TYPE="text/javascript">
<!--
var zclick = function(id) { var e = document.getElementById(id); if (e) e.click(); }

var checkEnter = function(f,e) {var k;if (window.event) k = window.event.keyCode;else if (e) k = e.which;else return true;
if (k == 13) { document.getElementById("doSearch").click();return false;} else {return true;}}
//-->

</SCRIPT>
<app:keyboard cache="ab.econtact" globals="false" passspecial="true" mailbox="${mailbox}">
<zm:bindKey message="editContact.Save" func="function() { zclick('SOPSAVE')}"/>
</app:keyboard>
        </app:view>
