Skip to content

Commit

Permalink
add edit option in projects and interships (#33)
Browse files Browse the repository at this point in the history 
* before-pdf-div-testing

* add first edit button in project

* add edit option in intership and project

* remove color

* fix edit button error

---------

Co-authored-by: yuvraj-rathod-1202 <rathodyuvraj12022007>
  • Loading branch information
@yuvraj-rathod-1202
yuvraj-rathod-1202 authored Oct 3, 2024
1 parent 27a35cf commit 053620c
Show file tree
Hide file tree
Showing 3 changed files with 257 additions and 10 deletions.
45 changes: 37 additions & 8 deletions resumegenerator.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -173,9 +173,17 @@ <h3>Internships</h3>
class="form-control my-2" id="yearinternF">
</div>
</div>
<button onclick="addNewIntern()" class="btn btn-dark btn-lg" id="internaddbutton">Add
<button onclick="addNewIntern()" class="btn btn-dark btn-lg hidden" id="internaddbutton">Add
This</button>
<button class="btn btn-dark btn-lg hidden" id="interneditbutton">Change
</button>
<div>You must click the button to add this to LaTeX code.</div><br>
<div class="form-group hidden" id="interneditbuttonComment">If you want to edit an internship, then click on edit.</div>
<div class="form-group" id="internsEdit">


</div>


<div id="projects-container">
<h3>Projects</h3>
Expand All @@ -196,10 +204,20 @@ <h3>Projects</h3>
class="form-control my-2" id="yearprojectF">
</div>
</div>
<button onclick="addNewProject()" class="btn btn-dark btn-lg" id="internaddbutton">Add
<button onclick="addNewProject()" class="btn btn-dark btn-lg hidden" id="projectaddbutton">Add
This</button>
<button class="btn btn-dark btn-lg hidden" id="projecteditbutton">Change
</button>
<div>You must click the button to add this to LaTeX code.</div><br>

<!-- edit icons for project start-->
<div class="form-group hidden" id="projecteditbuttonComment">If you want to edit a project, then click on edit.</div>
<div class="form-group" id="projectsEdit">


</div>
<!-- edit icon fo project end-->

<h3>Skills</h3>
<div>(If you dont want to include this, leave it blank and delete this section from the
LaTeX code generated.)</div>
Expand Down Expand Up @@ -258,7 +276,7 @@ <h3>Achievements</h3>

<!-- cv template -->


<div class="col-md-6">
<div class="cv-template" id="cv-template">
<!-- Your CV Template content -->
Expand Down Expand Up @@ -529,6 +547,7 @@ <h5 class="text-center my-2">A rough preview. Differs from the LaTeX output. <br
</div> -->

<!--Skill set listed here-->

<div class="row my-0" style="background-color: lightgray;">
<p class="fw-bold my-0 p-0">SKILLS</p>
</div>
Expand All @@ -548,7 +567,7 @@ <h5 class="text-center my-2">A rough preview. Differs from the LaTeX output. <br
elit. Explicabo quia et excepturi beatae rerum deserunt quia</p>
</div>
</li>
</ul>
</ul>
<!-- <div class="row">
<div class="col-8 p-0">
<p class="fw-bold my-0">Type of Skill</p>
Expand Down Expand Up @@ -603,18 +622,19 @@ <h5 class="text-center my-2">A rough preview. Differs from the LaTeX output. <br
<div class="d-grid gap-2 col-6 mx-auto my-4">
<!-- <button type="button" class="btn btn-dark btn-lg" id="download">Download
Resume</button> -->

<button class="btn btn-dark btn-lg" onclick="copyToClipboard()">Copy LaTeX Code to
Clipboard</button>

</div>
</div>

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

</div>
</div>

<!-- Latex code begins -->
<pre id="latexCode" style="display:none;">
\documentclass[a4paper,10pt]{article}
Expand Down Expand Up @@ -764,7 +784,16 @@ <h2>IIT Gandhinagar</h2>
<script src="script.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/html2canvas.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.10.1/html2pdf.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.9.3/html2pdf.bundle.min.js"></script>



<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.10.1/html2pdf.bundle.min.js"></script>



</body>

</html>
Expand Down
206 changes: 204 additions & 2 deletions script.js
View file
Original file line number Diff line number Diff line change
@@ -1,9 +1,16 @@
let internships = [];
let projects = [];
let projectsHtml = [];
let skills = [];
let PORs = [];
let achievements = [];




// to show add this for project
document.getElementById("internaddbutton").classList.remove("hidden");

function addNewIntern() {
// Get values from the form
let title = document.getElementById("internTitleF").value;
Expand Down Expand Up @@ -34,8 +41,105 @@ function addNewIntern() {
document.getElementById("interndescriptionF").value = "";
document.getElementById("interndescription2F").value = "";
document.getElementById("yearinternF").value = "";


const internsEdit = document.getElementById("internsEdit");

internsEdit.innerHTML += `
<div class="border bg-white p-2 rounded" style="height: auto;">
<div class="row align-items-center">
<div class="col-md-8">
<h5 class="mb-0">Intership Title: <strong id="${title}${year}">${title} ${year}</strong></h5>
</div>
<div class="col-md-4 text-right">
<button class="btn btn-primary btn-sm" id="${title}" onclick="editinternsList('${title}')">Edit</button>
</div>
</div>
</div>
<br>
`;
document.getElementById("interneditbuttonComment").classList.remove('hidden');
}


// function to edit internship data
function editinternsList(internTitle){
const foundintern = internships.find(internship => internship.title === internTitle);
document.getElementById("internaddbutton").classList.add("hidden");
if (foundintern) {
// Set the values of the input fields
document.getElementById("internTitleF").value = foundintern.title || "";
document.getElementById("internInfoF").value = foundintern.info || "";
document.getElementById("internLinkF").value = foundintern.link || "";
document.getElementById("interndescriptionF").value = foundintern.description || "";
document.getElementById("interndescription2F").value = foundintern.description2 || "";
document.getElementById("yearinternF").value = foundintern.year || "";
} else {
console.error("intership not found with the title:", internTitle);
// Optionally, reset the input fields or notify the user
document.getElementById("internTitleF").value = "";
document.getElementById("internInfoF").value = "";
document.getElementById("internLinkF").value = "";
document.getElementById("interndescriptionF").value = "";
document.getElementById("interndescription2F").value = "";
document.getElementById("yearinternF").value = "";
}


document.getElementById("internaddbutton").classList.add("hidden");
document.getElementById("interneditbutton").classList.remove("hidden");
document.getElementById("interneditbutton").onclick = function() {
addEditedintern(foundintern);
};


}

// function to add edited project
function addEditedintern(internId){
// edit project data in projects array
const editedProjectId = document.getElementById(`${internId.title}${internId.year}`);
const editInternButtonId = document.getElementById(`${internId.title}`);
internId.title = document.getElementById("internTitleF").value;
internId.info = document.getElementById("internInfoF").value;
internId.link = document.getElementById("internLinkF").value;
internId.description = document.getElementById("interndescriptionF").value;
internId.description2 = document.getElementById("interndescription2F").value;
internId.year = document.getElementById("yearinternF").value;

// update edited project title in edit box
editedProjectId.innerText = `${internId.title} ${internId.year}`;
editedProjectId.id = `${internId.title}${internId.year}`;
editInternButtonId.id = `${internId.title}`;
editInternButtonId.onclick = function(){
editinternsList(internId.title)
}

// update project list
updateInternshipList();


// Optionally, reset the input fields or notify the user
document.getElementById("internTitleF").value = "";
document.getElementById("internInfoF").value = "";
document.getElementById("internLinkF").value = "";
document.getElementById("interndescriptionF").value = "";
document.getElementById("interndescription2F").value = "";
document.getElementById("yearinternF").value = "";

// remove "change" button and add "Add this" button
document.getElementById("iternaddbutton").classList.remove("hidden");
document.getElementById("interneditbutton").classList.add("hidden");
}









function updateInternshipList() {
// Get the list element
let internList = document.getElementById("internlistT");
Expand Down Expand Up @@ -112,6 +216,15 @@ function escapeLaTeX(text) {
}








// to show add this for project
document.getElementById("projectaddbutton").classList.remove("hidden");

// Function to add a new project
function addNewProject() {
// Get values from the form
Expand Down Expand Up @@ -142,8 +255,99 @@ function addNewProject() {
document.getElementById("projectdescriptionF").value = "";
document.getElementById("projectdescription2F").value = "";
document.getElementById("yearprojectF").value = "";

// add title in edit div
const projectsEdit = document.getElementById("projectsEdit");

projectsEdit.innerHTML += `
<div class="border bg-white p-2 rounded" style="height: auto;">
<div class="row align-items-center">
<div class="col-md-8">
<h5 class="mb-0">Project Title: <strong id="${title}${year}">${title} ${year}</strong></h5>
</div>
<div class="col-md-4 text-right">
<button class="btn btn-primary btn-sm" id="${title}" onclick="editProjectsList('${title}')">Edit</button>
</div>
</div>
</div>
<br>
`;

document.getElementById("projecteditbuttonComment").classList.remove('hidden');
}


// function to edit project data
function editProjectsList(projectTitle){
const foundProject = projects.find(project => project.title === projectTitle);
document.getElementById("projectaddbutton").classList.add("hidden");
if (foundProject) {
// Set the values of the input fields
document.getElementById("projectTitleF").value = foundProject.title || "";
document.getElementById("projectInfoF").value = foundProject.info || "";
document.getElementById("projectLinkF").value = foundProject.link || "";
document.getElementById("projectdescriptionF").value = foundProject.description || "";
document.getElementById("projectdescription2F").value = foundProject.description2 || "";
document.getElementById("yearprojectF").value = foundProject.year || "";
} else {
console.error("Project not found with the title:", projectTitle);
// Optionally, reset the input fields or notify the user
document.getElementById("projectTitleF").value = "";
document.getElementById("projectInfoF").value = "";
document.getElementById("projectLinkF").value = "";
document.getElementById("projectdescriptionF").value = "";
document.getElementById("projectdescription2F").value = "";
document.getElementById("yearprojectF").value = "";
}


document.getElementById("projectaddbutton").classList.add("hidden");
document.getElementById("projecteditbutton").classList.remove("hidden");
document.getElementById("projecteditbutton").onclick = function() {
addEditedProject(foundProject);
};


}

// function to add edited project
function addEditedProject(projectId){
// edit project data in projects array
const editedProjectId = document.getElementById(`${projectId.title}${projectId.year}`);
const editProjectButtonId = document.getElementById(`${projectId.title}`);
projectId.title = document.getElementById("projectTitleF").value;
projectId.info = document.getElementById("projectInfoF").value;
projectId.link = document.getElementById("projectLinkF").value;
projectId.description = document.getElementById("projectdescriptionF").value;
projectId.description2 = document.getElementById("projectdescription2F").value;
projectId.year = document.getElementById("yearprojectF").value;

// update edited project title in edit box
editedProjectId.innerText = `${projectId.title} ${projectId.year}`;
editedProjectId.id = `${projectId.title}${projectId.year}`;
editProjectButtonId.id = `${projectId.title}`;
editProjectButtonId.onclick = function(){
editProjectsList(projectId.title)
}

// update project list
updateProjectList();


// Optionally, reset the input fields or notify the user
document.getElementById("projectTitleF").value = "";
document.getElementById("projectInfoF").value = "";
document.getElementById("projectLinkF").value = "";
document.getElementById("projectdescriptionF").value = "";
document.getElementById("projectdescription2F").value = "";
document.getElementById("yearprojectF").value = "";

// remove "change" button and add "Add this" button
document.getElementById("projectaddbutton").classList.remove("hidden");
document.getElementById("projecteditbutton").classList.add("hidden");
}


// Function to update the project list on the webpage
function updateProjectList() {
// Get the list element
Expand Down Expand Up @@ -588,6 +792,4 @@ function copyToClipboard() {
// Optionally, provide feedback to the user
alert("Copied LaTeX code to clipboard. Paste in any LaTeX editor. Eg: Overleaf.");
}


setInterval(generateCV, 100);
16 changes: 16 additions & 0 deletions style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@
font-family: 'Times New Roman', 'Times', 'serif';
height: 100vh;
overflow-y: scroll;
display: block;
}

body {
Expand Down Expand Up @@ -45,6 +46,10 @@ body {
font-size: 1.5rem;
}

.hidden {
display: none;
}

.footer-content {
display: flex;
flex-direction: column;
Expand Down Expand Up @@ -122,6 +127,17 @@ body {
}
}

@media print {
#cv-template{
page-break-inside: avoid;
}
}

.attribute {
position: absolute;
bottom: 10px;
}

@media (max-width: 767px) {
.footer-content {
flex-direction: column;
Expand Down

0 comments on commit 053620c

Please sign in to comment.