summaryrefslogtreecommitdiff
path: root/views/recipe
diff options
context:
space:
mode:
Diffstat (limited to 'views/recipe')
-rw-r--r--views/recipe/create.ejs51
-rw-r--r--views/recipe/createStep.ejs29
-rw-r--r--views/recipe/edit.ejs71
-rw-r--r--views/recipe/editSteps.ejs29
-rw-r--r--views/recipe/show.ejs55
-rw-r--r--views/recipe/upload.ejs26
6 files changed, 261 insertions, 0 deletions
diff --git a/views/recipe/create.ejs b/views/recipe/create.ejs
new file mode 100644
index 0000000..a6921a8
--- /dev/null
+++ b/views/recipe/create.ejs
@@ -0,0 +1,51 @@
+<%- include('../partials/header') %>
+<%- include('../partials/nav') %>
+
+<div class='content'>
+ <%- include('../partials/categories') %>
+ <div class='main'>
+ <div class='createCard'>
+ <h4 style='text-align: center'>Create Recipe</h4>
+ <form id='createForm' action="/recipe" method='POST'>
+ <label for="">Title:</label>
+ <input type="text" name='recipe[title]'>
+ <label for="">Image:</label>
+ <!-- <input type="text" name='recipe[picture]'> -->
+ <!-- <input type="file" name='picture' accept='image/png, image/jpg'> -->
+ <a href='/recipe/image/upload'>Upload image</a>
+ <% if(files) { %>
+ <select id="" name="recipe[picture]">
+ <% files.map(f => { %>
+ <option value='<%= f %>'><%= f %></option>
+ <% }) %>
+ </select>
+ <% } %>
+ <label for="">Category:</label>
+ <input type="text" name='recipe[category]'>
+ <label for="">Ingridients:</label>
+ <input type="text" name='recipe[ingridients]'>
+ <label for="">Number of steps:</label>
+ <div class='stepControl'>
+ <input id='stpnum' type="number" value=0 name='recipe[nsteps]'>
+ <div class='stepBtns'>
+ <button id='minus' onclick='prevent(event)'>-</button>
+ <button id='plus' onclick='prevent(event)'>+</button>
+ </div>
+ </div>
+ <button id='sub' type="submit">Create</button>
+ </form>
+ </div>
+ </div>
+ <%- include('../partials/popular') %>
+</div>
+
+<script type='text/javascript' src='/libs/main.js'></script>
+<script type='text/javascript'>
+ const prevent = (e) => {
+ e.preventDefault();
+ }
+</script>
+
+<%- include('../partials/magicCats') %>
+<%- include('../partials/magicPops') %>
+<%- include('../partials/footer') %>
diff --git a/views/recipe/createStep.ejs b/views/recipe/createStep.ejs
new file mode 100644
index 0000000..99812f4
--- /dev/null
+++ b/views/recipe/createStep.ejs
@@ -0,0 +1,29 @@
+<%- include('../partials/header') %>
+<%- include('../partials/nav') %>
+
+<div class='content'>
+ <%- include('../partials/categories') %>
+ <div class='main'>
+ <div class='createCard'>
+ <h4 style='text-align: center'>Create Recipe Step</h4>
+ <form id='createForm' action="/recipe/<%= recipe._id %>/step" method='POST'>
+ <label for="">Step Number:</label>
+ <input name='newStep[number]' type='text'>
+ <label for="">Step instructions:</label>
+ <textarea name='newStep[step]'></textarea>
+ <button>Edit</button>
+ </form>
+ </div>
+ </div>
+ <%- include('../partials/popular') %>
+</div>
+
+<script type='text/javascript'>
+ const prevent = (e) => {
+ e.preventDefault();
+ }
+</script>
+
+<%- include('../partials/magicCats') %>
+<%- include('../partials/magicPops') %>
+<%- include('../partials/footer') %>
diff --git a/views/recipe/edit.ejs b/views/recipe/edit.ejs
new file mode 100644
index 0000000..d72b3e4
--- /dev/null
+++ b/views/recipe/edit.ejs
@@ -0,0 +1,71 @@
+<%- include('../partials/header') %>
+<%- include('../partials/nav') %>
+
+<div class='content'>
+ <%- include('../partials/categories') %>
+ <div class='main'>
+ <div class='editCard'>
+ <h4 style='text-align: center'>Edit Recipe Details and Ingredients</h4>
+ <form id='createForm' action="/recipe/<%= recipe._id %>?_method=PUT" method='POST'>
+ <label for="">Title:</label>
+ <input type="text" name='recipe[title]' value='<%= recipe.title %>'>
+ <label for="">Image:</label>
+ <a href='/recipe/image/upload'>Upload image</a>
+ <% if(files) { %>
+ <select id="" name="recipe[picture]">
+ <option value='<%= recipe.picture %>' selected disabled> <%= recipe.picture %>
+ <% files.map(f => { %>
+ <option value='<%= f %>'><%= f %></option>
+ <% }) %>
+ </select>
+ <% } %>
+ <label for="">Category:</label>
+ <input type="text" name='recipe[category]' value='<%= recipe.category %>'>
+ <label for="">Ingredients:</label>
+ <input type="text" name='recipe[ingridients]' value='<%= recipe.ingridients %>'>
+ <label for="">Number of steps:</label>
+ <div class='stepControl'>
+ <input id='stpnum' type="number" value='<%= recipe.steps.length %>' name='recipe[nsteps]'>
+ </div>
+ <button id='sub' type="submit">Edit</button>
+ </form>
+ </div>
+ <div class='stepsToEd'>
+ <h4>Instructions (<%= recipe.steps.length %> steps)</h4>
+ <% recipe.steps.map(s => { %>
+ <div class='stepToEd' style='display: flex; padding: 0'>
+ <div style='display:flex; flex-direction: column; width: 100%;'>
+ <h5>Step <%= s.number %>:</h5>
+ <p><%= s.step %></p>
+ </div>
+ <div class='edtr' style="display: flex; flex-direction: column; align-items: right; justify-content: center; margin: 0; padding: 0">
+ <form action="/recipe/<%= recipe._id %>/step/<%= s._id %>/edit" onclick="(e) => e.preventDefult()">
+ <button class='editStpBtns' style='margin: 0; padding: .25rem'>
+ <i class='fas fa-edit'></i>
+ </button>
+ </form>
+ <form action="/recipe/<%= recipe._id %>/step/<%= s._id %>?_method=DELETE" method='POST'>
+ <button class='editStpBtns' style='margin: 0; padding: .25rem'>
+ <i class='fas fa-trash'></i>
+ </button>
+ </form>
+ </div>
+ </div>
+ <% }) %>
+ </div>
+ <form style='margin-top: 0;' id='createForm' action="/recipe/<%= recipe._id %>/step/create">
+ <button id='addStep'>Add a step</button>
+ </form>
+ </div>
+ <%- include('../partials/popular') %>
+</div>
+
+<script type='text/javascript'>
+ const prevent = (e) => {
+ e.preventDefault();
+ }
+</script>
+
+<%- include('../partials/magicCats') %>
+<%- include('../partials/magicPops') %>
+<%- include('../partials/footer') %>
diff --git a/views/recipe/editSteps.ejs b/views/recipe/editSteps.ejs
new file mode 100644
index 0000000..1df2a68
--- /dev/null
+++ b/views/recipe/editSteps.ejs
@@ -0,0 +1,29 @@
+<%- include('../partials/header') %>
+<%- include('../partials/nav') %>
+
+<div class='content'>
+ <%- include('../partials/categories') %>
+ <div class='main'>
+ <div class='createCard'>
+ <h4 style='text-align: center'>Edit Recipe Steps</h4>
+ <form id='createForm' action="/recipe/<%= recipe._id %>/step/<%= step._id %>?_method=PUT" method='POST'>
+ <label id='added<%= step.number %>' for="">Step Number:</label>
+ <input id='added<%= step.number %>' name='step[number]' type='text' value='<%= step.number %>'>
+ <label id='added<%= step.number %>' for="">Step instructions:</label>
+ <textarea id='added<%= step.number %>' name='step[step]'><%= step.step %></textarea>
+ <button><i class='fas fa-edit'></i></button>
+ </form>
+ </div>
+ </div>
+ <%- include('../partials/popular') %>
+</div>
+
+<script type='text/javascript'>
+ const prevent = (e) => {
+ e.preventDefault();
+ }
+</script>
+
+<%- include('../partials/magicCats') %>
+<%- include('../partials/magicPops') %>
+<%- include('../partials/footer') %>
diff --git a/views/recipe/show.ejs b/views/recipe/show.ejs
new file mode 100644
index 0000000..9fcc771
--- /dev/null
+++ b/views/recipe/show.ejs
@@ -0,0 +1,55 @@
+<%- include('../partials/header') %>
+<%- include('../partials/nav') %>
+
+<div class='content'>
+ <%- include('../partials/categories') %>
+ <div class='main'>
+ <h4 style='text-align: center'><%= recipe.title %>,
+ by <a style='text-decoration: none;' href="/account/<%= recipe.author.id %>">
+ <em><%= recAuthor.bio.name %></em></a>
+ </h4>
+ <div class='recIngImg'>
+ <div class='savImg'>
+ <img src="/images/<%= recipe.author.username %>/<%= recipe.picture %>" alt="recipe" style='max-width: 25rem'>
+ <% if(usr) { %>
+ <% if(account.favorites.includes(recipe._id)) { %>
+ <form class='saveRecForm' action="/recipe/<%= recipe._id %>/unsave?_method=PUT" method='POST'>
+ <button id='saveBtn'>Saved</button>
+ </form>
+ <% } else { %>
+ <form class='saveRecForm' action="/recipe/<%= recipe._id %>/save?_method=PUT" method='POST'>
+ <button id='saveBtn'>Save</button>
+ </form>
+ <% } %>
+ <% } %>
+ </div>
+ <div class='Ing'>
+ <h5>Ingredients:</h5>
+ <ul>
+ <% ingridients.map(i => { %>
+ <li><%= i %></li>
+ <% }) %>
+ </ul>
+ </div>
+ </div>
+ <p class='category'><span>
+ <a style='text-decoration: none;' href="/categories/<%= recipe.category.toLowerCase() %>">
+ <%= recipe.category %>
+ </a>
+ </span></p>
+ <div class='steps'>
+ <h4>Instructions (<%= recipe.steps.length %> steps)</h4>
+ <% recipe.steps.map(s => { %>
+ <div>
+ <h5>Step <%= s.number %>:</h5>
+ <p><%= s.step %></p>
+ </div>
+ <% }) %>
+ </div>
+ </div>
+ <%- include('../partials/popular') %>
+</div>
+
+<%- include('../partials/magicCats') %>
+<%- include('../partials/magicPops') %>
+<%- include('../partials/footer') %>
diff --git a/views/recipe/upload.ejs b/views/recipe/upload.ejs
new file mode 100644
index 0000000..e8a9c81
--- /dev/null
+++ b/views/recipe/upload.ejs
@@ -0,0 +1,26 @@
+<%- include('../partials/header') %>
+<%- include('../partials/nav') %>
+
+<div class='content'>
+ <%- include('../partials/categories') %>
+ <div class='main'>
+ <div class='createCard'>
+ <h4 style='text-align: center'>Upload Recipe Image</h4>
+ <form action="/recipe/image" method='POST' enctype="multipart/form-data">
+ <input type='file' name='image'>
+ <button>Upload</button>
+ </form>
+ </div>
+ </div>
+ <%- include('../partials/popular') %>
+</div>
+
+<script type='text/javascript'>
+ const prevent = (e) => {
+ e.preventDefault();
+ }
+</script>
+
+<%- include('../partials/magicCats') %>
+<%- include('../partials/magicPops') %>
+<%- include('../partials/footer') %>
generated by cgit v1.2.3 (git 2.25.1) at 2025-05-17 03:42:10 +0000