ArtPlayer/packages/artplayer/src/controls/setting.js

import { append, tooltip, setStyle } from '../utils';
import icons from '../icons';

export default class Setting {
    constructor(option) {
        this.option = option;
    }

    apply(art, $control) {
        const {
            events: { proxy },
            i18n,
            setting,
        } = art;
        this.$setting = append($control, icons.setting);
        tooltip(this.$setting, i18n.get('Show setting'));

        proxy($control, 'click', () => {
            setting.toggle();
        });

        art.on('setting:show', () => {
            setStyle(this.$setting, 'opacity', '0.8');
            tooltip(this.$setting, i18n.get('Hide setting'));
        });

        art.on('setting:hide', () => {
            setStyle(this.$setting, 'opacity', '1');
            tooltip(this.$setting, i18n.get('Show setting'));
        });
    }
}