NASA Encoding Dashboard

A production-grade monitoring dashboard built for managing NASA Plus video platform’s encoding pipeline, enabling media operations teams to efficiently track video encoding jobs, quickly locate processed m3u8 outputs on Akamai CDN, and receive immediate notifications about processing errors. This system serves as a critical operational tool for a company managing NASA’s video content delivery infrastructure.

Key Features

• Real-Time Encoding Status Monitoring - Integrated with encoding.com API to fetch and display live status updates for video encoding jobs, including progress percentages, estimated time remaining, and current processing state, enabling teams to monitor multiple encoding operations simultaneously

• Intelligent Output URL Resolution - Automatically parses encoding.com destination URLs and constructs corresponding Akamai CDN paths for m3u8 outputs, eliminating manual URL construction and reducing the time to locate processed media files from minutes to seconds

• Advanced Search and Filtering - Reactive search functionality with real-time query updates using Inertia.js, allowing operators to instantly filter through large media libraries by filename without page reloads, significantly improving operational efficiency

• Comprehensive Error Notification System - Captures and displays detailed error messages from failed encoding jobs with descriptive context, enabling rapid troubleshooting and reducing mean time to resolution for processing issues

• Paginated Media Management - Server-side pagination with configurable page sizes handles large datasets efficiently, maintaining fast load times even with thousands of encoding records while preserving search state across page navigation

• Progress Tracking Dashboard - Visual representation of encoding progress with percentage completion and time-left estimates, providing at-a-glance status of the entire encoding pipeline for operational planning

• Secure Authentication System - Implemented using Laravel Jetstream with Sanctum for API token management, ensuring only authorized personnel can access sensitive NASA media processing information with full two-factor authentication support

• Automatic Data Synchronization - Background data fetching from encoding.com API with intelligent update-or-create logic to maintain accurate records without duplicates, ensuring the dashboard always reflects the current state of the encoding pipeline

Technical Implementation

Architecture and Design Patterns

Built on Laravel 10 with a modern PHP 8.1 codebase, the application employs Inertia.js to create a seamless single-page application experience while maintaining traditional server-side routing benefits. The architecture follows a clean MVC pattern with dedicated controllers for dashboard and media management, separating concerns between data fetching, business logic, and presentation.

The system integrates with encoding.com’s XML-based API through a custom Helper class (Helpers.php) that handles XML request construction, CURL communication, and response parsing. This abstraction layer provides a clean interface for fetching media lists and individual job statuses, with built-in error handling for malformed responses.

API Integration and Data Processing

Implemented a sophisticated two-stage data retrieval system: first fetching the complete media list from encoding.com, then iterating through each item to retrieve detailed status information. The controller (DashboardController.php:49) processes this data by:

1. Extracting the final destination URL from encoding.com’s format array
2. Parsing the URL path to isolate the filename
3. Constructing the corresponding Akamai CDN URL using the base path
4. Determining appropriate status descriptions based on job state

This approach handles the complexity of encoding.com’s nested response structure while providing clean, actionable data to the frontend.

Database Design and Performance

Utilized Laravel’s Eloquent ORM with a streamlined media table schema tracking essential fields: media_id, status, progress, time_left, destination_url, media_name, media_description, and media_created_date. Implemented updateOrCreate pattern for atomic upserts, preventing race conditions and duplicate entries during data synchronization.

Query optimization includes indexed searches on media_name with LIKE pattern matching (DashboardController.php:23), and efficient pagination limiting result sets to 10 records per page while maintaining query string state for seamless navigation and search persistence.

Frontend Architecture

The Vue 3 frontend (Dashboard.vue:1) leverages Composition API with reactive search functionality implemented through watchers that trigger Inertia.js router calls for instant filtering without full page reloads. The preserveState: true option maintains scroll position and form state, creating a native app-like experience.

Styled with Tailwind CSS and UIkit components for responsive table layouts that handle varying data volumes gracefully. Dynamic CSS classes on status fields provide visual differentiation between Finished, Error, and Processing states, improving scan-ability for operators monitoring multiple jobs.

Security and Authentication

Leveraged Laravel Jetstream’s complete authentication scaffolding with Sanctum for stateless API authentication. The application requires authentication for all dashboard routes using middleware chains (auth:sanctum, verified) ensuring only authorized users can access NASA’s media processing data. The system supports team-based access control, two-factor authentication, and secure session management.

Business Impact and Use Cases

Operational Efficiency Gains

The dashboard dramatically streamlines the workflow for media operations teams managing NASA Plus content. Previously, locating encoded m3u8 outputs required manually tracking encoding job IDs, checking encoding.com’s web interface, and constructing Akamai URLs by hand - a process taking 5-10 minutes per file. The automated URL resolution and centralized dashboard reduced this to under 10 seconds, representing a 30-50x efficiency improvement.

Error Detection and Response

By aggregating error messages from the encoding.com API and displaying them with relevant context, the system enables rapid identification of processing failures. Operations teams receive immediate visibility into problematic encoding jobs with descriptive error messages, allowing them to address issues before they impact content delivery schedules for NASA Plus viewers.

Media Pipeline Transparency

The real-time progress tracking provides stakeholders with complete visibility into the encoding pipeline’s current state. Production teams can make informed decisions about content scheduling based on actual encoding progress rather than estimates, improving coordination between content production and delivery teams.

Content Delivery Workflow

For NASA Plus video platform operations, the dashboard serves as the central hub for post-encoding workflow. Once encoding completes, operators use the dashboard to quickly retrieve the Akamai CDN URLs for m3u8 manifests, which are then integrated into the video platform’s content management system. This streamlined workflow ensures faster time-to-publish for NASA’s educational and mission content.

Development and Maintenance

Current Status

The application is in active maintenance, with the codebase recently updated to add media creation date tracking (commit: ba853ec) and fix date-related issues (commits: 0c44374, 4a86c0e). The project demonstrates ongoing support and iterative improvement based on operational needs.

Development Practices

Built following Laravel best practices with:

• Environment-based configuration for encoding.com credentials
• Comprehensive error handling with try-catch blocks for XML parsing
• Query string preservation for stateful pagination and search
• Responsive design ensuring accessibility across desktop and tablet devices used in operations centers

Testing and Quality Assurance

The project includes PHPUnit test configuration and follows Laravel’s testing conventions. The use of Laravel Pint ensures consistent code formatting, and the inclusion of Laravel Sail provides containerized development environments for consistent deployment across team members.

Deployment Architecture

Designed for standard LAMP stack deployment with MySQL database backend. The application uses Laravel’s migration system for version-controlled database schema management, ensuring consistent deployments across development, staging, and production environments serving NASA’s media operations team.