ng-cw-v12
Version:
Angular UI component library
254 lines (244 loc) • 14.4 kB
JavaScript
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('jessibuca-js')) :
typeof define === 'function' && define.amd ? define('ng-cw-v12/video-flv', ['exports', '@angular/core', '@angular/common', 'jessibuca-js'], factory) :
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global["ng-cw-v12"] = global["ng-cw-v12"] || {}, global["ng-cw-v12"]["video-flv"] = {}), global.ng.core, global.ng.common, global.Jessibuca));
})(this, (function (exports, i0, i1, Jessibuca) { 'use strict';
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
function _interopNamespace(e) {
if (e && e.__esModule) return e;
var n = Object.create(null);
if (e) {
Object.keys(e).forEach(function (k) {
if (k !== 'default') {
var d = Object.getOwnPropertyDescriptor(e, k);
Object.defineProperty(n, k, d.get ? d : {
enumerable: true,
get: function () { return e[k]; }
});
}
});
}
n["default"] = e;
return Object.freeze(n);
}
var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
var i1__namespace = /*#__PURE__*/_interopNamespace(i1);
var Jessibuca__default = /*#__PURE__*/_interopDefaultLegacy(Jessibuca);
var VideoFlvComponent = /** @class */ (function () {
function VideoFlvComponent() {
this.playError = false;
this.videoUrl = '';
this.ncLoaded = new i0.EventEmitter(); //返回Jessibuca
this.ncPlaying = new i0.EventEmitter(); //返回播放状态
this.mutedMode = true;
this.autoplayMode = false;
this.fillMode = false;
this.screenshotMode = false;
this.recordMode = false;
this.bandwidthMode = false;
this.controlsMode = true;
}
Object.defineProperty(VideoFlvComponent.prototype, "ncUrl", {
set: function (value) {
var _this = this;
this.videoUrl = value;
setTimeout(function () {
//加延迟，防止其他传入参数未获取到
_this.init();
});
},
enumerable: false,
configurable: true
});
;
Object.defineProperty(VideoFlvComponent.prototype, "ncMuted", {
//静音
set: function (value) {
this.mutedMode = value !== null && value !== undefined && value !== false && value !== 'false';
},
enumerable: false,
configurable: true
});
Object.defineProperty(VideoFlvComponent.prototype, "ncAutoplay", {
//自动播放
set: function (value) {
this.autoplayMode = value !== null && value !== undefined && value !== false && value !== 'false';
},
enumerable: false,
configurable: true
});
Object.defineProperty(VideoFlvComponent.prototype, "ncFill", {
//铺满
set: function (value) {
this.fillMode = value !== null && value !== undefined && value !== false && value !== 'false';
},
enumerable: false,
configurable: true
});
Object.defineProperty(VideoFlvComponent.prototype, "ncScreenshot", {
//截图
set: function (value) {
this.screenshotMode = value !== null && value !== undefined && value !== false && value !== 'false';
},
enumerable: false,
configurable: true
});
Object.defineProperty(VideoFlvComponent.prototype, "ncRecord", {
//录屏
set: function (value) {
this.recordMode = value !== null && value !== undefined && value !== false && value !== 'false';
},
enumerable: false,
configurable: true
});
Object.defineProperty(VideoFlvComponent.prototype, "ncBandwidth", {
//网速
set: function (value) {
this.bandwidthMode = value !== null && value !== undefined && value !== false && value !== 'false';
},
enumerable: false,
configurable: true
});
Object.defineProperty(VideoFlvComponent.prototype, "ncControls", {
//隐藏控制栏
set: function (value) {
this.controlsMode = value !== null && value !== undefined && value !== false && value !== 'false';
},
enumerable: false,
configurable: true
});
VideoFlvComponent.prototype.ngOnDestroy = function () {
this.destroy();
};
VideoFlvComponent.prototype.ngAfterViewInit = function () {
};
VideoFlvComponent.prototype.init = function () {
var _this = this;
this.destroy();
this.jessibuca = new Jessibuca__default["default"]({
url: this.videoUrl,
decoder: 'assets/jessibuca-js/decoder.js',
container: this.videoContainer.nativeElement,
videoBuffer: 0.2,
isResize: !this.fillMode,
loadingText: '加载中',
debug: false,
timeout: 8,
showBandwidth: this.bandwidthMode,
operateBtns: {
fullscreen: true,
screenshot: this.screenshotMode,
play: true,
audio: true,
record: this.recordMode //录制按钮
},
isNotMute: false,
controlAutoHide: true //自动隐藏控制栏
});
if (!this.controlsMode) {
var controls = this.videoContainer.nativeElement.querySelector('.jessibuca-controls');
controls === null || controls === void 0 ? void 0 : controls.remove();
}
//错误监听
this.jessibuca.on("error", function (error) {
console.error('error:', error);
_this.playError = true;
});
//超时监听
this.jessibuca.on("timeout", function (error) {
console.error('timeout:', error);
_this.playError = true;
});
//播放监听
this.jessibuca.on("play", function () {
_this.ncPlaying.emit(true);
});
//暂停监听
this.jessibuca.on("pause", function () {
_this.ncPlaying.emit(false);
});
this.jessibuca.on("load", function () {
//自动播放
if (_this.autoplayMode) {
_this.jessibuca.play();
}
//开启声音
if (!_this.mutedMode) {
_this.jessibuca.cancelMute();
}
//返回对象
_this.ncLoaded.emit(_this.jessibuca);
});
};
VideoFlvComponent.prototype.destroy = function () {
if (this.jessibuca) {
this.jessibuca.destroy();
}
};
return VideoFlvComponent;
}());
VideoFlvComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0__namespace, type: VideoFlvComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
VideoFlvComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: VideoFlvComponent, selector: "nc-video-flv", inputs: { ncUrl: "ncUrl", ncMuted: "ncMuted", ncAutoplay: "ncAutoplay", ncFill: "ncFill", ncScreenshot: "ncScreenshot", ncRecord: "ncRecord", ncBandwidth: "ncBandwidth", ncControls: "ncControls" }, outputs: { ncLoaded: "ncLoaded", ncPlaying: "ncPlaying" }, viewQueries: [{ propertyName: "videoContainer", first: true, predicate: ["videoContainer"], descendants: true }], ngImport: i0__namespace, template: "<div class=\"video-container\">\r\n <div class=\"playError\" *ngIf=\"playError\">\r\n <svg t=\"1724830569178\" class=\"icon\" viewBox=\"0 0 1024 1024\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\"\r\n p-id=\"10496\" width=\"64\" height=\"64\">\r\n <path\r\n d=\"M725.333333 469.333333c129.6 0 234.666667 105.066667 234.666667 234.666667s-105.066667 234.666667-234.666667 234.666667-234.666667-105.066667-234.666666-234.666667 105.066667-234.666667 234.666666-234.666667z m128-341.333333a128 128 0 0 1 128 128v294.101333a300.224 300.224 0 0 0-85.312-91.221333L896 426.666667h-59.605333c-34.346667-13.76-71.808-21.333333-111.061334-21.333334v-192H298.666667v597.333334h147.626666a298.453333 298.453333 0 0 0 50.282667 85.354666L170.666667 896a128 128 0 0 1-128-128V256a128 128 0 0 1 128-128h682.666666z m-119.466666 661.333333h-17.066667a21.333333 21.333333 0 0 0-21.333333 21.333334v17.066666a21.333333 21.333333 0 0 0 21.333333 21.333334h17.066667a21.333333 21.333333 0 0 0 21.333333-21.333334V810.666667a21.333333 21.333333 0 0 0-21.333333-21.333334zM213.333333 682.666667H128v85.333333a42.666667 42.666667 0 0 0 39.466667 42.56L170.666667 810.666667h42.666666v-128z m520.533334-128h-17.066667a21.333333 21.333333 0 0 0-21.184 18.837333L695.466667 576v149.333333a21.333333 21.333333 0 0 0 18.837333 21.184L716.8 746.666667h17.066667a21.333333 21.333333 0 0 0 21.184-18.837334L755.2 725.333333v-149.333333a21.333333 21.333333 0 0 0-21.333333-21.333333z m-266.026667-187.114667l2.773333 1.6 114.090667 71.296a298.965333 298.965333 0 0 0-154.432 217.002667 42.24 42.24 0 0 1-24.832-35.584L405.333333 618.666667V405.333333c0-32.426667 34.517333-52.608 62.506667-37.781333zM213.333333 426.666667H128v170.666666h85.333333v-170.666666z m0-213.333334H170.666667a42.666667 42.666667 0 0 0-42.56 39.466667L128 256v85.333333h85.333333v-128z m640 0h-42.666666v128h85.333333v-85.333333a42.666667 42.666667 0 0 0-39.466667-42.56L853.333333 213.333333z\"\r\n fill=\"#cdcdcd\" p-id=\"10497\"></path>\r\n </svg>\r\n <div class=\"errorText\">\u64AD\u653E\u5931\u8D25</div>\r\n </div>\r\n <div id=\"video-container\" #videoContainer></div>\r\n</div>", styles: ["::ng-deep .video-container{width:100%;height:100%;position:relative;background-color:#0006}::ng-deep .video-container .playError{background-color:#000;width:100%;height:100%;position:absolute;left:0;top:0;display:flex;flex-direction:column;justify-content:center;align-items:center}::ng-deep .video-container .playError .errorText{color:#cdcdcd;font-size:16px;margin-top:10px;letter-spacing:1px}::ng-deep .video-container .jessibuca-play-big{display:block}::ng-deep .video-container #video-container{width:100%;height:100%}\n"], directives: [{ type: i1__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0__namespace, type: VideoFlvComponent, decorators: [{
type: i0.Component,
args: [{
selector: 'nc-video-flv',
templateUrl: './video-flv.component.html',
styleUrls: ['./video-flv.component.less']
}]
}], ctorParameters: function () { return []; }, propDecorators: { videoContainer: [{
type: i0.ViewChild,
args: ['videoContainer']
}], ncUrl: [{
type: i0.Input
}], ncLoaded: [{
type: i0.Output
}], ncPlaying: [{
type: i0.Output
}], ncMuted: [{
type: i0.Input
}], ncAutoplay: [{
type: i0.Input
}], ncFill: [{
type: i0.Input
}], ncScreenshot: [{
type: i0.Input
}], ncRecord: [{
type: i0.Input
}], ncBandwidth: [{
type: i0.Input
}], ncControls: [{
type: i0.Input
}] } });
var NcVideoFlvModule = /** @class */ (function () {
function NcVideoFlvModule() {
}
return NcVideoFlvModule;
}());
NcVideoFlvModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0__namespace, type: NcVideoFlvModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
NcVideoFlvModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0__namespace, type: NcVideoFlvModule, declarations: [VideoFlvComponent], imports: [i1.CommonModule], exports: [VideoFlvComponent] });
NcVideoFlvModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0__namespace, type: NcVideoFlvModule, imports: [[
i1.CommonModule
]] });
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0__namespace, type: NcVideoFlvModule, decorators: [{
type: i0.NgModule,
args: [{
declarations: [
VideoFlvComponent
],
imports: [
i1.CommonModule
],
exports: [
VideoFlvComponent
]
}]
}] });
/**
* Generated bundle index. Do not edit.
*/
exports.NcVideoFlvModule = NcVideoFlvModule;
exports.VideoFlvComponent = VideoFlvComponent;
Object.defineProperty(exports, '__esModule', { value: true });
}));
//# sourceMappingURL=ng-cw-v12-video-flv.umd.js.map