Added warning when submitting non-music category on music video.

Also added a color for the music category.

public/_locales/en/messages.json

@@ -567,5 +567,8 @@
     },
     "incorrectCategory": {
         "message": "Wrong Category"
+    },
+    "nonMusicCategoryOnMusic": {
+        "message": "This video is categorized as music. Are you sure you would like to submit segments with non-music categories? Unless this video is not actually music, you should not be submitting this segment. Please read the guidelines if you are confused."
     }
 }

src/components/SubmissionNoticeComponent.tsx

@@ -160,6 +160,18 @@ class SubmissionNoticeComponent extends React.Component<SubmissionNoticeProps, S
             ref.current.saveEditTimes();
         }
 
+        // Check if any non music categories are being used on a music video
+        if (this.contentContainer().videoInfo.microformat.playerMicroformatRenderer.category === "Music") {
+            let sponsorTimesSubmitting = this.props.contentContainer().sponsorTimesSubmitting;
+            for (const sponsorTime of sponsorTimesSubmitting) {
+                if (!sponsorTime.category.startsWith("music_")) {
+                    if (!confirm(chrome.i18n.getMessage("nonMusicCategoryOnMusic"))) return;
+
+                    break;
+                }
+            }
+        }
+
         this.props.callback();
 
         this.cancel();

src/content.ts

@@ -114,7 +114,8 @@ var skipNoticeContentContainer: ContentContainer = () => ({
     sponsorSubmissionNotice: submissionNotice,
     resetSponsorSubmissionNotice,
     changeStartSponsorButton,
-    previewTime
+    previewTime,
+    videoInfo
 });
 
 //get messages from the background script and the popup

src/js-components/previewBar.ts

@@ -50,11 +50,11 @@ let barTypes = {
 		color: "#bfbf35",
 		opacity: "0.7"
 	},
-	"offtopic": {
+	"music_offtopic": {
 		color: "#ff9900",
 		opacity: "0.7"
 	},
-	"preview-offtopic": {
+	"preview-music_offtopic": {
 		color: "#a6634a",
 		opacity: "0.7"
 	}

src/types.ts

@@ -16,7 +16,8 @@ interface ContentContainer {
         sponsorSubmissionNotice: SubmissionNotice,
         resetSponsorSubmissionNotice: () => void,
         changeStartSponsorButton: (showStartSponsor: any, uploadButtonVisible: any) => Promise<boolean>,
-        previewTime: (time: number) => void
+        previewTime: (time: number) => void,
+        videoInfo: any
     }
 }