🔄 AJAX Functionality and Data Persistence Logic

At the heart of Highlite Pro is its dynamic interaction model, powered by AJAX. Every highlight, color change, note, and deletion action is performed asynchronously—without refreshing the page—creating a seamless user experience.

This section explains how the plugin handles real-time data saving, editing, and retrieval using AJAX, as well as how it stores user-specific data securely in the WordPress database.

---

⚙️ Key AJAX Operations #

All AJAX actions are triggered via wp_ajax_{action} hooks and are available only to logged-in users.

✅ 1. save_user_highlight #

• Purpose: Save the highlight reference and its plain text.
• Data Stored:
  • user_highlights_{post_id} → Array of encoded highlight keys
  • user_highlight_texts_{post_id} → [key] => text
  • user_highlight_dates_{post_id} → [key] => timestamp

✅ 2. save_user_highlight_color #

• Purpose: Save or update the background color of a highlight.
• Data Stored:
  • user_highlight_colors_{post_id} → [key] => hex color code

✅ 3. save_user_highlight_note #

• Purpose: Save or update the note attached to a highlight.
• Data Stored:
  • user_highlight_notes_{post_id} → [key] => HTML note content (Quill.js output)

✅ 4. get_user_highlights #

• Purpose: Retrieve all highlight keys for the current user on a given post.
• Used During: Page load, to restore previously saved highlights.

✅ 5. get_user_highlight_colors #

• Purpose: Fetch the highlight colors for the current user on a post.
• Usage: Ensures that highlight colors are immediately visible after page reload.

✅ 6. get_user_highlight_note #

• Purpose: Retrieve a saved note for a specific highlight key.
• Used When: A user clicks the 📝 note icon to edit an existing note.

✅ 7. delete_user_highlight #

• Purpose: Remove a specific highlight and its associated data.
• Data Cleared:
  • From all 5 metadata arrays (keys, texts, notes, colors, dates)

---

💾 Data Storage Model #

Each type of metadata is saved under the usermeta table for the currently logged-in user:

Meta Key Format	Value Type	Purpose
user_highlights_{post_id}	Array	List of highlight keys
user_highlight_texts_{post_id}	Associative Array	Stores the plain text of the highlight
user_highlight_colors_{post_id}	Associative Array	Stores background color
user_highlight_notes_{post_id}	Associative Array	Stores HTML-formatted notes
user_highlight_dates_{post_id}	Associative Array	Timestamp of each highlight

---

🔒 Security Considerations #

• All AJAX requests:
  • Are limited to authenticated users via wp_ajax_ hooks.
  • Use sanitize_text_field, wp_kses_post, and nonces to prevent tampering or XSS.
• Notes accept only safe HTML (thanks to wp_kses_post() sanitization).
• Deletion and modification operations validate that:
  • The key exists
  • The user is authorized

---

🧪 Example Flow: Creating a Highlight #

1. User selects a phrase on a post.
2. Plugin captures DOM path + offset info and generates a unique key.
3. AJAX save_user_highlight is fired with the key and text.
4. Simultaneously:
   • save_user_highlight_color stores the chosen background color.
   • save_user_highlight_note stores an optional Quill-formatted note.
5. Page reloads → get_user_highlights and get_user_highlight_colors fetch all saved items and render them client-side.