feat(ui): Show progress bar and remove one unnecessary column

pando85 · Jan 24, 2024 · b7c4151 · b7c4151
1 parent ca96895
commit b7c4151
Show file tree

Hide file tree

Showing 2 changed files with 51 additions and 19 deletions.
diff --git a/server/web/ui/src/JobTable.tsx b/server/web/ui/src/JobTable.tsx
@@ -21,8 +21,8 @@ import {
   Cached,
   CalendarMonth,
   Delete,
+  Error,
   Feed,
-  Info,
   MoreVert,
   QuestionMark,
   Replay,
@@ -345,6 +345,54 @@ const JobTable: React.FC<JobTableProps> = ({ token, setShowJobTable }) => {
     }
   };
 
+  const renderStatusCellContent = (job: Job) => {
+    if (job.status === 'started') {
+      return job.status_message ? (
+        (() => {
+          try {
+            const messageObj = JSON.parse(job.status_message);
+            if (messageObj.progress !== undefined) {
+              const progress = parseFloat(messageObj.progress);
+              return (
+                <div className="progress" title={`${progress.toFixed(2)}%`}>
+                  <div
+                    className="progress-bar"
+                    style={{ width: `${progress}%` }}
+                  />
+                </div>
+              );
+            }
+          } catch (error) {
+            return (
+              <div className="error-icon" title={job.status_message}>
+                <Error />
+              </div>
+            );
+          }
+        })()
+      ) : (
+        <span />
+      );
+    } else if (job.status === 'failed') {
+      return (
+        <div className="error-icon" title={job.status_message}>
+          <Error />
+        </div>
+      );
+    } else {
+      return (
+        <Button
+          variant="contained"
+          style={{
+            backgroundColor: getStatusColor(job.status),
+          }}
+        >
+          {job.status}
+        </Button>
+      );
+    }
+  };
+
   return (
     <div className="content-wrapper">
       <div className="row flex-top-bar">
@@ -419,11 +467,6 @@ const JobTable: React.FC<JobTableProps> = ({ token, setShowJobTable }) => {
                   <QuestionMark />
                 </span>
               </TableCell>
-              <TableCell className="d-none d-sm-table-cell">
-                <span title="Message">
-                  <Info />
-                </span>
-              </TableCell>
               <TableCell>
                 <span title="LastUpdate">
                   <CalendarMonth />
@@ -444,18 +487,8 @@ const JobTable: React.FC<JobTableProps> = ({ token, setShowJobTable }) => {
                 <TableCell className="d-none d-sm-table-cell">
                   {job.destinationPath}
                 </TableCell>
-                <TableCell>
-                  <Button
-                    variant="contained"
-                    style={{
-                      backgroundColor: getStatusColor(job.status),
-                    }}
-                  >
-                    {job.status}
-                  </Button>
-                </TableCell>
                 <TableCell className="d-none d-sm-table-cell">
-                  {job.status_message}
+                  {renderStatusCellContent(job)}
                 </TableCell>
                 <TableCell title={formatDateDetailed(job.last_update)}>
                   <div className="row-menu">

diff --git a/worker/task/encode.go b/worker/task/encode.go
@@ -895,7 +895,7 @@ func (J *EncodeWorker) encodeVideo(job *model.WorkTaskEncode, track *TaskTracks)
 
 	videoContainer, err := J.clearData(sourceVideoParams)
 	if err != nil {
-		J.terminal.Warn("error in clear data", J.GetID())
+		J.terminal.Warn("error in clear data. Id: %s", J.GetID())
 		return err
 	}
 	if err = J.PGSMkvExtractDetectAndConvert(job, track, videoContainer); err != nil {
@@ -918,7 +918,6 @@ func (J *EncodeWorker) encodeVideo(job *model.WorkTaskEncode, track *TaskTracks)
 				if !open {
 					break loop
 				}
-				videoContainer.Video.Duration.Seconds()
 				encodeFramesIncrement := (FFMPEGProgress.duration - lastDuration) * videoContainer.Video.FrameRate
 				lastDuration = FFMPEGProgress.duration