Week 4: Generative Text

Concept:

This project is a gentle companion for women across different phases of their cycle. Each phase—Follicular, Ovulation, Luteal, and Menstrual—reveals its own short, reflective text. The more difficult phases, Luteal and Menstrual, include extra motivating lines to offer comfort and encouragement. Overall, it acts like a quote page, providing small bursts of support and understanding. The goal is to create a sense of connection and help women feel acknowledged in whatever day they find themselves.

Highlight:

I believe that input parsing and validation is a highlight because it makes sure the user’s number is always correct. It was tricky to get the latest number when users changed the value without pressing Enter. Moving the number conversion to the button click made sure we always use the newest value. Handling wrong numbers and showing clear messages was tough, but it is key for a smooth experience.

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
// if valid, choose a random entry based on phase
let entry = "";
switch (currentPhase) {
case "Follicular":
entry = random(follicularEntries); // pick random phrase
break;
case "Ovulation":
entry = random(ovulationEntries);
break;
case "Luteal":
entry = random(lutealEntries);
entry += " " + random(motivationalPhrases); // add extra motivation
break;
case "Menstrual":
entry = random(menstrualEntries);
entry += " " + random(motivationalPhrases); // add extra motivation
break;
}
diaryEntry = entry; // store the chosen entry
isGenerated = true; // mark as generated
}
//validates if the day is within the correct range for the phase
function validateDayRange(phase, day) {
if (phase === "Follicular") {
// allowed days: 1 to 13
return day >= 1 && day <= 13;
} else if (phase === "Ovulation") {
// allowed days: 14 to 16
return day >= 14 && day <= 16;
} else if (phase === "Luteal") {
// allowed days: 17 to 28
return day >= 17 && day <= 28;
} else if (phase === "Menstrual") {
// allowed days: 1 to 5
return day >= 1 && day <= 5;
}
return false; // default false
}
// if valid, choose a random entry based on phase let entry = ""; switch (currentPhase) { case "Follicular": entry = random(follicularEntries); // pick random phrase break; case "Ovulation": entry = random(ovulationEntries); break; case "Luteal": entry = random(lutealEntries); entry += " " + random(motivationalPhrases); // add extra motivation break; case "Menstrual": entry = random(menstrualEntries); entry += " " + random(motivationalPhrases); // add extra motivation break; } diaryEntry = entry; // store the chosen entry isGenerated = true; // mark as generated } //validates if the day is within the correct range for the phase function validateDayRange(phase, day) { if (phase === "Follicular") { // allowed days: 1 to 13 return day >= 1 && day <= 13; } else if (phase === "Ovulation") { // allowed days: 14 to 16 return day >= 14 && day <= 16; } else if (phase === "Luteal") { // allowed days: 17 to 28 return day >= 17 && day <= 28; } else if (phase === "Menstrual") { // allowed days: 1 to 5 return day >= 1 && day <= 5; } return false; // default false }
// if valid, choose a random entry based on phase
  let entry = "";
  switch (currentPhase) {
    case "Follicular":
      entry = random(follicularEntries); // pick random phrase
      break;
    case "Ovulation":
      entry = random(ovulationEntries);
      break;
    case "Luteal":
      entry = random(lutealEntries);
      entry += " " + random(motivationalPhrases); // add extra motivation
      break;
    case "Menstrual":
      entry = random(menstrualEntries);
      entry += " " + random(motivationalPhrases); // add extra motivation
      break;
  }

  diaryEntry = entry; // store the chosen entry
  isGenerated = true; // mark as generated
}

//validates if the day is within the correct range for the phase

function validateDayRange(phase, day) {
  if (phase === "Follicular") {
    // allowed days: 1 to 13
    return day >= 1 && day <= 13;
  } else if (phase === "Ovulation") {
    // allowed days: 14 to 16
    return day >= 14 && day <= 16;
  } else if (phase === "Luteal") {
    // allowed days: 17 to 28
    return day >= 17 && day <= 28;
  } else if (phase === "Menstrual") {
    // allowed days: 1 to 5
    return day >= 1 && day <= 5;
  }
  return false; // default false
}

Reflections, ideas for future work & Improvements:

For future work, I plan to add more customization options and richer animations. I want to explore saving user entries so that they can track their mood over time. I also plan to refine the validation process and introduce more advanced error handling. These improvements would make the project even more useful and appealing as a supportive quote page for women.

Leave a Reply