Skip to content

Commit

Permalink
rename setting to settingComponent
Browse files Browse the repository at this point in the history
  • Loading branch information
stonko1994 committed Dec 20, 2024
1 parent 86ff8c6 commit 59a7bf5
Show file tree
Hide file tree
Showing 8 changed files with 63 additions and 63 deletions.
24 changes: 12 additions & 12 deletions src/ts/components/dynamicsettingspanelitem.ts
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ export interface DynamicSettingsPanelItemConfig extends SettingsPanelItemConfig
/**
* The list selector component which will be used to build the sub page.
*/
setting: ListSelector<ListSelectorConfig>;
settingComponent: ListSelector<ListSelectorConfig>;
/**
* The enclosing {@link SettingsPanel} where the sub page will be added.
*/
Expand All @@ -40,15 +40,15 @@ export interface DynamicSettingsPanelItemConfig extends SettingsPanelItemConfig
*/
export class DynamicSettingsPanelItem extends SettingsPanelItem<DynamicSettingsPanelItemConfig> {
private selectedOptionLabel: Label<LabelConfig>;
protected setting: ListSelector<ListSelectorConfig>;
protected settingComponent: ListSelector<ListSelectorConfig>;

private player: PlayerAPI;
private uimanager: UIInstanceManager;

constructor(config: DynamicSettingsPanelItemConfig) {
super(config);

this.setting = config.setting;
this.settingComponent = config.settingComponent;

this.selectedOptionLabel = new Label({
text: '-',
Expand Down Expand Up @@ -76,26 +76,26 @@ export class DynamicSettingsPanelItem extends SettingsPanelItem<DynamicSettingsP
this.config.label.opener.configure(player, uimanager);
}

if (this.setting != null) {
this.setting.configure(this.player, this.uimanager);
if (this.settingComponent != null) {
this.settingComponent.configure(this.player, this.uimanager);
}

const handleSelectedItemChanged = () => {
let selectedItem = this.setting.getItemForKey(this.setting.getSelectedItem());
let selectedItem = this.settingComponent.getItemForKey(this.settingComponent.getSelectedItem());
if (selectedItem == null) {
this.selectedOptionLabel.hide();
return;
}

this.selectedOptionLabel.show();
let selectedOptionLabelText = selectedItem.label;
if (this.setting instanceof SubtitleSelectBox) {
let availableSettings = this.setting.getItems().length;
if (this.settingComponent instanceof SubtitleSelectBox) {
let availableSettings = this.settingComponent.getItems().length;
selectedOptionLabelText = selectedOptionLabelText + ' (' + (availableSettings - 1) + ')';
}
this.selectedOptionLabel.setText(selectedOptionLabelText);
};
this.setting.onItemSelected.subscribe(handleSelectedItemChanged);
this.settingComponent.onItemSelected.subscribe(handleSelectedItemChanged);

handleSelectedItemChanged();

Expand All @@ -109,7 +109,7 @@ export class DynamicSettingsPanelItem extends SettingsPanelItem<DynamicSettingsP
}

private buildSubPanelPage(): SettingsPanelPage {
const menuOptions = this.setting.getItems();
const menuOptions = this.settingComponent.getItems();
const page = new SettingsPanelPage({ removeOnPop: true });

const text = this.config.label instanceof SubtitleSettingsLabel ? this.config.label.text : this.config.label;
Expand All @@ -129,7 +129,7 @@ export class DynamicSettingsPanelItem extends SettingsPanelItem<DynamicSettingsP
.map((option) => {
return new SettingsPanelSelectOption({
label: option.label,
setting: this.setting,
settingComponent: this.settingComponent,
settingsValue: option.key,
addSettingAsComponent: false,
});
Expand All @@ -141,7 +141,7 @@ export class DynamicSettingsPanelItem extends SettingsPanelItem<DynamicSettingsP

page.configure(this.player, this.uimanager);

const setting = this.setting;
const setting = this.settingComponent;
if (setting instanceof SubtitleSettingSelectBox) {
// Keep the preview subtitle overlay visible when the sub-page is for a subtitle setting
page.onActive.subscribe(() => setting.overlay.enablePreviewSubtitleLabel());
Expand Down
4 changes: 2 additions & 2 deletions src/ts/components/ecomodecontainer.ts
Original file line number Diff line number Diff line change
Expand Up @@ -29,10 +29,10 @@ export class EcoModeContainer extends Container<ContainerConfig> {
cssClass: 'ui-label-savedEnergy',
});

this.ecoModeToggleButtonItem = new SettingsPanelItem({ label: labelEcoMode, setting: ecoModeToggleButton });
this.ecoModeToggleButtonItem = new SettingsPanelItem({ label: labelEcoMode, settingComponent: ecoModeToggleButton });
this.ecoModeSavedEmissionsItem = new SettingsPanelItem({
label: 'Saved Emissions',
setting: this.emissionsSavedLabel,
settingComponent: this.emissionsSavedLabel,
hidden: true,
});

Expand Down
2 changes: 1 addition & 1 deletion src/ts/components/settingspanel.ts
Original file line number Diff line number Diff line change
Expand Up @@ -399,7 +399,7 @@ export class SettingsPanel extends Container<SettingsPanelConfig> {
*/
private hideHoveredSelectBoxes(): void {
this.getComputedItems()
.map(item => item['setting'])
.map(item => item['settingComponent'])
.filter(component => component instanceof SelectBox)
.forEach((selectBox: SelectBox) => selectBox.closeDropdown());
}
Expand Down
26 changes: 13 additions & 13 deletions src/ts/components/settingspanelitem.ts
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ export interface SettingsPanelItemConfig extends ContainerConfig {
/**
* The component that configures a setting.
*/
setting?: Component<ComponentConfig>;
settingComponent?: Component<ComponentConfig>;
/**
* If the setting should be added as a component to this item.
*/
Expand All @@ -41,7 +41,7 @@ export interface SettingsPanelItemConfig extends ContainerConfig {
export class SettingsPanelItem<Config extends SettingsPanelItemConfig> extends Container<Config> {

private label: Component<ComponentConfig>;
protected setting: Component<ComponentConfig> | null;
protected settingComponent: Component<ComponentConfig> | null;

private settingsPanelItemEvents = {
onActiveChanged: new EventDispatcher<SettingsPanelItem<Config>, NoArgs>(),
Expand All @@ -51,7 +51,7 @@ export class SettingsPanelItem<Config extends SettingsPanelItemConfig> extends C
constructor(config: Config) {
super(config);

this.setting = config.setting;
this.settingComponent = config.settingComponent;

this.config = this.mergeConfig(config, {
cssClass: 'ui-settings-panel-item',
Expand All @@ -74,30 +74,30 @@ export class SettingsPanelItem<Config extends SettingsPanelItemConfig> extends C
configure(player: PlayerAPI, uimanager: UIInstanceManager): void {
super.configure(player, uimanager);

if (this.setting != null && this.config.addSettingAsComponent) {
this.addComponent(this.setting);
if (this.settingComponent != null && this.config.addSettingAsComponent) {
this.addComponent(this.settingComponent);
this.updateComponents();
}

if (this.setting instanceof SelectBox || this.setting instanceof ListBox) {
if (this.settingComponent instanceof SelectBox || this.settingComponent instanceof ListBox) {
let handleConfigItemChanged = () => {
if (!(this.setting instanceof SelectBox) && !(this.setting instanceof ListBox)) {
if (!(this.settingComponent instanceof SelectBox) && !(this.settingComponent instanceof ListBox)) {
return;
}
// The minimum number of items that must be available for the setting to be displayed
// By default, at least two items must be available, else a selection is not possible
let minItemsToDisplay = 2;
// Audio/video quality select boxes contain an additional 'auto' mode, which in combination with a single
// available quality also does not make sense
if ((this.setting instanceof VideoQualitySelectBox && this.setting.hasAutoItem())
|| this.setting instanceof AudioQualitySelectBox) {
if ((this.settingComponent instanceof VideoQualitySelectBox && this.settingComponent.hasAutoItem())
|| this.settingComponent instanceof AudioQualitySelectBox) {
minItemsToDisplay = 3;
}

if (this.setting.itemCount() < minItemsToDisplay) {
if (this.settingComponent.itemCount() < minItemsToDisplay) {
// Hide the setting if no meaningful choice is available
this.hide();
} else if (this.setting instanceof PlaybackSpeedSelectBox
} else if (this.settingComponent instanceof PlaybackSpeedSelectBox
&& !uimanager.getConfig().playbackSpeedSelectionEnabled) {
// Hide the PlaybackSpeedSelectBox if disabled in config
this.hide();
Expand All @@ -112,8 +112,8 @@ export class SettingsPanelItem<Config extends SettingsPanelItemConfig> extends C
this.getDomElement().attr('aria-haspopup', 'true');
};

this.setting.onItemAdded.subscribe(handleConfigItemChanged);
this.setting.onItemRemoved.subscribe(handleConfigItemChanged);
this.settingComponent.onItemAdded.subscribe(handleConfigItemChanged);
this.settingComponent.onItemRemoved.subscribe(handleConfigItemChanged);

// Initialize hidden state
handleConfigItemChanged();
Expand Down
10 changes: 5 additions & 5 deletions src/ts/components/settingspanelselectoption.ts
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ export interface SettingsPanelSelectOptionConfig extends SettingsPanelItemConfig
/**
* The setting that will be changed when this option is clicked.
*/
setting: ListSelector<ListSelectorConfig>;
settingComponent: ListSelector<ListSelectorConfig>;
/**
* The value of the setting that will be selected when this option is clicked.
*/
Expand All @@ -27,7 +27,7 @@ export interface SettingsPanelSelectOptionConfig extends SettingsPanelItemConfig
*/
export class SettingsPanelSelectOption extends SettingsPanelItem<SettingsPanelSelectOptionConfig> {
private settingsValue: string | undefined;
protected setting: ListSelector<ListSelectorConfig>;
protected settingComponent: ListSelector<ListSelectorConfig>;

constructor(config: SettingsPanelSelectOptionConfig) {
super(config);
Expand All @@ -44,18 +44,18 @@ export class SettingsPanelSelectOption extends SettingsPanelItem<SettingsPanelSe
super.configure(player, uimanager);

const handleSelectedOptionChanged = () => {
let selectedItem = this.setting.getSelectedItem();
let selectedItem = this.settingComponent.getSelectedItem();

if (this.settingsValue === selectedItem) {
this.getDomElement().addClass(this.prefixCss('selected'));
} else {
this.getDomElement().removeClass(this.prefixCss('selected'));
}
};
this.setting.onItemSelected.subscribe(handleSelectedOptionChanged);
this.settingComponent.onItemSelected.subscribe(handleSelectedOptionChanged);

const handleItemClick = () => {
this.setting.selectItem(this.settingsValue);
this.settingComponent.selectItem(this.settingsValue);
};
this.getDomElement().on('click', () => handleItemClick());

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -113,7 +113,7 @@ export class SubtitleSettingsPanelPage extends SettingsPanelPage {
label: new SettingsPanelPageBackButton({
container: this.settingsPanel,
}),
setting: new SubtitleSettingsResetButton({}),
settingComponent: new SubtitleSettingsResetButton({}),
cssClasses: ['title-item'],
});

Expand Down Expand Up @@ -148,13 +148,13 @@ export class SubtitleSettingsPanelPage extends SettingsPanelPage {
if (useDynamicSettingsPanelItem) {
return new DynamicSettingsPanelItem({
label: label,
setting: setting,
settingComponent: setting,
container: this.settingsPanel,
});
} else {
return new SettingsPanelItem({
label: label,
setting: setting,
settingComponent: setting,
});
}
}
Expand Down
10 changes: 5 additions & 5 deletions src/ts/demofactory.ts
Original file line number Diff line number Diff line change
Expand Up @@ -70,9 +70,9 @@ export namespace DemoFactory {
components: [
new SettingsPanelPage({
components: [
new SettingsPanelItem({ label: 'Video Quality', setting: new VideoQualitySelectBox() }),
new SettingsPanelItem({ label: 'Speed', setting: new PlaybackSpeedSelectBox() }),
new SettingsPanelItem({ label: 'Audio Quality', setting: new AudioQualitySelectBox() }),
new SettingsPanelItem({ label: 'Video Quality', settingComponent: new VideoQualitySelectBox() }),
new SettingsPanelItem({ label: 'Speed', settingComponent: new PlaybackSpeedSelectBox() }),
new SettingsPanelItem({ label: 'Audio Quality', settingComponent: new AudioQualitySelectBox() }),
],
}),
],
Expand All @@ -84,7 +84,7 @@ export namespace DemoFactory {
components: [
new SettingsPanelPage({
components: [
new SettingsPanelItem({ label: null, setting: subtitleListBox }),
new SettingsPanelItem({ label: null, settingComponent: subtitleListBox }),
],
}),
],
Expand All @@ -96,7 +96,7 @@ export namespace DemoFactory {
components: [
new SettingsPanelPage({
components: [
new SettingsPanelItem({ label: null, setting: audioTrackListBox }),
new SettingsPanelItem({ label: null, settingComponent: audioTrackListBox }),
],
}),
],
Expand Down
Loading

0 comments on commit 59a7bf5

Please sign in to comment.