Added category descriptions

This commit is contained in:
Ajay Ramachandran
2020-06-03 21:00:32 -04:00
parent c9460bd6c6
commit b4e03ae055
2 changed files with 68 additions and 39 deletions

View File

@@ -483,27 +483,45 @@
"category_sponsor": { "category_sponsor": {
"message": "Sponsor" "message": "Sponsor"
}, },
"category_sponsor_description": {
"message": "Paid promotion, paid referrals and direct advertisements. Not for self-promotion or free shoutouts to causes or other creators/websites/products they like."
},
"category_intro": { "category_intro": {
"message": "Intro Animation" "message": "Intro Animation"
}, },
"category_intro_description": {
"message": "Intro animations that are recurring in the series or provide no direct value. This should not be used on music videos."
},
"category_intro_short": { "category_intro_short": {
"message": "Intro" "message": "Intro"
}, },
"category_outro": { "category_outro": {
"message": "Endcards/Credits" "message": "Endcards/Credits"
}, },
"category_outro_description": {
"message": "Credits or when the YouTube endcards appear. Not for spoken conclusions. This should not include useful content. This should not be used on music videos."
},
"category_interaction": { "category_interaction": {
"message": "Interaction Reminder (Subscribe)" "message": "Interaction Reminder (Subscribe)"
}, },
"category_interaction_description": {
"message": "When there is a short reminder to like, subscribe or follow them in the middle of content. If it is long or about something specific, it should be under self promotion instead."
},
"category_interaction_short": { "category_interaction_short": {
"message": "Interaction Reminder" "message": "Interaction Reminder"
}, },
"category_selfpromo": { "category_selfpromo": {
"message": "Unpaid/Self Promotion" "message": "Unpaid/Self Promotion"
}, },
"category_selfpromo_description": {
"message": "Similar to \"sponsor\" except for unpaid or self promotion. This includes sections about merchandise, donations, or information about who they collaborated with."
},
"category_music_offtopic": { "category_music_offtopic": {
"message": "Music: Non-Music Section" "message": "Music: Non-Music Section"
}, },
"category_music_offtopic_description": {
"message": "Only for use in music videos. This includes introductions or outros in music videos."
},
"category_music_offtopic_short": { "category_music_offtopic_short": {
"message": "Non-Music" "message": "Non-Music"
}, },

View File

@@ -51,48 +51,59 @@ class CategorySkipOptionsComponent extends React.Component<CategorySkipOptionsPr
} }
return ( return (
<tr id={this.props.category + "OptionsRow"} <>
className="categoryTableElement"> <tr id={this.props.category + "OptionsRow"}
<td id={this.props.category + "OptionName"} className="categoryTableElement">
className="categoryTableLabel"> <td id={this.props.category + "OptionName"}
{chrome.i18n.getMessage("category_" + this.props.category)} className="categoryTableLabel">
</td> {chrome.i18n.getMessage("category_" + this.props.category)}
</td>
<td id={this.props.category + "SkipOption"}> <td id={this.props.category + "SkipOption"}>
<select <select
className="categoryOptionsSelector" className="categoryOptionsSelector"
defaultValue={defaultOption} defaultValue={defaultOption}
onChange={this.skipOptionSelected.bind(this)}> onChange={this.skipOptionSelected.bind(this)}>
{this.getCategorySkipOptions()} {this.getCategorySkipOptions()}
</select> </select>
</td> </td>
<td id={this.props.category + "ColorOption"}> <td id={this.props.category + "ColorOption"}>
<input <input
className="categoryColorTextBox option-text-box" className="categoryColorTextBox option-text-box"
type="text" type="text"
onChange={(event) => this.setColorState(event, false)} onChange={(event) => this.setColorState(event, false)}
value={this.state.color} /> value={this.state.color} />
</td> </td>
<td id={this.props.category + "PreviewColorOption"}> <td id={this.props.category + "PreviewColorOption"}>
<input <input
className="categoryColorTextBox option-text-box" className="categoryColorTextBox option-text-box"
type="text" type="text"
onChange={(event) => this.setColorState(event, true)} onChange={(event) => this.setColorState(event, true)}
value={this.state.previewColor} /> value={this.state.previewColor} />
</td> </td>
<td id={this.props.category + "SaveButton"}> <td id={this.props.category + "SaveButton"}>
<div <div
className="option-button trigger-button" className="option-button trigger-button"
onClick={() => this.save()}> onClick={() => this.save()}>
{chrome.i18n.getMessage("save")} {chrome.i18n.getMessage("save")}
</div> </div>
</td> </td>
</tr> </tr>
<tr id={this.props.category + "DescriptionRow"}
className="small-description">
<td
colSpan={5}>
{chrome.i18n.getMessage("category_" + this.props.category + "_description")}
</td>
</tr>
</>
); );
} }