We are glad that you love our product. Your ideas and suggestions will help us make it even better.
"
}, {
expression: "{nps_score} < 7",
html: "
Thank you for your feedback
We are glad that you shared your ideas with us. They will help us make our product better.
"
}],
pages: [{
name: "page1",
elements: [{
type: "rating",
name: "nps_score",
title: "On a scale of zero to ten, how likely are you to recommend our product to a friend or colleague?",
isRequired: true,
rateMin: 0,
rateMax: 10,
minRateDescription: "(Most unlikely)",
maxRateDescription: "(Most likely)"
}, {
type: "checkbox",
name: "promoter_features",
visibleIf: "{nps_score} >= 9",
title: "Which of the following features do you value the most?",
isRequired: true,
validators: [{
type: "answercount",
text: "Please select two features maximum.",
maxCount: 2
}],
hasOther: true,
choices: [
"Performance",
"Stability",
"User Interface",
"Complete Functionality"
],
otherText: "Other features:",
colCount: 2
}, {
type: "comment",
name: "passive_experience",
visibleIf: "{nps_score} > 6 and {nps_score} < 9",
title: "What is the primary reason for your score?"
}, {
type: "comment",
name: "disappointed_experience",
visibleIf: "{nps_score} notempty",
title: "What do you miss and find disappointing in your experience with our product?"
}]
}],
showQuestionNumbers: "off"
};
================================================
FILE: src/index.css
================================================
body {
margin: 0;
padding: 0;
font-family: sans-serif;
}
================================================
FILE: src/index.js
================================================
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';
ReactDOM.render(, document.getElementById('root'));
registerServiceWorker();
================================================
FILE: src/pages/Analytics.js
================================================
import SurveyAnalytics from "../components/SurveyAnalytics";
export function AnalyticsPage() {
return (
Survey Analytics
);
}
================================================
FILE: src/pages/AnalyticsTabulator.js
================================================
import SurveyAnalyticsTabulator from "../components/SurveyAnalyticsTabulator";
export function AnalyticsTabulatorPage() {
return (
Survey Analytics - Table View
Uses Tabulator supported only by modern browsers.
);
}
================================================
FILE: src/pages/Creator.js
================================================
import SurveyCreator from "../components/SurveyCreator";
import { json } from "../data/survey_json.js";
export function CreatorPage() {
return (
<>
Survey Creator / Form Builder
);
}
================================================
FILE: src/pages/Export.js
================================================
import { Model } from "survey-core";
import { SurveyPDF } from "survey-pdf";
import { json } from "../data/survey_json.js";
function savePDF(model) {
const surveyPDF = new SurveyPDF(json);
surveyPDF.data = model.data;
surveyPDF.save();
};
export function ExportToPDFPage() {
const model = new Model(json);
return (
SurveyJS PDF Export
SurveyJS PDF Export is a client-side extension over the SurveyJS Library that enables users to save surveys as PDF documents.
NOTE: Dynamic elements and characteristics (visibility, validation, navigation buttons) are not supported.
Click the button below to export survey to a PDF document.
);
}
================================================
FILE: src/pages/Home.js
================================================
import logo from "../logo.svg";
export function HomePage() {
return (
SurveyJS + React Quickstart Template
SurveyJS is a set of JavaScript components that allow you and your users to build surveys / forms, store them in your database, and visualize survey results for data analysis. This quick start template uses the following SurveyJS components:
);
}
================================================
FILE: src/pages/Survey.js
================================================
import React from "react";
import { Model, StylesManager } from "survey-core";
import { Survey } from "survey-react-ui";
import "survey-core/defaultV2.css";
import { json } from "../data/survey_json.js";
StylesManager.applyTheme("defaultV2");
function onValueChanged(_, options) {
console.log("New value: " + options.value);
}
function onComplete(survey) {
console.log("Survey complete! Results: " + JSON.stringify(survey.data));
}
export function SurveyPage() {
const model = new Model(json);
return (
SurveyJS Library / Runner
);
}
================================================
FILE: src/registerServiceWorker.js
================================================
// In production, we register a service worker to serve assets from local cache.
// This lets the app load faster on subsequent visits in production, and gives
// it offline capabilities. However, it also means that developers (and users)
// will only see deployed updates on the "N+1" visit to a page, since previously
// cached resources are updated in the background.
// To learn more about the benefits of this model, read https://goo.gl/KwvDNy.
// This link also includes instructions on opting out of this behavior.
const isLocalhost = Boolean(
window.location.hostname === 'localhost' ||
// [::1] is the IPv6 localhost address.
window.location.hostname === '[::1]' ||
// 127.0.0.1/8 is considered localhost for IPv4.
window.location.hostname.match(
/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
)
);
export default function register() {
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
// The URL constructor is available in all browsers that support SW.
const publicUrl = new URL(process.env.PUBLIC_URL, window.location);
if (publicUrl.origin !== window.location.origin) {
// Our service worker won't work if PUBLIC_URL is on a different origin
// from what our page is served on. This might happen if a CDN is used to
// serve assets; see https://github.com/facebookincubator/create-react-app/issues/2374
return;
}
window.addEventListener('load', () => {
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
if (isLocalhost) {
// This is running on localhost. Lets check if a service worker still exists or not.
checkValidServiceWorker(swUrl);
// Add some additional logging to localhost, pointing developers to the
// service worker/PWA documentation.
navigator.serviceWorker.ready.then(() => {
console.log(
'This web app is being served cache-first by a service ' +
'worker. To learn more, visit https://goo.gl/SC7cgQ'
);
});
} else {
// Is not local host. Just register service worker
registerValidSW(swUrl);
}
});
}
}
function registerValidSW(swUrl) {
navigator.serviceWorker
.register(swUrl)
.then(registration => {
registration.onupdatefound = () => {
const installingWorker = registration.installing;
installingWorker.onstatechange = () => {
if (installingWorker.state === 'installed') {
if (navigator.serviceWorker.controller) {
// At this point, the old content will have been purged and
// the fresh content will have been added to the cache.
// It's the perfect time to display a "New content is
// available; please refresh." message in your web app.
console.log('New content is available; please refresh.');
} else {
// At this point, everything has been precached.
// It's the perfect time to display a
// "Content is cached for offline use." message.
console.log('Content is cached for offline use.');
}
}
};
};
})
.catch(error => {
console.error('Error during service worker registration:', error);
});
}
function checkValidServiceWorker(swUrl) {
// Check if the service worker can be found. If it can't reload the page.
fetch(swUrl)
.then(response => {
// Ensure service worker exists, and that we really are getting a JS file.
if (
response.status === 404 ||
response.headers.get('content-type').indexOf('javascript') === -1
) {
// No service worker found. Probably a different app. Reload the page.
navigator.serviceWorker.ready.then(registration => {
registration.unregister().then(() => {
window.location.reload();
});
});
} else {
// Service worker found. Proceed as normal.
registerValidSW(swUrl);
}
})
.catch(() => {
console.log(
'No internet connection found. App is running in offline mode.'
);
});
}
export function unregister() {
if ('serviceWorker' in navigator) {
navigator.serviceWorker.ready.then(registration => {
registration.unregister();
});
}
}