<%@ 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"/>
    <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"/>
    
    <zm:fileUploader var="uploader"/>
    <c:if test="${uploader.isUpload}">
        <zm:checkCrumb crumb="${uploader.paramValues.crumb[0]}"/>
        <app:addressBookAction/>
    </c:if>
    <c:choose>
        <c:when test="${not empty requestScope.newlyCreatedAddressBookId}">
            <c:set var="selectedFolder" value="${zm:getFolder(pageContext, requestScope.newlyCreatedAddressBookId)}"/>
        </c:when>
        <c:when test="${not empty param.id}">
            <c:set var="selectedFolder" value="${zm:getFolder(pageContext, param.id)}"/>
        </c:when>
        <c:when test="${not empty param.sfi}">
            <c:set var="selectedFolder" value="${zm:getFolder(pageContext, param.sfi)}"/>
        </c:when>
    </c:choose>
    <c:if test="${empty selectedFolder or not (selectedFolder.isContactView or selectedFolder.isTrash)}"><c:set var="selectedFolder" value="${mailbox.contacts}"/></c:if>
    <c:set var="newAddressBook" value="${not empty uploader.params.actionNewAddressBook or not empty uploader.params.actionNewSharedAddressBook}"/>

    <fmt:message var="title" key="manageAddressBooks"/>
    <c:set var="selectedRow" value="${-1}"/>
 
</app:handleError>

<app:view mailbox="${mailbox}" title="${title}" context="${null}" selected='contacts' contacts="true" editmode="true" keys="true"
            onload="var e=document.getElementById('newName'); if (e) e.focus();">
    <form action="" method="post" enctype="multipart/form-data" accept-charset="utf-8">
        <table width="100%" cellspacing="0" cellpadding="0">
            <tr>
                <td class='TbTop'>
                    <table width="100%" cellspacing="0">
                        <tr>
                            <td class='TbBt'>
                                <table cellspacing="0" cellpadding="0" class='Tb'>
                                    <tr>
                                        <td>
                                            <a id="OPCLOSE" href="<c:url value="/h/search?st=contact"/>">
                                                <app:img src="common/ImgClose.png" alt="close"/><span style='padding-left:5px'><fmt:message key="close"/></span>
                                            </a>
                                        </td>
										<c:if test="${mailbox.features.newAddrBookEnabled}">
											<td><div class='vertSep'></div></td>
											<app:button id="OPNEWADDRBOOK" name="actionNewAddressBook" src="contacts/ImgNewContact.png" tooltip="addressBookNew" text="addressBookNew"/>
										</c:if>
                                        <c:if test="${mailbox.features.sharing}">
                                        <td><div class='vertSep'></div></td>
                                        <app:button id="OPNEWLINK" name="actionNewSharedAddressBook" src="contacts/ImgNewContact.png" tooltip="addressBookNewShared" text="addressBookNewShared"/>
                                        </c:if>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
            <tr>
                <td class='ZhAppContent'>
                    <table border="0" cellpadding="0" cellspacing="0" width="100%">
                        <tr>
                            <td width="200" class='List' valign='top'>
                                <table width="100%" cellpadding="2" cellspacing="0">
                                    <c:set var="anyInTrash" value="${false}"/>
                                    <c:set var="index" value="${0}"/>
                                    <zm:forEachFolder var="folder">
                                        <c:if test="${not anyInTrash and folder.isInTrash}">
                                            <c:set var="anyInTrash" value="${true}"/>
                                        </c:if>
										<%-- Kind of hacky here using newAddrBookEnabled to tell whether or not Emailed Contacts are shown... --%>
										<c:set var="omit" value="${folder.isAutoContacts and not mailbox.features.newAddrBookEnabled}"/>
										<c:if test="${folder.isContactView and not folder.isInTrash and not omit}">
                                            <fmt:message var="colorMsg" key="${folder.rgbColorMsg}"/>
                                            <c:set var="rowColor" value="${zm:lightenColor(not empty folder.rgb ? folder.rgb : colorMsg)}"/>
                                            <c:set var="selected" value="${selectedFolder.id eq folder.id and not newAddressBook}"/>
                                            <c:if test="${selected}"><c:set var="selectedRow" value="${index}"/></c:if>
                                            <tr>
                                                <td style='background-color:${rowColor}' width="1%">&nbsp;</td>
                                                <td style='padding-left:${folder.depth*8}px; background-color:${rowColor}'>
                                                    <c:set var="label" value="${zm:getFolderName(pageContext, folder.id)}"/>
                                                    <c:url var="selectUrl" value="">
                                                        <c:param name="id" value="${folder.id}"/>
                                                    </c:url>
                                                    <a id="A${index}" href="${selectUrl}">
                                                        <app:img src="${folder.image}" alt="folder"/>
                                                            <span <c:if test="${selected}">class='ZhTISelected'</c:if> style='vertical-align:middle'>${label}</span>
                                                    </a>
                                                </td>
                                            </tr>
                                            <c:set var="index" value="${index+1}"/>
                                        </c:if>
                                    </zm:forEachFolder>
                                    
                                    <c:if test="${anyInTrash}">
                                        <zm:forEachFolder var="folder">
                                            <c:if test="${folder.isTrash or (folder.isContactView and folder.isInTrash)}">
                                                <c:set var="selected" value="${selectedFolder.id eq folder.id and not newAddressBook}"/>
                                                <fmt:message var="colorMsg" key="${folder.rgbColorMsg}"/>
                                                <c:set var="rowColor" value="${zm:lightenColor(not empty folder.rgb ? folder.rgb : colorMsg)}"/>
                                            <c:if test="${selected}"><c:set var="selectedRow" value="${index}"/></c:if>                                                                                            
                                                <tr>
                                                    <td <c:if test="${not folder.isTrash}">class='${rowColor}'</c:if> width="1%">
                                                        &nbsp;
                                                    </td>
                                                    <td <c:if test="${not folder.isTrash}">class='${rowColor}'</c:if> style='padding-left: ${folder.depth*8}px'>
                                                        <c:set var="label" value="${zm:getFolderName(pageContext, folder.id)}"/>
                                                        <c:url var="selectUrl" value="">
                                                            <c:param name="id" value="${folder.id}"/>
                                                        </c:url>
                                                        <a id="A${index}" href="${selectUrl}">
                                                            <app:img src="${folder.image}" alt="folder"/>
                                                            <span <c:if test="${selected}">class='ZhTISelected'</c:if> style='vertical-align:middle'>${label}</span>
                                                        </a>
                                                    </td>
                                                </tr>
                                                <c:set var="index" value="${index+1}"/>
                                            </c:if>
                                        </zm:forEachFolder>
                                    </c:if> 
                                </table>
                            </td>
                            <td class='ZhEditAddressBookContent' valign='top'>
                                <c:choose>
                                    <c:when test="${not empty uploader.params.actionNewAddressBook}">
                                        <app:newFolder addressbook="true"/>
                                    </c:when>
                                    <c:when test="${not empty uploader.params.actionNewSharedAddressBook}">
                                        <app:newFolder addressbook="true" link="true"/>
                                    </c:when>
                                    <c:otherwise>
                                        <app:editFolder folder="${selectedFolder}"/>
                                    </c:otherwise>
                                </c:choose>
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
        <input type="hidden" name="doAction" value="1"/>
        <input type="hidden" name="crumb" value="${fn:escapeXml(mailbox.accountInfo.crumb)}"/>
    </form>
    <SCRIPT TYPE="text/javascript">
    <!--
    var zrc = ${index};
    var zindex = ${selectedRow};
    var zclick = function(id) { var e2 = document.getElementById(id); if (e2) e2.click(); }
    var zget = function(i) { var e = document.getElementById("A"+i); if (e && e.href) window.location = e.href; }
    var zprev = function() { if (zindex > 0) zget(zindex-1);}
    var znext = function() { if (zindex+1 < zrc) zget(zindex+1);}
    //-->
    </SCRIPT>
    <app:keyboard cache="ab.maddrbooks" mailbox="${mailbox}" globals="true" passspecial="true">
        <zm:bindKey message="global.Cancel" id="OPCLOSE"/>
        <zm:bindKey message="maddrbooks.NewAddressBook" func="function() {zclick('SOPNEWADDRBOOK');}"/>
        <zm:bindKey message="maddrbooks.NewLink" func="function() {zclick('SOPNEWLINK');}"/>
        <zm:bindKey message="mfolders.Save" func="function() {zclick('OPSAVE');}"/>        
        <zm:bindKey message="global.PreviousItem" func="zprev"/>
        <zm:bindKey message="global.NextItem" func="znext"/>        
    </app:keyboard>
</app:view>
