Free javascript Hosting


u-survey.js

Uploaded on Sep 20 2021 06:18 by santosdboss

let mcqContainer = document.querySelector("#mcq");
let qaaContainer = document.querySelector("#qaa");
let message = document.querySelector("#message");
let timeDisplay = document.querySelector("#timecount");
let timeText = document.querySelector("#timetext");
let nextBtn = document.querySelector("#nextbutton");
let goNext = document.querySelector("#gonext");

let proceedText = document.querySelector("#proceedtext");
let proceedBtn = document.querySelector("#proceed");
let proceedCon = document.querySelector("#proceedcon");
let proceedInst = document.querySelector("#proceedinst");

let submitCon = document.querySelector("#submitsurvey");

const TIME_PER_PAGE = 50;
var timeCounter = TIME_PER_PAGE;
var T;
var Next;
var mcqs = 0;
var qaas = 0;

function nextButton(){
timeCounter--;

if(timeCounter <= 0){
window.clearInterval(Next);
timeCounter = TIME_PER_PAGE;
timeText.classList.toggle("d-none");
nextBtn.classList.toggle("d-none");
}
timeDisplay.textContent = timeCounter+"";
}

function removeProceed(subcat){
message.textContent="";
proceedText.textContent="";
proceedBtn.textContent="";
if(!proceedCon.classList.contains("d-none")){
proceedCon.classList.toggle("d-none");
}
if(!proceedInst.classList.contains("d-none")){
proceedInst.classList.toggle("d-none");
}

fetchData(subcat);
}

function displaySubmit(){
clearDiv();
goNext.classList.add("d-none");
if(submitCon.classList.contains("d-none")){
submitCon.classList.toggle("d-none");
}
}

function completeSurvey(){
const url = '/surveysubmit';

let request = new Request(url, {
method: 'GET'
});

fetch(request)
.then(response => response.json())
.then(data => {
// if(data['msg'] == "completed")
//getBonusPrice();
})
.catch(error => {
console.error('Error:', error);
});

if(!submitCon.classList.contains("d-none")){
submitCon.classList.toggle("d-none");
}

if(proceedCon.classList.contains("d-none")){
proceedCon.classList.toggle("d-none");
proceedText.textContent="Your Survey Has Been Submitted Successfully";
proceedBtn.textContent="Proceed to Next Survey";
}
if(proceedInst.classList.contains("d-none")){
proceedInst.classList.toggle("d-none");
}

message.textContent="Survey completed";
}

function fetchData(subcat) {
if(document.forms["form"]["radio0"]){
if(!validateForm()){
return;
}
mcqs = 0;
qaas = 0;
}
const url = '/surveyupdate?subcategory='+subcat;

let request = new Request(url, {
method: 'GET'
});

fetch(request)
.then(response => response.json())
.then(dataArray => {
// removeLoader(document.getElementById("save"+id));
if(dataArray.data == null){
displaySubmit();

if(dataArray.price != 0){
showPopUp(dataArray.price);
}
}
else {
message.textContent="";
updateSurvey(dataArray.data);
toggleDisplays();

if(dataArray.price != 0){
showPopUp(dataArray.price);
}
}
})
.catch(error => {
console.error('Error:', error);
clearDiv();
});
}

function showPopUp(price){
var bonus = document.getElementById("bonusprice");
bonus.textContent = price;
var popup = document.getElementById("myPopup");
popup.classList.toggle("show");
T = window.setTimeout(myFunction, 3000);
}





function toggleDisplays(){
if(goNext.classList.contains("d-none")){
goNext.classList.toggle("d-none");
}

if(Next){
clearInterval(Next);
timeCounter = TIME_PER_PAGE;
}
Next = setInterval(nextButton,1000);

timeText.classList.toggle("d-none");
nextBtn.classList.toggle("d-none");
}
















function updateSurvey(dataArray){
clearDiv();

dataArray.forEach((data, index) => {
if(data.type == "mcq"){
seedMCQ(data, index);
mcqs++;
}
else {
seedQAA(data, index);
qaas++;
}
});
}














function clearDiv(){
var child = mcqContainer.lastElementChild;
while (child) {
mcqContainer.removeChild(child);
child = mcqContainer.lastElementChild;
}
var child2 = qaaContainer.lastElementChild;
while (child2) {
qaaContainer.removeChild(child2);
child2 = qaaContainer.lastElementChild;
}
}

function seedMCQ(data, index){

let div1 = document.createElement('div');
div1.classList.add('container');
div1.classList.add('my-1');

let div2 = document.createElement('div');
div2.classList.add('question');
div2.classList.add('pt-2');
div2.classList.add('pl-sm-5');
div2.classList.add('ml-sm-5');

let div3 = document.createElement('div');
div3.classList.add('py-2');
div3.classList.add('h5');

let b1 = document.createElement('b');
b1.textContent = data.question;

let div4 = document.createElement('div');
div4.id="options";
div4.classList.add('ml-md-3');
div4.classList.add('ml-sm-3');
div4.classList.add('pl-md-5');
div4.classList.add('pt-sm-0');
div4.classList.add('pt-3');


//add all options
let label1 = document.createElement('label');
label1.classList.add('options')

let input1 = document.createElement('input');
input1.type="radio";
input1.name="radio"+index;
input1.required=true;

let span1 = document.createElement('span');
span1.classList.add('checkmark');
let text1 = document.createTextNode(data.answer_a);

label1.append(text1);
label1.appendChild(input1);
label1.appendChild(span1);

let label2 = document.createElement('label');
label2.classList.add('options')

let input2 = document.createElement('input');
input2.type="radio";
input2.name="radio"+index;
input2.required=true;

let span2 = document.createElement('span');
span2.classList.add('checkmark');
let text2 = document.createTextNode(data.answer_b);

label2.append(text2);
label2.appendChild(input2);
label2.appendChild(span2);

let label3 = document.createElement('label');
label3.classList.add('options')

let input3 = document.createElement('input');
input3.type="radio";
input3.name="radio"+index;
input3.required=true;

let span3 = document.createElement('span');
span3.classList.add('checkmark');
let text3 = document.createTextNode(data.answer_c);

label3.append(text3);
label3.appendChild(input3);
label3.appendChild(span3);

let label4 = document.createElement('label');
label4.classList.add('options')

let input4 = document.createElement('input');
input4.type="radio";
input4.name="radio"+index;
input4.required=true;

let span4 = document.createElement('span');
span4.classList.add('checkmark');
let text4 = document.createTextNode(data.answer_d);

label4.append(text4);
label4.appendChild(input4);
label4.appendChild(span4);

div4.appendChild(label1);
div4.appendChild(label2);
div4.appendChild(label3);
div4.appendChild(label4);

div3.appendChild(b1);

div2.appendChild(div3);
div2.appendChild(div4);

div1.appendChild(div2);

mcqContainer.appendChild(div1);
}

function seedQAA(data, index){
let div1 = document.createElement('div');
div1.classList.add('formthree');
div1.classList.add('my-1');

let div2 = document.createElement('div');
div2.classList.add('container');

let div3 = document.createElement('div');
div3.classList.add('row');
div3.classList.add('justify-content-center');

let div4 = document.createElement('div');
div4.classList.add('col-md-6');

let div5 = document.createElement('div');
div5.classList.add('px-2');

let p1 = document.createElement('p');
p1.textContent = data.question;

div5.appendChild(p1);

let div6 = document.createElement('div');
div6.classList.add('form-group');

let label1 = document.createElement('label');
label1.classList.add('sr-only');
label1.textContent = "Answer";

let input1 = document.createElement('input');
input1.type="text";
input1.classList.add("form-control");
input1.placeholder="Answer Here";
input1.name = "input"+index;
input1.required=true;

div6.appendChild(label1);
div6.appendChild(input1);

div4.appendChild(div5);
div4.appendChild(div6);

div3.appendChild(div4);

div2.appendChild(div3);

div1.appendChild(div2);

qaaContainer.appendChild(div1);
}


function validateForm()
{

var fields = [];
for(var i = 0; i < mcqs; i++){
fields.push("radio"+i);
}
for(var i = mcqs; i < (qaas+mcqs); i++){
fields.push("input"+i);
}

var fieldname;

for (var i = 0; i < fields.length; i++) {
fieldname = fields[i];
if (document.forms["form"][fieldname].value === "") {
alert("A question is not answered");
return false;
}
}


return true;
}


function myFunction() {
if(T){
window.clearTimeout(T);
var popup = document.getElementById("myPopup");
popup.classList.toggle("show");
}
}

Back to list