שיעור 1
העברת ושמירת מידע לאתר באמצעות כתובת האתר (URL)
על מנת שהקוד יעבוד, חשוב מאוד ליצור מאגר מידע שהID שלו הוא LIDS ולייצר שדות בשמות התואמים לאלו הכתובים בתוך הOBJECT בקוד
import wixLocation from 'wix-location';
import wixData from 'wix-data';
$w.onReady(function () {
saveUTM();
});
function saveUTM() {
let query = wixLocation.query
let object =
{
utm_source: query.utm_source,
utm_medium: query.utm_medium,
campaign: query.utm_campaign
}
wixData.insert("lids", object)
}
מחשבון שמחשב את הערך BMI של המשתמש
export function calculate_click(event) {
BMICalculate()
}
function BMICalculate() {
let BMI = Number($w('#Weight').value) / ((Number($w('#height').value) * Number($w('#height').value) / 10000))
$w("#BMI").value = String(BMI.toFixed(2))
if (BMI > 19 && BMI < 25)
{
$w("#BMI").style.backgroundColor = "rgba(0,255,0,0.5)";
}
else if ((BMI > 16 && BMI < 19) || (BMI > 25 && BMI < 31))
{
$w("#BMI").style.backgroundColor = "rgba(255,255,0,0.5)";
}
else
{
$w("#BMI").style.backgroundColor = "rgba(255,0,0,0.5)";
}
}
העתקת מידע לקליפבורד (כמו ללחוץ על לחצן ימני של הכפתור והעתק).
הצגת טקסט שהמידע הועתק, וחזרה למצב רגיל אחרי שני
import wixWindow from 'wix-window';
export function CopyToClip_click(event) {
$w('#CopyToClip').label = "הועתק"
wixWindow.copyToClipboard($w('#input1').value)
setTimeout(() => {
$w('#CopyToClip').label = "העתק"
}, 1000);
}
טעינת דפים אחרים באתר לפני שהמשתמש מגיע אליהם
import wixSite from 'wix-site';
$w.onReady(function () {
wixSite.prefetchPageResources( {
"lightboxes": ["light", "Second Box"],
"pages": ["/mypage", "/my2page"]
} );
});
יצירת שאלון הכולל 5 שאלות , 3 סטייטים אשר נבחרים לפי כמות התשובות הנכונות , סליידר אשר מתקדם ככל שצודקים בשאלות , וכפתורים קדימה ואחורה
השתמשתי בMULTI STATE BOX כדי לייצר את השאלון
import wixLocation from 'wix-location';
let QuizEnd = false;
let stateStatus = 0;
export function start_click(event) {
$w('#Quiz').changeState("Q1")
$w('#BackBTN').show()
$w('#Next').show()
stateStatus++;
}
export function Qu1_click(event) {
setTimeout(() => {
$w('#Quiz').changeState("Q2")
stateStatus++;
CalculateQuiz()
}, 300);
}
export function radioGroup2_click(event) {
setTimeout(() => {
$w('#Quiz').changeState("Q3")
stateStatus++;
CalculateQuiz()
}, 300);
}
export function radioGroup3_click(event) {
setTimeout(() => {
$w('#Quiz').changeState("Q4")
stateStatus++;
CalculateQuiz()
}, 300);
}
export function radioGroup4_click(event) {
setTimeout(() => {
$w('#Quiz').changeState("Q5")
QuizEnd = true;
stateStatus++;
CalculateQuiz()
}, 300);
}
export function radioGroup5_click(event) {
stateStatus++;
setTimeout(() => {
$w('#Quiz').changeState("Calculate")
}, 300);
setTimeout(() => {
CalculateQuiz()
}, 2300);
}
function CalculateQuiz()
{
if (QuizEnd === true)
{
$w('#BackBTN').hide()
$w('#Next').hide()
}
let sum = 0
if ($w('#Qu1').value === "Currect" || $w('#Qu1').value==="currect")
{sum++}
if ($w('#Qu2').value === "Currect" || $w('#Qu2').value ==="currect")
{sum++}
if ($w('#Qu3').value === "Currect" || $w('#Qu3').value ==="currect")
{sum++}
if ($w('#Qu4').value === "Currect" || $w('#Qu4').value ==="currect")
{sum++}
if ($w('#Qu5').value === "Currect" || $w('#Qu5').value ==="currect")
{sum++}
if (sum <4 && QuizEnd === true)
{
$w('#score1').text = String(sum) + "/5"
$w('#Quiz').changeState("lose")
}
else if (sum===4 && QuizEnd === true)
{
$w('#score2').text = String(sum) + "/5"
$w('#Quiz').changeState("ok")
}
else if (sum===5 )
{
$w('#Quiz').changeState("win")
}
$w('#slider1').value = sum
}
export function BackBTN_click(event) {
console.log(stateStatus);
if (stateStatus === 0)
{console.log("Do nothing");}
else if (stateStatus === 1)
{
$w('#Quiz').changeState("Start")
$w('#BackBTN').hide()
$w('#Next').hide()
}
else if (stateStatus === 2)
{
$w('#Quiz').changeState("Q1")
}
else if (stateStatus === 3)
{
$w('#Quiz').changeState("Q2")
}
else if (stateStatus === 4)
{
$w('#Quiz').changeState("Q3")
}
else if (stateStatus === 5)
{
$w('#Quiz').changeState("Q4")
}
else if (stateStatus === 6)
{
QuizEnd = true;
CalculateQuiz()
}
stateStatus--
if (stateStatus===-1){stateStatus=0;}
}
export function Next_click(event) {
if (stateStatus === 0)
{$w('#Quiz').changeState("start")}
else if (stateStatus === 1)
{$w('#Quiz').changeState("Q2")}
else if (stateStatus === 2)
{$w('#Quiz').changeState("Q3")}
else if (stateStatus === 3)
{$w('#Quiz').changeState("Q4")}
else if (stateStatus === 4)
{$w('#Quiz').changeState("Q5")}
else if (stateStatus === 5)
{$w('#Quiz').changeState("Q5")}
stateStatus++
if (stateStatus===7){stateStatus=6;}
}