server.conversionrate.top
Open in
urlscan Pro
185.25.117.0
Public Scan
Submitted URL: http://server.conversionrate.top/surveyrun
Effective URL: https://server.conversionrate.top/surveyrun
Submission: On October 07 via manual from GB — Scanned from GB
Effective URL: https://server.conversionrate.top/surveyrun
Submission: On October 07 via manual from GB — Scanned from GB
Form analysis 0 forms found in the DOM
Text Content
/* eslint-disable */
// @ts-nocheck
;
(function () {
let server = 'https://server.conversionrate.top';
if (window.location.href.includes('localhost')) {
server = 'http://localhost:4000';
}
const ID = window.CRSSurveyID;
const svgObj = {
plus: /* html */ `
<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 10 10">
<path d="M9.00004 5.66658H5.66671V8.99992C5.66671 9.36658 5.36671 9.66658 5.00004 9.66658C4.63337 9.66658 4.33337 9.36658 4.33337 8.99992V5.66658H1.00004C0.633374 5.66658 0.333374 5.36658 0.333374 4.99992C0.333374 4.63325 0.633374 4.33325 1.00004 4.33325H4.33337V0.999919C4.33337 0.633252 4.63337 0.333252 5.00004 0.333252C5.36671 0.333252 5.66671 0.633252 5.66671 0.999919V4.33325H9.00004C9.36671 4.33325 9.66671 4.63325 9.66671 4.99992C9.66671 5.36658 9.36671 5.66658 9.00004 5.66658Z"/>
</svg>
`,
close: /* html */ `
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
<g clip-path="url(#clip0_34_28114)">
<path d="M12.2 3.80665C11.94 3.54665 11.52 3.54665 11.26 3.80665L7.99998 7.05998L4.73998 3.79998C4.47998 3.53998 4.05998 3.53998 3.79998 3.79998C3.53998 4.05998 3.53998 4.47998 3.79998 4.73998L7.05998 7.99998L3.79998 11.26C3.53998 11.52 3.53998 11.94 3.79998 12.2C4.05998 12.46 4.47998 12.46 4.73998 12.2L7.99998 8.93998L11.26 12.2C11.52 12.46 11.94 12.46 12.2 12.2C12.46 11.94 12.46 11.52 12.2 11.26L8.93998 7.99998L12.2 4.73998C12.4533 4.48665 12.4533 4.05998 12.2 3.80665Z"/>
</g>
<defs>
<clipPath id="clip0_34_28114">
<rect width="16" height="16" fill="white"/>
</clipPath>
</defs>
</svg>
`,
minus: /* html */ `
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
<g clip-path="url(#clip0_34_28111)">
<path d="M12 8.66659H4.00004C3.63337 8.66659 3.33337 8.36659 3.33337 7.99992C3.33337 7.63325 3.63337 7.33325 4.00004 7.33325H12C12.3667 7.33325 12.6667 7.63325 12.6667 7.99992C12.6667 8.36659 12.3667 8.66659 12 8.66659Z" />
</g>
<defs>
<clipPath id="clip0_34_28111">
<rect width="16" height="16" fill="white"/>
</clipPath>
</defs>
</svg>
`
};
const $el = (selector) => document.querySelector(selector);
const $$el = (selector) => document.querySelectorAll(selector);
class Survey {
constructor(surveyData) {
this.preview = window.location.pathname.includes('/preview_survey');
this.device = window.innerWidth < 500 ? 'mobile' : 'desktop';
this.surveyData = surveyData;
this.questions = surveyData.questions;
this.settings = surveyData.settings;
this.styles = surveyData.styles;
this.start = this.checkInitial();
this.user = this.checkUser();
if (!this.start)
return;
this.startScheme();
}
startScheme() {
if (this.settings.duration?.status) {
setTimeout(() => {
this.init();
}, this.settings.duration.value * 1000);
}
if (this.settings.exitIntent?.status) {
if (this.device === 'desktop') {
document.addEventListener('mouseleave', () => {
this.init();
});
}
else {
checkScrollSpeed(window, (speed) => {
if (speed > +this.settings.exitIntent.value) {
this.init();
}
});
function checkScrollSpeed(selector, callback) {
const block = selector === window ? window : document.querySelector(selector);
let lastPos, newPos, timer, delta;
function clear() {
lastPos = null;
delta = 0;
}
clear();
block.addEventListener('scroll', function () {
newPos = selector === window ? this.scrollY : this.scrollTop;
if (lastPos != null) {
delta = newPos - lastPos;
}
lastPos = newPos;
clearTimeout(timer);
timer = setTimeout(clear, 50);
callback(Math.abs(delta));
});
}
}
}
if (!this.settings.exitIntent?.status && !this.settings.duration?.status) {
this.init();
}
}
init() {
if (!$el('#crs_survey')) {
this.renderBaseBlock();
this.survey = $el('#crs_survey');
this.surveyHead = $el('#crs_survey .crs_head p:first-of-type');
this.surveyMain = $el('#crs_survey .crs_main');
this.surveyQuestion = $el('#crs_survey .crs_question');
this.surveyAnswers = $el('#crs_survey .crs_answers');
this.surveyFooter = $el('#crs_survey .crs_footer');
this.surveyThanks = $el('#crs_survey .crs_thanks');
this.surveyClose = $el('#crs_survey .crs_head p:last-of-type .survey_close');
this.surveyCollapse = $el('#crs_survey .crs_head p:last-of-type .survey_collapse');
this.surveySubmit = $el('#crs_survey .crs_submit');
setTimeout(() => {
this.survey.classList.add('animate');
}, 100);
this.steps = [];
this.currentQuestion = 0;
this.questionId = null;
this.questionType = null;
this.answerId = null;
this.bindEvents();
this.drawQuestion();
}
}
renderBaseBlock() {
const s = this.styles;
const style = /* html */ `
<style>
#crs_survey, #crs_survey * {
font-family: 'Roboto', sans-serif;
margin: 0;
padding: 0;
box-sizing: border-box;
}
#crs_survey {
position: fixed;
${s.positionHorizontal || 'left'}: ${s.distanceToSide ? s.distanceToSide + 'px' : '100px'};
${s.positionVertical || 'bottom'}: ${s.positionVerticalSize || '0'};
width: 100%;
max-width: 300px;
padding: 20px;
box-shadow: 0px 2px 6px 2px rgba(0, 0, 0, 0.15), 0px 1px 2px 0px rgba(0, 0, 0, 0.20);
border-radius: 8px;
background-color: ${s.bgMainColor || '#FFFFFF'};
z-index: 9999999999;
transition: all 0.5s ease-in-out;
${s.animation === 'fade' ? 'opacity: 0;' : ''}
${s.animation === 'slide' ? 'transform: translateY(100%);' : ''}
}
#crs_survey.animate {
${s.animation === 'fade' ? 'opacity: 1;' : ''}
${s.animation === 'slide' ? 'transform: translateY(0);' : ''}
}
#crs_survey.closed {
background-color: ${s.bgCloseColor || '#5C51A5'};
color: #FFFFFF;
padding: 12px 20px;
}
#crs_survey.opened {
border: 1px solid #E7E7EB;
}
#crs_survey.closed :is(.crs_footer, .crs_main, .crs_thanks) {
display: none !important;
}
#crs_survey .crs_head p:first-of-type {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 14px;
font-weight: 600;
line-height: 16px;
cursor: pointer;
color: ${s.textCloseColor || '#FFFFFF'};
}
#crs_survey .crs_head p:first-of-type svg {
fill: ${s.textCloseColor || '#FFFFFF'}
}
#crs_survey .crs_head p:last-of-type {
display: flex;
justify-content: flex-end;
align-items: center;
gap: 20px;
margin-bottom: 8px;
}
#crs_survey .crs_head p:last-of-type svg {
fill: ${s.submitBgColor || '#5C51A5'}
}
#crs_survey.closed .crs_head p:last-of-type, #crs_survey.opened .crs_head p:first-of-type {
display: none;
}
#crs_survey .crs_head p:last-of-type span {
cursor: pointer;
}
#crs_survey .crs_footer {
font-size: 12px;
font-weight: 400;
line-height: 16px;
color: ${s.questionColor || '#4B4667'};
display: ${!s.poweredBy ? 'none' : 'block'};
}
#crs_survey .crs_footer a {
color: #5C51A5;
text-decoration: underline;
}
#crs_survey .crs_thanks {
display: none;
font-size: 16px;
font-weight: 700;
line-height: 20px;
margin: 20px 0;
text-align: center;
color: ${s.questionColor || '#4B4667'};
}
#crs_survey .crs_submit {
width: 100%;
padding: 8px;
margin: 12px 0;
border: none;
border-radius: 4px;
background-color: ${s.submitBgColor || '#5C51A5'};
color: ${s.submitTextColor || '#FFFFFF'};
font-size: 16px;
font-weight: 600;
line-height: 16px;
cursor: pointer;
}
#crs_survey .crs_submit:disabled {
background-color: rgba(92, 81, 165, 0.70);
}
#crs_survey .crs_question {
font-size: 14px;
font-weight: 600;
line-height: 16px;
margin-bottom: 12px;
color: ${s.questionColor || '#4B4667'};
}
#crs_survey .crs_answers {
display: flex;
flex-direction: column;
gap: 4px;
max-height: 100px;
overflow-y: auto;
}
#crs_survey .crs_answers::-webkit-scrollbar {
width: 4px;
}
#crs_survey .crs_answers::-webkit-scrollbar-thumb {
background-color: ${s.submitBgColor || '#5C51A5'};
border-radius: 2px;
}
#crs_survey .crs_answers::-webkit-scrollbar-track {
background-color: #E7E7EB;
border-radius: 2px;
}
#crs_survey .crs_answers label {
position: relative;
}
#crs_survey .crs_answers label p {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 8px;
font-size: 14px;
font-weight: 400;
line-height: 16px;
color: ${s.answerColor || '#4B4667'};
padding: 10px;
border-radius: 4px;
border: 1px solid #E7E7EB;
cursor: pointer;
background-color: ${s.bgAnswerColor || 'transparent'};
}
#crs_survey .crs_answers label p.error,
#crs_survey .crs_answers label textarea.error,
#crs_survey .crs_answers > textarea.error {
border: 1px solid ${s.errorColor || 'rgba(235, 87, 87, 1)'};
}
#crs_survey .crs_answers label input {
height: 1px;
width: 1px;
opacity: 0;
position: absolute;
}
#crs_survey .crs_answers label span:first-of-type {
height: 16px;
width: 16px;
display: flex;
border: 1px solid ${s.answerColor || '#4B4667'};
position: relative;
}
#crs_survey .crs_answers label span:last-of-type {
width: calc(100% - 24px);
}
#crs_survey .crs_answers label input[type="radio"]+p span:first-of-type {
border-radius: 50%;
}
#crs_survey .crs_answers label input[type="checkbox"]+p span:first-of-type {
border-radius: 4px;
}
#crs_survey .crs_answers label input:checked+p span:first-of-type::after {
content: '';
height: 8px;
width: 8px;
background-color: ${s.answerColor || '#4B4667'};
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
#crs_survey .crs_answers label input[type="radio"]:checked+p span:first-of-type::after {
border-radius: 50%;
}
#crs_survey .crs_answers label input[type="checkbox"]:checked+p span:first-of-type::after {
border-radius: 1px;
}
#crs_survey .crs_answers textarea {
border-radius: 2px;
border: 1px solid #E7E7EB;
background: #F0F0F0;
padding: 4px;
font-size: 12px;
line-height: 20px;
color: #545454;
width: 100%;
height: 100px;
resize: none;
outline: none;
}
#crs_survey .crs_answers textarea::placeholder {
color: #ADADAD;
}
#crs_survey .crs_answers label p textarea {
display: none;
margin-left: 24px;
height: 40px;
}
#crs_survey .crs_answers label input:checked+p textarea {
display: block;
}
@media (max-width: 500px) {
#crs_survey {
width: 100%;
left: 0;
max-width: 100%;
}
}
${s.customStyle || ''}
</style>
`;
const set = this.settings;
const surveyBlock = /* html */ `
<div id="crs_survey" class="${(set.desktopFull && this.device === 'desktop') || (set.mobileFull && this.device === 'mobile')
? 'opened'
: 'closed'}">
<div class="crs_head">
<p>${set.minimalText || 'Please answer our short survey'} <span class="plus">${svgObj.plus}</span></p>
<p>
<span class="survey_collapse">${svgObj.minus}</span>
<span class="survey_close">${svgObj.close}</span>
</p>
</div>
<div class="crs_main">
<p class="crs_question">
Question example
</p>
<div class="crs_answers">
</div>
<button class="crs_submit">${s.submitText || 'Submit'}</button>
</div>
<div class="crs_thanks">
<p>${set.finishText || 'Thank you for answering this Survey. Your feedback is highly appreciated!'}</p>
</div>
<div class="crs_footer">
Powered by
<a href="https://conversionrate.store">Сonversionrate.store</a>
</div>
</div>
`;
document.body.insertAdjacentHTML('beforeend', surveyBlock);
document.head.insertAdjacentHTML('beforeend', style);
}
bindEvents() {
this.surveyHead.addEventListener('click', () => {
this.survey.classList.remove('closed');
this.survey.classList.add('opened');
});
this.surveyCollapse.addEventListener('click', () => {
this.survey.classList.remove('opened');
this.survey.classList.add('closed');
});
this.surveyClose.addEventListener('click', () => {
this.survey.style.display = 'none';
if (!this.preview) {
document.cookie = `crs_survey=1; max-age=${60 * 60 * 24 * 14}; path=/`;
}
});
this.surveySubmit.addEventListener('click', () => {
this.checkAnswer();
});
}
drawQuestion() {
let finish = true;
this.questions.forEach((question, idx) => {
if (idx === this.currentQuestion) {
this.questionId = question._id;
finish = false;
this.steps.push(this.currentQuestion);
this.surveyQuestion.innerText = question.text;
this.surveyAnswers.innerHTML = '';
this.questionType = question.type;
switch (question.type) {
case 'single':
let radioList = question.answers
.map((answer) => {
return /* html */ `
<label>
<input type="radio" name="answer" value="${answer.text}" data-next="${answer.nextQ}" ${answer.ownAnswer ? 'data-own' : ''}>
<p>
<span></span>
<span>${answer.text}</span>
${answer.ownAnswer
? `<textarea type="text" name="ownAnswer" placeholder="${this.styles.textareaPlaceholder || 'Type your answer'}"></textarea>`
: ''}
</p>
</label>
`;
})
.join('');
this.surveyAnswers.innerHTML = radioList;
this.surveyAnswers.querySelectorAll('input[type="radio"]').forEach((item) => {
item.addEventListener('change', (e) => {
this.surveyAnswers.querySelectorAll('label p').forEach((p) => {
p.classList.remove('error');
});
});
});
if (this.surveyAnswers.querySelector('input[data-own]')) {
this.surveyAnswers.querySelector('textarea').addEventListener('input', (e) => {
e.target.classList.remove('error');
});
}
break;
case 'multiple':
let checkboxList = question.answers
.map((answer) => {
return /* html */ `
<label>
<input type="checkbox" name="answer" value="${answer.text}" data-next="${answer.nextQ}" ${answer.ownAnswer ? 'data-own' : ''}>
<p>
<span></span>
<span>${answer.text}</span>
${answer.ownAnswer
? `<textarea type="text" name="ownAnswer" placeholder="${this.styles.textareaPlaceholder || 'Type your answer'}"></textarea>`
: ''}
</p>
</label>
`;
})
.join('');
this.surveyAnswers.innerHTML = checkboxList;
this.surveyAnswers.querySelectorAll('input[type="checkbox"]').forEach((item) => {
item.addEventListener('change', (e) => {
this.surveyAnswers.querySelectorAll('label p').forEach((p) => {
p.classList.remove('error');
});
});
});
if (this.surveyAnswers.querySelector('input[data-own]')) {
this.surveyAnswers.querySelector('textarea').addEventListener('input', (e) => {
e.target.classList.remove('error');
});
}
break;
case 'text':
this.surveyAnswers.innerHTML = /* html */ `
<textarea id="id" placeholder="${this.styles.textareaPlaceholder || 'Type your answer'}"></textarea>
`;
this.surveyAnswers.querySelector('textarea').addEventListener('input', (e) => {
e.target.classList.remove('error');
});
break;
default:
break;
}
}
});
if (finish) {
this.surveyMain.style.display = 'none';
this.surveyThanks.style.display = 'block';
this.surveyCollapse.style.display = 'none';
setTimeout(() => {
this.survey.style.display = 'none';
if (!this.preview) {
document.cookie = `crs_survey=1; max-age=${60 * 60 * 24 * 14}; path=/`;
}
}, 3000);
}
}
checkInitial() {
if (!this.preview && this.surveyData.status !== 'active') {
return false;
}
const crs_survey = document.cookie.split(';').filter((item) => item.includes('crs_survey'));
let start = true;
if (crs_survey.length > 0) {
start = false;
}
if (this.settings.devices !== this.device && this.settings.devices !== 'all') {
start = false;
}
this.checkTargetPage() ? '' : (start = false);
return start;
}
checkTargetPage() {
const target = this.settings.target;
const currentPage = {
url: window.location.href,
path: window.location.pathname
};
let ruleAnd = true;
if (this.preview)
return true;
target.forEach((item) => {
let ruleOr = false;
item.value.forEach((v) => {
switch (item.rule) {
case 'contains':
currentPage[item.type].includes(v) ? (ruleOr = true) : null;
break;
case 'not_contains':
!currentPage[item.type].includes(v) ? (ruleOr = true) : null;
break;
case 'equals':
currentPage[item.type] === v ? (ruleOr = true) : null;
break;
case 'not_equals':
currentPage[item.type] !== v ? (ruleOr = true) : null;
break;
case 'regex':
new RegExp(v).test(currentPage[item.type]) ? (ruleOr = true) : null;
break;
default:
break;
}
});
if (!ruleOr)
ruleAnd = false;
});
return ruleAnd;
}
checkAnswer() {
let answer = null;
let nextQuestion = null;
if (this.questionType === 'text') {
const textarea = this.surveyAnswers.querySelector('textarea');
if (textarea.value === '') {
textarea.classList.add('error');
return;
}
else {
answer = textarea.value;
}
}
else if (this.questionType === 'single') {
const radio = this.surveyAnswers.querySelectorAll('input[type="radio"]:checked');
const inputs = this.surveyAnswers.querySelectorAll('label p');
if (radio.length === 0) {
inputs.forEach((item) => {
item.classList.add('error');
});
return;
}
else if (radio[0].dataset.own === '' && radio[0].closest('label').querySelector('textarea').value === '') {
radio[0].closest('label').querySelector('textarea').classList.add('error');
return;
}
else {
if (radio[0].dataset.own === '') {
answer = radio[0].closest('label').querySelector('textarea').value;
}
else {
answer = radio[0].value;
}
nextQuestion = +radio[0].dataset.next;
}
}
else if (this.questionType === 'multiple') {
const checkbox = this.surveyAnswers.querySelectorAll('input[type="checkbox"]:checked');
const inputs = this.surveyAnswers.querySelectorAll('label p');
const own = this.surveyAnswers.querySelectorAll('input[type="checkbox"][data-own]:checked');
if (checkbox.length === 0) {
inputs.forEach((item) => {
item.classList.add('error');
});
return;
}
else if (own.length > 0 && own[0].closest('label').querySelector('textarea').value === '') {
own[0].closest('label').querySelector('textarea').classList.add('error');
return;
}
else {
answer = '';
nextQuestion = +checkbox[0].dataset.next;
checkbox.forEach((item) => {
answer !== '' ? (answer += ', ') : null;
if (item.dataset.own === '') {
answer += item.closest('label').querySelector('textarea').value;
}
else {
answer += item.value;
}
if (item.dataset.next > nextQuestion) {
nextQuestion = +item.dataset.next;
}
});
}
}
if (answer) {
this.sendAnswer(answer, this.questionId);
if (!nextQuestion) {
this.currentQuestion++;
}
else {
this.currentQuestion = nextQuestion;
}
this.drawQuestion();
}
}
sendAnswer(answer, qId) {
let data = {
surveyId: this.surveyData._id,
user: this.user,
device: this.device,
page: window.location.href,
answer: {
questionId: qId,
answer: answer
}
};
if (this.answerId) {
data = {
_id: this.answerId,
answer: {
questionId: qId,
answer: answer
}
};
}
if (!this.preview) {
document.cookie = `crs_survey=1; max-age=${60 * 60 * 24 * 14}; path=/`;
fetch(`${server}/survey/answer`, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(data)
})
.then((res) => res.json())
.then((data) => {
this.answerId = data._id;
});
}
}
checkUser() {
let user = document.cookie
.split(';')
.filter((item) => item.includes('_ga=') || item.includes('_crs='))[0]
?.split('=')[1];
if (!user) {
user = `CRS.1.${Math.random().toString().substring(2, 11)}.${(Date.now() / 1000).toFixed(0)}`;
document.cookie = `_crs=${user}; max-age=${60 * 60 * 24 * 365}; path=/`;
}
return user;
}
}
fetch(`${server}/survey/${ID}`)
.then((res) => res.json())
.then((data) => {
data.forEach((survey) => {
new Survey(survey);
});
})
.catch((err) => {
console.error(err);
});
})();
//# sourceMappingURL=crs_survey.js.map