Chill Bits

Technical Journal — Customers Homework: Link-level Progress Tracking

—

Area
Customers > Homework Detail

Change
Added link-level progress tracking inside each skill so parents can track partial completion across sessions.

Details

  • Each skill can contain multiple links.
  • Parents can mark individual links as completed using checkboxes/toggles.
  • UI shows per-skill progress like 2/5.
  • Progress is persisted and restored on reload.

Data Model

  • Introduced link-level progress tied to:
    • homework_id
    • student_id
    • skill
    • link_id (stable identifier)
    • completed / completed_at
  • Homework links must have stable IDs (UUID preferred) to survive edits.

Rules

  • Link progress is independent from skill approval.
  • Removing a link removes its progress.
  • Adding a new link resets skill completion.

Technical Journal — Customers Homework: Auto Skill Completion

Area
Customers > Homework Detail

Change
Removed manual “Đánh dấu hoàn thành” button.

New Behavior

  • Skill completion is now fully derived:
    • A skill is marked as done automatically when all links inside it are completed.
  • No manual action required from parents beyond checking links.

Backend

  • Skill status is recalculated server-side whenever a link is toggled.
  • Adding a new link to a completed skill reverts it back to pending.

Impact

  • Skill status stays consistent across Customers, Teacher, and Admin views.
  • Teacher approval workflow remains unchanged.

Technical Journal — Customers Homework: Video Upload Flow Redesign

Area
Customers > Homework Detail

Problem

  • Uploading videos triggered processing immediately.
  • UI showed infinite processing spinner.
  • Processing errors caused fatal failures (exec() usage).

Solution

  • Video upload flow split into two phases:
    1. Upload phase
      • Upload original video to Cloudflare R2 only.
      • Create DB record with status uploaded / scheduled.
      • Return success immediately.
    2. Processing phase
      • Dispatch background job with delay.

Processing Delay

  • Initial delay: 1 hour
  • Updated to: 1 minute

Statuses

  • uploaded / scheduled → processing → ready / failed

UI Changes

  • Infinite spinner removed.
  • After upload, show stable placeholder text:
    • Changed from “Đã tải video lên thành công”
    • To: “Upload thành công”
  • Placeholder persists across reloads.

Technical Journal — Video Processing Jobs (Queue)

Area
Background jobs

Change
Moved all video processing out of controllers.

Details

  • Controllers never call ffmpeg or shell commands.
  • Video optimization runs in a queued job.
  • Job is delayed by 1 minute after upload.
  • Job behavior:
    • Mark status = processing
    • Generate optimized playback variant + poster (if supported)
    • Update status = ready
    • On failure, mark failed with error message

Safety

  • Job is idempotent.
  • If optimized version exists, job exits early.
  • Upload never fails due to processing issues.

Technical Journal — Fix exec() Fatal Error

Area
CustomerController (video upload)

Issue

Call to undefined function App\Http\Controllers\exec()
Code language: JavaScript (javascript)

Root Cause

  • exec() called inside controller namespace.
  • On managed hosting (RunCloud), shell execution may be disabled.

Fix

  • Removed all direct shell execution from controllers.
  • Processing moved to queued jobs.
  • If shell execution unavailable, job fails gracefully without breaking upload.

Technical Journal — Admin Homework Detail: Proof Visibility Enhancements

Area
Admin > Academic > Homework > Detail

Changes

  1. Skill status cells now show an icon when proof exists even if status is not done.
  2. Admin can click the icon to view proof regardless of parent marking done.

Implementation

  • Homework detail payload includes lightweight proof_count per student+skill.
  • Full proof media is fetched on-demand via a dedicated endpoint.
  • No eager loading of media in main table.

Technical Journal — Admin Homework Detail: Video Fallback Playback

Area
Admin > Academic > Homework > Detail

Change
When viewing a proof video:

  • If optimized video exists → play optimized.
  • If video is still processing → fallback to original video.

Result

  • Admin can always view the video immediately.
  • No blocking “processing” state for Admin.

Technical Journal — Admin Insights: Media Page

Area
Admin > Insights > Media

Feature
Created a unified Media page listing all photos and videos in the system, including:

  • Student photos
  • Homework completion proof (photos + videos)
  • Homework-related media

Design

  • Database-driven (no R2 bucket scanning).
  • Compact, paginated table.
  • Shows:
    • Media type
    • Source feature
    • Related entity
    • Variants
    • Size info

Pagination

  • Server-side only.
  • Built for large volume.

Technical Journal — Admin Insights: Media UX Refinements

Changes

  • Removed date range filter.
  • Made “Related Entity” clickable when media belongs to Homework.
    • Click navigates to Admin > Academic > Homework > Detail.

Video Preview Fix

  • Fixed stretched video issue in preview modal.
  • Video now respects correct aspect ratio using proper container + object-fit logic.
  • Works for horizontal and vertical videos.

Technical Journal — Homework Media Optimization

Photos

  • All uploaded homework proof photos are resized on upload.
  • Variants:
    • Thumbnail
    • Preview
  • Original never loaded by UI.

Videos

  • Optimized playback version generated asynchronously.
  • Poster image supported.
  • Original video used as fallback until optimized is ready.

Technical Journal — Admin Homework Table Compactness

Area
Admin > Academic > Homework

Changes

  • Skills column:
    • Replaced skill badge list with a single count.
    • Hover shows skill details.
  • Students column:
    • Shows selected class summary:
      • {class_name} ({number} students)

Technical Journal — Teacher Homework Management

Area
Teacher > Homework > Manage

Change
Added ability for teacher to edit existing homework.

Rules

  • Teacher can edit homework content (skills, links, attachments).
  • Assignment (class/students) remains unchanged.
  • Existing student progress and approvals are preserved.

Technical Journal — Database Queue Enablement

Area
Infrastructure

Change
Enabled Laravel database queue jobs on RunCloud.

Details

  • QUEUE_CONNECTION=database
  • Jobs and failed_jobs tables created.
  • Worker managed via RunCloud Supervisor.
  • Used for video processing and future async tasks.