/***************************************
* Wix Velo: Body Type Quiz (Somatotype)
* - Counts answers across 3 columns:
* ECTOMORPH / MESOMORPH / ENDOMORPH
* - Shows a result box + recommended CTA
* - (Optional) Saves submission to a collection
*
* HOW TO USE (quick):
* 1) Add 8 RadioGroup elements to your page:
* #q1, #q2, #q3, #q4, #q5, #q6, #q7, #q8
* Each must have 3 options in the same order:
* 1st = Ectomorph, 2nd = Mesomorph, 3rd = Endomorph
*
* 2) Add:
* Button: #submitBtn
* Text: #resultTitle
* Text: #resultSubtitle
* Box: #resultBox
* Button: #bookBtn (optional, link to booking)
*
* 3) (Optional) Create a collection "BodyTypeQuizSubmissions"
* fields (suggested):
* name (text), email (text),
* ectoScore (number), mesoScore (number), endoScore (number),
* resultType (text), isHybrid (boolean),
* createdAt (date/time) [Wix adds _createdDate automatically]
*
* 4) Turn ON Dev Mode and paste this into the page code.
***************************************/
import wixData from "wix-data";
import wixLocation from "wix-location";
const QUESTIONS = [
{ id: "#q1", label: "Frame" },
{ id: "#q2", label: "Weight gain area" },
{ id: "#q3", label: "Metabolism" },
{ id: "#q4", label: "Muscle building" },
{ id: "#q5", label: "Muscle tone" },
{ id: "#q6", label: "Energy" },
{ id: "#q7", label: "Treatment response" },
{ id: "#q8", label: "Stress response" }
];
// Map option index -> type
// 0 = ecto, 1 = meso, 2 = endo
const TYPE_BY_INDEX = ["ECTOMORPH", "MESOMORPH", "ENDOMORPH"];
$w.onReady(function () {
// Hide result area on load
$w("#resultBox").collapse();
$w("#submitBtn").onClick(() => {
try {
const { scores, answers } = scoreQuiz();
const result = resolveResult(scores);
renderResult(result, scores);
// OPTIONAL: Save to collection (uncomment + ensure collection exists)
// saveSubmission({ scores, result, answers });
// OPTIONAL: Scroll to result
$w("#resultBox").expand();
$w("#resultBox").scrollTo();
} catch (err) {
// Friendly validation message
wixLocation.to(wixLocation.url); // removes any weird state; optional
// Or just show a text warning if you have one
// $w("#errorText").text = err.message;
// $w("#errorText").show();
console.error(err);
}
});
// OPTIONAL: booking button handler
// Make sure #bookBtn has a link OR set it here
// $w("#bookBtn").onClick(() => wixLocation.to("/book-now"));
});
/**
* Reads all radio groups, validates completion, and counts each type.
*/
function scoreQuiz() {
const scores = { ECTOMORPH: 0, MESOMORPH: 0, ENDOMORPH: 0 };
const answers = [];
for (const q of QUESTIONS) {
const rg = $w(q.id);
// Validate: must select something
if (!rg.value) {
// If you prefer, you can highlight the unanswered input
throw new Error("Please answer every question to see your results.");
}
// Wix RadioGroup value is the "value" of option, not index.
// We’ll derive index by finding it in options.
const idx = rg.options.findIndex((opt) => opt.value === rg.value);
if (idx < 0 || idx > 2) {
throw new Error(`Invalid selection detected for ${q.label}.`);
}
const type = TYPE_BY_INDEX[idx];
scores[type] += 1;
answers.push({
question: q.label,
selectedValue: rg.value,
selectedIndex: idx,
type
});
}
return { scores, answers };
}
/**
* Determines dominant type and hybrid flag.
* Hybrid logic:
* - If top score ties with another, it’s a hybrid.
* - If top score is only 1 higher than second place, call it “leaning hybrid.”
*/
function resolveResult(scores) {
const entries = Object.entries(scores).sort((a, b) => b[1] - a[1]);
const [topType, topScore] = entries[0];
const [secondType, secondScore] = entries[1];
const isTie = topScore === secondScore;
const isLeaningHybrid = !isTie && (topScore - secondScore === 1);
let resultType = topType;
let hybridWith = null;
if (isTie) {
// True hybrid: show both types in a clean way
resultType = `${topType} + ${secondType}`;
hybridWith = secondType;
} else if (isLeaningHybrid) {
// Leaning hybrid: still show a dominant type but note the runner-up
hybridWith = secondType;
}
return {
dominant: topType,
resultType,
hybridWith,
isHybrid: isTie || isLeaningHybrid
};
}
/**
* Updates your page UI with the result.
* Make sure you created:
* #resultTitle (Text)
* #resultSubtitle (Text)
* #resultBox (Box)
*/
function renderResult(result, scores) {
const { dominant, resultType, hybridWith, isHybrid } = result;
$w("#resultTitle").text = `Your Body Type: ${resultType}`;
// Short, client-friendly lines you can tweak
const blurbs = {
ECTOMORPH:
"Naturally lean with a faster metabolism. Your focus is nervous system balance, nourishment, and muscle tone support.",
MESOMORPH:
"Naturally athletic and responsive. Your focus is consistency, inflammation control, and sculpting maintenance.",
ENDOMORPH:
"Stores fat more easily and thrives with structure. Your focus is detox pathways, water retention, and hormone-friendly habits."
};
const serviceRecs = {
ECTOMORPH: [
"Magnesium Lymphatic Massage",
"Cranial Massage",
"Red Light Sessions"
],
MESOMORPH: [
"Lymphatic Drainage",
"Wood Therapy",
"Fat Cavitation"
],
ENDOMORPH: [
"Lymphatic Drainage",
"Yeso Therapy Wraps",
"Hot Stones + Steam"
]
};
// If hybrid, blend messaging
let subtitle = blurbs[dominant];
let recs = serviceRecs[dominant];
if (isHybrid && hybridWith) {
subtitle = `${blurbs[dominant]} You also show strong ${hybridWith.toLowerCase()} traits—so your plan should be customized.`;
// Merge & de-dupe recs
recs = Array.from(new Set([...serviceRecs[dominant], ...serviceRecs[hybridWith]]));
}
const scoreLine = `Scores — Ecto: ${scores.ECTOMORPH}, Meso: ${scores.MESOMORPH}, Endo: ${scores.ENDOMORPH}`;
const recLine = `Best matches for you: ${recs.join(" • ")}`;
$w("#resultSubtitle").text = `${subtitle}\n\n${recLine}\n${scoreLine}`;
}
/**
* OPTIONAL: Save to a collection (requires permission rules set properly).
* Create a collection named "BodyTypeQuizSubmissions" and update field keys as needed.
*/
async function saveSubmission({ scores, result, answers }) {
const item = {
// If you also collect name/email on the page, add:
// name: $w("#nameInput").value,
// email: $w("#emailInput").value,
ectoScore: scores.ECTOMORPH,
mesoScore: scores.MESOMORPH,
endoScore: scores.ENDOMORPH,
resultType: result.resultType,
isHybrid: result.isHybrid,
// Storing raw answers is optional—best practice is to store a summary only,
// but you can store as JSON string if you want:
answersJson: JSON.stringify(answers)
};
await wixData.insert("BodyTypeQuizSubmissions", item);
}
🔸 Turmeric – Packed with antioxidants and anti-inflammatory properties, turmeric helps even skin tone, reduce blemishes, and revive your natural radiance.
🔸 Honey – A natural humectant, honey locks in moisture, leaving your skin soft, supple, and deeply hydrated. Rich in enzymes and antibacterial properties, it promotes a healthy, glowing complexion. 🍯
Ingredients:
Soap Base: Clear GlycerinFragrance: NoneAdditives: Raw Honey, Turmeric