4105 lines
126 KiB
HTML
4105 lines
126 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<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>
|
|
|
|
|
|
<script src="assets/js/quill.js"></script>
|
|
<script src="assets/css/quill.snow.css"></script>
|
|
|
|
<script src="./node_modules/quill-image-resize-module/image-resize.min.js"></script>
|
|
|
|
<script src="./node_modules/quill-resize-module/dist/resize.js"></script>
|
|
<link rel="stylesheet" href="./node_modules/quill-resize-module/dist/resize.css">
|
|
|
|
<script src="https://html2canvas.hertzen.com/dist/html2canvas.min.js"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.6/clipboard.min.js"></script>
|
|
<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
|
|
<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
|
|
<style>
|
|
|
|
/* body { */
|
|
/* Ensure the body takes the full height of the viewport */
|
|
/* height: 100vh; */
|
|
/* Apply smooth transition for the zoom effect */
|
|
/* transition: transform 0.3s ease-in-out; */
|
|
/* Set transform origin to the top left corner to prevent content shifting */
|
|
/* transform-origin: top left; */
|
|
/* } */
|
|
|
|
.ql-align.ql-picker.ql-icon-picker{
|
|
margin-top: -10px;
|
|
}
|
|
|
|
#editPreview{
|
|
color: #7018d4;
|
|
}
|
|
#editPreview:hover {
|
|
color:#3399FF;
|
|
|
|
}
|
|
|
|
.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;
|
|
}
|
|
|
|
|
|
.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; */
|
|
color: transparent;
|
|
}
|
|
|
|
/* Show the icon when hovering over the parent element with .hidedrag */
|
|
.element:hover .drag-handle {
|
|
/* color: blueviolet; */
|
|
color: #BF303B;
|
|
}
|
|
|
|
body {
|
|
background-image: url('assets/images/bg1-1.png');
|
|
background-size: cover;
|
|
background-repeat: no-repeat;
|
|
background-attachment: fixed;
|
|
background-color: #00000073;
|
|
}
|
|
|
|
[contentEditable=true]:empty:not(:focus):before {
|
|
content: attr(data-text)
|
|
}
|
|
|
|
.highlight {
|
|
background-color: rgb(230, 221, 235);
|
|
}
|
|
|
|
/* 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;
|
|
background-color: transparent;
|
|
transition: height 0.5s ease;
|
|
}
|
|
|
|
|
|
math-field{
|
|
border-radius: 6px;
|
|
font-size:18px;
|
|
display: block;
|
|
color: #6d6d6d;
|
|
}
|
|
|
|
.buttons {
|
|
position: absolute;
|
|
top: 58px;
|
|
right: -185px;
|
|
float: right;
|
|
text-align: -webkit-right;
|
|
}
|
|
|
|
|
|
</style>
|
|
|
|
<style>
|
|
.arrow-down::before {
|
|
/* content: '\25BC'; */
|
|
content: '⮟';
|
|
margin-right: 5px;
|
|
}
|
|
.arrow-right::before {
|
|
/* content: '\25B6'; */
|
|
content: '⮞';
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.menu-symbol::before {
|
|
content: '\2715';/* Unicode character for the menu symbol (x) */
|
|
font-size: 25px;
|
|
/* position: absolute;
|
|
left: 4px;
|
|
top: 2px; */
|
|
}
|
|
.menu-symbol1::before {
|
|
content: '\2630'; /* Unicode character for the menu symbol (☰) */
|
|
font-size: 24px; /* Adjust the font size as needed */
|
|
}
|
|
a{
|
|
white-space: nowrap !important;
|
|
}
|
|
|
|
/* Style for the main headings */
|
|
.main-heading {
|
|
font-weight: bold;
|
|
}
|
|
|
|
/* Style for the collapsible content */
|
|
.content {
|
|
/* display: none; */
|
|
margin-left: 9px;
|
|
}
|
|
|
|
.content.visible {
|
|
display: block;
|
|
}
|
|
.nested {
|
|
border-left: 2px dotted #000;
|
|
margin-left: 10px;
|
|
padding-left: 10px;
|
|
}
|
|
|
|
|
|
#wrapper {
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
#sidebar-wrapper {
|
|
min-height: 100vh;
|
|
flex-basis:21%;
|
|
width:300px;
|
|
margin-left: -15rem;
|
|
transition: margin 0.25s ease-out;
|
|
background-color: #ffffff!important;
|
|
position: relative;
|
|
overflow-y: auto;
|
|
/* border-radius: 40px; */
|
|
}
|
|
|
|
#sidebar-wrapper~.container{
|
|
flex-basis:80%;
|
|
max-width:1024px;
|
|
}
|
|
|
|
#sidebar-wrapper .sidebar-heading {
|
|
padding: 0.875rem 1.25rem;
|
|
font-size: 1.2rem;
|
|
}
|
|
|
|
#sidebar-wrapper .list-group {
|
|
width: 15rem;
|
|
}
|
|
#questionPaper{
|
|
margin-top:65px;
|
|
overflow-y: auto;
|
|
overflow-x: clip;
|
|
max-height: 532px;
|
|
padding:0 10px 20px;
|
|
width: 285px;
|
|
height: -webkit-fill-available;
|
|
}
|
|
|
|
#questionPaper strong em{
|
|
font-weight: 100;
|
|
font-style: normal;
|
|
}
|
|
#questionPaper u{
|
|
text-decoration: none;
|
|
}
|
|
#questionPaper s{
|
|
text-decoration: none;
|
|
}
|
|
#questionPaper strong{
|
|
font-weight: 100;
|
|
}
|
|
#page-content-wrapper {
|
|
min-width: 100%;
|
|
}
|
|
|
|
body.sb-sidenav-toggled #wrapper #sidebar-wrapper {
|
|
margin-left: 0;
|
|
}
|
|
body.sb-sidenav-toggled #sidebar-wrapper~.container{
|
|
flex-basis:100%;
|
|
max-width:1140px;
|
|
}
|
|
|
|
@media (min-width: 100px) {
|
|
#sidebar-wrapper {
|
|
margin-left: 0;
|
|
}
|
|
#page-content-wrapper {
|
|
min-width: 0;
|
|
width: 100%;
|
|
}
|
|
body.sb-sidenav-toggled #wrapper #sidebar-wrapper {
|
|
margin-left: -19rem;
|
|
}
|
|
body.sb-sidenav-toggled #wrapper #sidebar-wrapper .sidebar-fixed{
|
|
left:-19rem;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
/* Reset default margin and padding for body and the wrapper */
|
|
body, #wrapper {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
/* Set the wrapper to flex layout */
|
|
#wrapper {
|
|
display: flex;
|
|
}
|
|
|
|
/* Style the sidebar */
|
|
|
|
.sidebar-content {
|
|
padding: 10px; /* Add padding to your content */
|
|
}
|
|
|
|
/* Style the main content area */
|
|
.main-content {
|
|
flex-grow: 1; /* Allow the main content to grow and fill the remaining space */
|
|
overflow-y: auto; /* Enable vertical scrolling for the main content */
|
|
}
|
|
|
|
.qP-style{
|
|
left:-300px!important;
|
|
}
|
|
|
|
/*navigation botton */
|
|
.menu-symbol1{
|
|
background-color: transparent;
|
|
position: fixed;
|
|
top:81px;
|
|
left: 10px;
|
|
border: none;
|
|
border-radius: 15%; /* Make the button round */
|
|
width: 40px; /* Set the width and height of the button */
|
|
height: 40px;
|
|
transition: box-shadow 0.3s, background-color 0.3s;
|
|
color: #bf303b;
|
|
/* background: #bf303b; */
|
|
}
|
|
.work-area{
|
|
background-color: transparent;
|
|
position: fixed;
|
|
top:81px;
|
|
right: 10px;
|
|
border: none;
|
|
border-radius: 15%; /* Make the button round */
|
|
width: 40px; /* Set the width and height of the button */
|
|
height: 40px;
|
|
transition: box-shadow 0.3s, background-color 0.3s;
|
|
color: #bf303b;
|
|
|
|
}
|
|
.work-area1{
|
|
background-color: transparent;
|
|
position: absolute;
|
|
top:-8px;
|
|
left:-18px;
|
|
border-width:0;
|
|
transform:rotate(58deg);
|
|
transition: box-shadow 0.3s, background-color 0.3s;
|
|
color: #bf303b;
|
|
|
|
}
|
|
.work-area1::before{
|
|
content: '\2BC7';
|
|
font-size: 24px;
|
|
}
|
|
.work-area::before{
|
|
content:'\2630';
|
|
}
|
|
.menu-symbol {
|
|
position:absolute;
|
|
right:0;
|
|
background-color: transparent;
|
|
margin-top: 14px;
|
|
border-radius: 20%;
|
|
width: 35px;
|
|
height: 35px;
|
|
color: #BF303B;
|
|
/* border: 2px solid #a09c9c; */
|
|
/* background: #BF303B; */
|
|
transition: box-shadow 0.3s, background-color 0.3s; /* Add a smooth transition to the shadow and background-color */
|
|
margin-right: -75px;
|
|
}
|
|
/* .menu-symbol {
|
|
position:absolute;
|
|
right:0;
|
|
background-color: transparent;
|
|
margin-top: 14px;
|
|
border: none;
|
|
border-radius: 50%;
|
|
width: 40px;
|
|
height: 40px;
|
|
transition: box-shadow 0.3s, background-color 0.3s;
|
|
} */
|
|
|
|
/* .menu-symbol:hover {
|
|
box-shadow: 0 0 10px rgba(0, 0, 0, 0);
|
|
background-color: #e4d3f8b4;
|
|
} */
|
|
|
|
|
|
</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;
|
|
}
|
|
|
|
|
|
li.popupbox{
|
|
color: black !important;
|
|
}
|
|
li.popupbox span{
|
|
color: #BF303B !important;
|
|
}
|
|
/* Styles for the popup container */
|
|
.popup {
|
|
display: none;
|
|
position: fixed;
|
|
background-color: #dfdfe5;
|
|
width: 30%;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
padding: 20px;
|
|
z-index: 2;
|
|
font-size: larger;
|
|
/* color: rgba(255, 0, 0) !important; */
|
|
color: darkred !important;
|
|
/* color: black !important; */
|
|
}
|
|
.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;
|
|
}
|
|
|
|
|
|
.main-header {
|
|
position: fixed!important;
|
|
top: 0!important;
|
|
width: 100%!important;
|
|
background-color: #fff!important;
|
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1)!important;
|
|
z-index: 999!important;
|
|
border-bottom: 2px solid #A8DADC !important;
|
|
}
|
|
|
|
.nav-menu {
|
|
margin-top: -9px!important;
|
|
}
|
|
|
|
.logo-d{
|
|
width: 150px!important;
|
|
padding-top: 10px !important;
|
|
}
|
|
|
|
.heder-menu ul li a {
|
|
font-weight: 400 !important;
|
|
color: #1d3557 !important;
|
|
}
|
|
.heder-menu ul li a:hover {
|
|
|
|
filter: invert(23%) sepia(67%) saturate(2476%) hue-rotate(335deg) brightness(89%) contrast(89%);
|
|
|
|
}
|
|
|
|
.heder-menu {
|
|
display: inline-block;
|
|
position: relative !important;
|
|
right: -15px !important;
|
|
}
|
|
/* a .addPageMenu:hover {.buttons
|
|
} */
|
|
|
|
|
|
h1.title{
|
|
font-size: 20px;
|
|
text-align: center;
|
|
font-weight: 400;
|
|
color: #1d3557;
|
|
padding-bottom: 10px;
|
|
}
|
|
</style>
|
|
<style>
|
|
body {
|
|
margin: 0;
|
|
font-family: 'Arial', sans-serif;
|
|
}
|
|
|
|
.sidebar {
|
|
height: 100%;
|
|
width: 0;
|
|
position: fixed;
|
|
top: 0;
|
|
right: 0;
|
|
background-color: #ffffff;
|
|
overflow-x: hidden;
|
|
transition: 0.5s;
|
|
padding-top: 60px;
|
|
z-index: 2;
|
|
border-left: 1px solid;
|
|
}
|
|
|
|
.chat-box {
|
|
padding: 20px;
|
|
color: white;
|
|
height: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-between;
|
|
position: relative;
|
|
z-index: 100;
|
|
}
|
|
|
|
#messages {
|
|
max-height: calc(100% - 60px);
|
|
overflow-y: auto;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
#messageForm {
|
|
margin-top: auto;
|
|
}
|
|
|
|
textarea {
|
|
height: 40px;
|
|
}
|
|
|
|
input {
|
|
flex: 1;
|
|
padding: 10px;
|
|
}
|
|
|
|
.message{
|
|
position: relative;
|
|
right: 85px;
|
|
}
|
|
|
|
button {
|
|
padding: 10px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
#sidebarToggle2 {
|
|
position: fixed;
|
|
top: 60px;
|
|
right: -7px;
|
|
font-size: 20px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.content {
|
|
margin-right: 0;
|
|
transition: margin-right 0.5s;
|
|
}
|
|
|
|
.sidebar-open .content {
|
|
margin-right: 250px;
|
|
}
|
|
|
|
.sidebar::before {
|
|
content: '\2BC7'; /* Unicode character for the close arrow (adjust as needed) */
|
|
position: absolute;
|
|
top: 10px;
|
|
left: 10px;
|
|
font-size: 24px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.work-area::before {
|
|
content: '\2BC7'; /* Unicode character for the open arrow (adjust as needed) */
|
|
font-size: 24px;
|
|
}
|
|
|
|
.worksection.ql-snow {
|
|
height: 100px;
|
|
overflow-y: scroll;
|
|
border-top: 1px solid #ccc !important;
|
|
}
|
|
mjx-container[jax="CHTML"][display="true"] {
|
|
text-align: left !important;
|
|
color: black;
|
|
}
|
|
.sendMessageButton{
|
|
display: inline-block;
|
|
color: #fff;
|
|
font-weight: 400;
|
|
padding: 2px 0px;
|
|
text-transform: capitalize;
|
|
transition: 0.5s;
|
|
font-size: 15px;
|
|
position: relative;
|
|
z-index: 1;
|
|
border-radius: 5px;
|
|
overflow: hidden;
|
|
/* margin-top: 5px; */
|
|
/* background: linear-gradient(to right,#533dfd,#730fd5); */
|
|
background: linear-gradient(to right,darkred, #BF303B);
|
|
border: none;
|
|
/* margin-right: 15px; */
|
|
width: 85px;
|
|
}
|
|
</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 class="nav-menu">
|
|
<div class="header-logo">
|
|
<a href="dashboard.html" ><img class="logo-d" src="assets/images/project-b-logo.png" alt=""></a>
|
|
</div>
|
|
|
|
<div class="heder-menu">
|
|
<ul>
|
|
<li><a href="dashboard.html"><img class="addPageMenu" src="assets/images/home.svg" alt="">Home</a></li>
|
|
<li><a href="#" class="myBtn" onclick="saveFile()" id="SaveButton"><img class="addPageMenu" src="assets/images/save.svg" alt="">Save</a></li>
|
|
<li><a href="#" id="editPreview" ><img class="addPageMenu" src="assets/images/preview.svg" alt="">Preview</a></li>
|
|
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<button class="menu-symbol1" id="sidebarToggle1"></button>
|
|
<button class="work-area"id="sidebarToggle2"></button>
|
|
<!-- QuestionPapper Container start -->
|
|
<div class="d-flex" id="wrapper">
|
|
<!-- Sidebar-->
|
|
<div class="border-end bg-white" id="sidebar-wrapper">
|
|
<div class="sidebar-fixed">
|
|
<i class="menu-symbol" id="sidebarToggle"></i>
|
|
<div id="questionPaper"></div>
|
|
</div>
|
|
</div>
|
|
<!-- sidebar end -->
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
// Initialize Quill with your specific configuration
|
|
var quill = new Quill('#workarea', {
|
|
theme: 'snow',
|
|
modules: {
|
|
toolbar: {
|
|
container: toolbarOptions,
|
|
clipboard: {
|
|
matchVisual: true,
|
|
},
|
|
ImageResize: {
|
|
displaySize: true,
|
|
modules: ['Resize', 'DisplaySize', 'Toolbar']
|
|
}
|
|
},
|
|
}
|
|
});
|
|
|
|
var chat_Div = $("#workarea");
|
|
var chat_previousDiv = chat_Div.prev();
|
|
chat_previousDiv.attr("id", "messageInput_rtc");
|
|
var chatRtc = 'messageInput_rtc';
|
|
|
|
$('#workarea').focus(function () {
|
|
rtc_hide_and_show(chatRtc);
|
|
});
|
|
|
|
document.getElementById('sidebarToggle2').addEventListener('click', function () {
|
|
var sidebar = document.getElementById('rightSidebar');
|
|
document.body.classList.toggle('sidebar-open');
|
|
if (sidebar.style.width === '250px') {
|
|
sidebar.style.width = '0';
|
|
} else {
|
|
sidebar.style.width = '250px';
|
|
}
|
|
});
|
|
|
|
document.getElementById('sidebarToggle3').addEventListener('click', function () {
|
|
var sidebar = document.getElementById('rightSidebar');
|
|
document.body.classList.toggle('sidebar-open');
|
|
if (sidebar.style.width === '250px') {
|
|
sidebar.style.width = '0';
|
|
} else {
|
|
sidebar.style.width = '250px';
|
|
}
|
|
});
|
|
|
|
document.getElementById('sendMessageButton').addEventListener('click', function () {
|
|
sendMessage(quill);
|
|
});
|
|
|
|
document.getElementById('workarea').addEventListener('keydown', function (event) {
|
|
if (event.key === 'Enter') {
|
|
event.preventDefault();
|
|
sendMessage(quill);
|
|
}
|
|
});
|
|
|
|
// Add Math functionality
|
|
var mathCheckbox = document.getElementById('Choicemath_messageInput');
|
|
var mathField = document.getElementById('workarea_math');
|
|
var richText = document.getElementById('workarea');
|
|
// Ensure MathQuill field is initially hidden
|
|
$(mathField).hide();
|
|
// $(richText1).show();
|
|
mathCheckbox.addEventListener('change', function () {
|
|
if (mathCheckbox.checked) {
|
|
$(mathField).show();
|
|
$(richText).hide();
|
|
rtc_hide_and_show(chatRtc);
|
|
} else {
|
|
$(mathField).hide();
|
|
$(richText).show();
|
|
rtc_hide_and_show(chatRtc);
|
|
}
|
|
});
|
|
|
|
// Initialize Math Field
|
|
var mathFieldId = 'workarea_math';
|
|
var mathFieldDiv = document.getElementById(mathFieldId);
|
|
var mathFieldPreviousDiv = $(mathFieldDiv).prev();
|
|
var mathRTEId = "workarea_math_rtc";
|
|
mathFieldPreviousDiv.attr("id", mathRTEId);
|
|
|
|
mathFieldDiv.addEventListener('click', function () {
|
|
var id = localStorage.getItem('rtc');
|
|
var hideid = document.getElementById(id);
|
|
$(hideid).hide();
|
|
$(mathFieldPreviousDiv).show();
|
|
localStorage.setItem('rtc', mathRTEId);
|
|
});
|
|
$(mathFieldPreviousDiv).hide();
|
|
});
|
|
|
|
async function sendMessage(quill) {
|
|
var workarea = document.getElementById('workarea');
|
|
var mathField = document.getElementById('workarea_math');
|
|
var messagesContainer = document.getElementById('messages');
|
|
console.log("workarea",workarea);
|
|
console.log("mathField",mathField);
|
|
console.log("messagesContainer",messagesContainer);
|
|
|
|
var content = '';
|
|
|
|
// Check if the checkbox is checked
|
|
if ($('#Choicemath_messageInput').prop('checked')) {
|
|
// Use MathQuill API to get the math field content
|
|
var mathFieldContent = mathField.getValue();
|
|
|
|
content = await convertToLatex(mathFieldContent);
|
|
} else {
|
|
content = quill.root.innerHTML.trim();
|
|
}
|
|
|
|
// Log the content to the console
|
|
console.log("Message Content: ", content);
|
|
|
|
if (content !== '') {
|
|
|
|
// var messageElement = document.createElement('div');
|
|
// messageElement.className = 'message';
|
|
messagesContainer.innerHTML += content;
|
|
|
|
// Append the div to the messagesContainer
|
|
// messagesContainer.appendChild(messageElement);
|
|
MathJax.typeset([messagesContainer]);
|
|
|
|
if ($('#Choicemath_messageInput').prop('checked')) {
|
|
// Clear the math field content
|
|
// mathField.latex('');
|
|
} else {
|
|
quill.setText('');
|
|
}
|
|
|
|
messagesContainer.scrollTop = messagesContainer.scrollHeight;
|
|
}
|
|
}
|
|
async function convertToLatex(text, mathstatus) {
|
|
// Parse mathstatus into a boolean
|
|
const mathStatusBoolean = true
|
|
// Check if the text contains <p> tags
|
|
|
|
console.log("ff")
|
|
return new Promise(async(resolve, reject) => {
|
|
|
|
if (!/<p>|<\/p>/i.test(text)) {
|
|
console.log('text:' , text)
|
|
if (mathStatusBoolean) {
|
|
console.log('text1:' , text)
|
|
// Use MathJax to convert the text to LaTeX
|
|
const cov = await MathJax.tex2chtml(text).outerHTML;
|
|
console.log('cov:' , cov);
|
|
resolve(cov);
|
|
//return cov;
|
|
} else {
|
|
// Return the text as-is
|
|
resolve(text);
|
|
//return text;
|
|
}
|
|
} else {
|
|
console.log("pq")
|
|
const cov = await MathJax.tex2chtml(text).outerHTML;
|
|
console.log('cov:' , cov)
|
|
resolve(cov);
|
|
//return cov;
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
</script>
|
|
|
|
<div class="sidebar" id="rightSidebar">
|
|
<div class="chat-box">
|
|
<button class="work-area1" id="sidebarToggle3"></button>
|
|
<h2>Work Area</h2>
|
|
<div id="messages" class="chat-history" ></div>
|
|
<form id="messageForm" action="#" method="post" onsubmit="sendMessage(); return false;">
|
|
<fieldset>
|
|
<!-- The contentEditable div for Quill -->
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<div class="richText worksection" id="workarea" contentEditable="true" placeholder="Type your message and press Enter..."></div>
|
|
</div>
|
|
<div class="col-12">
|
|
<div>
|
|
<math-field id="workarea_math" style="width: 100%; " contenteditable="true"></math-field>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="col-6 items2" style="display: flex; align-items: center;">
|
|
<input style="width:14px; height:14px; margin-right: 5px;" type="checkbox" id="Choicemath_messageInput"/>
|
|
<span class="math">Math</span>
|
|
</div>
|
|
<div class="col-6" style="display: flex; align-items: center;">
|
|
<button id="sendMessageButton" class="sendMessageButton" type="button">Send</button>
|
|
</div>
|
|
</div>
|
|
</fieldset>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="container">
|
|
|
|
<div class="mainpanel"></div>
|
|
|
|
<!-- QuestionPapper Start -->
|
|
<div class="row section QuestionPaperClass" id="QuestionPaper">
|
|
|
|
<!-- QuestionPapper Title Start-->
|
|
<div class="question-papper-title element">
|
|
<h1 class="title">QuestionPaper Details</h1>
|
|
<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" style="padding: 0;">
|
|
<div class="form_box" id="RTEID">
|
|
<label class="titleSpace">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" style="padding: 0;">
|
|
<div class="form_box">
|
|
<label class="titleSpace">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="row">
|
|
<div class="col-lg-3 col-md-3">
|
|
<div class="form_box">
|
|
<label class="titleSpace">Max Marks:</label>
|
|
<input class="MetaData" id="Max_Marks" >
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3 col-md-3">
|
|
<div class="form_box">
|
|
<label class="titleSpace">Course ID:</label>
|
|
<input class="MetaData" placeholder="" id="Course_ID" >
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3 col-md-3">
|
|
<div class="form_box">
|
|
<label class="titleSpace">Course Code:</label>
|
|
<input class="MetaData" placeholder="" id="Course_Code">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3 col-md-3">
|
|
<div class="form_box">
|
|
<label class="titleSpace">Subject ID:</label>
|
|
<input class="MetaData" placeholder="" id="Subject_ID">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3 col-md-3">
|
|
<div class="form_box">
|
|
<label class="titleSpace">Subject Code:</label>
|
|
<input class="MetaData" placeholder="" id="Subject_Code" >
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3 col-md-3">
|
|
<div class="form_box">
|
|
<label class="titleSpace">Paper No:</label>
|
|
<input class="MetaData" placeholder="" id="Paper_No">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3 col-md-3">
|
|
<div class="form_box">
|
|
<label class="titleSpace">Subject Name:</label>
|
|
<input class="MetaData" placeholder="" id="Subject_Name">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3 col-md-3">
|
|
<div class="form_box">
|
|
<label class="titleSpace">Sub Paper Prefix:</label>
|
|
<input class="MetaData" id="Sub_Paper_Prefix">
|
|
</div>
|
|
</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 class="copy-right-area">
|
|
<div class="copy-left">
|
|
<span style="color: #1D3557;">© 2023 Project-B. All rights reserved.</span>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<!-- QuestionPapper Container End -->
|
|
</div>
|
|
|
|
<!-- The overlay background -->
|
|
<div class="overlay " id="overlay"></div>
|
|
<!-- The popup container -->
|
|
<div class="popup" style="border-top : 10px solid;color:#7018d4;border-radius: 10px;" id="popup">
|
|
<div style="margin-bottom: 9px;">Reorder sections</div>
|
|
<ul id="output" class="">
|
|
<!-- <div style="margin-bottom: 9px;">Reorder sections</div> -->
|
|
Reorder sections
|
|
</ul>
|
|
<div class="popup-save form-button">
|
|
<button class="closePopupButton">Close</button>
|
|
</div>
|
|
|
|
<!-- <button id="closePopupButton">Close</button> -->
|
|
</div>
|
|
<script>
|
|
// Get the close button element by its class name
|
|
var closeButton = document.querySelector('.closePopupButton');
|
|
|
|
// Add a click event listener to the close button
|
|
closeButton.addEventListener('click', function() {
|
|
// Get the popup element by its ID
|
|
var popup = document.getElementById('popup');
|
|
|
|
// Clear the content of the popup by setting its innerHTML to an empty string
|
|
// popup.innerHTML = '';
|
|
// console.log("popup:",popup);
|
|
// Hide the popup by setting its display style to "none"
|
|
popup.style.display = 'none';
|
|
json2nav();
|
|
clearSidebarWrapper();
|
|
navpane();
|
|
});
|
|
</script>
|
|
|
|
|
|
|
|
<!-- jquery js -->
|
|
<script src="assets/js/vendor/jquery-3.2.1.min.js" onload="window.$ = window.jQuery = module.exports;"></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="html2json_for_navigation.js"></script>
|
|
|
|
<!-- RTC Hide and Show Script -->
|
|
<script src="rtc_hide_and_show.js"></script>
|
|
<!-- <script src="QuestionPaperPreview.js"></script> -->
|
|
|
|
<!-- decrypt -->
|
|
<script src="decode.js"></script>
|
|
|
|
<!-- Mark Calculation Script -->
|
|
<script src="mark_calc.js"></script>
|
|
|
|
|
|
<!-- nave pane -->
|
|
<script src="nav_pane.js"></script>
|
|
|
|
<!-- Main.js its used to trigger auto save when system online -->
|
|
|
|
<script src="main.js"></script>
|
|
|
|
<script src="checkParent.js"></script>
|
|
|
|
|
|
<script>
|
|
|
|
|
|
localStorage.setItem('scrollPosition', window.scrollY);
|
|
|
|
var sidebarWrapper = document.getElementById("questionPaper");
|
|
|
|
function clearSidebarWrapper() {
|
|
while (sidebarWrapper.firstChild) {
|
|
sidebarWrapper.removeChild(sidebarWrapper.firstChild);
|
|
}
|
|
}
|
|
</script>
|
|
<script>
|
|
const { ipcRenderer } = require('electron');
|
|
ipcRenderer.on('button-click', async () => {
|
|
const saveButton = document.getElementById('SaveButton');
|
|
|
|
if (saveButton) {
|
|
saveButton.click();
|
|
await new Promise(resolve => setTimeout(resolve, 1000));
|
|
const swalButton = document.querySelector('.swal2-confirm.swal2-styled');
|
|
var AutoSaveFileName = document.querySelector('.swal2-input').value;
|
|
// console.log('AutoSaveFileName : ' , AutoSaveFileName);
|
|
if (swalButton) {
|
|
swalButton.click();
|
|
}
|
|
}
|
|
});
|
|
|
|
</script>
|
|
<script>
|
|
|
|
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
|
|
var FileName = params.get('filename');// Get the value of a specific parameter
|
|
var xmlPath ="" //get the xml filepath in .env file local variable
|
|
|
|
$(document).ready(function() {
|
|
|
|
const targetId = 'Question_title';
|
|
scrollToElementWithoutLink(targetId);
|
|
|
|
|
|
require('dotenv').config();
|
|
const path = require('path');
|
|
//xmlPath added
|
|
const xmlPathenv=process.env.XML_FILE_PATH;
|
|
xmlPath=path.join(__dirname, xmlPathenv);
|
|
// console.log(xmlPath);
|
|
const isEncrypted = process.env.ENCRYPTED;
|
|
// console.log(isEncrypted);
|
|
|
|
$('.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, 1); //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);
|
|
});
|
|
|
|
|
|
//EditPreview and Create Preview
|
|
var previewbutton = document.getElementById("editPreview");
|
|
previewbutton.addEventListener("click", async () => {
|
|
if (FileName) {
|
|
const saveButton = document.getElementById('SaveButton');
|
|
if (saveButton) {
|
|
saveButton.click();
|
|
setTimeout(function() {
|
|
var popupInput = document.getElementById("swal2-input");
|
|
var submitButton = document.querySelector(".swal2-confirm.swal2-styled");
|
|
submitButton.addEventListener("click", function() {
|
|
FileName = popupInput.value;
|
|
FileName += ".xml"
|
|
if(FileName){
|
|
var anchorElement = document.getElementById("editPreview");
|
|
if (anchorElement) {
|
|
anchorElement.click();
|
|
}
|
|
}
|
|
});
|
|
}, 1000);
|
|
}
|
|
previewbutton.href = "QuestionPreview.html?filename=" + FileName;
|
|
} else {
|
|
const saveButton = document.getElementById('SaveButton');
|
|
if (saveButton) {
|
|
saveButton.click();
|
|
setTimeout(function() {
|
|
var popupInput = document.getElementById("swal2-input");
|
|
var submitButton = document.querySelector(".swal2-confirm.swal2-styled");
|
|
submitButton.addEventListener("click", function() {
|
|
FileName = popupInput.value;
|
|
FileName += ".xml"
|
|
if(FileName){
|
|
var anchorElement = document.getElementById("editPreview");
|
|
if (anchorElement) {
|
|
anchorElement.click();
|
|
}
|
|
}
|
|
});
|
|
}, 1000);
|
|
}
|
|
}
|
|
})
|
|
|
|
|
|
// Function to load XML from a file
|
|
function loadXML(xmlFileName) {
|
|
var decodeData ="";
|
|
|
|
return new Promise((resolve, reject) => {
|
|
fs.readFile(`${xmlPath}${xmlFileName}`, 'utf8', (error, data) => {
|
|
if (error) {
|
|
console.error('Error reading file:', error);
|
|
reject(error);
|
|
} else {
|
|
if (isEncrypted === 'YES') {
|
|
// decrypt function call go to decode.js
|
|
decodeData = decode(data);
|
|
} else{
|
|
decodeData = data;
|
|
}
|
|
|
|
resolve(decodeData);
|
|
xml2json(decodeData);
|
|
// json2nav();
|
|
// clearSidebarWrapper();
|
|
// navpane();
|
|
|
|
}
|
|
});
|
|
});
|
|
|
|
|
|
}
|
|
|
|
// Function for Save the XML File
|
|
function saveFile(flag=0) {
|
|
|
|
var title_id = localStorage.getItem('JSON_FOR_EMPTY_QUESTION');
|
|
console.log(title_id);
|
|
|
|
var count = "";
|
|
if(title_id !== '' && title_id !== null)
|
|
{
|
|
var parsedArray = JSON.parse(title_id);
|
|
var count = parsedArray.length;
|
|
console.log('count - ' + count)
|
|
}
|
|
else
|
|
{
|
|
count = 0
|
|
}
|
|
|
|
|
|
if (count > 0) {
|
|
check_Empty_Question()
|
|
} else {
|
|
html2json();
|
|
json2xml();
|
|
if(FileName == "" || FileName == null ){
|
|
setTimeout(promptBox, 1000);
|
|
|
|
}else{
|
|
|
|
const newFileName = FileName.split(".")[0];
|
|
//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);
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
};
|
|
|
|
|
|
</script>
|
|
|
|
|
|
<script>
|
|
|
|
const { v4: uuidv4 } = require('uuid');
|
|
const Quill = require('quill');
|
|
|
|
const ImageResize =require('quill-image-resize-module');
|
|
Quill.register('modules/imageResize', ImageResize);
|
|
|
|
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'],
|
|
[{ 'align': ['justify', 'center', 'right', ] }]
|
|
];
|
|
|
|
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:{
|
|
container:toolbarOptions,
|
|
clipboard: {
|
|
matchVisual: true,
|
|
},
|
|
ImageResize:{
|
|
displaySize:true,
|
|
modules: [ 'Resize', 'DisplaySize', 'Toolbar' ]
|
|
}
|
|
},
|
|
}
|
|
});
|
|
|
|
// var quill = new Quill('#workarea', {
|
|
// theme: 'snow',
|
|
// modules: {
|
|
// toolbar:{
|
|
// container:toolbarOptions,
|
|
// clipboard: {
|
|
// matchVisual: true,
|
|
// },
|
|
// ImageResize:{
|
|
// displaySize:true,
|
|
// modules: [ 'Resize', 'DisplaySize', 'Toolbar' ]
|
|
// }
|
|
// },
|
|
// }
|
|
// });
|
|
|
|
var quill = new Quill('#ql-editor',{
|
|
theme:'snow',
|
|
module:{
|
|
ImageResize:{
|
|
displaySize:true,
|
|
modules: [ 'Resize', 'DisplaySize', 'Toolbar' ]
|
|
}
|
|
}
|
|
})
|
|
|
|
|
|
// function imageHandler() {
|
|
// var range = this.quill.getSelection();
|
|
|
|
// var value = prompt('hello');
|
|
// console.log(value);
|
|
// this.quill.insertEmbed(range.index, 'image', value, Quill.sources.USER);
|
|
// }
|
|
|
|
|
|
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').focus(function() {
|
|
|
|
rtc_hide_and_show(setitem);
|
|
|
|
});
|
|
|
|
var Question_description_Div = $("#Question_description");
|
|
console.log("Question_description_Div",Question_description_Div);
|
|
var Question_description_previousDiv = Question_description_Div.prev();
|
|
console.log("Question_description_previousDiv",Question_description_previousDiv);
|
|
Question_description_previousDiv.attr("id", "Question_description_rtc");
|
|
var questionDescriptionRtc = 'Question_description_rtc';
|
|
$('#Question_description').focus(function() {
|
|
|
|
rtc_hide_and_show(questionDescriptionRtc);
|
|
|
|
});
|
|
|
|
// var chat_Div = $("#workarea");
|
|
// var chat_previousDiv = chat_Div.prev();
|
|
// chat_previousDiv.attr("id", "messageInput_rtc");
|
|
// var chatRtc = 'messageInput_rtc';
|
|
// $('#workarea').focus(function() {
|
|
// rtc_hide_and_show(chatRtc);
|
|
// });
|
|
|
|
var checkboxElement = document.createElement('input');
|
|
checkboxElement.type = 'checkbox';
|
|
checkboxElement.id = 'myCheckbox';
|
|
checkboxElement.textContent = 'myCheckbox';
|
|
checkboxElement.style.width = '14px';
|
|
checkboxElement.style.height = '14px';
|
|
var parentElement = document.getElementById(questionDescriptionRtc);
|
|
|
|
|
|
var labelElement = document.createElement('label');
|
|
labelElement.htmlFor = 'myCheckbox';
|
|
labelElement.textContent = 'Math';
|
|
|
|
// console.log(parentElement);
|
|
parentElement.appendChild(checkboxElement);
|
|
parentElement.appendChild(labelElement);
|
|
|
|
|
|
|
|
var inputElement2 = document.getElementById('Question_title');
|
|
inputElement2.addEventListener("keyup", function(event) {
|
|
|
|
json2nav();
|
|
clearSidebarWrapper();
|
|
navpane();
|
|
|
|
});
|
|
json2nav();
|
|
clearSidebarWrapper();
|
|
navpane();
|
|
html2json();
|
|
|
|
|
|
function showButtons(container) {
|
|
const buttons = container.querySelector('.buttons');
|
|
const onhover = container.querySelector('.onhover');
|
|
// console.log(onhover);
|
|
if(buttons && onhover)
|
|
{
|
|
onhover.style.display = 'block';
|
|
}
|
|
buttons.style.display = 'block';
|
|
|
|
}
|
|
|
|
function hideButtons(container) {
|
|
const buttons = container.querySelector('.buttons');
|
|
const onhover = container.querySelector('.onhover');
|
|
buttons.style.display = 'none';
|
|
onhover.style.display = 'none';
|
|
|
|
}
|
|
|
|
|
|
|
|
var i = 0;
|
|
var array_of_Id = [];
|
|
var questionGroupTitle = "";
|
|
var checktextquestona= 0;
|
|
var checkchoicequestona= 0;
|
|
var questionIncrement = 1;
|
|
|
|
|
|
|
|
//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, scrollval = false)
|
|
{
|
|
checktextquestona = 0
|
|
questionIncrement = 1;
|
|
|
|
questionGroupTitle ="";
|
|
|
|
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;
|
|
}
|
|
|
|
|
|
localStorage.setItem('sectionId', sectionRandomID);
|
|
|
|
i = i + 1;
|
|
addsection +=
|
|
`
|
|
<div class="section-reorder" id="reorder_${sectionRandomID}">
|
|
<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}">
|
|
<h4 class="section-titleHead"> Section ${i}</h4>
|
|
<i class="fa fa-angle-down float-left" id="collapseSection2_${random_no == false ? text_field_created_time : random_no}" aria-hidden="true" style="font-size:24px; float: right !important; position: relative; right: 28px; top: -30px; padding: 2px 5px; border-radius: 6px; border: 1px solid;"></i>
|
|
<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" id="SectionBox_${sectionRandomID}" onmouseover="showButtons(this)">
|
|
<div class="row" style="text-align:right; width: 100%; margin-bottom: -35px">
|
|
<div class="col-lg-10 col-md-12">
|
|
<div class=" button-group align-items-center">
|
|
<div class="addButton buttons" style="display: none;" id="sectionAddButton_${sectionRandomID}">
|
|
<div class="col-md-2">
|
|
<div class="addButtonIcons"><img title="TextQuestion" src="assets/images/text.svg" alt="" onclick="addNewQuestions(event, 1)" id="sidetextButton_${sectionRandomID}" title="Text Question"></div>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<div class="addButtonIcons"><img title="ChoiceQuestion" src="assets/images/choice.svg" alt="" onclick="addNewQuestions(event, 2)" id="sidechoiseButton_${sectionRandomID}" title="Choice Question"></div>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<div class="addButtonIcons"><img title="QuestionGroup" src="assets/images/Group.svg" alt="" onclick="addNewGroupQuestions(event, 0)" id="sidegroupQuestionButton_${sectionRandomID}" title="Question Group"></div>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<div class="addButtonIcons"><img title="Section" src="assets/images/section.svg" alt="" onclick="addSection()" id="sidesectionButton_${sectionRandomID}" title="Section"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-12 col-md-12">
|
|
<div class="items align-items-center hideondrag" style="display: block; margin-bottom: -50px">
|
|
<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 menuButton" style="border: 1px solid; margin-bottom: 4px">Move</button>
|
|
<button onclick="removeSection(${sectionRandomID}, ${i})" class="menuButton" style="border: 1px solid;">Delete</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form_box">
|
|
<label class="titleSpace">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 class="titleSpace">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;">${description ? description : ''}</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-5 col-md-5 mt-2">
|
|
<span>Display Marks</span>
|
|
<label class="switch">
|
|
<input type="checkbox" id="Section_Display_Marks_Id_${sectionRandomID}">
|
|
<span class="slider round"></span>
|
|
</label>
|
|
</div>
|
|
|
|
<div class="col-lg-4 col-md-4 hideondrag text">
|
|
<div class="form_box justify-content-end">
|
|
<div style="margin-right: 10px;"> Attempt Any: </div>
|
|
<input type="text" id="Section_Attempt_Any_Id_${sectionRandomID}" value="${sectionAttemptAny !== false ? sectionAttemptAny : ''}">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-3 col-md-3 hideondrag text">
|
|
<div class="form_box">
|
|
<div> Marks: </div>
|
|
<input type="text" style="width: 58%;" id="Section_Marks_Id_${sectionRandomID}" value="${section_marks !== false ? section_marks : ''}">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="">
|
|
<div class="section-question-area" id="question_area_${sectionRandomID}">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
`;
|
|
|
|
var formContainer = document.getElementById('addNewSection');
|
|
formContainer.insertAdjacentHTML('beforeend', addsection);
|
|
|
|
array_of_Id.push('section_title_text_' + sectionRandomID);
|
|
|
|
var addNewButtonId = 'addNewButton_' + sectionRandomID;
|
|
var SectionButtonId = 'sectionButton_' + sectionRandomID;
|
|
var textButtonId = 'textButton_' + sectionRandomID;
|
|
var ChoiseButtonId = 'choiseButton_' + sectionRandomID;
|
|
var sideChoiseButtonId = 'sidechoiseButton_' + 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() {
|
|
|
|
$('#'+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 section = 'SectionBox_'+sectionRandomID;
|
|
var sectionAddButton = 'sectionAddButton_'+sectionRandomID;
|
|
$('#'+section).mouseenter(function(){
|
|
|
|
add_button_hide_and_show(sectionAddButton);
|
|
|
|
})
|
|
$('#'+sectionAddButton).hide();
|
|
|
|
|
|
|
|
var collapseSectionId = (random_no == false) ? 'collapseSection2_' + text_field_created_time : 'collapseSection2_' + 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') {
|
|
$(this).removeClass('fa-angle-down').addClass('fa-angle-up');
|
|
content.style.display = 'block';
|
|
sessionTitle.style.display = 'block';
|
|
} else {
|
|
content.style.display = 'none';
|
|
sessionTitle.style.display = 'none';
|
|
$(this).removeClass('fa-angle-up').addClass('fa-angle-down');
|
|
}
|
|
});
|
|
// Select input field by class name
|
|
const inputFields = document.querySelectorAll('.richText');
|
|
// console.log(inputFields);
|
|
inputFields.forEach(inputField => {
|
|
inputField.addEventListener('paste', (event) => {
|
|
const text = event.clipboardData.getData('text/plain');
|
|
inputField.value = text;
|
|
});
|
|
});
|
|
});
|
|
|
|
var sectionText = (random_no == false) ? 'section_title_text_' + text_field_created_time : 'section_title_text_' + random_no;
|
|
console.log(sectionText);
|
|
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).focus(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).focus(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);
|
|
var tempSectionTitle = document.getElementById('section_title_text_'+ sectionRandomID).querySelector('.ql-editor').innerHTML;
|
|
|
|
inputElement.addEventListener("keyup", function(event) {
|
|
|
|
json2nav();
|
|
clearSidebarWrapper();
|
|
navpane();
|
|
check_Remove_Empty_Question(sectionID);
|
|
|
|
});
|
|
|
|
var DisplayMark_RawID = 'Section_Display_Marks_Id_' + sectionRandomID
|
|
var DisplayMark_ID = document.getElementById(DisplayMark_RawID)
|
|
|
|
if(sectionDispalyMarks === 'false'){
|
|
DisplayMark_ID.checked = false;
|
|
}else{
|
|
DisplayMark_ID.checked = true;
|
|
}
|
|
|
|
|
|
var Section_Marks_raw_Id = 'Section_Marks_Id_' + sectionRandomID;
|
|
$('#'+Section_Marks_raw_Id).prop("disabled", true);
|
|
|
|
|
|
|
|
// function for calling html2json script using Mark Calculation
|
|
var Section_Attempt_Any_raw_Id = 'Section_Attempt_Any_Id_' + sectionRandomID;
|
|
var Section_Marks_raw_Id = 'Section_Marks_Id_' + sectionRandomID;
|
|
$('#'+Section_Attempt_Any_raw_Id).keyup(function() {
|
|
|
|
json2nav()
|
|
markCalculation()
|
|
|
|
});
|
|
$('#'+Section_Marks_raw_Id).keyup(function() {
|
|
|
|
json2nav()
|
|
markCalculation()
|
|
|
|
});
|
|
|
|
|
|
json2nav();
|
|
clearSidebarWrapper();
|
|
navpane();
|
|
|
|
|
|
//function for new section add to go that section prevent default
|
|
var EditScroll = localStorage.getItem('scroll')
|
|
if(EditScroll !== '1' && scrollval == false)
|
|
|
|
{
|
|
const targetId = 'section_title_text_' + sectionRandomID;
|
|
scrollToElementWithoutLink(targetId);
|
|
|
|
}
|
|
|
|
|
|
|
|
const arrayString = JSON.stringify(array_of_Id);
|
|
collect_Empty_Question_Id(arrayString, sectionID);
|
|
|
|
|
|
|
|
}
|
|
|
|
//Function for Create a New Question Group
|
|
function addQuestionGroup(idObj)
|
|
{
|
|
|
|
const QuestionGroup_UUID = uuidv4();
|
|
|
|
//set default values
|
|
var question_group_id = false; // set default value false. this param for add question group inside section (i.e) question area id
|
|
var add_question_group_id = false // set default value false. this param for add new question group inside another question group (i.e) group question area id
|
|
//end of set default values
|
|
|
|
//set values from obj param if exists
|
|
if(idObj.hasOwnProperty('question_group_id'))
|
|
{
|
|
question_group_id = idObj.question_group_id;
|
|
}
|
|
else if(idObj.hasOwnProperty('add_question_group_id'))
|
|
{
|
|
// console.log(idObj.add_question_group_id);
|
|
question_group_id = idObj.add_question_group_id;
|
|
}
|
|
|
|
//end of set values from obj param if exists
|
|
|
|
var addQuestionGroup = "";
|
|
const text_field_created_time = Date.now();
|
|
|
|
var QuestionGroup_ID = "";
|
|
if(idObj.hasOwnProperty('questions_randon_id'))
|
|
{
|
|
QuestionGroup_ID = idObj.questions_randon_id;
|
|
}
|
|
else
|
|
{
|
|
QuestionGroup_ID = text_field_created_time;
|
|
}
|
|
|
|
var sectionRandomID = localStorage.getItem('sectionId');
|
|
addQuestionGroup +=
|
|
`<div draggable='true' class="draggable-group hidedrag" id="draggedGroup_${QuestionGroup_ID}">
|
|
<i id="collapseSubSection_${QuestionGroup_ID}" aria-hidden="true" style=" font-size: 24px; margin-right: 9px; margin-top: 25px;"></i>
|
|
<input type="hidden" id="Question_Group_UUID_ID_${QuestionGroup_ID}" value="${idObj.hasOwnProperty('question_group_obj') ? idObj.question_group_obj.attributes.Id : QuestionGroup_UUID}">
|
|
<div class="groupsection" draggable='true' id="group_question_${QuestionGroup_ID}">
|
|
<div class="question-group-linestyle"><img src="assets/images/line2.svg"/></div>
|
|
<div class="sectionTitle" id="group_question_title_${QuestionGroup_ID}">
|
|
<div class="col-lg-12 col-md-12">
|
|
<div onmouseover="showButtons(this)" id="QuestionGroupButtons_${QuestionGroup_ID}" class="row question element">
|
|
<div id="dragHandle" class="drag-handle">
|
|
<i class="fas fa-grip-horizontal"></i>
|
|
</div>
|
|
<h4 class="QuestionGroup-titleHead">Question Group</h4>
|
|
<div class="items align-items-center hideondrag">
|
|
<span onclick="ReArrangeQuestionsGroup(event)" id="forword_${QuestionGroup_ID}" class="fa fa-chevron-up up-icon"></span>
|
|
<span onclick="ReArrangeQuestionsGroup(event)" id="backword_${QuestionGroup_ID}" class="fa fa-chevron-down down-icon"></span>
|
|
<i class="fa fa-trash-o" onclick="removeQuestionGroup(${QuestionGroup_ID})" style="font-size:20px;"aria-hidden="true"></i>
|
|
</div>
|
|
|
|
<div class="row" style="text-align:right; width: 100%">
|
|
<div class="col-lg-10 col-md-12">
|
|
<div class=" button-group align-items-center">
|
|
<div class="addButton QGButtons" style="display: none;" id="AddButton_${QuestionGroup_ID}">
|
|
<div class="col-md-2">
|
|
<div class="addButtonIcons"><img title="QuestionGroup" src="assets/images/text.svg" alt="" onclick="addNewGroupQuestions(event, 1)" id="textButtonSectionQroupside_${QuestionGroup_ID}" title="Question Group Text Question"></div>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<div class="addButtonIcons"><img title="QuestionGroup" src="assets/images/choice.svg" alt="" onclick="addNewGroupQuestions(event, 2)" id="choiseButtonSectionQroupside_${QuestionGroup_ID}" title="Question Group Choice Question"></div>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<div class="addButtonIcons"><img title="QuestionGroup" src="assets/images/Group.svg" alt="" onclick="MultiLevelQuestionGroup(event)" id="QuestionGroupButtonside_${QuestionGroup_ID}" title="Question Group on Question Group"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-12 col-md-12">
|
|
<div class="form_box">
|
|
<label class="titleSpace">Questions Group Title:<span id='partOf_${QuestionGroup_ID}'></span></label>
|
|
<div class="richText" id="subSection_title_text_${QuestionGroup_ID}" contenteditable="true" style=" border: 2px solid #EEECFE; margin-top: 4px;">${idObj.hasOwnProperty('question_group_obj') ? idObj.question_group_obj.group_title : ""}</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-12 col-md-12 hideondrag">
|
|
<div class="form_box">
|
|
<label class="titleSpace">Questions Group Description:</label>
|
|
<div class="richText" id="subSection_description_text_${QuestionGroup_ID}" contenteditable="true" style=" border: 2px solid #EEECFE; margin-top: 4px;">${idObj.hasOwnProperty('question_group_obj') ? idObj.question_group_obj.group_description : ""}</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-5 col-md-5 mt-2">
|
|
<span>Display Marks</span>
|
|
<label class="switch">
|
|
<input type="checkbox" id="Question_Group_Display_Marks_Id_${QuestionGroup_ID}">
|
|
<span class="slider round"></span>
|
|
</label>
|
|
</div>
|
|
|
|
<div class="col-lg-4 col-md-4 hideondrag text" >
|
|
<div class="form_box justify-content-end">
|
|
<div style="margin-right:10px;"> Attempt Any : </div>
|
|
<input type="text" id="Question_Attempt_Any_Id_${QuestionGroup_ID}" value="${idObj.hasOwnProperty('question_group_obj') ? idObj.question_group_obj.group_attempt_any : ''}">
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="col-lg-3 col-md-3 hideondrag text">
|
|
<div class="form_box">
|
|
<div> Marks : </div>
|
|
<input type="text" style="width:58%;" id="Question_Group_Marks_Id_${QuestionGroup_ID}" value="${idObj.hasOwnProperty('question_group_obj') ? idObj.question_group_obj.group_marks : ""}">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="">
|
|
<div class="nested-sortable" id="group_question_area_${QuestionGroup_ID}"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
if(question_group_id)
|
|
{
|
|
var formContainer = document.getElementById(question_group_id);
|
|
formContainer.insertAdjacentHTML('beforeend', addQuestionGroup);
|
|
}
|
|
else if(idObj.hasOwnProperty('section_question_area_id'))
|
|
{
|
|
var formContainer = document.getElementById(idObj.section_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);
|
|
}
|
|
|
|
array_of_Id.push('subSection_title_text_' + QuestionGroup_ID);
|
|
|
|
var addNewButtonId = 'addNewButtonSectionQroup_' + QuestionGroup_ID ;
|
|
var textButtonId = 'textButtonSectionQroup_' + QuestionGroup_ID ;
|
|
var ChoiseButtonId = 'choiseButtonSectionQroup_' + QuestionGroup_ID ;
|
|
var GroupQuestionButtonId = 'QuestionGroupButton_' + QuestionGroup_ID ;
|
|
|
|
$('#'+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 removeAndCloneTextQuestion_Raw = 'QuestionGroupButtons_'+QuestionGroup_ID;
|
|
var AddButtons_Raw = 'AddButton_'+QuestionGroup_ID;
|
|
$('#'+removeAndCloneTextQuestion_Raw).mouseenter(function(){
|
|
|
|
add_button_hide_and_show(AddButtons_Raw);
|
|
|
|
})
|
|
$('#'+AddButtons_Raw).hide();
|
|
|
|
|
|
|
|
var subSectionText = 'subSection_title_text_' + QuestionGroup_ID;
|
|
var quill = new Quill('#'+subSectionText, {
|
|
theme: 'snow',
|
|
modules: {
|
|
toolbar: toolbarOptions
|
|
},
|
|
});
|
|
|
|
var subSectionDescription = 'subSection_description_text_' + QuestionGroup_ID;
|
|
var quill = new Quill('#'+subSectionDescription, {
|
|
theme: 'snow', // Choose a theme (snow, bubble, etc.)
|
|
modules: {
|
|
toolbar: toolbarOptions
|
|
},
|
|
});
|
|
|
|
|
|
|
|
var sub_section_title_Div = 'subSection_title_text_' + QuestionGroup_ID ;
|
|
var NewRTEId = 'subsection_title_rtc_' + QuestionGroup_ID;
|
|
var sub_section_title_previousDiv = $('#'+sub_section_title_Div).prev();
|
|
sub_section_title_previousDiv.attr("id", NewRTEId);
|
|
$('#'+sub_section_title_Div).focus(function() {
|
|
|
|
rtc_hide_and_show(NewRTEId)
|
|
|
|
});
|
|
|
|
|
|
var sub_section_description_Div = 'subSection_description_text_' + QuestionGroup_ID;
|
|
var NewRTEId2 = 'subsection_description_rtc_' + QuestionGroup_ID;
|
|
var sub_section_description_previousDiv = $('#'+sub_section_description_Div).prev();
|
|
sub_section_description_previousDiv.attr("id", NewRTEId2);
|
|
$('#'+sub_section_description_Div).focus(function() {
|
|
|
|
rtc_hide_and_show(NewRTEId2)
|
|
|
|
});
|
|
$(sub_section_description_previousDiv).hide();
|
|
$(sub_section_title_previousDiv).hide();
|
|
|
|
var displayMArks = ""
|
|
if(idObj.hasOwnProperty('question_group_obj'))
|
|
{
|
|
displayMArks = idObj.question_group_obj.group_display_marks;
|
|
}
|
|
else
|
|
{
|
|
displayMArks = false;
|
|
}
|
|
|
|
|
|
var DisplayMark_RawID = "Question_Group_Display_Marks_Id_" + QuestionGroup_ID;
|
|
var DisplayMark_ID = document.getElementById(DisplayMark_RawID)
|
|
|
|
if(displayMArks === 'false'){
|
|
DisplayMark_ID.checked = false;
|
|
}else{
|
|
DisplayMark_ID.checked = true;
|
|
}
|
|
|
|
var question_groupid = 'subSection_title_text_'+ QuestionGroup_ID;
|
|
var inputElement = document.getElementById(question_groupid);
|
|
attrId = document.getElementById('subSection_title_text_'+ QuestionGroup_ID).querySelector('.ql-editor').innerHTML;
|
|
|
|
inputElement.addEventListener("keyup", function(event) {
|
|
|
|
json2nav();
|
|
clearSidebarWrapper();
|
|
navpane();
|
|
check_Remove_Empty_Question(question_groupid);
|
|
// SetQuestionGroupTitle(QuestionGroup_ID, QuestionGroup_ID)
|
|
|
|
});
|
|
|
|
// function for calling html2json using Mark Calculation
|
|
var Question_Group_Marks_Field = 'Question_Group_Marks_Id_' + QuestionGroup_ID;
|
|
var Question_Attempt_Any_Fields = 'Question_Attempt_Any_Id_'+ QuestionGroup_ID;
|
|
$('#'+Question_Group_Marks_Field).keyup(function() {
|
|
|
|
json2nav()
|
|
markCalculation()
|
|
});
|
|
$('#'+Question_Attempt_Any_Fields).keyup(function() {
|
|
|
|
json2nav()
|
|
markCalculation()
|
|
|
|
});
|
|
|
|
json2nav();
|
|
clearSidebarWrapper();
|
|
navpane();
|
|
markCalculation()
|
|
|
|
|
|
|
|
// start the find Parent count and Remove the Fivth Question Group list
|
|
const value = localStorage.getItem('JSON_FOR_NAV')
|
|
const parsedValue = JSON.parse(value);
|
|
const questionGroupId =question_groupid;
|
|
const classes = findParent(parsedValue, questionGroupId); //this line goto checkParent.js and give the Parent count
|
|
|
|
// var removetagvalue = removeHtmlTags(classes.value2)
|
|
|
|
// if(classes.value1 != 1 ){
|
|
|
|
// var parOfId = document.getElementById('partOf_'+QuestionGroup_ID)
|
|
// parOfId.innerHTML = `( part of ${questionGroupTitle})`;
|
|
// questionGroupTitle=removetagvalue;
|
|
// }
|
|
// else
|
|
// {
|
|
// questionGroupTitle=removetagvalue;
|
|
// }
|
|
|
|
let originalString = questionGroupId;
|
|
let substringToRemove = "subSection_title_text_";
|
|
let modifiedString = originalString.replace(substringToRemove, '');
|
|
// console.log(modifiedString);
|
|
// let finalString = "QuestionGroupButtons_" + modifiedString;
|
|
let finalString ="draggedGroup_" +modifiedString;
|
|
|
|
var element = document.getElementById(finalString);
|
|
// console.log(element)
|
|
if (classes.value1 < 5) {
|
|
// console.log("Div not found.");
|
|
localStorage.setItem('QuestionGroupId', QuestionGroup_ID)
|
|
|
|
} else {
|
|
const Swal = require('sweetalert2');
|
|
Swal.fire({
|
|
title : 'Alert!!!',
|
|
text : 'Only Four Question Groups allowed.',
|
|
icon : 'info',
|
|
confirmButtonText: 'OK'
|
|
});
|
|
|
|
element.parentNode.removeChild(element);
|
|
// localStorage.removeItem('yourKey');
|
|
// console.log(element)
|
|
// console.log("Div removed successfully.");
|
|
}
|
|
// end of find QG level script
|
|
|
|
//function for new QuestionGroup add scroll to the QuestionGroup prevent default
|
|
var EditScroll = localStorage.getItem('scroll')
|
|
if(EditScroll !== '1')
|
|
|
|
{
|
|
const targetId = 'subSection_title_text_' + QuestionGroup_ID;
|
|
scrollToElementWithoutLink(targetId);
|
|
}
|
|
|
|
|
|
const arrayString = JSON.stringify(array_of_Id);
|
|
collect_Empty_Question_Id(arrayString, question_groupid);
|
|
// SetQuestionGroupTitle(QuestionGroup_ID, QuestionGroup_ID)
|
|
|
|
}
|
|
|
|
//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, questionSubType = false, mathEnabled = false, Choice = false, questionAreaId = false, questionGroupId = false, questionRandomNo = false, QuestionGroupRandomNo = false, questionMarks = false, questionUUID = false, group_question_marks = false, group_question_uuid = false, questionDisplayMarks = false, group_question_Display_Marks = false)
|
|
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, questionAreaId = false, questionRandomNo = false, questionMarks = false, questionUUID = false, questionDisplayMarks = false)
|
|
{
|
|
const ChoiceGroupFixed_UUID = uuidv4();
|
|
|
|
var groupQuestion = "";
|
|
const text_field_created_time = Date.now();// random number for dynamic ID - using current date time
|
|
localStorage.setItem('questionsId', text_field_created_time);
|
|
|
|
//set Default value
|
|
var addChoiceAreaId = false;
|
|
var marks = ""
|
|
var UUID = false;
|
|
|
|
|
|
//for hide and the side button
|
|
var questiongrouparea = "";
|
|
if(questionAreaId !== false)
|
|
{
|
|
questiongrouparea = questionAreaId.split("_")[0];
|
|
}
|
|
else
|
|
{
|
|
questiongrouparea = 'false';
|
|
}
|
|
|
|
|
|
var lineImg = ''
|
|
|
|
if(questiongrouparea === 'group' || group_question_area_id !== false)
|
|
{
|
|
var lineImg = 'line2.svg';
|
|
}
|
|
else{
|
|
var lineImg = 'line.svg';
|
|
}
|
|
|
|
|
|
|
|
|
|
if(questionRandomNo)
|
|
{
|
|
addChoiceAreaId = questionRandomNo;
|
|
}else{
|
|
addChoiceAreaId = text_field_created_time;
|
|
}
|
|
|
|
localStorage.setItem('ChoiceId', addChoiceAreaId);
|
|
|
|
if(questionMarks)
|
|
{
|
|
marks = questionMarks;
|
|
}
|
|
else
|
|
{
|
|
marks = "";
|
|
}
|
|
|
|
if(questionUUID)
|
|
{
|
|
UUID = questionUUID;
|
|
}
|
|
else
|
|
{
|
|
const ChoiceQuestion_UUID = uuidv4();
|
|
UUID = ChoiceQuestion_UUID;
|
|
}
|
|
|
|
var sectionRandomID = localStorage.getItem('sectionId');
|
|
var QuestionGroup_ID = localStorage.getItem('QuestionGroupId');
|
|
|
|
|
|
groupQuestion +=
|
|
`<div class="question hidedrag element Question-Border-Top col-lg-12" draggable="true" id="removeAndCloneQroupQuestion_${addChoiceAreaId}" style="" onclick="toggleClasses(this)" onmouseover="showButtons(this)">
|
|
<div class="question-linestyle"><img src="assets/images/${lineImg}"/></div>
|
|
<div id="dragHandle" class="drag-handle">
|
|
<i class="fas fa-grip-horizontal"></i>
|
|
</div>
|
|
<div class="items hideondrag" style="display: none;">
|
|
<i onclick="ReArrangeQuestions(event)" class="fa fa-chevron-up up-icon"></i>
|
|
<i onclick="ReArrangeQuestions(event)" class="fa fa-chevron-down down-icon"></i>
|
|
<i class="fa fa-trash-o" onclick="removeClonedQroupQuestion(${addChoiceAreaId})" style="font-size:20px;"aria-hidden="true"></i>
|
|
</div>
|
|
|
|
|
|
<div class="row" style="text-align:right; width: 100%" id="overallAddButtons_${addChoiceAreaId}">
|
|
<div class="col-lg-10 col-md-12">
|
|
<div class=" button-group align-items-center">
|
|
<div class="addButton buttons" style="display: none;" id="AddButtons_${addChoiceAreaId}">
|
|
<div class="col-md-2">
|
|
<div class="addButtonIcons"><img title="TextQuestion" src="assets/images/text.svg" alt="" onclick="addNewQuestions(event, 1)" id="sidetextButton_${sectionRandomID}" title="Text Question"></div>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<div class="addButtonIcons"><img title="ChoiceQuestion" src="assets/images/choice.svg" alt="" onclick="addNewQuestions(event, 2)" id="sidechoiseButton_${sectionRandomID}" title="Choice Question"></div>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<div class="addButtonIcons"><img title="QuestionGroup" src="assets/images/Group.svg" alt="" onclick="addNewGroupQuestions(event, 0)" id="sidegroupQuestionButton_${sectionRandomID}" title="Question Group"></div>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<div class="addButtonIcons"><img title="Section" src="assets/images/section.svg" alt="" onclick="addSection()" id="sidesectionButton_${sectionRandomID}" title="Section"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row" style="text-align:right; width: 100%;" id="overallQuestionGRoupAddButtons_${addChoiceAreaId}">
|
|
<div class="col-lg-10 col-md-12">
|
|
<div class=" button-group align-items-center">
|
|
<div class="addButton buttons onhover" style="display: none;" id="QuestionGRoupAddButtons_${addChoiceAreaId}">
|
|
<div class="col-md-2">
|
|
<div class="addButtonIcons"><img title="QuestionGroup" src="assets/images/text.svg" alt="" onclick="addNewGroupQuestions(event, 1)" id="textButtonSectionQroupside_${QuestionGroup_ID}" title="Question Group Text Question"></div>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<div class="addButtonIcons"><img title="QuestionGroup" src="assets/images/choice.svg" alt="" onclick="addNewGroupQuestions(event, 2)" id="choiseButtonSectionQroupside_${QuestionGroup_ID}" title="Question Group Choice Question"></div>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<div class="addButtonIcons"><img title="QuestionGroup" src="assets/images/Group.svg" alt="" onclick="MultiLevelQuestionGroup(event)" id="QuestionGroupButtonside_${QuestionGroup_ID}" title="Question Group on Question Group"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</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" style="margin-top: -20px">
|
|
<div class="form_box">
|
|
<label class="titleSpace">Question:<span id='partOf_${addChoiceAreaId}'></label>
|
|
<div class="richText" id="textQuestionName_${addChoiceAreaId}" contenteditable="true" style=" border: 2px solid #EEECFE; margin-top: 4px;">${questionTitle ? questionTitle : ''}</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-12 col-md-12 hideondrag" style="margin-bottom: 5px">
|
|
<div class="form_box">
|
|
<label class="titleSpace">Subtitle:</label>
|
|
<div class="richText" id="textQuestionSubtitle_${addChoiceAreaId}" contenteditable="true" style=" border: 2px solid #EEECFE; margin-top: 4px;">${questionDescription ? questionDescription : ''}</div>
|
|
<math-field id="textQuestionSubtitle_math_${addChoiceAreaId}" contenteditable="true">${mathEnabled == 'true' ? questionDescription : ''}</math-field>
|
|
<span class="mathQuestions">Math</span> <input class="checkbox" style="width:14px; height:14px" type="checkbox" id="math_${addChoiceAreaId}">
|
|
</div>
|
|
</div>
|
|
|
|
<input type="hidden" id="Choice_Group_Fixed_UUID_ID_${addChoiceAreaId}" value="${Choice == false ? ChoiceGroupFixed_UUID : Choice[0].id}">
|
|
<div class="col-lg-12 col-md-4 hideondrag" id="newChoiceGroup_${addChoiceAreaId}">
|
|
<div class="choice row align-items-center" id="deleteChoice_${addChoiceAreaId}">
|
|
<div class="col-lg-0"><input type="radio" id="radioButton_${addChoiceAreaId}" checked></div>
|
|
<div class="col-lg-6" style="margin-bottom: 10px">
|
|
<div class="richText" id="choiceTextField_${addChoiceAreaId}" contenteditable="true" style=" border: 2px solid #EEECFE; width: 100%; margin-top: 10px;">${Choice ? Choice[0].choice_name : ""}</div>
|
|
<math-field id="choiceTextField_math_${addChoiceAreaId}" style="width: 100%;" contenteditable="true">${Choice ? Choice[0].choice_name : ""}</math-field>
|
|
</div>
|
|
<div class="items2 col-lg-4">
|
|
<input style="width:14px; height:14px" type="checkbox" id="Choicemath_${addChoiceAreaId}"> <span class="math">Math</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-12 col-md-12 hideondrag" >
|
|
<div id="addChoiceArea_`+addChoiceAreaId+`" class="row"></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_${addChoiceAreaId}" onclick="ConstructAddNewChoiceID(event)"></i>
|
|
</div>
|
|
|
|
<div class="col-lg-8 col-md-8 mt-2">
|
|
|
|
<div class="type1-switch align-items-center hideondrag" style="display: none;">
|
|
<input type="hidden" value="group" id="question_type_${addChoiceAreaId}">
|
|
|
|
<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>Multiple Answer</span>
|
|
<label class="switch hideondrag" >
|
|
<input type="checkbox" id="multipleAnswer_${addChoiceAreaId}">
|
|
<span class="slider round"></span>
|
|
</label>
|
|
</div>
|
|
</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_${addChoiceAreaId}" value="${marks}"></input>
|
|
</div>
|
|
</div>
|
|
|
|
</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(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);
|
|
}
|
|
|
|
array_of_Id.push('textQuestionName_' + addChoiceAreaId);
|
|
|
|
var commentButtonId = 'commentButton_' + addChoiceAreaId;
|
|
var commentFieldId = 'commentField_' + addChoiceAreaId;
|
|
var imageButtonId = 'imageButton_' + addChoiceAreaId;
|
|
var imageInputId = 'imageInput_' + addChoiceAreaId;
|
|
var deleteButtonId = 'deleteButton_' + addChoiceAreaId;
|
|
var deleteChoiceId = 'deleteChoice_' + addChoiceAreaId;
|
|
|
|
|
|
var ChoiceMathSwitch = 'math_'+addChoiceAreaId;
|
|
var ChoiceFieldMathSwitch = 'Choicemath_'+addChoiceAreaId;
|
|
var textQuestionSubtitle_math = 'textQuestionSubtitle_math_'+addChoiceAreaId;
|
|
var textQuestionSubtitle = 'textQuestionSubtitle_'+addChoiceAreaId;
|
|
var choiceTextField_math = 'choiceTextField_math_'+addChoiceAreaId;
|
|
var choiceTextField = 'choiceTextField_'+addChoiceAreaId;
|
|
var choicecommentFielddelete = 'newChoiceGroup_'+addChoiceAreaId;
|
|
|
|
var ChoiceMathSwitchId = document.getElementById(ChoiceMathSwitch);
|
|
var ChoiceFieldMathSwitchId = document.getElementById(ChoiceFieldMathSwitch);
|
|
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)
|
|
var choicecommentFielddeleteId = document.getElementById(choicecommentFielddelete)
|
|
|
|
|
|
if (mathEnabled === 'true')
|
|
{
|
|
ChoiceMathSwitchId.checked = true;
|
|
$(textQuestionSubtitleId).hide();
|
|
$(textQuestionSubtitle_previousDiv).hide();
|
|
$(textQuestionSubtitle_mathId).show();
|
|
}
|
|
else
|
|
{
|
|
$(ChoiceMathSwitchId).checked = false;
|
|
$(textQuestionSubtitleId).show();
|
|
$(textQuestionSubtitle_mathId).hide();
|
|
}
|
|
|
|
//for default choice field mathenabled
|
|
var choice_mathEnabled = "";
|
|
if(Choice !== false)
|
|
{
|
|
choice_mathEnabled = Choice[0].is_math_enabled;
|
|
}
|
|
else{
|
|
choice_mathEnabled = 'false'
|
|
}
|
|
|
|
|
|
|
|
if(choice_mathEnabled === 'true')
|
|
{
|
|
$(ChoiceFieldMathSwitchId).prop('checked', true);
|
|
$(choiceTextFieldId).hide();
|
|
$(choiceTextField_math_Id).show();
|
|
}
|
|
else
|
|
{
|
|
$(ChoiceFieldMathSwitchId).prop('checked', false);
|
|
$(choiceTextFieldId).show();
|
|
$(choiceTextField_math_Id).hide();
|
|
}
|
|
|
|
|
|
|
|
$(ChoiceMathSwitchId).change(function() {
|
|
|
|
if (ChoiceMathSwitchId.checked) {
|
|
|
|
$(textQuestionSubtitle_mathId).show();
|
|
$(textQuestionSubtitleId).hide();
|
|
$(textQuestionSubtitle_previousDiv).hide();
|
|
|
|
} else {
|
|
$(textQuestionSubtitleId).show();
|
|
$(textQuestionSubtitle_mathId).hide();
|
|
}
|
|
});
|
|
|
|
$(ChoiceFieldMathSwitchId).change(function() {
|
|
|
|
if (ChoiceFieldMathSwitchId.checked) {
|
|
|
|
$(choiceTextFieldId).hide();
|
|
$(choiceTextField_previousDiv).hide();
|
|
$(choiceTextField_math_Id).show();
|
|
|
|
} else {
|
|
$(choiceTextFieldId).show();
|
|
$(choiceTextField_math_Id).hide();
|
|
}
|
|
});
|
|
|
|
|
|
$('#'+deleteButtonId).on('click', function() {
|
|
|
|
$('#'+choicecommentFielddelete).remove();
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var AddButtons_Raw = 'AddButtons_'+addChoiceAreaId;
|
|
var overallAddButtons_Raw = 'overallAddButtons_'+addChoiceAreaId;
|
|
var QuestionGroupAddButtons_Raw = 'QuestionGRoupAddButtons_'+addChoiceAreaId;
|
|
var overallQuestionGroupAddButtons_Raw = 'overallQuestionGRoupAddButtons_'+addChoiceAreaId;
|
|
|
|
var AddButtons_ID = document.getElementById(AddButtons_Raw)
|
|
var QuestionGroupAddButtons_ID = document.getElementById(QuestionGroupAddButtons_Raw)
|
|
var removeAndCloneTextQuestion_ID = document.getElementById(removeAndCloneTextQuestion_Raw);
|
|
|
|
|
|
|
|
|
|
if(group_question_area_id !== false)
|
|
{
|
|
|
|
$('#'+overallQuestionGroupAddButtons_Raw).show();
|
|
$('#'+overallAddButtons_Raw).hide();
|
|
|
|
}
|
|
else{
|
|
|
|
|
|
if(questiongrouparea === 'group')
|
|
{
|
|
$('#'+overallQuestionGroupAddButtons_Raw).show();
|
|
$('#'+overallAddButtons_Raw).hide();
|
|
}
|
|
else
|
|
{
|
|
$('#'+overallQuestionGroupAddButtons_Raw).hide();
|
|
$('#'+overallAddButtons_Raw).show();
|
|
}
|
|
|
|
}
|
|
|
|
|
|
var removeAndCloneTextQuestion_Raw = 'removeAndCloneQroupQuestion_'+addChoiceAreaId;
|
|
var AddButtons_Raw = 'AddButtons_'+addChoiceAreaId;
|
|
$('#'+removeAndCloneTextQuestion_Raw).mouseenter(function(){
|
|
|
|
if(group_question_area_id !== false)
|
|
{
|
|
add_button_hide_and_show(QuestionGroupAddButtons_Raw);
|
|
}
|
|
else
|
|
{
|
|
if(questiongrouparea === 'group')
|
|
{
|
|
add_button_hide_and_show(QuestionGroupAddButtons_Raw);
|
|
}
|
|
else
|
|
{
|
|
add_button_hide_and_show(AddButtons_Raw);
|
|
}
|
|
}
|
|
|
|
})
|
|
$('#'+AddButtons_Raw).hide();
|
|
$('#'+QuestionGroupAddButtons_Raw).hide();
|
|
|
|
|
|
|
|
|
|
var removeAndCloneTextQuestion_Raw = 'removeAndCloneQroupQuestion_'+addChoiceAreaId;
|
|
var removeAndCloneTextQuestion_ID = document.getElementById(removeAndCloneTextQuestion_Raw);
|
|
|
|
|
|
|
|
var typetwoQuestionName = 'textQuestionName_' + addChoiceAreaId;
|
|
var quill = new Quill('#'+typetwoQuestionName, {
|
|
theme: 'snow',
|
|
modules: {
|
|
toolbar: toolbarOptions
|
|
},
|
|
});
|
|
|
|
var typetwoQuestionSubtitle = 'textQuestionSubtitle_' + addChoiceAreaId;
|
|
var quill = new Quill('#'+typetwoQuestionSubtitle, {
|
|
theme: 'snow',
|
|
modules: {
|
|
toolbar: toolbarOptions
|
|
},
|
|
});
|
|
|
|
var choiceTextField = 'choiceTextField_' + addChoiceAreaId;
|
|
var quill = new Quill('#'+choiceTextField, {
|
|
theme: 'snow',
|
|
modules: {
|
|
toolbar: toolbarOptions2
|
|
},
|
|
placeholder: 'Enter Choice',
|
|
});
|
|
|
|
|
|
|
|
var textQuestionName_Div = 'textQuestionName_' + addChoiceAreaId;
|
|
var textQuestionNewRTEId = 'typeTwotextQuestionName_rtc_' + addChoiceAreaId;
|
|
var textQuestionName_previousDiv = $('#'+textQuestionName_Div).prev();
|
|
textQuestionName_previousDiv.attr("id", textQuestionNewRTEId);
|
|
$('#'+textQuestionName_Div).focus(function() {
|
|
|
|
rtc_hide_and_show(textQuestionNewRTEId);
|
|
|
|
});
|
|
|
|
|
|
var textQuestionSubtitle_Div = 'textQuestionSubtitle_' + addChoiceAreaId;
|
|
var textQuestionSubtitleNewRTEId = 'typeTwotextQuestionSubtitle_rtc_' + addChoiceAreaId;
|
|
var textQuestionSubtitle_previousDiv = $('#'+textQuestionSubtitle_Div).prev();
|
|
textQuestionSubtitle_previousDiv.attr("id", textQuestionSubtitleNewRTEId);
|
|
$('#'+textQuestionSubtitle_Div).focus(function() {
|
|
|
|
rtc_hide_and_show(textQuestionSubtitleNewRTEId);
|
|
|
|
});
|
|
|
|
var choiceTextField_Div = 'choiceTextField_' + addChoiceAreaId;
|
|
var choiceTextNewRTEId = 'choiceTextField_rtc_' + addChoiceAreaId;
|
|
var choiceTextField_previousDiv = $('#'+choiceTextField_Div).prev();
|
|
choiceTextField_previousDiv.attr("id", choiceTextNewRTEId);
|
|
$('#'+choiceTextField_Div).focus(function() {
|
|
|
|
rtc_hide_and_show(choiceTextNewRTEId);
|
|
|
|
});
|
|
$(textQuestionName_previousDiv).hide();
|
|
$(textQuestionSubtitle_previousDiv).hide();
|
|
$(choiceTextField_previousDiv).hide();
|
|
|
|
|
|
var DisplayMark_RawID = "Choice_Question_Display_Marks_Id_" + addChoiceAreaId;
|
|
var DisplayMark_ID = document.getElementById(DisplayMark_RawID)
|
|
|
|
if(questionDisplayMarks === 'false'){
|
|
DisplayMark_ID.checked = false;
|
|
}else{
|
|
DisplayMark_ID.checked = true;
|
|
}
|
|
|
|
var multipleAnswer = 'multipleAnswer_'+addChoiceAreaId;
|
|
if (questionSubType === 'true') {
|
|
$('#'+multipleAnswer).prop('checked', true);
|
|
} else {
|
|
$('#'+multipleAnswer).prop('checked', false);
|
|
}
|
|
|
|
|
|
var choiceid = 'textQuestionName_'+ addChoiceAreaId;
|
|
var inputElement = document.getElementById(choiceid);
|
|
attrId = document.getElementById('textQuestionName_'+ addChoiceAreaId).querySelector('.ql-editor').innerHTML;
|
|
$(inputElement).keyup(function(event) {
|
|
|
|
json2nav();
|
|
clearSidebarWrapper();
|
|
navpane();
|
|
check_Remove_Empty_Question(choiceid);
|
|
// SetQuestionGroupTitle(QuestionGroup_ID,addTextQuestionId);
|
|
|
|
});
|
|
|
|
// function for calling html2json using Mark Calculation
|
|
var choiceQuestionMarkField = 'Choice_Question_Marks_Id_' + addChoiceAreaId;
|
|
$('#'+choiceQuestionMarkField).keyup(function() {
|
|
|
|
json2nav();
|
|
markCalculation();
|
|
|
|
});
|
|
|
|
json2nav();
|
|
clearSidebarWrapper();
|
|
navpane();
|
|
markCalculation();
|
|
|
|
|
|
//function for new ChoiceQuestion add scroll to the ChoiceQuestion prevent default
|
|
var EditScroll = localStorage.getItem('scroll')
|
|
if(EditScroll !== '1')
|
|
{
|
|
const targetId = 'textQuestionName_' + addChoiceAreaId;
|
|
scrollToElementWithoutLink(targetId);
|
|
}
|
|
|
|
|
|
const arrayString = JSON.stringify(array_of_Id);
|
|
collect_Empty_Question_Id(arrayString, choiceid);
|
|
// if (checkchoicequestona != 0) {
|
|
// console.log(checktextquestona);
|
|
// // SetQuestionGroupTitle(QuestionGroup_ID,addChoiceAreaId);
|
|
// }
|
|
|
|
// checkchoicequestona++
|
|
|
|
}
|
|
|
|
//Function for Create a New Choice Field in a Choice Question
|
|
function addNewChoice(NewaddChoiceAreaId = false, focusval = false, choiceName = false, questionRandomNo = false, choiceID = false, choice_mathEnabled= false)
|
|
// function addNewChoice(choiceObj)
|
|
{
|
|
|
|
addChoice = "";
|
|
|
|
const Choice_Group_Dynamic_UUID = uuidv4();
|
|
const text_field_created_time = Date.now();
|
|
var rnd_no = Math.random();
|
|
|
|
addChoice +=
|
|
`<div class="col-lg-12 col-md-4" id="newChoiceGroup_`+text_field_created_time+rnd_no+`">
|
|
<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" style="margin-bottom: 10px">
|
|
<div class="richText" id="newChoiceTextField_`+text_field_created_time+rnd_no+`" contenteditable="true" style=" border: 2px solid #EEECFE; width: 100%; margin-top: 6px;">${choiceName ? choiceName : ""}</div>
|
|
<math-field id="newchoiceTextField_math_`+text_field_created_time+rnd_no+`" style="width: 100%;" contenteditable="true">${choiceName ? choiceName : ""}</math-field>
|
|
</div>
|
|
<div class="items2 col-lg-4">
|
|
<input style="width:14px; height:14px" type="checkbox" id="choice_math_`+text_field_created_time+rnd_no+`"> <span class="math">Math</span>
|
|
<i class="fa fa-trash-o" style="font-size:20px;" aria-hidden="true" id="newChoiceDeleteButton_`+text_field_created_time+rnd_no+`" title="Remove Choice"></i>
|
|
</div>
|
|
</div>
|
|
</div>`
|
|
|
|
if(questionRandomNo)
|
|
{
|
|
var addChoiceAreaId = 'addChoiceArea_'+questionRandomNo;
|
|
var addChoiceAreaId2 = document.getElementById(addChoiceAreaId);
|
|
addChoiceAreaId2.insertAdjacentHTML('beforeend', addChoice);
|
|
}
|
|
else if(NewaddChoiceAreaId)
|
|
{
|
|
NewaddChoiceAreaId.insertAdjacentHTML('beforeend', addChoice);
|
|
}
|
|
|
|
var newChoiceId = document.getElementById('newChoiceTextField_'+text_field_created_time+rnd_no);
|
|
if(focusval !== false)
|
|
{
|
|
newChoiceId.focus(); //these lines are create a new choice field to focus that field
|
|
}
|
|
|
|
var newChoiceCommentButtonId = document.getElementById('newChoiceCommentButton_'+text_field_created_time+rnd_no);
|
|
var newChoiceCommentFieldId = document.getElementById('newChoiceCommentField_'+text_field_created_time+rnd_no);
|
|
var newChoiceCommentFieldDeleteId = document.getElementById('newChoiceGroup_'+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 formbox = document.getElementById('delete_'+text_field_created_time+rnd_no);
|
|
|
|
|
|
//function for delete the choice field
|
|
$(newChoiceDeleteButtonId).on('click', function() {
|
|
|
|
$(newChoiceCommentFieldDeleteId).remove();
|
|
})
|
|
|
|
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();
|
|
|
|
|
|
var choiceid = localStorage.getItem('ChoiceId');
|
|
var ChoiceMathSwitch = 'choice_math_'+text_field_created_time+rnd_no;
|
|
|
|
|
|
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);
|
|
|
|
|
|
if(choice_mathEnabled === "true")
|
|
{
|
|
ChoiceMathSwitchId.checked = true;
|
|
$(newchoiceTextFieldId).hide();
|
|
$(newchoiceTextField_previousDiv).hide();
|
|
$(newchoiceTextField_math_Id).show();
|
|
}
|
|
else{
|
|
ChoiceMathSwitchId.checked = false;
|
|
$(newchoiceTextFieldId).hide();
|
|
$(newchoiceTextField_math_Id).show();
|
|
}
|
|
|
|
ChoiceMathSwitchId.addEventListener("change", function() {
|
|
if (ChoiceMathSwitchId.checked) {
|
|
|
|
$(newchoiceTextFieldId).hide();
|
|
$(newchoiceTextField_previousDiv).hide();
|
|
$(newchoiceTextField_math_Id).show();
|
|
|
|
} else {
|
|
|
|
$(newchoiceTextFieldId).show();
|
|
$(newchoiceTextField_math_Id).hide();
|
|
}
|
|
});
|
|
|
|
if (ChoiceMathSwitchId.checked) {
|
|
|
|
$(newchoiceTextFieldId).hide();
|
|
$(newchoiceTextField_previousDiv).hide();
|
|
$(newchoiceTextField_math_Id).show();
|
|
|
|
} else {
|
|
|
|
$(newchoiceTextFieldId).show();
|
|
$(newchoiceTextField_math_Id).hide();
|
|
}
|
|
|
|
json2nav();
|
|
clearSidebarWrapper();
|
|
navpane();
|
|
|
|
}
|
|
|
|
//Function for Create a New Text Question in the Section and Question Group
|
|
function textQuestion(QuestionObj)
|
|
{
|
|
var group_area_id = ""
|
|
if(QuestionObj.hasOwnProperty('group_question_area_id'))
|
|
{
|
|
group_area_id = document.getElementById(QuestionObj.group_question_area_id);
|
|
}
|
|
else
|
|
{
|
|
group_area_id = false;
|
|
}
|
|
|
|
var textQuestion = "";
|
|
|
|
const Text_Question_UUID = uuidv4();
|
|
const text_field_created_time = Date.now();
|
|
|
|
var addTextQuestionId = ""
|
|
if(QuestionObj.hasOwnProperty('questionRandomNo')) {
|
|
addTextQuestionId = QuestionObj.questionRandomNo;
|
|
} else{
|
|
addTextQuestionId = text_field_created_time;
|
|
}
|
|
|
|
var mathEnabled = "";
|
|
if(QuestionObj.hasOwnProperty('mathEnabled'))
|
|
{
|
|
mathEnabled = QuestionObj.mathEnabled;
|
|
}
|
|
else
|
|
{
|
|
mathEnabled = 'false';
|
|
}
|
|
|
|
|
|
var questionAreaType = "";
|
|
if(QuestionObj.hasOwnProperty('question_area_id')){
|
|
questionAreaID = QuestionObj.question_area_id;
|
|
questionAreaType = questionAreaID.split("_")[0];
|
|
}
|
|
|
|
var lineImg = ''
|
|
|
|
if(questionAreaType === 'group' || group_area_id !== false)
|
|
{
|
|
var lineImg = 'line2.svg';
|
|
}
|
|
else{
|
|
var lineImg = 'line.svg';
|
|
}
|
|
|
|
|
|
|
|
var sectionRandomID = localStorage.getItem('sectionId');
|
|
var QuestionGroup_ID = localStorage.getItem('QuestionGroupId');
|
|
|
|
|
|
textQuestion +=
|
|
`<div class="col-lg-12 question hidedrag element Question-Border-Top" draggable="true" id="removeAndCloneTextQuestion_${addTextQuestionId}" style="" onclick="toggleClasses(this)" onmouseover="showButtons(this)">
|
|
<div class="question-linestyle"><img src="assets/images/${lineImg}"/></div>
|
|
<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 onclick="ReArrangeQuestions(event)" id="forword_${addTextQuestionId}" class="fa fa-chevron-up up-icon" ></i>
|
|
<i onclick="ReArrangeQuestions(event)" id="backword_${addTextQuestionId}" class="fa fa-chevron-down down-icon"></i>
|
|
<i class="fa fa-trash-o" onclick="removeClonedTextQuestion(${addTextQuestionId})" style="font-size:20px;"aria-hidden="true"></i>
|
|
</div>
|
|
|
|
<div class="row" style="text-align:right; width: 100%" id="overallAddButtons_${addTextQuestionId}" >
|
|
<div class="col-lg-10 col-md-12">
|
|
<div class=" button-group align-items-center">
|
|
<div class="addButton buttons" style="display: none;" id="AddButtons_${addTextQuestionId}">
|
|
<div class="col-md-2">
|
|
<div class="addButtonIcons"><img title="TextQuestion" src="assets/images/text.svg" alt="" onclick="addNewQuestions(event, 1)" id="sidetextButton_${sectionRandomID}" title="Text Question"></div>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<div class="addButtonIcons"><img title="ChoiceQuestion" src="assets/images/choice.svg" alt="" onclick="addNewQuestions(event, 2)" id="sidechoiseButton_${sectionRandomID}" title="Choice Question"></div>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<div class="addButtonIcons"><img title="QuestionGroup" src="assets/images/Group.svg" alt="" onclick="addNewGroupQuestions(event, 0)" id="sidegroupQuestionButton_${sectionRandomID}" title="Question Group"></div>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<div class="addButtonIcons"><img title="Section" src="assets/images/section.svg" alt="" onclick="addSection()" id="sidesectionButton_${sectionRandomID}" title="Section"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row" style="text-align:right; width: 100%;" id="overallQuestionGRoupAddButtons_${addTextQuestionId}">
|
|
<div class="col-lg-10 col-md-12">
|
|
<div class=" button-group align-items-center">
|
|
<div class="addButton buttons onhover" style="display: none;" id="QuestionGRoupAddButtons_${addTextQuestionId}">
|
|
<div class="col-md-2">
|
|
<div class="addButtonIcons"><img title="QuestionGroup" src="assets/images/text.svg" alt="" onclick="addNewGroupQuestions(event, 1)" id="textButtonSectionQroupside_${QuestionGroup_ID}" title="Question Group Text Question"></div>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<div class="addButtonIcons"><img title="QuestionGroup" src="assets/images/choice.svg" alt="" onclick="addNewGroupQuestions(event, 2)" id="choiseButtonSectionQroupside_${QuestionGroup_ID}" title="Question Group Choice Question"></div>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<div class="addButtonIcons"><img title="QuestionGroup" src="assets/images/Group.svg" alt="" onclick="MultiLevelQuestionGroup(event)" id="QuestionGroupButtonside_${QuestionGroup_ID}" title="Question Group on Question Group"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-12 col-md-12" style="margin-top: -20px">
|
|
<input type="hidden" id="Text_Question_UUID_ID_${addTextQuestionId}" value="${QuestionObj.hasOwnProperty('questionUUID') ? QuestionObj.questionUUID : Text_Question_UUID}">
|
|
<div class="form_box">
|
|
<label class="titleSpace">Question:<span id='partOf_${addTextQuestionId}'></label>
|
|
<div type="text" class="richText" id="textQuestionName_${addTextQuestionId}" contenteditable="true" style=" border: 2px solid #EEECFE; margin-top: 4px;">${QuestionObj.hasOwnProperty('questionTitle') ? QuestionObj.questionTitle : ''}</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-12 col-md-12 mb-5 hideondrag">
|
|
<div class="form_box">
|
|
<label class="titleSpace">Subtitle:</label>
|
|
<div class="richText" id="textQuestionSubtitle_${addTextQuestionId}" contenteditable="true" style=" border: 2px solid #EEECFE; margin-top: 4px;">${QuestionObj.hasOwnProperty('questionDescription') ? QuestionObj.questionDescription : '' }</div>
|
|
<math-field id="textQuestionSubtitle_math_${addTextQuestionId}" contenteditable="true">${mathEnabled == 'true' ? QuestionObj.questionDescription : ''}</math-field>
|
|
<span class="mathQuestions">Math</span> <input class="checkbox" style="width:14px; height:14px" type="checkbox" id="math_${addTextQuestionId}">
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="col-lg-8 col-md-8 ">
|
|
<div class="type1-switch align-items-center hideondrag float-left" style="display: none;">
|
|
<input type="hidden" value="text" id="question_type_${addTextQuestionId}">
|
|
|
|
<span>Display Marks</span>
|
|
<label class="switch">
|
|
<input type="checkbox" id="Text_Question_Display_Marks_Id_${addTextQuestionId}" checked>
|
|
<span class="slider round"></span>
|
|
</label>
|
|
</div></div>
|
|
|
|
<div class="col-lg-4 col-md-4 hideondrag text" style="margin-left: 65%;">
|
|
<div class="form_box">
|
|
<div style="margin-left: 80px;"> Marks : </div>
|
|
<input type="text" placeholder="" id="Text_Question_Marks_Id_${addTextQuestionId}" value="${QuestionObj.hasOwnProperty('questionMarks') ? QuestionObj.questionMarks : ''}"></input>
|
|
</div>
|
|
</div>
|
|
</div>`;
|
|
|
|
|
|
if(QuestionObj.hasOwnProperty('clone_question_id'))
|
|
{
|
|
var questionDiv = document.getElementById(QuestionObj.clone_question_id);
|
|
questionDiv.insertAdjacentHTML('afterend', textQuestion);
|
|
}
|
|
else if(QuestionObj.hasOwnProperty('section_question_id'))
|
|
{
|
|
var sectionDiv = document.getElementById(QuestionObj.section_question_id);
|
|
sectionDiv.insertAdjacentHTML('beforeend', textQuestion);
|
|
}
|
|
|
|
else if(QuestionObj.hasOwnProperty('question_area_id'))
|
|
{
|
|
var sectionDiv = document.getElementById(QuestionObj.question_area_id);
|
|
sectionDiv.insertAdjacentHTML('beforeend', textQuestion);
|
|
}
|
|
else if(QuestionObj.hasOwnProperty('group_question_area_id'))
|
|
{
|
|
var sectionDiv = document.getElementById(QuestionObj.group_question_area_id);
|
|
sectionDiv.insertAdjacentHTML('beforeend', textQuestion);
|
|
}
|
|
array_of_Id.push('textQuestionName_' + addTextQuestionId);
|
|
|
|
var ChoiceMathSwitch ='math_' + addTextQuestionId;
|
|
var textQuestionSubtitle_math = 'textQuestionSubtitle_math_' + addTextQuestionId;
|
|
var textQuestionSubtitle = 'textQuestionSubtitle_' + addTextQuestionId;
|
|
|
|
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 AddButtons_Raw = 'AddButtons_'+addTextQuestionId;
|
|
var overallAddButtons_Raw = 'overallAddButtons_'+addTextQuestionId;
|
|
var QuestionGroupAddButtons_Raw = 'QuestionGRoupAddButtons_'+addTextQuestionId;
|
|
var overallQuestionGroupAddButtons_Raw = 'overallQuestionGRoupAddButtons_'+addTextQuestionId;
|
|
|
|
var AddButtons_ID = document.getElementById(AddButtons_Raw)
|
|
var QuestionGroupAddButtons_ID = document.getElementById(QuestionGroupAddButtons_Raw)
|
|
var removeAndCloneTextQuestion_ID = document.getElementById(removeAndCloneTextQuestion_Raw);
|
|
|
|
|
|
var questionGroupID = ""
|
|
if(QuestionObj.hasOwnProperty('group_question_area_id'))
|
|
{
|
|
questionGroupID = QuestionObj.group_question_area_id;
|
|
}
|
|
|
|
|
|
if(questionGroupID !== "")//Three button for QuestionGroup
|
|
{
|
|
$('#'+overallQuestionGroupAddButtons_Raw).show();
|
|
$('#'+overallAddButtons_Raw).hide();
|
|
}else{
|
|
|
|
// four button group
|
|
if(questionAreaType === 'group')
|
|
{
|
|
$('#'+overallQuestionGroupAddButtons_Raw).show();
|
|
$('#'+overallAddButtons_Raw).hide();
|
|
}
|
|
else
|
|
{
|
|
$('#'+overallQuestionGroupAddButtons_Raw).hide();
|
|
$('#'+overallAddButtons_Raw).show();
|
|
}
|
|
|
|
}
|
|
|
|
|
|
var removeAndCloneTextQuestion_Raw = 'removeAndCloneTextQuestion_'+addTextQuestionId;
|
|
var AddButtons_Raw = 'AddButtons_'+addTextQuestionId;
|
|
$('#'+removeAndCloneTextQuestion_Raw).mouseenter(function(){
|
|
|
|
|
|
if(questionGroupID !== "")
|
|
{
|
|
add_button_hide_and_show(QuestionGroupAddButtons_Raw);
|
|
}
|
|
else
|
|
{
|
|
if(questionAreaType === 'group')
|
|
{
|
|
add_button_hide_and_show(QuestionGroupAddButtons_Raw);
|
|
}
|
|
else
|
|
{
|
|
add_button_hide_and_show(AddButtons_Raw);
|
|
}
|
|
}
|
|
|
|
})
|
|
$('#'+AddButtons_Raw).hide();
|
|
$('#'+QuestionGroupAddButtons_Raw).hide();
|
|
|
|
|
|
|
|
var typeOneQuestionName = 'textQuestionName_' + addTextQuestionId;
|
|
var quill = new Quill('#'+typeOneQuestionName, {
|
|
theme: 'snow',
|
|
modules: {
|
|
toolbar: toolbarOptions
|
|
},
|
|
|
|
});
|
|
|
|
var typeOneQuestionSubtitle = 'textQuestionSubtitle_' + addTextQuestionId;
|
|
var quill = new Quill('#'+typeOneQuestionSubtitle, {
|
|
theme: 'snow',
|
|
modules: {
|
|
toolbar: toolbarOptions
|
|
},
|
|
});
|
|
|
|
|
|
var textQuestionName_Div = 'textQuestionName_' + addTextQuestionId;
|
|
var textQuestionNewRTEId = 'typeOnetextQuestionName_rtc_' + addTextQuestionId;
|
|
var textQuestionName_previousDiv = $('#'+textQuestionName_Div).prev();
|
|
textQuestionName_previousDiv.attr("id", textQuestionNewRTEId);
|
|
$('#'+textQuestionName_Div).focus(function() {
|
|
|
|
rtc_hide_and_show(textQuestionNewRTEId);
|
|
});
|
|
|
|
|
|
var textQuestionSubtitle_Div = 'textQuestionSubtitle_' + addTextQuestionId;
|
|
var textQuestionSubtitleNewRTEId = 'typeOnetextQuestionSubtitle_rtc_' + addTextQuestionId;
|
|
var textQuestionSubtitle_previousDiv = $('#'+textQuestionSubtitle_Div).prev();
|
|
textQuestionSubtitle_previousDiv.attr("id", textQuestionSubtitleNewRTEId);
|
|
$('#'+textQuestionSubtitle_Div).focus(function() {
|
|
|
|
rtc_hide_and_show(textQuestionSubtitleNewRTEId);
|
|
|
|
});
|
|
|
|
|
|
|
|
// var checkboxElement = document.createElement('input');
|
|
// checkboxElement.type = 'checkbox';
|
|
// checkboxElement.id = 'math_'+addTextQuestionId;
|
|
// checkboxElement.style.width = '14px';
|
|
// checkboxElement.style.height = '14px';
|
|
// var parentElement = document.getElementById(textQuestionSubtitleNewRTEId);
|
|
|
|
|
|
// var labelElement = document.createElement('label');
|
|
// labelElement.htmlFor = 'math_'+addTextQuestionId;
|
|
// labelElement.textContent = 'Math';
|
|
|
|
// console.log(parentElement);
|
|
// parentElement.appendChild(checkboxElement);
|
|
// parentElement.appendChild(labelElement);
|
|
|
|
|
|
|
|
|
|
$(textQuestionName_previousDiv).hide();
|
|
$(textQuestionSubtitle_previousDiv).hide();
|
|
|
|
var displayMArks = ""
|
|
if(QuestionObj.hasOwnProperty('questionDisplayMarks'))
|
|
{
|
|
displayMArks = QuestionObj.questionDisplayMarks;
|
|
}
|
|
else
|
|
{
|
|
displayMArks = false;
|
|
}
|
|
|
|
|
|
var DisplayMark_RawID = "Text_Question_Display_Marks_Id_" + addTextQuestionId;
|
|
var DisplayMark_ID = document.getElementById(DisplayMark_RawID)
|
|
|
|
if(displayMArks === 'false'){
|
|
DisplayMark_ID.checked = false;
|
|
}else{
|
|
DisplayMark_ID.checked = true;
|
|
}
|
|
|
|
|
|
|
|
var Textid = 'textQuestionName_'+ addTextQuestionId;
|
|
var inputElement = document.getElementById(Textid);
|
|
var tempQuestionTitle = inputElement.querySelector('.ql-editor').innerHTML;
|
|
|
|
$(inputElement).keyup(function(event) {
|
|
json2nav();
|
|
clearSidebarWrapper();
|
|
navpane();
|
|
check_Remove_Empty_Question(Textid);
|
|
// SetQuestionGroupTitle(QuestionGroup_ID,addTextQuestionId)
|
|
|
|
|
|
|
|
});
|
|
|
|
// function for calling html2json using Mark Calculation
|
|
var textQuestionMarkField = 'Text_Question_Marks_Id_'+ addTextQuestionId
|
|
$('#'+textQuestionMarkField).keyup(function() {
|
|
|
|
json2nav()
|
|
markCalculation();
|
|
|
|
});
|
|
|
|
json2nav();
|
|
clearSidebarWrapper();
|
|
navpane();
|
|
markCalculation();
|
|
|
|
//function for new TextQuestion add scroll to the TextQuestion prevent default
|
|
|
|
var EditScroll = localStorage.getItem('scroll')
|
|
if(EditScroll !== '1')
|
|
{
|
|
const targetId = 'textQuestionName_' + addTextQuestionId;
|
|
scrollToElementWithoutLink(targetId);
|
|
}
|
|
|
|
const arrayString = JSON.stringify(array_of_Id);
|
|
collect_Empty_Question_Id(arrayString, Textid);
|
|
|
|
// if (checktextquestona != 0) {
|
|
// SetQuestionGroupTitle(QuestionGroup_ID,addTextQuestionId);
|
|
// }
|
|
|
|
// checktextquestona++
|
|
|
|
|
|
}
|
|
|
|
|
|
function SetQuestionGroupTitle(QuestionGroup_ID,QuestionId){
|
|
|
|
json2nav();
|
|
clearSidebarWrapper();
|
|
navpane();
|
|
|
|
// const localquestionGroupID = localStorage.getItem('QuestionGroupId')
|
|
// const jsonvalue = localStorage.getItem('JSON_FOR_NAV')
|
|
// const parsedValue = JSON.parse(jsonvalue);
|
|
// const questionGroupId ='subSection_title_text_'+ localquestionGroupID;
|
|
// const parentList = findParent(parsedValue, questionGroupId);
|
|
|
|
// console.log(parentList)
|
|
|
|
// var removetagvalue = removeHtmlTags(parentList.value2);
|
|
|
|
// if(parentList.value1 != 0 ){
|
|
|
|
// var parOfId = document.getElementById('partOf_'+QuestionId)
|
|
// if(parentList.value1 == 1)
|
|
// {
|
|
// parOfId.innerHTML = questionGroupTitle;
|
|
// questionGroupTitle=removetagvalue;
|
|
// if (questionIncrement != 1) {
|
|
// parOfId.innerHTML = `( part of ${questionGroupTitle})`;
|
|
// questionGroupTitle=removetagvalue;
|
|
// }
|
|
// questionIncrement++
|
|
// }
|
|
|
|
// else{
|
|
// parOfId.innerHTML = `( part of ${questionGroupTitle})`;
|
|
// questionGroupTitle=removetagvalue;
|
|
// }
|
|
|
|
// }
|
|
// else
|
|
// {
|
|
// questionGroupTitle=removetagvalue;
|
|
// }
|
|
|
|
// json2nav();
|
|
// clearSidebarWrapper();
|
|
// navpane();
|
|
|
|
}
|
|
|
|
|
|
//function for find empty question id
|
|
function collect_Empty_Question_Id(arrayString, ID) {
|
|
|
|
const input_text_value = document.getElementById(ID);
|
|
|
|
var attrId = ""
|
|
if(input_text_value !== null)
|
|
{
|
|
attrId = input_text_value.querySelector('.ql-editor').innerHTML;
|
|
}
|
|
else{
|
|
attrId = '<p><br></p>';
|
|
}
|
|
|
|
var value = localStorage.getItem('EditNavExpend');
|
|
if (!value && attrId === '<p><br></p>') {
|
|
|
|
localStorage.setItem('JSON_FOR_EMPTY_QUESTION', arrayString);
|
|
}
|
|
else{
|
|
localStorage.removeItem('JSON_FOR_EMPTY_QUESTION');
|
|
array_of_Id = [];
|
|
}
|
|
}
|
|
|
|
function check_Empty_Question()
|
|
{
|
|
var title_id = localStorage.getItem('JSON_FOR_EMPTY_QUESTION');
|
|
if (title_id) {
|
|
var parsedArray = JSON.parse(title_id);
|
|
|
|
parsedArray.forEach(function(Id, index) {
|
|
attrId = document.getElementById(Id).querySelector('.ql-editor').innerHTML;
|
|
if(attrId === '<p><br></p>')
|
|
{
|
|
scrollToElementWithoutLink(Id);
|
|
document.getElementById(Id).focus();
|
|
}
|
|
});
|
|
}
|
|
}
|
|
|
|
function check_Remove_Empty_Question(IdToRemove) {
|
|
// console.log('IdToRemove : ', IdToRemove);
|
|
array_of_Id = [];
|
|
|
|
var title_id = localStorage.getItem('JSON_FOR_EMPTY_QUESTION');
|
|
// console.log(title_id)
|
|
|
|
var count = "";
|
|
if(title_id !== null && title_id !== '')
|
|
{
|
|
var parsedArray = JSON.parse(title_id);
|
|
var count = parsedArray.length;
|
|
}
|
|
else
|
|
{
|
|
count = 0
|
|
}
|
|
|
|
|
|
|
|
|
|
const input_text_value = document.getElementById(IdToRemove);
|
|
const attrId = input_text_value.querySelector('.ql-editor')?.innerHTML;
|
|
var parsedArray = [];
|
|
if (count !== 0) {
|
|
|
|
parsedArray = JSON.parse(title_id);
|
|
|
|
for (let i = 0; i < parsedArray.length; i++) {
|
|
const Id = parsedArray[i];
|
|
const element = document.getElementById(Id);
|
|
|
|
if (element) {
|
|
const attrId = element.querySelector('.ql-editor')?.innerHTML;
|
|
|
|
if (Id === IdToRemove) {
|
|
if (attrId !== '<p><br></p>' && attrId !== "") {
|
|
parsedArray.splice(i, 1);
|
|
i--;
|
|
}
|
|
|
|
}
|
|
else{
|
|
var newArray = parsedArray.push(IdToRemove);
|
|
const newArrayString = JSON.stringify(newArray);
|
|
collect_Empty_Question_Id(newArrayString);
|
|
}
|
|
}
|
|
}
|
|
const newArrayString = JSON.stringify(parsedArray);
|
|
collect_Empty_Question_Id(newArrayString);
|
|
|
|
} else if(attrId == '<p><br></p>') {
|
|
|
|
var newArray = parsedArray.push(IdToRemove);
|
|
const newArrayString = JSON.stringify(parsedArray);
|
|
collect_Empty_Question_Id(newArrayString);
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//function for Questions REORDER in the SECTION Level
|
|
function ReArrangeQuestions(e){
|
|
|
|
var currentID= e.target.parentElement.parentElement.parentElement.id;
|
|
// console.log(currentID)
|
|
var currentItemID = document.getElementById(currentID);
|
|
// console.log('currentItemID');
|
|
// console.log(currentItemID);
|
|
|
|
if (e.target.classList.contains('up-icon')) {
|
|
|
|
// console.log('FORWORD');
|
|
const question_ListItem = e.target.parentElement.parentElement;
|
|
// console.log('question_ListItem');
|
|
// console.log(question_ListItem);
|
|
|
|
const question_PrevItem = question_ListItem.previousElementSibling;
|
|
// console.log('question_PrevItem');
|
|
// console.log(question_PrevItem );
|
|
|
|
if (question_PrevItem !== null) {
|
|
currentItemID.insertBefore(question_ListItem, question_PrevItem);
|
|
}
|
|
} else if (e.target.classList.contains('down-icon')) {
|
|
|
|
// console.log('BACKWORD');
|
|
const question_ListItem = e.target.parentElement.parentElement;
|
|
// console.log('question_ListItem');
|
|
// console.log(question_ListItem);
|
|
|
|
const question_nextItem = question_ListItem.nextElementSibling;
|
|
// console.log('question_nextItem');
|
|
// console.log(question_nextItem );
|
|
|
|
if (question_nextItem) {
|
|
currentItemID.insertBefore(question_nextItem, question_ListItem);
|
|
}
|
|
}
|
|
json2nav();
|
|
clearSidebarWrapper();
|
|
navpane();
|
|
}
|
|
|
|
//function for REORDER the Question Group in the SECTION Level
|
|
function ReArrangeQuestionsGroup(e){
|
|
|
|
var currentID= e.target.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.id;
|
|
// console.log(currentID)
|
|
var currentItemID = document.getElementById(currentID);
|
|
// console.log('currentItemID');
|
|
// console.log(currentItemID);
|
|
|
|
if (e.target.classList.contains('up-icon')) {
|
|
|
|
// console.log('FORWORD');
|
|
const question_ListItem = e.target.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement;
|
|
// console.log('question_ListItem');
|
|
// console.log(question_ListItem);
|
|
|
|
const question_PrevItem = question_ListItem.previousElementSibling;
|
|
// console.log('question_PrevItem');
|
|
// console.log(question_PrevItem );
|
|
|
|
if (question_PrevItem !== null) {
|
|
currentItemID.insertBefore(question_ListItem, question_PrevItem);
|
|
}
|
|
} else if (e.target.classList.contains('down-icon')) {
|
|
|
|
// console.log('BACKWORD');
|
|
const question_ListItem = e.target.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement;
|
|
// console.log('question_ListItem');
|
|
// console.log(question_ListItem);
|
|
|
|
const question_nextItem = question_ListItem.nextElementSibling;
|
|
// console.log('question_nextItem');
|
|
// console.log(question_nextItem );
|
|
|
|
if (question_nextItem) {
|
|
currentItemID.insertBefore(question_nextItem, question_ListItem);
|
|
}
|
|
}
|
|
json2nav();
|
|
clearSidebarWrapper();
|
|
navpane();
|
|
}
|
|
|
|
//function for Add a new secton, questiongroup and Questions to scroll to go that place
|
|
function scrollToElementWithoutLink(elementId) {
|
|
const element = document.getElementById(elementId);
|
|
if (element) {
|
|
element.scrollIntoView({ behavior: "smooth", block: "center" });
|
|
}
|
|
}
|
|
|
|
//Function for Add Group Question inside the Group QUestion Like Question
|
|
function MultiLevelQuestionGroup(e)
|
|
{
|
|
get_question_area_id = e.target.id;
|
|
var question_group_id = get_question_area_id.split("_")[1];
|
|
var add_question_group_id = 'group_question_area_'+question_group_id;
|
|
|
|
var MultiLevelQuestionGroup_obj = {
|
|
|
|
'add_question_group_id': add_question_group_id
|
|
|
|
}
|
|
|
|
addQuestionGroup(MultiLevelQuestionGroup_obj)
|
|
|
|
|
|
}
|
|
|
|
//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;
|
|
|
|
var sectionQuestionAreaObject = {
|
|
'section_question_id':section_id
|
|
}
|
|
|
|
if(type == 1){
|
|
textQuestion(sectionQuestionAreaObject);
|
|
}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;
|
|
|
|
var group_question_area_id_obj = {'group_question_area_id' : group_question_area_id}
|
|
|
|
if(type == 1){
|
|
textQuestion(group_question_area_id_obj);
|
|
}else if(type == 2){
|
|
groupQuestion(false, false, group_question_area_id);
|
|
}else {
|
|
var question_group_id = 'question_area_'+clone_id;
|
|
|
|
var addNewGroupQuestions_obj = { 'question_group_id': question_group_id }
|
|
addQuestionGroup(addNewGroupQuestions_obj);
|
|
|
|
}
|
|
}
|
|
|
|
//Function for Add Choice Field in the Choice Question Area
|
|
function ConstructAddNewChoiceID(e){
|
|
|
|
var addChoiceArea = e.target.id;
|
|
var addChoiceAreaTime = addChoiceArea.split("_")[1];
|
|
var addChoiceAreaId = 'addChoiceArea_'+addChoiceAreaTime;
|
|
var addChoiceAreaId2 = document.getElementById(addChoiceAreaId);
|
|
addNewChoice(addChoiceAreaId2, 1)
|
|
|
|
}
|
|
|
|
// 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();
|
|
json2nav();
|
|
clearSidebarWrapper();
|
|
navpane();
|
|
}
|
|
}
|
|
|
|
// remove the cloned choice or group type questions function
|
|
function removeClonedQroupQuestion(index)
|
|
{
|
|
var element = document.getElementById('removeAndCloneQroupQuestion_'+ index);
|
|
if (element) {
|
|
element.remove();
|
|
json2nav();
|
|
clearSidebarWrapper();
|
|
navpane();
|
|
}
|
|
}
|
|
|
|
// remove the section
|
|
function removeSection(RandomId, IndexValue) {
|
|
|
|
var element = document.getElementById('reorder_'+ RandomId);
|
|
|
|
var jsonData = JSON.parse(localStorage.getItem('JSON_FOR_NAV'));
|
|
var count = jsonData.sections.length;
|
|
console.log(`Count of sections: ${count}`);
|
|
|
|
if(count > 1)
|
|
{
|
|
Swal.fire({
|
|
title: 'Are you sure to Delete this Section?',
|
|
text: "You won't be able to revert this!",
|
|
icon: 'warning',
|
|
showCancelButton: true,
|
|
confirmButtonColor: '#3085d6',
|
|
cancelButtonColor: '#d33',
|
|
confirmButtonText: 'Yes, delete it!'
|
|
}).then((result) => {
|
|
if (result.isConfirmed) {
|
|
if (element) {
|
|
element.remove();
|
|
|
|
json2nav();
|
|
clearSidebarWrapper();
|
|
navpane();
|
|
}
|
|
}
|
|
})
|
|
|
|
}
|
|
else{
|
|
|
|
Swal.fire(
|
|
'Cannot Delete!',
|
|
'Atleast one Section should Remain',
|
|
'warning'
|
|
);
|
|
}
|
|
|
|
}
|
|
|
|
// remove the Question Group type questions function
|
|
function removeQuestionGroup(index) {
|
|
|
|
var element = document.getElementById('draggedGroup_'+ index);
|
|
Swal.fire({
|
|
title: 'Are you sure to Delete this Question Group?',
|
|
text: "You won't be able to revert this!",
|
|
icon: 'warning',
|
|
showCancelButton: true,
|
|
confirmButtonColor: '#3085d6',
|
|
cancelButtonColor: '#d33',
|
|
confirmButtonText: 'Yes, delete it!'
|
|
}).then((result) => {
|
|
if (result.isConfirmed) {
|
|
if (element) {
|
|
element.remove();
|
|
console.log("pjm;lkm");
|
|
json2nav();
|
|
clearSidebarWrapper();
|
|
navpane();
|
|
}
|
|
}
|
|
})
|
|
// console.log('o;ijkom');
|
|
|
|
}
|
|
|
|
function removeHtmlTags(inputString) {
|
|
|
|
const $ = cheerio.load(inputString);
|
|
const text = $.text();
|
|
|
|
return text;
|
|
}
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
let draggedItemGroup = null;
|
|
let draggedItemQuestion = null;
|
|
let dropTarget = null;
|
|
|
|
// Event listener for .drag-handle elements within questions
|
|
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) {
|
|
// console.log("draggHandle:",dragHandle);
|
|
// 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);
|
|
// console.log(draggedItemQuestion.id);
|
|
|
|
|
|
});
|
|
}
|
|
}
|
|
});
|
|
|
|
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();
|
|
|
|
// 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 .question
|
|
const richTextElements = document.querySelectorAll('.hideondrag');
|
|
richTextElements.forEach((element) => {
|
|
element.style.display = '';
|
|
});
|
|
|
|
// Reset variables
|
|
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;
|
|
json2nav();
|
|
clearSidebarWrapper();
|
|
navpane();
|
|
} 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;
|
|
json2nav();
|
|
clearSidebarWrapper();
|
|
navpane();
|
|
} 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>
|
|
|
|
<script>
|
|
|
|
// Function to execute the script and display its output in the popup
|
|
function executeScriptAndDisplayOutput() {
|
|
// console.log("dddddddddddddddddddddddddddddddddddddddddddddddddddd");
|
|
const popups = document.getElementById("output");
|
|
popups.innerHTML = "";
|
|
// 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>
|
|
|
|
<script>
|
|
function clearClipboardAttributes() {
|
|
const apaste = document.getElementsByClassName('ql-clipboard')
|
|
for (var i = 0; i < apaste.length; i++) {
|
|
apaste[i].attributes[2].value='';
|
|
}
|
|
}
|
|
setInterval(clearClipboardAttributes, 2000);
|
|
|
|
</script>
|
|
<script>
|
|
|
|
function removeQlBlank(){
|
|
$('.ql-blank').removeClass('ql-blank');
|
|
}
|
|
setInterval(removeQlBlank,2000)
|
|
</script>
|
|
<!--
|
|
<script>
|
|
quill.on('editor-change', function(eventName, ...args) {
|
|
if (eventName === 'text-change' && args[1].ops) {
|
|
args[1].ops.forEach(function(op) {
|
|
if (op.insert && op.insert.image) {
|
|
// Handle image insertion
|
|
var imageUrl = op.insert.image;
|
|
console.log('Image inserted:', imageUrl);
|
|
}
|
|
});
|
|
}
|
|
});
|
|
</script> -->
|
|
|
|
|
|
<!-- <script>
|
|
function removebold(){
|
|
var removebold = document.getElementsByClassName('section main-heading')
|
|
console.log(removebold[0].innerHTML);
|
|
// removebold[0].innerHTML=removebold[0].innerHTML.replace('<strong>','').replace('</strong>','')
|
|
// console.log(removebold[0].innerHTML.replace('<strong>','').replace('</strong>',''));
|
|
|
|
}
|
|
setInterval(removebold, 1000)
|
|
</script> -->
|
|
</body>
|
|
</html>
|