ProjectB/projectb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

SHARTH CODE MERGE : RV

Browse Source
This commit is contained in:
venkateswaran ubuntu 2023-10-20 16:09:55 +05:30
commit 12519706fd
2 changed files with 349 additions and 108 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

384
addform.html
View File

@ -350,6 +350,94 @@
</style> </style>
<style>
/* Styles for the overlay background */
.overlay {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0); /* Initial opacity set to 0 */
transition: background-color 0.3s; /* Add a transition effect for smooth opacity change */
z-index: 1;
}
/* Styles for the popup container */
.popup {
display: none;
position: fixed;
background-color: #c8c8cb;
width: 30%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
padding: 20px;
z-index: 2;
font-size: larger;
}
.popupbox {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 16px;
padding: 10px;
border-radius: 8px;
background: #fff;
border: 1px solid #e6e6e6;
box-shadow: 0 0 5px rgb(0 0 0 / 10%);
}
.popupbox p{margin: 0;}
.popup-save{
display: flex;
justify-content: flex-end;
}
.popup-save button{
border-radius: 5px;
border-color:#eee;
margin-right: 0px;
margin-top: 16px;
}
.popupbox q{
align-items: center;
margin-bottom: 16px;
padding: 10px;
border-radius: 8px;
background: #fff;
border: 1px solid #e6e6e6;
box-shadow: 0 0 5px rgb(0 0 0 / 10%);
}
</style>
<style>
.dropdown {
position: relative;
display: inline-block;
padding:20px;
}
.dropdown-content {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 56px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
right:12px;
}
.dropdown-content a {
padding: 12px 16px;
text-decoration: none;
display: block;
}
.dropdown:hover .dropdown-content {
display: block;
}
</style>
</head> </head>
<body> <body>
@ -417,6 +505,8 @@
<!-- QuestionPapper Start --> <!-- QuestionPapper Start -->
<div class="row section QuestionPaperClass" id="QuestionPaper"> <div class="row section QuestionPaperClass" id="QuestionPaper">
<!-- QuestionPapper Title Start--> <!-- QuestionPapper Title Start-->
<div class="question-papper-title element" style="border-top: solid; margin-bottom: 15px;"> <div class="question-papper-title element" style="border-top: solid; margin-bottom: 15px;">
@ -506,6 +596,21 @@
</div> </div>
<!-- QuestionPapper Container End --> <!-- QuestionPapper Container End -->
</div> </div>
<!-- The overlay background -->
<div class="overlay " id="overlay"></div>
<!-- The popup container -->
<div class="popup " id="popup">
<ul id="output" class="">
<div style="margin-bottom: 9px;">Reorder sections</div>
</ul>
<div class="popup-save form-button">
<button onclick="saveFile(flag=1)" id="closePopupButton">Save</button>
</div>
<!-- <button id="closePopupButton">Close</button> -->
</div>
<div class="copy-right-area"> <div class="copy-right-area">
@ -581,6 +686,9 @@
<script> <script>
var sidebarWrapper = document.getElementById("questionPaper"); var sidebarWrapper = document.getElementById("questionPaper");
function clearSidebarWrapper() { function clearSidebarWrapper() {
@ -739,18 +847,23 @@ function loadXML(xmlFileName) {
} }
// Function for Save the XML File // Function for Save the XML File
function saveFile() { function saveFile(flag=0) {
html2json(); html2json();
json2xml(); json2xml();
console.log("flag",flag);
if(FileName == "" || FileName == null ){ if(FileName == "" || FileName == null ){
setTimeout(promptBox, 1000); setTimeout(promptBox, 1000);
}else{ }else{
const newFileName = FileName.split(".")[0]; const newFileName = FileName.split(".")[0];
savexml(newFileName); //if 1 it is used for re-order and redirect to the qn paper itself
if (flag==1){
savexml(newFileName,reorder=true);
//if 0 it is used as nrml save which will redierect to dashboard
}else{
savexml(newFileName);
}
} }
}; };
@ -882,6 +995,7 @@ function addSection(title = false, description = false, random_no = false, secti
i = i + 1; i = i + 1;
addsection += addsection +=
` `
<div id="reorder_${sectionRandomID}">
<div class="section-heading"> <div class="section-heading">
<i class="fa fa-angle-down float-left" id="collapseSection_${random_no == false ? text_field_created_time : random_no}" aria-hidden="true"></i> <i class="fa fa-angle-down float-left" id="collapseSection_${random_no == false ? text_field_created_time : random_no}" aria-hidden="true"></i>
&nbsp; <!-- Add a space character here --> &nbsp; <!-- Add a space character here -->
@ -890,10 +1004,21 @@ function addSection(title = false, description = false, random_no = false, secti
<input type="hidden" id="Section_UUID_ID_${random_no == false ? text_field_created_time : random_no}" value="${section_uuid == false ? Section_UUID : section_uuid}"> <input type="hidden" id="Section_UUID_ID_${random_no == false ? text_field_created_time : random_no}" value="${section_uuid == false ? Section_UUID : section_uuid}">
<div class="section restrict-drop" id="section_${sectionRandomID}" > <div class="section restrict-drop" id="section_${sectionRandomID}" >
<div class="sectionTitle" id="section_title_${random_no == false ? text_field_created_time : random_no}"> <div class="sectionTitle" id="section_title_${random_no == false ? text_field_created_time : random_no}">
<div class="nodrop col-lg-12 col-md-12"> <div class="nodrop col-lg-12 col-md-12">
<div class="row question element" style="border-top : 15px solid; margin-right: ;" id="SectionBox_${sectionRandomID}" onmouseover="showButtons(this)" > <div class="row question element" style="border-top : 15px solid; margin-right: ;" id="SectionBox_${sectionRandomID}" onmouseover="showButtons(this)" >
<div class="items align-items-center hideondrag" style="display: block;">
<div class="dropdown " id="toggle-menu">
<i class="fa fa-ellipsis-v" style="font-size:20px" aria-hidden="true"></i>
<div class="dropdown-content ">
<button id="popupid_${sectionRandomID}" class="showPopupButton ">Move</button>
</div>
</div>
</div>
<div class="row" style="text-align:right; width: 100%"> <div class="row" style="text-align:right; width: 100%">
<div class="col-lg-10 col-md-12"> <div class="col-lg-10 col-md-12">
<div class=" button-group align-items-center"> <div class=" button-group align-items-center">
<div class="addButton buttons" style="display: none;" id="sectionAddButton_${sectionRandomID}"> <div class="addButton buttons" style="display: none;" id="sectionAddButton_${sectionRandomID}">
@ -958,6 +1083,7 @@ function addSection(title = false, description = false, random_no = false, secti
</div> </div>
</div> </div>
</div> </div>
</div>
`; `;
var formContainer = document.getElementById('addNewSection'); var formContainer = document.getElementById('addNewSection');
@ -971,7 +1097,14 @@ function addSection(title = false, description = false, random_no = false, secti
var groupQuestionButtonId = 'groupQuestionButton_' + sectionRandomID; var groupQuestionButtonId = 'groupQuestionButton_' + sectionRandomID;
document.getElementById('popupid_'+sectionRandomID).addEventListener('click', function() {
// alert("dd")
// const popup = document.getElementById('popup');
// popup.style.display = 'block';
executeScriptAndDisplayOutput()
});
$('#'+addNewButtonId).on('click', function() { $('#'+addNewButtonId).on('click', function() {
$('#'+SectionButtonId).toggle(); $('#'+SectionButtonId).toggle();
@ -2489,6 +2622,9 @@ function ReArrangeQuestions(e){
currentItemID.insertBefore(question_nextItem, question_ListItem); currentItemID.insertBefore(question_nextItem, question_ListItem);
} }
} }
json2nav();
clearSidebarWrapper();
navpane();
} }
//function for REORDER the Question Group in the SECTION Level //function for REORDER the Question Group in the SECTION Level
@ -2529,7 +2665,9 @@ function ReArrangeQuestionsGroup(e){
currentItemID.insertBefore(question_nextItem, question_ListItem); currentItemID.insertBefore(question_nextItem, question_ListItem);
} }
} }
json2nav();
clearSidebarWrapper();
navpane();
} }
//Function for Add Group Question inside the Group QUestion Like Question //Function for Add Group Question inside the Group QUestion Like Question
@ -2650,62 +2788,38 @@ function removeClonedQroupQuestion(index)
let draggedItemGroup = null; let draggedItemGroup = null;
let draggedItemQuestion = null; let draggedItemQuestion = null;
let dropTarget = null; let dropTarget = null;
let richTextElements = null;
let questionLabels = null;
// Event listener for .draggable-group elements // Event listener for .drag-handle elements within questions
document.addEventListener('mousedown', function (e) { document.addEventListener('mousedown', function (e) {
const dragHandle = e.target.closest('.drag-handle'); const dragHandle = e.target.closest('.drag-handle');
if (dragHandle) { if (dragHandle) {
// If the click is inside a drag handle, find the corresponding .draggable-group // If the click is inside a drag handle, find the corresponding .question
const draggableGroup = dragHandle.closest('.draggable-group'); const questionElement = dragHandle.closest('.question');
if (draggableGroup) {
// Initiate the drag operation for the .draggable-group
draggedItemGroup = draggableGroup;
// Add a dragStart event listener to set data if (questionElement) {
draggedItemGroup.addEventListener('dragstart', function (e) { console.log("draggHandle:",dragHandle);
e.dataTransfer.setData('text/plain', draggedItemGroup.id); // Initiate the drag operation for the .question
// console.log(draggedItemGroup.id); draggedItemQuestion = questionElement;
// Hide all elements with class "hideondrag"
richTextElements = document.querySelectorAll('.hideondrag');
richTextElements.forEach((element) => {
element.style.display = 'none';
});
});
}
}
});
// Event listener for .question elements // Add a dragStart event listener to set data
document.addEventListener('mousedown', function (e) { draggedItemQuestion.addEventListener('dragstart', function (e) {
const dragHandle = e.target.closest('.drag-handle'); e.dataTransfer.setData('text/plain', draggedItemQuestion.id);
console.log(draggedItemQuestion.id);
if (dragHandle) {
// If the click is inside a drag handle, find the corresponding .question
const questionElement = dragHandle.closest('.question'); });
}
if (questionElement) { }
// Initiate the drag operation for the .question });
draggedItemQuestion = questionElement;
// Add a dragStart event listener to set data
draggedItemQuestion.addEventListener('dragstart', function (e) {
e.dataTransfer.setData('text/plain', draggedItemQuestion.id);
// Hide all elements with class "hideondrag"
richTextElements = document.querySelectorAll('.hideondrag');
richTextElements.forEach((element) => {
element.style.display = 'none';
});
});
}
}
});
document.addEventListener('dragover', function (e) { document.addEventListener('dragover', function (e) {
// groupqnornot = true;
// Hide all elements with class "hideondrag" in the question
const richTextElements = document.querySelectorAll('.hideondrag');
richTextElements.forEach((element) => {
element.style.display = 'none';
});
e.preventDefault(); e.preventDefault();
// Allow scrolling while dragging // Allow scrolling while dragging
@ -2737,12 +2851,11 @@ function removeClonedQroupQuestion(index)
if (dropTarget) { if (dropTarget) {
dropTarget.classList.remove('highlight'); dropTarget.classList.remove('highlight');
} }
if (dropTarget.classList.contains('nodrop')) { if (dropTarget.classList.contains('nodrop')) {
// Remove the highlight class when leaving the drop target // Remove the highlight class when leaving the drop target
dropTarget.classList.remove('highlight'); dropTarget.classList.remove('highlight');
} }
}); });
document.addEventListener('dragend', function () { document.addEventListener('dragend', function () {
// Remove the highlight class from all .draggable-group and .question elements // Remove the highlight class from all .draggable-group and .question elements
@ -2751,20 +2864,13 @@ function removeClonedQroupQuestion(index)
element.classList.remove('highlight'); element.classList.remove('highlight');
}); });
// Show all elements with class "hideondrag" again for .draggable-group
if (richTextElements) {
richTextElements.forEach((element) => {
element.style.display = '';
});
}
// Show all elements with class "hideondrag" again for .question // Show all elements with class "hideondrag" again for .question
if (richTextElements) { const richTextElements = document.querySelectorAll('.hideondrag');
richTextElements.forEach((element) => { richTextElements.forEach((element) => {
element.style.display = ''; element.style.display = '';
}); });
}
// Reset variables
dropTarget = null; dropTarget = null;
draggedItemGroup = null; draggedItemGroup = null;
draggedItemQuestion = null; draggedItemQuestion = null;
@ -2783,6 +2889,9 @@ function removeClonedQroupQuestion(index)
} }
draggedItemGroup = null; draggedItemGroup = null;
dropTarget = null; dropTarget = null;
json2nav();
clearSidebarWrapper();
navpane();
} else if (draggedItemQuestion && dropTarget) { } else if (draggedItemQuestion && dropTarget) {
e.preventDefault(); e.preventDefault();
const rect = dropTarget.getBoundingClientRect(); const rect = dropTarget.getBoundingClientRect();
@ -2795,9 +2904,14 @@ function removeClonedQroupQuestion(index)
} }
draggedItemQuestion = null; draggedItemQuestion = null;
dropTarget = null; dropTarget = null;
json2nav();
clearSidebarWrapper();
navpane();
} else { } else {
console.error('No dragged item or drop target found.'); console.error('No dragged item or drop target found.');
} }
}); });
</script> </script>
@ -2847,6 +2961,128 @@ function removeClonedQroupQuestion(index)
} }
} }
</script> </script>
<script>
// Function to execute the script and display its output in the popup
function executeScriptAndDisplayOutput() {
// Display the popup with the output
const popup = document.getElementById('popup');
popup.style.display = 'block';
// alert('hi');
// Sample JSON data with section names and section IDs
const jsonData = JSON.parse(localStorage.getItem('JSON_FOR_NAV'));
const reorderpop = document.getElementById('output');
const addsection= document.querySelector('#addNewSection'); // Replace with your actual right list ID
console.log("addsection:",addsection);
// Function to add a section name to the left side
function addSectionName(section) {
v=section.section_title;
// // Remove <p> and </p> tags from the HTML content
v = v.replace(/<p>|<\/p>/g, '');
console.log("v",v);
if (v === '<br>') {
// If the innerHTML is empty, add sample text
v = 'untitled'
// console.log("v",v);
}
console.log("v",v);
const reorderpop_item = document.createElement('li');
// Set the inner HTML of the list item to the section title
reorderpop_item.innerHTML = v;
reorderpop_item.classList.add('reorder-item');
reorderpop_item.classList.add('popupbox');
// Set the "id" attribute with the updated value from JSON data
reorderpop_item.id = 'reorder_' + section.section_id;
const buttons = document.createElement('span');
buttons.innerHTML = `
<span class="fa fa-chevron-up up-icon" style="transition: box-shadow 0.3s ease; border-radius: 50%;" onmouseover="this.style.boxShadow = '0 0 10px rgba(0, 0, 0, 0.5)';" onmouseout="this.style.boxShadow = 'none';"></span>
<span class="fa fa-chevron-down down-icon" style="transition: box-shadow 0.3s ease; border-radius: 50%;" onmouseover="this.style.boxShadow = '0 0 10px rgba(0, 0, 0, 0.5)';" onmouseout="this.style.boxShadow = 'none';"></span>
`;
reorderpop_item.appendChild(buttons);
reorderpop.appendChild(reorderpop_item);
}
// Populate the left side with section names and IDs from JSON data
jsonData.sections.forEach(section => {
addSectionName(section);
});
// Add event listeners to handle reordering
reorderpop.addEventListener('click', (e) => {
if (e.target.classList.contains('up-icon')) {
console.log("up");
const reorderpop_item = e.target.parentElement.parentElement;
const prevItem = reorderpop_item.previousElementSibling;
console.log("reorderpop_item:",reorderpop_item);
console.log("prevItem:",prevItem);
if (prevItem) {
reorderpop.insertBefore(reorderpop_item, prevItem);
// Remove the "reorder_" prefix from the ID
const originalId = reorderpop_item.id;
console.log("originalId",originalId);
const idWithoutPrefix = originalId.replace("reorder_section_title_text_", "");
console.log("idWithoutPrefix",idWithoutPrefix);
// Get the corresponding element in the right list
const item_to_be_reorderd = document.getElementById('reorder_' +idWithoutPrefix);
console.log("item_to_be_reorderd",item_to_be_reorderd);
// Find the previous element in the right list to determine where to insert
const prevItemInRightSide = item_to_be_reorderd.previousElementSibling;
console.log("prevItemInRightSide",prevItemInRightSide);
// Move the element to the right list
addsection.insertBefore(item_to_be_reorderd, prevItemInRightSide);
}
} else if (e.target.classList.contains('down-icon')) {
console.log("down");
const reorderpop_item = e.target.parentElement.parentElement;
const nextItem = reorderpop_item.nextElementSibling;
console.log("reorderpop_item:",reorderpop_item);
console.log("nextItem:",nextItem);
if (nextItem) {
reorderpop.insertBefore(nextItem, reorderpop_item);
// Add code to update the corresponding element in the right list if needed
const originalId = reorderpop_item.id;
console.log("originalId",originalId);
const idWithoutPrefix = originalId.replace("reorder_section_title_text_", "");
console.log("idWithoutPrefix",idWithoutPrefix);
const item_to_be_reorderd = document.getElementById('reorder_' + idWithoutPrefix);
console.log("item_to_be_reorderd",item_to_be_reorderd);
const nextItemInRightSide = item_to_be_reorderd.nextElementSibling;
console.log("nextItemInRightSide",nextItemInRightSide);
addsection.insertBefore(nextItemInRightSide,item_to_be_reorderd);
}
}
});
}
// document.getElementById('showPopupButton').addEventListener('click', executeScriptAndDisplayOutput);
// document.getElementById('1').addEventListener('click', function() {
// const popup = document.getElementById('popup');
// popup.style.display = 'none';
// });
// function Sample()
// {
// alert('hi');
// }
</script>
</body> </body>
</html> </html>

73
savexml.js
View File

@ -9,33 +9,33 @@ require('dotenv').config();
//Get the value from .env //Get the value from .env
const isEncrypted = process.env.ENCRYPTED; const isEncrypted = process.env.ENCRYPTED;
// start the Autosave filename take the names in xml folder // start the Autosave filename take the names in xml folder
//////// ////////
function getFilesInFolder(folderName) { function getFilesInFolder(folderName) {
const xmlFilePath = path.join(__dirname, folderName); const xmlFilePath = path.join(__dirname, folderName);
try { try {
const fileNames = fs.readdirSync(xmlFilePath); const fileNames = fs.readdirSync(xmlFilePath);
const xmlFiles = fileNames.filter((file) => file.endsWith('.xml')); const xmlFiles = fileNames.filter((file) => file.endsWith('.xml'));
return xmlFiles; return xmlFiles;
} catch (error) { } catch (error) {
console.error('Error reading folder:', error); console.error('Error reading folder:', error);
return []; return [];
}
} }
//XmlPath get from .env }
const xmlPath_ = process.env.XML_FILE_PATH; //XmlPath get from .env
const folderName = `/${xmlPath_}`; const xmlPath_ = process.env.XML_FILE_PATH;
const filePaths = []; const folderName = `/${xmlPath_}`;
const files = getFilesInFolder(folderName); const filePaths = [];
files.forEach((file) => { const files = getFilesInFolder(folderName);
const filePath = file; files.forEach((file) => {
filePaths.push(filePath); const filePath = file;
}); filePaths.push(filePath);
});
//////// ////////
//end the autosave //end the autosave
function saveXmlToFile(xmlData, filePath) { function saveXmlToFile(xmlData, filePath,reorder=false) {
console.log(filePath);
// console.log(filePath); // console.log(filePath);
// Check if the file path is provided // Check if the file path is provided
if (!filePath) { if (!filePath) {
@ -58,17 +58,19 @@ function saveXmlToFile(xmlData, filePath) {
} }
}); });
localStorage.clear(); localStorage.clear();
if(reorder){
window.location.href = 'dashboard.html'; window.location.reload();
}else{
} window.location.href = 'dashboard.html';
}
}
function savexml(UserFilename) { function savexml(UserFilename,reorder=false) {
console.log("reorder",reorder);
// Get the XML string from localStorage // Get the XML string from localStorage
var xmlString = localStorage.getItem("xml"); var xmlString = localStorage.getItem("xml");
//check Encrypted or not //check Encrypted or not
var enc = ""; var enc = "";
if (isEncrypted === 'YES') { if (isEncrypted === 'YES') {
@ -77,12 +79,11 @@ function savexml(UserFilename) {
} else { } else {
enc = xmlString; enc = xmlString;
} }
//XmlPath get from .env //XmlPath get from .env
const xmlPathenv = process.env.XML_FILE_PATH; const xmlPathenv=process.env.XML_FILE_PATH;
const xmlPath = path.join(__dirname, xmlPathenv) const xmlPath = path.join(__dirname, xmlPathenv)
// Get the json string from localStorage for set fileName // Get the json string from localStorage for set fileName
var jsonData = localStorage.getItem("json"); var jsonData = localStorage.getItem("json");
// Create a filename using on the subtitle // Create a filename using on the subtitle
var xmlfilename = `${UserFilename}.xml`; var xmlfilename = `${UserFilename}.xml`;
@ -94,11 +95,15 @@ function savexml(UserFilename) {
const xmlfilePath = `${xmlPath}` + xmlfilename; const xmlfilePath = `${xmlPath}` + xmlfilename;
// const jsonfilePath = process.cwd() + '/xml/' + jsonfilename; // const jsonfilePath = process.cwd() + '/xml/' + jsonfilename;
// Call the function to save the XML file if(reorder){
saveXmlToFile(enc, xmlfilePath); saveXmlToFile(enc, xmlfilePath,reorder=true);
}else{
// Call the function to save the XML file
saveXmlToFile(enc, xmlfilePath);
}
} }
function promptBox() { function promptBox() {
var jsonData = localStorage.getItem("json"); var jsonData = localStorage.getItem("json");