Web implementation of the Gourmet Recipe Manager
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

314 lines
15 KiB

2 years ago
<?xml version="1.0" encoding="UTF-8"?>
<ui:composition template="/WEB-INF/layout/layout.xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
xmlns:c="http://xmlns.jcp.org/jstl"
>
<ui:define name="title">Gourmet Recipe Manager</ui:define>
<ui:define name="content">
<style>
.ingSel {
width: 3em;
text-align: center;
}
.ingAmt {
width: 4em;
text-align: right;
}
.ingItem {
width: 20em;
text-align: left;
}
</style>
<h:messages id="messages"/>
2 years ago
<p:panel id="editorPanel"
header="#{recipeDetailBean.recipe.title}"
>
<h:form id="form1" enctype="multipart/form-data">
2 years ago
<p:tabView id="tabGroupClient" orientation="left"
activeIndex="#{userSession.detailTab}"
>
<p:tab id="overviewTab" title="Description">
<p:panelGrid columns="2">
<f:facet name="header">Description</f:facet>
<p:outputLabel for="@next"
value="Title"
/>
2 years ago
<p:inputText id="rtitle" size="45"
2 years ago
required="true" focus="true"
value="#{recipeDetailBean.recipe.title}"
>
<f:ajax execute="rtitle"
render="editorPanel"
/>
</p:inputText>
<p:outputLabel for="@next"
value="Category"
/>
<p:inputText id="rcategory"
label="Category"
value="#{recipeDetailBean.category}"
tip="One or more categories, separated by commas (ex: Entree, Soup)"
/>
<p:commandButton
value="&lt;- Suggest"
2 years ago
>
<f:ajax execute="rcategory bxCat"
listener="#{recipeDetailBean.ajaxSuggestCategory}"
2 years ago
render="rcategory"
/>
</p:commandButton>
2 years ago
<p:selectOneMenu id="bxCat"
value="#{recipeDetailBean.catToAdd}"
tip="Recipe category suggestions, based on previous selections"
>
<f:selectItems
value="#{recipeDetailBean.suggestCategory}"
/>
</p:selectOneMenu>
<p:outputLabel for="@next"
value="Cuisine"
/>
<p:autoComplete id="rcuisine"
value="#{recipeDetailBean.recipe.cuisine}"
completeMethod="#{recipeDetailBean.cuisineSuggestions}"
2 years ago
/>
<p:outputLabel for="@next"
value="Rating"
/>
<p:rating id="rrating" max="10"
value="#{recipeDetailBean.recipe.rating}"
/>
<p:outputLabel for="@next"
value="Source"
/>
2 years ago
<p:inputText id="rsource" size="45"
2 years ago
value="#{recipeDetailBean.recipe.source}"
/>
<p:outputLabel for="@next"
value="URL"
/>
2 years ago
<p:inputText id="rurl" size="45"
2 years ago
value="#{recipeDetailBean.recipe.link}"
/>
<p:outputLabel for="@next"
value="Description"
/>
<p:inputTextarea id="description"
rows="10" cols="30" escape="false"
2 years ago
value="#{recipeDetailBean.recipe.description}"
/>
<p:panel id="picPanel">
2 years ago
<img id="bigPix"
src="/img/picture/?dt=#{recipeDetailBean.currentTime}"
/>
</p:panel>
<p:fileUpload id="ctlUpload"
label="Upload Image"
fileUploadListener="#{recipeDetailBean.ajaxUploadImage}"
global="true"
mode="advanced" multiple="false"
update=":messages picPanel"
auto="true" sizeLimit="1000000"
allowTypes="/(\.|\/)(gif|jpe?g|png)$/"
/>
<p:button id="ctlDelImg"
value="Delete Image"
>
<!-- <f:ajax
2 years ago
listener="recipeDetailBean.ajaxDeleteImage"
execute="ctlDelImg"
immediate="true" render="picture"
/> -->
</p:button>
2 years ago
</p:panelGrid>
</p:tab>
<p:tab id="ingredientsTab"
title="Ingredients"
>
<p:panel header="Ingredients">
<!-- NOTE: disabled doesn't work from AJAX render. Swap images -->
<h:panelGroup id="ingButtons">
<p:button value="Up" id="ctlUp">
<!-- <f:ajax
listener="recipeDetailBean.ajaxMoveUp"
execute="ingredientTable"
render="ingredientTable"
/> -->
</p:button>
<p:button value="Down"
id="ctlDown"
>
<!-- <f:ajax
listener="recipeDetailBean.ajaxMoveDown"
execute="ingredientTable"
render="ingredientTable"
/> -->
</p:button>
<p:button value="Add Group"
disabled="true"
/>
<p:button
value="Add Recipe As Ingredient"
disabled="true"
/>
<p:button
value="Import Ingredients"
disabled="true"
/>
<p:button value="Paste" />
<p:button value="Delete"
id="ctlDelete"
immediate="true"
disabled="not #{recipeDetailBean.selectionActive}"
>
<!-- <f:ajax
listener="recipeDetailBean.ajaxDeleteItems"
immediate="true"
render="ingredientTable"
/> -->
</p:button>
</h:panelGroup>
<h:panelGrid columns="1"
id="ingredientsDiv"
style="height: 420px;"
columnClasses="alignTop"
>
<p:dataTable id="ingredientTable"
style="width: 100%"
value="#{recipeDetailBean.ingredients}"
var="item"
>
<p:column label="Sel."
align="center"
style="width: 2em"
>
<p:selectBooleanCheckbox
id="selected"
value="#{item.selected}"
>
<!-- <f:ajax immediate="true"
render="ingredientTable"
/> -->
</p:selectBooleanCheckbox>
</p:column>
<p:column label="Amt"
2 years ago
style="width: 4em"
2 years ago
>
<p:inputText id="ingAmt"
size="5"
2 years ago
value="#{item.displayAmount}"
2 years ago
style="text-align: right"
2 years ago
rendered="#{not item.ingGroup}"
>
</p:inputText>
</p:column>
<p:column label="Units"
2 years ago
style="width: 7em"
2 years ago
>
<p:inputText id="ingUnit"
value="#{item.unit}"
size="10"
2 years ago
rendered="#{not item.ingGroup}"
>
</p:inputText>
</p:column>
<p:column label="Item"
style="width: 22em"
>
<p:inputText id="ingItem"
size="35"
2 years ago
value="#{item.item}"
>
</p:inputText>
</p:column>
<p:column label="Optional"
align="center"
styleClass="ingSel"
>
<p:selectBooleanCheckbox
id="ingOpt"
value="#{item.optionalCB}"
rendered="#{not item.ingGroup}"
/>
</p:column>
<p:column label="Key">
<p:inputText id="ingKey"
value="#{item.ingkey}"
size="20"
2 years ago
rendered="#{not item.ingGroup}"
/>
</p:column>
<p:column
label="Shopping Category"
>
<p:inputText id="shopCat"
value="#{item.shopCat}"
rendered="#{not item.ingGroup}"
tip="Note that changing Shopping category for an ingredient key changes it for all users of that key."
>
<p:autoComplete
minimumCharacters="1"
completeMethod="#{recipeDetailBean.shopcatPartial}"
>
</p:autoComplete>
</p:inputText>
</p:column>
</p:dataTable>
</h:panelGrid>
<h:panelGroup id="addIng">
<p:inputText
label="Add Ingredient: "
id="ctlAddIng" focus="true"
value="#{recipeDetailBean.ingredientText}"
tip="You can paste in multiple ingredients here!"
/>
<p:button value="+ Add"
defaultCommand="true"
>
<!-- <f:ajax execute="ctlAddIng"
render="ingredientTable ctlAddIng"
listener="recipeDetailBean.ajaxAddIngredient"
/> -->
</p:button>
</h:panelGroup>
</p:panel>
</p:tab>
<p:tab id="instructionsTab"
title="Instructions"
>
<p:panel header="Instructions">
<div id="insection">
<p:textEditor
id="ctlInstructions"
height="320" escape="false"
value="#{recipeDetailBean.recipe.instructions}"
/>
</div>
</p:panel>
</p:tab>
<p:tab id="notesTab" title="Notes">
<p:panel header="Notes">
<p:textEditor id="ctlNotes"
height="320" escape="false"
value="#{recipeDetailBean.recipe.modifications}"
/>
</p:panel>
</p:tab>
</p:tabView>
<p:button id="doSave" value="Save"
disabled="{recipeDetailBean.dirty}"
action="#{recipeDetailBean.doSave}"
/>
<p:commandButton id="doCancel" value="Cancel"
immediate="true" action="/main.jsf"
/>
</h:form>
</p:panel>
</ui:define>
</ui:composition>