<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>

<%@taglib prefix="a4j" uri="http://richfaces.org/a4j"%>
<%@taglib prefix="rich" uri="http://richfaces.org/rich"%>

<%@taglib prefix="p" uri="http://primefaces.prime.com.tr/ui"%>
<%@taglib prefix="f" uri="http://java.sun.com/jsf/core"%>
<%@taglib prefix="h" uri="http://java.sun.com/jsf/html"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<f:subview id="clients_admin">
    <html>
        <body>
            <h:form id="clientForm">
                <p:growl id="msg" showDetail="true"/>
                <div id="qb-menu" class="unselectable">
                    <ul>
                        <li onclick="javascript: newClientDialog.show();">
                            <a>
                                <h:graphicImage value="../images/toSystem.png" width="18" height="18"
                                                style="position: relative; top: 3px;"/>
                                <rich:spacer width="2px" />
                                <h:outputText value="  #{msg.add}" styleClass="unselectable" />
                            </a>
                        </li>
                        <li onclick="javascript: confirmationClient.show();">
                            <a>
                                <h:graphicImage value="../images/bin.png" width="18" height="18"
                                                style="position: relative; top: 3px;"/>
                                <rich:spacer width="2px" />
                                <h:outputText value="#{msg.remove}" styleClass="unselectable" />
                            </a>
                        </li>
                    </ul>
                </div>

                <rich:tree style="width:340px"
                           id="clientTree"
                           nodeSelectListener="#{user.clientsTree.processSelection}"
                           switchType="client" ajaxSubmitSelection="true"
                           value="#{user.clientsTree.tree}" ajaxKeys="#{null}"
                           icon="/images/safe.png"
                           reRender="info"
                           iconLeaf="/images/house.png">
                </rich:tree>

                <div style="position: absolute; right: 0px; top: 0px;">
                    <p:panel header="Informacie o zálohovacom klientovi" id="info"
                             style="width: 600px; height: 400px;">

                        <h:panelGrid columns="1">
                            <h:outputText value="#{msg.clientName}:" style="font-weight:bold;"/>
                            <h:outputText value="#{user.clientsTree.selectedNode.clientName}" />

                            <h:outputText value="#{msg.clientID}" style="font-weight:bold;"/>
                            <h:outputText value="#{user.clientsTree.selectedNode.clientId}"/>

                            <h:outputText value="Zálohovaný na disk:" style="font-weight:bold;"/>
                            <h:outputText value="#{user.clientsTree.selectedNode.backupDisk.diskName}"/>

                            <h:outputText value="Typ zalohovania:" style="font-weight:bold;"/>
                            <h:outputText value="#{user.clientsTree.selectedNode.type}"/>

                            <h:outputText value="Počet zaloh:" style="font-weight:bold;"/>
                            <h:outputText value="#{user.clientsTree.selectedNode.backupsCount}"/>

                        </h:panelGrid>
                    </p:panel>
                </div>
            </h:form>

            <h:form>
                <%-- Dialog pre pridanie uzivatela --%>
                <p:dialog id="addUserDialog"
                          header="Pridať nového užívateľa" widgetVar="newClientDialog"
                          resizable="false" closable="true"
                          width="400" styleClass="dialogIcon toSystem">
                    <h:panelGrid columns="1">

                        <h:outputText value="#{msg.clientName}:" />
                        <h:inputText value="#{clients.client.clientName}" styleClass="form-login"
                                     title="Client_name" size="30" maxlength="2048" />

                        <h:outputText value="#{msg.clientID}" />
                        <h:inputText value="#{clients.client.clientId}" styleClass="form-login"
                                     title="Client_id" size="30" maxlength="2048" />

                        <h:outputText value="#{msg.clientPassword}:" />
                        <h:inputSecret value="#{clients.client.password}" styleClass="form-login"
                                       title="Client_password" size="30" maxlength="2048"/>

                        <h:outputText value="Typ zalohovania:" />
                        <h:selectOneMenu id="editBackupType"
                                         value="#{clients.client.type}"
                                         style="text-size: 8px;">
                            <f:selectItems value="#{user.backupTypes}" />
                        </h:selectOneMenu>

                        <h:outputText value="Ukladať na disk:" />
                        <h:selectOneMenu id="editBackupDisk"
                                         value="#{clients.selectedDisk}"
                                         style="text-size: 8px;">
                            <f:selectItems value="#{user.backupDisks}" />
                        </h:selectOneMenu>

                        <a4j:commandLink actionListener="#{clients.addClient}"
                                         onclick="javascript: newClientDialog.hide();"
                                         reRender="clientForm"
                                         style="margin-left:90px;">
                            <h:graphicImage value="images/ok-btn.png" width="103"
                                            height="42" style="margin-left:70px; margin-top: 20px;" />
                        </a4j:commandLink>
                    </h:panelGrid>
                </p:dialog>
                <%-- END: Dialog pre pridanie uzivatela --%>

                <%-- Potvrdzovaci dialog pre znamazanie klienta --%>
                <p:confirmDialog message="#{msg.areYouSureClient}: #{user.clientsTree.selectedNode.clientName}?"
                                 header="#{msg.deleteClient}" severity="alert" widgetVar="confirmationClient">
                    <a4j:commandLink
                        onclick="confirmationClient.hide();"
                        reRender="userForm"
                        style="margin-left:20px;">
                        <h:graphicImage value="images/nie-btn.png" width="103"
                                        height="42" />
                    </a4j:commandLink>

                    <a4j:commandLink actionListener="#{user.clientsTree.removeSelectedClient}"
                                     onclick="confirmationClient.hide();"
                                     reRender="clientForm"
                                     style="margin-left:20px;">
                        <h:graphicImage value="images/ano-btn.png" width="103"
                                        height="42"/>

                    </a4j:commandLink>
                </p:confirmDialog>
                <%-- END: Potvrdzovaci dialog pre znamazanie uzivatela--%>
            </h:form>
        </body>
    </html>
</f:subview>
