Skip to content

Commit

Permalink
edit page fornt end and backend
Browse files Browse the repository at this point in the history
  • Loading branch information
@garimasingh22
garimasingh22 committed Aug 27, 2020
1 parent eef4729 commit d3dd309
Show file tree
Hide file tree
Showing 4 changed files with 235 additions and 68 deletions.
49 changes: 25 additions & 24 deletions app.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,19 +41,19 @@ app.use(express.json());

// Method override
app.use(
methodOverride(function (req, res) {
if (req.body && typeof req.body === "object" && "_method" in req.body) {
// look in urlencoded POST bodies and delete it
let method = req.body._method;
delete req.body._method;
return method;
}
})
methodOverride(function(req, res) {
if (req.body && typeof req.body === "object" && "_method" in req.body) {
// look in urlencoded POST bodies and delete it
let method = req.body._method;
delete req.body._method;
return method;
}
})
);

// Logging
if (process.env.NODE_ENV === "development") {
app.use(morgan("dev"));
app.use(morgan("dev"));
}

// EJS
Expand All @@ -66,12 +66,12 @@ app.use(expressLayouts);

// Sessions
app.use(
session({
secret: "keyboard cat",
resave: false,
saveUninitialized: false,
store: new MongoStore({ mongooseConnection: mongoose.connection }),
})
session({
secret: "keyboard cat",
resave: false,
saveUninitialized: false,
store: new MongoStore({ mongooseConnection: mongoose.connection }),
})
);

// cookie middleware
Expand All @@ -85,12 +85,12 @@ app.use(passport.session());
app.use(flash());

// Set Global variables
app.use(function (req, res, next) {
res.locals.user = req.user || null;
res.locals.success_msg = req.flash("success_msg");
res.locals.error_msg = req.flash("error_msg");
res.locals.error = req.flash("error");
next();
app.use(function(req, res, next) {
res.locals.user = req.user || null;
res.locals.success_msg = req.flash("success_msg");
res.locals.error_msg = req.flash("error_msg");
res.locals.error = req.flash("error");
next();
});

// Static folder
Expand All @@ -108,12 +108,13 @@ app.use("/done", require("./routes/api/done"));
app.use("/addBalance", require("./routes/api/addBalance"));
app.use("/transaction", require("./routes/api/transaction"));
app.use("/search", require("./routes/api/search"));
app.use("/edit", require("./routes/api/edit"));

// Port: Love You 3000
const PORT = process.env.PORT || 3000;

// Server Listening
app.listen(
PORT,
console.log(`Server running in ${process.env.NODE_ENV} mode on port ${PORT}`)
);
PORT,
console.log(`Server running in ${process.env.NODE_ENV} mode on port ${PORT}`)
);
67 changes: 67 additions & 0 deletions routes/api/edit.js
View file
Original file line number Diff line number Diff line change
@@ -1 +1,68 @@
// Edit Profile Route
const express = require('express')
const router = express.Router()
const { ensureAuth } = require('../../middleware/auth')

const User = require('../../models/User.js');
const { id } = require('date-fns/locale');
const { last } = require('lodash');



// @desc Show edit page
// @route GET /edit/:id
router.get("/:id", ensureAuth, (req, res) => {
let avatar = req.user.image;
let curruser = req.user;
let firstName = req.user.firstName;
let lastName = req.user.lastName;
let email = req.user.email;
let googleId = req.user.googleId;
let _id = req.user._id;

console.log(avatar);


res.status(200).render("edit", {
layout: "layouts/app",
avatar,
firstName,
lastName,
email,
googleId,
_id,
href: "/edit",
});
});

router.put("/:id", ensureAuth, async(req, res) => {
try {

let curruser1 = await User.findById(req.params.id).lean();

curruser1.firstName = req.body.firstName;
curruser1.lastName = req.body.lastName;
curruser1.email = req.body.email;
curruser1.displayName = curruser1.firstName + " " + curruser1.lastName

console.log(curruser1.firstName + "this is the first name");
console.log(curruser1.lastName + "this is the last name");
console.log(curruser1.displayName + "this is the disply name");
console.log(curruser1.email + "this is the email");
curruser1 = await User.findOneAndUpdate({ _id: req.params.id }, {
firstName: curruser1.firstName,
lastName: curruser1.lastName,
email: curruser1.email,
displayName: curruser1.displayName,
}, {
new: true, // it will create a new one, if it doesn't exist
runValidators: true, // it check weather the fields are valid or not
});
res.redirect("/portfolio");
} catch (err) {
console.error(err)
return res.render('error/500')
}
});

module.exports = router;
98 changes: 97 additions & 1 deletion views/edit.ejs
View file
Original file line number Diff line number Diff line change
@@ -1 +1,97 @@
<h1>Edit Profile</h1>
<!-- <div class="m-auto">
<h3 class="m-auto">Edit Profile</h3>
<div class="row m-auto">
<form action="/edit/<%=_id%>" method="POST" class="col s12">
<input type="hidden" name="_method" value="PUT">
<h4>
USER-FIRSTNAME
<input type="text" name="firstName" value="<%=firstName%>" />
</h4>
<div class="row">
<div class="input-field">
<input type="text" id="lastName" name="lastName" value="<%=lastName%>">
<label for="lastName">lastName</label>
</div>
</div>
<div class="row">
<div class="input-field">
<input type="email" id="email" name="email" value="<%=email%>">
<label for="email">Email</label>
</div>
</div>
<div class="row">
<input type="submit" value="Save" class="btn">
<a href="/portfolio" class="btn orange">Cancel</a>
</div>
</form>
</div>
</div> -->
<main class="md:col-span-4 md:ml-56 lg:ml-64 md:pr-14 w-full">
<div class="container px-5 py-10 mx-auto md:px-auto ">
<!-- header -->

<header class="my-4 absolute-center">
<span class="text-gray-700 text-3xl font-semibold leading-none tracking-wider">Edit Profile</span
>
</header>

<hr class="line my-4" />

<!--form -->


<form action="/edit/<%=_id%>" method="POST" class="w-full max-w-sm md:pl-48 m-auto">
<input type="hidden" name="_method" value="PUT">
<div class="md:flex md:items-center mb-6">
<div class="md:w-1/3">
<label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4 mr-4" for="inline-full-name">
First Name :
</label>
</div>
<div class="md:w-2/3">
<input type="text" name="firstName" value="<%=firstName%>" class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500" />
<!-- <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500" id="inline-full-name" type="text" value="Jane Doe"> -->
</div>
</div>
<div class="md:flex md:items-center mb-6">
<div class="md:w-1/3">
<label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4 mr-4" for="inline-full-name">
Last Name :
</label>
</div>
<div class="md:w-2/3">
<input type="text" id="lastName" name="lastName" value="<%=lastName%>" class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500">
<!-- <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500" id="inline-full-name" type="text" value="Jane Doe"> -->
</div>
</div>
<div class="md:flex md:items-center mb-6">
<div class="md:w-1/3">
<label class="block text-gray-500 font-bold md:text-right mb-1 md:mb-0 pr-4 mr-4" for="inline-full-name">
Email_____ <span class="mr-10">:</span>
</label>
</div>
<div class="md:w-2/3">
<input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500" type="email" id="email" name="email" value="<%=email%>">
<!-- <input class="bg-gray-200 appearance-none border-2 border-gray-200 rounded w-full py-2 px-4 text-gray-700 leading-tight focus:outline-none focus:bg-white focus:border-purple-500" id="inline-full-name" type="text" value="Jane Doe"> -->
</div>
</div>


<div class="md:flex md:items-center">
<div class="md:w-1/2">
<input type="submit" value="Save" class="btn mb-4 shadow bg-purple-500 hover:bg-purple-400 focus:shadow-outline focus:outline-none text-white font-bold py-2 px-4 rounded">
<!-- <button class="shadow bg-purple-500 hover:bg-purple-400 focus:shadow-outline focus:outline-none text-white font-bold py-2 px-4 rounded" type="button">
Save
</button> -->
</div>
<div class="md:w-1/2">
<button class="mb-4 shadow bg-purple-500 hover:bg-purple-400 focus:shadow-outline focus:outline-none text-white font-bold py-2 px-4 rounded" type="button">
<a href="/portfolio">Cancel</a>
</button>
</div>
</div>
</form>
</div>
</main>
89 changes: 46 additions & 43 deletions views/partials/_nav.ejs
View file
Original file line number Diff line number Diff line change
@@ -1,18 +1,15 @@
<script src="https://cdn.jsdelivr.net/gh/alpinejs/[email protected]/dist/alpine.min.js" defer></script>

<div @click.away="open = false"
class="flex flex-col w-full md:w-56 lg:w-64 text-gray-700 bg-white flex-shrink-0 md:h-screen md:z-50 md:fixed md:left-0 md:top-0"
x-data="{ open: false }">
<div @click.away="open = false" class="flex flex-col w-full md:w-56 lg:w-64 text-gray-700 bg-white flex-shrink-0 md:h-screen md:z-50 md:fixed md:left-0 md:top-0" x-data="{ open: false }">

<div class="flex-shrink-0 px-6 py-4 flex flex-row items-center justify-between">
<div class="flex-shrink-0 text-center">
<img class="h-8 w-8 tradebyte-logo " src="../images/TradeByte-Favicon.png" alt="Logo">
</div>
<h4 class="font-bold text-center pt-1">
<a href="/"
class="hover:text-gray-900 tracking-widest text-2xl md:text-2xl lg:text-3xl tradebyte-logo">Tradebyte</a>
</h4>
<button class="rounded-lg md:hidden rounded-lg focus:outline-none focus:shadow-outline" @click="open = !open">
<div class="flex-shrink-0 px-6 py-4 flex flex-row items-center justify-between">
<div class="flex-shrink-0 text-center">
<img class="h-8 w-8 tradebyte-logo " src="../images/TradeByte-Favicon.png" alt="Logo">
</div>
<h4 class="font-bold text-center pt-1">
<a href="/" class="hover:text-gray-900 tracking-widest text-2xl md:text-2xl lg:text-3xl tradebyte-logo">Tradebyte</a>
</h4>
<button class="rounded-lg md:hidden rounded-lg focus:outline-none focus:shadow-outline" @click="open = !open">
<svg fill="currentColor" viewBox="0 0 20 20" class="w-6 h-6">
<path x-show="!open" fill-rule="evenodd"
d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM9 15a1 1 0 011-1h6a1 1 0 110 2h-6a1 1 0 01-1-1z"
Expand All @@ -23,60 +20,66 @@
</svg>
</button>

</div>
</div>


<nav :class="{'block': open, 'hidden': !open}" class="flex-grow md:block px-4 pb-4 md:pb-0">
<nav :class="{'block': open, 'hidden': !open}" class="flex-grow md:block px-4 pb-4 md:pb-0">

<hr class="line mb-6">
<hr class="line mb-6">

<div class="flex justify-center align-center rounded-full">
<img class="h-16 w-16 border-8 user-profile box-1 rounded-full" src="<%= user.image %>" alt="" />
</div>
<div class="flex justify-center align-center rounded-full">
<img class="h-16 w-16 border-8 user-profile box-1 rounded-full" src="<%= user.image %>" alt="" />
</div>

<a class="block w-2/5 md:w-4/5 max-w-xs p-2 mt-4 mb-8 mx-auto text-xs font-bold text-gray-900 focus:shadow-outline flex justify-center rounded-full text-green-900 font-bold tick-background"
href="#">
<div class="tick mr-1">
<svg class="w-5 mr-1 " fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
viewBox="0 0 24 24" stroke="currentColor">
<a class="block w-2/5 md:w-4/5 max-w-xs p-2 mt-4 mb-8 mx-auto text-xs font-bold text-gray-900 focus:shadow-outline flex justify-center rounded-full text-green-900 font-bold tick-background" href="#">
<div class="tick mr-1">
<svg class="w-5 mr-1 " fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24" stroke="currentColor">
<path d="M5 13l4 4L19 7"></path>
</svg>
</div> Trading Active
</a>
</div> Trading Active
</a>

<div class="nav-box flex flex-col justify-start">
<div class="nav-box flex flex-col justify-start">

<a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/portfolio' ? 'border tab-color border-l-8': '' %>"
href="/portfolio">
<svg class="w-5 ml-2 mr-1" fill="none " stroke-linecap="round " stroke-linejoin="round " stroke-width="2 "
viewBox="0 0 24 24 " stroke="currentColor ">
<a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/portfolio' ? 'border tab-color border-l-8': '' %>"
href="/portfolio">
<svg class="w-5 ml-2 mr-1" fill="none " stroke-linecap="round " stroke-linejoin="round " stroke-width="2 " viewBox="0 0 24 24 " stroke="currentColor ">
<path
d="M4 5a1 1 0 011-1h14a1 1 0 011 1v2a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM4
13a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1v-6zM16 13a1 1 0 011-1h2a1 1 0 011 1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-6z ">
</path>
</svg>Dashboard</a>

<a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/market' ? 'border tab-color border-l-8': '' %>"
href="/market"><svg class="w-5 ml-2 mr-1" fill="none " stroke-linecap="round " stroke-linejoin="round "
<a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/edit/user._id' ? 'border tab-color border-l-8': '' %>"
href="/edit/<%= user._id %>">
<svg class="w-5 ml-2 mr-1" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z" />
</svg> Edit Profile
</a>



<a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/market' ? 'border tab-color border-l-8': '' %>"
href="/market"><svg class="w-5 ml-2 mr-1" fill="none " stroke-linecap="round " stroke-linejoin="round "
stroke-width="2 " viewBox="0 0 24 24 " stroke="currentColor ">
<path d="M8 14v3m4-3v3m4-3v3M3 21h18M3 10h18M3 7l9-4 9 4M4 10h16v11H4V10z "></path>
</svg>Market</a>

<a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/addBalance' ? 'border tab-color border-l-8': '' %>"
href="/addBalance">+ Add Balance</a>
<!-- only for development purpose i added ADD BALANCE button here on navbar. -->
<a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/addBalance' ? 'border tab-color border-l-8': '' %>"
href="/addBalance">+ Add Balance</a>
<!-- only for development purpose i added ADD BALANCE button here on navbar. -->

<a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/trasaction' ? 'border tab-color border-l-8': '' %>"
href="/transaction">$ Transactions History</a>
<!-- only for development purpose i added TRANSACTION HISTORY button here on navbar. -->
<a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/trasaction' ? 'border tab-color border-l-8': '' %>"
href="/transaction">$ Transactions History</a>
<!-- only for development purpose i added TRANSACTION HISTORY button here on navbar. -->

<a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/auth/logout' ? 'border tab-color border-l-8': '' %>"
href="/auth/logout"><svg class="w-6 ml-2 mr-1" fill="currentColor" viewBox="0 0 20 20">
<a class="block px-4 py-2 mt-2 text-sm font-semibold text-gray-900 hover:text-blue-800 focus:text-blue-900 hover:bg-blue-100 focus:bg-blue-200 focus:outline-none focus:shadow-outline flex <%= href === '/auth/logout' ? 'border tab-color border-l-8': '' %>"
href="/auth/logout"><svg class="w-6 ml-2 mr-1" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd"
d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
clip-rule="evenodd"></path>
</svg>Logout</a>

</div>
</nav>
</div>
</div>
</nav>
</div>

0 comments on commit d3dd309

Please sign in to comment.