videogular2/compiled/src/controls/vg-quality-selector/vg-quality-selector.metadata.json

Videogular is a video application framework for desktop and mobile powered by Angular

[{"__symbolic":"module","version":4,"metadata":{"VgQualitySelector":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":14,"character":1},"arguments":[{"selector":"vg-quality-selector","encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":16,"character":19},"member":"None"},"template":"\n        <div class=\"container\">\n            <div class=\"quality-selected\"\n                 [class.vg-icon-hd]=\"!bitrateSelected\">\n                {{ bitrateSelected?.label }}\n            </div>\n            \n            <select class=\"quality-selector\" \n                    (change)=\"selectBitrate($event.target.value)\"\n                    tabindex=\"0\"\n                    aria-label=\"quality selector\"\n                    [attr.aria-valuetext]=\"ariaValue\">\n                <option \n                    *ngFor=\"let bitrate of bitrates\"\n                    [value]=\"bitrate.qualityIndex\"\n                    [selected]=\"bitrate.qualityIndex === bitrateSelected?.qualityIndex\">\n                    {{ bitrate.label }}\n                </option>\n            </select>\n        </div>\n    ","styles":["\n        vg-quality-selector {\n            -webkit-touch-callout: none;\n            -webkit-user-select: none;\n            -moz-user-select: none;\n            -ms-user-select: none;\n            user-select: none;\n            display: flex;\n            justify-content: center;\n            width: 50px;\n            height: 50px;\n            cursor: pointer;\n            color: white;\n            line-height: 50px;\n        }\n        vg-quality-selector .container {\n            position: relative;\n            display: flex;\n            flex-grow: 1;\n            align-items: center;\n            \n            padding: 0;\n            margin: 5px;\n        }\n        vg-quality-selector select.quality-selector {\n            width: 50px;\n            padding: 5px 8px;\n            border: none;\n            background: none;\n            -webkit-appearance: none;\n            -moz-appearance: none;\n            appearance: none;\n            color: transparent;\n            font-size: 16px;\n        }\n        vg-quality-selector select.quality-selector::-ms-expand {\n            display: none;\n        }\n        vg-quality-selector select.quality-selector option {\n            color: #000;\n        }\n        vg-quality-selector .quality-selected {\n            position: absolute;\n            width: 100%;\n            height: 50px;\n            top: -6px;\n            text-align: center;\n            text-transform: uppercase;\n            font-family: Helvetica Neue, Helvetica, Arial, sans-serif;\n            padding-top: 2px;\n            pointer-events: none;\n        }\n        vg-quality-selector .vg-icon-closed_caption:before {\n            width: 100%;\n        }\n    "]}]}],"members":{"bitrates":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":96,"character":5}}]}],"onBitrateChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":98,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":109,"character":21},{"__symbolic":"reference","module":"../../core/services/vg-api","name":"VgAPI","line":109,"character":45}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"selectBitrate":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}]}}}}]