From bba1685e16c76f79e88b0fa9355c0c5a2e1a2bee Mon Sep 17 00:00:00 2001 From: RDW Date: Fri, 19 Nov 2021 17:01:25 +0100 Subject: [PATCH 1/3] UI: Add more options to the WebAudio configuration interface --- Interface/Frames/SystemOptionsFrame.js | 212 +++++++++++++++++-------- 1 file changed, 143 insertions(+), 69 deletions(-) diff --git a/Interface/Frames/SystemOptionsFrame.js b/Interface/Frames/SystemOptionsFrame.js index 9227837..ce1fd56 100644 --- a/Interface/Frames/SystemOptionsFrame.js +++ b/Interface/Frames/SystemOptionsFrame.js @@ -12,8 +12,10 @@ const SystemOptions = { this.frame.hide(); }, createWidgets() { - // Create WebAudio settings panel - let soundOptionsPanel = new Frame( + this.createWebAudioOptions(); + }, + createWebAudioOptions() { + const soundOptionsPanel = new Frame( "SystemOptionsFrame_SoundOptionsPanel", this.frame._obj.content.rightPane, "OptionsFrameCategoryPanel" @@ -31,118 +33,190 @@ const SystemOptions = { ); soundOptionsPanel.headerText.setText("WebAudio Configuration"); - // Create general settings group - let generalSettingsGroup = new OptionsGroup( + this.soundOptionsPanel = soundOptionsPanel; + + this.createGeneralSettingsGroup(); + this.createChannelSettingsGroup(); + this.createVolumeSettingsGroup(); + + this.frame.addCategoryPanel("Sound", soundOptionsPanel); + }, + createGeneralSettingsGroup() { + const generalSettingsGroup = new OptionsGroup( "SystemOptionsFrame_SoundOptions_GeneralSettingsGroup", - soundOptionsPanel, + this.soundOptionsPanel, "OptionsGroup" ); generalSettingsGroup.setCaption(L["General"]); generalSettingsGroup.setCaptionStyle("CaptionFontSmall"); - // Create global sound toggle checkbox - let checkbox = new CheckButton( + this.generalSettingsGroup = generalSettingsGroup; + + this.createGlobalSoundToggle(); + this.createHighQualityStereoToggle(); + this.createBackgroundVolumeToggle(); + this.createBackgroundVolumeSlider(); + }, + createGlobalSoundToggle() { + const enableSoundCheckbox = new CheckButton( "SystemOptionsFrame_SoundOptions_GeneralSettingsGroup_GlobalSoundToggle", - generalSettingsGroup.fieldSet + this.generalSettingsGroup.fieldSet ); - checkbox.setScript("OnClick", () => { - DEBUG("Functionality NYI"); + enableSoundCheckbox.setScript("OnClick", () => { + if (!enableSoundCheckbox.isChecked()) C_WebAudio.disableSound(); + else C_WebAudio.enableSound(); }); - checkbox.setText(L["Enable Sound"]); - - // Create audio channel settings group - let channelSettingsGroup = new OptionsGroup( + enableSoundCheckbox.setText(L["Enable Sound"]); + enableSoundCheckbox.setChecked(C_Settings.getValue("enableSound")); + }, + createHighQualityStereoToggle() { + const useHighQualityStereoCheckbox = new CheckButton( + "SystemOptionsFrame_SoundOptions_GeneralSettingsGroup_HighQualityStereoToggle", + this.generalSettingsGroup.fieldSet + ); + useHighQualityStereoCheckbox.setScript("OnClick", () => { + if (!useHighQualityStereoCheckbox.isChecked()) C_WebAudio.disableHighQualityStereo(); + else C_WebAudio.enableHighQualityStereo(); + }); + useHighQualityStereoCheckbox.setText(L["Use High-Quality Stereo"]); + useHighQualityStereoCheckbox.setChecked(C_Settings.getValue("useHighQualityStereo")); + }, + createBackgroundVolumeToggle() { + const soundInBackgroundCheckbox = new CheckButton( + "SystemOptionsFrame_SoundOptions_GeneralSettingsGroup_BackgroundFadeToggle", + this.generalSettingsGroup.fieldSet + ); + soundInBackgroundCheckbox.setScript("OnClick", () => { + if (!soundInBackgroundCheckbox.isChecked()) C_WebAudio.disableBackgroundFade(); + else C_WebAudio.enableBackgroundFade(); + }); + soundInBackgroundCheckbox.setText(L["Lower Volume in Background"]); + soundInBackgroundCheckbox.setChecked(C_Settings.getValue("fadeSoundInBackground")); + }, + createBackgroundVolumeSlider() { + const backgroundVolumeSlider = new Slider( + "SystemOptionsFrame_SoundOptions_VolumeSettingsGroup_BackgroundVolumeSlider", + this.generalSettingsGroup.fieldSet + ); + backgroundVolumeSlider.setLabelText(L["Background Volume"]); + backgroundVolumeSlider.setScript("OnInput", () => { + C_WebAudio.setBackgroundVolume(backgroundVolumeSlider.getValue() / 100); + }); + backgroundVolumeSlider.setValue(C_Settings.getValue("backgroundAudioVolume") * 100); + }, + createChannelSettingsGroup() { + const channelSettingsGroup = new OptionsGroup( "SystemOptionsFrame_SoundOptions_ChannelSettingsGroup", - soundOptionsPanel, + this.soundOptionsPanel, "OptionsGroup" ); channelSettingsGroup.setCaption(L["Audio Channels"]); channelSettingsGroup.setCaptionStyle("CaptionFontSmall"); - // Create checkboxes - let backgroundMusicToggle = new CheckButton( - "SystemOptionsFrame_SoundOptions_ChannelSettingsGroup_BackgroundbackgroundMusicToggle", - channelSettingsGroup.fieldSet + this.channelSettingsGroup = channelSettingsGroup; + + this.createMusicToggle(); + this.createEffectSoundToggle(); + this.createAmbientSoundToggle(); + }, + createMusicToggle() { + const musicToggle = new CheckButton( + "SystemOptionsFrame_SoundOptions_ChannelSettingsGroup_MusicToggle", + this.channelSettingsGroup.fieldSet ); - backgroundMusicToggle.setScript("OnClick", () => { - DEBUG("Functionality NYI"); + musicToggle.setScript("OnClick", () => { + if (!musicToggle.isChecked()) C_WebAudio.disableMusicTrack(); + else C_WebAudio.enableMusicTrack(); }); - backgroundMusicToggle.setText(L["Music"]); - - let soundEffectToggle = new CheckButton( + musicToggle.setText(L["Music"]); + musicToggle.setChecked(C_Settings.getValue("enableMusic")); + }, + createEffectSoundToggle() { + const soundEffectToggle = new CheckButton( "SystemOptionsFrame_SoundOptions_ChannelSettingsGroup_SoundEffectsToggle", - channelSettingsGroup.fieldSet + this.channelSettingsGroup.fieldSet ); soundEffectToggle.setScript("OnClick", () => { - DEBUG("Functionality NYI"); + if (!soundEffectToggle.isChecked()) C_WebAudio.disableEffectsTrack(); + else C_WebAudio.enableEffectsTrack(); }); soundEffectToggle.setText(L["Sound Effects"]); - - let ambientSoundToggle = new CheckButton( + soundEffectToggle.setChecked(C_Settings.getValue("enableSFX")); + }, + createAmbientSoundToggle() { + const ambientSoundToggle = new CheckButton( "SystemOptionsFrame_SoundOptions_ChannelSettingsGroup_AmbientSoundsToggle", - channelSettingsGroup.fieldSet + this.channelSettingsGroup.fieldSet ); ambientSoundToggle.setScript("OnClick", () => { - DEBUG("Functionality NYI"); + if (!ambientSoundToggle.isChecked()) C_WebAudio.disableAmbienceTrack(); + else C_WebAudio.enableAmbienceTrack(); }); ambientSoundToggle.setText(L["Ambient Sounds"]); - - let soundInBackgroundToggle = new CheckButton( - "SystemOptionsFrame_SoundOptions_ChannelSettingsGroup_SoundInBackgroundToggle", - channelSettingsGroup.fieldSet - ); - soundInBackgroundToggle.setScript("OnClick", () => { - DEBUG("Functionality NYI"); - }); - soundInBackgroundToggle.setText(L["Sound in Background"]); - - // Create volume settings group - let volumeSettingsGroup = new OptionsGroup( + ambientSoundToggle.setChecked(C_Settings.getValue("enableAmbientSounds")); + }, + createVolumeSettingsGroup() { + const volumeSettingsGroup = new OptionsGroup( "SystemOptionsFrame_SoundOptions_VolumeSettingsGroup", - soundOptionsPanel, + this.soundOptionsPanel, "OptionsGroup" ); volumeSettingsGroup.setCaption(L["Volume Settings"]); volumeSettingsGroup.setCaptionStyle("CaptionFontSmall"); - // Create sliders - let masterVolumeSlider = new Slider( - "SystemOptionsFrame_SoundOptions_VolumeSettingsGroup_MasterVolumeSlider", - volumeSettingsGroup.fieldSet - ); - masterVolumeSlider.setLabelText(L["Master Volume"]); - masterVolumeSlider.setScript("OnInput", () => { - DEBUG("Functionality NYI"); - }); + this.volumeSettingsGroup = volumeSettingsGroup; - let effectsVolumeSlider = new Slider( - "SystemOptionsFrame_SoundOptions_VolumeSettingsGroup_EffectsVolumeSlider", - volumeSettingsGroup.fieldSet + this.createVolumeSettingsSliders(); + }, + createVolumeSettingsSliders() { + this.createGlobalVolumeSlider(); + this.createMusicVolumeSlider(); + this.createEffectsVolumeSlider(); + this.createAmbienceVolumeSlider(); + }, + createGlobalVolumeSlider() { + const globalVolumeSlider = new Slider( + "SystemOptionsFrame_SoundOptions_VolumeSettingsGroup_GlobalVolumeSlider", + this.volumeSettingsGroup.fieldSet ); - effectsVolumeSlider.setLabelText(L["Sound Effects"]); - effectsVolumeSlider.setScript("OnInput", () => { - DEBUG("Functionality NYI"); + globalVolumeSlider.setLabelText(L["Global Volume"]); + globalVolumeSlider.setScript("OnInput", () => { + C_WebAudio.setGlobalVolume(globalVolumeSlider.getValue() / 100); }); - - let musicVolumeSlider = new Slider( + globalVolumeSlider.setValue(C_Settings.getValue("globalVolume") * 100); + }, + createMusicVolumeSlider() { + const musicVolumeSlider = new Slider( "SystemOptionsFrame_SoundOptions_VolumeSettingsGroup_MusicVolumeSlider", - volumeSettingsGroup.fieldSet + this.volumeSettingsGroup.fieldSet ); + musicVolumeSlider.setLabelText(L["Music"]); musicVolumeSlider.setScript("OnInput", () => { - DEBUG("Functionality NYI"); + C_WebAudio.setMusicVolume(musicVolumeSlider.getValue() / 100); }); + musicVolumeSlider.setValue(C_Settings.getValue("musicVolume") * 100); + }, + createEffectsVolumeSlider() { + const effectsVolumeSlider = new Slider( + "SystemOptionsFrame_SoundOptions_VolumeSettingsGroup_EffectsVolumeSlider", + this.volumeSettingsGroup.fieldSet + ); - let ambienceVolumeSlider = new Slider( + effectsVolumeSlider.setLabelText(L["Sound Effects"]); + effectsVolumeSlider.setScript("OnInput", () => { + C_WebAudio.setEffectsVolume(effectsVolumeSlider.getValue() / 100); + }); + effectsVolumeSlider.setValue(C_Settings.getValue("sfxVolume") * 100); + }, + createAmbienceVolumeSlider() { + const ambienceVolumeSlider = new Slider( "SystemOptionsFrame_SoundOptions_VolumeSettingsGroup_AmbienceVolumeSlider", - volumeSettingsGroup.fieldSet + this.volumeSettingsGroup.fieldSet ); ambienceVolumeSlider.setLabelText(L["Ambience"]); ambienceVolumeSlider.setScript("OnInput", () => { - DEBUG("Functionality NYI"); + C_WebAudio.setAmbienceVolume(ambienceVolumeSlider.getValue() / 100); }); - - this.frame.addCategoryPanel("Sound", soundOptionsPanel); - - this.soundOptionsPanel = soundOptionsPanel; + ambienceVolumeSlider.setValue(C_Settings.getValue("ambienceVolume") * 100); }, }; From fa46d7a2112a2a284525ae55ec51c1e6edbbe932 Mon Sep 17 00:00:00 2001 From: RDW Date: Fri, 19 Nov 2021 17:09:58 +0100 Subject: [PATCH 2/3] Linter: Add global C_WebAudio to the eslint configuration --- Config/eslint.json | 1 + 1 file changed, 1 insertion(+) diff --git a/Config/eslint.json b/Config/eslint.json index b4e11da..8a72011 100644 --- a/Config/eslint.json +++ b/Config/eslint.json @@ -51,6 +51,7 @@ "C_Testing": "writable", "C_Validation": "writable", "C_WebGL": "writable", + "C_WebAudio": "writable", "C_WebView": "writable", "BinaryReader": "writable", "Bitmap": "writable", From 369b22ab134ab13e965a8b8ca13aaef89c7abfb9 Mon Sep 17 00:00:00 2001 From: RDW Date: Fri, 19 Nov 2021 17:12:44 +0100 Subject: [PATCH 3/3] Core: Add WebAudio options to the default settings --- Core/Schemas/SettingsCacheSchema.js | 13 +++++++++++++ Core/Settings/default-settings.json | 13 ++++++++++++- 2 files changed, 25 insertions(+), 1 deletion(-) diff --git a/Core/Schemas/SettingsCacheSchema.js b/Core/Schemas/SettingsCacheSchema.js index aa6c9d1..6bbddda 100644 --- a/Core/Schemas/SettingsCacheSchema.js +++ b/Core/Schemas/SettingsCacheSchema.js @@ -79,4 +79,17 @@ const SettingsCacheSchema = JOI.object({ blue: JOI.number().integer().min(0).max(255), alpha: JOI.number().integer().min(0).max(255), }).required(), + + // WebAudio API + enableSound: JOI.boolean().required(), + useHighQualityStereo: JOI.boolean().required(), + fadeSoundInBackground: JOI.boolean().required(), + enableMusic: JOI.boolean().required(), + enableSFX: JOI.boolean().required(), + enableAmbientSounds: JOI.boolean().required(), + backgroundAudioVolume: JOI.number().min(0).max(1).required(), + globalVolume: JOI.number().min(0).max(1).required(), + sfxVolume: JOI.number().min(0).max(1).required(), + musicVolume: JOI.number().min(0).max(1).required(), + ambienceVolume: JOI.number().min(0).max(1).required(), }); diff --git a/Core/Settings/default-settings.json b/Core/Settings/default-settings.json index 37057c7..213f852 100644 --- a/Core/Settings/default-settings.json +++ b/Core/Settings/default-settings.json @@ -1,8 +1,19 @@ { - "version": 1, + "version": 2, "defaultAddonLoadedState": true, "enableLogging": true, "enableProfiling": true, + "enableSound": true, + "useHighQualityStereo": true, + "fadeSoundInBackground": true, + "enableMusic": true, + "enableSFX": true, + "enableAmbientSounds": true, + "backgroundAudioVolume": 0.25, + "globalVolume": 1, + "musicVolume": 1, + "sfxVolume": 1, + "ambienceVolume": 1, "defaultMacroIconPath": "Interface/Icons/QuestionMarkBlack3D.png", "macroCachePath": "Interface/macro-cache.json", "activeLocale": "enUS",