diff options
Diffstat (limited to 'views')
-rw-r--r-- | views/account/account.ejs | 44 | ||||
-rw-r--r-- | views/account/changepass.ejs | 25 | ||||
-rw-r--r-- | views/account/editBio.ejs | 27 | ||||
-rw-r--r-- | views/account/saved.ejs | 33 | ||||
-rw-r--r-- | views/category/cats.ejs | 38 | ||||
-rw-r--r-- | views/index.ejs | 30 | ||||
-rw-r--r-- | views/login.ejs | 26 | ||||
-rw-r--r-- | views/partials/bio.ejs | 19 | ||||
-rw-r--r-- | views/partials/categories.ejs | 8 | ||||
-rw-r--r-- | views/partials/footer.ejs | 3 | ||||
-rw-r--r-- | views/partials/header.ejs | 25 | ||||
-rw-r--r-- | views/partials/magicBio.ejs | 21 | ||||
-rw-r--r-- | views/partials/magicCats.ejs | 8 | ||||
-rw-r--r-- | views/partials/magicPops.ejs | 14 | ||||
-rw-r--r-- | views/partials/magicSets.ejs | 15 | ||||
-rw-r--r-- | views/partials/nav.ejs | 59 | ||||
-rw-r--r-- | views/partials/popular.ejs | 14 | ||||
-rw-r--r-- | views/partials/search.ejs | 18 | ||||
-rw-r--r-- | views/partials/settings.ejs | 15 | ||||
-rw-r--r-- | views/recipe/create.ejs | 51 | ||||
-rw-r--r-- | views/recipe/createStep.ejs | 29 | ||||
-rw-r--r-- | views/recipe/edit.ejs | 71 | ||||
-rw-r--r-- | views/recipe/editSteps.ejs | 29 | ||||
-rw-r--r-- | views/recipe/show.ejs | 55 | ||||
-rw-r--r-- | views/recipe/upload.ejs | 26 | ||||
-rw-r--r-- | views/register.ejs | 32 | ||||
-rw-r--r-- | views/search.ejs | 38 |
27 files changed, 773 insertions, 0 deletions
diff --git a/views/account/account.ejs b/views/account/account.ejs new file mode 100644 index 0000000..3c4e4ea --- /dev/null +++ b/views/account/account.ejs @@ -0,0 +1,44 @@ +<%- include('../partials/header') %> +<%- include('../partials/nav') %> + +<div class='content'> + <% if(usr) { %> + <% if(usr._id.equals(account.author.id)) { %> + <%- include('../partials/settings') %> + <% } else { %> + <%- include('../partials/categories') %> + <% } %> + <% } else { %> + <%- include('../partials/categories') %> + <% } %> + <div class='main'> + <div class='recList'> + <% recipes.map(s => { %> + <div class='recCard'> + <img src="/images/<%= s.author.username %>/<%= s.picture %>" alt="recipe"> + <a href='/recipe/<%= s._id %>'><%= s.title %></a> + <% if(usr) { %> + <% if(usr._id.equals(s.author.id)) { %> + <div class='recControl'> + <form action="/recipe/<%= s._id %>/edit"> + <button class='acRecBtns'><i class='fas fa-edit'></i></button> + </form> + <form action='/recipe/<%= s._id %>?_method=DELETE' method='POST'> + <button class='acRecBtns' type='submit'><i class='fas fa-trash'></i></button> + </form> + </div> + <% } %> + <% } %> + </div> + <% }) %> + </div> + </div> + <%- include('../partials/bio') %> +</div> +<% if(usr) { %> + <%- include('../partials/magicSets') %> +<% } else { %> + <%- include('../partials/magicCats') %> +<% } %> +<%- include('../partials/magicBio') %> +<%- include('../partials/footer') %> diff --git a/views/account/changepass.ejs b/views/account/changepass.ejs new file mode 100644 index 0000000..25dc1fe --- /dev/null +++ b/views/account/changepass.ejs @@ -0,0 +1,25 @@ +<%- include('../partials/header') %> +<%- include('../partials/nav') %> + +<div class='content'> + <%- include('../partials/settings') %> + <div class='main'> + <div class='logCard'> + <h4 style='text-align: center;'>Edit Bio</h4> + <div class='fff'> + <form id='logform' action="/account/<%= usr._id %>/changepass" method='POST'> + <label for="">Old Password:</label> + <input type="password" name='oldpassword'> + <label for="">New Password:</label> + <input type="password" name='newpassword'> + <button><i class='fas fa-edit'></i></button> + </form> + </div> + </div> + </div> + <%- include('../partials/bio') %> +</div> + +<%- include('../partials/magicSets') %> +<%- include('../partials/magicBio') %> +<%- include('../partials/footer') %> diff --git a/views/account/editBio.ejs b/views/account/editBio.ejs new file mode 100644 index 0000000..fb0a95b --- /dev/null +++ b/views/account/editBio.ejs @@ -0,0 +1,27 @@ +<%- include('../partials/header') %> +<%- include('../partials/nav') %> + +<div class='content'> + <%- include('../partials/settings') %> + <div class='main'> + <div class='logCard'> + <h4 style='text-align: center;'>Edit Bio</h4> + <div class='fff'> + <form id='logform' action="/account/<%= usr._id %>?_method=PUT" method='POST'> + <label for="">Name:</label> + <input type="text" name='bio[name]' value='<%= account.bio.name %>'> + <label for="">Website:</label> + <input type="text" name='bio[website]' value='<%= account.bio.website %>'> + <label for="">About:</label> + <input type="text" name='bio[about]' value='<%= account.bio.about %>'> + <button><i class='fas fa-edit'></i></button> + </form> + </div> + </div> + </div> + <%- include('../partials/bio') %> +</div> + +<%- include('../partials/magicSets') %> +<%- include('../partials/magicBio') %> +<%- include('../partials/footer') %> diff --git a/views/account/saved.ejs b/views/account/saved.ejs new file mode 100644 index 0000000..2e4c864 --- /dev/null +++ b/views/account/saved.ejs @@ -0,0 +1,33 @@ +<%- include('../partials/header') %> +<%- include('../partials/nav') %> + +<div class='content'> + <%- include('../partials/settings') %> + <div class='main'> + <div class='recList'> + <% recipes.map(s => { %> + <div class='recCard'> + <img src="/images/<%= s.author.username %>/<%= s.picture %>" alt="recipe"> + <a href='/recipe/<%= s._id %>'><%= s.title %></a> + <% if(usr) { %> + <% if(usr._id.equals(s.author.id)) { %> + <div class='recControl'> + <form action="/recipe/<%= s._id %>/edit"> + <button class='acRecBtns'><i class='fas fa-edit'></i></button> + </form> + <form action='/recipe/<%= s._id %>?_method=DELETE' method='POST'> + <button class='acRecBtns' type='submit'><i class='fas fa-trash'></i></button> + </form> + </div> + <% } %> + <% } %> + </div> + <% }) %> + </div> + </div> + <%- include('../partials/bio') %> +</div> + +<%- include('../partials/magicSets') %> +<%- include('../partials/magicBio') %> +<%- include('../partials/footer') %> diff --git a/views/category/cats.ejs b/views/category/cats.ejs new file mode 100644 index 0000000..694a03b --- /dev/null +++ b/views/category/cats.ejs @@ -0,0 +1,38 @@ +<%- include('../partials/header') %> +<%- include('../partials/nav') %> +<%- include('../partials/search') %> + +<div class='content'> + <%- include('../partials/categories') %> + <div class='main'> + <div class='recList'> + <% recipes.filter(r => { %> + <% if(r.category.toLowerCase() === query) { %> + <div class='recCard'> + <img src="/images/<%= r.author.username %>/<%= r.picture %>" alt="recipe"> + <a href='/recipe/<%= r._id %>'><%= r.title %></a> + <% if(usr) { %> + <% if(usr._id.equals(r.author.id)) { %> + <div class='recControl'> + <form action="/recipe/<%= r._id %>/edit"> + <button class='acRecBtns'><i class='fas fa-edit'></i></button> + </form> + <form action='/recipe/<%= r._id %>?_method=DELETE' method='POST'> + <button class='acRecBtns' type='submit'><i class='fas fa-trash'></i></button> + </form> + </div> + <% } %> + <% } %> + </div> + <% } %> + <% }) %> + + + </div> + </div> + <%- include('../partials/popular') %> +</div> + +<%- include('../partials/magicCats') %> +<%- include('../partials/magicPops') %> +<%- include('../partials/footer') %> diff --git a/views/index.ejs b/views/index.ejs new file mode 100644 index 0000000..d66a90b --- /dev/null +++ b/views/index.ejs @@ -0,0 +1,30 @@ +<%- include('partials/header') %> +<%- include('partials/nav') %> +<%- include('partials/search') %> + +<div class='content'> + <%- include('partials/categories') %> + <div class='main'> + <div class='welcome'> + <h4>Welcome to the International Kitchen</h4> + <p>A web application to find and share recipes with friends without the hassles of things likes adds and trackers.</p> + <br> + <h4>Instructions</h4> + <p>Simply create an account and start sharing your recipes. Please avoid using stock photos. Every recipe has a photo, category, list of ingredients and instruction steps. You can choose any category you want or make your own. </p> + <p>If you experience any problems or bugs email me at gferrand@vagrantz.xyz</p> + <br> + <h4>Donate</h4> + <p>This app is free and has no adds. If you enjoy using this app consider donating to help support this project (:</p> + <form action="https://www.paypal.com/donate" method="post" target="_top" style='display: flex; justify-content: center'> + <input type="hidden" name="hosted_button_id" value="MBP43328GCS7C" /> + <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_donate_SM.gif" border="0" name="submit" title="PayPal - The safer, easier way to pay online!" alt="Donate with PayPal button" /> + <img alt="" border="0" src="https://www.paypal.com/en_PT/i/scr/pixel.gif" width="1" height="1" /> + </form> + <br> + </div> + </div> + <%- include('partials/popular') %> +</div> +<%- include('partials/magicCats') %> +<%- include('partials/magicPops') %> +<%- include('partials/footer') %> diff --git a/views/login.ejs b/views/login.ejs new file mode 100644 index 0000000..4415a64 --- /dev/null +++ b/views/login.ejs @@ -0,0 +1,26 @@ +<%- include('partials/header') %> +<%- include('partials/nav') %> +<%- include('partials/search') %> + +<div class='content'> + <%- include('partials/categories') %> + <div class='main'> + <div class='logCard'> + <h4 style='text-align: center'>Login</h4> + <div class='fff'> + <form id='logform' action="/login" method='POST'> + <label for="">Email:</label> + <input type="email" name='username'> + <label for="">Password:</label> + <input type="password" name='password'> + <button type='submit'>Login</button> + </form> + </div> + </div> + </div> + <%- include('partials/popular') %> +</div> + +<%- include('partials/magicCats') %> +<%- include('partials/magicPops') %> +<%- include('partials/footer') %> diff --git a/views/partials/bio.ejs b/views/partials/bio.ejs new file mode 100644 index 0000000..198aa27 --- /dev/null +++ b/views/partials/bio.ejs @@ -0,0 +1,19 @@ +<div class='pops'> + <div class='bioDisplay'> + <h4><%= account.bio.name %></h4> + <ul> + <li> + <p>Email:</p> + <p><%= account.author.username %></p> + </li> + <li> + <p>Website:</p> + <p><%= account.bio.website %></p> + </li> + <li> + <p>About:</p> + <p><%= account.bio.about %></p> + </li> + </ul> + </div> +</div>
\ No newline at end of file diff --git a/views/partials/categories.ejs b/views/partials/categories.ejs new file mode 100644 index 0000000..638b2bb --- /dev/null +++ b/views/partials/categories.ejs @@ -0,0 +1,8 @@ +<div class='cats'> + <h4>Categories</h4> + <ul> + <% cats.map(c => { %> + <li><a href='/categories/<%= c.toLowerCase() %>'><%= c %></a></li> + <% }) %> + </ul> +</div>
\ No newline at end of file diff --git a/views/partials/footer.ejs b/views/partials/footer.ejs new file mode 100644 index 0000000..89a9ee1 --- /dev/null +++ b/views/partials/footer.ejs @@ -0,0 +1,3 @@ +<script type='text/javascript' src="/libs/resp.js"></script> +</body> +</html> diff --git a/views/partials/header.ejs b/views/partials/header.ejs new file mode 100644 index 0000000..13a6cf0 --- /dev/null +++ b/views/partials/header.ejs @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <title>Recipes</title> + <link rel="stylesheet" type='text/css' href="/main.css"> + <script defer src="/libs/fontawesome/all.min.js"></script> + <script type='text/javascript' src="/libs/jquery/jquery-3.6.0.min.js"></script> +</head> +<body> +<% if(error && error.length > 0) { %> + <div"> + <div class='flashCardError' role="alert"> + <%= error %> + </div> + </div> +<% } %> +<% if(success && success.length > 0) { %> + <div> + <div class='flashCardSuccess' role="alert"> + <%= success %> + </div> + </div> +<% } %> diff --git a/views/partials/magicBio.ejs b/views/partials/magicBio.ejs new file mode 100644 index 0000000..4d448a1 --- /dev/null +++ b/views/partials/magicBio.ejs @@ -0,0 +1,21 @@ +<div class='magicPops invis'> + <div class='magicbioDisplay'> + <h4><%= account.bio.name %></h4> + <ul> + <% if(usr) { %> + <li> + <p>Email:</p> + <p><%= account.author.username %></p> + </li> + <% } %> + <li> + <p>Website:</p> + <p><%= account.bio.website %></p> + </li> + <li> + <p>About:</p> + <p><%= account.bio.about %></p> + </li> + </ul> + </div> +</div> diff --git a/views/partials/magicCats.ejs b/views/partials/magicCats.ejs new file mode 100644 index 0000000..fb49d05 --- /dev/null +++ b/views/partials/magicCats.ejs @@ -0,0 +1,8 @@ +<div class='magicCats invis'> + <h4>Categories</h4> + <ul> + <% cats.map(c => { %> + <li><a href='/categories/<%= c.toLowerCase() %>'><%= c %></a></li> + <% }) %> + </ul> +</div> diff --git a/views/partials/magicPops.ejs b/views/partials/magicPops.ejs new file mode 100644 index 0000000..3583b7b --- /dev/null +++ b/views/partials/magicPops.ejs @@ -0,0 +1,14 @@ +<div class='magicPops invis'> + <h4>Popular</h4> + <div class='popCard'> + <% popular.map(p => { %> + <div class='popular'> + <h5><%= p.title %></h5> + <img src="/images/<%= p.author.username %>/<%= p.picture %>" alt="recipe" style='width: 10rem; height: 10rem; object-fit: cover;'> + <form action="/recipe/<%= p._id %>"> + <button>See Recipe</button> + </form> + </div> + <% }) %> + </div> +</div> diff --git a/views/partials/magicSets.ejs b/views/partials/magicSets.ejs new file mode 100644 index 0000000..b61d3bb --- /dev/null +++ b/views/partials/magicSets.ejs @@ -0,0 +1,15 @@ +<div class='magicSets invis'> + <h4>Settings</h4> + <ul> + <li><a href='/account/<%= usr._id %>/bio/edit'>Edit Bio</a></li> + <li><a href='/account/<%= usr._id %>/saved'>Saved Recipes</a></li> + <li><a href='/account/<%= usr._id %>/changepass'>Change Password</a></li> + <li> + <form action="/account/<%= usr._id %>?_method=DELETE" method='POST'> + <button style='background-color: rgba(255,255,255,0); border: none; padding: 0; color: blueviolet; font-size: medium;'> + Delete Account + </button> + </form> + </li> + </ul> +</div> diff --git a/views/partials/nav.ejs b/views/partials/nav.ejs new file mode 100644 index 0000000..838d228 --- /dev/null +++ b/views/partials/nav.ejs @@ -0,0 +1,59 @@ +<div class='nav'> + <% if(page === 'home') { %> + <% if(usr) { %> + <h4><a href="/" style='background-color: crimson'>Recipes</a></h4> + <h4><a href='/recipe/create'>Create</a></h4> + <h4><a href='/account/<%= usr._id %>'>Account</a></h4> + <h4><a href='/logout'>Logout</a></h4> + <% } else { %> + <h4><a href="/" style='background-color: crimson'>Recipes</a></h4> + <h4><a href="/login">Login</a></h4> + <h4><a href='/register'>Register</a></h4> + <% } %> + <% } else if(page === 'login') { %> + <h4><a href="/">Recipes</a></h4> + <h4><a href="/login" style='background-color: crimson'>Login</a></h4> + <h4><a href='/register'>Register</a></h4> + <% } else if(page === 'register') { %> + <h4><a href="/">Recipes</a></h4> + <h4><a href="/login">Login</a></h4> + <h4><a href='/register' style='background-color: crimson'>Register</a></h4> + <% } else if(page === 'create') { %> + <% if(usr) { %> + <h4><a href="/">Recipes</a></h4> + <h4><a href='/recipe/create' style='background-color: crimson'>Create</a></h4> + <h4><a href='/account/<%= usr._id %>'>Account</a></h4> + <h4><a href='/logout'>Logout</a></h4> + <% } %> + <% } else if(page === 'account') { %> + <% if(usr) { %> + <h4><a href="/">Recipes</a></h4> + <h4><a href='/recipe/create'>Create</a></h4> + <h4><a href='/account/<%= usr._id %>' style='background-color: crimson'>Account</a></h4> + <h4><a href='/logout'>Logout</a></h4> + <% } else { %> + <h4><a href="/" style='background-color: crimson'>Recipes</a></h4> + <h4><a href="/login">Login</a></h4> + <h4><a href='/register'>Register</a></h4> + <% } %> + <% } else if(page === 'show') { %> + <% if(usr) { %> + <h4><a href="/" style='background-color: crimson'>Recipes</a></h4> + <h4><a href='/recipe/create'>Create</a></h4> + <h4><a href='/account/<%= usr._id %>'>Account</a></h4> + <h4><a href='/logout'>Logout</a></h4> + <% } else { %> + <h4><a href="/" style='background-color: crimson'>Recipes</a></h4> + <h4><a href="/login">Login</a></h4> + <h4><a href='/register'>Register</a></h4> + <% } %> + <% } else if(page === 'search') { %> + <h4><a href="/" style='background-color: crimson'>Recipes</a></h4> + <h4><a href="/login">Login</a></h4> + <h4><a href='/register'>Register</a></h4> + <% } else { %> + <h4><a href="/">Recipes</a></h4> + <h4><a href="/login">Login</a></h4> + <h4><a href='/register'>Register</a></h4> + <% } %> +</div>
\ No newline at end of file diff --git a/views/partials/popular.ejs b/views/partials/popular.ejs new file mode 100644 index 0000000..af83f34 --- /dev/null +++ b/views/partials/popular.ejs @@ -0,0 +1,14 @@ +<div class='pops'> + <h4>Popular</h4> + <div class='popCard'> + <% popular.map(p => { %> + <div class='popular'> + <h5><%= p.title %></h5> + <img src="/images/<%= p.author.username %>/<%= p.picture %>" alt="recipe" style='width: 10rem; height: 10rem; object-fit: cover;'> + <form action="/recipe/<%= p._id %>"> + <button>See Recipe</button> + </form> + </div> + <% }) %> + </div> +</div> diff --git a/views/partials/search.ejs b/views/partials/search.ejs new file mode 100644 index 0000000..f838b4c --- /dev/null +++ b/views/partials/search.ejs @@ -0,0 +1,18 @@ +<div class='searchbox'> + <h2>Search Recipes</h2> + <form id='searchForm'> + <% if(page === 'search') { %> + <input id='srchInpt' type="text" value='<%= query %>'> + <button id='srchBtn' type='submit'> + <i class='fas fa-search'></i> + </button> + <% } else {%> + <input id='srchInpt' type="text"> + <button id='srchBtn' type='submit'> + <i class='fas fa-search'></i> + </button> + <% } %> + </form> +</div> + +<script type='text/javascript' src="/libs/search.js"></script>
\ No newline at end of file diff --git a/views/partials/settings.ejs b/views/partials/settings.ejs new file mode 100644 index 0000000..08ac1cd --- /dev/null +++ b/views/partials/settings.ejs @@ -0,0 +1,15 @@ +<div class='sets'> + <h4>Settings</h4> + <ul> + <li><a href='/account/<%= usr._id %>/bio/edit'>Edit Bio</a></li> + <li><a href='/account/<%= usr._id %>/saved'>Saved Recipes</a></li> + <li><a href='/account/<%= usr._id %>/changepass'>Change Password</a></li> + <li> + <form action="/account/<%= usr._id %>?_method=DELETE" method='POST'> + <button style='background-color: rgba(255,255,255,0); border: none; padding: 0; color: blueviolet; font-size: medium;'> + Delete Account + </button> + </form> + </li> + </ul> +</div>
\ No newline at end of file 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') %> diff --git a/views/register.ejs b/views/register.ejs new file mode 100644 index 0000000..1dbc13e --- /dev/null +++ b/views/register.ejs @@ -0,0 +1,32 @@ +<%- include('partials/header') %> +<%- include('partials/nav') %> +<%- include('partials/search') %> + +<div class='content'> + <%- include('partials/categories') %> + <div class='main'> + <div class='logCard'> + <h4 style='text-align: center'>Register</h4> + <div class='fff'> + <form id='logform' action="/register" method='POST'> + <label for="" type='text'>Name</label> + <input type="text" name='name'> + <label for="">Email:</label> + <input type="email" name='username'> + <label for="">Website:</label> + <input type="text" name='website'> + <label for="">About:</label> + <input type="text" name='about'> + <label for="">Password:</label> + <input type="password" name='password'> + <button type='submit'>Register</button> + </form> + </div> + </div> + </div> + <%- include('partials/popular') %> +</div> + +<%- include('partials/magicCats') %> +<%- include('partials/magicPops') %> +<%- include('partials/footer') %> diff --git a/views/search.ejs b/views/search.ejs new file mode 100644 index 0000000..3bf35be --- /dev/null +++ b/views/search.ejs @@ -0,0 +1,38 @@ +<%- include('partials/header') %> +<%- include('partials/nav') %> +<%- include('partials/search') %> + +<div class='content'> + <%- include('partials/categories') %> + <div class='main'> + <div class='recList'> + <% recipes.filter(r => { %> + <% if(r.title.toLowerCase().includes(query.toLowerCase())) { %> + <div class='recCard'> + <img src="/images/<%= r.author.username %>/<%= r.picture %>" alt="recipe"> + <a href='/recipe/<%= r._id %>'><%= r.title %></a> + <% if(usr) {%> + <% if(usr._id.equals(r.author.id)) { %> + <div class='recControl'> + <form action="/recipe/<%= r._id %>/edit"> + <button class='acRecBtns'><i class='fas fa-edit'></i></button> + </form> + <form action='/recipe/<%= r._id %>?_method=DELETE' method='POST'> + <button class='acRecBtns' type='submit'><i class='fas fa-trash'></i></button> + </form> + </div> + <% } %> + <% } %> + </div> + <% } else { %> + + <% } %> + <% }) %> + </div> + </div> + <%- include('partials/popular') %> +</div> + +<%- include('partials/magicCats') %> +<%- include('partials/magicPops') %> +<%- include('partials/footer') %> |