initial public commitHEADmaster

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') %>