CueWeb System
This guide provides an introduction to the CueWeb system, the web-based version of CueGUI.
Introduction
OpenCue has facilitated efficient management of rendering jobs through its application, CueGUI, which includes Cuetopia and CueCommander. Previously, OpenCue’s capabilities were somewhat restricted as it was primarily limited to desktops/workstations running Qt-based applications. Because of that, the CueWeb system was created. CueWeb is a transformative, web-based application that extends access across multiple platforms, ensuring users can manage their rendering tasks from virtually anywhere.
A seamless transition to web accessibility
CueWeb replicates the core functionality of CueGUI (Cuetopia and Cuecommander) in a web-accessible format, enhancing usability while maintaining the familiar interface that users appreciate. This adaptation supports essential operations such as:
- Secure user authentication:
- Authentication through Github, Google, Okta, Apple, GitLab, Amazon, Microsoft Azure, LinkedIn, Atlassian, Auth0, etc. Other providers and login options can be easily configured and enabled in the CueWeb. See NextAuth.js authentication using email, credentials and providers: https://next-auth.js.org/providers/
- Customizable job management dashboard:
- Manage jobs with a customizable table where users can select visible columns and filter jobs based on their state (active, paused, completed).
- Flexible monitoring controls:
- Easily un-monitor jobs across all statuses.
- Detailed job inspection:
- View job details with pop-up windows showing layers and frames associated with each job.
- Frame navigation and logs access:
- Navigate frames using hyperlinks that lead to dedicated pages for frame data and logs.
- Advanced job search functionality:
- Search for jobs by show name with dropdown suggestions for matching entries.
- Search functionality requires
show-shot-
as the prefix to reduce the number of results returned.
- Dark mode toggle for user preference:
- Switch between light and dark modes according to user preference.
- Enhanced search functionality:
- Users can enable regex searches by appending ‘!’ to their queries, with tooltips provided for guidance.
- Optimized loading times using virtualization and web workers, along with loading animations for a better user experience.
- Users can add or remove multiple jobs directly from the search results, with existing jobs highlighted in green.
- Enhanced security using Opencue API:
- CueWeb uses JWT token generation for enhanced security in authorization headers.
- CueWeb actions and context menu are available:
Job actions: Unmonitor, Pause, Retry dead frames, Eat dead frames, Kill.
- Layer actions:
Kill
,Eat
,Retry
,Retry dead frames
. - Frame actions:
Retry
,Eat
,Kill
. - Menu items are disabled if the job has finished, and the context menu is always rendered on-screen.
- Auto-reloading of tables:
- All tables (jobs, layers, frames) are auto-reloaded at regular intervals to display the latest data.
CueWeb’s user interface
Upon logging in through Okta/Google/GitHub or another authentication method configured using NextAuth.js (Figures 1 or 2), users are welcomed by CueWeb’s main dashboard, as shown in Figure 3 (light mode) or Figure 4 (dark mode). The CueWeb main page contains a paginated table that is populated with the OpenCue jobs.
Figure 1: CueWeb authentication page (light mode)
Figure 2: CueWeb authentication page (dark mode)
Note: If the CueWeb login is disabled, the image below displays the initial CueWeb page. This page includes a button labelled “CueWeb Home”, which opens the main CueWeb interface. For instructions on how to disable the CueWeb login, refer to the cueweb/README.md file.
Figure 3: CueWeb main page (light mode)
Figure 4: CueWeb main page (dark mode)
CueWeb dashboard (Jobs data table) - Similar to CueGUI Cuetopia‘s functionalities
Here’s what you can expect:
-
Visual modes: Toggle between light and dark mode to suit your viewing preferences.
-
Customizable jobs tables: Tailor your dashboard by selecting which columns to display, enhancing readability and focus on critical jobs metrics (see Figure 5)
Figure 5: Column visibility dropdown to choose display data table columns
- Efficient job filtering: Filter jobs by state -
Finished
,Failing
,Dependency
,In Progress
,Paused
- to streamline management tasks (see Figure 6).
Figure 6: Data table filtering based on job state
- Advanced monitoring options: Un-monitor jobs selectively or in bulk, providing flexibility in data visualization (see Figures 7 and 8).
Figure 7: Un-monitoring selected jobs (data table before un-monitor selection)
Figure 8: Un-monitoring selected jobs (data table after un-monitor selection)
- Detailed inspections: A pop-up detail view for layers and frames associated with a selected job (see Figure 8 for light mode and Figure 10 for dark mode), offering deep dives into specific frame logs as shown in Figure 11 for light mode and Figure 12 for dark mode.
Figure 9: Pop-up window to view layers and frames information (light mode)
Figure 10: Pop-up window to view layers and frames information (dark mode)
Figure 11: Frame information and logs visualization (light mode)
Figure 12: Frame information and logs visualization (dark mode)
- Job searching: Search for a job by typing in a show name followed by a hyphen and then the shot followed by a hyphen (ex: “show-shot-”) or by typing in a regex query followed by a “!” (ex: “.character-name!”). This will trigger a dropdown populated with jobs for that query (see Figure 13). Clicking jobs in this dropdown will add them to the jobs table. Jobs in the jobs table will be highlighted
green
in the dropdown.
Figure 13: Job search functionality
CueWeb Actions for Jobs / Layers / Frames
The CueWeb system includes actions like eat dead frames
, retry dead frames
, pause
, unpause
, and kill
for selected jobs in the table. Also, the ability to right-click jobs, layers, and frames to get a context menu popup with actions for that object type.
Figure 14 shows the job
context menu with options to un-monitor
, pause
, retry dead frames
, eat dead frames
and kill
jobs and Figure 15 shows the successful message after selecting kill
a job.
Figure 14: CueWeb with job context menu open
Figure 15: Pop-up showing a successful message after selecting kill
a job
Figure 16 shows the layer
context menu with options to kill
, eat
, retry
, and retry dead frames
and Figure 17 shows the successful message after selecting retry
a layer.
Figure 16: CueWeb with layer context menu open
Figure 17: Pop-up showing a successful message after selecting retry
a layer
Finally, Figure 16 shows the layer
context menu with options to kill
, eat
, retry
, and retry dead frames
and Figure 17 shows the successful message after selecting retry
a layer.
Figure 18: CueWeb with frame context menu open
Figure 19: Pop-up showing a successful message after selecting eat
a frame
Conclusion
In conclusion, the CueWeb system marks a significant advancement in rendering job management by providing a powerful, web-based interface that simplifies and enhances user interaction with the OpenCue system. With features like customizable job tables, efficient job filtering, and detailed inspections, along with the ability to view comprehensive logs and switch visual modes, CueWeb ensures that managing rendering jobs is more accessible and adaptable to a variety of user needs.
Feedback
Was this page helpful?
Glad to hear it! Please tell us how we can improve.
Sorry to hear that. Please tell us how we can improve.