<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Edit Profile - <%= user.fullName %></title>
<%- include('./partials/csslinks') %>
</head>
<body>
<%- include('./partials/header') %>
<section class="dashboard-main-section">
<div class="container">
<div class="dashboard-main-setting profile-info mx-auto">
<div class="profile-history">
<div class="profile-person-history">
<img src="<%= user.profilePic ? user.profilePic : '/assets/img/user-icon.webp' %>" alt="">
<div class="px-3">
<!-- <%= JSON.stringify(user) %> -->
<h6><%= user.fullName %></h6>
<span>
<%= user['subHeading'] ? user['subHeading'] : 'Enter Sub Heading' %>
</span>
</div>
</div>
<div class="d-flex align-items-center flex-wrap justify-content-center">
<a href="/profile" class="dash-btn"> <i class="bi bi-check2-all text-white px-1"></i> Done</a>
<a class="chat-btn" href="/chat"><i class="bi bi-chat"></i></a>
<button type="button" class="logout-btn ms-2"><i class="bi bi-bell"></i></button>
</div>
</div>
<div class="row justify-content-between my-4">
<div class="col-lg-4 col-12">
<div class="history-btn-design">
<a href="/edit/profile"> <button type="button" class="dash-btn">
Home</button></a>
<!-- <button type="button" class="dash-btn">
Show History</button> -->
</div>
</div>
</div>
<h5 class="fw-bold text-center fw-head">Profile Portfolio</h5>
<div class="profile-banner">
<div class="banner-cover">
<label for="cover-photo-input" class="edit-btn">
<input class="d-none" type="file" id="cover-photo-input" accept="image/*">
<i class="bi bi-pencil-square"></i> Edit Cover Photo
</label>
<img class="img-fluid" src="<%= user.coverPhoto ? user.coverPhoto : '/assets/img/cover.png' %>" alt="">
</div>
<div class="banner-info">
<div class="profile-person-history large-img">
<div class="img-wrap">
<input type="file" id="profile-pic-input" accept="image/*">
<label class="edit-btn" for="profile-pic-input">
<i class="bi bi-pencil-square"></i> Edit Profile Photo
</label>
<img src="<%= user.profilePic ? user.profilePic : '/assets/img/user-icon.webp' %>" alt="">
</div>
<div class="px-3 pb-2">
<h5>
<%= user.fullName %><span> (<%= user.jobTitle ? user.jobTitle : 'Job Title Here' %>)</span>
</h5>
<span><span data-name="headline" class="edit-it">
<%= user.subHeading ? user.subHeading : "Enter Sub Heading" %>
</span>
<button type="button" data-bs-toggle="modal" data-bs-target="#edit-name-headling" class="edit-btn">
<i class="bi bi-pencil-square"></i>
</button>
</span>
</div>
</div>
<span class="profile-badge">
<button type="button" data-bs-toggle="modal" data-bs-target="#edit-experience" class="edit-btn">
<i class="bi bi-pencil-square"></i> Edit
</button>
<%= user.experience ? user.experience : '0' %>+ Years Of Experience
</span>
</div>
</div>
<ul class="other-info">
<!-- <li>@edwardjj53</li> -->
<% if(user.location) { %><li><%= user.location %></li> <% } %>
<%
const monthsShort = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
const joiningDate = new Date(user.createdAt)
const joiningMonth = monthsShort[joiningDate.getMonth()]
const joiningYear = joiningDate.getFullYear()
%>
<li>Member Since, <%= joiningMonth %> <%= joiningYear %></li>
<li>
<button type="button" data-bs-toggle="modal" data-bs-target="#edit-name-headling" class="edit-btn">
<i class="bi bi-pencil-square"></i>
</button>
</li>
</ul>
<div class="additional-info">
<div class="row g-0">
<div class="col-lg-8 col-12 panel">
<div class="info-item-l h-100">
<h6 class="fw-bold">About
<button type="button" data-bs-toggle="modal" data-bs-target="#edit-profile-about" class="edit-btn">
<i class="bi bi-pencil-square"></i>
</button>
<% if(user.about){ %>
<% user.about.split('\n').forEach((para)=>{ %>
<p>
<p class="text-muted">
<%= para %>
</p>
</p>
<% }) %>
<% } else { %>
<p class="text-muted">No About...</p>
<% } %>
<% if(user.profileVideo){ %>
<div class="profile-video">
<!-- <a href="">
<i class="bi bi-play-fill"></i>
</a> -->
<ul>
<li>
<label for="profileVideo" class="edit-btn">
<input style="display: none;" type="file" id="profileVideo" accept="video/*">
<i class="bi bi-pencil-square"></i> Edit Profile Video
</label>
</li>
<li>
<button class="remove-btn remove-profile-video">
<i class="bi bi-trash"></i> Remove
</button>
</li>
</ul>
<video controls>
<source src="<%= user.profileVideo?.url %>">
</video>
</div>
<% } else { %>
<label class="empty-box" for="profileVideo">
<input type="file" name="profileVideo" id="profileVideo" accept="video/*">
<img src="/assets/img/video-upload.png" alt="">
<h5>Upload Video to show Here</h5>
</label>
<% } %>
</div>
</div>
<div class="col-lg-4 col-12 panel">
<div class="info-item-r h-100">
<h6 class="fw-bold">Connect With Me
<button type="button" data-bs-toggle="modal" data-bs-target="#edit-contact-info" class="edit-btn">
<i class="bi bi-pencil-square"></i>
</button>
</h6>
<ul class="contact-links">
<% if(user.primaryEmail?.email){ %>
<li>
<span>Email Address</span>
<a href="mailto:<%= user.primaryEmail?.email %>">
<%= user.primaryEmail?.email %>
</a>
</li>
<% } %>
<% if(user.phone){ %>
<li>
<span>Phone #</span>
<a href="tel:<%= user.phone %>">
<%= user.phone %>
</a>
</li>
<% } %>
<% if(user.portfolio){ %>
<li>
<span>portfolio</span>
<a href="<%= user.portfolio %>" target="_blank">
<%= extractDomain(user.portfolio) %>
</a>
</li>
<% } %>
</ul>
<div class="position-details">
<%= user.skills.length == 0 ? 'Add Skills' : '' %>
<% user.skills.forEach((item)=>{ %>
<span><%= item %></span>
<% }) %>
<button type="button" data-bs-toggle="modal" data-bs-target="#edit-skills-info" class="edit-btn">
<i class="bi bi-pencil-square"></i>
</button>
</div>
<div class="follow-more">
<% if(user.socialLinks?.length > 0) { %>
<h6>Follow To Know More About Me! <button type="button" data-bs-toggle="modal" data-bs-target="#edit-social-info" class="edit-btn">
<i class="bi bi-pencil-square"></i>
</button>
</h6>
<ul>
<% user.socialLinks?.forEach((item) => { %>
<li>
<form class="social-form">
<input type="hidden" name="<%= item.platform %>" value="">
<button title="delete <%= item.platform %>"><i class="bi bi-x"></i></button>
</form>
<a href="<%= item.baseUrl %><%= item.username %>" target="_blank">
<img src="/assets/img/social-icons/<%= item.platform %>.png" alt="">
</a>
</li>
<% }) %>
</ul>
<% } else { %>
<h6>Add Social Media Links! <button type="button" data-bs-toggle="modal" data-bs-target="#edit-social-info" class="edit-btn">
<i class="bi bi-plus-lg"></i>
</button>
</h6>
<% } %>
</div>
<!-- <img class="img-fluid mt-3" src="/assets/img/social.png" alt=""> -->
</div>
</div>
</div>
</div>
<div class="portfolio-showcase">
<ul class="user-academic">
<li>
<div class="item-head">
<h6 class="fw-bold">Experience</h6>
<button type="button" data-bs-toggle="modal" data-bs-target="#add-experience-about"><i class="bi bi-plus-circle-fill"></i></button>
</div>
<% if(user.experiences?.length > 0) { %>
<ul class="listing">
<% user.experiences.forEach((experience) => { %>
<li>
<div class="thumb">
<span class="year"><%= calculateYearsDifference(experience.startingDate,experience.endingDate).split(' ')[0] %></span>
<span class="txt">Years</span>
</div>
<div class="data">
<%
const monthsShort = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
%>
<h5 class="title"><%= experience.title %>
<ul>
<li>
<form class="edit-exp">
<input type="hidden" name="userId" value="<%= user._id %>">
<input type="hidden" name="experienceId" value="<%= experience._id %>">
<button type="submit" class="edit-btn">
<i class="bi bi-pencil-square"></i>
</button>
</form>
</li>
<li>
<form class="delete-exp">
<input type="hidden" name="userId" value="<%= user._id %>">
<input type="hidden" name="experienceId" value="<%= experience._id %>">
<button type="submit" class="remove-btn">
<i class="bi bi-trash"></i>
</button>
</form>
</li>
</ul>
</h5>
<h6 class="info"><%= experience.companyName %> · <%= experience.locationType %></h6>
<h6 class="info"><%= experience.startingDate ? monthsShort[experience.startingDate?.getMonth()] : '' %> <%= experience.startingDate ? experience.startingDate?.getFullYear() : '' %> - <%= experience.endingDate ? monthsShort[experience.endingDate?.getMonth()] : '' %> <%= experience.endingDate ? experience.endingDate?.getFullYear() : '' %> · <%= calculateYearsDifference(experience.startingDate,experience.endingDate) %></h6>
<h6 class="info"><%= experience.location %> - <%= experience.employementType %></h6>
<div class="desc">
<%- experience.description.replaceAll(' ','') %>
</div>
</div>
</li>
<% }) %>
</ul>
<% } %>
</li>
<li>
<div class="item-head">
<h6 class="fw-bold">Education</h6>
<!-- add-education -->
<button type="button" data-bs-toggle="modal" data-bs-target="#add-education"><i class="bi bi-plus-circle-fill"></i></button>
</div>
<% if(user.educations?.length > 0) { %>
<ul class="listing">
<% user.educations.forEach((education,ind) => { %>
<%
function getFirstLetters(input) {
// Split the input string by spaces to get the words
const words = input.trim().split(/\s+/);
// Extract the first letter of the first two words
const firstLetters = words.slice(0, 2).map(word => word.charAt(0).toUpperCase());
// Combine and return the letters
return firstLetters.join('');
}
const monthsShort = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
%>
<li>
<div class="thumb">
<span class="year"><%= getFirstLetters(education.institute) %></span>
</div>
<div class="data">
<h5 class="title"><%= education.institute %>
<ul>
<li>
<form class="edit-edu">
<input type="hidden" name="userId" value="<%= user._id %>">
<input type="hidden" name="educationId" value="<%= education._id %>">
<button type="submit" class="edit-btn">
<i class="bi bi-pencil-square"></i>
</button>
</form>
</li>
<li>
<form class="delete-edu">
<input type="hidden" name="userId" value="<%= user._id %>">
<input type="hidden" name="educationId" value="<%= education._id %>">
<button type="submit" class="remove-btn">
<i class="bi bi-trash"></i>
</button>
</form>
</li>
</ul>
</h5>
<h6 class="info"><%= education.degree %></h6>
<h6 class="info"><%= education.startingDate ? monthsShort[education.startingDate?.getMonth()] : '' %> <%= education.startingDate ? education.startingDate?.getFullYear() : '' %> - <%= education.endingDate ? monthsShort[education.endingDate?.getMonth()] : '' %> <%= education.endingDate ? education.endingDate?.getFullYear() : '' %></h6>
<h6 class="info"><%= education.location %></h6>
</div>
</li>
<% }) %>
</ul>
<% } %>
</li>
<li>
<div class="item-head">
<h6 class="fw-bold">Volunteer Experience</h6>
<button type="button" data-bs-toggle="modal" data-bs-target="#add-volunteer-exp"><i class="bi bi-plus-circle-fill"></i></button>
</div>
<% if(user.volunteerExperiences?.length > 0) { %>
<ul class="listing">
<% user.volunteerExperiences.forEach((experience) => { %>
<li>
<div class="thumb">
<span class="year"><%= calculateYearsDifference(experience.startingDate,experience.endingDate).split(' ')[0] %></span>
<span class="txt">Years</span>
</div>
<div class="data">
<%
const monthsShort = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
%>
<h5 class="title"><%= experience.title %>
<ul>
<li>
<form class="edit-volunteer-exp">
<input type="hidden" name="userId" value="<%= user._id %>">
<input type="hidden" name="experienceId" value="<%= experience._id %>">
<button type="submit" class="edit-btn">
<i class="bi bi-pencil-square"></i>
</button>
</form>
</li>
<li>
<form class="delete-vol-exp">
<input type="hidden" name="userId" value="<%= user._id %>">
<input type="hidden" name="experienceId" value="<%= experience._id %>">
<button type="submit" class="remove-btn">
<i class="bi bi-trash"></i>
</button>
</form>
</li>
</ul>
</h5>
<h6 class="info"><%= experience.companyName %> · <%= experience.locationType %></h6>
<h6 class="info"><%= experience.startingDate ? monthsShort[experience.startingDate?.getMonth()] : '' %> <%= experience.startingDate ? experience.startingDate?.getFullYear() : '' %> - <%= experience.endingDate ? monthsShort[experience.endingDate?.getMonth()] : '' %> <%= experience.endingDate ? experience.endingDate?.getFullYear() : '' %> · <%= calculateYearsDifference(experience.startingDate,experience.endingDate) %></h6>
<h6 class="info"><%= experience.location %></h6>
</div>
</li>
<% }) %>
</ul>
<% } %>
</li>
<li>
<div class="item-head">
<h6 class="fw-bold">Projects Showcase</h6>
<button data-bs-toggle="modal" data-bs-target="#add-project" title="Add Project"><i class="bi bi-plus-circle-fill"></i></button>
</div>
<% if(user.projects?.length> 0) { %>
<div class="row g-4 project-listing">
<% user.projects.forEach((item)=> { %>
<div class="col-lg-4 col-12">
<div class="project-item">
<button class="remove-btn remove-project-item" data-project="<%= item._id %>">
<i class="bi bi-trash"></i>
</button>
<h6>
<%= item.title %>
</h6>
<% if(item.image.split('.')[1].includes('mp4')){ %>
<video class="w-100" controls>
<source src="<%= item.image %>">
</video>
<% } else { %>
<a href="<%= item.image %>" data-fancybox="Projects">
<img class="img-fluid" src="<%= item.image %>" alt="<%= item.title %>">
</a>
<% } %>
</div>
</div>
<% }) %>
<% } %>
</li>
<li>
<div class="item-head">
<h6 class="fw-bold">Licenses & Certifications</h6>
<button data-bs-toggle="modal" data-bs-target="#add-license-certificate" title="Add License & Certification"><i class="bi bi-plus-circle-fill"></i></button>
</div>
<% if(user.licenseCertification?.length > 0) { %>
<ul class="listing">
<% user.licenseCertification.forEach((cert) => { %>
<li>
<div class="file-icon">
<img src="/assets/img/file-icon.png" alt="">
</div>
<div class="data">
<%
const monthsShort = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
%>
<h5 class="title"><%= cert?.title %>
<ul>
<li>
<form class="edit-cert">
<input type="hidden" name="userId" value="<%= user._id %>">
<input type="hidden" name="certId" value="<%= cert?._id %>">
<button type="submit" class="edit-btn">
<i class="bi bi-pencil-square"></i>
</button>
</form>
</li>
<li>
<form class="delete-cert">
<input type="hidden" name="userId" value="<%= user._id %>">
<input type="hidden" name="certId" value="<%= cert?._id %>">
<button type="submit" class="remove-btn">
<i class="bi bi-trash"></i>
</button>
</form>
</li>
</ul>
</h5>
<h6 class="info"><%= cert?.organization %> - <%= cert?.issueDate ? monthsShort[cert?.issueDate?.getMonth()] : '' %> <%= cert?.issueDate ? cert?.issueDate?.getFullYear() : '' %></h6>
</div>
</li>
<% }) %>
</ul>
<% } %>
</li>
<li>
<div class="item-head">
<h6 class="fw-bold">Personal Documents</h6>
<button data-bs-toggle="modal" data-bs-target="#add-personal-document" title="Add License & Certification"><i class="bi bi-plus-circle-fill"></i></button>
</div>
<% if(user.personalDocuments?.length > 0) { %>
<ul class="listing">
<% user.personalDocuments.forEach((perDoc) => { %>
<li>
<div class="file-icon">
<img src="/assets/img/file-icon.png" alt="">
</div>
<div class="data">
<%
const monthsShort = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
%>
<h5 class="title"><%= perDoc?.title %>
<ul>
<!-- <li>
<form class="edit-perDoc">
<input type="hidden" name="userId" value="<%= user._id %>">
<input type="hidden" name="perDocId" value="<%= perDoc?._id %>">
<button type="submit" class="edit-btn">
<i class="bi bi-pencil-square"></i>
</button>
</form>
</li> -->
<li>
<form class="dangerous-form" data-warning="Do you want to delete Document?" action="/api/user/modify/personal-document/remove" method="POST">
<input type="hidden" name="userId" value="<%= user._id %>">
<input type="hidden" name="perDocId" value="<%= perDoc?._id %>">
<button type="submit" class="remove-btn">
<i class="bi bi-trash"></i>
</button>
</form>
</li>
</ul>
</h5>
</div>
</li>
<% }) %>
</ul>
<% } %>
</li>
</ul>
</div>
<h6 class="craft-experience">Crafting Excellence in Every Task</h6>
</div>
</div>
</div>
</section>
<%- include('./partials/query') %>
<%- include('./partials/footer') %>
<div class="modal fade edit-popup" id="edit-contact-info" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="edit-contact-infoLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="edit-contact-infoLabel">Edit Contact Info</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="/api/user/modify/user-info" method="post">
<input type="hidden" name="id" value="<%= user.id %>">
<div class="modal-body">
<div class="row g-4">
<div class="col-12">
<div class="portfolio-form-design">
<label for="user-phone" class="form-label">Phone*</label>
<input type="text" name="phone" id="user-phone" class="form-control" placeholder="Enter Phone Number..." value="<%= user.phone %>" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label for="job-title" class="form-label">Portfolio Url*</label>
<input type="url" name="portfolio" id="job-title" class="form-control" placeholder="Enter portfolio Url..." value="<%= user.portfolio %>" title="Please Type a valid Portfolio URL">
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="dash-btn">Update</button>
</div>
</form>
</div>
</div>
</div>
<div class="modal fade edit-popup" id="edit-name-headling" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="edit-name-headlingLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="edit-name-headlingLabel">Edit Profile Info</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="/api/user/modify/user-info" method="post">
<input type="hidden" name="id" value="<%= user.id %>">
<div class="modal-body">
<div class="row g-4">
<div class="col-12">
<div class="portfolio-form-design">
<label for="full-name-edit" class="form-label">Full Name*</label>
<input type="text" name="fullName" id="full-name-edit" class="form-control" placeholder="Enter Full Name..." value="<%= user.fullName %>" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label for="job-title" class="form-label">Job Title*</label>
<input type="text" name="jobTitle" id="job-title" class="form-control" placeholder="Enter Job Title..." value="<%= user.jobTitle %>" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label for="subHeading-edit" class="form-label">Sub Heading</label>
<input type="text" name="subHeading" id="subHeading-edit" class="form-control" placeholder="Enter SubHeading..." value="<%= user.subHeading %>">
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label for="user-location" class="form-label">Location*</label>
<input type="text" name="location" id="user-location" class="form-control" placeholder="Enter SubHeading..." value="<%= user.location %>" required>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="dash-btn">Update</button>
</div>
</form>
</div>
</div>
</div>
<div class="modal fade edit-popup" id="edit-experience" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="edit-experienceLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="edit-experienceLabel">Edit Profile Info</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="/api/user/modify/user-info" method="post">
<input type="hidden" name="id" value="<%= user.id %>">
<div class="modal-body">
<div class="row g-4">
<div class="col-12">
<div class="portfolio-form-design">
<label for="full-name-edit" class="form-label">Enter Your Experience*</label>
<input type="number" name="experience" id="full-name-edit" class="form-control" min="0" max="99" placeholder="Enter Your Experience in Years..." value="<%= user.experience %>" required>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="dash-btn">Update</button>
</div>
</form>
</div>
</div>
</div>
<div class="modal fade edit-popup" id="edit-skills-info" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="edit-skills-infoLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="edit-skills-infoLabel">Edit Skills</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="/api/user/modify/user-info" method="post">
<input type="hidden" name="id" value="<%= user.id %>">
<input type="hidden" id="skill-input-hidden" name="skills" value="<%= user.skills ? JSON.stringify(user.skills) : JSON.stringify([]) %>">
<div class="modal-body">
<div class="row g-4">
<div class="col-12">
<div class="portfolio-form-design skill-fields">
<label for="skill-input" class="form-label">Enter skills*</label>
<div class="wrap-all">
<% if(user.skills.length > 0) { %>
<% user.skills.forEach((item,index) => { %>
<div class="inp-wrap <%= index !== 0 ? 'mt-2' : '' %>">
<input type="text" class="form-control skill-input" onchange="skillInputHandler()" placeholder="Enter Your Skill..." value="<%= item %>">
<button class="remove-btn" type="button" onclick="removeSkillInput(this)"><i class="bi bi-trash"></i></button>
</div>
<% }) %>
<% } %>
</div>
</div>
</div>
<div class="col-12 d-flex justify-content-center">
<button style="display: <%= user.skills.length == 5 ? 'none': 'block' %>;" type="button" onclick="addSkillInput(this)" class="add-item add-skill-item"><i class="bi bi-plus-lg"></i></button>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="dash-btn">Update</button>
</div>
</form>
</div>
</div>
</div>
<div class="modal fade edit-popup social-edit-popup" id="edit-social-info" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="edit-social-infoLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="edit-social-infoLabel">Edit Social Info</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form class="inp-wrap" action="/api/user/modify/social-info" method="POST">
<input type="hidden" name="id" value="<%= user.id %>">
<div class="modal-body">
<%
const socialLinks = user.socialLinks || [];
// Initialize variables
let facebook,instagram,twitter,linkedin,behance,pinterest,dribbble,linktree;
socialLinks.forEach(link => {
switch (link.platform.toLowerCase()) {
case 'facebook':
facebook = link.username;
break;
case 'instagram':
instagram = link.username;
break;
case 'twitter':
twitter = link.username;
break;
case 'linkedin':
linkedin = link.username;
break;
case 'behance':
behance = link.username;
break;
case 'pinterest':
pinterest = link.username;
break;
case 'dribbble':
dribbble = link.username;
break;
case 'linktree':
linktree = link.username;
break;
}
});
%>
<div class="row g-4">
<div class="col-lg-6 col-12">
<div class="portfolio-form-design skill-fields">
<label for="skill-input" class="form-label">Facebook Username</label>
<div class="wrap-all">
<input type="text" name="facebook" class="form-control skill-input" placeholder="Enter Facebook Username..." value="<%= facebook %>">
</div>
</div>
</div>
<div class="col-lg-6 col-12">
<div class="portfolio-form-design skill-fields">
<label for="skill-input" class="form-label">Instagram Username</label>
<div class="wrap-all">
<input type="text" name="instagram" class="form-control skill-input" placeholder="Enter Instagram Username..." value="<%= instagram %>">
</div>
</div>
</div>
<div class="col-lg-6 col-12">
<div class="portfolio-form-design skill-fields">
<label for="skill-input" class="form-label">Twitter Username</label>
<div class="wrap-all">
<input type="text" name="twitter" class="form-control skill-input" placeholder="Enter Twitter Username..." value="<%= twitter %>">
</div>
</div>
</div>
<div class="col-lg-6 col-12">
<div class="portfolio-form-design skill-fields">
<label for="skill-input" class="form-label">LinkedIn Username</label>
<div class="wrap-all">
<input type="text" name="linkedin" class="form-control skill-input" placeholder="Enter LinkedIn Username..." value="<%= linkedin %>">
</div>
</div>
</div>
<div class="col-lg-6 col-12">
<div class="portfolio-form-design skill-fields">
<label for="skill-input" class="form-label">Behance Username</label>
<div class="wrap-all">
<input type="text" name="behance" class="form-control skill-input" placeholder="Enter Behance Username..." value="<%= behance %>">
</div>
</div>
</div>
<div class="col-lg-6 col-12">
<div class="portfolio-form-design skill-fields">
<label for="skill-input" class="form-label">Pinterest Username</label>
<div class="wrap-all">
<input type="text" name="pinterest" class="form-control skill-input" placeholder="Enter Pinterest Username..." value="<%= pinterest %>">
</div>
</div>
</div>
<div class="col-lg-6 col-12">
<div class="portfolio-form-design skill-fields">
<label for="skill-input" class="form-label">Dribbble Username</label>
<div class="wrap-all">
<input type="text" name="dribbble" class="form-control skill-input" placeholder="Enter Dribbble Username..." value="<%= dribbble %>">
</div>
</div>
</div>
<div class="col-lg-6 col-12">
<div class="portfolio-form-design skill-fields">
<label for="skill-input" class="form-label">Linktree Username</label>
<div class="wrap-all">
<input type="text" name="linktree" class="form-control skill-input" placeholder="Enter Linktree Username..." value="<%= linktree %>">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="dash-btn">Update</button>
</div>
</form>
</div>
</div>
</div>
<div class="modal fade edit-popup" id="add-project" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="add-projectLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="add-projectLabel">Add a Project</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="/api/user/modify/project" method="post" enctype="multipart/form-data">
<input type="hidden" name="id" value="<%= user.id %>">
<div class="modal-body">
<div class="row g-4">
<div class="col-12">
<div class="portfolio-form-design">
<label for="project-title" class="form-label">Title*</label>
<input type="text" name="title" id="project-title" class="form-control" placeholder="Enter Title..." value="" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label for="project-image" class="form-label">Media*</label>
<input type="file" name="image" id="project-image" class="form-control" placeholder="Enter Title..." value="" accept=".png, .jpg, .jpeg, .mp4" required>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="dash-btn">Update</button>
</div>
</form>
</div>
</div>
</div>
<div class="modal fade edit-popup" id="edit-profile-about" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="edit-profile-aboutLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="edit-profile-aboutLabel">Edit Profile About</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="/api/user/modify/user-info" method="post">
<input type="hidden" name="id" value="<%= user.id %>">
<div class="modal-body">
<div class="row g-4">
<div class="col-12">
<div class="portfolio-form-design">
<label for="full-name-edit" class="form-label">About*</label>
<textarea class="form-control" name="about" required minlength="30"><%= user.about %></textarea>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="dash-btn">Update</button>
</div>
</form>
</div>
</div>
</div>
<div class="modal fade edit-popup add-exp" id="add-experience-about" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="add-experience-aboutLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="add-experience-aboutLabel">Add Experience</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="/api/user/modify/experience/add" method="post" enctype="multipart/form-data">
<input type="hidden" name="id" value="<%= user.id %>">
<div class="modal-body">
<div class="row g-3">
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Title*</label>
<input type="text" name="title" class="form-control" value="" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Employment type*</label>
<!-- <input type="text" name="employementType" class="form-control" value="" required> -->
<select id="cars" type="text" name="employementType" required>
<option value="Full Time">Full Time</option>
<option value="Part Time">Part Time</option>
<option value="Casual">Casual</option>
<option value="Contract">Contract</option>
</select>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Company name*</label>
<input type="text" name="companyName" class="form-control" value="" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Location*</label>
<input type="text" name="location" class="form-control" value="" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Location type*</label>
<select class="form-control" name="locationType" required>
<option value="On Site">On Site</option>
<option value="Remote">Remote</option>
<option value="Hybrid">Hybrid</option>
</select>
<p class="field-help">Pick a location type (ex: remote)</p>
</div>
</div>
<div class="col-12">
<div class="checkbox-field">
<input type="checkbox" name="currentlyWorking" value="true" id="working-now-exp">
<label for="working-now-exp">I am currently working in this role</label>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Start Date*</label>
<div class="row g-3">
<div class="col-md-6 col-12">
<select class="form-control" name="startingDate_month">
<option value="0">January</option>
<option value="1">February</option>
<option value="2">March</option>
<option value="3">April</option>
<option value="4">May</option>
<option value="5">June</option>
<option value="6">July</option>
<option value="7">August</option>
<option value="8">September</option>
<option value="9">October</option>
<option value="10">November</option>
<option value="11">December</option>
</select>
</div>
<div class="col-md-6 col-12">
<select class="form-control" name="startingDate_year">
<%
const currentYear = new Date().getFullYear();
for (let year = 1970; year <= currentYear; year++) {
%>
<option value="<%= year %>" <%= currentYear == year ? 'selected' : '' %>><%= year %></option>
<% } %>
</select>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">End Date*</label>
<div class="row g-3">
<div class="col-md-6 col-12">
<select class="form-control" name="endingDate_month" id="endingDate_month">
<option value="0">January</option>
<option value="1">February</option>
<option value="2">March</option>
<option value="3">April</option>
<option value="4">May</option>
<option value="5">June</option>
<option value="6">July</option>
<option value="7">August</option>
<option value="8">September</option>
<option value="9">October</option>
<option value="10">November</option>
<option value="11">December</option>
</select>
</div>
<div class="col-md-6 col-12">
<select class="form-control" name="endingDate_year" id="endingDate_year">
<%
for (let year = 1970; year <= currentYear; year++) {
%>
<option value="<%= year %>" <%= currentYear == year ? 'selected' : '' %>><%= year %></option>
<% } %>
</select>
</div>
</div>
</div>
</div>
<div class="col-12">
<!-- <div class="checkbox-field">
<input type="checkbox" name="endCurrentPosition" id="end-position-exp">
<label for="end-position-exp">End current position as of now - Manager at ba</label>
</div> -->
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Description</label>
<textarea name="description" class="form-control"></textarea>
<!-- <textarea class="d-none" name="description" id="experience-desc"></textarea>
<textarea class="text-editor"></textarea> -->
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Upload File*</label>
</div>
<input name="file" class="form-control" type="file" accept="application/pdf">
</div>
<div class="col-12">
<button type="submit" class="dash-btn">Save</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="modal fade edit-popup add-exp" id="add-education" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="add-educationLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="add-educationLabel">Add Education</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="/api/user/modify/education/add" method="post" enctype="multipart/form-data">
<input type="hidden" name="userId" value="<%= user.id %>">
<div class="modal-body">
<div class="row g-3">
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Institue*</label>
<input type="text" name="institute" class="form-control" value="" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Degree*</label>
<input type="text" name="degree" class="form-control" value="" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">start date*</label>
<div class="row g-3">
<div class="col-md-6 col-12">
<select class="form-control" name="startingDate_month">
<option value="0">January</option>
<option value="1">February</option>
<option value="2">March</option>
<option value="3">April</option>
<option value="4">May</option>
<option value="5">June</option>
<option value="6">July</option>
<option value="7">August</option>
<option value="8">September</option>
<option value="9">October</option>
<option value="10">November</option>
<option value="11">December</option>
</select>
</div>
<div class="col-md-6 col-12">
<select class="form-control" name="startingDate_year">
<%
for (let year = 1970; year <= currentYear; year++) {
%>
<option value="<%= year %>" <%= currentYear == year ? 'selected' : ''%>><%= year %></option>
<% } %>
</select>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">end date*</label>
<div class="row g-3">
<div class="col-md-6 col-12">
<select class="form-control" name="endingDate_month">
<option value="0">January</option>
<option value="1">February</option>
<option value="2">March</option>
<option value="3">April</option>
<option value="4">May</option>
<option value="5">June</option>
<option value="6">July</option>
<option value="7">August</option>
<option value="8">September</option>
<option value="9">October</option>
<option value="10">November</option>
<option value="11">December</option>
</select>
</div>
<div class="col-md-6 col-12">
<select class="form-control" name="endingDate_year">
<%
for (let year = 1970; year <= currentYear; year++) {
%>
<option value="<%= year %>" <%= currentYear == year ? 'selected' : ''%>><%= year %></option>
<% } %>
</select>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Upload File*</label>
</div>
<input name="file" class="form-control" type="file" accept="application/pdf">
</div>
<div class="col-12">
<button type="submit" class="dash-btn">Save</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="modal fade edit-popup add-exp" id="edit-education" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="edit-educationLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="edit-educationLabel">Edit Education</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="/api/user/modify/education/edit" method="post" enctype="multipart/form-data">
<input type="hidden" name="userId" value="<%= user.id %>">
<input type="hidden" name="eduId">
<div class="modal-body">
<div class="row g-3">
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Institue / School *</label>
<input type="text" name="institute" class="form-control" value="" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Degree*</label>
<input type="text" name="degree" class="form-control" value="" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">start date*</label>
<div class="row g-3">
<div class="col-md-6 col-12">
<select class="form-control" name="startingDate_month">
<option value="0">January</option>
<option value="1">February</option>
<option value="2">March</option>
<option value="3">April</option>
<option value="4">May</option>
<option value="5">June</option>
<option value="6">July</option>
<option value="7">August</option>
<option value="8">September</option>
<option value="9">October</option>
<option value="10">November</option>
<option value="11">December</option>
</select>
</div>
<div class="col-md-6 col-12">
<select class="form-control" name="startingDate_year">
<%
for (let year = 1970; year <= currentYear; year++) {
%>
<option value="<%= year %>" <%= currentYear == year ? 'selected' : ''%>><%= year %></option>
<% } %>
</select>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">end date*</label>
<div class="row g-3">
<div class="col-md-6 col-12">
<select class="form-control" name="endingDate_month">
<option value="0">January</option>
<option value="1">February</option>
<option value="2">March</option>
<option value="3">April</option>
<option value="4">May</option>
<option value="5">June</option>
<option value="6">July</option>
<option value="7">August</option>
<option value="8">September</option>
<option value="9">October</option>
<option value="10">November</option>
<option value="11">December</option>
</select>
</div>
<div class="col-md-6 col-12">
<select class="form-control" name="endingDate_year">
<%
for (let year = 1970; year <= currentYear; year++) {
%>
<option value="<%= year %>" <%= currentYear == year ? 'selected' : ''%>><%= year %></option>
<% } %>
</select>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Upload File*</label>
</div>
<input name="file" class="form-control" type="file" accept="application/pdf">
</div>
<div class="col-12">
<button type="submit" class="dash-btn">Update</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="modal fade edit-popup add-exp" id="edit-experience-item" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="edit-experience-itemLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="edit-experience-itemLabel">Edit Experience</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="/api/user/modify/experience/edit" method="post" enctype="multipart/form-data">
<input type="hidden" name="userId" value="<%= user.id %>">
<input type="hidden" name="expId">
<div class="modal-body">
<div class="row g-3">
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Title*</label>
<input type="text" name="title" class="form-control" value="" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Employment type*</label>
<select id="cars" type="text" name="employementType" required>
<option value="Full Time">Full Time</option>
<option value="Part Time">Part Time</option>
<option value="Casual">Casual</option>
<option value="Contract">Contract</option>
</select>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Company name*</label>
<input type="text" name="companyName" class="form-control" value="" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Location*</label>
<input type="text" name="location" class="form-control" value="" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Location type*</label>
<select class="form-control" name="locationType" required>
<option value="On Site">On Site</option>
<option value="Remote">Remote</option>
<option value="Hybrid">Hybrid</option>
</select>
<p class="field-help">Pick a location type (ex: remote)</p>
</div>
</div>
<div class="col-12">
<div class="checkbox-field">
<input type="checkbox" name="currentlyWorking" value="true" id="working-now-exp-edit">
<label for="working-now-exp-edit">I am currently working in this role</label>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">start date*</label>
<div class="row g-3">
<div class="col-md-6 col-12">
<select class="form-control" name="startingDate_month">
<option value="0">January</option>
<option value="1">February</option>
<option value="2">March</option>
<option value="3">April</option>
<option value="4">May</option>
<option value="5">June</option>
<option value="6">July</option>
<option value="7">August</option>
<option value="8">September</option>
<option value="9">October</option>
<option value="10">November</option>
<option value="11">December</option>
</select>
</div>
<div class="col-md-6 col-12">
<select class="form-control" name="startingDate_year">
<%
const currentYearEdit = new Date().getFullYear();
for (let year = 1970; year <= currentYearEdit; year++) {
%>
<option value="<%= year %>" <%= currentYearEdit == year ? 'selected' : ''%>><%= year %></option>
<% } %>
</select>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">end date*</label>
<div class="row g-3">
<div class="col-md-6 col-12">
<select class="form-control" name="endingDate_month">
<option value="0">January</option>
<option value="1">February</option>
<option value="2">March</option>
<option value="3">April</option>
<option value="4">May</option>
<option value="5">June</option>
<option value="6">July</option>
<option value="7">August</option>
<option value="8">September</option>
<option value="9">October</option>
<option value="10">November</option>
<option value="11">December</option>
</select>
</div>
<div class="col-md-6 col-12">
<select class="form-control" name="endingDate_year">
<%
for (let year = 1970; year <= currentYear; year++) {
%>
<option value="<%= year %>" <%= currentYear == year ? 'selected' : ''%>><%= year %></option>
<% } %>
</select>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Description</label>
<textarea name="description" class="form-control"></textarea>
<!-- <textarea class="d-none" name="description" id="experience-desc"></textarea>
<textarea class="text-editor"></textarea> -->
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Upload File*</label>
</div>
<input name="file" class="form-control" type="file" accept="application/pdf">
</div>
<div class="col-12">
<button type="submit" class="dash-btn">Update</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="modal fade edit-popup add-exp" id="add-personal-document" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="add-personal-documentLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="add-personal-documentLabel">Add Personal Document</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="/api/user/modify/personal-document/add" method="post" enctype="multipart/form-data">
<input type="hidden" name="id" value="<%= user.id %>">
<div class="modal-body">
<div class="row g-3">
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Title *</label>
<input type="text" name="title" class="form-control" value="" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Upload File*</label>
</div>
<input name="file" class="form-control" type="file" accept="application/pdf" required>
</div>
<div class="col-12">
<button type="submit" class="dash-btn">Save</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="modal fade edit-popup add-exp" id="add-license-certificate" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="add-license-certificateLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="add-license-certificateLabel">Add License & Certification</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="/api/user/modify/license-certificate/add" method="post" enctype="multipart/form-data">
<input type="hidden" name="id" value="<%= user.id %>">
<div class="modal-body">
<div class="row g-3">
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Title *</label>
<input type="text" name="title" class="form-control" value="" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Organization*</label>
<input type="text" name="organization" class="form-control" value="" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Issue Date*</label>
<div class="row g-3">
<div class="col-md-6 col-12">
<select class="form-control" name="startingDate_month">
<option value="0">January</option>
<option value="1">February</option>
<option value="2">March</option>
<option value="3">April</option>
<option value="4">May</option>
<option value="5">June</option>
<option value="6">July</option>
<option value="7">August</option>
<option value="8">September</option>
<option value="9">October</option>
<option value="10">November</option>
<option value="11">December</option>
</select>
</div>
<div class="col-md-6 col-12">
<select class="form-control" name="startingDate_year">
<%
for (let year = 1970; year <= currentYear; year++) {
%>
<option value="<%= year %>" <%= currentYear == year ? 'selected' : ''%>><%= year %></option>
<% } %>
</select>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Upload File*</label>
</div>
<input name="file" class="form-control" type="file" accept="application/pdf">
</div>
<div class="col-12">
<button type="submit" class="dash-btn">Save</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="modal fade edit-popup add-exp" id="edit-license-certificate" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="edit-license-certificateLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="edit-license-certificateLabel">Edit License & Certification</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="/api/user/modify/license-certificate/edit" method="post" enctype="multipart/form-data">
<input type="hidden" name="userId" value="<%= user.id %>">
<input type="hidden" name="certId" value="">
<div class="modal-body">
<div class="row g-3">
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Title *</label>
<input type="text" name="title" class="form-control" value="" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Organization*</label>
<input type="text" name="organization" class="form-control" value="" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Issue Date*</label>
<div class="row g-3">
<div class="col-md-6 col-12">
<select class="form-control" name="startingDate_month">
<option value="0">January</option>
<option value="1">February</option>
<option value="2">March</option>
<option value="3">April</option>
<option value="4">May</option>
<option value="5">June</option>
<option value="6">July</option>
<option value="7">August</option>
<option value="8">September</option>
<option value="9">October</option>
<option value="10">November</option>
<option value="11">December</option>
</select>
</div>
<div class="col-md-6 col-12">
<select class="form-control" name="startingDate_year">
<%
for (let year = 1970; year <= currentYear; year++) {
%>
<option value="<%= year %>" <%= currentYear == year ? 'selected' : ''%>><%= year %></option>
<% } %>
</select>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Upload File*</label>
</div>
<input name="file" class="form-control" type="file" accept="application/pdf">
</div>
<div class="col-12">
<button type="submit" class="dash-btn">Save</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="modal fade edit-popup add-exp" id="add-volunteer-exp" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="add-volunteer-expLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="add-volunteer-expLabel">Add Volunteer Experience</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="/api/user/modify/volunteer-experience/add" method="post" enctype="multipart/form-data">
<input type="hidden" name="id" value="<%= user.id %>">
<div class="modal-body">
<div class="row g-3">
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Title *</label>
<input type="text" name="title" class="form-control" value="" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Organisation*</label>
<input type="text" name="companyName" class="form-control" value="" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Cause*</label>
<input type="text" name="cause" class="form-control" value="" required>
</div>
</div>
<div class="col-12">
<div class="checkbox-field">
<input type="checkbox" name="currentlyWorking" value="true" id="working-now-volunteer-exp">
<label for="working-now-volunteer-exp">I am currently working in this role</label>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Starting Date*</label>
<div class="row g-3">
<div class="col-md-6 col-12">
<select class="form-control" name="startingDate_month">
<option value="0">January</option>
<option value="1">February</option>
<option value="2">March</option>
<option value="3">April</option>
<option value="4">May</option>
<option value="5">June</option>
<option value="6">July</option>
<option value="7">August</option>
<option value="8">September</option>
<option value="9">October</option>
<option value="10">November</option>
<option value="11">December</option>
</select>
</div>
<div class="col-md-6 col-12">
<select class="form-control" name="startingDate_year">
<%
for (let year = 1970; year <= currentYear; year++) {
%>
<option value="<%= year %>" <%= currentYear == year ? 'selected' : ''%>><%= year %></option>
<% } %>
</select>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">End Date*</label>
<div class="row g-3">
<div class="col-md-6 col-12">
<select class="form-control" name="endingDate_month" id="endingDate_month_volunteer">
<option value="0">January</option>
<option value="1">February</option>
<option value="2">March</option>
<option value="3">April</option>
<option value="4">May</option>
<option value="5">June</option>
<option value="6">July</option>
<option value="7">August</option>
<option value="8">September</option>
<option value="9">October</option>
<option value="10">November</option>
<option value="11">December</option>
</select>
</div>
<div class="col-md-6 col-12">
<select class="form-control" name="endingDate_year" id="endingDate_year_volunteer">
<%
for (let year = 1970; year <= currentYear; year++) {
%>
<option value="<%= year %>" <%= currentYear == year ? 'selected' : ''%>><%= year %></option>
<% } %>
</select>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Upload File*</label>
</div>
<input name="file" class="form-control" type="file" accept="application/pdf">
</div>
<div class="col-12">
<button type="submit" class="dash-btn">Save</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="modal fade edit-popup add-exp" id="edit-volunteer-exp" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="edit-volunteer-expLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="edit-volunteer-expLabel">Edit Volunteer Experience</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="/api/user/modify/volunteer-experience/edit" method="post" enctype="multipart/form-data">
<input type="hidden" name="userId" value="<%= user.id %>">
<input type="hidden" name="expId">
<div class="modal-body">
<div class="row g-3">
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Title *</label>
<input type="text" name="title" class="form-control" value="" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Company Name*</label>
<input type="text" name="companyName" class="form-control" value="" required>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Cause*</label>
<input type="text" name="cause" class="form-control" value="" required>
</div>
</div>
<div class="col-12">
<div class="checkbox-field">
<input type="checkbox" name="currentlyWorking" value="true" id="working-now-volunteer-exp">
<label for="working-now-volunteer-exp">I am currently working in this role</label>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Starting Date*</label>
<div class="row g-3">
<div class="col-md-6 col-12">
<select class="form-control" name="startingDate_month">
<option value="0">January</option>
<option value="1">February</option>
<option value="2">March</option>
<option value="3">April</option>
<option value="4">May</option>
<option value="5">June</option>
<option value="6">July</option>
<option value="7">August</option>
<option value="8">September</option>
<option value="9">October</option>
<option value="10">November</option>
<option value="11">December</option>
</select>
</div>
<div class="col-md-6 col-12">
<select class="form-control" name="startingDate_year">
<%
for (let year = 1970; year <= currentYear; year++) {
%>
<option value="<%= year %>" <%= currentYear == year ? 'selected' : ''%>><%= year %></option>
<% } %>
</select>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">end date*</label>
<div class="row g-3">
<div class="col-md-6 col-12">
<select class="form-control" name="endingDate_month">
<option value="0">January</option>
<option value="1">February</option>
<option value="2">March</option>
<option value="3">April</option>
<option value="4">May</option>
<option value="5">June</option>
<option value="6">July</option>
<option value="7">August</option>
<option value="8">September</option>
<option value="9">October</option>
<option value="10">November</option>
<option value="11">December</option>
</select>
</div>
<div class="col-md-6 col-12">
<select class="form-control" name="endingDate_year">
<%
for (let year = 1970; year <= currentYear; year++) {
%>
<option value="<%= year %>" <%= currentYear == year ? 'selected' : ''%>><%= year %></option>
<% } %>
</select>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="portfolio-form-design">
<label class="form-label">Upload File*</label>
</div>
<input name="file" class="form-control" type="file" accept="application/pdf">
</div>
<div class="col-12">
<button type="submit" class="dash-btn">Save</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<%- include('./partials/scriptlinks') %>
<script src="https://cdn.tiny.cloud/1/xarj83czi2hp6n2rm3b1ruv6msf9w7abxf4nfx0bwvo20pbs/tinymce/7/tinymce.min.js" referrerpolicy="origin"></script>
<script>
let editExp
$(document).ready(function() {
let characterCount = 0
$("#add-experience-about form").submit(function(e) {
if (characterCount > 1000) {
e.preventDefault()
createToast(`Description Field should not exceed 1000 characters!`, 'error')
return false
}
})
function charCount(editor) {
const maxLength = 1000; // Character limit
const content = editor.getContent({
format: 'text'
});
const wordCount = content.split(/\s+/).length
characterCount = content.length
let className = ''
if (characterCount > 1000) {
className = 'exceeded'
}
$(".tox-statusbar__text-container .tox-statusbar__right-container").html(`<p class="${className}"><span class="word-count">${wordCount} Words</span class="char-count"><span>${characterCount}/1000 Characters</span></p>`)
return content.length
}
function limitContentLength(editor) {
const maxLength = 1000; // Character limit
const content = editor.getContent({
format: 'text'
});
if (content.length > maxLength) {
createToast(`Max 1000 characters allowed!`, 'error')
return true
}
false
}
tinymce.init({
selector: '#add-experience-about .text-editor',
plugins: 'autolink charmap lists visualblocks',
toolbar: 'undo redo | bold italic underline | align | numlist bullist indent outdent | emoticons | removeformat | codesample',
setup: function(editor) {
editor.on('change', function(e) {
limitContentLength(editor);
charCount(editor)
$("#add-experience-about #experience-desc").val(editor.getContent())
});
editor.on('init', function(e) {
limitContentLength(editor);
charCount(editor)
$("#add-experience-about #experience-desc").val(editor.getContent())
});
editor.on('keyup', function(e) {
limitContentLength(editor);
charCount(editor)
$("#add-experience-about #experience-desc").val(editor.getContent())
});
}
});
tinymce.init({
selector: '#edit-experience-item .text-editor',
plugins: 'autolink charmap lists visualblocks',
toolbar: 'undo redo | bold italic underline | align | numlist bullist indent outdent | emoticons | removeformat | codesample',
setup: function(editor) {
editor.on('change', function(e) {
limitContentLength(editor);
charCount(editor)
$("#edit-experience-item #experience-desc").val(editor.getContent())
});
editor.on('init', function(e) {
limitContentLength(editor);
charCount(editor)
$("#edit-experience-item #experience-desc").val(editor.getContent())
});
editor.on('keyup', function(e) {
limitContentLength(editor);
charCount(editor)
$("#edit-experience-item #experience-desc").val(editor.getContent())
});
}
});
})
// tinymce.init({
// selector: '.text-editor'
// });
</script>
<script>
$('.edit-it').keyup(function() {
if ($(this).html() == '') {
$(this).addClass('no-txt')
} else {
$(this).removeClass('no-txt')
}
})
// $(".edit-btn").click(function() {
// $($(this).data('target'))[0].focus()
// })
$("#profileVideo").change(async function(e) {
const videoFormData = new FormData();
const videoFile = e.target.files[0];
if (videoFile.size > (100 * 1024 * 1024)) {
createToast(`File Size should not Exceed 100mb.`, 'error')
return
}
videoFormData.append('profileVideo', videoFile);
videoFormData.append('user', '<%= user.id %>');
// const videoRes = await fetch('/api/user/modify/profileVideo', {
// method: "POST",
// body: videoFormData
// });
$('#loader').css('display', 'flex')
const xhr = new XMLHttpRequest();
xhr.upload.addEventListener('progress', function(event) {
if (event.lengthComputable) {
const percentComplete = Math.round((event.loaded / event.total) * 100);
console.log('percentComplete', percentComplete)
}
});
xhr.addEventListener('load', function() {
if (xhr.status === 200) {
location.reload()
} else {
$('#loader').hide()
createToast(`Video Upload Failed.`, 'error')
}
});
xhr.open('POST', '/api/user/modify/profileVideo', true);
xhr.send(videoFormData);
// $.ajax({
// url: '/api/user/modify/profileVideo',
// type: 'POST',
// data: videoFormData,
// processData: false, // Important
// contentType: false, // Important
// success: function(data) {
// $('#loader').hide()
// location.href = '/edit/profile?message=Profile Video Updated'
// },
// error: function(err) {
// $('#loader').hide()
// console.error(err);
// alert(err)
// }
// });
})
$("#profile-pic-input").change(function(e) {
const profilePic = e.target.files[0]
const profilePicForm = new FormData();
profilePicForm.append('id', '<%= user.id %>')
profilePicForm.append('profilePic', profilePic)
$('#loader').css('display', 'flex')
$.ajax({
url: '/api/user/modify/profile-pic',
type: 'POST',
data: profilePicForm,
processData: false, // Important
contentType: false, // Important
success: function(data) {
$('#loader').hide()
location.href = '/edit/profile?message=Profile Pic Updated Successfully'
},
error: function(err) {
$('#loader').hide()
console.error(err);
createToast(err, 'error')
}
});
})
$("#cover-photo-input").change(function(e) {
const coverPhoto = e.target.files[0]
const coverPhotoForm = new FormData();
coverPhotoForm.append('id', '<%= user.id %>')
coverPhotoForm.append('coverPhoto', coverPhoto)
$('#loader').css('display', 'flex')
$.ajax({
url: '/api/user/modify/cover-photo',
type: 'POST',
data: coverPhotoForm,
processData: false, // Important
contentType: false, // Important
success: function(data) {
$('#loader').hide()
location.href = '/edit/profile?message=Cover Photo Updated Successfully'
},
error: function(err) {
$('#loader').hide()
console.error(err);
createToast(err, 'error')
}
});
})
$("#resume-upload").change(function(e) {
const resume = e.target.files[0]
const resumeForm = new FormData();
resumeForm.append('id', '<%= user.id %>')
resumeForm.append('resume', resume)
$('#loader').css('display', 'flex')
$.ajax({
url: '/api/user/modify/upload/resume',
type: 'POST',
data: resumeForm,
processData: false, // Important
contentType: false, // Important
success: function(data) {
$('#loader').hide()
location.href = '/edit/profile?message=Resume Updated Successfully'
},
error: function(err) {
$('#loader').hide()
console.error(err);
createToast(err, 'error')
}
});
})
$("#cover-letter-upload").change(function(e) {
const coverLetter = e.target.files[0]
const coverLetterForm = new FormData();
coverLetterForm.append('id', '<%= user.id %>')
coverLetterForm.append('coverLetter', coverLetter)
$('#loader').css('display', 'flex')
$.ajax({
url: '/api/user/modify/upload/cover-letter',
type: 'POST',
data: coverLetterForm,
processData: false, // Important
contentType: false, // Important
success: function(data) {
$('#loader').hide()
location.href = '/edit/profile?message=Cover Letter Updated Successfully'
},
error: function(err) {
$('#loader').hide()
console.error(err);
createToast(err, 'error')
}
});
})
$(".remove-profile-video").click(async function(e) {
if (confirm('Your Profile Video will be removed, do you want to proceed?')) {
$('#loader').css('display', 'flex')
const res = await fetch('/api/user/modify/remove-profile-video', {
method: 'POST',
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify({
id: '<%= user.id %>'
})
})
if (res.status == 200) {
location.href = '/edit/profile?message=Profile Video Deleted Successfully'
} else {
createToast('Error Deleting Video', 'error')
}
}
})
$(".remove-project-item").click(async function(e) {
if (confirm('Project Item will be removed, do you want to proceed?')) {
const project = $(this).data('project')
$('#loader').css('display', 'flex')
const res = await fetch('/api/user/modify/remove-project-item', {
method: 'POST',
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify({
user: '<%= user.id %>',
project
})
})
if (res.status == 200) {
location.href = '/edit/profile?message=Profile Video Deleted Successfully'
} else {
createToast('Error Deleting Video', 'error')
}
}
})
$(".remove-resume-item").click(async function(e) {
if (confirm('Your Resume will be removed, do you want to proceed?')) {
$('#loader').css('display', 'flex')
const res = await fetch('/api/user/modify/remove-resume-item', {
method: 'POST',
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify({
user: '<%= user.id %>'
})
})
if (res.status == 200) {
location.href = '/edit/profile?message=Resume Deleted Successfully'
} else {
createToast('Error Deleting Video', 'error')
}
}
})
$(".remove-cover-letter-item").click(async function(e) {
if (confirm('Your Cover Letter will be removed, do you want to proceed?')) {
$('#loader').css('display', 'flex')
const res = await fetch('/api/user/modify/remove-cover-letter-item', {
method: 'POST',
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify({
user: '<%= user.id %>'
})
})
if (res.status == 200) {
location.href = '/edit/profile?message=Cover Letter Deleted Successfully'
} else {
createToast('Error Deleting Video', 'error')
}
}
})
</script>
<script>
const addSkillInput = (btn) => {
if ($("#edit-skills-info .wrap-all .inp-wrap").length >= 4) {
$(btn).hide()
}
if ($("#edit-skills-info .wrap-all .inp-wrap").length <= 5) {
$("#edit-skills-info .wrap-all").append(`<div class="inp-wrap mt-2"><input type="text" onchange="skillInputHandler()" class="form-control skill-input" placeholder="Enter Your Skill..." required><button class="remove-btn" type="button" onclick="removeSkillInput(this)"><i class="bi bi-trash"></i></button></div>`)
}
}
const removeSkillInput = (btn) => {
$(".add-skill-item").show()
$(btn).parents('.inp-wrap').remove()
skillInputHandler()
}
const skillInputHandler = () => {
let skills = []
$("#edit-skills-info .skill-input").each((ind, elem) => {
if ($(elem).val()) {
skills.push($(elem).val())
}
})
$('#skill-input-hidden').val(JSON.stringify(skills))
}
</script>
<script>
$(".social-form").submit(async (e) => {
e.preventDefault()
const curForm = e.target
const formData = new FormData(curForm);
const formDataObj = {};
$(curForm).find('.save-btn').attr('disabled', true)
$(curForm).find('.save-btn').html()
formData.forEach((value, key) => {
formDataObj[key] = value;
});
formDataObj['id'] = '<%= user.id %>'
const res = await fetch('/api/user/modify/social-info', {
method: 'POST',
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify(formDataObj)
})
location.href=`?message=Social Links Updated`
const resJson = await res.json()
console.log(resJson)
$(curForm).find('.save-btn').removeAttr('disabled')
if (resJson.success) {
document.querySelector('#edit-social-info').addEventListener('hidden.bs.modal', function(event) {
location.reload()
});
if (!$('.social-edit-popup').hasClass('show')) {
location.reload()
}
}
})
</script>
<script>
$(".delete-exp").submit(async (e) => {
e.preventDefault()
if (confirm('Your Experience will be deleted Permanently! Do you want to proceed?')) {
const curForm = e.target
const formData = new FormData(curForm);
const formDataObj = {};
formData.forEach((value, key) => {
formDataObj[key] = value;
});
const res = await fetch('/api/user/modify/experience/delete', {
method: 'POST',
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify(formDataObj)
})
const resJson = await res.json()
if (resJson.success) {
location.href = '/edit/profile?message=Experience Deleted'
} else {
createToast(resJson.error, 'error')
}
}
})
$(".delete-vol-exp").submit(async (e) => {
e.preventDefault()
if (confirm('Your Volunteer Experience will be deleted Permanently! Do you want to proceed?')) {
const curForm = e.target
const formData = new FormData(curForm);
const formDataObj = {};
formData.forEach((value, key) => {
formDataObj[key] = value;
});
const res = await fetch('/api/user/modify/volunteer-experience/delete', {
method: 'POST',
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify(formDataObj)
})
const resJson = await res.json()
if (resJson.success) {
location.href = '/edit/profile?message=Volunteer Experience Deleted'
} else {
createToast(resJson.error, 'error')
}
}
})
$(".delete-edu").submit(async (e) => {
e.preventDefault()
if (confirm('Your Education will be deleted Permanently! Do you want to proceed?')) {
const curForm = e.target
const formData = new FormData(curForm);
const formDataObj = {};
formData.forEach((value, key) => {
formDataObj[key] = value;
});
const res = await fetch('/api/user/modify/education/delete', {
method: 'POST',
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify(formDataObj)
})
const resJson = await res.json()
if (resJson.success) {
location.href = '/edit/profile?message=Education Deleted'
} else {
createToast(resJson.error, 'error')
}
}
})
</script>
<script>
$(".delete-cert").submit(async (e) => {
e.preventDefault()
if (confirm('Your License or Certificate will be deleted Permanently! Do you want to proceed?')) {
const curForm = e.target
const formData = new FormData(curForm);
const formDataObj = {};
formData.forEach((value, key) => {
formDataObj[key] = value;
});
const res = await fetch('/api/user/modify/license-certificate/delete', {
method: 'POST',
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify(formDataObj)
})
const resJson = await res.json()
if (resJson.success) {
location.href = '/edit/profile?message=License or Certificate Deleted'
} else {
createToast(resJson.error, 'error')
}
}
})
</script>
<script>
$(".edit-cert").submit(async (e) => {
e.preventDefault()
const curForm = e.target
const formData = new FormData(curForm);
const formDataObj = {};
formData.forEach((value, key) => {
formDataObj[key] = value;
});
const res = await fetch('/api/user/modify/license-certificate/get', {
method: 'POST',
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify(formDataObj)
})
const resJson = await res.json()
if (resJson.success) {
const cert = resJson.cert
$("#edit-license-certificate [name='certId']").val(cert._id)
$("#edit-license-certificate [name]").each((ind, item) => {
const fieldName = $(item).attr('name')
if (cert[fieldName]) {
$(item).val(cert[fieldName])
}
if (fieldName == 'startingDate_month') {
const startingDate = new Date(cert['issueDate'])
$("#edit-license-certificate [name='startingDate_month']").val(startingDate.getMonth())
$("#edit-license-certificate [name='startingDate_year']").val(startingDate.getFullYear())
}
})
$("#edit-license-certificate").modal('show')
} else {
createToast(resJson.error, 'error')
}
})
</script>
<script>
$(".edit-exp").submit(async (e) => {
e.preventDefault()
const curForm = e.target
const formData = new FormData(curForm);
const formDataObj = {};
formData.forEach((value, key) => {
formDataObj[key] = value;
});
const res = await fetch('/api/user/modify/experience/get', {
method: 'POST',
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify(formDataObj)
})
const resJson = await res.json()
if (resJson.success) {
const experience = resJson.experience
$("#edit-experience-item [name='expId']").val(experience._id)
$("#edit-experience-item [name]").each((ind, item) => {
const fieldName = $(item).attr('name')
if (experience[fieldName]) {
$(item).val(experience[fieldName])
}
if (fieldName == 'startingDate_month') {
const startingDate = new Date(experience['startingDate'])
$("#edit-experience-item [name='startingDate_month']").val(startingDate.getMonth())
$("#edit-experience-item [name='startingDate_year']").val(startingDate.getFullYear())
}
if (fieldName == 'endingDate_month') {
const endingDate = new Date(experience['endingDate'])
$("#edit-experience-item [name='endingDate_month']").val(endingDate.getMonth())
$("#edit-experience-item [name='endingDate_year']").val(endingDate.getFullYear())
}
})
// tinymce.activeEditor.setContent(experience['description']);
$("#edit-experience-item").modal('show')
} else {
createToast(resJson.error, 'error')
}
})
</script>
<script>
$(".edit-volunteer-exp").submit(async (e) => {
e.preventDefault()
const curForm = e.target
const formData = new FormData(curForm);
const formDataObj = {};
formData.forEach((value, key) => {
formDataObj[key] = value;
});
const res = await fetch('/api/user/modify/volunteer-experience/get', {
method: 'POST',
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify(formDataObj)
})
const resJson = await res.json()
console.log('resJson', resJson)
if (resJson.success) {
const experience = resJson.experience
$("#edit-volunteer-exp [name='expId']").val(experience._id)
$("#edit-volunteer-exp [name]").each((ind, item) => {
const fieldName = $(item).attr('name')
if (experience[fieldName]) {
$(item).val(experience[fieldName])
}
if (fieldName == 'startingDate_month') {
const startingDate = new Date(experience['startingDate'])
$("#edit-volunteer-exp [name='startingDate_month']").val(startingDate.getMonth())
$("#edit-volunteer-exp [name='startingDate_year']").val(startingDate.getFullYear())
}
if (fieldName == 'endingDate_month') {
const endingDate = new Date(experience['endingDate'])
$("#edit-volunteer-exp [name='endingDate_month']").val(endingDate.getMonth())
$("#edit-volunteer-exp [name='endingDate_year']").val(endingDate.getFullYear())
}
})
$("#edit-volunteer-exp").modal('show')
} else {
createToast(resJson.error, 'error')
}
})
</script>
<script>
$(".edit-edu").submit(async (e) => {
e.preventDefault()
const curForm = e.target
const formData = new FormData(curForm);
const formDataObj = {};
formData.forEach((value, key) => {
formDataObj[key] = value;
});
const res = await fetch('/api/user/modify/education/get', {
method: 'POST',
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify(formDataObj)
})
const resJson = await res.json()
if (resJson.success) {
const education = resJson.education
$("#edit-education [name='eduId']").val(education._id)
$("#edit-education [name]").each((ind, item) => {
const fieldName = $(item).attr('name')
if (education[fieldName]) {
$(item).val(education[fieldName])
}
if (fieldName == 'startingDate_month') {
const startingDate = new Date(education['startingDate'])
$("#edit-education [name='startingDate_month']").val(startingDate.getMonth())
$("#edit-education [name='startingDate_year']").val(startingDate.getFullYear())
}
if (fieldName == 'endingDate_month') {
const endingDate = new Date(education['endingDate'])
$("#edit-education [name='endingDate_month']").val(endingDate.getMonth())
$("#edit-education [name='endingDate_year']").val(endingDate.getFullYear())
}
})
$("#edit-education").modal('show')
} else {
createToast(resJson.error, 'error')
}
})
</script>
</body>
</html>