Skip to content

Review Controller

The review controller handles product review submission and rating display.

Source: src/js/controllers/review-controller.js (~200 lines)

Targets

TargetElementPurpose
formReview formSubmission form
ratingStar rating inputs1-5 star selection
nicknameName inputReviewer display name
titleSummary inputReview title
detailReview body textareaFull review text
submitButtonSubmit buttonDisabled during submission
messageFeedback areaSuccess/error messages

Actions

ActionTriggerBehavior
setRatingClick/hover starSet rating value (1-5)
submitForm submissionPOST review to API

Review Submission

  1. User fills out rating (required), nickname, title, and detail
  2. Form validation ensures rating is selected
  3. POST to Maho API review endpoint
  4. On success: display "Thank you" message, hide form
  5. Reviews may require admin approval before appearing

Star Rating UX

Interactive star rating with hover preview:

  • Hovering over a star highlights it and all preceding stars
  • Clicking locks the selection
  • Visual feedback uses CSS-only star rendering (no images)

Source: src/js/controllers/review-controller.js