2068 lines
74 KiB
HTML
2068 lines
74 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Project-B</title>
|
|
|
|
<meta name="description" content="">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<!-- Favicon -->
|
|
<link rel="icon" type="image/png" sizes="56x56" href="assets/images/fav-icon/v.png">
|
|
<!-- bootstrap CSS -->
|
|
<link rel="stylesheet" href="assets/css/bootstrap.min.css" type="text/css" media="all" />
|
|
<!-- carousel CSS -->
|
|
<link rel="stylesheet" href="assets/css/owl.carousel.min.css" type="text/css" media="all"/>
|
|
<!-- nivo-slider CSS -->
|
|
<link rel="stylesheet" href="assets/css/nivo-slider.css" type="text/css" media="all" />
|
|
<!-- animate CSS -->
|
|
<link rel="stylesheet" href="assets/css/animate.css" type="text/css" media="all" />
|
|
<!-- animated-text CSS -->
|
|
<link rel="stylesheet" href="assets/css/animated-text.css" type="text/css" media="all" />
|
|
<!-- font-awesome CSS -->
|
|
<link rel="stylesheet" href="assets/css/all.min.css" type="text/css" media="all" />
|
|
<!-- font-flaticon CSS -->
|
|
<link rel="stylesheet" href="assets/css/flaticon.css" type="text/css" media="all" />
|
|
<!-- theme-default CSS -->
|
|
<link rel="stylesheet" href="assets/css/theme-default.css" type="text/css" media="all" />
|
|
<!-- meanmenu CSS -->
|
|
<link rel="stylesheet" href="assets/css/meanmenu.min.css" type="text/css" media="all" />
|
|
<link rel="stylesheet" href="assets/css/font-awesome.min.css" type="text/css" media="all" />
|
|
<!-- Main Style CSS -->
|
|
<link rel="stylesheet" href="style.css" type="text/css" media="all" />
|
|
<!-- transitions CSS -->
|
|
<link rel="stylesheet" href="assets/css/owl.transitions.css" type="text/css" media="all" />
|
|
<!-- venobox CSS -->
|
|
<link rel="stylesheet" href="venobox/venobox.css" type="text/css" media="all" />
|
|
<!-- widget CSS -->
|
|
<link rel="stylesheet" href="assets/css/widget.css" type="text/css" media="all" />
|
|
<!-- responsive CSS -->
|
|
<link rel="stylesheet" href="assets/css/responsive.css" type="text/css" media="all" />
|
|
<!-- quill css -->
|
|
<link rel="stylesheet" href="./node_modules/quill/dist/quill.snow.css" type="text/css" media="all" />
|
|
<!-- CortexJs MathLive JS and CSS -->
|
|
<link rel="stylesheet" href="./node_modules/mathlive/dist/mathlive-static.css" />
|
|
<script defer src="./node_modules/mathlive/dist/mathlive.min.js"></script>
|
|
<!-- modernizr js -->
|
|
<script src="assets/js/vendor/modernizr-3.5.0.min.js"></script>
|
|
|
|
|
|
<style>
|
|
|
|
ul, #myUL {
|
|
list-style-type: none;
|
|
}
|
|
|
|
#myUL {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.caret {
|
|
cursor: pointer;
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
}
|
|
|
|
.caret::before {
|
|
content: "\25B6";
|
|
color: black;
|
|
display: inline-block;
|
|
margin-right: 6px;
|
|
}
|
|
|
|
.caret-down::before {
|
|
-ms-transform: rotate(90deg); /* IE 9 */
|
|
-webkit-transform: rotate(90deg); /* Safari */
|
|
transform: rotate(90deg);
|
|
}
|
|
|
|
.nested {
|
|
display: none;
|
|
}
|
|
|
|
.active {
|
|
display: block;
|
|
}
|
|
|
|
#myUL{
|
|
display: flex;
|
|
}
|
|
|
|
#myUL ul {
|
|
list-style-type: none;
|
|
padding: 0;
|
|
}
|
|
|
|
#myUL li {
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
#myUL a {
|
|
text-decoration: none;
|
|
color: #333;
|
|
}
|
|
|
|
#myUL a:hover {
|
|
color: #000;
|
|
}
|
|
|
|
.nested {
|
|
border-left: 2px dotted #000;
|
|
margin-left: 10px;
|
|
padding-left: 10px;
|
|
}
|
|
|
|
</style>
|
|
|
|
|
|
|
|
|
|
<style>
|
|
.highlight {
|
|
border: 2px dashed blue; /* Change the border style as needed */
|
|
}
|
|
|
|
/* Initially hide the icon */
|
|
.drag-handle {
|
|
display: none;
|
|
}
|
|
|
|
/* Show the icon when hovering over the parent element with .hidedrag */
|
|
.hidedrag:hover .drag-handle {
|
|
display: block;
|
|
}
|
|
|
|
body {
|
|
background-image: url('assets/images/bg1-1.png');
|
|
background-size: cover;
|
|
background-repeat: no-repeat;
|
|
background-attachment: fixed;
|
|
}
|
|
|
|
[contentEditable=true]:empty:not(:focus):before {
|
|
content: attr(data-text)
|
|
}
|
|
|
|
.highlight {
|
|
background-color: rgb(230, 221, 235); /* Change to your preferred highlight color */
|
|
}
|
|
|
|
/* Define the transition for the animation */
|
|
.highlight {
|
|
transition: background-color 0.3s ease; /* Adjust the duration and easing as needed */
|
|
}
|
|
|
|
/* Style for the placeholder element with a slow animation */
|
|
.placeholder {
|
|
height: 20px; /* Adjust the height as needed to create the desired gap */
|
|
background-color: transparent; /* Set the background to transparent or match your layout */
|
|
transition: height 0.5s ease; /* Adjust the duration and easing for the gap animation */
|
|
}
|
|
|
|
math-field{
|
|
border-radius: 6px;
|
|
font-size:18px;
|
|
display: block;
|
|
color: #6d6d6d;
|
|
}
|
|
|
|
|
|
|
|
</style>
|
|
|
|
</head>
|
|
<body>
|
|
|
|
|
|
<!-- loder -->
|
|
<div class="loader-wrapper">
|
|
<div class="loader"></div>
|
|
<div class="loder-section left-section"></div>
|
|
<div class="loder-section right-section"></div>
|
|
</div>
|
|
|
|
|
|
<!-- main-header -->
|
|
<div class="main-header">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-lg-12">
|
|
<div id="sticky-header" class="nav-menu">
|
|
<div class="header-logo">
|
|
<a href="dashboard.html" ><h2 style="margin-top: 25px;"><img src="assets/images/fav-icon/icon.png" alt=""> PROJECT-B</h2></a>
|
|
<a class="main_sticky" href="dashboard.html" class="project"><h2 style="margin-top: 25px;"><img src="assets/images/fav-icon/icon.png" alt=""> PROJECT-B</h2></a>
|
|
</div>
|
|
<div class="heder-menu">
|
|
<ul>
|
|
<li><a href="dashboard.html"><i class="fa fa-home" aria-hidden="true" style="font-size: 24px;"></i> Home</a></li>
|
|
<li><a href="#" class="myBtn" onclick="saveFile()" id="SaveButton"><i class="fa fa-floppy-o" aria-hidden="true" style="font-size: 20px;"></i> Save</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mobile-menu-area d-sm-block d-md-block d-lg-none ">
|
|
<div class="mobile-menu">
|
|
<nav class="itsoft_menu">
|
|
<ul class="nav_scroll">
|
|
<li><a href="dashboard.html"><i class="fa fa-home" aria-hidden="true" style="font-size: 24px;"></i> Home</a></li>
|
|
<li><a href="#" class="myBtn" onclick="saveFile()" id="SaveButton2"><i class="fa fa-floppy-o" aria-hidden="true" style="font-size: 20px;"></i> Save</a></li>
|
|
</ul>
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!-- QuestionPapper Container start -->
|
|
<div class="container" style=" margin-top: 6%; max-width: 75%;">
|
|
|
|
<!-- QuestionPapper Start -->
|
|
<div class="row section QuestionPaperClass" id="QuestionPaper">
|
|
|
|
<!-- QuestionPapper Title Start-->
|
|
|
|
<div class="question-papper-title element" style="border-top: solid; margin-bottom: 15px;">
|
|
<input type="hidden" id="QuestionPaper_UUID_ID">
|
|
<div class="col-lg-12 col-md-12">
|
|
<div class="row">
|
|
<div class="col-lg-12 col-md-12">
|
|
<div class="form_box" id="RTEID">
|
|
<label>Question Paper Title:</label>
|
|
<div class="richText" id="Question_title" contenteditable="true" style=" border: 2px solid #EEECFE; margin-top: 4px; color: black;"></div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-12 col-md-12">
|
|
<div class="form_box">
|
|
<label>Description:</label>
|
|
<div class="richText" id="Question_description" contenteditable="true" style=" border: 2px solid #EEECFE; margin-top: 4px; color: black;"></div>
|
|
</div>
|
|
</div>
|
|
<!-- Meta Datas -->
|
|
<div class="col-lg-3 col-md-3">
|
|
<div class="form_box">
|
|
<label>Max Marks:</label>
|
|
<input class="MetaData" id="Max_Marks" style="margin-top: -5px;">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3 col-md-3">
|
|
<div class="form_box">
|
|
<label>Course ID:</label>
|
|
<input class="MetaData" placeholder="" id="Course_ID" style="margin-top: -5px;">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3 col-md-3">
|
|
<div class="form_box">
|
|
<label>Course Code:</label>
|
|
<input class="MetaData" placeholder="" id="Course_Code" style="margin-top: -5px;">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3 col-md-3">
|
|
<div class="form_box">
|
|
<label>Subject ID:</label>
|
|
<input class="MetaData" placeholder="" id="Subject_ID" style="margin-top: -5px;">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3 col-md-3">
|
|
<div class="form_box">
|
|
<label>Subject Code:</label>
|
|
<input class="MetaData" placeholder="" id="Subject_Code" style="margin-top: -5px;">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3 col-md-3">
|
|
<div class="form_box">
|
|
<label>Paper No:</label>
|
|
<input class="MetaData" placeholder="" id="Paper_No" style="margin-top: -5px;">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3 col-md-3">
|
|
<div class="form_box">
|
|
<label>Subject Name:</label>
|
|
<input class="MetaData" placeholder="" id="Subject_Name" style="margin-top: -5px;">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3 col-md-3">
|
|
<div class="form_box">
|
|
<label>Sub Paper Prefix:</label>
|
|
<input class="MetaData" id="Sub_Paper_Prefix" style="margin-top: -5px;">
|
|
</div>
|
|
</div>
|
|
<!-- Meta Datas -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- QuestionPapper Title End-->
|
|
|
|
<!-- QuestionPallete start -->
|
|
<div class="question-pallete" id="question_pallete_id">
|
|
|
|
<!--Add new section area-->
|
|
<div id="addNewSection"></div>
|
|
|
|
</div>
|
|
<!-- QuestionPallete End -->
|
|
|
|
</div>
|
|
<!-- QuestionPapper End -->
|
|
|
|
</div>
|
|
<!-- QuestionPapper Container End -->
|
|
|
|
|
|
<div class="copy-right-area">
|
|
<div class="copy-left">
|
|
<span style="color: #533dfd;">© 2023 Project-B. All rights reserved.</span>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- jquery js -->
|
|
<!-- <script src="assets/js/vendor/jquery-3.2.1.min.js"></script> -->
|
|
<script src="./node_modules/jquery/dist/jquery.min.js" onload="window.$ = window.jQuery = module.exports;"></script>
|
|
<!-- bootstrap js -->
|
|
<script src="assets/js/bootstrap.min.js"></script>
|
|
<!-- carousel js -->
|
|
<script src="assets/js/owl.carousel.min.js"></script>
|
|
<!-- counterup js -->
|
|
<script src="assets/js/jquery.counterup.min.js"></script>
|
|
<!-- waypoints js -->
|
|
<script src="assets/js/waypoints.min.js"></script>
|
|
<!-- wow js -->
|
|
<script src="assets/js/wow.js"></script>
|
|
<!-- imagesloaded js -->
|
|
<script src="assets/js/imagesloaded.pkgd.min.js"></script>
|
|
<!-- venobox js -->
|
|
<script src="venobox/venobox.js"></script>
|
|
<!-- ajax mail js -->
|
|
<!-- <script src="assets/js/ajax-mail.js"></script> -->
|
|
<!-- animated-text js -->
|
|
<script src="assets/js/animated-text.js"></script>
|
|
<!-- venobox min js -->
|
|
<script src="venobox/venobox.min.js"></script>
|
|
<!-- isotope js -->
|
|
<script src="assets/js/isotope.pkgd.min.js"></script>
|
|
<!-- jquery nivo slider pack js -->
|
|
<script src="assets/js/jquery.nivo.slider.pack.js"></script>
|
|
<!-- jquery meanmenu js -->
|
|
<script src="assets/js/jquery.meanmenu.js"></script>
|
|
<script src="assets/js/popper.min.js"></script>
|
|
<!-- jquery scrollup js -->
|
|
<script src="assets/js/jquery.scrollUp.js"></script>
|
|
<!-- theme js -->
|
|
<script src="assets/js/theme.js"></script>
|
|
<script src="assets/js/jquery.barfiller.js"></script>
|
|
|
|
<!-- HTML TO JSON TO XML TO JSON TO HTML SCRIPTS -->
|
|
<script src="json2xml.js"></script>
|
|
<script src="html2json.js"></script>
|
|
<script src="xml2json.js"></script>
|
|
<script src="json2html.js"></script>
|
|
|
|
<!-- SAVE the QUESTIONPAPER to XML SCRIPT -->
|
|
<script src="savexml.js"></script>
|
|
<script src="json2nav.js"></script>
|
|
|
|
<!-- RTC Hide and Show Script -->
|
|
<script src="rtc_hide_and_show.js"></script>
|
|
|
|
|
|
<script>
|
|
|
|
$(document).ready(function() {
|
|
|
|
$('.ql-toolbar').hide(); // Hide the Quill Text Editor if PAge load
|
|
|
|
if(FileName == "" || FileName == null ) {
|
|
var random_no = Date.now();
|
|
addSection(false, false, random_no, false, false, false, false); //Call the Default section on the QUestion paper
|
|
}else {
|
|
loadXML(FileName); //send filename to read xml files to using this function
|
|
}
|
|
|
|
})
|
|
|
|
|
|
$(document).on("click", function (event) {
|
|
|
|
var questionPaperDiv = $(".QuestionPaperClass");
|
|
if (!questionPaperDiv.is(event.target) && questionPaperDiv.has(event.target).length === 0) {
|
|
$('.ql-toolbar').hide();
|
|
}
|
|
|
|
});
|
|
|
|
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
const scrollToTopBtn = document.getElementById('SaveButton');
|
|
const scrollToTopBtn2 = document.getElementById('SaveButton2');
|
|
|
|
// Function to keep the cursor at its current position
|
|
function keepCursorAtPosition(event) {
|
|
event.preventDefault(); // Prevent the default button click behavior
|
|
}
|
|
|
|
// Add a click event listener to the button
|
|
scrollToTopBtn.addEventListener('click', keepCursorAtPosition);
|
|
scrollToTopBtn2.addEventListener('click', keepCursorAtPosition);
|
|
});
|
|
|
|
|
|
const url = new URL(window.location.href);// Get the URL of the current page for JSON
|
|
const params = new URLSearchParams(url.search);// Create a URLSearchParams object from the query string
|
|
const FileName = params.get('filename');// Get the value of a specific parameter
|
|
|
|
// Function to load XML from a file
|
|
function loadXML(xmlFileName) {
|
|
return new Promise((resolve, reject) => {
|
|
fs.readFile('xml/'+xmlFileName, 'utf8', (error, data) => {
|
|
if (error) {
|
|
reject(error);
|
|
} else {
|
|
resolve(data);
|
|
xml2json(data);
|
|
}
|
|
});
|
|
});
|
|
}
|
|
|
|
// Function for Save the XML File
|
|
function saveFile() {
|
|
|
|
html2json();
|
|
json2xml();
|
|
|
|
if(FileName == "" || FileName == null ){
|
|
|
|
setTimeout(promptBox, 1000);
|
|
|
|
}else{
|
|
|
|
const newFileName = FileName.split(".")[0];
|
|
savexml(newFileName);
|
|
|
|
}
|
|
|
|
};
|
|
|
|
</script>
|
|
|
|
|
|
<script>
|
|
|
|
const { v4: uuidv4 } = require('uuid');
|
|
const Quill = require('quill');
|
|
|
|
const Question_Paper_UUID = uuidv4();
|
|
var QuestionPaper_UUID = document.getElementById('QuestionPaper_UUID_ID')
|
|
QuestionPaper_UUID.value = Question_Paper_UUID;
|
|
|
|
|
|
var toolbarOptions = [
|
|
['bold', 'italic', 'underline', 'strike'],
|
|
[{ 'script': 'sub'}, { 'script': 'super' }],
|
|
[{ 'header': [1, 2, 3, 4, 5, 6, false] }],
|
|
['image'],
|
|
];
|
|
|
|
var toolbarOptions2 = [
|
|
['bold', 'italic', 'underline'],
|
|
[{ 'script': 'sub'}, { 'script': 'super' }],
|
|
['image'],
|
|
];
|
|
|
|
var quill = new Quill('#Question_title', {
|
|
theme: 'snow',
|
|
modules: {
|
|
toolbar: toolbarOptions
|
|
},
|
|
});
|
|
|
|
var quill = new Quill('#Question_description', {
|
|
theme: 'snow',
|
|
modules: {
|
|
toolbar: toolbarOptions,
|
|
clipboard: {
|
|
matchVisual: true,
|
|
}
|
|
},
|
|
});
|
|
|
|
var Question_title_Div = $("#Question_title");
|
|
var Question_title_previousDiv = Question_title_Div.prev();
|
|
Question_title_previousDiv.attr("id", "Question_title_rtc");
|
|
var setitem = 'Question_title_rtc';
|
|
$('#Question_title').click(function() {
|
|
|
|
rtc_hide_and_show(setitem);
|
|
|
|
});
|
|
|
|
var Question_description_Div = $("#Question_description");
|
|
var Question_description_previousDiv = Question_description_Div.prev();
|
|
Question_description_previousDiv.attr("id", "Question_description_rtc");
|
|
var questionDescriptionRtc = 'Question_description_rtc';
|
|
$('#Question_description').click(function() {
|
|
|
|
rtc_hide_and_show(questionDescriptionRtc);
|
|
|
|
});
|
|
|
|
|
|
var inputElement2 = document.getElementById('Question_title');
|
|
inputElement2.addEventListener("keyup", function(event) {
|
|
|
|
json2nav();
|
|
});
|
|
// json2nav();
|
|
// html2json();
|
|
|
|
|
|
|
|
var i = 0;
|
|
//Function for Create a New Section in the Question Paper
|
|
function addSection(title = false, description = false, random_no = false, section_uuid = false, section_marks = false, sectionDispalyMarks = false, sectionAttemptAny = false)
|
|
{
|
|
const Section_UUID = uuidv4();
|
|
var addsection = "";
|
|
const text_field_created_time = Date.now();
|
|
// Initialize i with 0
|
|
|
|
var sectionRandomID = "";
|
|
if(random_no)
|
|
{
|
|
sectionRandomID = random_no;
|
|
}
|
|
else
|
|
{
|
|
sectionRandomID = text_field_created_time;
|
|
}
|
|
|
|
|
|
i = i + 1;
|
|
addsection +=
|
|
`<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>
|
|
<!-- Add a space character here -->
|
|
Section:${i}
|
|
</div>
|
|
<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_${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="row question element" style="border-top : 15px solid">
|
|
<div class="col-lg-12 col-md-12">
|
|
<div class="form_box">
|
|
<label>Section:</label>
|
|
<div class="richText" id="section_title_text_${random_no == false ? text_field_created_time : random_no}" contenteditable="true" style="border: 2px solid #EEECFE; margin-top: 4px;">${title ? title : ''}</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-12 col-md-12">
|
|
<div class="form_box">
|
|
<label>Description:</label>
|
|
<div class="richText" id="section_description_text_${random_no == false ? text_field_created_time : random_no}" contenteditable="true" style="border: 2px solid #EEECFE; margin-top: 4px;">${title ? description : ''}</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<span>Display Marks</span>
|
|
<label class="switch">
|
|
<input type="checkbox" id="Section_Display_Marks_Id_${random_no == false ? text_field_created_time : random_no}" checked>
|
|
<span class="slider round"></span>
|
|
</label>
|
|
|
|
<div class="col-lg-0 col-md-0"></div>
|
|
<div class="col-lg-4 col-md-4 hideondrag text" style="margin-left:215px;" >
|
|
<div class="form_box">
|
|
<div style="margin-left: 35px"> Attempt Any : </div>
|
|
<input type="text" id="Section_Attempt_Any_Id_${sectionRandomID}" value="${sectionAttemptAny !== false ? sectionAttemptAny : 0}">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-8 col-md-8"></div>
|
|
<div class="col-lg-4 col-md-4 hideondrag text">
|
|
<div class="form_box" style="margin-top: -58px;">
|
|
<div style="margin-left: 80px"> Marks : </div>
|
|
<input type="text" id="Section_Marks_Id_${sectionRandomID}" value="${section_marks !== false ? section_marks : "0"}" disabled>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-12 col-md-12">
|
|
<div class="section-question-area" id="question_area_${random_no == false ? text_field_created_time : random_no}">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-lg-10 col-md-12">
|
|
<div class="button-group align-items-center">
|
|
<div class="form-button addButton">
|
|
<button type="submit" onclick="addNewQuestions(event)" id="addNewButton_${sectionRandomID}">+Add New</button>
|
|
<button type="submit" style="display: none;" onclick="addNewQuestions(event, 1)" id="textButton_${sectionRandomID}">Text</button>
|
|
<button type="submit" style="display: none;" onclick="addNewQuestions(event, 2)" id="choiseButton_${sectionRandomID}">Choice</button>
|
|
<button type="submit" style="display: none;" onclick="addSection()" id="sectionButton_${sectionRandomID}">Section</button>
|
|
<button type="submit" style="display: none;" onclick="addNewGroupQuestions(event, 0)" id="groupQuestionButton_${sectionRandomID}">QuestionGroup</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
var formContainer = document.getElementById('addNewSection');
|
|
formContainer.insertAdjacentHTML('beforeend', addsection);
|
|
|
|
var addNewButtonId = 'addNewButton_' + sectionRandomID;
|
|
var SectionButtonId = 'sectionButton_' + sectionRandomID;
|
|
var textButtonId = 'textButton_' + sectionRandomID;
|
|
var ChoiseButtonId = 'choiseButton_' + sectionRandomID;
|
|
var groupQuestionButtonId = 'groupQuestionButton_' + sectionRandomID;
|
|
|
|
|
|
$('#'+addNewButtonId).on('click', function() {
|
|
|
|
$('#'+SectionButtonId).toggle();
|
|
$('#'+textButtonId).toggle();
|
|
$('#'+ChoiseButtonId).toggle();
|
|
$('#'+groupQuestionButtonId).toggle();
|
|
})
|
|
|
|
$(textButtonId).on('click', function()
|
|
{
|
|
$('#'+SectionButtonId).hide();
|
|
$('#'+textButtonId).hide();
|
|
$('#'+ChoiseButtonId).hide();
|
|
$('#'+groupQuestionButtonId).hide();
|
|
});
|
|
$(ChoiseButtonId).on('click', function()
|
|
{
|
|
$('#'+SectionButtonId).hide();
|
|
$('#'+textButtonId).hide();
|
|
$('#'+ChoiseButtonId).hide();
|
|
$('#'+groupQuestionButtonId).hide();
|
|
});
|
|
$('#'+SectionButtonId).on('click', function()
|
|
{
|
|
$('#'+SectionButtonId).hide();
|
|
$('#'+textButtonId).hide();
|
|
$('#'+ChoiseButtonId).hide();
|
|
$('#'+groupQuestionButtonId).hide();
|
|
});
|
|
$('#'+groupQuestionButtonId).on('click', function()
|
|
{
|
|
$('#'+SectionButtonId).hide();
|
|
$('#'+textButtonId).hide();
|
|
$('#'+ChoiseButtonId).hide();
|
|
$('#'+groupQuestionButtonId).hide();
|
|
});
|
|
|
|
$(document).on("click", function (event) {
|
|
|
|
var questionPaperDiv = $(".QuestionPaperClass");
|
|
if (!questionPaperDiv.is(event.target) && questionPaperDiv.has(event.target).length === 0) {
|
|
$('#'+SectionButtonId).hide();
|
|
$('#'+textButtonId).hide();
|
|
$('#'+ChoiseButtonId).hide();
|
|
$('#'+groupQuestionButtonId).hide();
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
var collapseSectionId = (random_no == false) ? 'collapseSection_' + text_field_created_time : 'collapseSection_' + random_no;
|
|
var contentId = (random_no == false) ? 'question_area_' + text_field_created_time : 'question_area_' + random_no;
|
|
var sessionTitleId = (random_no == false) ? 'section_title_' + text_field_created_time : 'section_title_' + random_no;
|
|
|
|
var collapseSection = document.getElementById(collapseSectionId);
|
|
var content = document.getElementById(contentId);
|
|
var sessionTitle = document.getElementById(sessionTitleId);
|
|
var addNewButtonId = 'addNewButton_' + (random_no == false ? text_field_created_time : random_no);
|
|
var addNewButton = document.getElementById(addNewButtonId);
|
|
|
|
$(document).ready(function () {
|
|
$('#' + collapseSectionId).on('click', function () {
|
|
if (content.style.display === 'none' || content.style.display === '') {
|
|
content.style.display = 'block';
|
|
sessionTitle.style.display = 'block';
|
|
addNewButton.style.display = 'block';
|
|
$(this).removeClass('fa-angle-up').addClass('fa-angle-down');
|
|
} else {
|
|
content.style.display = 'none';
|
|
sessionTitle.style.display = 'none';
|
|
addNewButton.style.display = 'none';
|
|
$(this).removeClass('fa-angle-down').addClass('fa-angle-up');
|
|
}
|
|
});
|
|
});
|
|
|
|
var sectionText = (random_no == false) ? 'section_title_text_' + text_field_created_time : 'section_title_text_' + random_no;
|
|
var quill = new Quill('#'+sectionText, {
|
|
theme: 'snow',
|
|
modules: {
|
|
toolbar: toolbarOptions
|
|
},
|
|
|
|
});
|
|
|
|
var sectionDescription = (random_no == false) ? 'section_description_text_' + text_field_created_time : 'section_description_text_' + random_no;
|
|
var quill = new Quill('#'+sectionDescription, {
|
|
theme: 'snow',
|
|
modules: {
|
|
toolbar: toolbarOptions
|
|
},
|
|
});
|
|
|
|
var section_title_Div = (random_no == false) ? 'section_title_text_' + text_field_created_time : 'section_title_text_' + random_no;
|
|
var NewRTEId = (random_no == false) ? 'section_title_rtc_' + text_field_created_time : 'section_title_rtc_' + random_no;
|
|
var section_title_previousDiv = $('#'+section_title_Div).prev();
|
|
section_title_previousDiv.attr("id", NewRTEId);
|
|
$('#'+section_title_Div).click(function() {
|
|
|
|
rtc_hide_and_show(NewRTEId);
|
|
|
|
});
|
|
|
|
var section_description_Div = (random_no == false) ? 'section_description_text_' + text_field_created_time : 'section_description_text_' + random_no;
|
|
var NewRTEId2 = (random_no == false) ? 'section_description_rtc_' + text_field_created_time : 'section_description_rtc_' + random_no;
|
|
var section_description_previousDiv = $('#'+section_description_Div).prev();
|
|
section_description_previousDiv.attr("id", NewRTEId2);
|
|
$('#'+section_description_Div).click(function() {
|
|
|
|
rtc_hide_and_show(NewRTEId2);
|
|
|
|
});
|
|
|
|
$(section_description_previousDiv).hide();
|
|
$(section_title_previousDiv).hide();
|
|
|
|
|
|
var sectionID = 'section_title_text_' + sectionRandomID;
|
|
var inputElement = document.getElementById(sectionID);
|
|
|
|
inputElement.addEventListener("keyup", function(event) {
|
|
|
|
json2nav();
|
|
|
|
});
|
|
|
|
|
|
var DisplayMark_RawID = 'Section_Display_Marks_Id_' + sectionRandomID
|
|
var DisplayMark_ID = document.getElementById(DisplayMark_RawID)
|
|
console.log(DisplayMark_ID)
|
|
|
|
if(sectionDispalyMarks === 'true'){
|
|
|
|
DisplayMark_ID.checked = true;
|
|
}else{
|
|
DisplayMark_ID.checked = false;
|
|
}
|
|
|
|
|
|
// var Section_Attempt_Any_raw_Id = 'Section_Attempt_Any_Id_' + sectionRandomID;
|
|
// var Section_Attempt_Any_Id = document.getElementById(Section_Attempt_Any_raw_Id)
|
|
|
|
// var Section_Marks_raw_Id = 'Section_Marks_Id_' + sectionRandomID;
|
|
// var Section_Marks_Id = document.getElementById(Section_Marks_raw_Id)
|
|
|
|
// console.log(Section_Marks_Id);
|
|
|
|
// $(Section_Attempt_Any_Id).keyup(function() {
|
|
// var inputValue = $(this).val();
|
|
|
|
// if(inputValue == "")
|
|
// {
|
|
|
|
// $(Section_Marks_Id).prop("disabled", true);
|
|
// }
|
|
// else{
|
|
|
|
// $(Section_Marks_Id).prop("disabled", false);
|
|
|
|
// }
|
|
|
|
// });
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
//Function for Create a New Question Group
|
|
function addQuestionGroup(question_group_id = false, QuestionGroupTitle = false, QuestionGroupDescription = false, questionType = false, random_no = false, question_area_id = false, questionRandomNo = false, QuestionGroupMarks = false, QuestionGroupUUID = false, add_question_group_id = false, QuestionGroupDisplayMarks = false, QuestionGroupAttemptAny = false)
|
|
{
|
|
const QuestionGroup_UUID = uuidv4();
|
|
|
|
var addQuestionGroup = "";
|
|
const text_field_created_time = Date.now();
|
|
|
|
var QuestionGroup_ID = "";
|
|
if(questionRandomNo)
|
|
{
|
|
QuestionGroup_ID = questionRandomNo;
|
|
}
|
|
else
|
|
{
|
|
QuestionGroup_ID = text_field_created_time;
|
|
}
|
|
|
|
addQuestionGroup +=
|
|
`<div draggable='true' class="draggable-group hidedrag" id="draggedGroup_${questionRandomNo == false ? text_field_created_time : questionRandomNo}">
|
|
<i id="collapseSubSection_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" aria-hidden="true" style=" font-size: 24px; margin-right: 9px; margin-top: 25px;"></i>
|
|
<input type="hidden" id="Question_Group_UUID_ID_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" value="${QuestionGroupUUID == false ? QuestionGroup_UUID : QuestionGroupUUID}">
|
|
<div class="groupsection" draggable='true' id="group_question_${questionRandomNo == false ? text_field_created_time : questionRandomNo}">
|
|
<div class="sectionTitle" id="group_question_title_${questionRandomNo == false ? text_field_created_time : questionRandomNo}">
|
|
|
|
<div class="col-lg-12 col-md-12">
|
|
|
|
<div class="row question element" style="border-top: 10px solid #a658f3; border-radius:10px; margin-top:5px;">
|
|
<div id="dragHandle" class="drag-handle">
|
|
<i class="fas fa-grip-horizontal"></i>
|
|
</div>
|
|
<div class="col-lg-12 col-md-12">
|
|
<div class="form_box">
|
|
<label>Quesions Group:</label>
|
|
<div class="richText" id="subSection_title_text_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" contenteditable="true" style=" border: 2px solid #EEECFE; margin-top: 4px;">${QuestionGroupTitle ? QuestionGroupTitle : ""}</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-12 col-md-12 hideondrag">
|
|
<div class="form_box">
|
|
<label>Quesions Group Description:</label>
|
|
<div class="richText" id="subSection_description_text_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" contenteditable="true" style=" border: 2px solid #EEECFE; margin-top: 4px;">${QuestionGroupDescription ? QuestionGroupDescription : ""}</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<span>Display Marks</span>
|
|
<label class="switch">
|
|
<input type="checkbox" id="Question_Group_Display_Marks_Id_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" checked>
|
|
<span class="slider round"></span>
|
|
</label>
|
|
|
|
<div class="col-lg-0 col-md-0"></div>
|
|
<div class="col-lg-4 col-md-4 hideondrag text" style="margin-left:215px;">
|
|
<div class="form_box">
|
|
<div style="margin-left: 35px;"> Attempt Any : </div>
|
|
<input type="text" id="Question_Attempt_Any_Id_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" value="${QuestionGroupAttemptAny !== false ? QuestionGroupAttemptAny : 0}">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-8 col-md-8"></div>
|
|
<div class="col-lg-4 col-md-4 hideondrag text">
|
|
<div class="form_box" style="margin-top: -55px;">
|
|
<div style="margin-left: 80px;"> Marks : </div>
|
|
<input type="text" id="Question_Group_Marks_Id_${QuestionGroup_ID}" value="${QuestionGroupMarks !== false ? QuestionGroupMarks : "0"}">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-12 col-md-12 ">
|
|
<div class="nested-sortable" id="group_question_area_${questionRandomNo == false ? text_field_created_time : questionRandomNo}"></div>
|
|
</div>
|
|
<div class="row " >
|
|
<div class="col-lg-8 col-md-12">
|
|
<div class="button-group align-items-center">
|
|
<div class="form-button addButton">
|
|
<button type="submit" id="addNewButtonSectionQroup_${questionRandomNo == false ? text_field_created_time : questionRandomNo}">Insert Question</button>
|
|
<button type="submit" style="display: none;" onclick="addNewGroupQuestions(event, 1)" id="textButtonSectionQroup_${questionRandomNo == false ? text_field_created_time : questionRandomNo}">Text</button>
|
|
<button type="submit" style="display: none;" onclick="addNewGroupQuestions(event, 2)" id="choiseButtonSectionQroup_${questionRandomNo == false ? text_field_created_time : questionRandomNo}">Choice</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
if(question_group_id)
|
|
{
|
|
var formContainer = document.getElementById(question_group_id);
|
|
formContainer.insertAdjacentHTML('beforeend', addQuestionGroup);
|
|
}
|
|
else if(question_area_id)
|
|
{
|
|
var formContainer = document.getElementById(question_area_id);
|
|
formContainer.insertAdjacentHTML('beforeend', addQuestionGroup);
|
|
}
|
|
else if(add_question_group_id)
|
|
{
|
|
var formContainer = document.getElementById(add_question_group_id);
|
|
formContainer.insertAdjacentHTML('beforeend', addQuestionGroup);
|
|
}
|
|
|
|
var addNewButtonId = (questionRandomNo == false) ? 'addNewButtonSectionQroup_' + text_field_created_time : 'addNewButtonSectionQroup_' + questionRandomNo;
|
|
var textButtonId = (questionRandomNo == false) ? 'textButtonSectionQroup_' + text_field_created_time : 'textButtonSectionQroup_' + questionRandomNo;
|
|
var ChoiseButtonId = (questionRandomNo == false) ? 'choiseButtonSectionQroup_' + text_field_created_time : 'choiseButtonSectionQroup_' + questionRandomNo;
|
|
var GroupQuestionButtonId = (questionRandomNo == false) ? 'QuestionGroupButton_' + text_field_created_time : 'QuestionGroupButton_' + questionRandomNo;
|
|
|
|
$('#'+addNewButtonId).on('click', function() {
|
|
|
|
$('#'+textButtonId).toggle();
|
|
$('#'+ChoiseButtonId).toggle();
|
|
$('#'+GroupQuestionButtonId).toggle();
|
|
})
|
|
|
|
$('#'+textButtonId).on('click', function()
|
|
{
|
|
$('#'+textButtonId).hide();
|
|
$('#'+ChoiseButtonId).hide();
|
|
$('#'+GroupQuestionButtonId).hide();
|
|
});
|
|
$('#'+ChoiseButtonId).on('click', function()
|
|
{
|
|
$('#'+textButtonId).hide();
|
|
$('#'+ChoiseButtonId).hide();
|
|
$('#'+GroupQuestionButtonId).hide();
|
|
});
|
|
$('#'+GroupQuestionButtonId).on('click', function()
|
|
{
|
|
$('#'+textButtonId).hide();
|
|
$('#'+ChoiseButtonId).hide();
|
|
$('#'+GroupQuestionButtonId).hide();
|
|
});
|
|
|
|
var subSectionText = (questionRandomNo == false) ? 'subSection_title_text_' + text_field_created_time : 'subSection_title_text_' + questionRandomNo;
|
|
var quill = new Quill('#'+subSectionText, {
|
|
theme: 'snow', // Choose a theme (snow, bubble, etc.)
|
|
modules: {
|
|
toolbar: toolbarOptions
|
|
},
|
|
});
|
|
|
|
var subSectionDescription = (questionRandomNo == false) ? 'subSection_description_text_' + text_field_created_time : 'subSection_description_text_' + questionRandomNo;
|
|
var quill = new Quill('#'+subSectionDescription, {
|
|
theme: 'snow', // Choose a theme (snow, bubble, etc.)
|
|
modules: {
|
|
toolbar: toolbarOptions
|
|
},
|
|
});
|
|
|
|
|
|
|
|
var sub_section_title_Div = (questionRandomNo == false) ? 'subSection_title_text_' + text_field_created_time : 'subSection_title_text_' + questionRandomNo;
|
|
var NewRTEId = (questionRandomNo == false) ? 'subsection_title_rtc_' + text_field_created_time : 'subsection_title_rtc_' + questionRandomNo;
|
|
var sub_section_title_previousDiv = $('#'+sub_section_title_Div).prev();
|
|
sub_section_title_previousDiv.attr("id", NewRTEId);
|
|
$('#'+sub_section_title_Div).click(function() {
|
|
|
|
rtc_hide_and_show(NewRTEId)
|
|
|
|
});
|
|
|
|
|
|
var sub_section_description_Div = (questionRandomNo == false) ? 'subSection_description_text_' + text_field_created_time : 'subSection_description_text_' + questionRandomNo;
|
|
var NewRTEId2 = (questionRandomNo == false) ? 'subsection_description_rtc_' + text_field_created_time : 'subsection_description_rtc_' + questionRandomNo;
|
|
var sub_section_description_previousDiv = $('#'+sub_section_description_Div).prev();
|
|
sub_section_description_previousDiv.attr("id", NewRTEId2);
|
|
$('#'+sub_section_description_Div).click(function() {
|
|
|
|
rtc_hide_and_show(NewRTEId2)
|
|
|
|
});
|
|
$(sub_section_description_previousDiv).hide();
|
|
$(sub_section_title_previousDiv).hide();
|
|
|
|
|
|
|
|
var question_groupid = 'subSection_title_text_'+ QuestionGroup_ID;
|
|
var inputElement = document.getElementById(question_groupid);
|
|
inputElement.addEventListener("keyup", function(event) {
|
|
|
|
json2nav();
|
|
|
|
});
|
|
|
|
|
|
var DisplayMark_RawID = "Question_Group_Display_Marks_Id_" + QuestionGroup_ID;
|
|
var DisplayMark_ID = document.getElementById(DisplayMark_RawID)
|
|
console.log(DisplayMark_ID)
|
|
|
|
if(QuestionGroupDisplayMarks === 'true'){
|
|
|
|
DisplayMark_ID.checked = true;
|
|
}else{
|
|
DisplayMark_ID.checked = false;
|
|
}
|
|
|
|
// json2nav();
|
|
// html2json();
|
|
|
|
}
|
|
|
|
//Function for Create a New Choice Question in the Section and Question Group
|
|
function groupQuestion( question_id = false, section_id = false , group_question_area_id = false, questionTitle = false, questionDescription = false, questionType = false, questionSubType = false, mathEnabled = false, Choice = false, random_no = false, questionGroupId = false, questionAreaId = false, questionRandomNo = false, QuestionGroupRandomNo = false, questionMarks = false, questionUUID = false, group_question_marks = false, group_question_uuid = false)
|
|
{
|
|
|
|
const ChoiceGroupFixed_UUID = uuidv4();
|
|
|
|
var groupQuestion = "";
|
|
const text_field_created_time = Date.now();// random number for dynamic ID - using current date time
|
|
|
|
var addChoiceAreaId = ""
|
|
if(questionRandomNo)
|
|
{
|
|
addChoiceAreaId = questionRandomNo;
|
|
}
|
|
else if(QuestionGroupRandomNo)
|
|
{
|
|
addChoiceAreaId = QuestionGroupRandomNo;
|
|
}
|
|
else
|
|
{
|
|
addChoiceAreaId = text_field_created_time;
|
|
}
|
|
|
|
localStorage.setItem('ChoiceId', addChoiceAreaId)
|
|
|
|
var marks = ""
|
|
if(questionMarks)
|
|
{
|
|
marks = questionMarks;
|
|
}
|
|
else if(group_question_marks)
|
|
{
|
|
marks = group_question_marks;
|
|
}
|
|
else
|
|
{
|
|
marks = 0;
|
|
}
|
|
|
|
var UUID = "";
|
|
if(questionUUID)
|
|
{
|
|
UUID = questionUUID;
|
|
}
|
|
else if(group_question_marks)
|
|
{
|
|
UUID = group_question_uuid;
|
|
}
|
|
else
|
|
{
|
|
const ChoiceQuestion_UUID = uuidv4();
|
|
UUID = ChoiceQuestion_UUID;
|
|
}
|
|
|
|
|
|
|
|
groupQuestion +=
|
|
`<div class="row question hidedrag element Question-Border-Top" draggable="true" id="removeAndCloneQroupQuestion_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" style="border-top: solid; margin-bottom: 15px; margin-top: -37px;" onclick="toggleClasses(this)">
|
|
<div id="dragHandle" class="drag-handle">
|
|
<i class="fas fa-grip-horizontal"></i>
|
|
</div>
|
|
<div class="items hideondrag" style="display: none;">
|
|
<i class="fa fa-trash-o" onclick="removeClonedQroupQuestion(${questionRandomNo == false ? text_field_created_time : questionRandomNo})" style="font-size:20px;"aria-hidden="true"></i>
|
|
<i class="fa fa-clone" id="cloneId_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" onclick="cloneQuestion(event, 2)" style="font-size:20px;" aria-hidden="true"></i>
|
|
</div>
|
|
<div class="col-lg-12 col-md-12">
|
|
<input type="hidden" id="Choice_Question_UUID_ID_${addChoiceAreaId}" value="${UUID}">
|
|
<div class="row">
|
|
<div class="col-lg-12 col-md-12">
|
|
<div class="form_box">
|
|
<label>Question:</label>
|
|
<div class="richText" id="textQuestionName_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" contenteditable="true" style=" border: 2px solid #EEECFE; margin-top: 4px;">${questionType == 'group' ? questionTitle : ''}</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-12 col-md-12 hideondrag" style="margin-bottom: 50px">
|
|
<div class="form_box">
|
|
<label>Subtitle:</label>
|
|
<div class="richText" id="textQuestionSubtitle_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" contenteditable="true" style=" border: 2px solid #EEECFE; margin-top: 4px;">${questionType == 'group' ? questionDescription : ''}</div>
|
|
<math-field id="textQuestionSubtitle_math_${addChoiceAreaId}" contenteditable="true">${mathEnabled == 'true' ? questionDescription : ''}</math-field>
|
|
</div>
|
|
</div>
|
|
|
|
<input type="hidden" id="Choice_Group_Fixed_UUID_ID_${addChoiceAreaId}" value="${Choice == false ? ChoiceGroupFixed_UUID : Choice[0].id}">
|
|
<div class="col-lg-9 col-md-4 hideondrag" id="newChoiceGroup_${questionRandomNo == false ? text_field_created_time : questionRandomNo}">
|
|
<div class="choice row align-items-center" id="deleteChoice_${questionRandomNo == false ? text_field_created_time : questionRandomNo}">
|
|
<div class="col-lg-0"><input type="radio" id="radioButton_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" checked></div>
|
|
<div class="col-lg-6">
|
|
<div class="richText" id="choiceTextField_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" contenteditable="true" style=" border: 2px solid #EEECFE; width: 127%; margin-top: 10px;">${Choice ? Choice[0].choice_name : ""}</div>
|
|
<math-field id="choiceTextField_math_${addChoiceAreaId}" style="width: 127%;" contenteditable="true">${Choice ? Choice[0].choice_name : ""}</math-field>
|
|
</div>
|
|
<div class="items2 col-lg-4" style="margin-left: 50px;">
|
|
<i class="fa fa-commenting-o" style="font-size:20px;" aria-hidden="true" id="commentButton_${questionRandomNo == false ? text_field_created_time : questionRandomNo}"></i>
|
|
<i class="fa fa-trash-o" style="font-size:20px;" aria-hidden="true" id="deleteButton_${questionRandomNo == false ? text_field_created_time : questionRandomNo}"></i>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form_box">
|
|
<input type="text" id="commentField_${addChoiceAreaId}" placeholder="Message for those who choose this" style="margin-left: 60px; width: 307px; display: none;" value="${Choice ? Choice[0].choice_description : ""}">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-12 col-md-12 hideondrag" >
|
|
<div id="addChoiceArea_`+addChoiceAreaId+`"></div>
|
|
</div>
|
|
<div class="col-lg-9 col-md-4 hideondrag" style="margin-left:70px;">
|
|
<i class="fa fa-plus" aria-hidden="true" id="addChoiceButton_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" onclick="ConstructAddNewChoiceID(event)"></i>
|
|
</div>
|
|
|
|
<div class="col-lg-8 col-md-8"></div>
|
|
<div class="col-lg-4 col-md-4 hideondrag text">
|
|
<div class="form_box">
|
|
<div style="margin-left: 80px;"> Marks : </div>
|
|
<input type="text" placeholder="" id="Choice_Question_Marks_Id_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" value="${marks}"></input>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="type1-switch align-items-center hideondrag" style="display: none;">
|
|
<input type="hidden" value="group" id="question_type_${questionRandomNo == false ? text_field_created_time : questionRandomNo}">
|
|
|
|
<span>Display Marks</span>
|
|
<label class="switch">
|
|
<input type="checkbox" id="Choice_Question_Display_Marks_Id_${addChoiceAreaId}" checked>
|
|
<span class="slider round"></span>
|
|
</label>
|
|
|
|
<span>Math</span>
|
|
<label class="switch">
|
|
<input type="checkbox" id="math_${addChoiceAreaId}">
|
|
<span class="slider round"></span>
|
|
</label>
|
|
|
|
|
|
<span>Multiple Answer</span>
|
|
<label class="switch hideondrag" >
|
|
<input type="checkbox" id="multipleAnswer_${questionRandomNo == false ? text_field_created_time : questionRandomNo}">
|
|
<span class="slider round"></span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>`;
|
|
|
|
if(question_id && !section_id)
|
|
{
|
|
|
|
var questionDiv = document.getElementById(question_id);
|
|
questionDiv.insertAdjacentHTML('afterend', groupQuestion);
|
|
}
|
|
else if(section_id)
|
|
{
|
|
|
|
var sectionDiv = document.getElementById(section_id);
|
|
sectionDiv.insertAdjacentHTML('beforeend', groupQuestion);
|
|
|
|
}
|
|
else if(questionGroupId)
|
|
{
|
|
|
|
var sectionDiv = document.getElementById(questionGroupId);
|
|
sectionDiv.insertAdjacentHTML('beforeend', textQuestion);
|
|
|
|
}
|
|
else if(questionAreaId)
|
|
{
|
|
|
|
var sectionDiv = document.getElementById(questionAreaId);
|
|
sectionDiv.insertAdjacentHTML('beforeend', groupQuestion);
|
|
|
|
}
|
|
else if(group_question_area_id)
|
|
{
|
|
|
|
var sectionDiv = document.getElementById(group_question_area_id);
|
|
sectionDiv.insertAdjacentHTML('beforeend', groupQuestion);
|
|
}
|
|
|
|
|
|
var commentButtonId = (questionRandomNo == false) ? 'commentButton_' + text_field_created_time : 'commentButton_' + questionRandomNo;
|
|
var commentFieldId = (questionRandomNo == false) ? 'commentField_' + text_field_created_time : 'commentField_' + questionRandomNo;
|
|
var imageButtonId = (questionRandomNo == false) ? 'imageButton_' + text_field_created_time : 'imageButton_' + questionRandomNo;
|
|
var imageInputId = (questionRandomNo == false) ? 'imageInput_' + text_field_created_time : 'imageInput_' + questionRandomNo;
|
|
var deleteButtonId = (questionRandomNo == false) ? 'deleteButton_' + text_field_created_time : 'deleteButton_' + questionRandomNo;
|
|
var deleteChoiceId = (questionRandomNo == false) ? 'deleteChoice_' + text_field_created_time : 'deleteChoice_' + questionRandomNo;
|
|
|
|
|
|
var ChoiceMathSwitch = 'math_'+addChoiceAreaId;
|
|
var textQuestionSubtitle_math = 'textQuestionSubtitle_math_'+addChoiceAreaId;
|
|
var textQuestionSubtitle = 'textQuestionSubtitle_'+addChoiceAreaId;
|
|
var choiceTextField_math = 'choiceTextField_math_'+addChoiceAreaId;
|
|
var choiceTextField = 'choiceTextField_'+addChoiceAreaId;
|
|
|
|
var ChoiceMathSwitchId = document.getElementById(ChoiceMathSwitch)
|
|
var textQuestionSubtitle_mathId = document.getElementById(textQuestionSubtitle_math)
|
|
var textQuestionSubtitleId = document.getElementById(textQuestionSubtitle)
|
|
var choiceTextField_math_Id = document.getElementById(choiceTextField_math)
|
|
var choiceTextFieldId = document.getElementById(choiceTextField)
|
|
|
|
|
|
if (mathEnabled === 'true')
|
|
{
|
|
|
|
ChoiceMathSwitchId.checked = true;
|
|
$(textQuestionSubtitleId).hide();
|
|
$(textQuestionSubtitle_previousDiv).hide();
|
|
$(textQuestionSubtitle_mathId).show();
|
|
$(choiceTextFieldId).hide();
|
|
$(choiceTextField_previousDiv).hide();
|
|
$(choiceTextField_math_Id).show();
|
|
|
|
}
|
|
else
|
|
{
|
|
|
|
ChoiceMathSwitchId.checked = false;
|
|
$(textQuestionSubtitleId).show();
|
|
$(textQuestionSubtitle_mathId).hide();
|
|
$(choiceTextFieldId).show();
|
|
$(choiceTextField_math_Id).hide();
|
|
}
|
|
|
|
|
|
|
|
ChoiceMathSwitchId.addEventListener("change", function() {
|
|
|
|
if (ChoiceMathSwitchId.checked) {
|
|
$(textQuestionSubtitle_mathId).show();
|
|
$(textQuestionSubtitleId).hide();
|
|
$(textQuestionSubtitle_previousDiv).hide();
|
|
$(choiceTextFieldId).hide();
|
|
$(choiceTextField_previousDiv).hide();
|
|
$(choiceTextField_math_Id).show();
|
|
} else {
|
|
$(textQuestionSubtitleId).show();
|
|
$(textQuestionSubtitle_mathId).hide();
|
|
$(choiceTextFieldId).show();
|
|
$(choiceTextField_math_Id).hide();
|
|
}
|
|
});
|
|
|
|
|
|
// if(Choice[0].choice_description !== 'undefined' ){
|
|
|
|
|
|
// $('#'+commentFieldId).css('display', 'block');
|
|
|
|
// }else {
|
|
|
|
// $('#'+commentFieldId).css('display', 'none');
|
|
|
|
// }
|
|
|
|
|
|
|
|
$('#'+commentButtonId).on('click', function() {
|
|
|
|
$('#'+commentFieldId).toggle();
|
|
|
|
})
|
|
|
|
$('#'+imageButtonId).on('click', function() {
|
|
|
|
$('#'+imageInputId).click();
|
|
|
|
})
|
|
$('#'+deleteButtonId).on('click', function() {
|
|
|
|
$('#'+deleteChoiceId).hide();
|
|
$('#'+commentFieldId).hide();
|
|
})
|
|
|
|
|
|
var typetwoQuestionName = (questionRandomNo == false) ? 'textQuestionName_' + text_field_created_time : 'textQuestionName_' + questionRandomNo;
|
|
|
|
var quill = new Quill('#'+typetwoQuestionName, {
|
|
theme: 'snow',
|
|
modules: {
|
|
toolbar: toolbarOptions
|
|
},
|
|
});
|
|
|
|
var typetwoQuestionSubtitle = (questionRandomNo == false) ? 'textQuestionSubtitle_' + text_field_created_time : 'textQuestionSubtitle_' + questionRandomNo;
|
|
var quill = new Quill('#'+typetwoQuestionSubtitle, {
|
|
theme: 'snow',
|
|
modules: {
|
|
toolbar: toolbarOptions
|
|
},
|
|
});
|
|
|
|
var choiceTextField = (questionRandomNo == false) ? 'choiceTextField_' + text_field_created_time : 'choiceTextField_' + questionRandomNo;
|
|
var quill = new Quill('#'+choiceTextField, {
|
|
theme: 'snow',
|
|
modules: {
|
|
toolbar: toolbarOptions2
|
|
},
|
|
placeholder: 'Enter Choice',
|
|
});
|
|
|
|
var textQuestionName_Div = (questionRandomNo == false) ? 'textQuestionName_' + text_field_created_time : 'textQuestionName_' + questionRandomNo;
|
|
var textQuestionNewRTEId = (questionRandomNo == false) ? 'typeTwotextQuestionName_rtc_' + text_field_created_time : 'typeTwotextQuestionName_rtc_' + questionRandomNo;
|
|
var textQuestionName_previousDiv = $('#'+textQuestionName_Div).prev();
|
|
textQuestionName_previousDiv.attr("id", textQuestionNewRTEId);
|
|
$('#'+textQuestionName_Div).click(function() {
|
|
|
|
rtc_hide_and_show(textQuestionNewRTEId);
|
|
|
|
});
|
|
|
|
|
|
var textQuestionSubtitle_Div = (questionRandomNo == false) ? 'textQuestionSubtitle_' + text_field_created_time : 'textQuestionSubtitle_' + questionRandomNo;
|
|
var textQuestionSubtitleNewRTEId = (questionRandomNo == false) ? 'typeTwotextQuestionSubtitle_rtc_' + text_field_created_time : 'typeTwotextQuestionSubtitle_rtc_' + questionRandomNo;
|
|
var textQuestionSubtitle_previousDiv = $('#'+textQuestionSubtitle_Div).prev();
|
|
textQuestionSubtitle_previousDiv.attr("id", textQuestionSubtitleNewRTEId);
|
|
$('#'+textQuestionSubtitle_Div).click(function() {
|
|
|
|
rtc_hide_and_show(textQuestionSubtitleNewRTEId);
|
|
|
|
});
|
|
|
|
var choiceTextField_Div = (questionRandomNo == false) ? 'choiceTextField_' + text_field_created_time : 'choiceTextField_' + questionRandomNo;
|
|
var choiceTextNewRTEId = (questionRandomNo == false) ? 'choiceTextField_rtc_' + text_field_created_time : 'choiceTextField_rtc_' + questionRandomNo;
|
|
var choiceTextField_previousDiv = $('#'+choiceTextField_Div).prev();
|
|
choiceTextField_previousDiv.attr("id", choiceTextNewRTEId);
|
|
$('#'+choiceTextField_Div).click(function() {
|
|
|
|
rtc_hide_and_show(choiceTextNewRTEId);
|
|
|
|
});
|
|
$(textQuestionName_previousDiv).hide();
|
|
$(textQuestionSubtitle_previousDiv).hide();
|
|
$(choiceTextField_previousDiv).hide();
|
|
|
|
|
|
// var choiceid = 'textQuestionName_'+ addChoiceAreaId;
|
|
// var inputElement = document.getElementById(choiceid);
|
|
// inputElement.addEventListener("keyup", function(event) {
|
|
|
|
// json2nav();
|
|
|
|
// });
|
|
|
|
// json2nav();
|
|
// html2json();
|
|
|
|
}
|
|
|
|
//Function for Create a New Choice Field in a Choice Question
|
|
function addNewChoice(NewaddChoiceAreaId = false , choiceName = false, choiceDescription = false, random_no = false, questionRandomNo = false, QuestionGroupRandomNo = false, choiceID = false)
|
|
{
|
|
|
|
const Choice_Group_Dynamic_UUID = uuidv4();
|
|
|
|
addChoice = "";
|
|
const text_field_created_time = Date.now();
|
|
var rnd_no = Math.random();
|
|
|
|
addChoice +=
|
|
`<div class="col-lg-9 col-md-4" id="newChoiceGroup_`+text_field_created_time+rnd_no+`" style="padding-left: 0; ">
|
|
<input type="hidden" id="Choice_Group_Dynamic_UUID_ID_`+text_field_created_time+rnd_no+`" value="${choiceID == false ? Choice_Group_Dynamic_UUID : choiceID}">
|
|
<div class="choice row align-items-center" id="newDeleteChoice_`+text_field_created_time+rnd_no+`">
|
|
<div class="col-lg-0"><input type="radio" id="newChoiceRadioButton_`+text_field_created_time+rnd_no+`" checked ></div>
|
|
<div class="col-lg-6">
|
|
<div class="richText" id="newChoiceTextField_`+text_field_created_time+rnd_no+`" contenteditable="true" style=" border: 2px solid #EEECFE; width: 129%; margin-top: 10px;">${choiceName ? choiceName : ""}</div>
|
|
<math-field id="newchoiceTextField_math_`+text_field_created_time+rnd_no+`" style="width: 129%; display: none;" contenteditable="true" >${choiceName ? choiceName : ""}</math-field>
|
|
</div>
|
|
<div class="items2 col-lg-4" style="margin-left: 54px;">
|
|
<i class="fa fa-commenting-o" style="font-size:20px;" aria-hidden="true" id="newChoiceCommentButton_`+text_field_created_time+rnd_no+`"></i>
|
|
<i class="fa fa-trash-o" style="font-size:20px;" aria-hidden="true" id="newChoiceDeleteButton_`+text_field_created_time+rnd_no+`"></i>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form_box">
|
|
<input type="text" id="newChoiceCommentField_`+text_field_created_time+rnd_no+`" placeholder="Message for those who choose this" style="margin-left: 60px; width: 307px; display: none;" value = "${choiceDescription ? choiceDescription : ""}">
|
|
</div>
|
|
</div>`
|
|
|
|
if(questionRandomNo)
|
|
{
|
|
var addChoiceAreaId = 'addChoiceArea_'+questionRandomNo;
|
|
var addChoiceAreaId2 = document.getElementById(addChoiceAreaId);
|
|
addChoiceAreaId2.insertAdjacentHTML('beforeend', addChoice);
|
|
}
|
|
else if(QuestionGroupRandomNo)
|
|
{
|
|
var addChoiceAreaRandomNo = 'addChoiceArea_'+QuestionGroupRandomNo;
|
|
var addChoiceAreaId = document.getElementById(addChoiceAreaRandomNo);
|
|
addChoiceAreaId.insertAdjacentHTML('beforeend', addChoice);
|
|
}
|
|
else if(NewaddChoiceAreaId)
|
|
{
|
|
NewaddChoiceAreaId.insertAdjacentHTML('beforeend', addChoice);
|
|
}
|
|
|
|
|
|
var newChoiceCommentButtonId = document.getElementById('newChoiceCommentButton_'+text_field_created_time+rnd_no);
|
|
var newChoiceCommentFieldId = document.getElementById('newChoiceCommentField_'+text_field_created_time+rnd_no);
|
|
var newChoiceImageButtonId = document.getElementById('newChoiceImageButton_'+text_field_created_time+rnd_no);
|
|
var newChoiceImageInputId = document.getElementById('newChoiceImageInput_'+text_field_created_time+rnd_no);
|
|
var newChoiceDeleteButtonId = document.getElementById('newChoiceDeleteButton_'+text_field_created_time+rnd_no);
|
|
var newDeleteChoiceId = document.getElementById('newDeleteChoice_'+text_field_created_time+rnd_no);
|
|
|
|
|
|
var choiceid = localStorage.getItem('ChoiceId')
|
|
var ChoiceMathSwitch = 'math_'+choiceid;
|
|
|
|
var ChoiceMathSwitchId = document.getElementById(ChoiceMathSwitch)
|
|
var newchoiceTextField_math_Id = document.getElementById('newchoiceTextField_math_'+text_field_created_time+rnd_no);
|
|
var newchoiceTextFieldId = document.getElementById('newChoiceTextField_'+text_field_created_time+rnd_no);
|
|
|
|
|
|
$(newchoiceTextField_math_Id).hide();
|
|
ChoiceMathSwitchId.addEventListener("change", function() {
|
|
|
|
if (ChoiceMathSwitchId.checked) {
|
|
|
|
$(newchoiceTextFieldId).hide();
|
|
$(newchoiceTextField_math_Id).show();
|
|
|
|
} else {
|
|
|
|
$(newchoiceTextFieldId).show();
|
|
$(newchoiceTextField_math_Id).hide();
|
|
}
|
|
});
|
|
|
|
if (ChoiceMathSwitchId.checked) {
|
|
|
|
$(newchoiceTextFieldId).hide();
|
|
$(newchoiceTextField_math_Id).show();
|
|
|
|
} else {
|
|
|
|
$(newchoiceTextFieldId).show();
|
|
$(newchoiceTextField_math_Id).hide();
|
|
}
|
|
|
|
|
|
// if(choiceDescription !== 'undefined' || choiceDescription !== '' || choiceDescription !== null){
|
|
|
|
// console.log(newChoiceCommentFieldId)
|
|
// $(newChoiceCommentFieldId).css('display', 'block');
|
|
|
|
// }else {
|
|
|
|
// $(newChoiceCommentFieldId).css('display', 'none');
|
|
|
|
// }
|
|
|
|
|
|
$(newChoiceCommentButtonId).on('click', function() {
|
|
|
|
$(newChoiceCommentFieldId).toggle();
|
|
|
|
})
|
|
|
|
$(newChoiceImageButtonId).on('click', function() {
|
|
|
|
$(newChoiceImageInputId).click();
|
|
|
|
})
|
|
$(newChoiceDeleteButtonId).on('click', function() {
|
|
|
|
$(newDeleteChoiceId).hide();
|
|
$(newChoiceCommentFieldId).hide();
|
|
})
|
|
|
|
|
|
|
|
var newChoiceTextField = document.getElementById('newChoiceTextField_'+text_field_created_time+rnd_no);
|
|
var quill = new Quill(newChoiceTextField, {
|
|
theme: 'snow',
|
|
modules: {
|
|
toolbar: toolbarOptions2
|
|
},
|
|
placeholder: 'Enter Choice',
|
|
});
|
|
|
|
|
|
var newchoiceFieldId = 'newChoiceTextField_'+text_field_created_time+rnd_no;
|
|
var newchoiceTextField_Div = document.getElementById(newchoiceFieldId);
|
|
var newchoiceTextField_previousDiv = $(newchoiceTextField_Div).prev();
|
|
var newChoiceTextNewRTEId = "newChoiceTextField_rtc_"+text_field_created_time+rnd_no;
|
|
newchoiceTextField_previousDiv.attr("id", newChoiceTextNewRTEId);
|
|
|
|
|
|
newchoiceTextField_Div.addEventListener('click', function() {
|
|
|
|
var id = localStorage.getItem('rtc');
|
|
var hideid = document.getElementById(id);
|
|
console.log('hide id :' + hideid)
|
|
$(hideid).hide();
|
|
$(newchoiceTextField_previousDiv).show();
|
|
console.log('show id :'+newchoiceTextField_previousDiv)
|
|
localStorage.setItem('rtc',newChoiceTextNewRTEId);
|
|
|
|
});
|
|
$(newchoiceTextField_previousDiv).hide();
|
|
|
|
|
|
}
|
|
|
|
//Function for Create a New Text Question in the Section and Question Group
|
|
function textQuestion(question_id = false, section_id = false, group_question_area_id = false, questionTitle = false, questionDescription = false, questionType = false, questionSubType = false, mathEnabled = false, random_no = false, questionGroupId = false, questionAreaId = false, questionRandomNo = false, QuestionGroupRandomNo = false, questionMarks = false, questionUUID = false, group_question_marks = false, group_question_uuid = false)
|
|
{
|
|
const Text_Question_UUID = uuidv4();
|
|
|
|
var textQuestion = "";
|
|
const text_field_created_time = Date.now();
|
|
|
|
var addTextQuestionId = ""
|
|
if(questionRandomNo)
|
|
{
|
|
addTextQuestionId = questionRandomNo;
|
|
}
|
|
else if(QuestionGroupRandomNo)
|
|
{
|
|
addTextQuestionId = QuestionGroupRandomNo;
|
|
}
|
|
else
|
|
{
|
|
addTextQuestionId = text_field_created_time;
|
|
}
|
|
|
|
|
|
|
|
var marks = ""
|
|
if(questionMarks)
|
|
{
|
|
marks = questionMarks;
|
|
}
|
|
else if(group_question_marks)
|
|
{
|
|
marks = group_question_marks;
|
|
}
|
|
else
|
|
{
|
|
marks = 0;
|
|
}
|
|
|
|
|
|
var UUID = "";
|
|
if(questionUUID)
|
|
{
|
|
UUID = questionUUID;
|
|
}
|
|
else if(group_question_marks)
|
|
{
|
|
UUID = group_question_uuid;
|
|
}
|
|
else
|
|
{
|
|
UUID = Text_Question_UUID;
|
|
}
|
|
|
|
|
|
textQuestion +=
|
|
`<div class="row question hidedrag element Question-Border-Top" draggable="true" id="removeAndCloneTextQuestion_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" style="border-top: 3px solid; margin-bottom: 15px; margin-top: -15px;" onclick="toggleClasses(this)">
|
|
<div id="dragHandle" class="drag-handle " >
|
|
<i class="fas fa-grip-horizontal"></i>
|
|
</div>
|
|
|
|
<div class="items align-items-center hideondrag" style="display: none;">
|
|
<i class="fa fa-trash-o" onclick="removeClonedTextQuestion(${questionRandomNo == false ? text_field_created_time : questionRandomNo})" style="font-size:20px;"aria-hidden="true"></i>
|
|
<i class="fa fa-clone" onclick="cloneQuestion(event, 1)" id="cloneId_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" style="font-size:20px;" aria-hidden="true"></i>
|
|
</div>
|
|
<div class="col-lg-12 col-md-12 ">
|
|
<input type="hidden" id="Text_Question_UUID_ID_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" value="${UUID}">
|
|
<div class="form_box">
|
|
<label>Question:</label>
|
|
<div type="text" class="richText" id="textQuestionName_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" contenteditable="true" style=" border: 2px solid #EEECFE; margin-top: 4px;">${questionType == 'text' ? questionTitle : ''}</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-12 col-md-12 hideondrag">
|
|
<div class="form_box">
|
|
<label>Subtitle:</label>
|
|
<div class="richText" id="textQuestionSubtitle_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" contenteditable="true" style=" border: 2px solid #EEECFE; margin-top: 4px;">${questionType == 'text' ? questionDescription : ''}</div>
|
|
<math-field id="textQuestionSubtitle_math_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" contenteditable="true">${mathEnabled == 'true' ? questionDescription : ''}</math-field>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-12 col-md-12 hideondrag">
|
|
<div class="form_box">
|
|
<input class="richText" type="text" placeholder="Enter your answer" id="textField_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" disabled>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-12 col-md-12 hideondrag">
|
|
<div class="form_box">
|
|
<textarea id="textarea_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" cols="20" rows="10" disabled>Enter Your Answer</textarea>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-8 col-md-8"></div>
|
|
|
|
<div class="col-lg-4 col-md-4 hideondrag text">
|
|
<div class="form_box">
|
|
<div style="margin-left: 80px;"> Marks : </div>
|
|
<input type="text" placeholder="" id="Text_Question_Marks_Id_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" value="${marks}"></input>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="type1-switch align-items-center hideondrag" style="display: none;">
|
|
<input type="hidden" value="text" id="question_type_${questionRandomNo == false ? text_field_created_time : questionRandomNo}">
|
|
|
|
|
|
<span>Display Marks</span>
|
|
<label class="switch">
|
|
<input type="checkbox" id="Text_Question_Display_Marks_Id_${questionRandomNo == false ? text_field_created_time : questionRandomNo}" checked>
|
|
<span class="slider round"></span>
|
|
</label>
|
|
|
|
<span>Math</span>
|
|
<label class="switch">
|
|
<input type="checkbox" value="1" id="math_${questionRandomNo == false ? text_field_created_time : questionRandomNo}">
|
|
<span class="slider round"></span>
|
|
</label>
|
|
|
|
<span>Long Answer</span>
|
|
<label class="switch">
|
|
<input type="checkbox" id="longAnswer_${questionRandomNo == false ? text_field_created_time : questionRandomNo}">
|
|
<span class="slider round"></span>
|
|
</label>
|
|
</div>
|
|
</div>`;
|
|
|
|
|
|
if(question_id && !section_id)
|
|
{
|
|
var questionDiv = document.getElementById(question_id);
|
|
questionDiv.insertAdjacentHTML('afterend', textQuestion);
|
|
}
|
|
else if(section_id)
|
|
{
|
|
var sectionDiv = document.getElementById(section_id);
|
|
sectionDiv.insertAdjacentHTML('beforeend', textQuestion);
|
|
}
|
|
else if(questionGroupId)
|
|
{
|
|
var sectionDiv = document.getElementById(questionGroupId);
|
|
sectionDiv.insertAdjacentHTML('beforeend', textQuestion);
|
|
}
|
|
else if(questionAreaId)
|
|
{
|
|
var sectionDiv = document.getElementById(questionAreaId);
|
|
sectionDiv.insertAdjacentHTML('beforeend', textQuestion);
|
|
}
|
|
else if(group_question_area_id)
|
|
{
|
|
var sectionDiv = document.getElementById(group_question_area_id);
|
|
sectionDiv.insertAdjacentHTML('beforeend', textQuestion);
|
|
}
|
|
|
|
|
|
var longAnswerRandomId = (questionRandomNo == false) ? 'longAnswer_' + text_field_created_time : 'longAnswer_' + questionRandomNo;
|
|
var textareaRandomId = (questionRandomNo == false) ? 'textarea_' + text_field_created_time : 'textarea_' + questionRandomNo;
|
|
var textFieldRandomId = (questionRandomNo == false) ? 'textField_' + text_field_created_time : 'textField_' + questionRandomNo;
|
|
|
|
var longAnswerId = document.getElementById(longAnswerRandomId);
|
|
var textareaId = document.getElementById(textareaRandomId);
|
|
var textFieldId = document.getElementById(textFieldRandomId);
|
|
|
|
// Hide and show of text and textare using switch long answer
|
|
$(textareaId).hide();
|
|
$(longAnswerId).on("change", function() {
|
|
if (longAnswerId.checked) {
|
|
$(textareaId).show();
|
|
$(textFieldId).hide();
|
|
} else {
|
|
$(textareaId).hide();
|
|
$(textFieldId).show();
|
|
}
|
|
});
|
|
|
|
|
|
var ChoiceMathSwitch = (questionRandomNo == false) ? 'math_' + text_field_created_time : 'math_' + questionRandomNo;
|
|
var textQuestionSubtitle_math = (questionRandomNo == false) ? 'textQuestionSubtitle_math_' + text_field_created_time : 'textQuestionSubtitle_math_' + questionRandomNo;
|
|
var textQuestionSubtitle = (questionRandomNo == false) ? 'textQuestionSubtitle_' + text_field_created_time : 'textQuestionSubtitle_' + questionRandomNo;
|
|
|
|
var ChoiceMathSwitchId = document.getElementById(ChoiceMathSwitch)
|
|
var textQuestionSubtitle_mathId = document.getElementById(textQuestionSubtitle_math)
|
|
var textQuestionSubtitleId = document.getElementById(textQuestionSubtitle)
|
|
|
|
|
|
if (mathEnabled === 'true')
|
|
{
|
|
|
|
ChoiceMathSwitchId.checked = true;
|
|
$(textQuestionSubtitleId).hide();
|
|
$(textQuestionSubtitle_previousDiv).hide();
|
|
$(textQuestionSubtitle_mathId).show();
|
|
}
|
|
else
|
|
{
|
|
|
|
ChoiceMathSwitchId.checked = false;
|
|
$(textQuestionSubtitleId).show();
|
|
$(textQuestionSubtitle_mathId).hide();
|
|
}
|
|
|
|
|
|
ChoiceMathSwitchId.addEventListener("change", function() {
|
|
|
|
if (ChoiceMathSwitchId.checked) {
|
|
$(textQuestionSubtitle_mathId).show();
|
|
$(textQuestionSubtitleId).hide();
|
|
$(textQuestionSubtitle_previousDiv).hide();
|
|
} else {
|
|
$(textQuestionSubtitleId).show();
|
|
$(textQuestionSubtitle_mathId).hide();
|
|
}
|
|
});
|
|
|
|
|
|
|
|
var typeOneQuestionName = (questionRandomNo == false) ? 'textQuestionName_' + text_field_created_time : 'textQuestionName_' + questionRandomNo;
|
|
var quill = new Quill('#'+typeOneQuestionName, {
|
|
theme: 'snow',
|
|
modules: {
|
|
toolbar: toolbarOptions
|
|
},
|
|
|
|
});
|
|
|
|
var typeOneQuestionSubtitle = (questionRandomNo == false) ? 'textQuestionSubtitle_' + text_field_created_time : 'textQuestionSubtitle_' + questionRandomNo;
|
|
var quill = new Quill('#'+typeOneQuestionSubtitle, {
|
|
theme: 'snow',
|
|
modules: {
|
|
toolbar: toolbarOptions
|
|
},
|
|
});
|
|
|
|
|
|
var textQuestionName_Div = (questionRandomNo == false) ? 'textQuestionName_' + text_field_created_time : 'textQuestionName_' + questionRandomNo;
|
|
var textQuestionNewRTEId = (questionRandomNo == false) ? 'typeOnetextQuestionName_rtc_' + text_field_created_time : 'typeOnetextQuestionName_rtc_' + questionRandomNo;
|
|
var textQuestionName_previousDiv = $('#'+textQuestionName_Div).prev();
|
|
textQuestionName_previousDiv.attr("id", textQuestionNewRTEId);
|
|
$('#'+textQuestionName_Div).click(function() {
|
|
|
|
rtc_hide_and_show(textQuestionNewRTEId);
|
|
});
|
|
|
|
|
|
var textQuestionSubtitle_Div = (questionRandomNo == false) ? 'textQuestionSubtitle_' + text_field_created_time : 'textQuestionSubtitle_' + questionRandomNo;
|
|
var textQuestionSubtitleNewRTEId = (questionRandomNo == false) ? 'typeOnetextQuestionSubtitle_rtc_' + text_field_created_time : 'typeOnetextQuestionSubtitle_rtc_' + questionRandomNo;
|
|
var textQuestionSubtitle_previousDiv = $('#'+textQuestionSubtitle_Div).prev();
|
|
textQuestionSubtitle_previousDiv.attr("id", textQuestionSubtitleNewRTEId);
|
|
$('#'+textQuestionSubtitle_Div).click(function() {
|
|
|
|
rtc_hide_and_show(textQuestionSubtitleNewRTEId);
|
|
|
|
});
|
|
|
|
$(textQuestionName_previousDiv).hide();
|
|
$(textQuestionSubtitle_previousDiv).hide();
|
|
|
|
|
|
var Textid = 'textQuestionName_'+ addTextQuestionId;
|
|
var inputElement = document.getElementById(Textid);
|
|
|
|
inputElement.addEventListener("keyup", function(event) {
|
|
json2nav();
|
|
});
|
|
|
|
//json2nav();
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
//Function for Add Group Question inside the Group QUestion Like Question
|
|
// function MultiLevelQuestionGroup(e)
|
|
// {
|
|
// get_question_area_id = e.target.id;
|
|
// console.log(get_question_area_id);
|
|
// var question_group_id = get_question_area_id.split("_")[1];
|
|
// var add_question_group_id = 'group_question_area_'+question_group_id;
|
|
// addQuestionGroup(false, false, false, false, false,false, false, false, false, add_question_group_id)
|
|
|
|
|
|
// }
|
|
|
|
//Function for Add a Text and Choice Question in the Section Question Area
|
|
function addNewQuestions(e, type)
|
|
{
|
|
clone_id_time = e.target.id;
|
|
var clone_id = clone_id_time.split("_")[1];
|
|
var section_id = 'question_area_'+clone_id;
|
|
|
|
if(type == 1){
|
|
textQuestion(false, section_id);
|
|
}else if(type == 2){
|
|
groupQuestion(false, section_id);
|
|
}
|
|
}
|
|
|
|
//Function For Add a Group Question in the Section Question Area
|
|
function addNewGroupQuestions(e, type)
|
|
{
|
|
clone_id_time = e.target.id;
|
|
var clone_id = clone_id_time.split("_")[1];
|
|
var group_question_area_id = 'group_question_area_'+clone_id;
|
|
|
|
if(type == 1){
|
|
textQuestion(false, false, group_question_area_id);
|
|
}else if(type == 2){
|
|
groupQuestion(false, false, group_question_area_id);
|
|
}else {
|
|
var question_group_id = 'question_area_'+clone_id;
|
|
addQuestionGroup(question_group_id);
|
|
}
|
|
}
|
|
|
|
//Function for Add Choice Field in the Choice Question Area
|
|
function ConstructAddNewChoiceID(e){
|
|
|
|
var addChoiceArea = e.target.id;
|
|
console.log(addChoiceArea);
|
|
var addChoiceAreaTime = addChoiceArea.split("_")[1];
|
|
var addChoiceAreaId = 'addChoiceArea_'+addChoiceAreaTime;
|
|
var addChoiceAreaId2 = document.getElementById(addChoiceAreaId);
|
|
addNewChoice(addChoiceAreaId2)
|
|
|
|
}
|
|
|
|
// create a text and group or choice type question function
|
|
function cloneQuestion(e,type)
|
|
{
|
|
clone_id_time = e.target.id;
|
|
var clone_id = clone_id_time.split("_")[1];
|
|
var question_id = "";
|
|
|
|
if(type == 1){
|
|
question_id = 'removeAndCloneTextQuestion_'+clone_id;
|
|
textQuestion(question_id);
|
|
}else{
|
|
question_id = 'removeAndCloneQroupQuestion_'+clone_id;
|
|
groupQuestion(question_id);
|
|
}
|
|
|
|
}
|
|
|
|
// remove the cloned text type questions function
|
|
function removeClonedTextQuestion(index)
|
|
{
|
|
var element = document.getElementById('removeAndCloneTextQuestion_'+ index);
|
|
if (element) {
|
|
element.remove();
|
|
}
|
|
}
|
|
|
|
// remove the cloned choice or group type questions function
|
|
function removeClonedQroupQuestion(index)
|
|
{
|
|
var element = document.getElementById('removeAndCloneQroupQuestion_'+ index);
|
|
if (element) {
|
|
element.remove();
|
|
}
|
|
}
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
let draggedItemGroup = null;
|
|
let draggedItemQuestion = null;
|
|
let dropTarget = null;
|
|
let richTextElements = null;
|
|
let questionLabels = null;
|
|
|
|
// Event listener for .draggable-group elements
|
|
document.addEventListener('mousedown', function (e) {
|
|
const dragHandle = e.target.closest('.drag-handle');
|
|
|
|
if (dragHandle) {
|
|
// If the click is inside a drag handle, find the corresponding .draggable-group
|
|
const draggableGroup = dragHandle.closest('.draggable-group');
|
|
|
|
if (draggableGroup) {
|
|
// Initiate the drag operation for the .draggable-group
|
|
draggedItemGroup = draggableGroup;
|
|
|
|
// Add a dragStart event listener to set data
|
|
draggedItemGroup.addEventListener('dragstart', function (e) {
|
|
e.dataTransfer.setData('text/plain', draggedItemGroup.id);
|
|
console.log(draggedItemGroup.id);
|
|
// Hide all elements with class "hideondrag"
|
|
richTextElements = document.querySelectorAll('.hideondrag');
|
|
richTextElements.forEach((element) => {
|
|
element.style.display = 'none';
|
|
});
|
|
});
|
|
}
|
|
}
|
|
});
|
|
|
|
// Event listener for .question elements
|
|
document.addEventListener('mousedown', function (e) {
|
|
const dragHandle = e.target.closest('.drag-handle');
|
|
|
|
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) {
|
|
e.preventDefault();
|
|
|
|
// Allow scrolling while dragging
|
|
if (e.clientY < 100) {
|
|
window.scrollBy(0, -20);
|
|
} else if (e.clientY > window.innerHeight - 100) {
|
|
window.scrollBy(0, 20);
|
|
}
|
|
|
|
// Highlight the closest .draggable-group element if it's the dragged item
|
|
if (draggedItemGroup) {
|
|
dropTarget = e.target.closest('.draggable-group');
|
|
if (dropTarget) {
|
|
dropTarget.classList.add('highlight');
|
|
}
|
|
}
|
|
|
|
// Highlight the closest .question element if it's the dragged item
|
|
if (draggedItemQuestion) {
|
|
dropTarget = e.target.closest('.question');
|
|
if (dropTarget) {
|
|
dropTarget.classList.add('highlight');
|
|
}
|
|
}
|
|
});
|
|
|
|
document.addEventListener('dragleave', function (e) {
|
|
// Remove the highlight class when leaving the drop target
|
|
if (dropTarget) {
|
|
dropTarget.classList.remove('highlight');
|
|
}
|
|
if (dropTarget.classList.contains('nodrop')) {
|
|
// Remove the highlight class when leaving the drop target
|
|
dropTarget.classList.remove('highlight');
|
|
}
|
|
});
|
|
|
|
|
|
document.addEventListener('dragend', function () {
|
|
// Remove the highlight class from all .draggable-group and .question elements
|
|
const highlightedElements = document.querySelectorAll('.draggable-group, .question');
|
|
highlightedElements.forEach((element) => {
|
|
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
|
|
if (richTextElements) {
|
|
richTextElements.forEach((element) => {
|
|
element.style.display = '';
|
|
});
|
|
}
|
|
|
|
dropTarget = null;
|
|
draggedItemGroup = null;
|
|
draggedItemQuestion = null;
|
|
});
|
|
|
|
document.addEventListener('drop', function (e) {
|
|
if (draggedItemGroup && dropTarget) {
|
|
e.preventDefault();
|
|
const rect = dropTarget.getBoundingClientRect();
|
|
const mouseY = e.clientY;
|
|
const isAfter = mouseY > rect.top + rect.height / 2;
|
|
if (isAfter) {
|
|
dropTarget.insertAdjacentElement('afterend', draggedItemGroup);
|
|
} else {
|
|
dropTarget.insertAdjacentElement('beforebegin', draggedItemGroup);
|
|
}
|
|
draggedItemGroup = null;
|
|
dropTarget = null;
|
|
} else if (draggedItemQuestion && dropTarget) {
|
|
e.preventDefault();
|
|
const rect = dropTarget.getBoundingClientRect();
|
|
const mouseY = e.clientY;
|
|
const isAfter = mouseY > rect.top + rect.height / 2;
|
|
if (isAfter) {
|
|
dropTarget.insertAdjacentElement('afterend', draggedItemQuestion);
|
|
} else {
|
|
dropTarget.insertAdjacentElement('beforebegin', draggedItemQuestion);
|
|
}
|
|
draggedItemQuestion = null;
|
|
dropTarget = null;
|
|
} else {
|
|
console.error('No dragged item or drop target found.');
|
|
}
|
|
});
|
|
</script>
|
|
|
|
|
|
<script>
|
|
// Store a reference to the currently displayed div
|
|
let currentlyDisplayedDiv = null;
|
|
|
|
function toggleClasses(element) {
|
|
const items = element.querySelector('.items');
|
|
const type1Switch = element.querySelector('.type1-switch');
|
|
|
|
if (items.style.display === 'none' || items !== currentlyDisplayedDiv) {
|
|
// Hide the previously displayed div if there is one
|
|
if (currentlyDisplayedDiv) {
|
|
currentlyDisplayedDiv.querySelector('.items').style.display = 'none';
|
|
currentlyDisplayedDiv.querySelector('.type1-switch').style.display = 'none';
|
|
}
|
|
|
|
// Show the clicked div
|
|
items.style.display = 'block';
|
|
type1Switch.style.display = 'block';
|
|
currentlyDisplayedDiv = element;
|
|
|
|
// Add a click event listener to the document body to hide the div when clicking outside
|
|
document.body.addEventListener('click', clickOutsideHandler);
|
|
} else {
|
|
// Hide the clicked div
|
|
items.style.display = 'none';
|
|
type1Switch.style.display = 'none';
|
|
currentlyDisplayedDiv = null;
|
|
|
|
// Remove the click event listener when hiding the div
|
|
document.body.removeEventListener('click', clickOutsideHandler);
|
|
}
|
|
}
|
|
|
|
function clickOutsideHandler(event) {
|
|
// Check if the click occurred outside of the currently displayed div
|
|
if (currentlyDisplayedDiv && !currentlyDisplayedDiv.contains(event.target)) {
|
|
currentlyDisplayedDiv.querySelector('.items').style.display = 'none';
|
|
currentlyDisplayedDiv.querySelector('.type1-switch').style.display = 'none';
|
|
currentlyDisplayedDiv = null;
|
|
|
|
// Remove the click event listener when hiding the div
|
|
document.body.removeEventListener('click', clickOutsideHandler);
|
|
}
|
|
}
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|