Author: lkaufmann Date: 2014-05-16 15:31:04 +0200 (Fri, 16 May 2014) New Revision: 1950 Url: http://forge.codelutin.com/projects/wao/repository/revisions/1950 Log: Refs #4997 Contact edit screen layout update & add sticky button to contacts screen Modified: trunk/wao-web/src/main/webapp/WEB-INF/content/obsmer/contacts.jsp trunk/wao-web/src/main/webapp/WEB-INF/content/obsmer/edit-contact-input.jsp Modified: trunk/wao-web/src/main/webapp/WEB-INF/content/obsmer/contacts.jsp =================================================================== --- trunk/wao-web/src/main/webapp/WEB-INF/content/obsmer/contacts.jsp 2014-05-16 13:29:12 UTC (rev 1949) +++ trunk/wao-web/src/main/webapp/WEB-INF/content/obsmer/contacts.jsp 2014-05-16 13:31:04 UTC (rev 1950) @@ -303,18 +303,21 @@ <s:set var="fullView" value="%{fullView}"/> -<button type="button" id="switch-compact-full-view" class="btn <s:if test="fullView">full-view</s:if><s:else>compact-view</s:else>"> - <span class="only-in-compact-view"> - <i class="icon-resize-full"></i> <s:text name="wao.ui.action.switchToFullView"/> - </span> - <span class="only-in-full-view"> - <i class="icon-resize-small"></i> <s:text name="wao.ui.action.switchToCompactView"/> - </span> -</button> +<div class="sticky-buttons"> + <button type="button" id="switch-compact-full-view" class="btn <s:if test="fullView">full-view</s:if><s:else>compact-view</s:else>"> + <span class="only-in-compact-view"> + <i class="fa fa-expand"></i><span class="only-on-hover"> <s:text name="wao.ui.action.switchToFullView" /></span> + </span> + <span class="only-in-full-view"> + <i class="fa fa-compress"></i><span class="only-on-hover"> <s:text name="wao.ui.action.switchToCompactView" /></span> + </span> + </button> +</div> + <s:property value="#pagination" escapeHtml="false"/> -<table id="contacts-list" class="contacts-list large-table <s:if test="fullView">full-view</s:if><s:else>compact-view</s:else>"> +<table id="contacts-list" class="contacts-list large-table table-striped <s:if test="fullView">full-view</s:if><s:else>compact-view</s:else>"> <thead> <tr> <th><s:text name="wao.ui.field.Contact.creationDate"/></th> Modified: trunk/wao-web/src/main/webapp/WEB-INF/content/obsmer/edit-contact-input.jsp =================================================================== --- trunk/wao-web/src/main/webapp/WEB-INF/content/obsmer/edit-contact-input.jsp 2014-05-16 13:29:12 UTC (rev 1949) +++ trunk/wao-web/src/main/webapp/WEB-INF/content/obsmer/edit-contact-input.jsp 2014-05-16 13:31:04 UTC (rev 1950) @@ -67,263 +67,265 @@ }); </script> + <content tag="mainClass">form</content> </head> -<h1> - <s:if test="updateContactCommand.creation"> - <s:text name="wao.ui.contact.creation"/> - </s:if> - <s:else> - <s:text name="wao.ui.contact.edition"/> - </s:else> -</h1> + <div class="form-wrapper"> + <h1> + <s:if test="updateContactCommand.creation"> + <s:text name="wao.ui.contact.creation"/> + </s:if> + <s:else> + <s:text name="wao.ui.contact.edition"/> + </s:else> + </h1> -<aside class="well"> + <aside class="well"> - <h2><s:text name="wao.ui.misc.information"/></h2> + <h2><s:text name="wao.ui.misc.information"/></h2> - <s:text name="wao.ui.form.Contact.contactCreatedOn"> - <s:param value="%{formatDate(updateContactCommand.contact.creationDate)}"/> - </s:text> + <s:text name="wao.ui.form.Contact.contactCreatedOn"> + <s:param value="%{formatDate(updateContactCommand.contact.creationDate)}"/> + </s:text> - <h3><s:text name="wao.ui.field.Contact.boat"/></h3> + <h3><s:text name="wao.ui.field.Contact.boat"/></h3> - <table class="table"> - <tbody> - <tr> - <th> - <s:text name="wao.ui.field.Boat.name"/> - </th> - <td> - <s:property value="updateContactCommand.contact.boat.name"/> - </td> - </tr> - <tr> - <th> - <s:text name="wao.ui.field.Boat.immatriculation"/> - </th> - <td> - <s:property value="updateContactCommand.contact.boat.immatriculation"/> - </td> - </tr> - <tr> - <th> - <s:text name="wao.ui.field.Boat.districtCode"/> - </th> - <td> - <s:property value="updateContactCommand.contact.boat.districtCode"/> - </td> - </tr> - <tr> - <th> - <s:text name="wao.ui.field.Boat.boatLength"/> - </th> - <td> - <s:property value="%{'' + updateContactCommand.contact.boat.boatLength}"/> - </td> - </tr> - <tr> - <th> - <s:text name="wao.ui.field.Boat.buildYear"/> - </th> - <td> - <s:property value="%{'' + updateContactCommand.contact.boat.buildYear}"/> - </td> - </tr> - </tbody> - </table> + <table class="table"> + <tbody> + <tr> + <th> + <s:text name="wao.ui.field.Boat.name"/> + </th> + <td> + <s:property value="updateContactCommand.contact.boat.name"/> + </td> + </tr> + <tr> + <th> + <s:text name="wao.ui.field.Boat.immatriculation"/> + </th> + <td> + <s:property value="updateContactCommand.contact.boat.immatriculation"/> + </td> + </tr> + <tr> + <th> + <s:text name="wao.ui.field.Boat.districtCode"/> + </th> + <td> + <s:property value="updateContactCommand.contact.boat.districtCode"/> + </td> + </tr> + <tr> + <th> + <s:text name="wao.ui.field.Boat.boatLength"/> + </th> + <td> + <s:property value="%{'' + updateContactCommand.contact.boat.boatLength}"/> + </td> + </tr> + <tr> + <th> + <s:text name="wao.ui.field.Boat.buildYear"/> + </th> + <td> + <s:property value="%{'' + updateContactCommand.contact.boat.buildYear}"/> + </td> + </tr> + </tbody> + </table> - <h3><s:text name="wao.ui.field.Contact.sampleRow"/></h3> + <h3><s:text name="wao.ui.field.Contact.sampleRow"/></h3> - <table class="table"> - <tbody> - <tr> - <th> - <s:text name="wao.ui.field.SampleRow.profession"/> - </th> - <td> - <s:property value="updateContactCommand.contact.sampleRow.professionDescription"/> - </td> - </tr> - <tr> - <th> - <s:text name="wao.ui.field.SampleRow.programName"/> - </th> - <td> - <s:property value="updateContactCommand.contact.sampleRow.programName"/> - </td> - </tr> - <tr> - <th> - <s:text name="wao.ui.field.SampleRow.periodBegin"/> - </th> - <td> - <s:property value="%{formatMonth(updateContactCommand.contact.sampleRow.periodBegin)}"/> - </td> - </tr> - <tr> - <th> - <s:text name="wao.ui.field.SampleRow.periodEnd"/> - </th> - <td> - <s:property value="%{formatMonth(updateContactCommand.contact.sampleRow.periodEnd)}"/> - </td> - </tr> - </tbody> - </table> + <table class="table"> + <tbody> + <tr> + <th> + <s:text name="wao.ui.field.SampleRow.profession"/> + </th> + <td> + <s:property value="updateContactCommand.contact.sampleRow.professionDescription"/> + </td> + </tr> + <tr> + <th> + <s:text name="wao.ui.field.SampleRow.programName"/> + </th> + <td> + <s:property value="updateContactCommand.contact.sampleRow.programName"/> + </td> + </tr> + <tr> + <th> + <s:text name="wao.ui.field.SampleRow.periodBegin"/> + </th> + <td> + <s:property value="%{formatMonth(updateContactCommand.contact.sampleRow.periodBegin)}"/> + </td> + </tr> + <tr> + <th> + <s:text name="wao.ui.field.SampleRow.periodEnd"/> + </th> + <td> + <s:property value="%{formatMonth(updateContactCommand.contact.sampleRow.periodEnd)}"/> + </td> + </tr> + </tbody> + </table> -</aside> + </aside> -<s:form> + <s:form> - <s:hidden name="contactId" value="%{contactId}"/> + <s:hidden name="contactId" value="%{contactId}"/> - <fieldset> - <legend><s:text name="wao.ui.misc.observers"/></legend> + <fieldset> + <legend><s:text name="wao.ui.misc.observers"/></legend> - <s:set name="editObservers" - value="%{authenticatedWaoUser.isAuthorizedToEditContactObservers(updateContactCommand.contact)}"/> + <s:set name="editObservers" + value="%{authenticatedWaoUser.isAuthorizedToEditContactObservers(updateContactCommand.contact)}"/> - <s:select name="updateContactCommand.contact.mainObserver.topiaId" - label="%{getText('wao.ui.field.Contact.mainObserver')}" - list="observers" - emptyOption="true" - disabled="%{!#editObservers}" - cssClass="select2 input-large" - /> + <s:select name="updateContactCommand.contact.mainObserver.topiaId" + label="%{getText('wao.ui.field.Contact.mainObserver')}" + list="observers" + emptyOption="true" + disabled="%{!#editObservers}" + cssClass="select2 input-large" + /> - <s:if test="authenticatedWaoUser.isAuthorizedToDisplayContactSecondaryObservers(updateContactCommand.contact)"> - <s:select name="updateContactCommand.contact.secondaryObservers" - value="%{updateContactCommand.contact.secondaryObserversTopiaIds}" - label="%{getText('wao.ui.field.Contact.secondaryObservers')}" - list="observers" - multiple="true" - disabled="%{!#editObservers}" - cssClass="select2 input-xlarge" - /> - </s:if> + <s:if test="authenticatedWaoUser.isAuthorizedToDisplayContactSecondaryObservers(updateContactCommand.contact)"> + <s:select name="updateContactCommand.contact.secondaryObservers" + value="%{updateContactCommand.contact.secondaryObserversTopiaIds}" + label="%{getText('wao.ui.field.Contact.secondaryObservers')}" + list="observers" + multiple="true" + disabled="%{!#editObservers}" + cssClass="select2 input-xlarge" + /> + </s:if> - </fieldset> + </fieldset> - <%--Do not remove the id (use by contacts page)--%> - <fieldset id="coordinatorOrObserverFocus"> - <legend><s:text name="wao.ui.misc.observationReport"/></legend> + <%--Do not remove the id (use by contacts page)--%> + <fieldset id="coordinatorOrObserverFocus"> + <legend><s:text name="wao.ui.misc.observationReport"/></legend> - <s:set name="editObservationReport" - value="%{authenticatedWaoUser.isAuthorizedToEditObservationReport(updateContactCommand.contact)}"/> + <s:set name="editObservationReport" + value="%{authenticatedWaoUser.isAuthorizedToEditObservationReport(updateContactCommand.contact)}"/> - <s:textfield name="updateContactCommand.contact.observationBeginDate" - label="%{getText('wao.ui.field.Contact.beginDate')}" - placeholder="%{getDateTimePlaceholder()}" - disabled="%{!#editObservationReport}"/> + <s:textfield name="updateContactCommand.contact.observationBeginDate" + label="%{getText('wao.ui.field.Contact.beginDate')}" + placeholder="%{getDateTimePlaceholder()}" + disabled="%{!#editObservationReport}"/> - <s:textfield name="updateContactCommand.contact.observationEndDate" - label="%{getText('wao.ui.field.Contact.endDate')}" - placeholder="%{getDateTimePlaceholder()}" - disabled="%{!#editObservationReport}"/> + <s:textfield name="updateContactCommand.contact.observationEndDate" + label="%{getText('wao.ui.field.Contact.endDate')}" + placeholder="%{getDateTimePlaceholder()}" + disabled="%{!#editObservationReport}"/> - <s:select name="updateContactCommand.contact.contactState" - label="%{getText('wao.ui.field.Contact.contactState')}" - requiredLabel="true" - list="contactStates" - disabled="%{!#editObservationReport}"/> + <s:select name="updateContactCommand.contact.contactState" + label="%{getText('wao.ui.field.Contact.contactState')}" + requiredLabel="true" + list="contactStates" + disabled="%{!#editObservationReport}"/> - <div id="contactStateMotif"> - <s:select name="updateContactCommand.contact.contactStateMotif" - value="%{updateContactCommand.contact.contactState.topiaId}" - label="%{getText('wao.ui.field.Contact.contactStateMotif')}" - list="contactStateMotives" - emptyOption="true" - disabled="%{!#editObservationReport}"/> - </div> + <div id="contactStateMotif"> + <s:select name="updateContactCommand.contact.contactStateMotif" + value="%{updateContactCommand.contact.contactState.topiaId}" + label="%{getText('wao.ui.field.Contact.contactStateMotif')}" + list="contactStateMotives" + emptyOption="true" + disabled="%{!#editObservationReport}"/> + </div> - <s:checkbox name="updateContactCommand.contact.mammalsObservation" - label="%{getText('wao.ui.field.Contact.mammalsObservation')}" - disabled="%{!#editObservationReport}"/> + <s:checkbox name="updateContactCommand.contact.mammalsObservation" + label="%{getText('wao.ui.field.Contact.mammalsObservation')}" + disabled="%{!#editObservationReport}"/> - <s:checkbox name="updateContactCommand.contact.mammalsCapture" - id="mammalsCaptureCheckbox" - label="%{getText('wao.ui.field.Contact.mammalsCapture')}" - disabled="%{!#editObservationReport}"/> + <s:checkbox name="updateContactCommand.contact.mammalsCapture" + id="mammalsCaptureCheckbox" + label="%{getText('wao.ui.field.Contact.mammalsCapture')}" + disabled="%{!#editObservationReport}"/> - <div id="mammalsInfo"> - <s:textarea name="updateContactCommand.contact.mammalsInfo" - label="%{getText('wao.ui.field.Contact.mammalsInfo')}" - disabled="%{!#editObservationReport}"/> - <div class="alert"> - <s:text name="wao.ui.page.ContactForm.mammalsInfo.disclaimer"/> - </div> - </div> + <div id="mammalsInfo"> + <s:textarea name="updateContactCommand.contact.mammalsInfo" + label="%{getText('wao.ui.field.Contact.mammalsInfo')}" + disabled="%{!#editObservationReport}"/> + <div class="alert"> + <s:text name="wao.ui.page.ContactForm.mammalsInfo.disclaimer"/> + </div> + </div> - <s:textfield name="updateContactCommand.contact.dataInputDate" - label="%{getText('wao.ui.field.Contact.dataInputDate')}" - placeholder="%{getDatePlaceholder()}" - disabled="%{!#editObservationReport}"/> + <s:textfield name="updateContactCommand.contact.dataInputDate" + label="%{getText('wao.ui.field.Contact.dataInputDate')}" + placeholder="%{getDatePlaceholder()}" + disabled="%{!#editObservationReport}"/> - <s:select name="updateContactCommand.contact.observedDataControl" - label="%{getText('wao.ui.field.Contact.observedDataControl')}" - list="observedDataControls" - emptyOption="true" - disabled="%{!#editObservationReport || !authenticatedWaoUser.coordinator}"/> + <s:select name="updateContactCommand.contact.observedDataControl" + label="%{getText('wao.ui.field.Contact.observedDataControl')}" + list="observedDataControls" + emptyOption="true" + disabled="%{!#editObservationReport || !authenticatedWaoUser.coordinator}"/> - <s:textfield name="updateContactCommand.contact.restitution" - label="%{getText('wao.ui.field.Contact.restitution')}" - placeholder="%{getDatePlaceholder()}" - disabled="%{!#editObservationReport}"/> + <s:textfield name="updateContactCommand.contact.restitution" + label="%{getText('wao.ui.field.Contact.restitution')}" + placeholder="%{getDatePlaceholder()}" + disabled="%{!#editObservationReport}"/> - <s:textarea name="updateContactCommand.contact.comment" - label="%{getText('wao.ui.field.Contact.comment')}" - placeholder="%{getText('wao.ui.misc.noComment')}" - disabled="%{!#editObservationReport || !authenticatedWaoUser.coordinatorOrObserver}"/> + <s:textarea name="updateContactCommand.contact.comment" + label="%{getText('wao.ui.field.Contact.comment')}" + placeholder="%{getText('wao.ui.misc.noComment')}" + disabled="%{!#editObservationReport || !authenticatedWaoUser.coordinatorOrObserver}"/> - <s:textarea name="updateContactCommand.contact.commentCoordinator" - label="%{getText('wao.ui.field.Contact.commentCoordinator')}" - placeholder="%{getText('wao.ui.misc.noComment')}" - disabled="%{!#editObservationReport || !authenticatedWaoUser.coordinator}"/> + <s:textarea name="updateContactCommand.contact.commentCoordinator" + label="%{getText('wao.ui.field.Contact.commentCoordinator')}" + placeholder="%{getText('wao.ui.misc.noComment')}" + disabled="%{!#editObservationReport || !authenticatedWaoUser.coordinator}"/> - </fieldset> + </fieldset> - <%--Do not remove the id (use by contacts page)--%> - <fieldset id="adminFocus"> - <legend><s:text name="wao.ui.form.programEvaluation"/></legend> + <%--Do not remove the id (use by contacts page)--%> + <fieldset id="adminFocus"> + <legend><s:text name="wao.ui.form.programEvaluation"/></legend> - <s:if test="authenticatedWaoUser.authorizedToDisplayContactDataReliability"> - <s:select name="updateContactCommand.contact.dataReliability" - label="%{getText('wao.ui.field.Contact.dataReliability')}" - list="dataReliabilities" - emptyOption="true" - disabled="%{!authenticatedWaoUser.isAuthorizedToEditContactDataReliability(updateContactCommand.contact)}"/> - </s:if> + <s:if test="authenticatedWaoUser.authorizedToDisplayContactDataReliability"> + <s:select name="updateContactCommand.contact.dataReliability" + label="%{getText('wao.ui.field.Contact.dataReliability')}" + list="dataReliabilities" + emptyOption="true" + disabled="%{!authenticatedWaoUser.isAuthorizedToEditContactDataReliability(updateContactCommand.contact)}"/> + </s:if> - <s:textarea name="updateContactCommand.contact.commentAdmin" - label="%{getText('wao.ui.field.Contact.commentAdmin')}" - placeholder="%{getText('wao.ui.misc.noComment')}" - disabled="%{!authenticatedWaoUser.admin}"/> - </fieldset> + <s:textarea name="updateContactCommand.contact.commentAdmin" + label="%{getText('wao.ui.field.Contact.commentAdmin')}" + placeholder="%{getText('wao.ui.misc.noComment')}" + disabled="%{!authenticatedWaoUser.admin}"/> + </fieldset> - <div class="form-actions"> - <s:url action="contacts" id="contactsUrl"/> - <s:a href="%{contactsUrl}" cssClass="btn"> - <i class="icon-chevron-left"></i> <s:text name="wao.ui.action.cancel"/> - </s:a> - <s:if test="authenticatedWaoUser.isAuthorizedToEditContact(updateContactCommand.contact)"> - <s:submit type="button" cssClass="btn"> - <i class="icon-hdd"></i> <s:text name="wao.ui.action.save"/> - </s:submit> - </s:if> + <div class="form-actions"> + <s:url action="contacts" id="contactsUrl"/> + <s:a href="%{contactsUrl}" cssClass="btn"> + <i class="icon-chevron-left"></i> <s:text name="wao.ui.action.cancel"/> + </s:a> + <s:if test="authenticatedWaoUser.isAuthorizedToEditContact(updateContactCommand.contact)"> + <s:submit type="button" cssClass="btn"> + <i class="icon-hdd"></i> <s:text name="wao.ui.action.save"/> + </s:submit> + </s:if> - <s:if - test=" ! updateContactCommand.creation && authenticatedWaoUser.isAuthorizedToDeleteContact(updateContactCommand.contact)"> - <s:url action="delete-contact" id="deleteContactUrl"> - <s:param name="contactId" value="contactId"/> - </s:url> - <s:a href="%{deleteContactUrl}" cssClass="btn pull-right"> - <i class="icon-trash"></i> <s:text name="wao.ui.action.deleteContact"/> - </s:a> - </s:if> + <s:if + test=" ! updateContactCommand.creation && authenticatedWaoUser.isAuthorizedToDeleteContact(updateContactCommand.contact)"> + <s:url action="delete-contact" id="deleteContactUrl"> + <s:param name="contactId" value="contactId"/> + </s:url> + <s:a href="%{deleteContactUrl}" cssClass="btn pull-right"> + <i class="icon-trash"></i> <s:text name="wao.ui.action.deleteContact"/> + </s:a> + </s:if> + </div> + + </s:form> </div> - -</s:form> - </html>