define(function(require, exports, module) {

    var Widget = require('widget');

    var VideoQualitySwitcher = Widget.extend({
        attrs: {
            'videoQuality': 'low',
            'audioQuality': 'low'
        },
        events: {
            'click .edit-btn': 'onClickEditBtn',
            'click .cancel-btn': 'onClickCancelBtn',
            'click .confrim-btn': 'onClickConfrimBtn'
        },

        setup: function() {
            this.makeQualitySwitcherName();
            if (this.element.data('editable') === false) {
                this.$('.edit-btn').hide();
            }
        },

        onClickEditBtn: function() {
            this.$('.edit-btn').hide();
            this.$('.quality-switcher-control').show();
        },

        onClickCancelBtn: function() {
            this.$('.quality-switcher-control').hide();
            this.$('.edit-btn').show();
        },

        onClickConfrimBtn: function() {
            this.makeQualitySwitcherName();
            this.$('.quality-switcher-control').hide();
            this.$('.edit-btn').show();
        },

        makeQualitySwitcherName: function() {
            this.set('videoQuality', this.$('[name=video_quality]:checked').val());
            this.set('audioQuality', this.$('[name=video_audio_quality]:checked').val());

            var videoQualities = {'low': Translator.trans('流畅'), 'normal': Translator.trans('标准'), 'high': Translator.trans('精细')};
            var audioQualities = {'low': Translator.trans('流畅'), 'normal': Translator.trans('标准'), 'high': Translator.trans('高品')};
            
            var name = videoQualities[this.get('videoQuality')] + Translator.trans('画质 / ') + audioQualities[this.get('audioQuality')] + Translator.trans('音质');

            this.$('.quality-switcher-name').html( '(' + name + ')');
        }
    });

    module.exports = VideoQualitySwitcher;

});