All the features are hidden behind a switch, so users can turn them on or off as desired. This doc explains how to add this feature switch option to the options page, and some guidance on where should the feature be developed.
Each feature has a boolean option "linked" to it, which determines whether the feature will be enabled or not.
//src/common/common.js
file by adding the default value for the option in the defaultOptions
object.false
value set as a default, so existing users have to explicitly enable the option after they receive the extension update. Otherwise, it might cause confusion, because users wouldn't know if the feature was added by the extension or Google.//src/options/options.html
file by appending the following HTML code in the corresponding section:<div class="option"><input type="checkbox" id="{{codename}}"> <label for="{{codename}}" data-i18n="{{codename}}"></label> <span class="experimental-label" data-i18n="experimental_label"></span></div>where you should substitute
{{codename}}
with the codename you've chosen. The experimental label is optional and should only be used with features which are unreliable (or could be at some point in the future) due to their nature.//src/_locales/en/manifest.json
, by adding the string under the options_{{codename}}
key.Apart from the feature switch option, additional options can be defined in order to further customize the behavior of a feature.
This is not usually the case, and it is preferred that the number of options is kept to a minimum so the extension is as simple as possible. In any case, this section explains how to add them in case they are needed.
As a source of inspiration, take a look at the Community Console dark mode feature: apart from the feature switch option (ccdarktheme
) it has 2 additional options associated with it:
ccdarktheme_mode
option can be configured in the options page with a selector, and determines whether the dark/light themes are set according to the OS's dark mode setting, or whether the user is the one in charge of switching between them by clicking a button/switch in the Community Console.ccdarktheme_switch_enabled
option is used to save whether the user manually enabled the dark theme or not by using the switch/button in the Community Console.ccdarktheme_mode
is set to switch
and the feature is enabled.These are the steps which you should generally follow when adding additional options:
{{feature_codename}}_{{suffix}}
).//src/common/common.js
file by doing the following things:defaultOptions
object.specialOptions
object. This is so the option can be handled in a specific way when showing/saving it in the options page, or so it is handled outside of the options page.//src/options/options.html
file to add the appropriate code which implements the option (usually in the same .option
div as the feature switch).data-i18n
attribute to an HTML element, its contents will be replaced with the corresponding i18n string (for instance, <span data-i18n="test"></span>
will be rendered as <span data-i18n="test">Test</span>
if Test
was the string defined with the key options_test
).//src/options/options.js
file to add the following things://src/_locales/en/manifest.json
.//src/options/options.js
, so the option is not handled there.TODO(issue #32): Write this section.