Skip to content

Instantly share code, notes, and snippets.

@changtimwu

changtimwu/synoplayer.js

Created December 5, 2022 07:18
Show Gist options
  • Save changtimwu/802d9529d37d40ecdf6c019d2b1767f1 to your computer and use it in GitHub Desktop.
Save changtimwu/802d9529d37d40ecdf6c019d2b1767f1 to your computer and use it in GitHub Desktop.
Download ZIP
some video player
Raw
synoplayer.js
Ext.namespace("SYNO.SS.App.WebPlayer");
Ext.define("SYNO.SS.App.WebPlayer.VideoAnalayitcsResultDisplayer", {
extend: "Ext.Container",
SNAPSHOT_WIDTH: 540,
SNAPSHOT_HEIGHT: 345,
SNAPSHOT_SMALL_WIDTH: 88,
SNAPSHOT_SMALL_HEIGHT: 70,
PPL_HINT_BACKGROUND_STYLE: "rgba(0, 0, 0, 0.5)",
BORDER_STYLE: "rgba(0, 109, 188, 0.196)",
LIGHT_BLUE_STYLE: "rgba(0, 255, 255, 1)",
WHITE_STYLE: "rgba(255, 255, 255, 0.7)",
TRIGGER_STYLE: "rgba(208, 73, 59, 1)",
CHANNEL_STYLE: "rgba(242, 64, 171, 1)",
trackIdColorMap: null,
SETUP_HELPER_LIMIT_SIZE: 0.007,
blSetupHelper: false,
owner: null,
taskId: 0,
taskCache: null,
camId: null,
dsId: null,
canvas: null,
canvasContext: null,
videoLatency: 0,
peopleInChgTimeoutId: null,
peopleOutChgTimeoutId: null,
peopleInEnterRegTimeoutId: null,
peopleInExitRegTimeoutId: null,
detRegionTriggerTimeoutId: null,
clearResultTimeoutId: null,
blPaused: false,
DIR_INDICATOR_OFFSET: 40,
PPL_HINT_BG_BASIC_WIDTH: 40,
PPL_HINT_BG_WIDTH_INCREMENT: 5,
PPL_HINT_BG_HEIGHT: 20,
peopleCntResult: null,
resultBuffer: null,
blEnableDetList: false,
MAX_MSG_CNT_IN_Q: 100,
blVideoInited: false,
vdoContainerType: null,
blPplCntInited: false,
blShowBbox: true,
blDrawEnterExitBox: false,
blDrawAll: true,
widgets: null,
pplRegion: null,
detRegionWidget: null,
blResizeBeforeInit: false,
canvasWidth: null,
canvasHeight: null,
blShowDetRegion: true,
constructor: function(a) {
this.owner = a.owner;
this.taskId = a.ivaTaskId;
this.blSetupHelper = (a.blSetupHelper) ? a.blSetupHelper : false;
this.trackIdColorMap = {};
this.widgets = [];
this.resultBuffer = [];
this.vdoContainerType = SYNO.SS.App.VideoAnalytics.Def.VDO_CONTAINER_TYPE.LIVEVIEW;
this.peopleCntResult = {
pplIn: 0,
pplOut: 0,
pplGrpIn: 0,
pplGrpOut: 0,
blPplInChange: false,
blPplOutChange: false,
blPplInEnterRegion: false,
blPplInExitRegion: false,
timestamp: 0
};
this.panelDisplay = SYNO.SS.App.VideoAnalytics.Utils.CreatePanelDisplay();
Ext.applyIf(a, {
style: "position: absolute; top: 0; width: 100%; height: 100%;",
html: '<canvas id="indicator" style="position: absolute; left: 0; top: 0px;"></canvas><canvas id="result" style="position: absolute; left: 0; top: 0px;"></canvas>',
listeners: {
beforedestroy: function() {
this.UnsetTimer(this.clearResultTimeoutId);
this.owner = null;
this.canvasResult = null;
this.canvasIndicator = null;
this.canvasContext = null;
this.canvasContextIndicator = null;
this.ClearWidgets()
},
afterrender: function() {
this.mon(this.owner.panelVideo, "videoinited", function() {
this.blVideoInited = true;
this.UpdatePanelDisplayVisible();
if (true === this.IsNeedDrawIndicator()) {
this.DrawIndicator()
}
}, this);
this.mon(this.owner.panelVideo, "videoremoved", function() {
this.blVideoInited = false
}, this)
},
scope: this
}
});
this.callParent([a])
},
InitCanvas: function(b) {
this.camId = b.id;
this.dsId = b.dsId;
this.canvasPixelRatio = window.devicePixelRatio || 1;
var a = this.getSize();
this.canvasResult = this.el.dom.querySelector("canvas#result");
if (this.canvasResult) {
this.canvasResult.width = a.width || 0;
this.canvasResult.height = a.height || 0;
this.canvasContext = this.canvasResult.getContext("2d");
this.canvasResult.style.width = this.canvasResult.width + "px";
this.canvasResult.style.height = this.canvasResult.height + "px";
this.canvasResult.width = this.canvasResult.width * this.canvasPixelRatio;
this.canvasResult.height = this.canvasResult.height * this.canvasPixelRatio
}
this.canvasIndicator = this.el.dom.querySelector("canvas#indicator");
if (this.canvasIndicator) {
this.canvasIndicator.width = a.width || 0;
this.canvasIndicator.height = a.height || 0;
this.canvasContextIndicator = this.canvasIndicator.getContext("2d");
this.canvasIndicator.addEventListener("mousedown", this.CanvasMouseDown.bind(this));
this.canvasIndicator.addEventListener("mousemove", this.CanvasMouseMove.bind(this));
this.canvasIndicator.style.width = this.canvasIndicator.width + "px";
this.canvasIndicator.style.height = this.canvasIndicator.height + "px";
this.canvasIndicator.width = this.canvasIndicator.width * this.canvasPixelRatio;
this.canvasIndicator.height = this.canvasIndicator.height * this.canvasPixelRatio
}
},
InitEvent: function() {
if (SYNO.SS.App.VideoAnalytics.Def.VDO_CONTAINER_TYPE.RECORDING === this.vdoContainerType) {
return
}
var b = SYNO.SS.GblStore.dsVideoAnalyticsTask.getById(this.taskId);
if (!b) {
return
}
var a = (true === b.get("enable"));
if ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_IVA !== this.owner.viewType) && (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.DVA_PREVIEW !== this.owner.viewType) && (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.DVA_RECORDING !== this.owner.viewType)) {
a = false
}
if (LOCAL_DS_ID !== this.dsId) {
a = (true === a) && (true === SYNO.SS.Utils.IsSlaveDsOnline(this.dsId))
}
this.InitDisplay(b);
this.EnableEvent(a)
},
EnableEvent: function(a) {
if (true === a) {
this.addListener("ivaResult", this.OnVideoAnalyticsResult, this)
} else {
this.removeListener("ivaResult", this.OnVideoAnalyticsResult, this)
}
this.ClearResult();
this.ClearIndicator();
if (true === a) {
if (true === this.IsNeedDrawIndicator()) {
this.DrawIndicator()
}
}
},
InitDisplay: function(b, a) {
this.blShowBbox = (0 !== SYNO.SS.Utils.IsFlags(b.get("people_display_info"), SYNO.SS.App.VideoAnalytics.Def.DisplayInfoType.DISPLAY_ANNOTATION));
this.blDrawEnterExitBox = a || false;
this.InitSimulator(b)
},
InitSimulator: function(d) {
if (!this.canvasResult) {
return
}
var c = SYNO.SS.App.VideoAnalytics.Def;
var o = SYNO.SS.App.VideoAnalytics.Utils;
var m = d.get("analyze_type");
var n = this.canvasResult.width;
var l = this.canvasResult.height;
var b = [
[144, 90],
[144, 210],
[336, 210],
[336, 90]
];
var k = [
[360, 30],
[360, 60]
];
var a = 0;
var f = 2;
var p = [];
var q = [];
var h = c.DetectionDirection.DUAL;
var j = c.RegionType.INCLUDE_REGION;
var e = 1;
var g = 1;
var i = function(r) {
return [r[0] * n, r[1] * l]
};
if (false === Ext.isEmpty(d.get("people_enter"))) {
a = Number(d.get("people_enter"))
}
if (false === Ext.isEmpty(d.get("people_exit"))) {
f = Number(d.get("people_exit"))
}
if (false === Ext.isEmpty(d.get("people_region"))) {
b = o.String2VertexArray(d.get("people_region")).map(i, this)
}
if (false === Ext.isEmpty(d.get("people_hint_pos"))) {
k = o.String2VertexArray(d.get("people_hint_pos")).map(i, this)
}
if (false === Ext.isEmpty(d.get("det_region_cnt"))) {
e = Number(d.get("det_region_cnt"));
g = e
}
if (false === Ext.isEmpty(d.get("region_type"))) {
j = Number(d.get("region_type"))
}
if (false === Ext.isEmpty(d.get("det_region"))) {
o.String2RegionArray(d.get("det_region")).forEach(function(r) {
p.push(r.map(i, this))
}, this)
}
if (false === Ext.isEmpty(d.get("fence_line"))) {
q = o.String2VertexArray(d.get("fence_line"));
q = q.map(i, this)
}
if (false === Ext.isEmpty(d.get("fence_dir_flag"))) {
h = Number(d.get("fence_dir_flag"))
}
this.ClearWidgets();
if (true === SYNO.SS.App.VideoAnalytics.Utils.IsCountingType(m)) {
this.pplRegion = new SYNO.SS.App.VideoAnalytics.CanvasWidget.PplRegion({
delegate: this,
blPreviewMode: true,
data: b,
enterIdx: a,
exitIdx: f,
panelWidth: n,
panelHeight: l,
enterHintPos: k[0],
exitHintPos: k[1],
pplAccMode: d.get("people_mode"),
blDrawEnterExitBox: this.IsDrawEnterExitBox(),
analyzeType: m,
display: {
panel: this.panelDisplay,
info: d.get("people_display_info"),
pos: d.get("people_display_pos"),
name: d.get("name"),
groupName: d.get("groupName"),
blShowGroup: d.get("isGroupEnabled"),
blPixelRatio: true
}
});
this.widgets.push(this.pplRegion);
this.UpdatePanelDisplayVisible()
} else {
if (c.AnalyticsType.INTRUSION_DETECTION === m) {
this.detRegionWidget = new SYNO.SS.App.VideoAnalytics.CanvasWidget.IntrusionDetection({
delegate: this,
data: q,
blPreviewMode: true,
panelWidth: n,
panelHeight: l,
dirFlag: h,
displayInfo: d.get("people_display_info")
});
this.widgets.push(this.detRegionWidget)
} else {
this.detRegionWidget = new SYNO.SS.App.VideoAnalytics.CanvasWidget.MultiRegion({
delegate: this,
data: p,
blPreviewMode: true,
regionCnt: e,
regionMode: g,
regionType: j,
panelWidth: n,
panelHeight: l,
displayInfo: d.get("people_display_info")
});
this.widgets.push(this.detRegionWidget)
}
}
this.ShowDetRegion(this.blShowDetRegion)
},
IsPplTask: function() {
return (false === Ext.isEmpty(this.pplRegion))
},
GetPplRegionParam: function() {
return {
blPplRegionShow: ((true === this.pplRegion.display.panel.blInit) && (true === this.pplRegion.display.panel.blCanShow)) ? true : false,
pplRegionPos: this.pplRegion.display.pos,
pplRegionHeight: this.pplRegion.display.minHeight
}
},
IsDrawEnterExitBox: function() {
var a = SYNO.SS.App.VideoAnalytics.Def;
if ((a.VDO_CONTAINER_TYPE.RECORDING === this.vdoContainerType) && (false === this.blDrawEnterExitBox)) {
return a.DEBUG_MODE
}
return true
},
Resize: function(b, a) {
if (!this.canvasResult || !this.canvasIndicator) {
return
}
this.canvasResult.width = b || 0;
this.canvasResult.height = a || 0;
this.canvasIndicator.width = b || 0;
this.canvasIndicator.height = a || 0;
this.canvasResult.style.width = this.canvasResult.width + "px";
this.canvasResult.style.height = this.canvasResult.height + "px";
this.canvasIndicator.style.width = this.canvasIndicator.width + "px";
this.canvasIndicator.style.height = this.canvasIndicator.height + "px";
this.canvasResult.width = this.canvasResult.width * this.canvasPixelRatio;
this.canvasResult.height = this.canvasResult.height * this.canvasPixelRatio;
this.canvasIndicator.width = this.canvasIndicator.width * this.canvasPixelRatio;
this.canvasIndicator.height = this.canvasIndicator.height * this.canvasPixelRatio;
this.widgets.forEach(function(c) {
c.Resize(this.canvasIndicator.width, this.canvasIndicator.height)
}, this);
if (true === this.IsNeedDrawIndicator()) {
this.DrawIndicator()
}
},
CanvasMouseDown: function(d) {
var b = SYNO.SS.Utils.GetMouseButtonType(d);
var a = false;
var f = d.layerX;
var c = d.layerY;
this.widgets.forEach(function(e) {
a = a || e.MouseDown(f, c, b)
}, this);
if (true === a) {
this.DrawIndicator()
}
},
CanvasMouseMove: function(c) {
var a = false;
var d = c.layerX;
var b = c.layerY;
this.widgets.forEach(function(e) {
a = a || e.MouseMove(d, b)
}, this);
if (true === a) {
this.DrawIndicator()
}
},
SetVideoLatency: function(b) {
var a = parseInt((b * 1000), 10);
this.videoLatency = Math.max(a, 0)
},
SetResultBuffer: function(a, b) {
this.taskId = a;
this.resultBuffer = b
},
OnVideoAnalyticsResult: function(b, a) {
if ((b.taskId !== this.taskId) || (b.dsId !== this.dsId)) {
return
}
this.resultBuffer.push(b);
if (true === a) {
return
}
if (this.resultBuffer.length > this.GetMaxMsgCntInQ()) {
this.resultBuffer.shift()
}
},
GetMaxMsgCntInQ: function() {
return this.MAX_MSG_CNT_IN_Q
},
IsTaskSettingUpdate: function(a) {
if (!this.taskCache) {
return true
}
return (JSON.stringify(a.json) !== JSON.stringify(this.taskCache.json))
},
DrawVideoAnalyticsResult: function(a) {
if ((!this.canvasResult) || (false === this.blDrawAll) || ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.DVA_RECORDING !== this.owner.viewType) && ((this.taskId !== a.taskId) || (this.dsId !== a.dsId)))) {
return
}
if (!this.canvasContext) {
this.canvasContext = this.canvasResult.getContext("2d")
}
this.canvasContext.clearRect(0, 0, this.canvasResult.width, this.canvasResult.height);
this.canvasContext.beginPath();
this.canvasContext.closePath();
this.DoDrawResult(this.canvasContext, a, this.canvasResult.width, this.canvasResult.height);
if ((a.task) && ((0 === this.widgets.length) || (true === this.IsTaskSettingUpdate(a.task)))) {
this.InitDisplay(a.task);
this.taskCache = a.task
}
if (true === this.IsNeedDrawIndicator()) {
this.DrawIndicator()
}
this.SetClearResultTimer()
},
DoDrawResult: function(e, d, m, k) {
var h = SYNO.SS.App.VideoAnalytics.Def;
var b;
var l, g;
var p = h.COLOR_MAP;
var n = h.COLOR_NAME_MAP;
var q = undefined;
var f = undefined;
var a = undefined;
var c = undefined;
var s = d.analyzeType;
var j = d.version;
var o = false;
if (true === d.is_trigger) {
this.UpdateDetRegionTrigger();
o = true
}
if (d.instances) {
for (var r = 0; r < d.instances.length; r++) {
e.save();
if (this.SNAPSHOT_SMALL_WIDTH < m) {
a = "2";
c = "1"
} else {
a = "1";
c = undefined
}
if (true === this.blSetupHelper) {
e.strokeStyle = this.GetSetupHelperColor(d.instances[r].bbox)
} else {
if (true === o) {
e.strokeStyle = p[n.RED];
if (this.SNAPSHOT_SMALL_WIDTH < m) {
f = "rgba(193, 22, 1, 1)"
} else {
f = undefined
}
q = e.strokeStyle
} else {
if (undefined !== d.instances[r].tracking_id) {
e.strokeStyle = this.GetTrackerColor(d.instances[r].tracking_id)
}
}
}
if ((true === this.blSetupHelper) || ((d.instances[r].bbox) && (d.instances[r].is_trigger) && (true === this.blShowBbox))) {
this.UpdateBboxInfo(j, d.instances[r], e, m, k, c, f, a)
}
e.restore()
}
}
if (true === SYNO.SS.App.VideoAnalytics.Utils.IsCountingType(s)) {
this.UpdatePeopleCountInfo(j, d)
}
},
IVAClassEnumToString: function(b) {
var a = SYNO.SS.App.VideoAnalytics.Def;
switch (b) {
case a.ObjClassEnum.HEAD:
return "Head";
case a.ObjClassEnum.PERSON:
return "Person";
case a.ObjClassEnum.TRANSPORTATION:
return "Transportation";
case a.ObjClassEnum.OTHER_ANIMALS:
return "Other Animals";
case a.ObjClassEnum.TWO_WHEELS:
return "Two wheels";
default:
return "unknown"
}
},
SetClearResultTimer: function() {
this.UnsetTimer(this.clearResultTimeoutId);
if (this.blPaused) {
return
}
this.clearResultTimeoutId = setTimeout(function() {
this.ClearResult();
if (true === this.IsNeedDrawIndicator()) {
this.DrawIndicator()
}
}.createDelegate(this), SYNO.SS.App.VideoAnalytics.Def.RESULT_DISPLAY_DURATION)
},
UnsetClearResultTimer: function() {
this.UnsetTimer(this.clearResultTimeoutId)
},
SetPeopleOutChangeTimer: function() {
this.UnsetTimer(this.peopleOutChgTimeoutId);
this.peopleOutChgTimeoutId = setTimeout(function() {
this.blPplOutChange = false
}.createDelegate(this.peopleCntResult), SYNO.SS.App.VideoAnalytics.Def.PEOPLE_CNT_CHANGE_ALERT_DURATION)
},
SetPeopleInChangeTimer: function() {
this.UnsetTimer(this.peopleInChgTimeoutId);
this.peopleInChgTimeoutId = setTimeout(function() {
this.blPplInChange = false
}.createDelegate(this.peopleCntResult), SYNO.SS.App.VideoAnalytics.Def.PEOPLE_CNT_CHANGE_ALERT_DURATION)
},
SetPeopleInEnterRegTimer: function() {
this.UnsetTimer(this.peopleInEnterRegTimeoutId);
this.peopleInEnterRegTimeoutId = setTimeout(function() {
this.blPplInEnterRegion = false
}.createDelegate(this.peopleCntResult), SYNO.SS.App.VideoAnalytics.Def.PEOPLE_CNT_CHANGE_ALERT_DURATION)
},
SetPeopleInExitRegTimer: function() {
this.UnsetTimer(this.peopleInExitRegTimeoutId);
this.peopleInExitRegTimeoutId = setTimeout(function() {
this.blPplInExitRegion = false
}.createDelegate(this.peopleCntResult), SYNO.SS.App.VideoAnalytics.Def.PEOPLE_CNT_CHANGE_ALERT_DURATION)
},
UnsetTimer: function(a) {
if (a) {
clearTimeout(a)
}
},
ClearResult: function() {
this.UnsetTimer(this.clearResultTimeoutId);
if (!this.canvasContext) {
return
}
this.canvasContext.clearRect(0, 0, this.canvasResult.width, this.canvasResult.height)
},
ClearIndicator: function() {
if (this.canvasContextIndicator) {
this.canvasContextIndicator.clearRect(0, 0, this.canvasIndicator.width, this.canvasIndicator.height)
}
},
DrawIndicator: function() {
var a = this.canvasContextIndicator;
if (!a) {
return
}
a.clearRect(0, 0, this.canvasIndicator.width, this.canvasIndicator.height);
this.widgets.forEach(function(b) {
b.Draw(a)
}, this)
},
IsNeedDrawIndicator: function() {
var c = SYNO.SS.App.VideoAnalytics.Utils;
var a;
if (false === this.blVideoInited) {
return false
}
if ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.DVA_PREVIEW !== this.owner.viewType) && (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_IVA !== this.owner.viewType) && (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.DVA_RECORDING !== this.owner.viewType)) {
return false
}
if (!this.blShowDetRegion) {
return false
}
if (SYNO.SS.App.VideoAnalytics.Def.VDO_CONTAINER_TYPE.RECORDING === this.vdoContainerType) {
return true
} else {
if (!this.camId) {
return false
}
var b = SYNO.SS.GblStore.dsCamera.getById(this.camId);
if (!b || (true !== b.get("enabled")) || (CAM_CONN_STATUS_NORMAL !== b.get("status")) || (SYNO.SS.CamSts.SERVER_DISCONN === b.get("camStatus"))) {
return false
}
a = c.GetIvaTaskStore(this.dsId);
if ((false === c.IsTaskRunning(this.taskId, a)) || (true === c.IsTaskActivatingById(this.taskId, a))) {
return false
}
return true
}
},
UpdateDetRegionTrigger: function() {
if (this.detRegionWidget) {
this.detRegionWidget.blTrigger = true;
this.UnsetTimer(this.detRegionTriggerTimeoutId);
this.detRegionTriggerTimeoutId = setTimeout(function() {
this.detRegionWidget.blTrigger = false
}.createDelegate(this), SYNO.SS.App.VideoAnalytics.Def.TRIGGER_RESET_DURATION)
}
},
UpdateBboxInfo: function(g, d, c, f, b, e, h, a) {
if (SYNO.SS.App.VideoAnalytics.Def.RESULT_FORMAT_VERSION === g) {
this.UpdateBboxInfoV1(d, c, f, b, e, h, a)
}
},
UpdatePeopleCountInfo: function(a, b) {
if (SYNO.SS.App.VideoAnalytics.Def.RESULT_FORMAT_VERSION === a) {
this.UpdatePeopleCountInfoV1(b)
}
},
UpdateBboxInfoV1: function(d, i, n, m, b, l, a) {
var j = Math.round(parseFloat(d.bbox.top_left.x) * n);
var g = Math.round(parseFloat(d.bbox.top_left.y) * m);
var k = Math.round(parseFloat(d.bbox.bottom_right.x - d.bbox.top_left.x) * n);
var p = Math.round(parseFloat(d.bbox.bottom_right.y - d.bbox.top_left.y) * m);
if (1 === parseInt(a, 10) % 2) {
j += 0.5;
g += 0.5
}
var e = a / 2;
var q = function(v, u, t) {
var h = v + u;
v = Math.max(v, e);
h = Math.min(h, t - e);
u = h - v;
return [v, u]
};
var f = q(j, k, n);
j = f[0];
k = f[1];
var s = q(g, p, m);
g = s[0];
p = s[1];
i.lineWidth = a;
i.strokeRect(j, g, k, p);
if (undefined !== l) {
j = parseInt(j, 10) - 1;
g = parseInt(g, 10) - 1;
k += parseInt(a, 10) + 1;
p += parseInt(a, 10) + 1;
if (1 === parseInt(b, 10) % 2) {
j -= 0.5;
g -= 0.5
}
i.save();
i.strokeStyle = l;
i.lineWidth = b;
i.strokeRect(j, g, k, p);
i.restore()
}
if (true == SYNO.SS.App.VideoAnalytics.Def.DEBUG_MODE) {
var c = (undefined !== d.tracking_id) && (0 <= d.tracking_id);
var r = (undefined !== d.class_id) && ("" !== d.class_id);
if ((true === c) || (true === r)) {
i.save();
i.lineWidth = "2";
i.font = "bold 15px Arial";
i.textBaseline = "middle";
i.textAlign = "left";
i.fillStyle = i.strokeStyle;
var o = "";
if (true === c) {
o += d.tracking_id
}
if (true === r) {
if (true === c) {
o += "-"
}
o += d.class_id
}
if (10 < g - 8) {
i.fillText(o, j, g - 8)
} else {
i.fillText(o, j, g + p + 12)
}
i.stroke();
i.restore()
}
}
},
UpdatePeopleCountInfoV1: function(b) {
if (true === Ext.isEmpty(b)) {
return
}
if (true === Ext.isDefined(b.in_count)) {
this.peopleCntResult.pplIn = b.in_count
}
if (true === Ext.isDefined(b.out_count)) {
this.peopleCntResult.pplOut = b.out_count
}
if (true === Ext.isDefined(b.timestamp)) {
this.peopleCntResult.timestamp = b.timestamp
}
if (true === Ext.isDefined(b.in_delta) && 0 < b.in_delta) {
this.peopleCntResult.blPplInChange = true;
this.SetPeopleInChangeTimer();
this.peopleCntResult.blPplInEnterRegion = true;
this.SetPeopleInEnterRegTimer()
}
if (true === Ext.isDefined(b.out_delta) && 0 < b.out_delta) {
this.peopleCntResult.blPplOutChange = true;
this.SetPeopleOutChangeTimer();
this.peopleCntResult.blPplInExitRegion = true;
this.SetPeopleInExitRegTimer()
}
if (true == Ext.isDefined(b.is_ui_show_reach_stay_max)) {
this.peopleCntResult.blPplUIReachStayMax = b.is_ui_show_reach_stay_max
}
if (true === Ext.isDefined(b.group_info)) {
var a = b.group_info;
if (true === Ext.isDefined(a.in_count)) {
this.peopleCntResult.pplGrpIn = a.in_count
}
if (true === Ext.isDefined(a.out_count)) {
this.peopleCntResult.pplGrpOut = a.out_count
}
if (true === Ext.isDefined(a.is_in_changed)) {
this.peopleCntResult.blPplGrpInChange = a.is_in_changed
}
if (true === Ext.isDefined(a.is_out_changed)) {
this.peopleCntResult.blPplGrpOutChange = a.is_out_changed
}
if (true === Ext.isDefined(a.is_ui_show_reach_stay_max)) {
this.peopleCntResult.blPplUIGrpReachStayMax = a.is_ui_show_reach_stay_max
}
}
if (this.pplRegion) {
this.pplRegion.UpdateResult(this.peopleCntResult)
}
},
GetTrackerColor: function(a) {
if (!this.trackIdColorMap[a]) {
this.trackIdColorMap[a] = this.GenUniqueColor(a)
}
return this.trackIdColorMap[a]
},
GetSetupHelperColor: function(c) {
if (!c) {
return
}
var b = (c.bottom_right.x - c.top_left.x);
var a = (c.bottom_right.y - c.top_left.y);
if (this.SETUP_HELPER_LIMIT_SIZE > b * a) {
return SYNO.SDS.Utils.GetCssVariable(SYNO.SS.Color.BBOX_RED)
}
return SYNO.SDS.Utils.GetCssVariable(SYNO.SS.Color.BBOX_GREEN)
},
GetSnapshot: function(f, e, a) {
var d = document.createElement("canvas");
var c = this.owner.panelVideo.videoInst.GetNode();
var b;
e = e || this.SNAPSHOT_WIDTH;
a = a || this.SNAPSHOT_HEIGHT;
d.width = e;
d.height = a;
b = d.getContext("2d");
b.drawImage(c, 0, 0, e, a);
this.DoDrawResult(b, f, e, a);
if (true === this.IsNeedDrawIndicator()) {
this.widgets.forEach(function(g) {
g.DrawBySize(b, e, a)
}, this)
}
return d.toDataURL("image/png", 1)
},
GenUniqueColor: function(h) {
var g = 17;
var b = (h * g);
var f = b % 360;
var e = ((b % 30) * 0.01) + 0.7;
var a = ((b % 35) * 0.01) + 0.65;
var d = {
h: f,
s: e,
v: a
};
var c = this.HSVtoRGB(d);
return String.format("rgba({0}, {1}, {2}, 1)", c.r, c.g, c.b)
},
HSVtoRGB: function(j) {
var a, k, m;
var i = j.h;
var u = j.s;
var n = j.v;
var e = Math.floor(i / 60);
var l = (i / 60) - e;
var d = n * (1 - u);
var c = n * (1 - (l * u));
var o = n * (1 - (1 - l) * u);
switch (e) {
case 0:
a = n;
k = o;
m = d;
break;
case 1:
a = c;
k = n;
m = d;
break;
case 2:
a = d;
k = n;
m = o;
break;
case 3:
a = d;
k = c;
m = n;
break;
case 4:
a = o;
k = d;
m = n;
break;
case 5:
a = n;
k = d;
m = c;
break
}
return {
r: Math.round(a * 255),
g: Math.round(k * 255),
b: Math.round(m * 255)
}
},
SendWebAPI: function(c, d, b) {
var a = SYNO.SS.GblStore.dsVideoAnalyticsTask.getById(this.taskId);
if (!a) {
return false
}
Ext.apply(c, {
taskId: this.taskId,
analyze_type: a.get("analyze_type")
});
this.sendWebAPI({
api: "SYNO.SurveillanceStation.IVA",
method: "ExecCommand",
version: 1,
params: c,
callback: d,
scope: b
})
},
EnableDetList: function(a) {
this.blEnableDetList = a
},
ResetTimeStamp: function() {
if (this.pplRegion) {
this.pplRegion.ResetStatusTimeStamp()
}
},
ClearWidgets: function() {
this.UnsetTimer(this.peopleInChgTimeoutId);
this.UnsetTimer(this.peopleOutChgTimeoutId);
this.UnsetTimer(this.peopleInEnterRegTimeoutId);
this.UnsetTimer(this.peopleInExitRegTimeoutId);
this.UnsetTimer(this.detRegionTriggerTimeoutId);
this.widgets.length = 0;
this.pplRegion = null;
this.detRegionWidget = null
},
UpdatePanelDisplayVisible: function() {
this.panelDisplay.SetVisible((true === this.blDrawAll) && (true === this.blVideoInited))
},
SetDrawAll: function(a) {
if (a === this.blDrawAll) {
return
}
if (false === a) {
this.ClearResult();
this.ClearIndicator()
} else {
if (true === this.IsNeedDrawIndicator()) {
this.DrawIndicator()
}
}
this.blDrawAll = a;
this.UpdatePanelDisplayVisible()
},
ShowDetRegion: function(a) {
this.blShowDetRegion = a;
this.ClearIndicator();
if (true === this.IsNeedDrawIndicator()) {
this.DrawIndicator()
}
}
});
Ext.namespace("SYNO.SS.App.WebPlayer");
Ext.define("SYNO.SS.App.WebPlayer.OnScreenControl", {
TYPE_ABS: 1,
TYPE_DRAG_ZOOM: 2,
TYPE_PTZ: 3,
TYPE_PLUGIN: 4,
MOUSE_KEY_RIGHT: 2,
parentWin: null,
videoWidth: 0,
videoHeight: 0,
blAbsPos: false,
blDragZoom: false,
blPtz: false,
blPlugin: false,
blDragging: false,
blDragStart: false,
blMouseDown: false,
cursorType: 0,
cursorCanvas: null,
ptzHandler: null,
absHandler: null,
dragZoomHandler: null,
pluginHandler: null,
handler: null,
fnToggleAct: null,
constructor: function(b) {
var a = {
parentWin: b,
onScreenHandler: this
};
this.parentWin = b;
this.videoWidth = this.parentWin.ctWidth;
this.videoHeight = this.parentWin.ctHeight;
this.cursorCanvas = document.createElement("canvas");
this.cursorCanvas.setAttribute("class", "drag_cursor_canvas");
a.cursorCanvas = this.cursorCanvas;
this.ptzHandler = new SYNO.SS.App.WebPlayer.OnScreenControl.PTZ(a);
this.absHandler = new SYNO.SS.App.WebPlayer.OnScreenControl.ABSPosition(a);
this.pluginHandler = new SYNO.SS.App.WebPlayer.OnScreenControl.Fisheye(a);
this.dragZoomHandler = new SYNO.SS.App.WebPlayer.OnScreenControl.DragZoom(a);
this.emptyHandler = new SYNO.SS.App.WebPlayer.OnScreenControl.Empty();
this.handler = this.emptyHandler
},
InitDefaultHandler: function() {
var a = (0 < this.ptzHandler.GetPtzDirection());
this.SetHandler(this.TYPE_PTZ, a)
},
SetHandler: function(a, b) {
if (this.TYPE_DRAG_ZOOM === a) {
this.blDragZoom = b
} else {
if (this.TYPE_PLUGIN === a) {
this.blPlugin = b
} else {
this.blAbsPos = false;
this.blPtz = false;
if (this.TYPE_ABS === a) {
this.blAbsPos = b
} else {
if (this.TYPE_PTZ === a) {
this.blPtz = b
}
}
}
}
this.UpdateHandler()
},
UpdateHandler: function() {
if ((true === this.blDragZoom) || (true === this.IsDigitalZoom())) {
this.handler = this.dragZoomHandler
} else {
if (true === this.blAbsPos) {
this.handler = this.absHandler
} else {
if (true === this.blPtz) {
this.handler = this.ptzHandler
} else {
if (true === this.blPlugin) {
this.handler = this.pluginHandler
} else {
this.handler = this.emptyHandler
}
}
}
}
this.SetCursorStyle(SYNO.SS.Plugin.CursorType.ARROW)
},
ResetDragZoom: function() {
this.dragZoomHandler.OnReset()
},
ApplyDragZoom: function() {
if (true === this.IsDigitalZoom()) {
this.dragZoomHandler.OnApply()
}
},
SetPtzInfo: function(a) {
this.ptzHandler.ptzInfo = a;
if ((true === this.blPtz) && (0 >= this.ptzHandler.GetPtzDirection())) {
this.SetHandler(this.TYPE_PTZ, false)
}
},
OnMouseLeave: function(a) {
this.handler.OnMouseLeave(a)
},
OnMouseMove: function(a) {
if (true === this.parentWin.panelOSD.IsMouseInside(a)) {
this.OnMouseLeave(a)
} else {
this.handler.OnMouseMove(a)
}
},
OnMouseDown: function(a) {
if (this.emptyHandler !== this.handler) {
a.preventDefault()
}
if (true === this.parentWin.panelOSD.IsMouseInside(a)) {
return
}
this.blMouseDown = true;
this.handler.OnMouseDown(a);
if (true === this.handler.ENABLE_DRAG) {
this.blDragging = true;
this.blDragStart = false
}
},
OnMouseUp: function(a, b) {
if (false === this.blMouseDown) {
return
}
this.blMouseDown = false;
this.handler.OnMouseUp(a, b);
if (false === this.blDragStart) {
this.blDragging = false
}
},
OnDragStart: function(a) {
if (false === this.blDragging) {
return
}
this.blDragStart = true;
document.body.appendChild(this.cursorCanvas);
this.AddToggleActEvent()
},
AddToggleActEvent: function() {
this.RemoveToggleActEvent();
this.fnToggleAct = function(a) {
a.xy = [a.x, a.y];
this.ToggleAct(a)
}.createDelegate(this);
this.cursorCanvas.addEventListener("contextmenu", this.fnToggleAct)
},
RemoveToggleActEvent: function() {
if (this.fnToggleAct) {
this.cursorCanvas.removeEventListener("contextmenu", this.fnToggleAct);
this.fnToggleAct = null
}
},
OnDragEnd: function(a) {
if (false === this.blDragging) {
return
}
this.blDragging = false;
this.RemoveToggleActEvent();
document.body.removeChild(this.cursorCanvas);
if (false === SYNO.SS.Utils.IsPosInBoxComponent(this.parentWin.getBox(), a.xy[0], a.xy[1])) {
this.parentWin.panelOSD.hide()
}
},
OnDrag: function(a) {
if (false === this.blDragging) {
return
}
this.handler.OnDrag(a)
},
OnMouseWheel: function(a) {
var b = a.getWheelDelta();
if ((0 === b) || (true === this.parentWin.panelOSD.IsMouseInside(a))) {
return
}
if (this.pluginHandler === this.handler) {
this.pluginHandler.OnMouseWheel(a)
} else {
if ((false === this.IsDigitalZoom()) && (true === this.ptzHandler.HasPTZCap(PTZ_HAS_ZOOM))) {
this.ptzHandler.OnMouseWheel(b)
} else {
this.dragZoomHandler.OnMouseWheel(b)
}
}
},
ToggleAct: function(a) {
if ((this.MOUSE_KEY_RIGHT !== a.button) || (false === this.blDragging) || (false === this.blDragZoom)) {
return
}
this.OnMouseUp(a, true);
this.OnDragEnd(a);
if (true === SYNO.SS.Utils.IsPosInBoxComponent(this.parentWin.getBox(), a.xy[0], a.xy[1])) {
this.handler.SetCursor(a)
}
},
SetCursorStyle: function(a) {
var b;
if (this.cursorType === a) {
return
}
this.cursorType = a;
b = SYNO.SS.Plugin.Utils.GetCursorStyle(a);
this.parentWin.el.dom.style.cursor = b;
this.cursorCanvas.style.cursor = b
},
GetCursorStyle: function() {
return this.cursorType
},
IsDigitalZoom: function() {
return this.dragZoomHandler.IsZoom()
},
Resize: function(b, a) {
var d = this.videoWidth;
var c = this.videoHeight;
this.videoWidth = b;
this.videoHeight = a;
if (true === this.IsDigitalZoom()) {
this.dragZoomHandler.OnResize(b, a, d, c)
}
}
});
Ext.define("SYNO.SS.App.WebPlayer.OnScreenControl.Empty", {
OnMouseLeave: Ext.emptyFn,
OnMouseMove: Ext.emptyFn,
OnMouseDown: Ext.emptyFn,
OnMouseUp: Ext.emptyFn,
SetCursor: Ext.emptyFn
});
Ext.define("SYNO.SS.App.WebPlayer.OnScreenControl.PTZ", {
ENABLE_DRAG: true,
MAX_PTZ_DIRECTION: 32,
PTZ_MOVE_TIME: 500,
WHEEL_DURATION: 1000,
ZOOM_STOP_DELAY_TIME: 500,
PT_CURSOR_INIT: 7,
parentWin: null,
onScreenHandler: null,
prevPTDir: -1,
panTiltTimer: null,
wheelTimer: null,
blPrevDoPtz: false,
ptzInfo: null,
constructor: function(a) {
this.parentWin = a.parentWin;
this.onScreenHandler = a.onScreenHandler
},
OnMouseLeave: function(a) {
if (false === this.parentWin.IsDragging()) {
this.onScreenHandler.SetCursorStyle(SYNO.SS.Plugin.CursorType.ARROW)
}
},
OnMouseMove: function(a) {
if (false === this.parentWin.IsDragging()) {
this.OnPanTilt(a, false)
}
},
OnMouseDown: function(a) {
this.OnPanTilt(a, true)
},
OnMouseUp: function(a) {
this.OnPanTilt(a, false)
},
OnDrag: function(a) {
this.OnPanTilt(a, true)
},
OnMouseWheel: function(a) {
a = (0 < a) ? 1 : -1;
if (this.wheelTimer) {
return
}
this.wheelTimer = setTimeout(function() {
this.wheelTimer = null
}.createDelegate(this), this.WHEEL_DURATION);
this.OnScreenPtz("Zoom", SYNO.SS.App.WebPlayer.Def.Ptz.Action.PTZ_START, a);
setTimeout(function() {
this.OnScreenPtz("Zoom", SYNO.SS.App.WebPlayer.Def.Ptz.Action.PTZ_STOP, a)
}.createDelegate(this), this.ZOOM_STOP_DELAY_TIME)
},
OnPanTilt: function(c, a) {
var b = this.CalculatePTDir(c);
if (-1 === b) {
return
}
if (true === a) {
if ((false === this.blPrevDoPtz) || (this.prevPTDir !== b)) {
this.DoPanTilt(SYNO.SS.App.WebPlayer.Def.Ptz.Action.PTZ_START, b)
}
} else {
if (true === this.blPrevDoPtz) {
this.DoPanTilt(SYNO.SS.App.WebPlayer.Def.Ptz.Action.PTZ_STOP, this.prevPTDir)
}
}
this.prevPTDir = b;
this.blPrevDoPtz = a;
this.SetPtzCursor(b, a)
},
CalculatePTDir: function(f) {
var a = -1;
var d = this.GetPtzDirection();
var c, b, g;
if (0 >= d) {
return -1
}
c = this.CalculateTheta(f);
b = ((2 === d) && (true === this.HasPTZCap(PTZ_HAS_TILT)));
g = (true === b) ? 0 : (360 / d / 2);
c = c + g;
c = (c >= 360) ? (c - 360) : c;
a = Math.floor(c * d / 360) * (this.MAX_PTZ_DIRECTION / d);
if (b) {
a += this.MAX_PTZ_DIRECTION / d / 2
}
return a
},
GetPtzDirection: function() {
var a = (this.ptzInfo) ? this.ptzInfo.ptzDirection : -1;
return (0 < a) ? a : -1
},
CalculateTheta: function(c) {
var b = this.parentWin.getBox();
var f = c.xy[0] - (b.x + b.width / 2);
var d = (b.y + b.height / 2) - c.xy[1];
var a = Math.floor(Math.atan2(d, f) * 180 / Math.PI);
return (a > 0) ? a : (360 + a)
},
HasPTZCap: function(a) {
if (this.ptzInfo) {
return (0 !== SYNO.SS.Utils.IsFlags(this.ptzInfo.ptz || this.ptzInfo.ptzCap, a))
}
return false
},
DoPanTilt: function(b, a) {
if (SYNO.SS.App.WebPlayer.Def.Ptz.Action.PTZ_STOP === b) {
clearTimeout(this.panTiltTimer);
this.panTiltTimer = null
} else {
if (this.panTiltTimer) {
return
}
this.panTiltTimer = setTimeout(function() {
this.panTiltTimer = null
}.createDelegate(this), this.PTZ_MOVE_TIME)
}
this.OnScreenPtz("Move", b, a)
},
OnScreenPtz: function(c, b, a) {
if (this.parentWin.panelOSD.ptzController) {
this.parentWin.panelOSD.ptzController.OnScreenPtz(b, c, a)
}
},
SetPtzCursor: function(c, a) {
var b;
if (-1 === c) {
return
}
b = this.PT_CURSOR_INIT + c + ((true === a) ? this.MAX_PTZ_DIRECTION : 0);
this.onScreenHandler.SetCursorStyle(b)
},
SetCursor: function(a) {
this.SetPtzCursor(this.CalculatePTDir(a), false)
}
});
Ext.define("SYNO.SS.App.WebPlayer.OnScreenControl.ABSPosition", {
ABS_DURATION: 1000,
ABS_WIDTH: 640,
ABS_HEIGHT: 480,
parentWin: null,
onScreenHandler: null,
delayTimer: null,
blCursorClick: false,
constructor: function(a) {
this.parentWin = a.parentWin;
this.onScreenHandler = a.onScreenHandler
},
OnMouseLeave: function(a) {
this.blCursorClick = false;
this.onScreenHandler.SetCursorStyle(SYNO.SS.Plugin.CursorType.ARROW)
},
OnMouseMove: function(a) {
this.OnAbsPosition(a, this.blCursorClick)
},
OnMouseDown: function(a) {
this.blCursorClick = true;
this.OnAbsPosition(a, true)
},
OnMouseUp: function(a) {
this.blCursorClick = false;
this.OnAbsPosition(a, false)
},
OnAbsPosition: function(a, b) {
if (true === b) {
this.DoAbsPosition(a)
}
this.SetCursor()
},
DoAbsPosition: function(b) {
if (this.delayTimer) {
return
}
this.delayTimer = setTimeout(function() {
this.delayTimer = null
}.createDelegate(this), this.ABS_DURATION);
var a = this.parentWin.getSize();
var d = b.browserEvent.offsetX * this.ABS_WIDTH / a.width;
var c = b.browserEvent.offsetY * this.ABS_HEIGHT / a.height;
if (this.parentWin.panelOSD.ptzController) {
this.parentWin.panelOSD.ptzController.OnAbsPosition(d, c)
}
},
SetCursor: function() {
if (true === this.blCursorClick) {
this.onScreenHandler.SetCursorStyle(SYNO.SS.Plugin.CursorType.CLICK_ABS)
} else {
this.onScreenHandler.SetCursorStyle(SYNO.SS.Plugin.CursorType.NORMAL_ABS)
}
}
});
Ext.define("SYNO.SS.App.WebPlayer.OnScreenControl.DragZoom", {
ENABLE_DRAG: true,
MAX_SCALE_SIZE: 16,
WHEEL_SCALE_STEP: 0.25,
parentWin: null,
onScreenHandler: null,
dragContext: null,
videoBox: null,
blCursorClick: false,
scaleSize: 1,
prevX: 0,
prevY: 0,
fnZoomDone: null,
imgX: 0,
imgY: 0,
constructor: function(a) {
this.parentWin = a.parentWin;
this.onScreenHandler = a.onScreenHandler;
this.dragContext = a.cursorCanvas.getContext("2d")
},
OnMouseLeave: function(a) {
if (false === this.parentWin.IsDragging()) {
this.onScreenHandler.SetCursorStyle(SYNO.SS.Plugin.CursorType.ARROW)
}
},
OnMouseMove: function(a) {
if (false === this.parentWin.IsDragging()) {
this.SetCursor()
}
},
OnMouseDown: function(a) {
this.blCursorClick = true;
this.SetCursor();
this.parentWin.panelOSD.hide();
this.prevX = a.xy[0];
this.prevY = a.xy[1];
if (true === this.onScreenHandler.blDragZoom) {
this.InitDragCanvas();
this.videoBox = this.parentWin.getBox()
}
},
OnMouseUp: function(a, b) {
this.blCursorClick = false;
this.SetCursor();
if (true === this.onScreenHandler.blDragZoom) {
this.ResetCanvas();
if (!b) {
this.OnDragZoom(this.prevX, this.prevY, a.xy[0], a.xy[1]);
this.parentWin.panelOSD.ToggleDragZoom(false)
}
} else {
if (this.fnZoomDone) {
this.fnZoomDone(this.GetDragZoomSetting())
}
}
},
OnMouseWheel: function(b) {
var a = (0 < b) ? this.WHEEL_SCALE_STEP : -this.WHEEL_SCALE_STEP;
this.OnDigitalZoom(this.scaleSize + a);
if (this.fnZoomDone) {
this.fnZoomDone(this.GetDragZoomSetting())
}
},
OnDrag: function(a) {
if (true === this.onScreenHandler.blDragZoom) {
this.DrawDragRect(this.prevX, this.prevY, a.xy[0], a.xy[1])
} else {
this.OnMove(a.xy[0] - this.prevX, a.xy[1] - this.prevY);
this.prevX = a.xy[0];
this.prevY = a.xy[1]
}
},
OnReset: function() {
this.ResetCanvas();
this.OnDigitalZoom(1);
this.parentWin.panelOSD.ToggleDragZoom(false);
if (this.fnZoomDone) {
this.fnZoomDone([])
}
},
OnApply: function() {
this.DoScale(this.scaleSize, this.scaleSize);
this.UpdateZoom();
this.UpdateNumber(this.scaleSize)
},
IsZoom: function() {
return (1 < this.scaleSize)
},
DoScale: function(a, c) {
var b = (this.parentWin.videoInst) ? this.parentWin.videoInst.GetNode() : null;
var e = (this.parentWin.privacyMask && this.parentWin.privacyMask.el) ? this.parentWin.privacyMask.el.dom : null;
var d = (this.parentWin.fisheyePanel && this.parentWin.fisheyePanel.el) ? this.parentWin.fisheyePanel.el.dom : null;
if (b) {
b.style.transform = String.format("scale({0})", a)
}
if (e) {
e.style.transform = String.format("scale({0})", a)
}
if (d) {
d.style.transform = String.format("scale({0})", a)
}
this.OnResize(a, a, c, c);
if (c !== a) {
this.parentWin.OnScaleChanged()
}
},
UpdateZoom: function() {
this.parentWin.panelOSD.CheckResetZoomVisible();
this.onScreenHandler.UpdateHandler()
},
UpdateNumber: function() {
if (true === this.IsZoom()) {
this.parentWin.panelOSD.UpdateZoomNumber(this.scaleSize)
}
},
OnDigitalZoom: function(a) {
var c = this.IsZoom();
var b = this.scaleSize;
a = Math.min(a, this.MAX_SCALE_SIZE);
a = Math.max(a, 1);
if (b === a) {
return
}
this.scaleSize = a;
this.DoScale(this.scaleSize, b);
if (this.IsZoom() !== c) {
this.UpdateZoom()
}
this.UpdateNumber(this.scaleSize)
},
OnResize: function(c, b, f, d) {
var a = this.imgX * c / f;
var e = this.imgY * b / d;
this.OnMove(a - this.imgX, e - this.imgY)
},
OnMove: function(a, e) {
var b = (this.parentWin.videoInst) ? this.parentWin.videoInst.GetNode() : null;
var d = (this.parentWin.privacyMask && this.parentWin.privacyMask.el) ? this.parentWin.privacyMask.el.dom : null;
var c = (this.parentWin.fisheyePanel && this.parentWin.fisheyePanel.el) ? this.parentWin.fisheyePanel.el.dom : null;
this.imgX = this.GetBoundDistance(this.imgX + a, this.onScreenHandler.videoWidth);
this.imgY = this.GetBoundDistance(this.imgY + e, this.onScreenHandler.videoHeight);
if (b) {
b.style.left = Math.floor(this.imgX) + "px";
b.style.top = Math.floor(this.imgY) + "px"
}
if (d) {
d.style.left = Math.floor(this.imgX) + "px";
d.style.top = Math.floor(this.imgY) + "px"
}
if (c) {
c.style.left = Math.floor(this.imgX) + "px";
c.style.top = Math.floor(this.imgY) + "px"
}
},
GetBoundDistance: function(b, a) {
a = (this.scaleSize - 1) * a / 2;
b = Math.max(b, -a);
b = Math.min(b, a);
return b
},
SetCursor: function() {
var a;
if (true === this.onScreenHandler.blDragZoom) {
a = (true === this.blCursorClick) ? SYNO.SS.Plugin.CursorType.DRAG_ZOOM_CLICK : SYNO.SS.Plugin.CursorType.DRAG_ZOOM
} else {
a = (true === this.blCursorClick) ? SYNO.SS.Plugin.CursorType.CLOSEHAND : SYNO.SS.Plugin.CursorType.OPENHAND
}
this.onScreenHandler.SetCursorStyle(a)
},
InitDragCanvas: function() {
var a = Ext.getBody().getViewSize();
if ((a.width !== this.dragContext.canvas.width) || (a.height !== this.dragContext.canvas.height)) {
this.dragContext.canvas.width = a.width;
this.dragContext.canvas.height = a.height;
this.dragContext.lineWidth = 2;
this.dragContext.strokeStyle = "white";
this.dragContext.setLineDash([6, 6])
}
},
ResetCanvas: function() {
if (this.videoBox) {
this.dragContext.clearRect(this.videoBox.x - 1, this.videoBox.y - 1, this.videoBox.width + 2, this.videoBox.height + 2)
}
},
DrawDragRect: function(b, a, e, c) {
var d = this.GetFitVideoRatioRect(b, a, e, c);
this.ResetCanvas();
this.dragContext.beginPath();
this.dragContext.rect(d.x, d.y, d.width, d.height);
this.dragContext.stroke()
},
GetFitVideoRatioRect: function(c, b, i, g) {
var a = i - c;
var h = g - b;
var e = this.videoBox.x - c + ((0 < a) ? this.videoBox.width : 0);
var f = this.videoBox.y - b + ((0 < h) ? this.videoBox.height : 0);
var d = Math.max(Math.abs(a) / this.videoBox.width, Math.abs(h) / this.videoBox.height);
d = Math.min(d, Math.abs(e) / this.videoBox.width);
d = Math.min(d, Math.abs(f) / this.videoBox.height);
return {
x: c,
y: b,
width: d * this.videoBox.width * ((0 < a) ? 1 : -1),
height: d * this.videoBox.height * ((0 < h) ? 1 : -1)
}
},
OnDragZoom: function(d, c, h, g) {
var f = this.GetFitVideoRatioRect(d, c, h, g);
var i = this.videoBox.width / Math.abs(f.width);
var e = this.videoBox.x + this.videoBox.width / 2 - f.x - f.width / 2;
var b = this.videoBox.y + this.videoBox.height / 2 - f.y - f.height / 2;
var a = this.scaleSize;
this.OnDigitalZoom(this.scaleSize * i);
i = this.scaleSize / a;
this.OnMove(e * i, b * i);
if (this.fnZoomDone) {
this.fnZoomDone(this.GetDragZoomSetting())
}
},
GetDragZoomSetting: function() {
var e = this.parentWin.videoInst;
if (!e) {
return []
}
var d = e.GetNode().getBoundingClientRect();
var a = this.parentWin.el.dom.getBoundingClientRect();
var c = (d.x - a.x) / a.width;
var b = (d.y - a.y) / a.height;
return [this.scaleSize, c, b]
},
ApplyDragZoomSetting: function(d) {
var b = this.parentWin.el.dom.getBoundingClientRect();
var c = d[0];
var a = d[1] * b.width;
var g = d[2] * b.height;
var f = this.parentWin.videoInst;
if (!f) {
return
}
this.OnDigitalZoom(c);
var e = f.GetNode().getBoundingClientRect();
this.OnMove(a - (e.x - b.x), g - (e.y - b.y))
}
});
Ext.define("SYNO.SS.App.WebPlayer.OnScreenControl.Fisheye", {
parentWin: null,
onScreenHandler: null,
pluginDom: null,
QT_MOUSE_DOWN: 2,
QT_MOUSE_UP: 3,
QT_MOUSE_MOVE: 5,
QT_WHEEL: 31,
blCursorClick: false,
constructor: function(a) {
this.parentWin = a.parentWin;
this.onScreenHandler = a.onScreenHandler
},
OnMouseLeave: function(a) {},
OnMouseMove: function(a) {
if (false === this.blCursorClick) {
return
}
this.SendMouseEvtToPlugin(a)
},
OnMouseDown: function(a) {
this.blCursorClick = true;
this.SendMouseEvtToPlugin(a)
},
OnMouseUp: function(a) {
this.blCursorClick = false;
this.SendMouseEvtToPlugin(a)
},
OnMouseWheel: function(a) {
this.SendMouseEvtToPlugin(a)
},
SendMouseEvtToPlugin: function(d) {
var b = this.parentWin.getSize();
var c = (0 === this.parentWin.owner.regionId);
var a = null;
if ((true === c) && (!this.parentWin.dewarpVideoPanel) && (false === this.parentWin.blAnalyticsEdit)) {
return
}
if ((true === c) && (this.parentWin.dewarpVideoPanel)) {
a = this.parentWin.dewarpVideoPanel.videoInst.GetNode()
} else {
a = this.parentWin.videoInst.GetNode()
}
if ((a) && (true == Ext.isDefined(a.postMessage))) {
a.postMessage({
method: "MouseEvt",
evtType: this.GetMouseEvtType(d),
pointX: d.browserEvent.offsetX / b.width,
pointY: d.browserEvent.offsetY / b.height,
delta: d.getWheelDelta(),
blOriginView: c
})
}
this.SetCursor()
},
SetCursor: function() {
if (true === this.blCursorClick) {
this.onScreenHandler.SetCursorStyle(SYNO.SS.Plugin.CursorType.CLOSEHAND)
} else {
this.onScreenHandler.SetCursorStyle(SYNO.SS.Plugin.CursorType.ARROW)
}
},
GetMouseEvtType: function(a) {
if ("mousedown" === a.type) {
return this.QT_MOUSE_DOWN
} else {
if ("mouseup" === a.type) {
return this.QT_MOUSE_UP
} else {
if ("mousemove" === a.type) {
return this.QT_MOUSE_MOVE
} else {
if ("mousewheel" === a.type) {
return this.QT_WHEEL
}
}
}
}
}
});
Ext.define("SYNO.SS.App.WebPlayer.TransactionContainer", {
extend: "Ext.Container",
posId: -1,
displayPositions: null,
displayFields: null,
position: null,
lineHeight: null,
textBgColor: null,
dsPOS: null,
mode: "live",
eleId: null,
behavior: null,
blOsdVisible: false,
blUpdateVisible: true,
location: -1,
constructor: function(a) {
var b = [{
xtype: "spacer",
width: 5,
height: 1
}];
this.displayPositions = [SYNO.SS.App.Transactions.Def.Position.LEFT, SYNO.SS.App.Transactions.Def.Position.RIGHT];
this.Init(a);
Ext.apply(a, {
cls: "transaction_panel",
layout: "column",
items: b.concat(this.displayFields).concat(b)
});
this.callParent([a]);
this.InitBehavior();
this.InitEventHandler();
this.UpdateOsdBtnStatus(true)
},
Init: function(a) {
this.posId = a.posId;
this.position = this.displayPositions[0];
this.location = a.location;
this.displayFields = [];
Ext.each(this.displayPositions, function() {
this.displayFields.push(new SYNO.ux.DisplayField({
hidden: false,
markInvalid: null,
clearInvalid: null
}))
}, this);
this.mode = a.mode;
this.dsPOS = new Ext.data.JsonStore({
root: "data",
idProperty: "id",
fields: this.fieldPOS
});
SYNO.SS.Utils.StoreDataCopy(SYNO.SS.GblStore.dsPOS, this.dsPOS)
},
InitBehavior: function() {
if ("live" === this.mode) {
this.behavior = new SYNO.SS.App.WebPlayer.TransactionContainer.LiveBehavior(this)
} else {
this.behavior = new SYNO.SS.App.WebPlayer.TransactionContainer.RecordingBehavior(this)
}
},
InitEventHandler: function() {
this.mon(this.displayFields[this.displayFields.length - 1], "afterrender", this.InitDisplayEvent, this);
this.mon(this.displayFields[this.displayFields.length - 1], "afterrender", function() {
this.behavior.AfterRender(this);
this.doLayout()
}, this);
this.mon(this, "beforedestroy", function() {
this.behavior.BeforeDestroy(this);
this.dsPOS.destroy();
delete this.dsPOS
}, this);
Ext.each(this.displayFields, function(a) {
this.mon(a, "afterrender", function() {
this.UpdateFieldSize(a)
}, this)
}, this)
},
InitDisplayEvent: function() {
this.mon(SYNO.SDS.StatusNotifier, "POSUpdate", this.OnPOSUpdate, this);
this.mon(SYNO.SS.GblStore.dsSlaveDS, "storeupdate", function(b, a) {
this.behavior.OnSlaveDsUpdate(b, a)
}, this)
},
ReplaceResult: function(a) {
if ("record" === this.mode) {
this.behavior.ReplaceResult(a)
}
},
Draw: function(a) {
if ("record" === this.mode) {
this.behavior.Draw(a)
}
},
OnPOSUpdate: function(a) {
Ext.each(a.POSStatus, function(b) {
this.UpdatePosStore(b.updateData);
if ((true === Ext.isDefined(b.updateData)) && (b.updateData.id === this.posId)) {
this.behavior.OnCurrentPosUpdated(b.updateData)
}
}, this)
},
OnResize: function() {
this.doLayout();
Ext.each(this.displayFields, function(a) {
this.UpdateFieldSize(a)
}, this);
this.behavior.OnContainerResize(this)
},
GetContentWidth: function() {
var b = 5;
var c = 5;
var a = this.getWidth();
if ((0 === a) && (this.owner)) {
if (false === isNaN(this.owner.ctWidth)) {
a = this.owner.ctWidth
} else {
if ((undefined !== this.owner.voRectList) && (undefined !== this.owner.voRectList[this.location]) && (false === isNaN(this.owner.voRectList[this.location].width))) {
a = this.owner.voRectList[this.location].width
} else {
if ((undefined !== this.owner.voRect) && (false === isNaN(this.owner.voRect.width))) {
a = this.owner.voRect.width
}
}
}
}
return a - b - c
},
GetLineWidth: function() {
return Math.floor(this.GetContentWidth() / this.displayPositions.length)
},
GetMaxLineCount: function() {
var c = 4;
var b = 4;
var a = this.getHeight();
if ((0 === a) && (this.owner) && (false === isNaN(this.owner.ctHeight))) {
a = this.owner.ctHeight
}
return Math.floor((a - c - b) / this.lineHeight)
},
UpdatePosMsg: function(b, c) {
if (0 === c.length) {
this.displayFields[b].setValue("")
} else {
var d = c.map(function(e) {
return e + "<br/>"
}).join("");
var a = "<font style='background-color: " + this.textBgColor + "; line-height: " + this.lineHeight + "px;'>" + d + "</font>";
this.displayFields[b].setValue(a)
}
},
UpdatePosStore: function(b) {
var a = this.dsPOS.findExact("id", this.posId);
if (-1 !== a) {
Ext.apply(this.dsPOS.getAt(a).data, b)
}
},
UpdatePosStyle: function(a) {
a = Ext.applyIf(a, {
osd_position: SYNO.SS.App.Transactions.Def.OSD.Default.POSITION,
osd_fontsize: SYNO.SS.App.Transactions.Def.OSD.Default.FONT_SIZE,
osd_textalign: SYNO.SS.App.Transactions.Def.OSD.Default.TEXT_ALIGN,
osd_fontcolor: SYNO.SS.App.Transactions.Def.OSD.Default.FONT_COLOR,
osd_bg_color: SYNO.SS.App.Transactions.Def.OSD.Default.BG_COLOR,
osd_bg_trans: SYNO.SS.App.Transactions.Def.OSD.Default.BG_TRANS,
osd_fontstyle: SYNO.SS.App.Transactions.Def.OSD.Default.FONT_STYLE
});
this.position = a.osd_position;
this.SetFontStyle(a);
this.SetDisplayBgStyle(a)
},
LoadPosDevice: function(b, c, f) {
if (this.isDestroyed) {
return
}
this.SetVisibleByUpdate(false);
var e = function(g) {
this.posId = g.id;
this.SetVisibleByUpdate(true);
if (true === Ext.isFunction(f)) {
f.call(this, g.data)
}
}.createDelegate(this);
var a;
var d = function(g) {
if (LOCAL_DS_ID === b) {
return g.id === c
} else {
return (g.data.ds_id === b) && (g.data.id_on_rec_server === c)
}
};
if (0 <= (a = this.dsPOS.findBy(d))) {
e(this.dsPOS.getAt(a))
}
},
SetFontStyle: function(a) {
Ext.each(this.displayFields, function(f) {
var d = f.el;
var e = String.format("{0}px", a.osd_fontsize);
var c;
var b = SYNO.SS.App.Transactions.GetFontAlign(a.osd_textalign);
var g = SYNO.SS.App.Transactions.GetFontStyleStr(a.osd_fontstyle);
this.lineHeight = this.GetLineHeight(a.osd_fontsize);
c = String.format("{0}px", this.lineHeight);
if (undefined !== d) {
d.setStyle("color", a.osd_fontcolor);
d.setStyle("font-size", e);
d.setStyle("line-height", c);
d.setStyle("text-align", b);
d.setStyle("font-weight", g)
}
}, this)
},
GetLineHeight: function(a) {
return SYNO.SS.App.Transactions.Utils.GetFontLineHeight(a)
},
SetDisplayBgStyle: function(a) {
this.textBgColor = this.GetTextBgColor(a.osd_bg_color, a.osd_bg_trans)
},
GetTextBgColor: function(c, d) {
var f = parseInt(c.slice(1, 3), 16),
e = parseInt(c.slice(3, 5), 16),
a = parseInt(c.slice(5, 7), 16);
if (d) {
return "rgba(" + f + ", " + e + ", " + a + ", " + String.format("{0}", (1 - d / 100)) + ")"
} else {
return "rgb(" + f + ", " + e + ", " + a + ")"
}
},
UpdateFieldSize: function(a) {
if (undefined === a.el) {
return
}
a.el.setStyle("width", "calc(50% - 5px)");
a.el.setStyle("height", "100%")
},
UpdateOsdBtnStatus: function(a) {
if (false === Ext.isEmpty(this.owner.panelOSD)) {
this.owner.panelOSD.SetTransactionBtn(a)
}
},
SetVisibleByOsd: function(a) {
this.blOsdVisible = a;
this.UpdateVisibility()
},
SetVisibleByUpdate: function(a) {
this.blUpdateVisible = a;
this.UpdateVisibility()
},
UpdateVisibility: function() {
this.setVisible((0 < this.posId) && this.blOsdVisible && this.blUpdateVisible)
}
});
Ext.define("SYNO.SS.App.WebPlayer.TransactionContainer.TextBuffer", {
owner: null,
lines: null,
rowCapacity: null,
lineWidth: null,
popTextLineIntervalMs: null,
minDisplayTimeMs: null,
maxDisplayTimeMs: null,
lastPopTimestamp: null,
lastInsertTimestamp: null,
refreshTask: null,
contentChangeCallbacks: null,
constructor: function(a) {
this.owner = a;
this.lines = [];
this.rowCapacity = 10;
this.lineWidth = 300;
this.popTextLineIntervalMs = 0;
this.minDisplayTimeMs = 1000;
this.maxDisplayTimeMs = 10000;
this.refreshTask = new Ext.util.DelayedTask(this.RefreshContent, this);
this.contentChangeCallbacks = []
},
SetRowCapacity: function(a) {
if (0 < a) {
this.rowCapacity = a;
this.RefreshContent();
this.NotifyContentChange()
}
},
SetLineWidth: function(a) {
if (0 < a) {
this.lineWidth = a;
this.RejoinLines();
this.WrapLines(0);
this.RefreshContent();
this.NotifyContentChange()
}
},
RejoinLines: function() {
for (var a = 0; a < this.lines.length; a++) {
while ((a + 1 < this.lines.length) && ("" === this.lines[a].linebreak)) {
this.lines[a].content += this.lines[a + 1].content;
this.lines[a].linebreak = this.lines[a + 1].linebreak;
this.lines.splice(a + 1, 1)
}
}
},
Clear: function() {
this.lines = [];
this.RefreshContent();
this.NotifyContentChange()
},
Append: function(b) {
var a = this.lines.length;
if ((0 === this.lines.length) || ("" !== this.lines[this.lines.length - 1].linebreak)) {
b.content = Ext.util.Format.htmlEncode(b.content);
b.linebreak = Ext.util.Format.htmlEncode(b.linebreak);
this.lines.push(b)
} else {
this.lines[this.lines.length - 1].content += Ext.util.Format.htmlEncode(b.content);
this.lines[this.lines.length - 1].linebreak = Ext.util.Format.htmlEncode(b.linebreak);
this.lines[this.lines.length - 1].timestamp = undefined
}
this.SplitLines();
this.WrapLines(a);
this.RefreshContent();
this.NotifyContentChange()
},
SplitLines: function() {
for (var d = 0; d < this.lines.length; d++) {
var c = this.lines[d];
var a = c.content.split("\n");
if (1 === a.length) {
continue
}
this.lines.splice(d, 1);
for (var b = 0; b < a.length; b++) {
this.lines.splice(d + b, 0, {
content: a[b],
linebreak: ((b + 1 < a.length) ? "\n" : c.linebreak),
timestamp: c.timestamp
})
}
}
},
WrapLines: function(a) {
var e = this.owner.container.displayFields[0].el;
a = a || 0;
for (var d = a; d < this.lines.length;) {
var c = SYNO.SS.Utils.WrapText(this.lines[d].content, this.lineWidth, e);
for (var b = 0; b < c.length; b++) {
var f = {
content: c[b],
linebreak: (b + 1 == c.length ? this.lines[d].linebreak : ""),
timestamp: this.lines[d].timestamp
};
this.lines.splice(d + b + 1, 0, f)
}
this.lines.splice(d, 1);
d += c.length
}
},
GetContentList: function() {
return this.lines.slice(0, Math.min(this.lines.length, this.rowCapacity)).map(function(a) {
return a.content
})
},
NotifyContentChange: function() {
Ext.each(this.contentChangeCallbacks, function(a) {
a()
}, this)
},
SubscribeContentChange: function(a) {
this.contentChangeCallbacks.push(a)
},
Destroy: function() {
this.refreshTask.cancel()
},
RefreshContent: function() {
var a = new Date().getTime();
var b = false;
if (true === this.PopStaleLines(a)) {
b = true
}
if (true === this.PushNewLines(a)) {
b = true
}
if (a > this.lastInsertTimestamp + this.maxDisplayTimeMs) {
this.lines = [];
b = true
}
if (true === b) {
this.NotifyContentChange()
}
this.ScheduleNextRefresh(a)
},
PopStaleLines: function(a) {
var d = false;
if ((null === this.lastPopTimestamp) || (a - this.lastPopTimestamp >= this.popTextLineIntervalMs)) {
var c = ((0 < this.lines.length) && (this.lines.length > this.rowCapacity) && (this.lines[0].timestamp + this.minDisplayTimeMs < a));
if (true === c) {
this.lines.shift();
this.lastPopTimestamp = a;
d = true
}
}
for (var b = this.rowCapacity; b < this.lines.length; b++) {
this.lines.timestamp = undefined
}
return d
},
PushNewLines: function(a) {
var c = false;
for (var b = 0;
(b < this.lines.length) && (b < this.rowCapacity); b++) {
if (!this.lines[b].timestamp) {
this.lines[b].timestamp = a;
this.lastInsertTimestamp = a;
c = true
}
}
return c
},
ScheduleNextRefresh: function(a) {
if (0 === this.lines.length) {
this.refreshTask.cancel()
} else {
var b = 0;
if (this.lines.length > this.rowCapacity) {
b = this.minDisplayTimeMs - (a - this.lines[0].timestamp)
} else {
b = this.maxDisplayTimeMs - (a - this.lastInsertTimestamp)
}
if (null !== this.lastPopTimestamp) {
b = Math.max(b, this.popTextLineIntervalMs - (a - this.lastPopTimestamp))
}
this.refreshTask.delay(b)
}
}
});
Ext.define("SYNO.SS.App.WebPlayer.TransactionContainer.Behavior", {
container: null,
constructor: function(a) {
this.container = a
},
AfterRender: function() {},
BeforeDestroy: function() {},
OnPosLoaded: function(a) {},
OnCurrentPosUpdated: function(a) {},
OnContainerResize: function() {},
RefreshContent: function() {},
OnSlaveDsUpdate: function() {}
});
Ext.define("SYNO.SS.App.WebPlayer.TransactionContainer.LiveBehavior", {
extend: "SYNO.SS.App.WebPlayer.TransactionContainer.Behavior",
status: SYNO.SS.TransDev.Status.NORMAL,
wsHandler: null,
textBuffer: null,
ds_id: LOCAL_DS_ID,
constructor: function(a) {
this.callParent([a]);
this.textBuffer = new SYNO.SS.App.WebPlayer.TransactionContainer.TextBuffer(this)
},
InitWsHandler: function(c) {
var b = {};
var a = this.container.findAppWindow();
if ((a) && (LOCAL_DS_ID !== a.getAppDSId())) {
b.dsId = appDsId;
b.idOnRec = c.id
} else {
b.dsId = c.ds_id;
b.id = c.id;
b.idOnRec = c.id_on_rec_server
}
this.ds_id = b.dsId;
b.fnOnWSMessage = this.OnWSMessage.createDelegate(this);
b.WSTarget = "ss_transaction_task";
this.wsHandler = new SYNO.SS.App.WebPlayer.WSStreamHandler(b)
},
OnWSMessage: function(b) {
var c = Ext.decode(b.data);
var a = this.wsHandler.config.id;
if (true === c.clearTrigger) {
this.textBuffer.Clear()
} else {
if (undefined !== c.content) {
this.textBuffer.Append(c)
}
}
},
UpdateLineCount: function() {
this.textBuffer.SetRowCapacity(this.container.GetMaxLineCount());
this.textBuffer.SetLineWidth(this.container.GetLineWidth())
},
AfterRender: function() {
this.textBuffer.SubscribeContentChange(function() {
this.RefreshContent()
}.createDelegate(this));
this.container.LoadPosDevice(this.container.dsId, this.container.posId, this.OnPosLoaded.createDelegate(this));
this.container.SetVisibleByOsd(true)
},
BeforeDestroy: function() {
if (this.wsHandler) {
this.wsHandler.Destroy()
}
this.textBuffer.Destroy()
},
OnPosLoaded: function(a) {
this.InitWsHandler(a);
this.OnCurrentPosUpdated(a)
},
OnCurrentPosUpdated: function(a) {
this.status = a.status;
this.container.UpdatePosStyle(a);
this.UpdateLineCount();
this.RefreshContent();
this.textBuffer.maxDisplayTimeMs = a.osd_keep_seconds * 1000
},
OnContainerResize: function() {
this.UpdateLineCount()
},
RefreshContent: function() {
var a = this.status;
var d, c, b;
Ext.each(this.container.displayPositions, function(e) {
if (e !== this.container.position) {
this.container.UpdatePosMsg(e, [])
}
}, this);
if ((SYNO.SS.TransDev.Status.NORMAL === a) || (SYNO.SS.TransDev.Status.SETTING === a)) {
this.container.UpdatePosMsg(this.container.position, this.textBuffer.GetContentList())
} else {
d = _T("ss_common", "status") + " : " + SYNO.SS.App.Transactions.Utils.GetPOSStatusString(a);
b = this.container.GetLineWidth();
c = this.container.displayFields[0].el;
if (0 < b) {
this.container.UpdatePosMsg(this.container.position, [SYNO.SS.Utils.WrapText(d, b, c).join("<br/>")])
}
}
},
OnSlaveDsUpdate: function(b, a) {
if (Ext.isDefined(b)) {
Ext.each(b.slaveds, function(c) {
if (c.id === this.ds_id) {
if ((false === SYNO.SS.Utils.IsDsOnlineSts(c.status)) && (SYNO.SS.CmsDsSts.UNKNOWN !== c.status)) {
this.status = SYNO.SS.TransDev.Status.SERVER_DISCONN;
this.RefreshContent()
} else {
this.container.LoadPosDevice(this.container.dsId, this.container.posId, this.OnPosLoaded.createDelegate(this))
}
return false
}
}, this)
}
}
});
Ext.define("SYNO.SS.App.WebPlayer.TransactionContainer.RecordingBehavior", {
extend: "SYNO.SS.App.WebPlayer.TransactionContainer.Behavior",
contentList: null,
displayMode: null,
constructor: function(a) {
this.contentList = [];
this.displayMode = SYNO.SS.App.Transactions.Def.DisplayMode.SYNC;
this.callParent([a])
},
UpdateRecPosMsg: function(a) {
this.transactInfo.contentList = a;
this.container.LoadPosDevice(Ext.isDefined(this.transactInfo.dsId) ? this.transactInfo.dsId : LOCAL_DS_ID, this.transactInfo.posId, function(b) {
this.OnPosLoaded(b);
this.contentList = this.transactInfo.contentList.map(Ext.util.Format.htmlEncode);
this.displayMode = this.transactInfo.displayMode;
this.SplitLines();
this.WrapLines();
this.RefreshContent()
}.createDelegate(this))
},
ReplaceResult: function(a) {
this.result = a;
this.transactInfo = {
dsId: a.dsId,
posId: a.posId,
displayMode: a.displayMode
}
},
Draw: function(b) {
if (!this.result) {
return
}
if ((this.result.stopTime + 5 < b) || (this.result.startTime > b)) {
this.ClearPOSMsg();
return
}
var a = [];
if (SYNO.SS.App.Transactions.Def.DisplayMode.ONCE === this.result.displayMode) {
this.result.content.forEach(function(c) {
a.push(c.content)
}, this)
} else {
if (SYNO.SS.App.Transactions.Def.DisplayMode.SYNC === this.result.displayMode) {
this.result.content.forEach(function(c) {
if (c.tmstmp < b) {
a.push(c.content)
}
}, this)
}
}
this.UpdateRecPosMsg(a)
},
ClearPOSMsg: function() {
this.UpdateRecPosMsg([])
},
SplitLines: function() {
for (var c = 0; c < this.contentList.length; c++) {
var a = this.contentList[c].split("\n");
if (1 === a.length) {
continue
}
this.contentList.splice(c, 1);
for (var b = 0; b < a.length; b++) {
this.contentList.splice(c + b, 0, a[b])
}
}
},
WrapLines: function() {
var e = this.container.displayFields[0].el;
var a = this.container.GetLineWidth();
for (var d = 0; d < this.contentList.length;) {
var c = SYNO.SS.Utils.WrapText(this.contentList[d], a, e);
for (var b = 0; b < c.length; b++) {
this.contentList.splice(d + b + 1, 0, c[b])
}
this.contentList.splice(d, 1);
d += c.length
}
},
AfterRender: function() {
this.container.SetVisibleByOsd(true)
},
BeforeDestroy: function() {},
OnPosLoaded: function(a) {
this.container.UpdatePosStyle(a)
},
OnCurrentPosUpdated: function(a) {},
OnContainerResize: function() {
this.RefreshContent()
},
RefreshContent: function() {
var b = this.container.GetMaxLineCount();
var c = 0;
var d = this.container.displayPositions.indexOf(this.container.position);
var a;
var e;
if (SYNO.SS.App.Transactions.Def.DisplayMode.SYNC === this.displayMode) {
e = function(f) {
a = (0 === c) ? this.contentList.slice(-b) : [];
this.container.UpdatePosMsg(f, a);
c++
}
} else {
e = function(f) {
a = this.contentList.slice(b * c, b * (c + 1));
this.container.UpdatePosMsg(f, a);
c++
}
}
Ext.each(this.container.displayPositions.slice(d), e, this);
Ext.each(this.container.displayPositions.slice(0, d), e, this)
}
});
Ext.define("SYNO.SS.App.WebPlayer.DragTracker", {
extend: "Ext.dd.DragTracker",
MOUSE_KEY_LEFT: 0,
IsLeftMouseBtn: function(a) {
return (this.MOUSE_KEY_LEFT === a.button)
},
onBeforeEnd: function(a) {},
onMouseUp: function(c) {
var b = Ext.getDoc(),
a = this.active;
if (false === this.onBeforeEnd(c)) {
return
}
b.un("mousemove", this.onMouseMove, this);
b.un("mouseup", this.onMouseUp, this);
b.un("selectstart", this.stopSelect, this);
if (false !== this.preventDefault) {
c.preventDefault()
}
this.clearStart();
this.active = false;
delete this.elRegion;
this.fireEvent("mouseup", this, c);
if (a) {
this.onEnd(c);
this.fireEvent("dragend", this, c)
}
},
onMouseMove: function(d, c) {
if (this.active && Ext.isIE && !Ext.isIE9p && !d.browserEvent.button) {
d.preventDefault();
this.onMouseUp(d);
return
}
if (false !== this.preventDefault) {
d.preventDefault()
}
var b = d.getXY(),
a = this.startXY;
this.lastXY = b;
if (!this.active) {
if (Math.abs(a[0] - b[0]) > this.tolerance || Math.abs(a[1] - b[1]) > this.tolerance) {
this.triggerStart(d)
} else {
return
}
}
this.fireEvent("mousemove", this, d);
this.onDrag(d);
this.fireEvent("drag", this, d)
}
});
Ext.namespace("SYNO.SS.App.WebPlayer");
Ext.define("SYNO.SS.App.WebPlayer.AcapDetectHandler", {
SHOW_AREA_INCLUDE: 1 << 0,
SHOW_AREA_DETECTED: 1 << 1,
owner: null,
detAreaCanvas: null,
constructor: function(a) {
this.owner = a.owner
},
DrawAcapDetArea: function(b) {
var a, d;
var c;
var e;
if (!this.detAreaCanvas) {
if ((this.owner.panelEventDetect) && (this.owner.panelEventDetect.el)) {
this.detAreaCanvas = this.owner.panelEventDetect.el.dom.querySelector("canvas")
}
if (!this.detAreaCanvas) {
return
}
}
a = this.detAreaCanvas.getContext("2d");
a.clearRect(0, 0, this.detAreaCanvas.width, this.detAreaCanvas.height);
if (false === Ext.isArray(b)) {
return
}
b.forEach(function(f) {
c = (true === f.blTrig) && (0 < (this.SHOW_AREA_DETECTED & f.showAreaFlag));
e = (0 < (this.SHOW_AREA_INCLUDE & f.showAreaFlag)) || (true === c);
if ((false === c) && (false === e)) {
return
}
if (f.DetArea) {
d = this.ParseDetArea(f.DetArea);
if (true === c) {
this.DrawLineList(a, "red", 4, d)
}
if (true === e) {
this.DrawLineList(a, "white", 1, d)
}
this.DrawArticulationPoint(a, "white", "#00008B", 1, d)
}
}.createDelegate(this))
},
ParseDetArea: function(c) {
var f = this.detAreaCanvas.width;
var b = this.detAreaCanvas.height;
var e = /x=(-?\d*\.\d+),y=(-?\d*\.\d+)/g;
var h = [];
var d, a, g;
while (null !== (d = e.exec(c))) {
a = Number(d[1]);
g = Number(d[2]);
h.push([Math.round(f * (1 + a) / 2), Math.round(b * (1 - g) / 2)])
}
return h
},
DrawLineList: function(b, e, a, c) {
var d;
b.strokeStyle = e;
b.lineWidth = a;
b.moveTo(c[0][0], c[0][1]);
for (d = 1; d < c.length; d++) {
b.lineTo(c[d][0], c[d][1])
}
b.stroke()
},
DrawArticulationPoint: function(b, f, d, a, c) {
var e;
b.strokeStyle = f;
b.fillStyle = d;
b.lineWidth = a;
for (e = 0; e < c.length; e++) {
b.beginPath();
b.arc(c[e][0], c[e][1], 5, 0, 2 * Math.PI, false);
b.fill();
b.stroke()
}
}
});
Ext.namespace("SYNO.SS.App.WebPlayer.DetectionResult");
Ext.define("SYNO.SS.App.WebPlayer.DetectionResult.CanvasWidget", {
extend: "SYNO.SS.CanvasWidget.BasicWidget",
BOX_LABEL_FONT_FORMAT: "{0} {1}px/{2}px Verdana",
BOX_LABEL_FONT_SIZE: 13,
BOX_LABEL_LINE_HEIGHT: 16,
BOX_LABEL_MAX_WIDTH: 220,
hoverData: null,
fnAssignColor: null,
fnFilter: null,
blSetupHelper: false,
constructor: function() {
this.callParent()
},
GetFormData: function(a) {
return {
det_region: this.GetScaledData(a)
}
},
ClearData: function() {
this.data.length = 0
},
AppendData: function(b, c, a) {
b.region = this.CalcRegion(b, c, a);
this.data.push(b)
},
IsDataEmpty: function() {
return Ext.isEmpty(this.data)
},
Resize: function(c, b) {
var a;
this.panelWidth = c;
this.panelHeight = b;
for (a = 0; a < this.data.length; a++) {
this.data[a].region = this.CalcRegion(this.data[a], c, b)
}
},
CheckHover: function(c, b) {
var a;
this.hoverData = null;
for (a = 0; a < this.data.length; a++) {
if (true === this.DoCheckHover(this.data[a].region, c, b)) {
this.hoverData = this.data[a];
break
}
}
},
DrawImpl: function(a) {
var b;
var c = this.data.map(this.ParseRenderMeta, this);
a.save();
for (b = 0; b < c.length; b++) {
this.DrawResult(a, c[b])
}
for (b = 0; b < c.length; b++) {
this.DrawLabel(a, c[b])
}
a.restore()
},
DrawResult: function(a, d) {
var c = SYNO.SS.App.FaceRecognition;
var b = (true === this.blSetupHelper) ? d.setupHelperStyle : c.Utils.GetColor("INNER", d.colorId);
this.DrawRegion(a, d.region, {
lineWidth: c.Def.BBOX.INNER.BORDER.toString(),
strokeStyle: b,
fillStyle: "rgba(0, 0, 0, 0)"
});
this.DrawRegion(a, d.borderRegion, {
lineWidth: c.Def.BBOX.OUTER.BORDER.toString(),
strokeStyle: c.Utils.GetColor("OUTER", d.colorId),
fillStyle: "rgba(0, 0, 0, 0)"
})
},
ApplyBoxLabelFont: function(a, b) {
a.font = String.format(this.BOX_LABEL_FONT_FORMAT, (true === b) ? "bold" : "normal", this.BOX_LABEL_FONT_SIZE, this.BOX_LABEL_LINE_HEIGHT);
a.textBaseline = "top";
a.textAlign = "left"
},
GetTextWidth: function(a, b) {
return Math.round(a.measureText(b).width)
},
AddEllipsis: function(c, h, i) {
var a, g = "...",
j = "";
var e = 0,
b = i.length,
f, d;
while (e <= b) {
f = Math.ceil((e + b) / 2);
d = i.substring(0, f) + g;
if (h >= this.GetTextWidth(c, d)) {
j = d;
e = f + 1
} else {
b = f - 1
}
}
return j
},
CalcLabelTextWidth: function(b, f, a) {
var h = false;
var d, c, g, e = 0;
for (d = 0; d < a.length; d++) {
this.ApplyBoxLabelFont(b, a[d].blBold);
g = this.GetTextWidth(b, a[d].text);
if (f < g) {
a[d].text = this.AddEllipsis(b, f, a[d].text.slice(0, -1));
h = true
}
if (false === h) {
e = Math.max(e, g)
}
}
return (true === h) ? f : e
},
DrawLabel: function(g, e) {
var h = 6,
a = 2,
k;
var f, b, j, c, d;
if (true === this.blSetupHelper) {
return
}
if (!e.text) {
return
}
k = [{
text: e.text,
blBold: true
}];
if (e.name) {
k.push({
text: e.name
})
}
b = this.CalcLabelTextWidth(g, this.BOX_LABEL_MAX_WIDTH - h * 2, k) + h * 2;
j = this.BOX_LABEL_LINE_HEIGHT * k.length + a * (k.length - 1) + h * 2;
d = this.BoxAlignToRegion(g, b, j, {
x: e.borderRegion[0][0],
y: e.borderRegion[0][1],
w: e.borderRegion[2][0] - e.borderRegion[0][0],
h: e.borderRegion[2][1] - e.borderRegion[0][1]
}, "bl-tl?");
g.fillStyle = "rgba(0, 0, 0, 0.75)";
g.fillRect(Math.floor(d[0]), Math.floor(d[1]), b, j);
g.fillStyle = "rgba(255, 255, 255, 1)";
for (f = 0; f < k.length; f++) {
this.ApplyBoxLabelFont(g, k[f].blBold);
g.fillText(k[f].text, d[0] + h, d[1] + h + a * f + this.BOX_LABEL_LINE_HEIGHT * (f + 1) - this.BOX_LABEL_FONT_SIZE)
}
},
ParseColorId: function(b, a) {
var c;
if (this.fnAssignColor) {
c = this.fnAssignColor(a)
} else {
c = this.colorId[b.colorKey]
}
return c
},
ParseName: function(b, a) {
if ((false === b.blName) || (!a.registered_face)) {
return
}
if (false === SYNO.SS.Utils.IsOperAllowed(SYNO.SS.App.User.Def.PrivOper.FACE_VIEW_DETECTED_INFO)) {
return
}
return (a.registered_face.name) ? a.registered_face.name : a.registered_face.account
},
ParseRenderMeta: function(b) {
var a = (b.captured_face) ? b.captured_face.event : undefined;
var c = SYNO.SS.Utils.ShallowCopy(SYNO.SS.App.FaceRecognition.Def.EVENT_TYPE.META[a]);
if ((0 === (this.frame_display_info & SYNO.SS.App.FaceRecognition.Def.FRAME_DISPLAY_INFO.DISPLAY_EVENT_AND_NAME)) || ((this.fnFilter) && (false === this.fnFilter(b)))) {
delete c.text
} else {
c.name = this.ParseName(c, b)
}
c.colorId = this.ParseColorId(c, b);
c.region = b.region;
c.borderRegion = this.CalcBorderRegion(b.region);
if (true === this.blSetupHelper) {
c.setupHelperStyle = this.ParseSetupHelperStyle(b)
}
return c
},
ParseSetupHelperStyle: function(a) {
var c = SYNO.SS.App.FaceRecognition.Def;
var d = this.ParseBbox(a);
var b = c.SETUP_HELPER.BBOX_SIZE_LIMIT > d.w * d.h * this.resolution[0] * this.resolution[1];
if (true === b) {
return SYNO.SDS.Utils.GetCssVariable(SYNO.SS.Color.BBOX_RED)
} else {
if (c.SETUP_HELPER.QUALITY_LIMIT > a.quality_score) {
return SYNO.SDS.Utils.GetCssVariable(SYNO.SS.Color.BBOX_ORANGE)
} else {
return SYNO.SDS.Utils.GetCssVariable(SYNO.SS.Color.BBOX_GREEN)
}
}
},
ParseBbox: function(a) {
var b = a.bbox;
return {
x: b.top_left.x,
y: b.top_left.y,
w: b.bottom_right.x - b.top_left.x,
h: b.bottom_right.y - b.top_left.y
}
},
GetCoordinate: function(a, d, b, c) {
return [
[a, d],
[a, d + c],
[a + b, d + c],
[a + b, d]
]
},
CalcRegion: function(n, b, m) {
var l = this.ParseBbox(n);
var j = Math.round(parseFloat(l.x) * b);
var i = Math.round(parseFloat(l.y) * m);
var k = Math.round(parseFloat(l.w) * b);
var f = Math.round(parseFloat(l.h) * m);
var g = SYNO.SS.App.FaceRecognition.Def.BBOX.INNER.BORDER;
if (1 === g % 2) {
j += 0.5;
i += 0.5
}
var c = g / 2;
var d = function(q, p, o) {
var h = q + p;
q = Math.max(q, c);
h = Math.min(h, o - c);
p = h - q;
return [q, p]
};
var a = d(j, k, b);
j = a[0];
k = a[1];
var e = d(i, f, m);
i = e[0];
f = e[1];
return this.GetCoordinate(j, i, k, f)
},
CalcBorderRegion: function(f) {
var e = SYNO.SS.App.FaceRecognition.Def.BBOX.INNER.BORDER;
var c = SYNO.SS.App.FaceRecognition.Def.BBOX.OUTER.BORDER;
var a = f[0][0] - e / 2;
var g = f[0][1] - e / 2;
var b = f[2][0] - f[0][0] + e + c;
var d = f[2][1] - f[0][1] + e + c;
if (1 === c % 2) {
a -= 0.5;
g -= 0.5
}
return this.GetCoordinate(a, g, b, d)
},
GetCameraResolution: function(b) {
if (true !== this.blSetupHelper) {
return null
}
var c = SYNO.SS.GblStore.dsCamera.getById(b.get("camera_id"));
var a = (c) ? c.get("resolution") : "0x0";
return SYNO.SS.App.WebPlayer.Utils.ParseReso(a)
},
InitRenderSrc: function(b, a) {
this.colorId = {};
this.colorId.recognized_color = b.get("recognized_color");
this.colorId.unrecognized_color = b.get("unrecognized_color");
this.colorId.vip_color = b.get("vip_color");
this.colorId.allowed_color = b.get("allowed_color");
this.colorId.blocked_color = b.get("blocked_color");
this.frame_display_info = b.get("frame_display_info");
Ext.apply(this, a);
this.resolution = this.GetCameraResolution(b)
}
});
Ext.namespace("SYNO.SS.App.WebPlayer.DetectionResult");
Ext.define("SYNO.SS.App.WebPlayer.DetectionResult.Displayer", {
extend: "Ext.Container",
ctCanvas: null,
apiRespReader: null,
resultWidget: null,
indicatorWidgets: null,
constructor: function(b) {
var a;
this.Init(b);
if (b.listeners) {
a = b.listeners
}
Ext.applyIf(b, {
style: "position: absolute; width: inherit; height: inherit;",
items: {
xtype: "ss_canvas",
width: b.canvasWidth,
height: b.canvasHeight,
ref: "ctCanvas"
},
listeners: {
beforedestroy: function() {
this.ClearIndicator();
Ext.destroy(this.resultWidget)
},
scope: this
},
plugins: {
ptype: "abstractBaseClass",
abstractMethods: ["InitIndicatorImpl"]
}
});
this.callParent([b]);
if (a) {
this.mon(this, a)
}
if (true === this.blEditIndicator) {
this.mouseAct.SetComp(this.ctCanvas)
}
},
Init: function(a) {
this.indicatorWidgets = [];
this.resultWidget = new SYNO.SS.App.WebPlayer.DetectionResult.CanvasWidget();
this.mouseAct = new SYNO.SS.CanvasWidget.WidgetMouseActController({
listeners: {
refresh: this.UpdateCanvas,
scope: this
}
})
},
UpdateCanvas: function() {
this.ClearCanvas();
this.DrawIndicator()
},
InitIndicator: function(a) {
this.ClearIndicator();
this.indicatorWidgets = this.InitIndicatorImpl(a);
this.mouseAct.SetWidgets(this.indicatorWidgets)
},
InitResult: function(b, a) {
this.resultWidget.InitRenderSrc(b, a)
},
Resize: function(b, a) {
this.ctCanvas.setSize(b, a);
this.resultWidget.Resize(b, a);
this.indicatorWidgets.forEach(function(c) {
c.Resize(b, a)
})
},
ClearCanvas: function() {
this.ctCanvas.CleanUp()
},
ClearResult: function() {
this.resultWidget.ClearData()
},
ClearIndicator: function() {
this.indicatorWidgets.forEach(function(a) {
Ext.destroy(a)
});
this.indicatorWidgets.length = 0
},
AddResult: function(a) {
this.resultWidget.AppendData(a, this.ctCanvas.GetCanvasWidth(), this.ctCanvas.GetCanvasHeight())
},
IsResultEmpty: function() {
return this.resultWidget.IsDataEmpty()
},
DrawResult: function() {
var a = this.ctCanvas.GetContext();
this.resultWidget.Draw(a)
},
DrawIndicator: function(b) {
var a = this.ctCanvas.GetContext();
this.indicatorWidgets.forEach(function(c) {
c.blTrigger = b;
c.Draw(a)
}, this)
},
SetAllowDisplay: function(a) {
this.mouseAct.RegDetect(a)
},
GetIndicatorRegions: function(a) {
var b = {};
this.indicatorWidgets.forEach(function(c) {
Ext.apply(b, c.GetFormData(a))
}, this);
return b
},
SetPaused: Ext.emptyFn
});
Ext.define("SYNO.SS.App.WebPlayer.DetectionResult.ObjSizeEditor", {
extend: "SYNO.SS.App.WebPlayer.DetectionResult.Displayer",
InitIndicatorImpl: function(a) {
return [new SYNO.SS.CanvasWidget.SizeEditor({
owner: this,
size: a.get("min_obj_size"),
panelWidth: this.ctCanvas.GetCanvasWidth(),
panelHeight: this.ctCanvas.GetCanvasHeight(),
minIndecatorHeight: 10,
minIndecatorWidth: 10
})]
}
});
Ext.define("SYNO.SS.App.WebPlayer.DetectionResult.FaceRecognitionDisplayer", {
extend: "SYNO.SS.App.WebPlayer.DetectionResult.Displayer",
ctInfoCard: null,
ctCardAnchor: null,
contextMenu: null,
nowHoverData: null,
blSuspendMouseEvent: true,
constructor: function(a) {
this.loadCaptureTask = new SYNO.SS.Utils.WebapiSender(this);
this.apiRespReader = new Ext.data.JsonReader(SYNO.SS.App.FaceRecognition.Utils.GetHistoryReaderConfig());
this.InitInfoCard(a.extraCfg);
this.callParent(arguments);
this.mon(this.ctCanvas, "afterrender", function(b) {
b.mon(b.el, "contextmenu", function(d) {
var c;
this.CheckHover(d);
if (false === this.IsHoverHappened()) {
return
}
c = SYNO.SS.Utils.DeepCopy(d);
c.getXY = d.getXY;
Ext.defer(function() {
this.MouseMove(c);
this.OnContexMenu(c)
}, 10, this)
}, this)
}, this)
},
InitInfoCard: function(b) {
var e = SYNO.SS.App.FaceRecognition.Menu;
var a = function(g, f) {
this.el.dom.innerHTML = Ext.util.Format.htmlEncode(g);
if (false !== f) {
this.el.dom.setAttribute("ext:qtip", Ext.util.Format.htmlEncode(g))
}
};
var c = function(f) {
this.el.dom.setAttribute("src", "data:image/jpeg; base64," + f)
};
var d = function() {
return this.contextMenu.record
};
this.ctInfoCard = new Ext.Container({
cls: "webplayer_face_card_ct",
style: "position: absolute; z-index: inherit;",
hidden: true,
items: {
xtype: "container",
cls: "body",
items: [{
xtype: "container",
layout: "hbox",
layoutConfig: {
align: "stretchmax"
},
defaultType: "box",
items: [{
cls: "capture_img",
ref: "../../boxCapturedImg",
autoEl: "img",
SetValue: c
}, {
cls: "col_gap"
}, {
xtype: "container",
layout: "card",
flex: 1,
ref: "../../ctCard",
items: [{
xtype: "container",
cls: "capture_desc",
defaultType: "box",
items: [{
cls: "match_img",
ref: "../boxMatchImg",
autoEl: "img",
SetValue: c
}, {
cls: "row_gap"
}, {
cls: "display_name ellipsis_text",
ref: "../boxDisplayName",
SetValue: a
}, {
cls: "similarity ellipsis_text",
ref: "../boxSimilarity",
SetValue: a
}]
}, {
xtype: "box",
cls: "text-no-match",
html: _T("ss_common", "no_matched")
}]
}]
}, {
xtype: "box",
cls: "ss-btn-more-v",
listeners: {
afterrender: function(f) {
f.mon(f.el, "click", this.OnContexMenu, this)
},
scope: this
}
}]
},
listeners: {
afterrender: function(f) {
f.mon(f.el, "mouseenter", this.CancelDelayHide, this);
f.mon(f.el, "mouseleave", this.MouseLeave, this)
},
scope: this
},
Update: function(g) {
var f = SYNO.SS.App.FaceRecognition.Utils.IsFaceRegistered(g.data);
this.boxCapturedImg.SetValue(g.get("image_data"));
this.ctCard.layout.setActiveItem(f ? 0 : 1);
if (true === f) {
this.ctCard.boxMatchImg.SetValue(g.get("registered_face_image"));
this.ctCard.boxDisplayName.SetValue(g.get("registered_face_display_name"));
this.ctCard.boxSimilarity.SetValue(SYNO.SS.App.FaceRecognition.Utils.ParseSimilarity(g.data, {
blTitle: true
}), false)
}
}
});
this.addManagedComponent(this.ctInfoCard);
this.ctCardAnchor = new Ext.BoxComponent({
style: "position: absolute;",
hidden: true,
listeners: {
afterrender: function(f) {
f.mon(f.el, "contextmenu", this.OnContexMenu, this);
f.mon(f.el, "mouseenter", this.CancelDelayHide, this);
f.mon(f.el, "mousemove", this.MouseMove, this);
f.mon(f.el, "mouseleave", this.MouseLeave, this)
},
scope: this
}
});
this.addManagedComponent(this.ctCardAnchor);
this.contextMenu = new SYNO.ux.Menu({
items: [e.GetMenuItemCfg({
ref: "itemViewInfo",
text: _T("face_recognition", "view_information_of_person"),
disabled: (false === SYNO.SS.Utils.IsOperAllowed(SYNO.SS.App.User.Def.PrivOper.FACE_VIEW_DETECTED_INFO)),
fnGetData: d,
scope: this
}), e.GetMenuItemCfg({
ref: "itemSearchPerson",
text: _T("face_recognition", "search_result_of_person"),
disabled: (false === SYNO.SS.Utils.IsOperAllowed(SYNO.SS.App.User.Def.PrivOper.FACE_VIEW_DETECTED_INFO)),
fnGetData: d,
scope: this
}), e.GetMenuItemCfg({
text: _T("face_recognition", "search_face"),
fnGetData: d,
scope: this
}), {
ref: "menuseparator",
xtype: "menuseparator"
}, e.GetMenuItemCfg({
ref: "itemRegNewFace",
text: _T("face_recognition", "register_face_as_new_face"),
disabled: (false === SYNO.SS.Utils.IsOperAllowed(SYNO.SS.App.User.Def.PrivOper.FACE_ADD_DEL_REGISTERED_FACE)),
fnGetData: d,
scope: this
}), e.GetMenuItemCfg({
ref: "itemCorrectResult",
text: _T("face_recognition", "correct_result"),
disabled: (false === SYNO.SS.Utils.IsOperAllowed(SYNO.SS.App.User.Def.PrivOper.FACE_ADJUST_DETECTED_INFO)),
fnGetData: d,
scope: this
}), e.GetMenuItemCfg({
ref: "itemThisIsStranger",
text: _T("face_recognition", "this_is_stranger"),
disabled: (false === SYNO.SS.Utils.IsOperAllowed(SYNO.SS.App.User.Def.PrivOper.FACE_ADJUST_DETECTED_INFO)),
fnGetData: d,
fnGetParams: function() {
return {
blLiveview: b.blLiveview
}
},
scope: this
})],
listeners: {
afterrender: function(f) {
f.mon(f.el, "mouseenter", this.CancelDelayHide, this);
f.mon(f.el, "mouseleave", this.MouseLeave, this)
},
scope: this
},
TryShow: function(f) {
if (!this.record) {
this.deferXY = f
} else {
this.showAt(f)
}
},
Update: function(l) {
var f = SYNO.SS.App.FaceRecognition.Utils.IsFaceRegistered(l.data);
var j = ((true === f) && (true !== this.itemViewInfo.disabled));
var i = ((true === f) && (true !== this.itemSearchPerson.disabled));
var k = (true !== this.itemRegNewFace.disabled) && (false == IsCMSPaired());
var g = ((true !== this.itemCorrectResult.disabled));
var h = ((true === f) && (true !== this.itemThisIsStranger.disabled));
var m = ((true === k) || (true === g) || (true === h));
this.itemViewInfo.setVisible(j);
this.itemSearchPerson.setVisible(i);
this.menuseparator.setVisible(m);
this.itemRegNewFace.setVisible(k);
this.itemCorrectResult.setVisible(g);
this.itemThisIsStranger.setVisible(h);
this.record = l;
if (this.deferXY) {
this.showAt(this.deferXY);
delete this.deferXY
}
},
CleanProcData: function() {
delete this.deferXY;
delete this.record
}
});
this.addManagedComponent(this.contextMenu);
this.delayHideTask = this.addTask({
interval: 500,
run: this.HideCard,
scope: this
})
},
InitIndicatorImpl: function(a) {
var i = SYNO.SS.App.VideoAnalytics.Utils;
var h = this.ctCanvas.GetCanvasWidth();
var g = this.ctCanvas.GetCanvasHeight();
var j = [];
var f = SYNO.SS.App.VideoAnalytics.Def.RegionType.INCLUDE_REGION;
var b = 1;
var d = 1;
var e = function(k) {
return [k[0] * h, k[1] * g]
};
var c;
if (false === Ext.isEmpty(a.get("det_region_cnt"))) {
b = Number(a.get("det_region_cnt"));
d = b
}
if (false === Ext.isEmpty(a.get("region_type"))) {
f = Number(a.get("region_type"))
}
if (false === Ext.isEmpty(a.get("det_region"))) {
i.String2RegionArray(a.get("det_region")).forEach(function(k) {
j.push(k.map(e, this))
}, this)
}
c = new SYNO.SS.App.VideoAnalytics.CanvasWidget.MultiRegion({
delegate: this,
data: j,
blPreviewMode: !this.blEditIndicator,
regionCnt: b,
regionMode: d,
regionType: f,
panelWidth: h,
panelHeight: g,
displayInfo: this.TransFaceDisplayInfoToVideoAnalyticsDef(a.get("display_info"))
});
return [c]
},
TransFaceDisplayInfoToVideoAnalyticsDef: function(b) {
var a = 0;
if (SYNO.SS.App.FaceRecognition.Def.DISPLAY_INFO.DISPLAY_REGION & b) {
a = a | SYNO.SS.App.VideoAnalytics.Def.DisplayInfoType.DISPLAY_REGION
}
if (SYNO.SS.App.FaceRecognition.Def.DISPLAY_INFO.DISPLAY_BORDER & b) {
a = a | SYNO.SS.App.VideoAnalytics.Def.DisplayInfoType.DISPLAY_BORDER
}
return a
},
SetAllowDisplay: function(a) {
this.callParent(arguments);
this.blSuspendMouseEvent = !a;
if (false === a) {
this.HideCard()
}
},
SetPaused: function(a) {
if (true === a) {
this.mon(this.ctCanvas.el, "mousemove", this.MouseMove, this)
} else {
this.mun(this.ctCanvas.el, "mousemove", this.MouseMove, this);
this.HideCard()
}
},
CheckHover: function(b) {
if (true === this.blSuspendMouseEvent) {
return
}
var a = this.ctCanvas.getPosition();
this.resultWidget.CheckHover(b.xy[0] - a[0], b.xy[1] - a[1])
},
IsHoverHappened: function(a) {
var b;
if (true === this.blSuspendMouseEvent) {
return false
}
a = a || this.resultWidget.hoverData;
if (true === Ext.isEmpty(a)) {
return false
}
b = (a.captured_face || {}).id;
return (true === Ext.isNumber(b)) && (0 < b)
},
MouseMove: function(a) {
this.CheckHover(a);
if (true === this.IsHoverHappened()) {
this.ShowCard()
}
},
IsAncestors: function(a, b) {
if ((!a.el) || (!a.el.dom)) {
return false
}
return Ext.lib.Dom.isAncestor(a.el.dom, b)
},
MouseLeave: function(b) {
var a = b.getRelatedTarget();
if (!a) {
this.HideCard();
return
}
if (true === this.IsAncestors(this.contextMenu, a)) {
return
}
if ((false === this.IsAncestors(this.ctCardAnchor, a)) && (false === this.IsAncestors(this.ctInfoCard, a))) {
this.delayHideTask.start(false);
return
}
},
ShowCard: function() {
if ((this.nowHoverData === this.resultWidget.hoverData) && ((true === this.loadCaptureTask.IsRunning()) || (true === this.ctInfoCard.isVisible()))) {
this.CancelDelayHide();
return
}
this.HideCard();
this.nowHoverData = this.resultWidget.hoverData;
if (false === this.ctCardAnchor.rendered) {
this.ctCardAnchor.render(this.el)
}
if (false === this.ctInfoCard.rendered) {
this.ctInfoCard.render(this.findWindow().el)
}
this.SetupAnchor();
this.LoadCaptrue((this.nowHoverData.captured_face || {}).id)
},
HideCard: function() {
this.nowHoverData = null;
this.loadCaptureTask.Cancel();
this.ctCardAnchor.hide();
this.ctInfoCard.hide();
this.contextMenu.hide();
this.contextMenu.CleanProcData();
this.CancelDelayHide()
},
CancelDelayHide: function() {
this.delayHideTask.stop()
},
LoadCaptrue: function(a) {
this.loadCaptureTask.Cancel();
if (true === Ext.isEmpty(a)) {
return
}
this.loadCaptureTask.sendWebAPI({
api: "SYNO.SurveillanceStation.Face.Result",
version: 1,
method: "List",
params: {
blIncludeSnapshot: true,
blIncludeRegisteredFace: true,
filter: {
ids: a
}
},
dsId: this.dsId,
callback: this.LoadCaptrueDone,
scope: this
})
},
LoadCaptrueDone: function(f, c, e, b) {
var a;
var d;
if ((true !== f) || (false === Ext.isArray(c.captured_face)) || (0 >= c.captured_face.length)) {
return
}
a = this.apiRespReader.readRecords(c);
d = a.records[0];
this.ctInfoCard.Update(d);
this.contextMenu.Update(d);
this.SetupCard()
},
SetupCard: function() {
if (false === this.ctCardAnchor.isVisible()) {
return
}
this.ctInfoCard.show();
this.ctInfoCard.el.alignTo(this.ctCardAnchor.el, "tl-tr?")
},
SetupAnchor: function() {
var b = 2;
var a = this.nowHoverData.region;
this.ctCardAnchor.setPosition(a[0][0] - b, a[0][1] - b);
this.ctCardAnchor.setSize(a[2][0] - a[0][0] + 2 * b, a[2][1] - a[0][1] + 2 * b);
this.ctCardAnchor.show();
this.contextMenu.hide()
},
OnContexMenu: function(a) {
if (false === this.IsHoverHappened(this.nowHoverData)) {
return
}
if ((a.stopEvent) && (null === SYNO.SS.Utils.GetFullScreenElement())) {
a.stopEvent()
}
this.contextMenu.TryShow(a.getXY())
}
});
Ext.define("SYNO.SS.App.WebPlayer.ReocrdAudioInfoStore", {
DEF_AUDIO_INFO: {
mute: false,
volume: 50,
blHavePriv: true
},
DISABLED_INFO: {
mute: false,
volume: 50,
blHavePriv: false
},
constructor: function(a) {
this.blDisabled = (false === a)
},
GetAudioInfo: function(b) {
if (true === this.blDisabled) {
return this.DISABLED_INFO
}
var d = {
mute: false,
volume: 50,
blHavePriv: true
};
var c, e, a;
if (((0 === b.get("mountId")) && (0 === b.get("archId"))) || (true === (b.get("blIVAEvt")))) {
e = SYNO.SS.App.Event.Utils.GetRecEvtType(b);
a = b.get("camera_id") || b.get("cameraId");
if (SYNO.SS.Event.RecType.ALERT === e) {
if (DEVICE_IVA === (b.get("devType"))) {
a = b.get("pairedCamIdOnRec")
}
c = SYNO.SS.GblStore.dsCamera.getById(SYNO.SS.GblStore.GetCamIdOnHost(b.get("dsId"), a))
} else {
c = SYNO.SS.GblStore.dsCamera.getById(a)
}
if (c) {
d.mute = c.get("mute");
d.volume = c.get("volume");
d.blHavePriv = (0 !== SYNO.SS.Utils.IsFlags(c.get("privilege"), SYNO.SS.CamPriv.AUDIO))
} else {
d.blHavePriv = false
}
}
return d
},
GetDefault: function() {
return (true === this.blDisabled) ? this.DISABLED_INFO : this.DEF_AUDIO_INFO
}
});
Ext.define("SYNO.SS.App.WebPlayer.Banner", {
extend: "Ext.Container",
INFO_HEIGHT: 28,
LIVEVIEW_ICON_WIDTH: 28,
DATETIME_WIDTH: 140,
TIME_WIDTH: 60,
SPEED_WIDTH: 55,
BITRATE_WIDTH: 130,
CTRIGHT_PADDING_RIGHT: 10,
CT_CENTER_MIN_WIDTH_THRESHOLD: 12,
viewType: 0,
ctLeft: null,
ctCenter: null,
ctCenterInner: null,
ctRight: null,
centerWidthConfig: null,
constructor: function(b) {
var c = ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.TIMELINE === b.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.RECORDING === b.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.POS_RECORDING === b.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.PREVIEW === b.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.POS_PREVIEW === b.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.PREVIEW_IPSPEAKER === b.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.PREVIEW_IPSPEAKER_GROUP === b.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.DVA_PREVIEW === b.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.DVA_RECORDING === b.viewType));
var a = {
listeners: {
afterrender: function(e) {
var d, f;
if (e.cachedAction) {
for (f in e.cachedAction) {
d = e.cachedAction[f];
e[f].apply(e, d)
}
delete e.cachedAction
}
}
},
setValue: function(d) {
if (this.rendered) {
this.el.dom.innerHTML = Ext.util.Format.htmlEncode(d)
} else {
this.InsertCached("setValue", d)
}
},
InsertCached: function(d) {
if (!this.cachedAction) {
this.cachedAction = {}
}
this.cachedAction[d] = Array.prototype.slice.call(arguments, 1)
},
EraseCached: function(d) {
if ((!this.cachedAction) || (!this.cachedAction[d])) {
return
}
delete this.cachedAction[d]
},
SetIndicator: function(d) {
if (this.rendered) {
this.RemoveIndicator();
this.el.insertFirst(d)
} else {
this.InsertCached("SetIndicator", d)
}
},
RemoveIndicator: function() {
if (this.rendered) {
while (this.el.dom.firstChild) {
this.el.dom.removeChild(this.el.dom.firstChild)
}
} else {
this.EraseCached("SetIndicator")
}
}
};
this.ctLeft = new Ext.Container(Ext.apply({
cls: "player_banner_left"
}, a));
this.ctCenterInner = new Ext.Container(Ext.apply({
cls: "ellipsis_text player_banner_center_inner"
}, a));
this.ctCenter = new Ext.Container(Ext.apply({
cls: "player_banner_center",
items: [this.ctCenterInner],
SetTooltips: function(d) {
if (this.rendered) {
this.el.dom.setAttribute("ext:qtip", Ext.util.Format.htmlEncode(d))
} else {
this.InsertCached("SetTooltips", d)
}
}
}, a));
this.ctRight = new Ext.Container(Ext.apply({
cls: "player_banner_right",
style: (true === c) ? "padding-right: " + this.CTRIGHT_PADDING_RIGHT + "px" : "",
SetAudioIcon: Ext.emptyFn
}, a));
Ext.applyIf(b, {
cls: SYNO.SS.Utils.GetVdoInfoBarCls() + " player_banner",
items: [this.ctCenter, this.ctRight],
listeners: {
afterlayout: function() {
this.UpdateCenterInnerWidth()
},
beforedestroy: function() {
this.owner = null
},
scope: this
}
});
this.centerWidthConfig = {};
this.callParent([b])
},
SetLeft: function(a) {
this.ctLeft.setValue(a)
},
SetLeftIndicator: function(a) {
this.ctLeft.SetIndicator(a)
},
RemoveLeftIndicator: function() {
this.ctLeft.RemoveIndicator()
},
SetTitle: function(b, a) {
b = (b || "");
this.ctCenterInner.setValue(b);
if (!b) {
this.ctCenter.SetTooltips("");
return
}
if ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.TIMELINE === this.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW === this.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_EMAPVIEW === this.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_POS === this.viewType)) {
this.ctCenter.SetTooltips(b + this.GetTooltipsDescribe(a))
} else {
this.ctCenter.SetTooltips(b)
}
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.TIMELINE === this.viewType) {
this.SetLeftIndicator(this.GetTimelineIndicator(a))
}
},
SetRight: function(a) {
this.ctRight.setValue(a)
},
GetTooltipsDescribe: function(b) {
var c, e, d, a;
if (!b) {
return ""
}
if ((true === Ext.isNumber(b.mountId)) && (0 < b.mountId)) {
e = SYNO.SS.GblStore.dsEventMount.getById(b.mountId);
if (e) {
return " [" + e.get("name") + "]"
}
}
if (true === Ext.isNumber(b.archId) && (0 < b.archId)) {
d = SYNO.SS.GblStore.dsArchiveTask.getById(b.archId);
if (d) {
return " [" + d.get("name") + "]"
}
}
a = (true === Ext.isNumber(b.ownerDsId)) ? b.ownerDsId : b.dsId;
if (true === Ext.isNumber(a)) {
c = SYNO.SS.GblStore.GetDsName(a);
if (c) {
return " [" + c + "]"
}
}
return ""
},
GetTimelineIndicator: function(b) {
var d, a;
var c = "";
if (0 < b.mountId) {
c = "icon_info_mount.png?v=10061"
} else {
if (0 < b.archId) {
c = "icon_info_vault.png?v=10061"
} else {
return
}
}
a = (true === SYNO.SS.Image.IsRetinaSupport()) ? "2x" : "1x";
d = document.createElement("img");
d.setAttribute("src", "modules/WebPlayer/images/" + a + "/" + c);
d.setAttribute("class", "banner_timeline_indicator");
return d
},
GetHeight: function() {
return (true === this.hidden) ? 0 : this.INFO_HEIGHT
},
UpdateCenterInnerWidth: function(d) {
var e = 0;
var b = this.getWidth();
var a = 0;
var c = 0;
if (0 >= b) {
return
}
if (d) {
this.centerWidthConfig = d
}
switch (this.viewType) {
case SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW:
case SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_EMAPVIEW:
case SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_POS:
case SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_IVA:
case SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_IPSPEAKER:
case SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_IPSPEAKER_GROUP:
a = this.LIVEVIEW_ICON_WIDTH;
c = this.LIVEVIEW_ICON_WIDTH;
break;
case SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.TIMELINE:
c = (true === this.centerWidthConfig.blWithSpeed) ? this.TIME_WIDTH + this.SPEED_WIDTH : this.TIME_WIDTH;
c += this.CTRIGHT_PADDING_RIGHT;
break;
case SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.PREVIEW:
case SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.POS_PREVIEW:
case SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.DVA_PREVIEW:
case SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.DVA_RECORDING:
case SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.PREVIEW_IPSPEAKER:
case SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.PREVIEW_IPSPEAKER_GROUP:
c = this.BITRATE_WIDTH;
break;
case SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.RECORDING:
case SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.POS_RECORDING:
c = this.DATETIME_WIDTH + this.CTRIGHT_PADDING_RIGHT;
break
}
e = b - 2 * Math.max(a, c) - 20;
if (e <= this.CT_CENTER_MIN_WIDTH_THRESHOLD) {
e = 0
}
this.ctCenterInner.setWidth(e)
}
});
Ext.define("SYNO.SS.App.WebPlayer.WSHandler", {
KEEP_ALIVE_MSEC: 10000,
ws: null,
config: null,
delayTask: null,
keepAliveTask: null,
constructor: function() {},
Init: function(b) {
var a;
this.conntionStatus = SYNO.SS.App.WebPlayer.Def.WebSocketConnectStatus.NOT_CONNECT_YET;
if ((this.ws) || (!b) || (!b.WSTarget)) {
return
}
a = this.GetWebSocketUrl(b);
if ("" === a) {
return
}
this.ws = new WebSocket(a);
this.ws.binaryType = "arraybuffer";
this.conntionStatus = SYNO.SS.App.WebPlayer.Def.WebSocketConnectStatus.NORMAL;
this.ChangeConfig(b);
this.delayTask = setTimeout(this.StartKeepAliveTask.bind(this), Math.random() * this.KEEP_ALIVE_MSEC)
},
GetWebSocketUrl: function(a) {
var b = {
param: {},
wsURLPrefix: ""
};
if (-1 === this.FillWSUrlParam(a, b)) {
return ""
}
return SYNO.SS.App.WebPlayer.ConnUtils.GetCompleteUrl(a, b)
},
FillWSUrlParam: function(a, b) {
if (true === this.IsConnectToRecServer(a)) {
if (0 < SYNO.SS.App.WebPlayer.ConnUtils.FillDirectConnParam(a, b)) {
return -1
}
} else {
SYNO.SS.App.WebPlayer.ConnUtils.FillRelayParam(a, b)
}
return 0
},
IsConnectToRecServer: function(a) {
return false
},
ChangeConfig: function(a) {
if (!this.ws) {
return
}
this.RemoveEvtListener();
this.config = a;
this.PatchConfig();
this.AddEventListener();
if (this.config.fnOnWSReady) {
if (WebSocket.OPEN === this.GetReadyState()) {
this.config.fnOnWSReady()
} else {
this.ws.addEventListener("open", this.config.fnOnWSReady)
}
}
},
PatchConfig: function() {
this.config.fnOnWSMessage = this.config.fnOnWSMessage || Ext.emptyFn;
this.config.fnOnWSClose = this.config.fnOnWSClose || this.Retry.createDelegate(this)
},
AddEventListener: function() {
if ((this.ws) && (this.config)) {
this.ws.addEventListener("message", this.config.fnOnWSMessage);
this.ws.addEventListener("close", this.config.fnOnWSClose)
}
},
RemoveEvtListener: function() {
if ((this.ws) && (this.config)) {
this.ws.removeEventListener("message", this.config.fnOnWSMessage);
this.ws.removeEventListener("close", this.config.fnOnWSClose);
if (this.config.fnOnWsReady) {
this.ws.removeEventListener("open", this.config.fnOnWSReady)
}
}
},
StartKeepAliveTask: function() {
this.keepAliveTask = setInterval(function() {
this.SendCmd("keepAlive")
}.createDelegate(this), this.KEEP_ALIVE_MSEC)
},
IsSameWSTarget: function(a) {
return (this.config.dsId === a)
},
IsDsRecEncryptEnabled: function(a) {
var b = SYNO.SS.GblStore.dsSlaveDS.getById(a);
return (b) ? b.get("recEncryptEnabled") : true
},
SendCmd: function(a) {
if (WebSocket.OPEN === this.GetReadyState()) {
this.ws.send(a)
}
},
SendParams: function(b, a) {
SYNO.SS.App.WebPlayer.ConnUtils.PatchParamId(a, a.param);
b += "&" + SYNO.SS.App.WebPlayer.ConnUtils.Param2Str(a.param);
this.SendCmd(b)
},
Destroy: function() {
if (this.delayTask) {
clearTimeout(this.delayTask);
this.delayTask = null
}
if (this.keepAliveTask) {
clearInterval(this.keepAliveTask);
this.keepAliveTask = null
}
this.RemoveEvtListener();
if (this.ws) {
this.ws.close();
this.ws = null
}
this.config = null
},
Retry: function(b) {
var a = this.config;
if (false === Ext.isNumber(b)) {
b = 2000
}
this.Destroy();
this.delayTask = setTimeout(function() {
this.Init(a)
}.createDelegate(this), b)
},
GetReadyState: function() {
return (this.ws) ? this.ws.readyState : WebSocket.CLOSED
}
});
Ext.define("SYNO.SS.App.WebPlayer.WSStreamHandler", {
extend: "SYNO.SS.App.WebPlayer.WSHandler",
initQueue: [],
BATCH_INIT_LIMIT: 20,
CONNECT_TIMEOUT_MS: 3000,
blRelay: false,
blFixRelay: false,
fnFixRelay: null,
fnOnWSClose: null,
fnCfgOnClose: null,
fnOnWsOpen: null,
constructor: function(a) {
a.WSTarget = a.WSTarget || "ss_webstream_task";
this.config = a;
this.fnCfgOnClose = this.OnClose.createDelegate(this);
this.callParent([a]);
if (true === SYNO.SS.Utils.IsSsc()) {
this.initQueue.push(this);
if (this.initQueue.length <= this.BATCH_INIT_LIMIT) {
this.Init(a);
this.InitFixRelayEvent(a);
this.InitOpenEvent()
}
} else {
this.Init(a);
this.InitFixRelayEvent(a)
}
},
InitFixRelayEvent: function(a) {
if (!this.ws) {
return
}
if (true === this.IsConnectToRecServer(a)) {
this.fnFixRelay = this.FixRelay.createDelegate(this);
this.ws.addEventListener("message", this.fnFixRelay);
this.SetDirectConnectTimeout(a.dsId)
} else {
this.blRelay = true;
this.FixRelay()
}
},
FixRelay: function() {
this.blFixRelay = true;
this.RmFixRelayEvt()
},
RmFixRelayEvt: function() {
if (this.fnFixRelay) {
this.ws.removeEventListener("message", this.fnFixRelay);
this.fnFixRelay = null
}
if (this.timerDirectConnect) {
clearTimeout(this.timerDirectConnect);
this.timerDirectConnect = null
}
},
SetDirectConnectTimeout: function(a) {
if (SYNO.SS.App.CMS.Def.VIDEO_RELAY.AUTO !== _S("cmsSetting").VdoRelayType) {
return
}
clearTimeout(this.timerDirectConnect);
this.timerDirectConnect = setTimeout(function() {
SYNO.SS.App.WebPlayer.ConnUtils.SetForceRelay(a);
this.ws.close()
}.bind(this), this.CONNECT_TIMEOUT_MS)
},
InitOpenEvent: function() {
this.fnOnWsOpen = this.CheckInitNext.createDelegate(this);
this.ws.addEventListener("open", this.fnOnWsOpen)
},
CheckInitNext: function() {
var a = this.initQueue.indexOf(this);
var b = ((0 <= a) && (a < this.BATCH_INIT_LIMIT)) ? this.initQueue[this.BATCH_INIT_LIMIT] : null;
if (0 <= a) {
this.initQueue.splice(a, 1)
}
if (this.fnOnWsOpen) {
this.ws.removeEventListener("open", this.fnOnWsOpen);
this.fnOnWsOpen = null
}
if (b) {
setTimeout(function() {
this.Init(this.config);
this.InitFixRelayEvent(this.config);
this.InitOpenEvent()
}.createDelegate(b), 50)
}
},
OnClose: function(a) {
var b = SYNO.SS.App.WebPlayer.Def.WebSocketConnectStatus;
this.CheckInitNext();
if (true === this.IsTryRelay()) {
this.blRelay = true;
this.FixRelay();
this.Retry(300)
} else {
this.conntionStatus = (1000 === a.code) ? b.NORMAL : b.CONNECTION_FAILED;
this.fnOnWSClose(a)
}
},
IsTryRelay: function() {
if ((true === this.blFixRelay) || (true === this.blRelay)) {
return false
}
return true
},
IsNotConnectYet: function() {
return (SYNO.SS.App.WebPlayer.Def.WebSocketConnectStatus.NOT_CONNECT_YET === this.conntionStatus)
},
IsConnectStatusNormal: function() {
return (SYNO.SS.App.WebPlayer.Def.WebSocketConnectStatus.NORMAL === this.conntionStatus)
},
IsConnectFailed: function() {
return (SYNO.SS.App.WebPlayer.Def.WebSocketConnectStatus.CONNECTION_FAILED === this.conntionStatus)
},
PatchConfig: function() {
if (this.fnCfgOnClose !== this.config.fnOnWSClose) {
this.fnOnWSClose = this.config.fnOnWSClose || this.Retry.createDelegate(this);
this.config.fnOnWSClose = this.fnCfgOnClose
}
this.config.WSTarget = this.config.WSTarget || "ss_webstream_task";
this.callParent(arguments)
},
Destroy: function() {
this.RmFixRelayEvt();
this.CheckInitNext();
this.callParent(arguments)
},
IsConnectToRecServer: function(b) {
var a = b.dsId || LOCAL_DS_ID;
if ((LOCAL_DS_ID === a) || (true === b.forceRelay)) {
return false
} else {
if (true === SYNO.SS.App.WebPlayer.ConnUtils.IsForceRelay(a)) {
return false
} else {
if (true === this.IsDsRecEncryptEnabled(a)) {
SYNO.SS.App.WebPlayer.ConnUtils.SetForceRelay(a);
return false
}
}
}
switch (_S("cmsSetting").VdoRelayType) {
case SYNO.SS.App.CMS.Def.VIDEO_RELAY.AUTO:
return ((false === this.blRelay) && (true === SYNO.SS.App.WebPlayer.ConnUtils.IsDirectConnectValid(a)));
case SYNO.SS.App.CMS.Def.VIDEO_RELAY.DISABLE:
return true;
default:
return false
}
}
});
Ext.namespace("SYNO.SS.App.WebPlayer.DetectionResult.DisplayerFactory");
Ext.apply(SYNO.SS.App.WebPlayer.DetectionResult.DisplayerFactory, {
CreateDisplayer: function(a) {
if (true === a.blObjSizeEditor) {
return new SYNO.SS.App.WebPlayer.DetectionResult.ObjSizeEditor(a)
}
return new SYNO.SS.App.WebPlayer.DetectionResult.FaceRecognitionDisplayer(a)
}
});
Ext.namespace("SYNO.SS.App.WebPlayer.ConnUtils");
Ext.apply(SYNO.SS.App.WebPlayer.ConnUtils, {
forceRelay: {},
SetForceRelay: function(a) {
SYNO.SS.App.WebPlayer.ConnUtils.forceRelay[a] = true
},
IsForceRelay: function(a) {
return (true === SYNO.SS.App.WebPlayer.ConnUtils.forceRelay[a])
},
GetCompleteUrl: function(a, b) {
if (false === Ext.isEmpty(a.Plugin)) {
delete b.param.blMux;
delete b.param.browser;
delete b.param.blLiveSharing;
delete b.param.pause
}
return b.wsURLPrefix + "/" + a.WSTarget + "/?" + SYNO.SS.App.WebPlayer.ConnUtils.Param2Str(b.param, true)
},
Param2Str: function(d, c) {
var b = "";
for (var a in d) {
if ("" !== b) {
b += "&"
}
b += a + "=" + ((true === c) ? encodeURIComponent(d[a]) : d[a])
}
return b
},
IsDirectConnectValid: function(a) {
var b = SYNO.SS.GblStore.dsSlaveDS.getById(a);
if (IS_OVER_HTTPS) {
return (b) ? b.get("useHttps") : false
} else {
return true
}
},
FillDirectConnParam: function(b, c) {
var a = SYNO.SS.GblStore.dsSlaveDS.getById(b.dsId);
if (true === Ext.isObject(b.param)) {
c.param = SYNO.SS.Utils.CloneObject(b.param)
}
if ((!a) || (false === SYNO.SS.App.WebPlayer.ConnUtils.IsDirectConnectValid(b.dsId))) {
return -1
}
c.wsURLPrefix = ((true === a.data.useHttps) ? "wss://" : "ws://") + a.data.ip + ":" + a.data.port.toString();
c.param.dsId = LOCAL_DS_ID;
c.param._sid = a.data.accessToken;
SYNO.SS.App.WebPlayer.ConnUtils.PatchParamId(b, c.param);
return 0
},
FillRelayParam: function(a, b) {
if (true === Ext.isObject(a.param)) {
b.param = SYNO.SS.Utils.CloneObject(a.param)
}
b.wsURLPrefix = ((true === IS_OVER_HTTPS) ? "wss://" : "ws://") + location.host + WEBAPI_ALIAS;
b.param.dsId = a.dsId;
b.param.SynoToken = _S("SynoToken");
SYNO.SS.App.WebPlayer.ConnUtils.PatchParamId(a, b.param)
},
PatchParamId: function(a, b) {
if (LOCAL_DS_ID === a.dsId) {
if (true === Ext.isDefined(a.id)) {
b.id = a.id
}
} else {
if (true === Ext.isDefined(a.idOnRec)) {
b.id = a.idOnRec
}
}
if (true === Ext.isDefined(a.type)) {
b.type = a.type
}
},
GetDirectUrl: function(a) {
var b = {
param: {},
wsURLPrefix: ""
};
if (LOCAL_DS_ID !== a.dsId) {
SYNO.SS.App.WebPlayer.ConnUtils.FillDirectConnParam(a, b)
} else {
SYNO.SS.App.WebPlayer.ConnUtils.FillRelayParam(a, b)
}
return SYNO.SS.App.WebPlayer.ConnUtils.GetCompleteUrl(a, b)
},
GetRelayUrl: function(a) {
var b = {
param: {},
wsURLPrefix: ""
};
SYNO.SS.App.WebPlayer.ConnUtils.FillRelayParam(a, b);
return SYNO.SS.App.WebPlayer.ConnUtils.GetCompleteUrl(a, b)
}
});
Ext.namespace("SYNO.SS.App.WebPlayer.Utils");
Ext.apply(SYNO.SS.App.WebPlayer.Utils, {
ParseReso: function(a) {
var b;
b = SYNO.SS.Utils.Camera.GetCamResolution(a);
b = b.split("x");
return b
},
Reso2Box: function(b, d) {
var e = SYNO.SS.App.WebPlayer.Utils.ParseReso(b);
var c, a;
if ((SYNO.SS.App.Camera.Def.Rotation.QUARTER === d) || (SYNO.SS.App.Camera.Def.Rotation.THREE_QUARTER === d)) {
c = e[1];
a = e[0]
} else {
c = e[0];
a = e[1]
}
return {
width: c,
height: a
}
},
GetLiveReso: function(a, e) {
var b = a.get("stm_info");
var f = a.get("video_rotation");
var c = (e < b.length) ? b[e].resolution : a.get("resolution");
var d = SYNO.SS.App.WebPlayer.Utils.Reso2Box(c, f);
return String.format("{0}x{1}", d.width, d.height)
},
IsHtml5Support: function(a) {
return SYNO.SS.App.WebPlayer.Utils.IsHtml5SupportCodec(SYNO.SS.Utils.GetVdoTypeStr(a), SYNO.SS.Utils.GetRecordReso(a), a.get("ownerDsId"))
},
IsFirefoxSupportReso: function(a) {
var b;
if (!a) {
return true
}
b = SYNO.SS.App.WebPlayer.Utils.ParseReso(a);
return (4096 * 2304 >= b.reduce(function(c, d) {
return c * d
}, 1))
},
IsHtml5SupportCodec: function(c, b, a) {
if (true === SYNO.SS.Utils.IsSynoChromium()) {
return true
}
if (true === Ext.isNumber(c)) {
c = SYNO.SS.Utils.GetVideoStrByType(c)
}
if (SYNO.SS.String.MJPEG === c) {
return true
}
if (IS_IE_BROWSER) {
return false
}
if (true === SYNO.SS.Utils.IsSsc()) {
return SYNO.SS.Utils.IsVideoSupported(SYNO.SS.Utils.GetVideoTypeByStr(c), a)
} else {
if ((SYNO.SS.String.H264 !== c) && (SYNO.SS.String.H264_PLUS !== c)) {
return false
}
}
if (IS_FIREFOX_BROWSER) {
if (true === Ext.isArray(b)) {
return b.every(SYNO.SS.App.WebPlayer.Utils.IsFirefoxSupportReso)
} else {
return SYNO.SS.App.WebPlayer.Utils.IsFirefoxSupportReso(b)
}
}
return true
},
GetHtml5BroswerType: function() {
var a = SYNO.SS.App.WebPlayer.Def.BrowserType.UNKNOWN;
if (true === Ext.isEdge) {
a = SYNO.SS.App.WebPlayer.Def.BrowserType.EDGE
} else {
if (true === IS_CHROME_BROWSER) {
if (true === SYNO.SS.Utils.IsSynoChromium()) {
a = SYNO.SS.App.WebPlayer.Def.BrowserType.SYNOCHROMIUM
} else {
a = SYNO.SS.App.WebPlayer.Def.BrowserType.CHROME
}
} else {
if (true === IS_SAFARI_BROWSER) {
a = SYNO.SS.App.WebPlayer.Def.BrowserType.SAFARI
}
}
}
return a
},
BufGetInt: function(b, a) {
return (b[a] << 24 | b[a + 1] << 16 | b[a + 2] << 8 | b[a + 3])
},
BufGetChar: function(b, a) {
return b[a]
},
BufGetLongLong: function(b, a) {
return (b[a] << 56 | b[a + 1] << 48 | b[a + 2] << 40 | b[a + 3] << 32 | b[a + 4] << 24 | b[a + 5] << 16 | b[a + 6] << 8 | b[a + 7])
},
IsOpenFromSlaveDS: function(a) {
return ((false === Ext.isEmpty(a)) && (LOCAL_DS_ID !== a.getAppDSId()))
},
BufParseHeader: function(a) {
var c = this.BufGetInt(a, 0);
var b = String.fromCharCode.apply(null, a.subarray(4, c));
var d = {
headerEnd: c
};
b.split("&").forEach(function(f) {
var e = f.split("=");
d[e[0]] = e[1] || ""
});
return d
},
MessageReader: {
GetCmdStamp: function(a) {
return parseInt(a.stamp, 10)
},
GetAudioFlag: function(a) {
return ("2" === a.mediaType) ? 1 : 0
},
GetFrameTimeMSec: function(a) {
return parseInt(a.msec, 10)
},
GetFrameId: function(a) {
return parseInt(a.id, 10)
},
GetRawData: function(b, a) {
return a.subarray(b.headerEnd)
},
IsCloseMsg: function(a) {
return Ext.isString(a.close)
},
GetEndReason: function(a) {
if ("failed" === a.close) {
return SYNO.SS.App.WebPlayer.Def.StreamEndReason.FAILED
} else {
if ("unauth" === a.close) {
return SYNO.SS.App.WebPlayer.Def.StreamEndReason.UNAUTH
} else {
if ("forceRelay" === a.close) {
return SYNO.SS.App.WebPlayer.Def.StreamEndReason.FORCE_RELAY
} else {
return SYNO.SS.App.WebPlayer.Def.StreamEndReason.NORMAL
}
}
}
},
IsIFrame: function(a) {
return ("1" === a.key)
}
},
GetGeneralState: function(a) {
return {
srcSpeed: (true === Ext.isFunction(a.parent.GetSpeed)) ? a.parent.GetSpeed() : 1
}
},
SetGeneralState: function(a, b) {
if (true === a.fnIsManualPaused()) {
a.Pause()
}
if (0 < b.srcSpeed) {
a.SetSpeed(b.srcSpeed)
}
},
RegFirstFrameInitFunc: function(c, b, a) {
b.blFrameReady = false;
c.fnOnFirstFrame = function() {
c.removeEventListener(a, c.fnOnFirstFrame);
b.blFrameReady = true;
setTimeout(function() {
if (b.fnUpdateStreamTm) {
b.fnUpdateStreamTm(b.GetCurStreamTm())
}
}, 0)
};
c.addEventListener(a, c.fnOnFirstFrame)
},
DrawRawImage: function(c, b, a) {
if ((!c) || (!b)) {
return
}
b.width = c.videoWidth || c.naturalWidth;
b.height = c.videoHeight || c.naturalHeight;
b.getContext("2d").drawImage(c, 0, 0);
if (a) {
a(b)
}
}
});
Ext.define("SYNO.SS.App.WebPlayer.C2Player", {
BUF_DURATION_MS: 12 * 1000,
blDestroyWS: false,
seekSec: 0,
curStreamMs: 0,
flushToMs: 0,
streamSpeed: 1,
volume: 1,
blAudio: false,
blMute: false,
forceRelay: {},
constructor: function(a) {
this.packer = new SYNO.SS.App.WebPlayerVue.C2RecPacker({
fnFrameReady: this.OnFrameReady.bind(this)
});
this.wsMessageReader = SYNO.SS.App.WebPlayer.Utils.MessageReader;
this.parent = a.parent;
this.dsId = a.dsId;
this.fnUpdateStreamTm = a.fnUpdateStreamTm;
this.fnOnStreamEnded = a.fnOnStreamEnded;
this.fnOnRetry = a.fnOnRetry;
this.fnBufferUpdateEndCallback = a.fnBufferUpdateEndCallback;
this.fnIsManualPaused = a.fnIsManualPaused;
this.Init(a);
if (a.wsHandler) {
this.wsHandler = a.wsHandler;
this.wsHandler.ChangeConfig(a);
this.blDestroyWS = false
} else {
this.wsHandler = new SYNO.SS.App.WebPlayer.WSStreamHandler(a);
this.blDestroyWS = true
}
},
Init: function(a) {
this.ShowLoading();
this.vdoDom = this.CreateVideoDom();
this.seekSec = a.param.start || 0;
this.curStreamMs = this.seekSec * TRANS_MILLISECOND;
this.flushToMs = this.curStreamMs + this.BUF_DURATION_MS;
a.param.flushToMs = this.flushToMs;
this.streamSpeed = a.param.speed || 1;
this.volume = (0 <= a.volume) ? a.volume : 1;
this.blAudio = !!a.param.blAudio;
this.blMute = !!a.blMute;
a.param.rec_auth = SYNO.SS.App.C2Vue.C2EncFlow.getRecAuth(this.dsId);
a.forceRelay = this.forceRelay[this.dsId] || (!!a.param.rec_auth);
a.param.relay_rec_auth = a.forceRelay;
a.fnOnWSMessage = this.OnWSMessage.createDelegate(this);
a.fnOnWSClose = this.OnWSClose.createDelegate(this)
},
CreateVideoDom: function() {
var b = document.createElement("video");
var a = document.createElement("video");
b.next = a;
a.next = b;
a.hidden = true;
[b, a].forEach(function(c) {
c.setAttribute("style", "width: 100%; height: 100%; object-fit: fill; position: absolute;");
this.InitVideoDomPlayEvent(c, this)
}, this);
this.AddVideoDomOneTimeEvt(b, this);
return b
},
InitVideoDomPlayEvent: function(b, a) {
b.oncanplaythrough = function() {
if ((!b.endMs) && (0 < b.buffered.length)) {
b.startMs = b.currentTime * TRANS_MILLISECOND;
b.endMs = b.buffered.end(b.buffered.length - 1) * TRANS_MILLISECOND
}
if (!a.playable) {
a.SwitchVideoDom(b);
return
}
if (a.vdoDom === b) {
a.DoCanPlayAct(b)
}
};
b.onended = function() {
if (a.vdoDom !== b) {
return
}
a.playable = false;
if (a.IsPlayable(b.next)) {
a.SwitchVideoDom(b.next)
} else {
if (a.waitEnded) {
a.OnStreamEnded(a.waitEnded.endReason)
} else {
a.ShowLoading()
}
}
};
b.ontimeupdate = function() {
if (a.vdoDom === b) {
a.UpdateStreamTime(b.currentTime * TRANS_MILLISECOND)
}
}
},
IsPlayable: function(a) {
return ((a) && (a.inited)) ? (4 === a.readyState) : false
},
SwitchVideoDom: function(b) {
var a = this;
a.playable = true;
a.ApplyPlayProperty(b);
b.play().then(function() {
a.ShowLoading(false);
b.hidden = false;
a.vdoDom = b;
a.DoCanPlayAct(b);
a.CleanupVideoSrc(b.next);
a.LoadNext(a.flushToMs)
}, function() {
a.playable = false;
a.CleanupVideoSrc(b);
a.LoadNext(a.flushToMs)
})
},
ApplyPlayProperty: function(a) {
a.playbackRate = this.streamSpeed;
a.volume = this.volume;
this.ApplyDomMuted(a)
},
ApplyDomMuted: function(a) {
if (a) {
a.muted = (!this.blAudio) || (this.blMute)
}
},
DoCanPlayAct: function(a) {
if (this.seekSec) {
a.currentTime = this.seekSec;
this.seekSec = 0
}
if (true === this.fnIsManualPaused()) {
this.Pause()
} else {
if (true === a.paused) {
SYNO.SS.Utils.CatchRejectionPlay(a)
}
}
},
UpdateStreamTime: function(a) {
if ((this.seekSec) || (a < this.curStreamMs)) {
return
}
this.curStreamMs = a;
if (this.fnUpdateStreamTm) {
this.fnUpdateStreamTm(a)
}
if (this.fnBufferUpdateEndCallback) {
this.fnBufferUpdateEndCallback(a * TRANS_MILLISECOND)
}
},
AddVideoDomOneTimeEvt: function(b, a) {
SYNO.SS.App.WebPlayer.Utils.RegFirstFrameInitFunc(b, a, "canplay");
b.fnDomInserted = SYNO.SDS.Utils.AddOneTimeEvtListener(b, "DOMNodeInserted", function() {
b.parentNode.insertBefore(b.next, b);
delete b.fnDomInserted
})
},
RemoveVideoDomEvent: function() {
[this.vdoDom, this.vdoDom.next].forEach(function(a) {
if (a.fnVideoInitialized) {
a.removeEventListener("canplay", a.fnVideoInitialized);
delete a.fnVideoInitialized
}
if (a.fnOnFirstFrame) {
a.removeEventListener("canplay", a.fnOnFirstFrame);
delete a.fnOnFirstFrame
}
if (a.fnDomInserted) {
a.removeEventListener("DOMNodeInserted", a.fnDomInserted);
delete a.fnDomInserted
}
a.oncanplaythrough = null;
a.onended = null;
a.ontimeupdate = null
}, this)
},
Deactivate: function() {
this.waitEnded = null;
this.vdoHeader = null;
this.vdoData = null;
this.parent = null;
this.fnOnStreamEnded = null;
this.DestroyWSHandler();
this.packer.reset();
if (this.resetTaskId) {
clearTimeout(this.resetTaskId);
this.resetTaskId = null
}
if (this.vdoDom) {
this.RemoveVideoDomEvent();
this.CleanupVideoSrc(this.vdoDom);
this.CleanupVideoSrc(this.vdoDom.next);
this.vdoDom.next.remove();
this.vdoDom = null
}
},
DestroyWSHandler: function() {
if ((this.wsHandler) && (true === this.blDestroyWS)) {
this.wsHandler.Destroy()
}
this.wsHandler = null
},
OnWSMessage: function(a) {
if (!(a.data instanceof ArrayBuffer)) {
return
}
var b = new Uint8Array(a.data);
var f = SYNO.SS.App.WebPlayer.Utils.BufParseHeader(b);
if (this.parent.cmdStamp !== this.wsMessageReader.GetCmdStamp(f)) {
return
}
if (true === this.wsMessageReader.IsCloseMsg(f)) {
this.OnWSClose(null, this.wsMessageReader.GetEndReason(f));
return
}
if (f.encrypted) {
this.packer.generateKey(f.encrypted, f.iv);
return
}
var d = this.wsMessageReader.GetFrameTimeMSec(f);
var e = this.wsMessageReader.GetRawData(f, b);
var c = this.wsMessageReader.IsIFrame(f);
this.parent.fireEvent("frameReceive", e.byteLength, true);
this.packer.receive(e, d, c)
},
OnFrameReady: function(b, a) {
if (0 === a) {
this.vdoHeader = b;
this.vdoData = [this.vdoHeader];
this.playable = false
} else {
if (0 < b.byteLength) {
this.vdoData.push(b)
}
if (a >= this.flushToMs) {
this.flushToMs = a + 1;
this.InitVideoSrc()
}
}
},
InitVideoSrc: function() {
if ((!this.vdoData) || (1 >= this.vdoData.length)) {
return false
}
var a = (this.vdoDom.inited) ? this.vdoDom.next : this.vdoDom;
this.CleanupVideoSrc(a);
a.src = URL.createObjectURL(new Blob(this.vdoData, {
type: "video/mp4"
}));
a.inited = true;
this.vdoData = [this.vdoHeader];
return true
},
CleanupVideoSrc: function(a) {
a.hidden = true;
URL.revokeObjectURL(a.src);
a.src = "";
a.inited = false;
a.startMs = 0;
a.endMs = 0
},
OnWSClose: function(a, b) {
if (SYNO.SS.App.WebPlayer.Def.StreamEndReason.FORCE_RELAY === b) {
this.wsHandler.config.forceRelay = true;
this.wsHandler.config.param.relay_rec_auth = true;
this.wsHandler.Retry(300);
return
}
if (SYNO.SS.App.WebPlayer.Def.StreamEndReason.UNAUTH === b) {
this.forceRelay[this.dsId] = true;
this.VerifyC2Auth();
return
}
this.packer.ended(function() {
if ((true === this.InitVideoSrc()) || (true === this.playable)) {
this.waitEnded = this.waitEnded || {
endReason: b
};
return
}
this.OnStreamEnded(b)
}.bind(this))
},
OnStreamEnded: function(a) {
this.ShowLoading(false);
if (this.fnOnStreamEnded) {
this.fnOnStreamEnded(a);
this.fnOnStreamEnded = null
}
},
VerifyC2Auth: function() {
SYNO.SS.App.C2Vue.C2EncFlow.openVeifyWin(this.parent.findWindow(), this.dsId).then(function(a) {
if (true === a) {
this.LoadNext(this.flushToMs, "&rec_auth=" + SYNO.SS.App.C2Vue.C2EncFlow.getRecAuth(this.dsId))
} else {
this.OnStreamEnded()
}
}.bind(this))
},
ReconnectStream: function(a) {
this.DestroyWSHandler();
clearTimeout(this.resetTaskId);
this.resetTaskId = setTimeout(function() {
this.resetTaskId = null;
this.parent.ReplaceVideoInst()
}.createDelegate(this), a)
},
GetNode: function() {
return this.vdoDom
},
Resume: function() {
if ((this.vdoDom) && (true === this.vdoDom.paused)) {
SYNO.SS.Utils.CatchRejectionPlay(this.vdoDom)
}
},
Pause: function() {
if ((this.vdoDom) && (false === this.vdoDom.paused)) {
this.vdoDom.pause()
}
},
Seek: function(a) {
this.SeekMs(a * TRANS_MILLISECOND)
},
SeekMs: function(b) {
this.seekSec = b / TRANS_MILLISECOND;
this.curStreamMs = b;
if (true === this.IsSeekable(this.vdoDom, b)) {
this.vdoDom.currentTime = this.seekSec;
return
}
this.Pause();
this.playable = false;
if (true === this.IsSeekable(this.vdoDom.next, b)) {
this.SwitchVideoDom(this.vdoDom.next);
return
}
this.ShowLoading();
if ((b < this.flushToMs) && ((this.flushToMs - this.BUF_DURATION_MS) <= b)) {
return
}
var a = this.AppendStampCmd();
if (this.vdoHeader) {
this.vdoData = [this.vdoHeader];
this.CleanupVideoSrc(this.vdoDom.next)
} else {
a += "&restart=true"
}
this.packer.reset();
this.waitEnded = null;
this.LoadNext(b, a)
},
IsSeekable: function(b, a) {
return this.IsPlayable(b) && (a < b.endMs) && (a >= b.startMs)
},
LoadNext: function(b, a) {
if ((!this.wsHandler) || (this.waitEnded)) {
return
}
this.flushToMs = b + this.BUF_DURATION_MS;
this.wsHandler.SendCmd(String.format("stmSrc={0}&startMs={1}&flushToMs={2}{3}", SYNO.SS.App.WebPlayer.Def.StreamSrc.C2_REC, b, this.flushToMs, a || ""))
},
SetSpeed: function(a) {
this.streamSpeed = a;
if (this.vdoDom) {
this.vdoDom.playbackRate = this.streamSpeed
}
},
SetMute: function(a) {
this.blMute = a;
this.ApplyDomMuted(this.vdoDom)
},
SetVolume: function(a) {
this.volume = a;
if (this.vdoDom) {
this.vdoDom.volume = this.volume
}
},
GetVolume: function() {
return this.volume
},
SetState: function(a) {
SYNO.SS.App.WebPlayer.Utils.SetGeneralState(this, a)
},
GetState: function() {
return SYNO.SS.App.WebPlayer.Utils.GetGeneralState(this)
},
GetCurStreamTm: function() {
return this.curStreamMs
},
AppendStampCmd: function() {
return "&stamp=" + (++this.parent.cmdStamp)
},
DrawSnapshot: function(a, b) {
SYNO.SS.App.WebPlayer.Utils.DrawRawImage(this.GetNode(), a, b)
},
ShowLoading: function(a) {
if (!this.parent) {
return
}
if (false === a) {
this.parent.HidePlayerTip()
} else {
this.parent.ShowPlayerTip({
img: "loading-spinner"
})
}
}
});
Ext.namespace("SYNO.SS.App.WebPlayer");
SYNO.SS.App.WebPlayer.CreatePlayer = function(a) {
if (false === Ext.isEmpty(a.Plugin)) {
return new SYNO.SS.App.WebPlayer.PPApiPluginPlayer(a)
} else {
if (true === a.blTimeoutPlayer) {
return new SYNO.SS.App.WebPlayer.TimeOutPlayer(a)
} else {
if (true === a.blC2Player) {
return new SYNO.SS.App.WebPlayer.C2Player(a)
} else {
if ((SYNO.SS.String.MJPEG === a.videoType) && (false === SYNO.SS.Utils.IsSynoChromium())) {
return new SYNO.SS.App.WebPlayer.ImgTagPlayer(a)
} else {
return new SYNO.SS.App.WebPlayer.Html5VideoTagPlayer(a)
}
}
}
}
};
Ext.define("SYNO.SS.App.WebPlayer.VideoContainer", {
extend: "Ext.Container",
WEBPLAYER_TIP_CLS: "webplayer_tip",
WEBPLAYER_IMG_CLS: "webplayer_img",
WEBPLAYER_BKG_CLS: "webplayer_bkg",
OSD_BTN_NORMAL_SIZE_MIN_W: 425,
OSD_BTN_NORMAL_SIZE_MIN_H: 220,
TIP_IMG_NORMAL_SIZE_MIN_W: 185,
TIP_IMG_NORMAL_SIZE_MIN_H: 138,
viewType: 0,
blFixAspectRatio: false,
blShowVideoLabel: false,
blFocused: true,
blPTZ: true,
blMute: false,
blManualPaused: false,
blDoFireInited: false,
videoRatio: 0,
ctWidth: 0,
ctHeight: 0,
tipInfo: null,
blShowPrivMaskUI: false,
blEnablePrivMask: false,
onScreenHandler: null,
panelOSD: null,
lastFrame: null,
waterMark: null,
privacyMask: null,
panelSnapshot: null,
videoInst: null,
newVideoInst: null,
owner: null,
cmpAlertIcon: null,
cmpPauseIcon: null,
cmpHwIcon: null,
cmpJoystickIcon: null,
ctStsIndicator: null,
fnUpdateAudioInfo: null,
imageEnhancement: null,
blSuspendMouseEvent: false,
blHideOsdBbar: false,
dragTracker: null,
domRemoveTask: null,
blAnalyticsEdit: false,
regionId: 0,
dewarpVideoPanel: null,
fisheyePanel: null,
fisheyePolygon: null,
fisheyeRegionInfo: null,
fisheyeConfig: null,
constructor: function(a) {
this.Init(a);
Ext.applyIf(a, {
style: "overflow: hidden; position: relative;",
blFixAspectRatio: a.blFixAspectRatio || false,
blShowVideoLabel: a.blShowVideoLabel || false,
blShowPrivMaskUI: a.blShowPrivMaskUI || false,
blFocused: (false !== a.blFocused),
blSuspendMouseEvent: (true === a.blSuspendMouseEvent),
blHideOsdBbar: (true === a.blHideOsdBbar),
blPTZ: (false !== a.blPTZ),
blToogleResumePause: SYNO.SS.App.WebPlayer.OsdPanelUtils.IsSupToggleResumePause(this.viewType)
});
this.callParent([a]);
this.AddFloatingCmp();
this.InitEventHandler()
},
Init: function(a) {
this.viewType = a.viewType || SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.BASEVIEW;
this.tipInfo = {};
this.resultDisplayer = a.resultDisplayer;
this.ctWidth = a.width || 0;
this.ctHeight = a.height || 0;
this.owner = a.owner;
this.fnUpdateAudioInfo = a.fnUpdateAudioInfo;
this.onScreenHandler = new SYNO.SS.App.WebPlayer.OnScreenControl(this);
this.panelSnapshot = new SYNO.SS.App.WebPlayer.SnapshotContainer({
owner: this
});
this.regionId = a.regionId;
this.blAnalyticsEdit = a.blAnalyticsEdit;
this.panelOSD = new SYNO.SS.App.WebPlayer.OsdPanel({
hidden: true,
viewType: this.viewType,
onScreenHandler: this.onScreenHandler,
panelSnapshot: this.panelSnapshot,
owner: this,
player: this.owner,
blNormalSize: this.IsNormalOsdSize(this.ctWidth, this.ctHeight),
extraCfg: a.extraCfg
});
this.lastFrame = new SYNO.SS.App.WebPlayer.LastFrameCanvas({
blFixAspectRatio: a.blFixAspectRatio
});
this.lastFrame.hide();
this.waterMark = new SYNO.SS.WaterMark(_S("watermarkData"));
this.waterMark.hide();
this.fisheyePanel = new SYNO.SS.App.WebPlayer.FisheyePanel();
this.InitPrivacyMask(a);
this.InitIconCmp()
},
InitPrivacyMask: function(b) {
var a = true;
var e = "";
var d = false;
if (true === b.blEditPrivacyMask) {
a = false;
e = b.privacyRegion;
d = true
} else {
var c = SYNO.SS.GblStore.dsCamera.getById(this.owner.camIdOnHost);
if (false === Ext.isEmpty(c)) {
e = c.get("privacyRegion");
d = c.get("enablePrivacyMask")
}
}
this.privacyMask = new SYNO.SS.PrivacyMask({
blPreviewMode: a
});
this.privacyMask.SetVisible(false);
this.privacyMask.SetRegion(e);
this.blEnablePrivMask = d
},
UpdatePrivacyMaskFromRecord: function(a) {
var c = null;
var b;
if (false === Ext.isEmpty(a)) {
b = (true === Ext.isDefined(a.data)) ? a.data : a;
if ((0 >= b.archId) && (0 >= b.mountId)) {
c = SYNO.SS.GblStore.dsCamera.getById(this.owner.camIdOnHost)
}
}
this.UpdatePrivacyMask((false == Ext.isEmpty(c)) ? c.data : null)
},
UpdatePrivacyMask: function(b) {
var a = "";
var c = false;
if (false === Ext.isEmpty(b)) {
a = b.privacyRegion;
c = b.enablePrivacyMask
}
this.privacyMask.SetRegion(a);
this.SetPrivacyMaskVisible(null, c)
},
InitIconCmp: function() {
if (true === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsShowAlertIcon(this.viewType)) {
this.cmpAlertIcon = new Ext.BoxComponent({
cls: "alert_indicator",
hidden: true,
currentCls: "alert_indicator"
})
}
if (true === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsShowPauseIcon(this.viewType)) {
this.cmpPauseIcon = new Ext.BoxComponent({
cls: "pause_indicator",
hidden: true
})
}
this.cmpHwIcon = new Ext.BoxComponent({
cls: "hw_indicator",
hidden: true
});
this.cmpJoystickIcon = new Ext.BoxComponent({
cls: "joystick_indicator",
hidden: true
});
this.ctStsIndicator = new Ext.Container({
cls: "status_container"
});
if (this.cmpAlertIcon) {
this.ctStsIndicator.add(this.cmpAlertIcon)
}
if (this.cmpPauseIcon) {
this.ctStsIndicator.add(this.cmpPauseIcon)
}
if (this.cmpHwIcon) {
this.ctStsIndicator.add(this.cmpHwIcon)
}
if (this.cmpJoystickIcon) {
this.ctStsIndicator.add(this.cmpJoystickIcon)
}
},
AddFloatingCmp: function() {
this.add(this.lastFrame);
this.add(this.privacyMask);
this.add(this.waterMark);
if (this.resultDisplayer) {
this.add(this.resultDisplayer)
}
if (false === SYNO.SS.Utils.IsSynoChromium()) {
this.add(this.fisheyePanel)
}
this.add(this.panelOSD);
this.add(this.ctStsIndicator);
this.add(this.panelSnapshot)
},
InitEventHandler: function() {
this.addEvents("videoinited");
this.addEvents("videoremoved");
this.addEvents("scalechanged");
this.addEvents("fisheyePolygonUpdate");
this.addEvents("fisheyeRegionInfoUpdate");
this.addEvents("frameSizeCount");
this.mon(this, "beforedestroy", function() {
this.RemoveVideoInst();
this.onScreenHandler.parentWin = null;
this.onScreenHandler = null;
if (this.panelOSD) {
this.panelOSD.destroy();
this.panelOSD = null
}
if (this.panelSnapshot) {
this.panelSnapshot.destroy();
this.panelSnapshot = null
}
this.owner = null;
this.dragTracker = null
}, this);
this.mon(this, "resize", function(b, c, a) {
var d = this.IsNormalOsdSize(c, a);
this.panelOSD.ChangeOsdBtnSize(d);
this.panelOSD.UpdateOsdCapacity();
SYNO.SS.App.Snapshot.Utils.SetSnapshotSetting(this.panelSnapshot);
if (true === this.panelSnapshot.isVisible()) {
this.panelSnapshot.doLayout()
}
this.onScreenHandler.Resize(c, a)
}, this);
this.mon(this, "afterrender", this.InitMouseEvent, this);
this.mon(SYNO.SDS.StatusNotifier, "watermarkUpdate", function(a) {
this.waterMark.SetWatermarkData(a)
}, this)
},
IsVideoPlayerExist: function() {
return (this.videoInst) && (false === Ext.isEmpty(this.videoInst.GetNode()))
},
IsNeedingOsdPanel: function() {
return ((false === this.blSuspendMouseEvent) && (true === this.IsVideoPlayerExist()) && (true === this.IsWebSocketStatusNormal()))
},
IsWebSocketNotConnectYet: function() {
if (this.videoInst) {
if (this.videoInst.IsWebSocketNotConnectYet) {
return this.videoInst.IsWebSocketNotConnectYet()
}
if (this.videoInst.wsHandler) {
return this.videoInst.wsHandler.IsNotConnectYet()
}
}
return false
},
IsWebSocketStatusNormal: function() {
if (this.videoInst) {
if (this.videoInst.IsWebSocketStatusNormal) {
return this.videoInst.IsWebSocketStatusNormal()
}
if (this.videoInst.wsHandler) {
return this.videoInst.wsHandler.IsConnectStatusNormal()
}
}
return false
},
IsWebSocketConnectFailed: function() {
if (this.videoInst) {
if (this.videoInst.IsWebSocketConnectFailed) {
return this.videoInst.IsWebSocketConnectFailed()
}
if (this.videoInst.wsHandler) {
return this.videoInst.wsHandler.IsConnectFailed()
}
}
return false
},
IsNeedingOnScreenControl: function() {
if (false === this.blPTZ) {
return false
}
return SYNO.SS.App.WebPlayer.VideoContainer.prototype.IsNeedingOsdPanel.call(this)
},
InitMouseEvent: function() {
var a = this.IsNeedingOsdPanel.createDelegate(this);
var c = this.IsNeedingOnScreenControl.createDelegate(this);
var b = (true === IS_FIREFOX_BROWSER) ? "wheel" : "mousewheel";
this.dragTracker = new SYNO.SS.App.WebPlayer.DragTracker({
autoStart: true,
preventDefault: false,
onBeforeEnd: function(d) {
return (true === this.IsLeftMouseBtn(d))
},
listeners: {
mousedown: function(d, f) {
if (false === d.IsLeftMouseBtn(f)) {
return false
}
if (true === a()) {
this.panelOSD.DelayHidePanel();
this.panelOSD.OnMouseDown(f)
}
if (true === c()) {
this.onScreenHandler.OnMouseDown(f)
}
},
mouseup: function(d, f) {
if (false === d.IsLeftMouseBtn(f)) {
return
}
this.panelOSD.OnMouseUp(f);
this.onScreenHandler.OnMouseUp(f)
},
dragstart: function(d, f) {
if (false === d.IsLeftMouseBtn(f)) {
return
}
if (true === c()) {
this.onScreenHandler.OnDragStart(f)
}
},
dragend: function(d, f) {
if (false === d.IsLeftMouseBtn(f)) {
return
}
this.onScreenHandler.OnDragEnd(f)
},
drag: function(d, f) {
if (false === d.IsLeftMouseBtn(f)) {
return
}
this.onScreenHandler.OnDrag(f)
},
scope: this
}
});
this.dragTracker.initEl(this.el);
this.mon(this.el, "mousemove", function(d) {
if ((false === this.blHideOsdBbar) && (true === a()) && (false === this.IsDragging())) {
this.panelOSD.show()
}
if (true === c()) {
this.onScreenHandler.OnMouseMove(d)
}
}, this);
this.mon(this.el, "mouseleave", function(d) {
if (true === SYNO.SS.Utils.IsPosInBoxComponent(this.getBox(), d.xy[0], d.xy[1])) {
return
}
if ((true === a()) && (false === this.IsDragging())) {
this.panelOSD.hide()
}
if (true === c()) {
this.onScreenHandler.OnMouseLeave(d)
}
}, this);
this.mon(this.el, b, function(d) {
if (true === c()) {
this.onScreenHandler.OnMouseWheel(d)
}
}, this);
this.mon(this.el, "contextmenu", function(d) {
if (true === a()) {
this.panelOSD.DelayHidePanel()
}
if (false !== this.blToogleResumePause) {
this.ToogleResumePause()
}
}, this)
},
IsNormalOsdSize: function(b, a) {
b = b || this.ctWidth;
a = a || this.ctHeight;
return ((this.OSD_BTN_NORMAL_SIZE_MIN_W <= b) && (this.OSD_BTN_NORMAL_SIZE_MIN_H <= a))
},
GetThumbCls: function(a) {
if ("loading-spinner" === a) {
return a
}
return a + this.GetThumbClsPostfix(Math.min(this.ctWidth, this.ctHeight))
},
GetThumbClsPostfix: function(a) {
if (a <= 48) {
return "_none"
} else {
if (a <= 64) {
return "_s"
} else {
if (a <= 200) {
return "_m"
} else {
if (a <= 400) {
return "_l"
} else {
if (a <= 800) {
return "_xl"
} else {
if (a <= 1200) {
return "_xxl"
} else {
return "_max"
}
}
}
}
}
}
},
IsTipSizeChange: function(d, a, b, f) {
var c = Math.min(d, a);
var e = Math.min(b, f);
return (this.GetThumbClsPostfix(c) !== this.GetThumbClsPostfix(e))
},
IsNormalTipSize: function(b, a) {
b = b || this.ctWidth;
a = a || this.ctHeight;
return ((this.TIP_IMG_NORMAL_SIZE_MIN_W <= b) && (this.TIP_IMG_NORMAL_SIZE_MIN_H <= a))
},
OnScaleChanged: function() {
this.fireEvent("scalechanged")
},
ConnectPluginEvt: function(a) {
a.addEventListener("fisheyePolygonUpdate", function(b) {
this.fisheyePolygon = b.detail;
this.fireEvent("fisheyePolygonUpdate")
}.createDelegate(this));
a.addEventListener("fisheyeRegionInfoUpdate", function(b) {
this.fisheyeRegionInfo = b.detail;
this.fireEvent("fisheyeRegionInfoUpdate")
}.createDelegate(this));
a.addEventListener("updateAnalyticsAlert", function(b) {
if (true === this.blAnalyticsEdit) {
if (true === Ext.isDefined(this.owner.SetAlertIconFlash)) {
this.owner.SetAlertIconFlash(b.detail.blAlert, false)
}
} else {
this.owner.fireEvent("triggerAnalyticsAlert", this.owner.mediaInfo.ownerDsId, this.owner.mediaInfo.camIdOnRecServer, b.detail.blAlert)
}
}.createDelegate(this));
a.addEventListener("frameSizeCount", function(b) {
if ((false === Ext.isEmpty(b.detail)) && (false === Ext.isEmpty(b.detail.frameSize)) && (false === Ext.isEmpty(b.detail.frameCount))) {
this.owner.UpdatePluginFrameSizeCount(parseInt(b.detail.frameSize, 10), parseInt(b.detail.frameCount, 10))
}
}.createDelegate(this))
},
InitVideoInst: function(b) {
var a;
if (this.videoInst) {
return true
}
if ((true !== b.blTimeoutPlayer) && ((false === this.CheckHtml5SupportCodec(b.videoType, b.resolution, b.dsId)) || (false === this.CheckFisheyeSupport()))) {
return false
}
this.videoInst = this.CreatePlayer(b);
if (true === this.IsWebSocketNotConnectYet()) {
this.ShowWsDirectConnFailedTip();
return false
}
a = this.videoInst.GetNode();
this.blDoFireInited = true;
this.InitVideoDom(a, function() {
this.UpdateFloatingCmp(b)
}.bind(this));
this.el.insertFirst(a);
return true
},
InitVideoDom: function(d, c, g) {
var b = ("VIDEO" === d.nodeName);
var h = ("EMBED" === d.nodeName);
var e;
var a;
var f = (true === b) ? "canplay" : "load";
d.fnVideoInitialized = function() {
d.removeEventListener(f, d.fnVideoInitialized);
if (g) {
g()
}
if (true === b) {
this.videoRatio = d.videoWidth / d.videoHeight
} else {
if (true === h) {
e = d.getAttribute("videoWidth");
a = d.getAttribute("videoHeight");
if ((false === Ext.isEmpty(e)) && (false === Ext.isEmpty(a))) {
this.videoRatio = parseInt(e, 10) / parseInt(a, 10)
}
} else {
this.videoRatio = d.naturalWidth / d.naturalHeight
}
}
this.HidePlayerTip();
this.Resize(this.ctWidth, this.ctHeight);
d.style.visibility = "inherit";
if (c) {
c()
}
if (true === this.blDoFireInited) {
this.fireEvent("videoinited");
this.blDoFireInited = false
}
}.createDelegate(this);
d.style.visibility = "hidden";
d.addEventListener(f, d.fnVideoInitialized);
if (true === SYNO.SS.Utils.IsSsc()) {
d.addEventListener("videoDecoderNameChanged", function() {
var i = ((true === Ext.isFunction(d.videoDecoderName))) && (true === SYNO.SS.Ssc.IsHwDecoder(d.videoDecoderName()));
this.fireEvent("checkGpuResource", i)
}.createDelegate(this));
if (true === h) {
this.ConnectPluginEvt(d)
}
}
},
SetDewarpVideoPanel: function(a) {
if ((false === SYNO.SS.Utils.IsSsc()) || (this.isDestroyed) || (a === this.dewarpVideoPanel)) {
return
}
if (this.dewarpVideoPanel) {
this.mun(this.dewarpVideoPanel, "fisheyePolygonUpdate", this.UpdateFisheyePolygon.createDelegate(this));
this.onScreenHandler.SetHandler(this.onScreenHandler.TYPE_PLUGIN, false)
}
this.fisheyePanel.SetData(null);
this.dewarpVideoPanel = a;
if (this.dewarpVideoPanel) {
this.mon(this.dewarpVideoPanel, "fisheyePolygonUpdate", this.UpdateFisheyePolygon.createDelegate(this));
this.onScreenHandler.SetHandler(this.onScreenHandler.TYPE_PLUGIN, true)
}
},
UpdateFisheyePolygon: function() {
if (!this.dewarpVideoPanel) {
return
}
this.fisheyePanel.SetData(this.dewarpVideoPanel.fisheyePolygon)
},
UpdateFisheyeInfo: function(b) {
var a = this.videoInst.GetNode();
if ((a) && (true == Ext.isDefined(a.postMessage))) {
a.postMessage({
method: "SetFisheyeRegion",
fisheyeRegionInfo: JSON.stringify(b)
})
}
},
SetJoystickIconVisible: function(a) {
var b = !this.cmpJoystickIcon.hidden;
if (b !== a) {
this.cmpJoystickIcon.setVisible(a)
}
},
ReleaseVideoInst: function() {
this.videoInst.Deactivate();
this.videoInst = null
},
RemoveVideoInst: function(b, c) {
var a;
this.StopVideoReplace();
if (this.videoInst) {
a = this.videoInst.GetNode();
if (a) {
a.remove()
}
this.ReleaseVideoInst();
this.fireEvent("videoremoved")
}
this.videoRatio = 0;
this.panelOSD.hide();
this.UpdateVideoLabel(false);
if (true !== b) {
this.HidePlayerTip()
}
if (true !== c) {
this.waterMark.hide();
this.privacyMask.SetVisible(false);
this.Resize(this.ctWidth, this.ctHeight)
}
},
ResetAction: function(a) {
a = a || {};
if (true !== a.blKeepDragZoom) {
this.onScreenHandler.ResetDragZoom()
}
if (true !== a.blKeepSnapshot) {
this.panelSnapshot.CloseSnapshot()
}
},
ShowLastFrame: function() {
if (this.videoInst) {
this.lastFrame.show();
this.videoInst.DrawSnapshot(this.lastFrame.GetCanvas())
}
},
CreatePlayer: function(a) {
return SYNO.SS.App.WebPlayer.CreatePlayer(this.PatchConfig(a))
},
PatchConfig: function(a) {
a.blMute = this.IsMute();
a.fnIsManualPaused = this.IsManualPaused.bind(this);
a.param.pause = this.IsManualPaused();
return a
},
ReplaceVideoInst: function(a, b) {
this.StopVideoReplace();
this.fireEvent("videoPreReplace", this.videoInst);
if ((false === this.CheckHtml5SupportCodec(a.videoType, a.resolution, a.dsId)) || (false === this.CheckFisheyeSupport())) {
return false
}
if (true === this.IsWebSocketNotConnectYet()) {
this.ShowWsDirectConnFailedTip();
return false
}
this.newVideoInst = this.CreatePlayer(a);
if (this.owner.CheckGpuResource) {
this.owner.CheckGpuResource(false)
}
this.RemoveDelegatedFunc(this.videoInst);
this.InitVideoDom(this.newVideoInst.GetNode(), function() {
this.DoReplaceVideoInst(b);
this.UpdateFloatingCmp(a)
}.createDelegate(this));
if ((false === Ext.isEmpty(a.Plugin)) && (this.el)) {
var c = (this.videoInst) ? this.videoInst.GetNode() : null;
if (c) {
this.InsertAfter(this.el.dom, this.newVideoInst.GetNode(), c)
} else {
this.el.insertFirst(this.newVideoInst.GetNode())
}
}
return true
},
DoReplaceVideoInst: function(a) {
var b;
if (!this.videoInst) {
this.StopVideoReplace();
return
}
b = this.videoInst.GetNode();
if (true !== a) {
this.newVideoInst.SetState(this.videoInst.GetState())
}
this.videoInst.Deactivate();
this.videoInst = this.newVideoInst;
this.newVideoInst = null;
if ((this.videoInst.GetNode()) && (false === this.el.contains(this.videoInst.GetNode()))) {
if (b) {
this.InsertAfter(this.el.dom, this.videoInst.GetNode(), b)
} else {
this.el.insertFirst(this.videoInst.GetNode())
}
}
this.onScreenHandler.ApplyDragZoom();
this.DoImageEnhancement();
this.fireEvent("videoReplaced");
if (b) {
this.RegDomRemove(b)
}
},
UpdateFloatingCmp: function(a) {
this.fireEvent("updatevideolabel", {
blShow: this.blShowVideoLabel,
reso: a.resolution,
videoType: a.videoType
});
if (false === Ext.isEmpty(a.Plugin)) {
this.onScreenHandler.SetHandler(this.onScreenHandler.TYPE_PLUGIN, true)
}
this.lastFrame.hide();
this.waterMark.show();
this.SetPrivacyMaskVisible(this.blShowPrivMaskUI, this.blEnablePrivMask)
},
RegDomRemove: function(a) {
this.FlushDomRemove();
this.domRemoveTask = {
timeOutId: null,
exec: function() {
this.domRemoveTask = null;
a.parentNode.removeChild(a)
}.bind(this)
};
this.domRemoveTask.timeOutId = setTimeout(this.domRemoveTask.exec, 3000)
},
FlushDomRemove: function() {
if (this.domRemoveTask) {
clearTimeout(this.domRemoveTask.timeOutId);
this.domRemoveTask.exec()
}
},
InsertAfter: function(c, b, a) {
c.insertBefore(b, a.nextSibling)
},
StopVideoReplace: function() {
if (this.newVideoInst) {
var a = this.newVideoInst.GetNode();
if (("EMBED" === a.tagName) && (a.parentNode)) {
a.parentNode.removeChild(a)
}
this.newVideoInst.Deactivate();
this.newVideoInst = null
}
this.FlushDomRemove()
},
ShowPlayerTip: function(a) {
var b;
if (false === this.rendered) {
return
}
this.lastFrame.hide();
this.HidePlayerTip();
this.tipInfo = a || {};
b = document.createElement("div");
if (this.tipInfo.img) {
if (this.tipInfo.tip) {
b.setAttribute("ext:qtip", this.tipInfo.tip)
}
b.classList.add(this.WEBPLAYER_IMG_CLS);
b.classList.add(this.GetThumbCls(this.tipInfo.img))
} else {
b.innerHTML = String.format('<div style="white-space: pre-wrap;" ext:qtip="{0}">{0}</div>', this.tipInfo.tip);
b.classList.add(this.WEBPLAYER_TIP_CLS)
}
this.AppendDom(b)
},
SetVideoLabelPos: function(a) {
var b = {
left: (a) ? "unset" : "4px",
right: (a) ? "4px" : "unset"
};
this.fireEvent("updatevideolabel", {
style: b
})
},
AppendDom: function(a) {
this.el.appendChild(a)
},
HidePlayerTip: function() {
var a = String.format(".{0},.{1}", this.WEBPLAYER_TIP_CLS, this.WEBPLAYER_IMG_CLS);
var b = ((this.el) && (this.el.dom)) ? this.el.dom.querySelector(a) : null;
if (b) {
this.el.dom.removeChild(b)
}
this.tipInfo = {}
},
SetShowVideoLabel: function(a) {
this.blShowVideoLabel = a;
if (true === SYNO.SS.Utils.CheckNested(this.owner, "mediaInfo", "blShowVideoLabel")) {
this.owner.mediaInfo.blShowVideoLabel = a
}
this.UpdateVideoLabel(a)
},
UpdateVideoLabel: function(a) {
this.fireEvent("updatevideolabel", {
blShow: a
});
this.panelOSD.SetBtnInfo(SYNO.SS.App.WebPlayer.OsdPanelUtils.Button.BTN_VIDEOINFO, true, a)
},
SetFixAspect: function(a) {
this.blFixAspectRatio = a;
if (true === SYNO.SS.Utils.CheckNested(this.owner, "mediaInfo", "blFixAspectRatio")) {
this.owner.mediaInfo.blFixAspectRatio = a
}
this.lastFrame.SetCanvasFit(this.blFixAspectRatio);
this.Resize(this.ctWidth, this.ctHeight)
},
Resize: function(e, b) {
var d, a = 0,
f = 0;
var c = this.IsTipSizeChange(e, b, this.ctWidth, this.ctHeight);
this.ctWidth = e;
this.ctHeight = b;
if (true === this.isDestroyed) {
return
}
if ((true === this.blFixAspectRatio) && (true === this.IsVideoPlayerExist()) && (0 < this.videoRatio)) {
d = this.GetFixAspectRatioSize(e, b);
a = (e - d.width) / 2;
f = (b - d.height) / 2;
e = d.width;
b = d.height
}
this.setSize(e, b);
this.setPosition(a, f);
if ((this.tipInfo.img) && (true === c)) {
this.ShowPlayerTip(this.tipInfo)
}
this.waterMark.InitCanvas(e, b);
this.fisheyePanel.SetSize(e, b);
this.privacyMask.SetSize(e, b)
},
GetFixAspectRatioSize: function(c, a) {
var d = c / a;
var b = {};
if (this.videoRatio > d) {
b.width = c;
b.height = Math.round(c / this.videoRatio)
} else {
b.width = Math.round(a * this.videoRatio);
b.height = a
}
return b
},
SetFocus: function(a) {
if (this.blFocused === a) {
return
}
this.blFocused = a;
this.VideoInstAct("SetMute", this.IsMute())
},
SetSuspendMouseEvent: function(a) {
if (this.blSuspendMouseEvent === a) {
return
}
this.blSuspendMouseEvent = a;
this.panelOSD.CheckResetZoomVisible();
if (true === this.blSuspendMouseEvent) {
this.panelOSD.hide()
}
},
SetMute: function(a) {
this.blMute = a;
this.VideoInstAct("SetMute", this.IsMute());
if (this.fnUpdateAudioInfo) {
this.fnUpdateAudioInfo(a)
}
},
SetVolume: function(a) {
this.VideoInstAct("SetVolume", a / MAX_VOLUME_LEVEL);
if (this.fnUpdateAudioInfo) {
this.fnUpdateAudioInfo(null, a)
}
},
UpdateAudioToolTip: function(a) {
this.panelOSD.UpdateAudioToolTip(a)
},
VideoInstAct: function(a) {
var c = Array.prototype.slice.call(arguments, 1);
var b;
if (this.videoInst) {
b = this.DonVideoInstAct(this.videoInst, a, c)
}
if (this.newVideoInst) {
b = this.DonVideoInstAct(this.newVideoInst, a, c)
}
return b
},
DonVideoInstAct: function(c, a, b) {
return c[a].apply(c, b)
},
IsMute: function() {
return ((false === this.blFocused) || (true === this.blMute))
},
IsManualPaused: function() {
return this.blManualPaused
},
GetCurStreamTm: function() {
var a = (this.newVideoInst) ? this.newVideoInst : this.videoInst;
return (a) ? a.GetCurStreamTm() : 0
},
IsFrameReady: function() {
var a = (this.newVideoInst) ? this.newVideoInst : this.videoInst;
return (a) ? a.blFrameReady : false
},
RemoveDelegatedFunc: function(a) {
if (a) {
a.fnUpdateStreamTm = null;
a.fnOnStreamEnded = null
}
},
IsDragging: function() {
return ((true === this.onScreenHandler.blDragging) || (true === this.panelOSD.blVolumeDragging))
},
RestorePausedPlayer: function() {
if ((this.videoInst) && (false === this.IsManualPaused())) {
this.VideoInstAct("Resume")
}
},
Pause: function() {
this.blManualPaused = true;
if ((this.videoInst) && (this.cmpPauseIcon)) {
this.cmpPauseIcon.setVisible(true)
}
if ((false === this.blHideOsdBbar) && (true === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsSupForceShowOsdOnPause(this.viewType))) {
this.panelOSD.ForceShow(true)
}
this.VideoInstAct("Pause");
this.panelOSD.SetPauseStatus(true);
this.fireEvent("pause", this)
},
Resume: function() {
this.blManualPaused = false;
if (this.cmpPauseIcon) {
this.cmpPauseIcon.setVisible(false)
}
if ((false === this.blHideOsdBbar) && (true === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsSupForceShowOsdOnPause(this.viewType))) {
this.panelOSD.ForceShow(false)
}
this.VideoInstAct("Resume");
this.panelOSD.SetPauseStatus(false);
this.fireEvent("resume", this)
},
ToogleResumePause: function(a) {
a = (true === Ext.isDefined(a)) ? a : (!this.blManualPaused);
if (a === this.blManualPaused) {
return
}
if (true === a) {
this.Pause()
} else {
this.Resume()
}
},
SetPrivacyMaskVisible: function(a, b) {
if (null !== a) {
this.blShowPrivMaskUI = a
}
if (null !== b) {
this.blEnablePrivMask = b
}
if (this.videoInst) {
this.privacyMask.SetVisible(this.blShowPrivMaskUI && this.blEnablePrivMask && this.IsWebSocketStatusNormal())
}
},
PrivacyMaskAddRegion: function() {
this.privacyMask.AddRegion()
},
PrivacyMaskDelRegion: function() {
this.privacyMask.DelRegion()
},
GetPrivacyMaskRegionNum: function() {
return this.privacyMask.GetRegionNum()
},
GetPrivacyMaskMaxRegionNum: function() {
return this.privacyMask.GetMaxRegionNum()
},
GetPrivacyMaskMinRegionNum: function() {
return this.privacyMask.GetMinRegionNum()
},
GetPrivacyMaskRegion: function() {
return this.privacyMask.GetFormData()
},
SetPrivacyMaskRegion: function(a) {
this.privacyMask.SetRegion(a)
},
DoImageEnhancement: function(c) {
var a = (this.videoInst) ? this.videoInst.GetNode() : null;
var b = "";
this.imageEnhancement = c || this.imageEnhancement;
if ((!this.imageEnhancement) || (!a)) {
return
}
if (0 !== this.imageEnhancement.brightness) {
b += "brightness(" + (100 + this.imageEnhancement.brightness * 9) + "%)"
}
if (0 !== this.imageEnhancement.contrast) {
b += "contrast(" + (100 + this.imageEnhancement.contrast * 15) + "%)"
}
if (0 !== this.imageEnhancement.saturation) {
b += "saturate(" + (100 + this.imageEnhancement.saturation * 20) + "%)"
}
if (0 > this.imageEnhancement.sharpness) {
b += "blur(" + Math.max(0, this.imageEnhancement.sharpness * -0.2) + "px)"
}
if (0 < this.imageEnhancement.sharpness) {
this.CreateSharpnessFilter();
b += "url(#sharpness_" + this.imageEnhancement.sharpness + ")"
}
a.style.filter = b
},
CreateSharpnessFilter: function() {
var c, d, b;
var a = "sharpnesssvg";
var e = "http://www.w3.org/2000/svg";
if (document.getElementById(a)) {
return
}
b = function(l) {
var h = document.createElementNS(e, "filter");
var j = document.createElementNS(e, "feConvolveMatrix");
var g = [],
k = l / 5,
f;
for (f = 0; f < 9; f++) {
g[f] = -k
}
g[4] = 1 + k * 8;
j.setAttribute("order", "3 3");
j.setAttribute("preserveAlpha", "true");
j.setAttribute("kernelMatrix", g.join(" "));
h.id = "sharpness_" + l;
h.appendChild(j);
return h
};
c = document.createElementNS(e, "svg");
c.id = a;
c.setAttribute("xmlns", e);
c.setAttribute("version", "1.1");
c.style.visibility = "hidden";
for (d = 1; d <= 5; d++) {
c.appendChild(b(d))
}
document.body.appendChild(c)
},
SetCursorVisibility: function(a) {
if (true === a) {
this.onScreenHandler.SetCursorStyle(SYNO.SS.Plugin.CursorType.ARROW)
} else {
this.onScreenHandler.SetCursorStyle(SYNO.SS.Plugin.CursorType.BLANK)
}
},
CheckHtml5SupportCodec: function(c, b, a) {
if (true === SYNO.SS.App.WebPlayer.Utils.IsHtml5SupportCodec(c, b, a)) {
return true
}
this.RemoveVideoInst();
this.fireEvent("videoUnsupported");
this.ShowUnsupportCodecTip(a);
return false
},
CheckFisheyeSupport: function() {
if (false === SYNO.SS.Ssc.IsFisheyeUnsupported(this.regionId)) {
return true
}
this.RemoveVideoInst();
this.fireEvent("videoUnsupported");
this.ShowFisheyeTip();
return false
},
ShowFisheyeTip: function() {
var a = (true === SYNO.SS.Utils.IsSynoChromium()) ? _T("ss_common", "unsupported_function_sld") : _T("camera", "unsupport_fisyeye_html5");
this.ShowPlayerTip({
img: "notsupport_empty_thumb",
tip: a
})
},
ShowUnsupportCodecTip: function(a) {
if (true === SYNO.SS.Utils.IsSsc()) {
this.ShowPlayerTip({
tip: _T("ame_plus", "no_hevc_tip") + " " + SYNO.SS.Utils.GetAMETip(a)
})
} else {
if ((true === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsLiveViewIncludeCam(this.viewType)) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.TIMELINE === this.viewType)) {
this.ShowPlayerTip({
tip: String.format(_T("camera", "client_supported_video_format_link"), "<a href='http://sy.to/pkgdownload' style='text-decoration:underline;' target='_blank'>", "</a>")
})
} else {
this.ShowPlayerTip({
tip: _T("camera", "unsupport_video_format_html5")
})
}
}
},
SetPlayerBackground: function(a, b) {
var c = String.format(".{0}", this.WEBPLAYER_BKG_CLS);
var d = ((this.el) && (this.el.dom)) ? this.el.dom.querySelector(c) : null;
if (true === a) {
if (d) {
d.classList = ""
} else {
d = document.createElement("div");
this.el.appendChild(d)
}
if (b) {
d.classList.add(this.WEBPLAYER_BKG_CLS);
d.classList.add(b)
}
d.style.display = ""
} else {
if (d) {
d.style.display = "none"
}
}
},
ShowWsDirectConnFailedTip: function() {
this.ShowPlayerTip({
img: "disconnected_thumb",
tip: _T("event", "websocket_https_direct_connect_fail")
})
},
ShowWsConnFailedTip: function() {
this.ShowPlayerTip({
img: "disconnected_thumb",
tip: _T("event", "event_websocket_failed")
})
},
ShowWsConnFailedMoreInfoTip: function() {
this.ShowPlayerTip({
tip: String.format(_T("event", "event_websocket_failed_more_info"), "<a href='http://sy.to/webscokectconntectionfailed' style='text-decoration:underline;' target='_blank'>", "</a>")
})
},
ShowLoading: function() {
this.ShowPlayerTip({
img: "loading-spinner"
})
}
});
Ext.define("SYNO.SS.App.WebPlayer.Html5PlayerPanel", {
extend: "Ext.Container",
UPD_BANDWIDTH_TASK: "UPDATE_BANDWIDTH_TASK",
UPD_FPS_TASK: "UPDATE_FPS_TASK",
SWITCH_DEFAULT_TASK: "SWITCH_TO_DEFAULT_TASK",
UPD_BANDWIDTH_SEC: 3,
ctWidth: 0,
ctHeight: 0,
extraCfg: null,
camIdOnHost: null,
blSupportAudio: true,
mediaInfo: null,
panelBanner: null,
panelVideo: null,
panelEventDetect: null,
panelEventDetectBorder: null,
doorId: null,
posId: null,
dsId: LOCAL_DS_ID,
camStatus: 0,
stsFlags: 0,
origResolution: null,
viewType: 0,
acapHandler: null,
blAlertIconVisible: false,
patrolData: null,
curProfile: -1,
realProfile: -1,
frameSize: 0,
frameCount: 0,
blAdvLiveProfile: false,
blStreamSrcByHomeMode: false,
blSingleCh: false,
regionId: 0,
regionName: "",
cmdStamp: 0,
videoLabel: null,
labelContainer: null,
blHwDecode: false,
origAnalyticSetting: null,
origEnableAnalytics: false,
constructor: function(a) {
this.ctWidth = a.width;
this.ctHeight = a.height;
this.extraCfg = a.extraCfg || {};
this.camIdOnHost = a.camIdOnHost;
this.regionId = a.regionId;
this.regionName = a.regionName;
this.Init(a);
Ext.applyIf(a, {
blSupportAudio: (false !== a.blSupportAudio),
cls: SYNO.SS.Utils.GetVdoBgCls() + " player-panel-ct",
items: [this.panelBanner, {
xtype: "container",
cls: "video-container-ct",
items: [this.panelVideo, this.labelContainer]
}],
listeners: {
resize: function(c, d, b) {
this.ctWidth = d || this.getWidth();
this.ctHeight = b || this.getHeight();
if (true === this.panelVideo.rendered) {
this.panelVideo.Resize(this.ctWidth, this.ctHeight - this.panelBanner.GetHeight())
}
this.TriggerChangeProfile()
},
afterrender: this.RenderVideo,
scope: this
}
});
this.callParent([a]);
this.InitEventHandler();
this.InitTask();
this.mon(this, "beforedestroy", function() {
this.panelVideo = null;
if (!this.panelEventDetect.ownerCt) {
this.panelEventDetect.destroy()
}
if (!this.panelEventDetectBorder.ownerCt) {
this.panelEventDetectBorder.destroy()
}
this.panelEventDetectBorder = null;
this.acapHandler.owner = null;
this.acapHandler = null;
this.panelBanner = null
})
},
Init: function(a) {
this.viewType = a.viewType;
this.blSingleCh = a.blSingleCh || false;
this.blStreamSrcByHomeMode = this.IsStmSetByHomeMode(this.GetCurCamIdOnHost());
this.SetAdvLiveFlag(false);
this.panelBanner = new SYNO.SS.App.WebPlayer.Banner({
viewType: a.viewType,
hidden: (false === a.blShowCamInfoLabel)
});
this.panelEventDetect = new Ext.Container({
style: "position: absolute; top: 0; width: 100%; height: 100%;",
html: '<canvas style="position: absolute; left: 0; top: 0px;"></canvas>',
listeners: {
beforedestroy: function() {
this.canvasResult = null
}
}
});
this.panelEventDetectBorder = new Ext.Container({
style: "position: absolute; top: 0; width: 100%; height: 100%;",
html: '<canvas style="position: absolute; left: 0; top: 0px;"></canvas>',
listeners: {
beforedestroy: function() {
this.canvasResult = null
}
}
});
this.InitPanelVideo({
viewType: a.viewType,
blSuspendMouseEvent: a.blSuspendMouseEvent,
width: a.width,
height: a.height - this.panelBanner.GetHeight(),
blFixAspectRatio: a.blFixAspectRatio,
blShowVideoLabel: a.blShowVideoLabel,
blHideOsdBbar: a.blHideOsdBbar,
blFocused: a.blFocused,
blShowPrivMaskUI: a.blShowPrivMaskUI,
blPTZ: a.blPTZ,
blEditPrivacyMask: a.blEditPrivacyMask,
privacyRegion: a.privacyRegion,
regionId: a.regionId,
blAnalyticsEdit: a.blAnalyticsEdit,
owner: this,
items: [this.panelEventDetect, this.panelEventDetectBorder],
listeners: {
resize: function(b, d, c) {
if (this.panelEventDetect) {
this.SetCanvasSize(this.panelEventDetect.canvasResult, d, c)
}
if (this.panelEventDetectBorder) {
this.SetCanvasSize(this.panelEventDetectBorder.canvasResult, d, c)
}
},
scope: this
}
});
this.acapHandler = new SYNO.SS.App.WebPlayer.AcapDetectHandler({
owner: this
});
if (true === SYNO.SS.Utils.CheckNested(a, "extraCfg", "doorId")) {
this.doorId = a.extraCfg.doorId
}
if (true === SYNO.SS.Utils.CheckNested(a, "extraCfg", "patrolData")) {
this.panelVideo.panelOSD.SetPatrolData(a.extraCfg.patrolData)
}
this.InitLabelContainer()
},
InitPanelVideo: function(a) {
this.panelVideo = new SYNO.SS.App.WebPlayer.VideoContainer(a)
},
InitLabelContainer: function() {
this.videoLabel = new SYNO.SS.App.WebPlayer.VideoLabel({
fnGetContainerSize: function() {
return {
width: this.ctWidth,
height: this.ctHeight - this.panelBanner.GetHeight()
}
}.createDelegate(this)
});
this.labelContainer = new Ext.Container({
cls: "label-container",
items: [this.videoLabel],
listeners: {
afterlayout: function() {
this.videoLabel.DoLayout()
},
scope: this
}
})
},
RemoveLabel: function(a, b) {
this.labelContainer.remove(a, b)
},
InitEventHandler: function() {
this.panelVideo.mon(this.panelVideo, "videoinited", this.OnVdoCtrInited, this);
this.panelVideo.mon(this.panelVideo, "updatevideolabel", this.UpdateVideoLabel, this);
this.mon(SYNO.SS.GblStore.dsCamera, "storeupdate", this.OnCameraUpdate, this);
this.mon(SYNO.SS.GblStore.dsSlaveDS, "storeupdate", this.OnSlaveDSUpdate, this);
this.mon(SYNO.SDS.StatusNotifier, "updateVideoBgColor", function() {
SYNO.SS.Utils.ResetVdoInfoBarCls(this.panelBanner);
SYNO.SS.Utils.ResetVdoBgCls(this)
}, this);
this.mon(SYNO.SDS.StatusNotifier, "afterHomeModeUpdate", function(a) {
if (SYNO.SS.App.Camera.Def.Profile.DEFAULT !== this.curProfile) {
return
}
this.blStreamSrcByHomeMode = this.IsStmSetByHomeMode(this.GetCurCamIdOnHost());
this.TriggerChangeProfile()
}, this);
if ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW === this.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_IPSPEAKER === this.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_POS === this.viewType)) {
this.mon(SYNO.SDS.StatusNotifier, "recStatusChange", this.UpdateIndicatorByRecStatus, this)
}
if (true === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsSupVideoLabel(this.viewType)) {
this.mon(this, "frameReceive", this.OnReceiveFrame, this);
this.mon(this, "beforeDestroy", this.OnBeforeDestroy, this)
}
if (true === SYNO.SS.Utils.IsSsc()) {
this.panelVideo.mon(this.panelVideo, "checkGpuResource", this.CheckGpuResource, this)
}
},
CheckGpuResource: function(a) {
this.blHwDecode = a;
this.panelVideo.cmpHwIcon.setVisible(this.blHwDecode && SYNO.SS.Ssc.IsShowGpuIcon());
if (false === a) {
SYNO.SS.Ssc.UpdateGpuResource(this.id, 0)
}
},
InitTask: function() {
if (true === this.noBitrate) {
return
}
if (true === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsSupVideoLabel(this.viewType)) {
this.TaskUpdater(this.UpdateBandwidth.createDelegate(this), this.UPD_BANDWIDTH_TASK, this.UPD_BANDWIDTH_SEC * TRANS_MILLISECOND);
this.TaskUpdater(this.UpdateFps.createDelegate(this), this.UPD_FPS_TASK, this.UPD_BANDWIDTH_SEC * TRANS_MILLISECOND)
}
},
AppendLabel: function(a) {
this.labelContainer.add(a)
},
UpdateVideoLabel: function(a) {
this.videoLabel.ApplyInfo(a)
},
OnCameraUpdate: function(d, c) {
var a = -1;
var b = null;
if ((d) && (0 < d.cameras.length)) {
a = d.cameras.findExact("id", this.GetCurCamIdOnHost());
if (-1 !== a) {
b = d.cameras[a];
this.OnCamStatusChanged(b.camStatus);
this.CheckNeedReloadVideoAttributeChanged(this.camStatus);
this.CheckIndicator(b);
this.CheckOsdBtnStatus(b);
this.panelVideo.UpdatePrivacyMask(b)
}
} else {
if (c) {
a = c.findExact("id", this.GetCurCamIdOnHost());
if (-1 !== a) {
this.OnCamStatusChanged(SYNO.SS.CamSts.DELETED)
}
}
}
},
OnSlaveDSUpdate: function(c, b) {
var a;
if (LOCAL_DS_ID === this.dsId) {
return
}
if (true === SYNO.SS.Utils.IsSlaveDsOnline(this.dsId)) {
a = SYNO.SS.CamSts.NORMAL
} else {
a = SYNO.SS.CamSts.SERVER_DISCONN
}
this.OnCamStatusChanged(a)
},
OnVdoCtrInited: function() {
var a = this.panelVideo.getPosition(true)[0];
var d = this.panelVideo.getPosition(true)[1];
var b = this.panelVideo.getSize().width;
var c = this.panelVideo.getSize().height;
this.fireEvent("VdoCtrInited", a, d, b, c)
},
CheckIndicator: function(c) {
var d = this.panelBanner.ctLeft;
var a = this.panelBanner.ctRight;
var b;
if ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW !== this.viewType) && (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_IPSPEAKER !== this.viewType) && (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_POS !== this.viewType)) {
return
}
if ((true === c.deleted) || (false === SYNO.SS.Utils.IsCamOnlineSts(c.camStatus))) {
d.RemoveIndicator()
} else {
if (true === SYNO.SS.CamStsFlag.IsActivating(this.stsFlags)) {
this.UpdateIndicator("icon_info_camera_connecting.gif?v=10061", _T("ss_common", "common_connecting"), d)
} else {
if (REC_STORAGE_STATUS_REMOVED === c.camRecStorageStatus) {
this.UpdateIndicator("icon_info_storage_removed.png?v=10061", _T("camera", "cam_rec_storage_removed"), d)
} else {
this.UpdateIndicatorByRecStatus({
camId: (LOCAL_DS_ID === c.ownerDsId) ? c.id : c.camIdOnRecServer,
dsId: c.ownerDsId,
recMethod: c.recStatus
})
}
}
}
a.SetAudioIcon(SYNO.SS.App.Camera.Def.AudioType.NONE !== c.audioType)
},
UpdateIndicatorByRecStatus: function(c) {
var e = c.recMethod;
var b = SYNO.SS.GblStore.GetCamIdOnHost(c.dsId, c.camId);
var d = this.panelBanner.ctLeft;
var a;
if (this.GetCurCamIdOnHost() !== b) {
return
}
a = SYNO.SS.GblStore.dsCamera.getById(b);
if ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_IPSPEAKER === this.viewType) && ((false === SYNO.SS.App.IPSpeaker.Utils.IsSpeakerNormalStatus(this.speakerStatus)) || (false === SYNO.SS.Utils.IsCamOnlineSts(a.get("camStatus"))))) {
return
}
if (TYPE_RECORDING_NONE === e) {
if (REC_STORAGE_STATUS_REMOVED !== a.get("camRecStorageStatus")) {
this.UpdateIndicator("icon_info_camera_connect.png?v=10061", _T("camera", "conn_status_normal"), d)
}
} else {
switch (e) {
case TYPE_CONTINUOUS_RECORDING:
case TYPE_ADV_CONTINUOUS_RECORDING:
case TYPE_MOTION_RECORDING:
case TYPE_CUSTOM_1_RECORDING:
case TYPE_CUSTOM_2_RECORDING:
case TYPE_ACTION_RULE_RECORDING:
this.UpdateIndicator("icon_info_record.png?v=10061", _T("event", "event_status_recording"), d);
break;
case TYPE_MANUAL_RECORDING:
case TYPE_EXT_RECORDING:
this.UpdateIndicator("icon_info_mrecord.png?v=10061", _T("camera", "camera_manual_recording"), d);
break;
default:
break
}
}
},
OnCamStatusChanged: function(b) {
var c = SYNO.SS.GblStore.dsCamera.getById(this.GetCurCamIdOnHost());
var a;
if ((!c) || (true === c.get("deleted"))) {
b = SYNO.SS.CamSts.DELETED;
a = SYNO.SS.CamStsFlag.NONE
} else {
a = c.get("status_flags")
}
if ((b === this.camStatus) && (a === this.stsFlags)) {
return
}
this.camStatus = b;
this.stsFlags = a;
if ((true === SYNO.SS.Utils.IsCamOnlineSts(b)) && (false === SYNO.SS.CamStsFlag.IsTransientSts(a))) {
this.RenderVideo()
} else {
this.RemoveVideo();
this.ShowUnavailCamTip()
}
this.UpdateLiveviewStmInfo()
},
CheckNeedReloadVideoAttributeChanged: function(a) {
var b = SYNO.SS.GblStore.dsCamera.getById(this.GetCurCamIdOnHost());
if (false === SYNO.SS.Utils.IsCamOnlineSts(a)) {
return
}
if (((true === SYNO.SS.App.Camera.Utils.IsDeviceLiveCam(b.get("deviceType"))) && (this.origResolution !== b.get("resolution"))) || (true == this.CheckLiveviewAnalyticsChange(b))) {
this.ReplaceVideoInst();
this.origResolution = b.get("resolution");
this.origAnalyticSetting = this.GetAnalyticSetting(b);
this.origEnableAnalytics = SYNO.SS.Ssc.IsAnalyticsPluginPlayer(b, this.blAnalyticsEdit, this.blVideoViewer)
}
},
CheckLiveviewAnalyticsChange: function(b) {
if ((false === SYNO.SS.Utils.IsSsc()) || (this.blAnalyticsEdit)) {
return false
}
var a = SYNO.SS.Ssc.IsAnalyticsPluginPlayer(b, this.blAnalyticsEdit, this.blVideoViewer);
if (a !== this.origEnableAnalytics) {
return true
}
if (true === a) {
return (JSON.stringify(this.origAnalyticSetting) !== JSON.stringify(this.GetAnalyticSetting(b)))
}
return false
},
RemoveVideo: function() {
this.panelVideo.RemoveVideoInst();
this.panelVideo.onScreenHandler.ResetDragZoom();
this.panelVideo.panelSnapshot.CloseSnapshot();
this.SetAlertIconVisible(false);
this.SetPauseIconVisible(false);
this.panelVideo.panelOSD.SetPauseStatus(false)
},
CheckOsdBtnStatus: function(b) {
var a;
var f = b.recStatus;
var d = b.mute;
var c = b.volume;
var e = b.pairedSpeakerId;
if (!this.mediaInfo) {
return
}
if (this.mediaInfo.recStatus !== f) {
this.mediaInfo.recStatus = f;
this.panelVideo.panelOSD.SetManualRecStatus(f)
}
if (this.mediaInfo.mute !== d) {
this.mediaInfo.mute = d;
this.panelVideo.panelOSD.SetMute(d)
}
if (this.mediaInfo.volume !== c) {
this.mediaInfo.volume = c;
this.panelVideo.panelOSD.OnVolumeChange(c)
}
if (this.mediaInfo.pairedSpeakerId !== e) {
this.mediaInfo.pairedSpeakerId = e;
this.panelVideo.panelOSD.SetAudioOutVisible((true === b.pairedSpeakerEnabled) && (0 < e))
}
},
ShowUnavailCamTip: function() {
if ((true === SYNO.SS.CamStsFlag.IsActivating(this.stsFlags)) || (SYNO.SS.CamSts.SETTING === this.camStatus)) {
this.panelVideo.ShowPlayerTip({
img: "live_connecting_thumb",
tip: _T("camera", "conn_status_setting")
})
} else {
if (SYNO.SS.CamSts.DELETED === this.camStatus) {
this.panelVideo.ShowPlayerTip({
tip: _T("camera", "camera_deleted")
})
} else {
if (true === SYNO.SS.Ssc.IsFisheyeUnsupported(this.regionId)) {
this.panelVideo.ShowFisheyeTip()
} else {
this.ShowCamStatusTip(this.camStatus)
}
}
}
},
ShowCamStatusTip: function(b) {
var a = null;
switch (b) {
case SYNO.SS.CamSts.DISCONNECTED:
case SYNO.SS.CamSts.HOST_FAILED:
case SYNO.SS.CamSts.UNAUTHORIZED:
case SYNO.SS.CamSts.RTSP_ERROR:
case SYNO.SS.CamSts.GET_NO_VIDEO:
case SYNO.SS.CamSts.DIFF_CAP:
a = {
img: "disconnected_thumb",
tip: _T("camera", "conn_status_failed")
};
break;
case SYNO.SS.CamSts.NO_CAP:
a = {
img: "disconnected_thumb",
tip: _T("camera", "load_capability")
};
break;
case SYNO.SS.CamSts.REC_STORAGE_REMOVED:
case SYNO.SS.CamSts.NORMAL:
break;
case SYNO.SS.CamSts.SERVER_DISCONN:
a = {
img: "disconnected_thumb",
tip: _T("camera", "conn_status_unknown")
};
break;
default:
a = {
img: "disable_thumb",
tip: _T("camera", "conn_status_disabled")
};
break
}
if (a) {
this.panelVideo.ShowPlayerTip(a)
}
},
RenderVideo: function() {
var b, a;
if (this.panelVideo.videoInst) {
return
}
a = this.PrepareCamRecord();
if (!a) {
this.ShowEmptyPlayer();
return
}
this.InitPlayerStsByRec(a);
if ((true === SYNO.SS.Ssc.IsFisheyeUnsupported(this.regionId)) || (false === SYNO.SS.Utils.IsCamOnlineSts(this.camStatus))) {
this.ShowUnavailCamTip();
return
}
b = this.CreateConfByCamRecord(a, this.curProfile);
this.panelVideo.InitVideoInst(b);
this.OnRenderVideoDone(a)
},
OnDeactivateTalking: function() {
if (true === Ext.isEmpty(this.panelVideo.panelOSD.panelAudioOut)) {
return
}
if (true === this.panelVideo.panelOSD.panelAudioOut.blTalking) {
this.OnTalkingChanged()
}
},
PrepareCamRecord: function() {
var a = this.extraCfg.recCamInfo;
var b = (a) ? SYNO.SS.GblStore.GetCamIdOnHost(a.dsId, a.camId) : this.GetCurCamIdOnHost();
return SYNO.SS.GblStore.dsCamera.getById(b)
},
ShowEmptyPlayer: function() {
this.panelVideo.ShowPlayerTip({
tip: this.GetEmptyPlayerTip()
})
},
GetEmptyPlayerTip: function() {
if (0 < this.mountId) {
return _T("video_viewer", "mount_live_view_tip")
} else {
if (0 < this.archId) {
return _T("video_viewer", "arch_live_view_tip")
} else {
if (false === this.blLivePriv) {
return _T("video_viewer", "no_priv_cam_live")
} else {
return _T("axis_access_controller", "no_paired_camera")
}
}
}
},
InitPlayerStsByRec: function(a) {
var b;
this.dsId = a.get("ownerDsId");
this.camStatus = a.get("camStatus");
this.origResolution = a.get("resolution");
this.origAnalyticSetting = this.GetAnalyticSetting(a);
this.origEnableAnalytics = SYNO.SS.Ssc.IsAnalyticsPluginPlayer(a, this.blAnalyticsEdit, this.blVideoViewer);
this.CheckIndicator(a.data);
if (true === this.NeedToChangeBannerTitle()) {
if (this.panelVideo.panelOSD.patrolData) {
this.panelBanner.SetTitle(this.panelVideo.panelOSD.patrolData.name, a.data)
} else {
b = a.get("name");
if (0 < this.regionId) {
b = b + " - " + this.regionName
}
this.panelBanner.SetTitle(b, a.data)
}
}
this.panelVideo.UpdateAudioToolTip(a.get("audioType"))
},
GetAnalyticSetting: function(a) {
return {
analyticsType: a.get("analyticsType"),
analyticsDwellTime: a.get("analyticsDwellTime"),
analyticsDirection: a.get("analyticsDirection"),
analyticsFrame: a.get("analyticsFrame"),
analyticsLine: a.get("analyticsLine"),
analyticsVirtualFence: a.get("analyticsVirtualFence"),
analyticsSens: a.get("analyticsSens"),
analyticsObjSize: a.get("analyticsObjSize"),
analyticsRegion: a.get("analyticsRegion")
}
},
NeedToChangeBannerTitle: function() {
return (!this.posId && !this.extraCfg.ivaTaskId && !this.speakerId && ((this.extraCfg.mode !== SYNO.SS.App.WebPlayer.Def.PreviewMode.IOModule) && (this.extraCfg.mode !== SYNO.SS.App.WebPlayer.Def.PreviewMode.IOModule_ALERT)))
},
GetDefaultProfile: function() {
return SYNO.SS.App.Camera.Def.Profile.DEFAULT
},
OnRenderVideoDone: function(a) {
if (this.panelEventDetect.el) {
this.panelEventDetect.canvasResult = this.panelEventDetect.el.dom.querySelector("canvas");
this.SetCanvasSize(this.panelEventDetect.canvasResult, this.panelVideo.ctWidth, this.panelVideo.ctHeight)
}
if (this.panelEventDetectBorder.el) {
this.panelEventDetectBorder.canvasResult = this.panelEventDetectBorder.el.dom.querySelector("canvas");
this.SetCanvasSize(this.panelEventDetectBorder.canvasResult, this.panelVideo.ctWidth, this.panelVideo.ctHeight)
}
this.curProfile = this.GetDefaultProfile();
this.PatchRealProfile(a);
this.panelVideo.panelSnapshot.camName = a.get("name");
SYNO.SDS.StatusNotifier.fireEvent("recStatusChange", {
camId: (LOCAL_DS_ID === a.get("ownerDsId")) ? a.get("id") : a.get("camIdOnRecServer"),
dsId: a.get("ownerDsId"),
recMethod: a.get("recStatus")
});
this.SetAlertIconVisible(this.blAlertIconVisible)
},
SetCanvasSize: function(b, c, a) {
if (b) {
b.width = c || 0;
b.height = a || 0
}
},
ReplaceVideoInst: function() {
var b, a;
a = SYNO.SS.GblStore.dsCamera.getById(this.GetCurCamIdOnHost());
if ((!a) || (false === SYNO.SS.Utils.IsCamOnlineSts(a.get("camStatus")))) {
return
}
b = this.CreateConfByCamRecord(a, this.curProfile);
this.panelVideo.ReplaceVideoInst(b)
},
OnTalkingChanged: function() {
if (true === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsLiveViewIncludeCam(this.viewType)) {
this.panelVideo.panelOSD.panelAudioOut.PreOnTalk()
}
},
OnDeactivatePlay: function(a, b) {
if (true === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsLiveViewIncludeCam(this.viewType)) {
var c = this.findAppWindow();
if ((c) && (c.OnDeactivatePlay)) {
c.OnDeactivatePlay(a, b);
return
}
}
a.call(b, true)
},
OnSwitchTalking: function(a) {
if (true === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsLiveViewIncludeCam(this.viewType)) {
var b = this.findAppWindow();
if ((b) && (b.OnSwitchTalking)) {
b.OnSwitchTalking(a);
if (true === a) {
this.panelVideo.panelOSD.show()
} else {
this.panelVideo.panelOSD.hide()
}
}
}
},
OnUpdateAudioOutVolume: function(a) {
if (true === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsLiveViewIncludeCam(this.viewType)) {
var b = this.findAppWindow();
if ((b) && (b.OnUpdateAudioOutVolume)) {
b.OnUpdateAudioOutVolume(a)
}
}
},
OnStmProfileChanged: function(a) {
this.ChangeStmProfile(a);
this.panelVideo.panelOSD.ChangeOsdIconByProfile(a);
if (true === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsStmChangeableLiveview(this.viewType)) {
var b = this.findAppWindow();
if ((b) && (b.OnSwitchStreamProfile)) {
b.OnSwitchStreamProfile(a, this.ownerCt.location)
}
}
},
TransProperStmProfile: function(a) {
return a
},
ChangeStmProfile: function(a) {
this.curProfile = this.TransProperStmProfile(a);
this.TriggerChangeProfile()
},
UpdateLiveviewStmInfo: function() {
var a = SYNO.SS.GblStore.dsCamera.getById(this.GetCurCamIdOnHost());
var b, d, c;
if (!a) {
return
}
if (false === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsStmChangeableLiveview(this.viewType)) {
return
}
if (true !== this.panelVideo.blFocused) {
return
}
if (SYNO.SS.App.Camera.Def.Profile.DEFAULT === this.realProfile) {
this.realProfile = this.GetRealProfile(this.curProfile, a)
}
d = this.findAppWindow();
if ((!d) || (!d.UpdateStreamInfo)) {
return
}
if (true === this.NeedToHideStreamInfo(a)) {
d.UpdateStreamInfo()
} else {
b = a.get("stm_info");
d.UpdateStreamInfo(b[this.realProfile].resolution, b[this.realProfile].fps, a.get("video_rotation"))
}
},
SwitchVideoInstByProfile: function(d) {
var c, f, e;
var a = SYNO.SS.GblStore.dsCamera.getById(this.GetCurCamIdOnHost());
var b = false;
if (!a) {
return
}
c = a.get("stm_info");
f = this.GetRealProfile(d, a);
if (SYNO.SS.App.Camera.Def.Profile.DEFAULT === this.realProfile) {
this.realProfile = this.GetRealProfile(this.curProfile, a)
}
if (c[this.realProfile].stmNo !== c[f].stmNo) {
e = this.CreateConfByCamRecord(a, d);
if (SYNO.SS.App.Camera.Def.Profile.DEFAULT !== d) {
e.param.profile = d
}
this.panelVideo.ShowLoading();
this.panelVideo.ReplaceVideoInst(e);
b = true
}
this.realProfile = f;
this.UpdateLiveviewStmInfo();
if (true === b) {
this.ReloadMediaInfo();
this.fireEvent("stream-profile-change")
}
},
GetRealProfile: function(c, a) {
var b = a.get("profileSettingList").split(",").map(function(d) {
return parseInt(d, 10)
});
return (SYNO.SS.App.Camera.Def.Profile.DEFAULT === c) ? b[SYNO.SS.App.Camera.Def.ProfileSetting.LIVE] : c
},
GetCurRealProfile: function() {
return this.realProfile
},
SwitchToDefaultProfile: function() {
this.SwitchVideoInstByProfile(this.curProfile)
},
DelaySwitchToDefault: function(a) {
this.runTask(this.SWITCH_DEFAULT_TASK, this.SwitchToDefaultProfile.createDelegate(this), a * TRANS_MILLISECOND)
},
CancelSwitchToDefault: function() {
this.removeDelayedTask(this.SWITCH_DEFAULT_TASK)
},
IsStmSetByHomeMode: function(a) {
var b;
if (false == _S("blHomeModeOn")) {
return false
}
if (false == _S("homeModeStreaming").blHomeModeStreaming) {
return false
}
b = SYNO.SS.GblStore.dsCamera.getById(a);
if ((!b) || (LOCAL_DS_ID !== b.get("ownerDsId"))) {
return false
}
if ("-1" === _S("homeModeStreaming").cameras) {
return true
}
return (0 <= _S("homeModeStreaming").cameras.split(",").indexOf(a.toString()))
},
IsStmNeedAdjustBySize: function() {
var a = this.PrepareCamRecord();
if ((!a) || (false === a.get("enableAdvLive")) || (false === a.get("advLiveTrigAuto"))) {
return false
}
return true
},
TriggerChangeProfile: function(b) {
var a = this.PrepareCamRecord();
if (!a) {
return
}
this.CancelSwitchToDefault();
if (SYNO.SS.App.Camera.Def.Profile.DEFAULT !== this.curProfile) {
this.SwitchVideoInstByProfile(this.curProfile)
} else {
if (true === this.blStreamSrcByHomeMode) {
this.SwitchVideoInstByProfile(_S("homeModeStreaming").homeModeStmLiveProfile)
} else {
if (true === this.IsStmNeedAdjustBySize()) {
this.SwitchVideoInstByProfile(this.GetProfileBySize(SYNO.SS.GblStore.dsCamera.getById(this.GetCurCamIdOnHost())))
} else {
if (true === this.blAdvLiveProfile) {
this.SwitchVideoInstByProfile(a.get("advLiveProfile"))
} else {
if (true === b) {
this.DelaySwitchToDefault(a.get("advLiveMinDuration"))
} else {
this.SwitchToDefaultProfile()
}
}
}
}
}
},
ReloadMediaInfo: function() {
var a;
if (!this.mediaInfo) {
return
}
if ((false !== this.blSupPtzHandler) && (this.panelVideo.onScreenHandler) && (this.mediaInfo.stm_info_ptzCaps)) {
a = this.GetCurRealProfile();
this.panelVideo.onScreenHandler.SetPtzInfo(this.mediaInfo.stm_info_ptzCaps[a])
}
if (true === Ext.isFunction(this.panelVideo.SetMediaInfo)) {
this.panelVideo.SetMediaInfo(this.mediaInfo)
} else {
this.panelVideo.panelOSD.ReloadOsdBtn(this.mediaInfo)
}
},
GetProfileBySize: function(b) {
var d = this;
var c;
var a = function(h) {
var e = b.get("stm_info");
var g = b.get("video_rotation");
var f = SYNO.SS.App.WebPlayer.Utils.Reso2Box(e[h].resolution, g);
return ((d.ctWidth < f.width) && ((d.ctHeight - d.panelBanner.GetHeight()) < f.height))
};
if (true === a(SYNO.SS.App.Camera.Def.Profile.LOW)) {
return SYNO.SS.App.Camera.Def.Profile.LOW
} else {
if (true === a(SYNO.SS.App.Camera.Def.Profile.MEDIUM)) {
return SYNO.SS.App.Camera.Def.Profile.MEDIUM
} else {
return SYNO.SS.App.Camera.Def.Profile.HIGH
}
}
},
SetAdvLiveFlag: function(b) {
var a = this.PrepareCamRecord();
if ((!a) || (false === a.get("enableAdvLive")) || (true === a.get("advLiveTrigAuto"))) {
this.blAdvLiveProfile = false
} else {
this.blAdvLiveProfile = ((true === b) || ((true === this.blSingleCh) && (true === a.get("advLiveTrigSingle"))))
}
},
OnPlayerExpanded: function(a) {
this.blSingleCh = a;
this.SetAdvLiveFlag(false);
this.TriggerChangeProfile()
},
OnPlayerEvtDetected: function(a) {
this.SetAdvLiveFlag(a);
this.TriggerChangeProfile(true)
},
GetLiveBufferingSec: function(a) {
if ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW === this.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.PREVIEW === this.viewType)) {
return (true === a.get("blEnableLiveBuffering")) ? a.get("liveBufferingSec") : 0
}
return 0
},
CreateConfByCamRecord: function(a, e) {
var c = SYNO.SS.App.WebPlayer.Utils.GetLiveReso(a, this.GetRealProfile(e, a));
var d = ((VT_H264 === a.get("type")) || (VT_H264_PLUS === a.get("type")) || (VT_H265 === a.get("type")) || (VT_H265_PLUS === a.get("type")));
var b = {
parent: this,
liveBufferingSec: this.GetLiveBufferingSec(a),
stmSrc: SYNO.SS.App.WebPlayer.Def.StreamSrc.LIVE,
videoType: a.get("camVideoType"),
resolution: c,
volume: parseInt(a.get("volume"), 10) / 100,
dsId: a.get("ownerDsId"),
id: a.get("id"),
idOnRec: a.get("camIdOnRecServer"),
param: {
method: "MixStream",
blMux: true,
blSkipLastI: d,
browser: SYNO.SS.App.WebPlayer.Utils.GetHtml5BroswerType(),
stmSrc: SYNO.SS.App.WebPlayer.Def.StreamSrc.LIVE,
blLiveSharing: true,
supportPrivacyMask: true,
blAudio: ((true === this.blSupportAudio) && (true === a.get("blAudioPriv")) && (SYNO.SS.App.Camera.Def.AudioType.NONE !== a.get("audioType")))
}
};
this.ModifyConfIfIsSsc(b, a);
b.fnOnStreamEnded = this.ShowErrorTip.createDelegate(this);
b.fnOnRetry = this.ShowErrorTip.createDelegate(this);
this.PatchStmProfileInConfig(b, a);
return b
},
ModifyConfIfIsSsc: function(b, a) {
if (true === SYNO.SS.Utils.IsSsc()) {
if (true === SYNO.SS.Ssc.IsPluginPlayer(a, this.regionId, this.blAnalyticsEdit, this.blVideoViewer)) {
SYNO.SS.Ssc.SetPluginConf(b, true, a, this.regionId, null, this.blAnalyticsEdit, this.blVideoViewer)
} else {
b.gpuRes = SYNO.SS.Ssc.GetLiveGpuResource(a.get("stm_info"))
}
}
},
ShowErrorTip: function(a) {
if (false === this.panelVideo.IsWebSocketConnectFailed()) {
return
}
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.PREVIEW === this.panelVideo.viewType) {
this.panelVideo.ShowWsConnFailedMoreInfoTip()
} else {
this.panelVideo.ShowWsConnFailedTip()
}
},
PatchStmProfileInConfig: function(b, a) {
if ((SYNO.SS.App.Camera.Def.Profile.DEFAULT !== this.curProfile) || (true === this.blStreamSrcByHomeMode)) {
if (SYNO.SS.App.Camera.Def.Profile.DEFAULT !== this.realProfile) {
b.param.profile = this.realProfile
}
} else {
if (true === this.IsStmNeedAdjustBySize()) {
b.param.profile = this.GetProfileBySize(a)
} else {
if (true === this.blAdvLiveProfile) {
b.param.profile = a.get("advLiveProfile")
} else {
if (LOCAL_DS_ID !== a.get("ownerDsId")) {
b.param.profile = this.GetRealProfile(this.curProfile, a)
}
}
}
}
},
PatchRealProfile: function(a) {
if (true === this.IsStmSetByHomeMode(this.GetCurCamIdOnHost())) {
this.realProfile = _S("homeModeStreaming").homeModeStmLiveProfile
} else {
if (true === this.IsStmNeedAdjustBySize()) {
this.realProfile = this.GetProfileBySize(a)
} else {
if (true === this.blAdvLiveProfile) {
this.realProfile = a.get("advLiveProfile")
}
}
}
},
CreateIPSpeakerConfig: function(a) {
return {
parent: this,
liveBufferingSec: this.GetLiveBufferingSec(a),
stmSrc: SYNO.SS.App.WebPlayer.Def.StreamSrc.LIVE,
volume: 0.5,
dsId: a.get("ownerDsId"),
id: a.get("id"),
idOnRec: a.get("idOnRecServer"),
param: {
method: "MixStream",
blMux: true,
browser: SYNO.SS.App.WebPlayer.Utils.GetHtml5BroswerType(),
stmSrc: SYNO.SS.App.WebPlayer.Def.StreamSrc.LIVE,
blAudio: ((true === this.blSupportAudio) && (SYNO.SS.App.Camera.Def.AudioType.NONE !== a.get("audioType"))),
devType: DEVICE_IPSPEAKER
}
}
},
GetCurCamIdOnHost: function() {
return this.camIdOnHost
},
SetCamIdOnHost: function(a) {
this.camIdOnHost = a
},
OnReceiveFrame: function(b, a) {
this.frameSize += b;
if (true === a) {
this.frameCount += 1
}
},
UpdatePluginFrameSizeCount: function(b, a) {
this.frameSize += b;
this.frameCount += a
},
TaskUpdater: function(b, a, c) {
b();
this.runInterval(a, b, c)
},
UpdateBandwidth: function() {
var b = Math.round(this.frameSize * 8 / 1000 / this.UPD_BANDWIDTH_SEC);
var a = b + " " + _T("ss_common", "bitrate_kb");
if ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.PREVIEW === this.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.PREVIEW_IPSPEAKER === this.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.POS_PREVIEW === this.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.PREVIEW_IPSPEAKER_GROUP === this.viewType)) {
this.panelBanner.SetRight(b)
}
if (true === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsSupVideoLabel(this.viewType)) {
this.UpdateVideoLabel({
bandWidth: a
})
}
this.frameSize = 0;
this.fireEvent("updateBandwidth", b)
},
UpdateFps: function() {
this.UpdateVideoLabel({
fps: Math.round(this.frameCount / this.UPD_BANDWIDTH_SEC)
});
this.frameCount = 0
},
RemoveUpdFpsTask: function() {
this.removeDelayedTask(this.UPD_FPS_TASK)
},
RemoveUpdBandWidthTask: function() {
this.removeDelayedTask(this.UPD_BANDWIDTH_TASK)
},
OnBeforeDestroy: function() {
this.RemoveUpdBandWidthTask();
this.RemoveUpdFpsTask();
this.CancelSwitchToDefault();
if (true === SYNO.SS.Utils.IsSsc()) {
SYNO.SS.Ssc.UpdateGpuResource(this.id, 0)
}
},
Show: Ext.emptyFn,
ResizePlayer: Ext.emptyFn,
GetPlayerWidth: Ext.emptyFn,
GetDoorChannelWidth: Ext.emptyFn,
Stop: Ext.emptyFn,
Play: Ext.emptyFn,
SetAttr: Ext.emptyFn,
ShowNoSource: Ext.emptyFn,
ShowPlayer: Ext.emptyFn,
OnDestroy: Ext.emptyFn,
IsPlayable: function() {
return true
},
Pause: function() {
this.panelVideo.Pause()
},
Resume: function() {
this.panelVideo.Resume()
},
ToogleResumePause: function(a) {
this.panelVideo.ToogleResumePause(a)
},
SetPrivacyMaskVisible: function(a) {
this.panelVideo.SetPrivacyMaskVisible(a, null)
},
PrivacyMaskAddRegion: function() {
this.panelVideo.PrivacyMaskAddRegion()
},
PrivacyMaskDelRegion: function() {
this.panelVideo.PrivacyMaskDelRegion()
},
GetPrivacyMaskRegionNum: function() {
return this.panelVideo.GetPrivacyMaskRegionNum()
},
GetPrivacyMaskMaxRegionNum: function() {
return this.panelVideo.GetPrivacyMaskMaxRegionNum()
},
GetPrivacyMaskMinRegionNum: function() {
return this.panelVideo.GetPrivacyMaskMinRegionNum()
},
GetPrivacyMaskRegion: function() {
return this.panelVideo.GetPrivacyMaskRegion()
},
SetPrivacyMaskRegion: function(a) {
this.panelVideo.SetPrivacyMaskRegion(a)
},
ResetPlayer: function(b) {
var c = this.PrepareCamRecord();
var a = ((c) && (c.data)) ? c.data : {
deleted: true
};
this.panelVideo.onScreenHandler.ResetDragZoom();
this.panelVideo.panelSnapshot.CloseSnapshot();
this.blSingleCh = b.blSingleCh;
this.SetAdvLiveFlag(false);
if ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW === this.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_POS === this.viewType)) {
this.TriggerChangeProfile();
this.CheckIndicator(a);
this.acapHandler.DrawAcapDetArea([])
}
},
SetMediaInfo: function(b) {
var a = SYNO.SS.GblStore.dsCamera.getById(b.camIdOnHost);
this.mediaInfo = SYNO.SS.Utils.DeepCopy(b);
this.mediaInfo.fnGetCurRealProfile = this.GetCurRealProfile.createDelegate(this);
if (a) {
Ext.apply(this.mediaInfo, {
ptz: a.get("ptzCap"),
stm_info_ptzCaps: a.get("stm_info_ptzCaps"),
ptzDirection: a.get("ptzDirection"),
ptzContinuous: a.get("ptzContinuous"),
ptzAutoPanType: a.get("autoPan"),
ptzHasObjTracking: a.get("objTrack"),
presetNum: a.get("presetNum"),
pt_speed: a.get("ptSpeed"),
zoom_speed: a.get("zoomSpeed"),
ptz_speed_keep_origin: a.get("ptzSpeedKeepOrigin"),
audioOut: (false === Ext.isEmpty(this.mediaInfo)) ? this.mediaInfo.audioOut : a.get("audioOut"),
blFixAspectRatio: this.blFixAspectRatio,
blShowVideoLabel: this.blShowVideoLabel
})
} else {
this.mediaInfo.stm_info_ptzCaps = []
}
this.ReloadMediaInfo();
if (this.panelVideo.onScreenHandler) {
this.panelVideo.onScreenHandler.InitDefaultHandler()
}
},
ShowCamInfoLabel: function(a) {
this.panelBanner.setVisible(a);
this.panelVideo.Resize(this.ctWidth, this.ctHeight - this.panelBanner.GetHeight());
this.videoLabel.DoLayout()
},
SetFixAspect: function(a) {
this.panelVideo.SetFixAspect(a)
},
SetShowVideoLabel: function(a) {
var b = SYNO.SS.GblStore.dsCamera.getById(this.GetCurCamIdOnHost());
if ((true === SYNO.SS.Utils.IsCamOnlineSts(this.camStatus)) && (true === SYNO.SS.App.WebPlayer.Utils.IsHtml5Support(b))) {
this.panelVideo.SetShowVideoLabel(a)
}
},
SetFocus: function(a) {
this.panelVideo.SetFocus(a);
if (false === a) {
this.OnDeactivateTalking()
}
this.UpdateLiveviewStmInfo()
},
SetPtz: function(a) {
this.panelVideo.onScreenHandler.SetHandler(this.panelVideo.onScreenHandler.TYPE_PTZ, a)
},
SetSuspendMouseEvent: function(a) {
this.panelVideo.SetSuspendMouseEvent(a);
if (true === a) {
this.OnDeactivateTalking()
}
},
IsOnOsdPanel: function(a) {
return this.panelVideo.panelOSD.IsMouseInside(a)
},
RestorePausedPlayer: function() {
this.panelVideo.RestorePausedPlayer()
},
UpdateIndicator: function(e, c, b) {
var d, a;
a = (true === SYNO.SS.Image.IsRetinaSupport()) ? "2x" : "1x";
d = document.createElement("img");
d.setAttribute("src", "modules/WebPlayer/images/" + a + "/" + e);
d.setAttribute("class", "banner_indicator");
if (c) {
d.setAttribute("ext:qtip", c)
}
b.SetIndicator(d)
},
EnableAlertIcon: function(a) {
if (a === this.blAlertIconVisible) {
return
}
this.blAlertIconVisible = a;
this.SetAlertIconVisible(a)
},
SetAlertIconVisible: function(a) {
if (false === SYNO.SS.Utils.CheckNested(this, "panelVideo", "cmpAlertIcon")) {
return
}
this.panelVideo.cmpAlertIcon.setVisible(a)
},
SetAlertIconFlash: function(d, a) {
var b;
var c = "alert_indicator";
if (false === SYNO.SS.Utils.CheckNested(this, "panelVideo", "cmpAlertIcon")) {
return
}
if (true === d) {
c = (true === a) ? "alert_indicator_flash" : "alert_indicator_red"
}
b = this.panelVideo.cmpAlertIcon;
b.removeClass(b.currentCls);
b.addClass(c);
b.currentCls = c
},
SetPauseIconVisible: function(a) {
var b;
if (false === SYNO.SS.Utils.CheckNested(this, "panelVideo", "cmpPauseIcon")) {
return
}
b = (true === a) && (true === SYNO.SS.Utils.IsCamOnlineSts(this.camStatus));
this.panelVideo.cmpPauseIcon.setVisible(b)
},
SetCursorVisibility: function(a) {
this.panelVideo.SetCursorVisibility(a)
},
NeedToHideStreamInfo: function(a) {
return (false === SYNO.SS.Utils.IsCamOnlineSts(this.camStatus)) || (false === SYNO.SS.App.WebPlayer.Utils.IsHtml5Support(a))
},
UpdateFisheyeInfo: function(a) {
this.panelVideo.UpdateFisheyeInfo(a)
}
});
Ext.define("SYNO.SS.App.WebPlayer.RecordHtml5PlayerPanel", {
extend: "Ext.Container",
UPD_BANDWIDTH_TASK: "UPDATE_BANDWIDTH_TASK",
UPD_FPS_TASK: "UPDATE_FPS_TASK",
UPD_BANDWIDTH_SEC: 3,
ctWidth: 0,
ctHeight: 0,
camIdOnHost: null,
blSupportAudio: true,
record: null,
streamSpeed: 1,
panelBanner: null,
panelVideo: null,
blReverse: false,
viewType: 0,
curAudioInfo: null,
playerStatus: SYNO.SS.App.WebPlayer.Def.PlayerStatus.STOP,
wsHandler: null,
cmdStamp: 0,
regionId: 0,
regionName: "",
frameCount: 0,
frameSize: 0,
videoLabel: null,
labelContainer: null,
customFeRegionInfo: null,
blAnalyticsEdit: false,
blObjSizeEditorMode: false,
Show: Ext.emptyFn,
GetPlayerWidth: Ext.emptyFn,
SetAttr: Ext.emptyFn,
ShowNoSource: Ext.emptyFn,
ShowPlayer: Ext.emptyFn,
constructor: function(a) {
this.ctWidth = a.width;
this.ctHeight = a.height;
this.camIdOnHost = a.camIdOnHost;
this.regionId = a.regionId;
this.regionName = a.regionName;
this.customFeRegionInfo = a.customFeRegionInfo;
this.blAnalyticsEdit = a.blAnalyticsEdit;
this.InitLabelContainer();
this.Init(a);
Ext.applyIf(a, {
blSupportAudio: (false !== a.blSupportAudio),
cls: SYNO.SS.Utils.GetVdoBgCls() + " player-panel-ct",
items: [this.panelBanner, {
xtype: "container",
cls: "video-container-ct",
items: [this.panelVideo, this.labelContainer]
}],
listeners: {
afterrender: function(b) {
this.OnAfterRender()
},
resize: function(c, d, b) {
this.ResizePlayer(d, b)
},
beforedestroy: this.OnBeforeDestroy,
scope: this
}
});
this.callParent([a]);
this.InitEventHandler();
this.InitTask();
this.addEvents("timeupdate", "videoinited", "streamended")
},
AppendLabel: function(a) {
this.labelContainer.add(a)
},
InitEventHandler: function() {
this.mon(SYNO.SDS.StatusNotifier, "updateVideoBgColor", function() {
SYNO.SS.Utils.ResetVdoInfoBarCls(this.panelBanner);
SYNO.SS.Utils.ResetVdoBgCls(this)
}, this);
if (this.camIdOnHost) {
this.mon(SYNO.SS.GblStore.dsCamera, "storeupdate", this.OnCameraUpdate, this)
}
this.panelVideo.mon(this.panelVideo, "videoinited", this.OnVideoInited, this);
this.panelVideo.mon(this.panelVideo, "updatevideolabel", this.UpdateVideoLabel, this);
if (true === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsSupVideoLabel(this.viewType)) {
this.mon(this, "frameReceive", this.OnReceiveFrame, this)
}
if (true === SYNO.SS.Utils.IsSsc()) {
this.panelVideo.mon(this.panelVideo, "checkGpuResource", this.CheckGpuResource, this)
}
},
CheckGpuResource: function(a) {
this.blHwDecode = a;
this.panelVideo.cmpHwIcon.setVisible(this.blHwDecode && SYNO.SS.Ssc.IsShowGpuIcon());
if (false === a) {
SYNO.SS.Ssc.UpdateGpuResource(this.id, 0)
}
},
InitTask: function() {
if (true === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsSupVideoLabel(this.viewType)) {
this.TaskUpdater(this.UpdateBandwidth.createDelegate(this), this.UPD_BANDWIDTH_TASK, this.UPD_BANDWIDTH_SEC * TRANS_MILLISECOND);
this.TaskUpdater(this.UpdateFps.createDelegate(this), this.UPD_FPS_TASK, this.UPD_BANDWIDTH_SEC * TRANS_MILLISECOND)
}
},
InitLabelContainer: function() {
this.videoLabel = new SYNO.SS.App.WebPlayer.VideoLabel({
fnGetContainerSize: function() {
return {
width: this.ctWidth,
height: this.ctHeight - this.panelBanner.GetHeight()
}
}.createDelegate(this)
});
this.labelContainer = new Ext.Container({
cls: "label-container",
items: [this.videoLabel],
listeners: {
afterlayout: function() {
this.videoLabel.DoLayout()
},
scope: this
}
})
},
RemoveLabel: function(a, b) {
this.labelContainer.remove(a, b)
},
UpdateVideoLabel: function(a) {
this.videoLabel.ApplyInfo(a)
},
OnReceiveFrame: function(b, a) {
this.frameSize += b;
if (true === a) {
this.frameCount += 1
}
},
UpdatePluginFrameSizeCount: function(b, a) {
this.frameSize += b;
this.frameCount += a
},
TaskUpdater: function(b, a, c) {
b();
this.runInterval(a, b, c)
},
UpdateBandwidth: function() {
var b = Math.round(this.frameSize * 8 / 1000 / this.UPD_BANDWIDTH_SEC);
var a = b + "&nbsp;" + _T("ss_common", "bitrate_kb");
this.UpdateVideoLabel({
bandWidth: a
});
this.frameSize = 0;
this.fireEvent("updateBandwidth", b)
},
UpdateFps: function() {
this.UpdateVideoLabel({
fps: Math.round(this.frameCount / this.UPD_BANDWIDTH_SEC)
});
this.frameCount = 0
},
DestroyTask: function() {
this.removeDelayedTask(this.UPD_BANDWIDTH_TASK);
this.removeDelayedTask(this.UPD_FPS_TASK)
},
ResizePlayer: function(b, a) {
this.ctWidth = b || this.getWidth();
this.ctHeight = a || this.getHeight();
this.panelVideo.Resize(this.ctWidth, this.ctHeight - this.panelBanner.GetHeight())
},
OnAfterRender: function() {
this.SetMediaInfo()
},
SetMediaInfo: function(a) {
if (this.panelVideo.panelOSD) {
this.panelVideo.panelOSD.ReloadOsdBtn(a)
}
},
Init: function(b) {
this.viewType = b.viewType;
this.panelBanner = new SYNO.SS.App.WebPlayer.Banner({
viewType: b.viewType,
hidden: (false === b.blShowCamInfoLabel),
emptyTimeText: (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.TIMELINE === b.viewType) ? "--:--:--" : "",
ClearTime: function() {
this.SetRight(this.emptyTimeText)
}
});
var a = {
owner: this,
viewType: b.viewType,
width: b.width,
height: b.height - this.panelBanner.GetHeight(),
blFixAspectRatio: b.blFixAspectRatio,
blShowVideoLabel: b.blShowVideoLabel,
blHideOsdBbar: b.blHideOsdBbar,
blFocused: b.blFocused,
blShowPrivMaskUI: b.blShowPrivMaskUI,
extraCfg: b.extraCfg,
blToogleResumePause: b.blToogleResumePause,
fnUpdateAudioInfo: this.UpdateAudioInfo.createDelegate(this),
blAnalyticsEdit: b.blAnalyticsEdit
};
if (b.posId) {
a.posId = b.posId;
a.dsId = b.dsId;
this.panelVideo = new SYNO.SS.App.WebPlayer.POSVideoContainer(a)
} else {
this.panelVideo = new SYNO.SS.App.WebPlayer.VideoContainer(a)
}
},
GetSpeed: function() {
return this.streamSpeed
},
OnBeforeDestroy: function() {
this.Stop();
this.DestroyWSHandler();
this.DestroyTask();
if (true === SYNO.SS.Utils.IsSsc()) {
SYNO.SS.Ssc.UpdateGpuResource(this.id, 0)
}
},
Stop: function(a, b) {
this.StopWsStream();
this.playerStatus = SYNO.SS.App.WebPlayer.Def.PlayerStatus.STOP;
if (true === b) {
this.ResetAction();
this.panelVideo.ShowLastFrame()
}
this.panelVideo.RemoveVideoInst(a, b);
this.panelBanner.ClearTime();
this.record = null;
this.curAudioInfo = null
},
StopWsStream: function() {
if (this.wsHandler) {
this.wsHandler.RemoveEvtListener();
this.wsHandler.SendCmd("pause=true")
}
},
DestroyWSHandler: function() {
if (this.wsHandler) {
this.wsHandler.Destroy();
this.wsHandler = null
}
},
CreateWsUrlConf: function(a) {
var b = this.IsRelayRecAuth(a);
return {
dsId: a.get("dsId"),
id: 0,
idOnRec: 0,
forceRelay: b,
param: {
method: "MixStream",
blMux: true,
browser: SYNO.SS.App.WebPlayer.Utils.GetHtml5BroswerType(),
stmSrc: SYNO.SS.App.WebPlayer.Def.StreamSrc.REC_CHECKER,
relay_rec_auth: b
}
}
},
IsRelayRecAuth: function(a) {
if ((a.get("c2_event")) && (LOCAL_DS_ID != a.get("dsId"))) {
return !!SYNO.SS.App.C2Vue.C2EncFlow.getRecAuth(a.get("dsId"))
}
return false
},
GetConfStart: function(b, a) {
if ((true === this.blReverse) && (true === b.get("blPlayFromEnd"))) {
return (a || DAY_SECONDS)
} else {
return b.get("startOffset") || b.get("customStartTime") || 0
}
},
PickBestMetaType: function(b, a) {
if ((b) && (b[0])) {
if ((SYNO.SS.Utils.IsFlags(b[0], SYNO.SS.App.Event.Def.REC_TRIG_LABEL[0].FACE)) && (a && ITEM_TYPE_FACE === a.itemType)) {
return SYNO.SS.Event.RecType.FACE
}
if ((SYNO.SS.Utils.IsFlags(b[0], SYNO.SS.App.Event.Def.REC_TRIG_LABEL[0].IVA)) && (a && ITEM_TYPE_IVA === a.itemType)) {
return SYNO.SS.Event.RecType.IVA
}
if (SYNO.SS.Utils.IsFlags(b[0], SYNO.SS.App.Event.Def.REC_TRIG_LABEL[0].POS)) {
return SYNO.SS.Event.RecType.POS
}
}
return 0
},
CreateConf: function(j) {
var o = (true === (j.get("is_recording") || j.get("recording")));
var f = (true === o) ? 0 : (j.get("stopTime") - j.get("startTime"));
var i = SYNO.SS.App.Event.Utils.GetRecEvtType(j);
var b = (SYNO.SS.Event.RecType.POS === i) ? j.get("eventId") : j.get("id");
var h = j.get("idOnRecServer") || j.get("id_on_RecServer") || b;
var e = ((this.curAudioInfo.mute) || (false === this.blFocused));
var g = j.get("customEndTime") || f;
var a = this.GetConfStart(j, g);
var n = SYNO.SS.App.Event.Utils.GetCamRecord(j.get("cameraId"), j.get("mountId"), j.get("archId"), j.get("dsId"));
var l = SYNO.SS.Utils.GetVideoStrByType(j.get("video_type"));
var c = !!j.get("c2_event");
var m = (c) ? SYNO.SS.App.WebPlayer.Def.StreamSrc.C2_REC : SYNO.SS.App.WebPlayer.Def.StreamSrc.RECORD;
var d = (true === SYNO.SS.Utils.IsSsc()) ? false : true;
var k = {
parent: this,
stmSrc: m,
videoType: l,
resolution: SYNO.SS.Utils.GetRecordReso(j),
dsId: j.get("dsId"),
id: b,
idOnRec: h,
blMute: e,
volume: this.curAudioInfo.volume / MAX_VOLUME_LEVEL,
wsHandler: this.wsHandler,
blTimeoutPlayer: j.get("use_timeout_player"),
blC2Player: c,
param: {
method: "MixStream",
blMux: true,
browser: SYNO.SS.App.WebPlayer.Utils.GetHtml5BroswerType(),
stmSrc: m,
blAudio: ((true === this.blSupportAudio) && (true === this.curAudioInfo.blHavePriv) && ("" !== j.get("audio_format"))),
mute: e,
supportPrivacyMask: true,
speed: this.streamSpeed,
reverse: this.blReverse,
recEvtType: i,
mountId: j.get("mountId"),
archId: j.get("archId"),
start: a,
end: g,
autoDrop: d,
refreshHeader: true,
restart: true
}
};
if (true === SYNO.SS.Utils.IsSsc()) {
if (true === SYNO.SS.Ssc.IsPluginPlayer(n, this.regionId, this.blAnalyticsEdit, false, l)) {
SYNO.SS.Ssc.SetPluginConf(k, false, n, this.regionId, this.customFeRegionInfo, this.blAnalyticsEdit, false, l)
} else {
k.gpuRes = SYNO.SS.Ssc.GetRecGpuResource(k.resolution)
}
}
k.fnUpdateStreamTm = this.UpdateStreamTime.createDelegate(this);
k.fnOnStreamEnded = this.OnStreamEnded.createDelegate(this);
k.fnOnWSReady = this.SendPlayParams.createDelegate(this, [k]);
return k
},
Play: function(a, c) {
var b;
var d = function() {
this.StopWsStream();
this.OnStreamEnded(SYNO.SS.App.WebPlayer.Def.StreamEndReason.UNSUPPORT)
};
this.record = a;
this.curAudioInfo = c;
this.InitWsHandler(a);
b = this.CreateConf(a);
if (false === this.CheckRecValid(b)) {
d.call(this);
return
}
if ((!this.panelVideo.videoInst) || (true === this.panelVideo.IsWebSocketStatusNormal())) {
this.panelVideo.ShowLoading()
}
if (false === this.InitVideoInst(b)) {
d.call(this);
return
}
this.playerStatus = SYNO.SS.App.WebPlayer.Def.PlayerStatus.READY_TO_PLAY;
this.InitPlayerStsByRec(a)
},
CheckRecValid: function(a) {
if (true === a.blTimeoutPlayer) {
return true
}
return (this.panelVideo.CheckFisheyeSupport() && this.panelVideo.CheckHtml5SupportCodec(a.videoType, a.resolution, a.dsId))
},
InitPlayerStsByRec: function(a) {
this.panelVideo.UpdateAudioToolTip(SYNO.SS.Utils.GetAudioType(a.get("audio_format")));
this.panelVideo.panelSnapshot.camName = this.GetCameraName();
this.panelVideo.panelSnapshot.startTime = a.get("startTime");
this.panelVideo.UpdatePrivacyMaskFromRecord(this.record);
this.UpdateVideoLabel({
videoType: SYNO.SS.Utils.GetVideoStrByType(a.get("video_type")),
reso: SYNO.SS.Utils.GetRecordReso(a)
})
},
GetCameraName: function() {
return this.record.get("camera_name")
},
SendPlayParams: function(a) {
a.param.stamp = ++this.cmdStamp;
this.wsHandler.SendParams("action=play", a)
},
InitVideoInst: function(a) {
if (this.panelVideo.videoInst) {
return this.panelVideo.ReplaceVideoInst(a)
} else {
return this.panelVideo.InitVideoInst(a)
}
},
InitWsHandler: function(a) {
if ((!this.wsHandler) || (WebSocket.OPEN !== this.wsHandler.GetReadyState()) || (false === this.wsHandler.IsSameWSTarget(a.get("dsId")))) {
this.DestroyWSHandler();
this.wsHandler = new SYNO.SS.App.WebPlayer.WSStreamHandler(this.CreateWsUrlConf(a))
}
},
ResetAction: function(a) {
a = a || {};
this.panelVideo.ResetAction(a);
if (true !== a.blKeepImageEnhancement) {
this.DoImageEnhancement({})
}
},
OnStreamEnded: function(a) {
var b;
this.playerStatus = SYNO.SS.App.WebPlayer.Def.PlayerStatus.STOP;
if (true === this.panelVideo.IsWebSocketNotConnectYet()) {
b = "direct_conn_failed"
} else {
if (true === this.panelVideo.IsWebSocketConnectFailed()) {
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.TIMELINE === this.panelVideo.viewType) {
b = "websocket_conn_failed"
} else {
b = "websocket_conn_failed_more_info"
}
}
}
this.fireEvent("streamended", a || SYNO.SS.App.WebPlayer.Def.StreamEndReason.NORMAL, this);
if ("direct_conn_failed" === b) {
this.panelVideo.ShowWsDirectConnFailedTip()
} else {
if ("websocket_conn_failed" === b) {
this.panelVideo.ShowWsConnFailedTip()
} else {
if ("websocket_conn_failed_more_info" === b) {
this.panelVideo.ShowWsConnFailedMoreInfoTip()
}
}
}
},
OnVideoInited: function() {
var a = this.panelVideo.getPosition(true)[0];
var d = this.panelVideo.getPosition(true)[1];
var b = this.panelVideo.getSize().width;
var c = this.panelVideo.getSize().height;
this.panelVideo.DoImageEnhancement();
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.TIMELINE === this.viewType) {
this.panelVideo.onScreenHandler.ApplyDragZoom()
}
this.fireEvent("videoinited", a, d, b, c)
},
OnPlayerExpanded: Ext.emptyFn,
ResetPlayer: Ext.emptyFn,
GetRecordStartTime: function() {
return (this.record) ? this.record.get("startTime") : 0
},
GetRecordEndTime: function() {
var a = 0;
if (this.record) {
if (true === Ext.isNumber(this.record.get("customEndTime"))) {
a = this.record.get("customEndTime") + this.record.get("startTime")
} else {
a = this.record.get("stopTime")
}
}
return a
},
UpdateStreamTime: function(c) {
var b = false;
var a = c / TRANS_MILLISECOND;
if (true === this.blReverse) {
b = ((this.record.get("customStartTime") || 0) >= Math.floor(a))
} else {
b = (this.GetRecordEndTime() < (this.GetRecordStartTime() + a))
}
if (true === b) {
this.panelVideo.videoInst.OnStreamEnded();
return
}
this.fireEvent("timeupdate", c, this.GetRecordStartTime(), this)
},
SetFixAspect: function(a) {
this.panelVideo.SetFixAspect(a)
},
IsShowVideoLabel: function() {
return this.panelVideo.blShowVideoLabel
},
SetShowVideoLabel: function(a) {
if ((this.record) && (true === SYNO.SS.App.WebPlayer.Utils.IsHtml5Support(this.record))) {
this.panelVideo.SetShowVideoLabel(a)
}
},
ShowCamInfoLabel: function(a) {
this.panelBanner.setVisible(a);
this.panelVideo.Resize(this.ctWidth, this.ctHeight - this.panelBanner.GetHeight());
this.videoLabel.DoLayout()
},
SetFocus: function(a) {
this.panelVideo.SetFocus(a)
},
SetSuspendMouseEvent: function(a) {
this.panelVideo.SetSuspendMouseEvent(a)
},
Pause: function() {
this.panelVideo.Pause()
},
Resume: function() {
this.panelVideo.Resume()
},
ToogleResumePause: function(a) {
this.panelVideo.ToogleResumePause(a)
},
SetPrivacyMaskVisible: function(a) {
this.panelVideo.SetPrivacyMaskVisible(a, null)
},
Seek: function(a) {
this.panelVideo.VideoInstAct("Seek", parseInt(a, 10))
},
SeekMs: function(b, a) {
this.panelVideo.VideoInstAct("SeekMs", parseInt(b, 10), a)
},
SetSpeed: function(a) {
if (this.streamSpeed !== a) {
this.streamSpeed = a;
this.panelVideo.VideoInstAct("SetSpeed", a)
}
},
SetMute: function(a) {
this.panelVideo.SetMute(a)
},
SetReverse: function(a) {
if (this.blReverse !== a) {
this.blReverse = a;
this.SeekMs(this.GetCurStreamTm(), "&reverse=" + this.blReverse)
}
},
SetVolume: function(a) {
this.panelVideo.SetVolume(a)
},
PrevFrame: function() {
if (false === this.panelVideo.IsManualPaused()) {
return
}
if (0 < this.GetCurStreamTm()) {
this.SeekMs(Math.max(this.GetCurStreamTm() - TRANS_MILLISECOND, 0))
}
},
NextFrame: function() {
if (false === this.panelVideo.IsManualPaused()) {
return
}
this.SeekMs(this.GetCurStreamTm() + TRANS_MILLISECOND, "&nextI=true")
},
IsOnOsdPanel: function(a) {
return this.panelVideo.panelOSD.IsMouseInside(a)
},
GetCurStreamTm: function() {
return this.panelVideo.GetCurStreamTm() || 0
},
IsFrameReady: function() {
return this.panelVideo.IsFrameReady()
},
GetPlayerStatus: function() {
return this.playerStatus
},
IsPlayable: function() {
return (SYNO.SS.App.WebPlayer.Def.PlayerStatus.STOP !== this.playerStatus)
},
BannerAct: function(a) {
if (this.panelBanner) {
this.panelBanner[a].apply(this.panelBanner, Array.prototype.slice.call(arguments, 1))
}
},
RestorePausedPlayer: function() {
this.panelVideo.RestorePausedPlayer()
},
ShowPlayerTip: function(a) {
this.panelVideo.ShowPlayerTip(a)
},
HidePlayerTip: function() {
this.panelVideo.HidePlayerTip()
},
ShowPlayerEmptyBackground: function(a, c) {
var b = "";
if ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.POS_RECORDING === this.viewType) && c) {
b = this.GetEmptyTransactionBackgroundCls(c)
}
this.panelVideo.SetPlayerBackground(a, b)
},
SetMask: function(a) {
this.panelVideo.add(a);
this.panelVideo.mon(this.panelVideo, "resize", function() {
a.setSize(this.ctWidth, this.ctHeight)
})
},
ReplaceVideoInst: function() {
var a;
if (!this.record) {
return
}
this.InitWsHandler(this.record);
a = this.CreateConf(this.record);
a.param.start = this.GetCurStreamTm() / TRANS_MILLISECOND;
this.panelVideo.ReplaceVideoInst(a)
},
UpdateAudioInfo: function(a, b) {
if (!this.curAudioInfo) {
return
}
if (true === Ext.isBoolean(a)) {
this.curAudioInfo.mute = a
}
if (true === Ext.isNumber(b)) {
this.curAudioInfo.volume = b
}
},
GetEmptyTransactionBackgroundCls: function(a) {
switch (a) {
case SYNO.SS.Transactions.Status.INCOMPLETE:
case SYNO.SS.Transactions.Status.CANCELED:
return this.panelVideo.GetThumbCls("transaction_empty_abnormal_thumb");
default:
return this.panelVideo.GetThumbCls("transaction_empty_thumb")
}
},
DoImageEnhancement: function(a) {
this.panelVideo.DoImageEnhancement(a)
},
SetCursorVisibility: function(a) {
this.panelVideo.SetCursorVisibility(a)
},
SetBannerTime: function(a) {
this.BannerAct("SetRight", SYNO.SS.DateTime.Utc2LocalDate24TimeSecStr(a * TRANS_MILLISECOND))
},
IsPlaySupport: function(a) {
a = a || this.record;
if ((!a) || (true === this.SYNO.SS.Ssc.IsFisheyeUnsupported(this.regionId))) {
return false
}
return SYNO.SS.App.WebPlayer.Utils.IsHtml5Support(a)
},
OnCameraUpdate: function(d, c) {
var a = -1;
var b = null;
if ((d) && (0 < d.cameras.length)) {
a = d.cameras.findExact("id", this.GetCurCamIdOnHost());
if (-1 !== a) {
b = d.cameras[a];
this.panelVideo.UpdatePrivacyMask(b)
}
}
},
GetCurCamIdOnHost: function() {
return this.camIdOnHost
},
UpdateFisheyeInfo: function(a) {
this.panelVideo.UpdateFisheyeInfo(a)
},
SetObjSizeEditorMode: function(a) {
this.blObjSizeEditorMode = a
}
});
Ext.define("SYNO.SS.App.WebPlayer.Html5MediaPlayerBase", {
MIME_AAC: 'audio/mp4; codecs="mp4a.40.2"',
MIME_MP3_IN_MPEG: "audio/mpeg;",
MIME_MP3_IN_MP4: "audio/mp4;",
MIME_AVC1: 'video/mp4; codecs="avc1.42e028"',
MIME_HEV1: 'video/mp4; codecs="hev1.1.6.L93.B0"',
MIME_MPEG4: 'video/mp4; codecs="mpeg4"',
MIME_MJPEG: 'video/mp4; codecs="mjpeg"',
SHOW_VDO_DELAY: !!localStorage.getItem("SVSDBG_SHOW_VDO_DELAY"),
RESET_DAY: 1,
VIDEO_INDEX: 0,
AUDIO_INDEX: 1,
trackIndices: null,
wsHandler: null,
trackObjArray: null,
parent: null,
stmSrc: null,
blFrameReady: false,
fnUpdateStreamTm: null,
fnReceiveMeta: null,
IsHighFreqTimeupdate: false,
fnOnStreamEnded: null,
fnOnRetry: null,
fnSyncLatency: null,
fnBufferUpdateEndCallback: null,
blAudio: false,
delayPlayMs: 0,
videoIFrameLimit: 2,
audioFrameLimit: 30,
lastFrameTmStampInQ: null,
fnCheckTabVisibility: null,
resetTaskId: null,
vdoEndedPollingTaskId: null,
currentTimeTimer: null,
fillTmTask: null,
blDestroyWS: true,
wsMessageReader: null,
streamSpeed: 1,
gpuRes: null,
constructor: function(a) {
this.wsMessageReader = SYNO.SS.App.WebPlayer.Utils.MessageReader;
this.InitTrackIndices(a.videoOnly);
this.parent = a.parent;
this.stmSrc = a.stmSrc;
this.blAudio = (a.param) ? a.param.blAudio : false;
this.gpuRes = a.gpuRes;
this.fnUpdateStreamTm = a.fnUpdateStreamTm;
this.IsHighFreqTimeupdate = (a.IsHighFreqTimeupdate || false);
this.fnOnStreamEnded = a.fnOnStreamEnded;
this.fnOnRetry = a.fnOnRetry;
this.fnSyncLatency = a.fnSyncLatency;
this.fnBufferUpdateEndCallback = a.fnBufferUpdateEndCallback;
this.fnIsManualPaused = a.fnIsManualPaused;
this.fnReceiveMeta = a.fnReceiveMeta;
this.Init(a);
a.fnOnWSMessage = this.OnWSMessage.createDelegate(this);
a.fnOnWSClose = this.OnWSClose.createDelegate(this);
if (a.wsHandler) {
this.wsHandler = a.wsHandler;
this.wsHandler.ChangeConfig(a);
this.blDestroyWS = false
} else {
this.wsHandler = new SYNO.SS.App.WebPlayer.WSStreamHandler(a)
}
},
InitTrackIndices: function(b) {
this.trackIndices = [this.VIDEO_INDEX];
var a = (true === Ext.isDefined(b)) ? (false === b) : true;
if (true === a) {
this.trackIndices.push(this.AUDIO_INDEX)
}
},
Init: function(a) {
var b;
if (a.liveBufferingMs) {
this.delayPlayMs = a.liveBufferingMs
} else {
if (a.liveBufferingSec) {
this.delayPlayMs = a.liveBufferingSec * 1000
}
}
if (0 < this.delayPlayMs) {
this.videoIFrameLimit = 10;
this.audioFrameLimit = 30 * (1 + Math.ceil(this.delayPlayMs / 1000))
}
this.trackObjArray = [];
this.trackIndices.forEach(function(c) {
if (this.VIDEO_INDEX === c) {
b = this.CreateVideoDom(a.param.start)
} else {
b = this.CreateAudioDom(a.blMute, a.volume)
}
b.preload = "none";
this.trackObjArray[c] = {
dom: b,
mediaSource: null,
fnSourceOpen: null,
sourceBuffer: null,
needData: true,
queue: [],
prevCurTm: 0,
sameCurTmCnt: 0,
blPlayerReady: false,
blInited: false,
blTabBlured: false,
iframeCounter: 0,
appendBufTimer: null,
lastEndTimeArray: [],
lastEndTm: 0,
seekOverDelayMs: Date.now(),
lastClearTm: 0,
lastIframeTmstmp: 0
}
}, this);
if ((true === IS_CHROME_BROWSER) && (false === Ext.isEdge)) {
this.fnCheckTabVisibility = this.CheckTabVisibility.createDelegate(this);
document.addEventListener("visibilitychange", this.fnCheckTabVisibility)
}
},
InitCurrentTimeTimer: function(a) {
var b = ((a * TRANS_MILLISECOND) || 0);
this.currentTimeTimer = {
currentTime: b,
lastCheckTm: -1,
frameToBufEndTimeMap: [{
frameTime: b,
bufEndTime: 0
}],
SeekMs: function(c) {
this.currentTime = c;
this.lastCheckTm = -1;
this.frameToBufEndTimeMap.length = 0
},
GetCurrentTime: function() {
return this.currentTime
},
RegFrameTime: function(d, c) {
this.frameToBufEndTimeMap.push({
frameTime: d,
bufEndTime: c
})
},
SyncFrameTime: function(d) {
var c;
for (c = 0; c < this.frameToBufEndTimeMap.length; c++) {
if (d < this.frameToBufEndTimeMap[c].bufEndTime) {
break
}
}
c -= 1;
if (0 > c) {
return
}
this.currentTime = this.frameToBufEndTimeMap[c].frameTime;
this.frameToBufEndTimeMap.splice(0, c + 1)
},
IsTimeChange: function() {
var c = (this.lastCheckTm != this.currentTime);
this.lastCheckTm = this.currentTime;
return c
}
}
},
IsWebSocketNotConnectYet: function() {
return (this.wsHandler) ? this.wsHandler.IsNotConnectYet() : false
},
IsWebSocketStatusNormal: function() {
return (this.wsHandler) ? this.wsHandler.IsConnectStatusNormal() : false
},
IsWebSocketConnectFailed: function() {
return (this.wsHandler) ? this.wsHandler.IsConnectFailed() : false
},
CreateVideoDom: function(a) {
var c = document.createElement("video");
var b = this;
this.fnRegResetTask = function() {
c.removeEventListener("canplay", b.fnRegResetTask);
b.fnRegResetTask = null;
if (b.resetTaskId) {
clearTimeout(b.resetTaskId);
b.resetTaskId = null
}
b.resetTaskId = setTimeout(function() {
b.parent.ReplaceVideoInst()
}, (b.RESET_DAY + Math.random()) * DAY_MILLISECOND)
};
c.muted = true;
c.setAttribute("style", "width: 100%; height: 100%; object-fit: fill; position: absolute;");
if (SYNO.SS.App.WebPlayer.Def.StreamSrc.RECORD === this.stmSrc) {
c.oncanplay = function() {
if (true === this.ended) {
return
}
if (true === b.fnIsManualPaused()) {
b.Pause();
return
}
if (true === this.paused) {
SYNO.SS.Utils.CatchRejectionPlay(this)
}
};
c.onended = function() {
this.OnStreamEnded()
}.createDelegate(this);
SYNO.SS.App.WebPlayer.Utils.RegFirstFrameInitFunc(c, this, "canplay")
} else {
c.oncanplay = function() {
if (true === this.paused) {
SYNO.SS.Utils.CatchRejectionPlay(this)
}
}
}
if (this.fnUpdateStreamTm) {
this.InitCurrentTimeTimer(a);
c.ontimeupdate = function() {
if (true === isFinite(this.currentTime)) {
b.UpdateStreamTime(this.currentTime)
} else {
b.OnStreamEnded()
}
}
}
if (!IS_SAFARI_BROWSER) {
c.addEventListener("canplay", this.fnRegResetTask)
}
return c
},
CreateAudioDom: function(a, b) {
var c = document.createElement("audio");
c.muted = a || false;
c.volume = (true === Ext.isNumber(b)) ? b : 0.5;
c.oncanplay = function() {
if (true === this.paused) {
SYNO.SS.Utils.CatchRejectionPlay(this)
}
};
return c
},
IsVideoHwDecode: function(b, a) {
if ((this.MIME_HEV1 !== a) && (this.MIME_AVC1 !== a)) {
return false
}
if ((false === SYNO.SS.Ssc.IsHwDecodePrefered()) || (false === SYNO.SS.Ssc.IsHwDecodeAllow(this.MIME_HEV1 === a)) || (false === Ext.isFunction(b.mediaSource.SetHWAccel))) {
return false
}
return SYNO.SS.Ssc.HasGpuResouce(this.gpuRes, this.parent.id)
},
CreateMediaSource: function(b, a) {
if (("MediaSource" in window) && (MediaSource.isTypeSupported(a))) {
b.mediaSource = new MediaSource();
if (true === SYNO.SS.Utils.IsSsc()) {
if (true === this.IsVideoHwDecode(b, a)) {
b.mediaSource.SetHWAccel(true);
SYNO.SS.Ssc.UpdateGpuResource(this.parent.id, this.gpuRes.auto)
} else {
if ((true === Ext.isFunction(b.mediaSource.SetQuality)) && (true === SYNO.SS.Ssc.IsHighQuality())) {
b.mediaSource.SetQuality(true)
}
}
}
b.fnSourceOpen = this.AddSourceBuffer.createDelegate(this, [b, a]);
b.mediaSource.addEventListener("sourceopen", b.fnSourceOpen);
b.dom.src = URL.createObjectURL(b.mediaSource)
}
},
AddSourceBuffer: function(b, a) {
if ((!b.mediaSource) || (b.sourceBuffer)) {
return
}
b.mediaSource.removeEventListener("sourceopen", b.fnSourceOpen);
b.fnSourceOpen = null;
b.sourceBuffer = b.mediaSource.addSourceBuffer(a);
b.sourceBuffer.mode = "sequence";
b.mediaSource.duration = Infinity;
b.sourceBuffer.addEventListener("updateend", function() {
if (false === this.IsValidMediaSource(b.mediaSource)) {
return
}
if (true === this.ClearBuf(b)) {
return
}
if ((0 < b.queue.length) && (false === b.blTabBlured) && ((0 === this.delayPlayMs) || (this.delayPlayMs <= this.lastFrameTmStampInQ - b.queue[0].frameTmStamp))) {
b.appendBufTimer = setTimeout(this.AppendBuffer.createDelegate(this, [b]), 0)
} else {
b.needData = true
}
}.createDelegate(this));
b.blPlayerReady = true
},
IsValidMediaSource: function(a) {
if (a) {
return ("open" === a.readyState)
}
return false
},
GetBuffered: function(c) {
var a = null;
if (c.sourceBuffer) {
try {
a = c.sourceBuffer.buffered
} catch (b) {}
}
return a
},
GetBufferedEnd: function(b) {
var a = this.GetBuffered(b) || [];
return (0 < a.length) ? a.end(a.length - 1) : -1
},
ClearBuf: function(e) {
var d = e.dom;
var c = this.GetBuffered(e);
var b, a;
if ((!d) || (!c) || (0 >= c.length) || (true === e.blTabBlured)) {
return false
}
b = c.start(0);
this.AdjustTrackCurTime(e, b);
if (("VIDEO" === d.tagName) && (true === Ext.isFunction(this.fnSyncLatency))) {
a = c.end(c.length - 1);
this.fnSyncLatency(a - d.currentTime)
}
return this.RemoveSourceBuffer(e, b)
},
RemoveSourceBuffer: function(d, b) {
var c = d.dom;
var a = 0;
if (3 > (c.currentTime - d.lastClearTm)) {
return false
}
d.lastClearTm = c.currentTime;
while ((0 < d.lastEndTimeArray.length) && (d.lastEndTimeArray[0] < c.currentTime)) {
a = d.lastEndTimeArray.shift()
}
if (a - 0.5 > b) {
d.sourceBuffer.remove(b, a - 0.5);
return true
}
return false
},
AdjustTrackCurTime: function(c, a) {
var b = c.dom;
this.SeekIfOverDelayTime(c, b);
if ((3 < c.sameCurTmCnt) && (a > b.currentTime)) {
b.currentTime = a
}
},
SeekIfOverDelayTime: function(f, e) {
var a = f.lastEndTimeArray[f.lastEndTimeArray.length - 1] || f.lastEndTm;
if (a === f.lastEndTm) {
return
}
f.lastEndTm = a;
var c = Date.now();
if (5000 > Math.abs(c - f.seekOverDelayMs)) {
return
}
var b = this.GetMaxDelayTm(e);
var d = Math.max(this.GetBufferedEnd(f), a) - e.currentTime;
if ((this.SHOW_VDO_DELAY) && ("VIDEO" === e.tagName)) {
console.log(String.format("Time[{0}], Delay[{1} / {2}].", (c - f.seekOverDelayMs) / TRANS_MILLISECOND, (a - e.currentTime).toFixed(3), d.toFixed(3)), e)
}
if ((d > b) && (a > e.currentTime)) {
e.currentTime = a;
f.seekOverDelayMs = c
}
},
GetMaxDelayTm: function(a) {
if ((true === a.paused) || (SYNO.SS.App.WebPlayer.Def.StreamSrc.RECORD === this.stmSrc) || (true === Ext.isEdge)) {
return 10
}
return 1
},
IsValidCurTime: function(b) {
var a = ("VIDEO" === b.dom.tagName) ? 5 : 480;
return (a > b.sameCurTmCnt)
},
AppendBuffer: function(d) {
if ((!d.dom) || (0 === d.queue.length)) {
return
}
var b = d.queue.shift();
var a = this.GetBufferedEnd(d);
if (this.fnBufferUpdateEndCallback) {
this.fnBufferUpdateEndCallback(b.frameId)
}
if ("VIDEO" === d.dom.tagName) {
if (true === b.blIFrame) {
d.iframeCounter--;
if (true === this.NeedCalcVdoSameCurTmCnt(d)) {
this.CalcSameCurTmCnt(d)
}
if (-1 !== a) {
d.lastEndTimeArray.push(a)
}
}
if ((this.currentTimeTimer) && (-1 !== a)) {
this.currentTimeTimer.RegFrameTime(b.frameTime, a)
}
} else {
this.CalcSameCurTmCnt(d);
if (-1 !== a) {
d.lastEndTimeArray.push(a)
}
}
if (false === this.IsValidCurTime(d)) {
d.mediaSource = null;
return
}
try {
d.sourceBuffer.appendBuffer(b.frame)
} catch (c) {
d.mediaSource = null
}
if (d.fnOnNextFrameUpdateend) {
SYNO.SDS.Utils.AddOneTimeEvtListener(d.sourceBuffer, "updateend", d.fnOnNextFrameUpdateend);
delete d.fnOnNextFrameUpdateend
}
},
NeedCalcVdoSameCurTmCnt: function(b) {
var a = Date.now();
if (1000 <= Math.abs(a - b.lastIframeTmstmp)) {
b.lastIframeTmstmp = a;
return true
}
return false
},
CalcSameCurTmCnt: function(a) {
if (true === this.fnIsManualPaused()) {
return
}
if (a.prevCurTm === a.dom.currentTime) {
a.sameCurTmCnt++
} else {
a.prevCurTm = a.dom.currentTime;
a.sameCurTmCnt = 0
}
},
GetNode: function() {
if (true === Ext.isEmpty(this.trackObjArray[this.VIDEO_INDEX])) {
return undefined
}
return this.trackObjArray[this.VIDEO_INDEX].dom
},
OnWSMessage: function(a) {
var c, g, f, e, h;
var b = false,
d = 0;
if (!(a.data instanceof ArrayBuffer)) {
return
}
c = new Uint8Array(a.data);
h = SYNO.SS.App.WebPlayer.Utils.BufParseHeader(c);
this.parent.fireEvent("frameReceive", a.data.byteLength, (this.VIDEO_INDEX === this.wsMessageReader.GetAudioFlag(h)));
if (this.parent.cmdStamp !== this.wsMessageReader.GetCmdStamp(h)) {
this.InitTrackObj(h);
return
}
if ((this.fnReceiveMeta) && (false == Ext.isEmpty(h.metaType))) {
this.fnReceiveMeta(h, this.wsMessageReader.GetRawData(h, c));
return
}
if (true === this.wsMessageReader.IsCloseMsg(h)) {
this.OnWSClose(null, this.wsMessageReader.GetEndReason(h));
return
}
if (true == this.InitTrackObj(h)) {
return
}
g = this.wsMessageReader.GetRawData(h, c);
f = this.trackObjArray[this.wsMessageReader.GetAudioFlag(h)];
if ((true === Ext.isEmpty(f)) || (0 >= g.length)) {
return
}
if ("VIDEO" === f.dom.tagName) {
if (this.fnUpdateStreamTm) {
d = this.wsMessageReader.GetFrameTimeMSec(h)
}
if (this.IsContainFrame(g)) {
e = this.wsMessageReader.GetFrameId(h)
} else {
e = 0
}
this.RemoveQueueByMp4Header(f);
if (true === this.wsMessageReader.IsIFrame(h)) {
f.iframeCounter++;
b = true
}
} else {
if ("AUDIO" === f.dom.tagName) {
if (this.audioFrameLimit < f.queue.length) {
f.queue.splice(0, 10)
}
}
}
this.lastFrameTmStampInQ = Date.now();
f.queue.push({
blIFrame: b,
frameTime: d,
frame: g,
frameId: e,
frameTmStamp: this.lastFrameTmStampInQ
});
if (false === f.blPlayerReady) {
return
}
if (false === this.IsValidMediaSource(f.mediaSource)) {
if ("AUDIO" === f.dom.tagName) {
f.queue.length = 0
} else {
this.ReconnectStream(50)
}
return
}
if ((true === f.needData) && (false === f.blTabBlured) && ((0 === this.delayPlayMs) || (this.delayPlayMs <= this.lastFrameTmStampInQ - f.queue[0].frameTmStamp))) {
this.AppendBuffer(f);
f.needData = false
}
},
InitTrackObj: function(c) {
var b, a = false;
if (c.vdoCodec) {
b = this.trackObjArray[this.VIDEO_INDEX];
if ((b) && (false === b.blInited)) {
b.blInited = true;
if ("H265" === c.vdoCodec) {
this.CreateMediaSource(b, this.MIME_HEV1)
} else {
if ("MP4V-ES" === c.vdoCodec) {
this.CreateMediaSource(b, this.MIME_MPEG4)
} else {
if ("JPEG" === c.vdoCodec) {
this.CreateMediaSource(b, this.MIME_MJPEG)
} else {
this.CreateMediaSource(b, this.MIME_AVC1)
}
}
}
}
a = true
}
if (c.adoCodec) {
b = this.trackObjArray[this.AUDIO_INDEX];
if ((b) && (false === b.blInited)) {
b.blInited = true;
this.wsHandler.SendCmd("mute=" + b.dom.muted);
this.CreateMediaSource(b, this.AdoCodec2Mime(c.adoCodec))
}
a = true
}
return a
},
AdoCodec2Mime: function(a) {
a = a.toUpperCase();
if (("MP4A-LATM" === a) || ("MPEG4-GENERIC" === a) || (true === Ext.isEdge)) {
return this.MIME_AAC
} else {
return ((IS_CHROME_BROWSER) || (IS_SAFARI_BROWSER)) ? this.MIME_MP3_IN_MPEG : this.MIME_MP3_IN_MP4
}
},
OnWSClose: function(a, b) {
var c = this.trackObjArray[this.VIDEO_INDEX];
if (SYNO.SS.App.WebPlayer.Def.StreamSrc.LIVE === this.stmSrc) {
if (this.fnOnRetry) {
this.fnOnRetry()
}
this.ReconnectStream(2000);
return
}
if ((false === Ext.isEmpty(c)) && (false === c.blPlayerReady)) {
this.OnStreamEnded(b);
return
}
this.FlushAndWaitStreamEnd()
},
FlushAndWaitStreamEnd: function() {
this.trackIndices.forEach(function(a) {
if (false === Ext.isEmpty(this.trackObjArray[a])) {
this.FlushMediaSource(this.trackObjArray[a])
}
}, this);
if (true === this.blFrameReady) {
this.RegVdoEndedPollingTask()
} else {
this.OnStreamEnded()
}
},
OnStreamEnded: function(a) {
if (this.fnOnStreamEnded) {
this.fnOnStreamEnded(a);
this.fnOnStreamEnded = null
}
this.CancelFillTime()
},
ReconnectStream: function(a) {
this.ClearDomEvent();
this.DestroyWSHandler();
this.CancelFillTime();
if (this.resetTaskId) {
clearTimeout(this.resetTaskId);
this.resetTaskId = null
}
this.resetTaskId = setTimeout(this.parent.ReplaceVideoInst.createDelegate(this.parent), a)
},
FlushMediaSource: function(a) {
if ((false === a.blPlayerReady) || (false === this.IsValidMediaSource(a.mediaSource))) {
return
}
if (true === a.sourceBuffer.updating) {
a.sourceBuffer.onupdateend = function() {
if ((this.sourceBuffer) && (true === this.sourceBuffer.updating)) {
return
}
if (this.sourceBuffer) {
this.sourceBuffer.onupdateend = null
}
if ((this.mediaSource) && ("open" === this.mediaSource.readyState)) {
this.mediaSource.endOfStream()
} else {
if ((this.dom) && (this.dom.onended)) {
this.dom.onended()
}
}
}.createDelegate(a)
} else {
a.mediaSource.endOfStream()
}
},
RegVdoEndedPollingTask: function() {
var a = this.trackObjArray[this.VIDEO_INDEX];
if ((!this.fnOnStreamEnded) || (true === Ext.isEmpty(a))) {
return
}
this.CalcSameCurTmCnt(a);
if (5 <= a.sameCurTmCnt) {
this.OnStreamEnded();
return
}
this.CancelVdoEndedPollingTask();
this.vdoEndedPollingTaskId = this.RegVdoEndedPollingTask.defer(1000, this)
},
CancelVdoEndedPollingTask: function() {
if (this.vdoEndedPollingTaskId) {
clearTimeout(this.vdoEndedPollingTaskId);
this.vdoEndedPollingTaskId = null
}
},
ClearAppendBufTimer: function(a) {
if (a.appendBufTimer) {
clearTimeout(a.appendBufTimer);
a.appendBufTimer = null
}
},
ClearDomEvent: function() {
this.trackIndices.forEach(function(a) {
var b = this.trackObjArray[a];
if (b.dom) {
b.dom.oncanplay = null;
b.dom.ontimeupdate = null;
b.dom.onended = null
}
this.ClearAppendBufTimer(b)
}, this)
},
Deactivate: function() {
var a = this.trackObjArray[this.VIDEO_INDEX];
if ((!IS_SAFARI_BROWSER) && (false === Ext.isEmpty(a)) && (a.dom)) {
a.dom.removeEventListener("canplay", this.fnRegResetTask)
}
this.fnRegResetTask = null;
this.fnOnStreamEnded = null;
this.fnUpdateStreamTm = null;
this.ClearDomEvent();
this.DestroyWSHandler();
this.DestroyVideoSrc();
this.CancelVdoEndedPollingTask();
this.CancelFillTime();
this.parent = null;
if (this.resetTaskId) {
clearTimeout(this.resetTaskId);
this.resetTaskId = null
}
if ((true === IS_CHROME_BROWSER) && (false === Ext.isEdge)) {
document.removeEventListener("visibilitychange", this.fnCheckTabVisibility);
this.fnCheckTabVisibility = null
}
},
DestroyWSHandler: function() {
if ((this.wsHandler) && (true === this.blDestroyWS)) {
this.wsHandler.Destroy()
}
this.wsHandler = null
},
DestroyVideoSrc: function() {
this.trackIndices.forEach(function(a) {
var b = this.trackObjArray[a];
b.needData = true;
b.blPlayerReady = false;
b.sourceBuffer = null;
b.mediaSource = null;
b.blInited = false;
b.queue.length = 0;
b.iframeCounter = 0;
b.lastEndTimeArray.length = 0;
b.sameCurTmCnt = 0;
b.prevCurTm = 0;
b.lastClearTm = 0;
b.lastIframeTmstmp = 0;
if (b.dom) {
URL.revokeObjectURL(b.dom.src);
b.dom.src = "";
b.dom.removeEventListener("canplay", b.dom.fnVideoInitialized);
b.dom.fnVideoInitialized = null;
b.dom.removeEventListener("canplay", b.dom.fnOnFirstFrame);
b.dom.fnOnFirstFrame = null;
b.dom = null
}
}, this)
},
SendCmd: function(a) {
if (this.wsHandler) {
this.wsHandler.SendCmd(a)
}
},
Resume: function() {
this.trackIndices.forEach(function(a) {
var b = this.trackObjArray[a];
if (SYNO.SS.App.WebPlayer.Def.StreamSrc.RECORD !== this.stmSrc) {
this.MoveTimeToBufEnd(b)
}
if (false === b.blPlayerReady) {
return
}
if (true === b.dom.paused) {
SYNO.SS.Utils.CatchRejectionPlay(b.dom)
}
}, this);
this.SendCmd("pause=false")
},
Pause: function() {
this.trackIndices.forEach(function(a) {
var b = this.trackObjArray[a];
if (false === b.blPlayerReady) {
return
}
if (false === b.dom.paused) {
b.dom.pause()
}
}, this);
this.SendCmd("pause=true");
this.CancelFillTime()
},
Seek: function(a) {
this.SeekMs(a * TRANS_MILLISECOND)
},
SeekMs: function(c, a) {
var d = Math.round(c / TRANS_MILLISECOND);
var b = Number.MAX_SAFE_INTEGER;
this.CancelFillTime();
if (this.wsHandler) {
b = this.wsHandler.config.param.end
}
if ((0 < b) && (b < d)) {
this.OnStreamEnded();
return
}
a = a || "";
if (true === this.fnIsManualPaused()) {
a += String.format("&pause=false&flushToMs={0}", c + TRANS_MILLISECOND)
}
this.MoveTimeToNextFrame();
this.SendCmd(String.format("seekMs={0}{1}{2}", c, a, this.AppendStampCmd()));
if (this.currentTimeTimer) {
this.currentTimeTimer.SeekMs(c)
}
},
SetSpeed: function(a) {
this.streamSpeed = a;
this.SendCmd("speed=" + a);
try {
this.trackObjArray[this.AUDIO_INDEX].dom.playbackRate = a
} catch (b) {}
this.trackIndices.forEach(function(c) {
this.MoveTimeToBufEnd(this.trackObjArray[c])
}, this)
},
SetMute: function(a) {
if (this.wsHandler) {
this.wsHandler.SendCmd("mute=" + a)
}
if (false === Ext.isEmpty(this.trackObjArray[this.AUDIO_INDEX])) {
this.trackObjArray[this.AUDIO_INDEX].dom.muted = a
}
},
SetVolume: function(a) {
if (false === Ext.isEmpty(this.trackObjArray[this.AUDIO_INDEX])) {
if ((0 <= a) && (1 >= a)) {
this.trackObjArray[this.AUDIO_INDEX].dom.volume = a
}
}
},
GetVolume: function() {
if (false === Ext.isEmpty(this.trackObjArray[this.AUDIO_INDEX])) {
return this.trackObjArray[this.AUDIO_INDEX].dom.volume
} else {
return 0
}
},
CheckTabVisibility: function() {
var a = this.trackObjArray[this.VIDEO_INDEX];
if (!a) {
return
}
if (document.hidden) {
a.blTabBlured = true
} else {
if (a.dom) {
a.dom.currentTime = a.dom.currentTime
}
a.blTabBlured = false
}
},
SetState: function(c) {
SYNO.SS.App.WebPlayer.Utils.SetGeneralState(this, c);
var b = this.trackObjArray[this.VIDEO_INDEX];
var a = this.trackObjArray[this.AUDIO_INDEX];
if ((true === Ext.isDefined(b)) && (true === Ext.isDefined(c.video))) {
b.blTabBlured = c.video.blTabBlured
}
if ((true === Ext.isDefined(a)) && (true === Ext.isDefined(c.audio))) {
a.blTabBlured = c.audio.blTabBlured;
a.dom.volume = c.audio.volume;
a.dom.muted = c.audio.muted
}
},
GetState: function() {
var c = SYNO.SS.App.WebPlayer.Utils.GetGeneralState(this);
var b = this.trackObjArray[this.VIDEO_INDEX];
var a = this.trackObjArray[this.AUDIO_INDEX];
if (true === Ext.isDefined(b)) {
c.video = {};
c.video.blTabBlured = b.blTabBlured
}
if (true === Ext.isDefined(a)) {
c.audio = {};
c.audio.blTabBlured = a.blTabBlured;
c.audio.volume = a.dom.volume;
c.audio.muted = a.dom.muted
}
return c
},
IsContainFrame: function(a) {
var b;
var c = a.length;
if (8 > c) {
return false
}
if ((109 !== a[4]) || (111 !== a[5]) || (111 !== a[6]) || (102 !== a[7])) {
return false
}
b = (a[0] << 24) + (a[1] << 16) + (a[2] << 8) + a[3];
if (c < b + 13) {
return false
}
if ((109 !== a[b + 4]) || (100 !== a[b + 5]) || (97 !== a[b + 6]) || (116 !== a[b + 7])) {
return false
}
return true
},
RemoveQueueByMp4Header: function(c) {
var b, a;
if (this.videoIFrameLimit >= c.iframeCounter) {
return
}
for (b = 0; b < c.queue.length; b++) {
if (true === c.queue[b].blIFrame) {
break
}
}
for (a = b; a < c.queue.length; a++) {
if (true === c.queue[a].blIFrame) {
if (this.videoIFrameLimit >= c.iframeCounter) {
break
}
c.iframeCounter--
}
}
if (a > b) {
c.queue.splice(b, a - b)
}
},
MoveTimeToNextFrame: function() {
if (true == Ext.isEdge) {
return
}
this.trackIndices.forEach(function(a) {
var b = this.trackObjArray[a];
this.MoveTimeToBufEnd(b);
b.fnOnNextFrameUpdateend = this.MoveTimeToBufEnd.createDelegate(this, [b]);
this.ClearAppendBufTimer(b);
b.queue.length = 0;
b.needData = true
}, this)
},
MoveTimeToBufEnd: function(b) {
if (true == Ext.isEdge) {
return
}
var a = this.GetBufferedEnd(b);
if ((b.dom) && (0 <= a)) {
b.dom.currentTime = a
}
},
GetCurStreamTm: function() {
return this.currentTimeTimer.GetCurrentTime()
},
UpdateStreamTime: function(a) {
this.currentTimeTimer.SyncFrameTime(a);
if (true === this.currentTimeTimer.IsTimeChange()) {
this.filledTm = 0;
this.UpdateStreamTimeImpl(this.currentTimeTimer.GetCurrentTime())
}
},
UpdateStreamTimeImpl: function(a) {
if (!this.fnUpdateStreamTm) {
return
}
this.fnUpdateStreamTm(a);
if ((true === this.IsHighFreqTimeupdate) || ((true === Ext.isFunction(this.IsHighFreqTimeupdate))) && (true === this.IsHighFreqTimeupdate())) {
this.SetupFillTime(a)
}
},
CancelFillTime: function() {
if (this.fillTmTask) {
clearTimeout(this.fillTmTask);
this.fillTmTask = null
}
},
SetupFillTime: function(a) {
this.CancelFillTime();
if (false === this.fnIsManualPaused()) {
this.fillTmTask = Ext.defer(this.OnFillTime, 33, this, [a, window.performance.now()])
}
},
OnFillTime: function(c, a) {
var b = (window.performance.now() - a);
this.filledTm += b;
if (250 < this.filledTm) {
return
}
this.UpdateStreamTimeImpl(c + b * this.streamSpeed)
},
AppendStampCmd: function() {
return "&stamp=" + (++this.parent.cmdStamp)
},
DrawSnapshot: function(a, b) {
SYNO.SS.App.WebPlayer.Utils.DrawRawImage(this.GetNode(), a, b)
}
});
Ext.define("SYNO.SS.App.WebPlayer.Html5VideoTagPlayer", {
extend: "SYNO.SS.App.WebPlayer.Html5MediaPlayerBase"
});
Ext.define("SYNO.SS.App.WebPlayer.Html5AudioTagPlayer", {
extend: "SYNO.SS.App.WebPlayer.Html5MediaPlayerBase",
InitTrackIndices: function() {
this.trackIndices = [this.AUDIO_INDEX]
}
});
Ext.define("SYNO.SS.App.WebPlayer.MultiSourcePlayerWrap", {
videoPlayer: null,
audioPlayer: null,
constructor: function(b, a) {
this.videoPlayer = b;
this.audioPlayer = a;
var c = ["OnStreamEnded", "Deactivate", "Pause", "Resume", "SetSpeed", "SetMute", "SetVolume", "UpdateStreamTime"];
c.forEach(function(e) {
this[e] = function() {
this.videoPlayer[e].apply(this.videoPlayer, arguments);
this.audioPlayer[e].apply(this.audioPlayer, arguments)
}
}, this);
var d = ["IsWebSocketNotConnectYet", "IsWebSocketStatusNormal", "IsWebSocketConnectFailed"];
d.forEach(function(e) {
this[e] = function() {
return (this.videoPlayer[e].apply(this.videoPlayer, arguments) && this.audioPlayer[e].apply(this.audioPlayer, arguments))
}
}, this)
},
GetState: function() {
var b = this.videoPlayer.GetState();
var a = this.audioPlayer.GetState();
if (true === Ext.isDefined(a.audio)) {
b.audio = a.audio
}
return b
},
SetState: function(a) {
this.videoPlayer.SetState(a);
this.audioPlayer.SetState(a)
},
GetNode: function() {
return this.videoPlayer.GetNode(arguments)
},
GetVolume: function() {
return this.audioPlayer.GetVolume(arguments)
},
GetCurStreamTm: function() {
return this.videoPlayer.GetCurStreamTm(arguments)
}
});
Ext.define("SYNO.SS.App.WebPlayer.ImgTagPlayer", {
parent: null,
wsHandler: null,
stmSrc: null,
blFrameReady: false,
curStreamTm: 0,
imgDom: null,
fnUpdateStreamTm: null,
fnOnStreamEnded: null,
fnOnRetry: null,
blDestroyWS: true,
wsMessageReader: null,
fnBufferUpdateEndCallback: null,
constructor: function(a) {
this.wsMessageReader = SYNO.SS.App.WebPlayer.Utils.MessageReader;
this.parent = a.parent;
this.stmSrc = a.stmSrc;
this.fnUpdateStreamTm = a.fnUpdateStreamTm;
this.fnOnStreamEnded = a.fnOnStreamEnded;
this.fnOnRetry = a.fnOnRetry;
this.fnBufferUpdateEndCallback = a.fnBufferUpdateEndCallback;
this.fnIsManualPaused = a.fnIsManualPaused;
this.Init(a);
a.fnOnWSMessage = this.OnWSMessage.createDelegate(this);
a.fnOnWSClose = this.OnWSClose.createDelegate(this);
if (a.wsHandler) {
this.wsHandler = a.wsHandler;
this.wsHandler.ChangeConfig(a);
this.blDestroyWS = false
} else {
this.wsHandler = new SYNO.SS.App.WebPlayer.WSStreamHandler(a)
}
},
IsWebSocketNotConnectYet: function() {
return (this.wsHandler) ? this.wsHandler.IsNotConnectYet() : false
},
IsWebSocketStatusNormal: function() {
return (this.wsHandler) ? this.wsHandler.IsConnectStatusNormal() : false
},
IsWebSocketConnectFailed: function() {
return (this.wsHandler) ? this.wsHandler.IsConnectFailed() : false
},
Init: function(a) {
this.curStreamTm = a.param.start || 0;
this.imgDom = SYNO.SS.Utils.CreateNonDraggableImg();
this.imgDom.setAttribute("style", "width: 100%; height: 100%; object-fit: fill; position: absolute;");
this.imgDom.lock = false;
this.imgDom.onload = function(b) {
URL.revokeObjectURL(b.target.src);
this.lock = false
};
this.imgDom.onerror = function(b) {
this.lock = false
};
SYNO.SS.App.WebPlayer.Utils.RegFirstFrameInitFunc(this.imgDom, this, "load")
},
Deactivate: function() {
this.fnOnStreamEnded = null;
this.DestroyWSHandler();
if (this.resetTaskId) {
clearTimeout(this.resetTaskId);
this.resetTaskId = null
}
if (this.imgDom) {
URL.revokeObjectURL(this.imgDom.src);
this.imgDom.setAttribute("style", "display: none");
this.imgDom.removeEventListener("load", this.imgDom.fnVideoInitialized);
this.imgDom.fnVideoInitialized = null;
this.imgDom.removeEventListener("load", this.imgDom.fnOnFirstFrame);
this.imgDom.fnOnFirstFrame = null;
this.imgDom = null
}
this.parent = null
},
DestroyWSHandler: function() {
if ((this.wsHandler) && (true === this.blDestroyWS)) {
this.wsHandler.Destroy()
}
this.wsHandler = null
},
OnWSMessage: function(a) {
var b, e, d, c;
if (!(a.data instanceof ArrayBuffer)) {
return
}
this.parent.fireEvent("frameReceive", a.data.byteLength, true);
b = new Uint8Array(a.data);
d = SYNO.SS.App.WebPlayer.Utils.BufParseHeader(b);
if ((this.parent.cmdStamp !== this.wsMessageReader.GetCmdStamp(d)) || (d.vdoCodec)) {
return
}
if (true === this.wsMessageReader.IsCloseMsg(d)) {
this.OnWSClose(null, this.wsMessageReader.GetEndReason(d));
return
}
if (this.fnUpdateStreamTm) {
e = this.wsMessageReader.GetFrameTimeMSec(d);
if (e !== this.curStreamTm) {
this.curStreamTm = e;
this.fnUpdateStreamTm(e)
}
}
if (this.fnBufferUpdateEndCallback) {
this.fnBufferUpdateEndCallback(this.wsMessageReader.GetFrameId(d))
}
if ((this.imgDom) && (false === this.imgDom.lock)) {
this.imgDom.lock = true;
c = this.wsMessageReader.GetRawData(d, b);
this.imgDom.src = URL.createObjectURL(new Blob([c], {
type: "image/jpeg"
}))
}
},
OnWSClose: function(a, b) {
if (SYNO.SS.App.WebPlayer.Def.StreamSrc.LIVE === this.stmSrc) {
if (this.fnOnRetry) {
this.fnOnRetry()
}
this.ReconnectStream(2000);
return
}
this.OnStreamEnded(b)
},
OnStreamEnded: function(a) {
if (this.fnOnStreamEnded) {
this.fnOnStreamEnded(a);
this.fnOnStreamEnded = null
}
},
ReconnectStream: function(a) {
this.DestroyWSHandler();
clearTimeout(this.resetTaskId);
this.resetTaskId = setTimeout(function() {
this.resetTaskId = null;
this.parent.ReplaceVideoInst()
}.createDelegate(this), a)
},
GetNode: function() {
return this.imgDom
},
Resume: function() {
this.wsHandler.SendCmd("pause=false")
},
Pause: function() {
this.wsHandler.SendCmd("pause=true")
},
Seek: function(a) {
this.SeekMs(a * TRANS_MILLISECOND)
},
SeekMs: function(b, a) {
var c = String.format("seekMs={0}{1}{2}", b, a || "", this.AppendStampCmd());
this.wsHandler.SendCmd(c)
},
SetSpeed: function(a) {
this.wsHandler.SendCmd("speed=" + a)
},
SetMute: Ext.emptyFn,
SetVolume: Ext.emptyFn,
SetState: function(a) {
SYNO.SS.App.WebPlayer.Utils.SetGeneralState(this, a)
},
GetState: function() {
return SYNO.SS.App.WebPlayer.Utils.GetGeneralState(this)
},
GetCurStreamTm: function() {
return this.curStreamTm
},
AppendStampCmd: function() {
return "&stamp=" + (++this.parent.cmdStamp)
},
DrawSnapshot: function(a, b) {
SYNO.SS.App.WebPlayer.Utils.DrawRawImage(this.GetNode(), a, b)
}
});
Ext.define("SYNO.SS.App.WebPlayer.TimeOutPlayer", {
startMSec: 0,
endMSec: 0,
fnUpdateStreamTm: null,
fnOnStreamEnded: null,
constructor: function(a) {
this.startMSec = a.param.start * TRANS_MILLISECOND;
this.endMSec = a.param.end * TRANS_MILLISECOND;
this.fnUpdateStreamTm = a.fnUpdateStreamTm;
this.fnOnStreamEnded = a.fnOnStreamEnded;
this.Init(a)
},
IsWebSocketNotConnectYet: function() {
return false
},
IsWebSocketStatusNormal: function() {
return true
},
IsWebSocketConnectFailed: function() {
return false
},
Init: function(a) {
this.bgDom = document.createElement("div");
this.valueMSec = this.startMSec;
setTimeout(function() {
this.bgDom.dispatchEvent(new Event("load"));
this.StartTimer()
}.bind(this), 0)
},
Deactivate: function() {
this.fnOnStreamEnded = null;
this.StopTimer();
this.bgDom = null
},
StartTimer: function() {
if (this.clockTask) {
return
}
var a = window.performance.now();
this.clockTask = setInterval(function() {
var b = window.performance.now();
this.valueMSec += b - a;
this.fnUpdateStreamTm(this.valueMSec);
if (this.endMSec <= this.valueMSec) {
this.StopTimer();
this.OnStreamEnded()
}
a = b
}.createDelegate(this), 200);
this.fnUpdateStreamTm(this.valueMSec)
},
StopTimer: function() {
if (this.clockTask) {
clearInterval(this.clockTask);
this.clockTask = null
}
},
GetCurStreamTm: function() {
return this.valueMSec - this.startMSec
},
OnStreamEnded: function() {
if (this.fnOnStreamEnded) {
this.fnOnStreamEnded();
this.fnOnStreamEnded = null
}
},
GetNode: function() {
return this.bgDom
},
Resume: function() {
this.StartTimer()
},
Pause: function() {
this.StopTimer()
},
Seek: function(a) {
this.StopTimer();
this.valueMSec = a * TRANS_MILLISECOND;
this.StartTimer()
},
DrawSnapshot: Ext.emptyFn,
SetSpeed: Ext.emptyFn,
SetMute: Ext.emptyFn,
SetVolume: Ext.emptyFn
});
Ext.define("SYNO.SS.App.WebPlayer.PPApiPluginPlayer", {
VOL_MAX: 100,
currentMSec: 0,
streamSpeed: 1,
blMute: false,
volume: 50,
fnIsManualPaused: null,
fnUpdateStreamTm: null,
fnOnStreamEnded: null,
fnBufferUpdateEndCallback: null,
fnReceiveMeta: null,
snapshotCanvas: null,
fnPostDrawSnapshot: null,
embedDom: null,
constructor: function(a) {
this.fnIsManualPaused = a.fnIsManualPaused;
this.fnUpdateStreamTm = a.fnUpdateStreamTm;
this.fnOnStreamEnded = a.fnOnStreamEnded;
this.fnBufferUpdateEndCallback = a.fnBufferUpdateEndCallback;
this.fnReceiveMeta = a.fnReceiveMeta;
this.Init(a)
},
IsWebSocketNotConnectYet: function() {
return false
},
IsWebSocketStatusNormal: function() {
return true
},
IsWebSocketConnectFailed: function() {
return false
},
Init: function(c) {
var f = document.createElement("embed");
var b = {};
var g = SYNO.SS.App.WebPlayer.Utils.ParseReso(c.resolution);
var d;
var a = c.param.start * TRANS_MILLISECOND || 0;
var e = c.param.end * TRANS_MILLISECOND || 0;
b.fisheye_config = c.Plugin.fisheyeConfig;
b.analytics_config = c.Plugin.analyticsConfig;
c.WSTarget = "ss_webstream_task";
f.setAttribute("style", "width: 100%; height: 100%; object-fit: fill; position: absolute;");
f.setAttribute("type", "application/x-video-plugin");
f.setAttribute("url", SYNO.SS.App.WebPlayer.ConnUtils.GetDirectUrl(c));
f.setAttribute("relayurl", SYNO.SS.App.WebPlayer.ConnUtils.GetRelayUrl(c));
f.setAttribute("blforcerelay", SYNO.SS.App.WebPlayer.ConnUtils.IsForceRelay(c.dsId));
f.setAttribute("cookie", PPapiPlugin.GetAdditionCookie());
f.setAttribute("options", JSON.stringify(b));
f.setAttribute("blliveview", (!!c.Plugin.blLiveview).toString());
f.setAttribute("starttimems", a.toString());
f.setAttribute("endtimems", e.toString());
f.setAttribute("volume", c.volume * this.VOL_MAX);
if (true === Ext.isEmpty(b.fisheye_config)) {
f.setAttribute("videoWidth", (g[0]).toString());
f.setAttribute("videoHeight", (g[1]).toString())
} else {
d = SYNO.SS.Ssc.GetFisheyeDewarpReso(g, b.fisheye_config);
f.setAttribute("videoWidth", d.width);
f.setAttribute("videoHeight", d.height)
}
f.addEventListener("message", function(i) {
var l = i.data.method;
var k = i.data.resp;
var j;
var h;
if ("updateAnalyticsAlert" === l) {
f.dispatchEvent(new CustomEvent("updateAnalyticsAlert", {
detail: k
}))
} else {
if ("fisheyePolygonUpdate" === l) {
f.dispatchEvent(new CustomEvent("fisheyePolygonUpdate", {
detail: k
}))
} else {
if ("fisheyeRegionInfoUpdate" === l) {
f.dispatchEvent(new CustomEvent("fisheyeRegionInfoUpdate", {
detail: k
}))
} else {
if ("playerStop" === l) {
this.OnStreamEnded()
} else {
if ("playerStart" === l) {
f.dispatchEvent(new Event("load"));
this.OnCanPlay()
} else {
if ("UpdateStream" === l) {
this.currentMSec = parseInt(k.timestamp, 10);
if (true === isFinite(this.currentMSec)) {
this.UpdateStreamTime()
} else {
this.OnStreamEnded()
}
} else {
if ("frameSizeCount" === l) {
f.dispatchEvent(new CustomEvent("frameSizeCount", {
detail: k
}))
} else {
if ("snapshot" === l) {
this.OnPostGetSnapshot(k)
} else {
if ("recMeta" === l) {
j = JSON.parse(k.strHeader);
h = JSON.parse(k.meta);
this.fnReceiveMeta(j, undefined, h)
} else {
if ("setForceRelay" === l) {
SYNO.SS.App.WebPlayer.ConnUtils.SetForceRelay(c.dsId)
}
}
}
}
}
}
}
}
}
}
}.createDelegate(this));
this.embedDom = f
},
Deactivate: function() {
this.fnOnStreamEnded = null;
this.fnIsManualPaused = null;
this.fnUpdateStreamTm = null;
this.embedDom = null
},
GetCurStreamTm: function() {
return this.currentMSec
},
UpdateStreamTime: function() {
if (this.fnUpdateStreamTm) {
this.fnUpdateStreamTm(this.currentMSec)
}
if (this.fnBufferUpdateEndCallback) {
this.fnBufferUpdateEndCallback(this.currentMSec * TRANS_MILLISECOND)
}
},
OnStreamEnded: function() {
if (this.fnOnStreamEnded) {
this.fnOnStreamEnded();
this.fnOnStreamEnded = null
}
},
GetNode: function() {
return this.embedDom
},
Resume: function() {
this.SendCmd("pause=false")
},
Pause: function() {
this.SendCmd("pause=true")
},
Seek: function(a) {
this.currentMSec = a * TRANS_MILLISECOND;
this.SeekMs(this.currentMSec)
},
SeekMs: function(b, a) {
var c = String.format("seekMs={0}{1}", b, a || "");
this.SendCmd(c)
},
SetSpeed: function(a) {
if (this.streamSpeed !== a) {
this.streamSpeed = a;
this.SendCmd("speed=" + this.streamSpeed)
}
},
SendCmd: function(a) {
if (true === Ext.isDefined(this.embedDom.postMessage)) {
this.embedDom.postMessage({
method: "SendPlayerCmd",
cmd: a
})
}
},
OnCanPlay: function() {
if (true === this.fnIsManualPaused()) {
this.Pause();
return
}
},
SetMute: function(a) {
this.blMute = a;
this.SendCmd("mute=" + a)
},
SetVolume: function(a) {
this.volume = Math.round(a * this.VOL_MAX);
this.SendCmd("volume=" + this.volume)
},
GetVolume: function(a) {
return this.volume
},
SetState: function(a) {},
GetState: function() {
return {}
},
DrawSnapshot: function(a, b) {
if (!a) {
return
}
if (true === Ext.isDefined(this.embedDom.postMessage)) {
this.embedDom.postMessage({
method: "GetSnapshot"
})
}
this.snapshotCanvas = a;
this.snapshotCanvas.width = this.embedDom.getAttribute("videoWidth");
this.snapshotCanvas.height = this.embedDom.getAttribute("videoHeight");
this.fnPostDrawSnapshot = b
},
OnPostGetSnapshot: function(b) {
var a;
if (!this.snapshotCanvas) {
return
}
a = new Image();
a.onload = function() {
this.snapshotCanvas.getContext("2d").drawImage(a, 0, 0);
if (this.fnPostDrawSnapshot) {
this.fnPostDrawSnapshot(this.snapshotCanvas)
}
this.snapshotCanvas = null;
this.fnPostDrawSnapshot = null
}.createDelegate(this);
a.src = b.data
}
});
Ext.define("SYNO.SS.App.WebPlayer.Html5AudioOut", {
BIAS: (132 >> 2),
CLIP: 8159,
ulawTab: [63, 127, 255, 511, 1023, 2047, 4095, 8191],
micInfo: {
micExist: false,
updateTime: 0
},
MIN_CHECK_MS: 2000,
wsHandler: null,
volume: 0,
audioTrack: null,
audioCtx: null,
blDenied: false,
constructor: function() {
if (!window.AudioContext) {
window.AudioContext = window.webkitAudioContext
}
this.IsMicExist()
},
IsMicExist: function() {
if ((false === SYNO.SS.Utils.IsSupportWebAudioAPI()) || (true === this.blDenied)) {
return false
}
if (true === SYNO.SS.Utils.IsBlockHttpAudioIn()) {
return false
}
if (true === this.IsChecked()) {
return this.micInfo.micExist
}
navigator.mediaDevices.enumerateDevices().then(function(a) {
var b = false;
a.some(function(c) {
if ("audioinput" === c.kind) {
b = true;
return true
}
});
this.micInfo.micExist = b
}.createDelegate(this));
return this.micInfo.micExist
},
IsChecked: function() {
var a = new Date().getTime();
if (this.MIN_CHECK_MS > Math.abs(a - this.micInfo.updateTime)) {
return true
} else {
this.micInfo.updateTime = a;
return false
}
},
Start: function(a) {
if (false === this.IsMicExist()) {
return
}
Ext.applyIf(a, {
param: {
method: "AudioOut"
}
});
this.wsHandler = new SYNO.SS.App.WebPlayer.WSStreamHandler(a);
this.GetUserMedia({
video: false,
audio: true
}, this.OnGetUserMedia.createDelegate(this), function(b) {
this.blDenied = true
}.createDelegate(this))
},
GetUserMedia: function(b, c, a) {
if (true === Ext.isEdge) {
navigator.mediaDevices.getUserMedia(b).then(c)
} else {
if (!navigator.getUserMedia) {
navigator.getUserMedia = navigator.webkitGetUserMedia || navigator.mozGetUserMedia
}
navigator.getUserMedia(b, c, a)
}
},
OnGetUserMedia: function(e) {
var d, c, a = 0;
var b = function(m) {
if (!this.wsHandler) {
return
}
var h = m.inputBuffer.getChannelData(0);
var f = Math.floor(m.inputBuffer.sampleRate / 8000);
var l = Math.floor((h.length - a - 1) / f + 1);
var g = new Uint8Array(2 * l);
var j = 0,
k = 0,
n = 0;
for (; a < h.length; a += f) {
n = Math.min(1, h[a]);
k += Math.abs(n);
n = this.Linear2Ulaw(n * 32767);
g[j++] = n;
g[j++] = n
}
a -= h.length;
this.volume = Math.round(k * 100 / l);
this.wsHandler.SendCmd(g.buffer)
};
this.audioTrack = e.getAudioTracks()[0];
this.audioCtx = new AudioContext();
d = this.audioCtx.createMediaStreamSource(e);
c = this.audioCtx.createScriptProcessor(4096, 1, 1);
c.onaudioprocess = b.createDelegate(this);
d.connect(c);
c.connect(this.audioCtx.destination)
},
Linear2Ulaw: function(c) {
var d, b, a;
c >>= 2;
if (0 > c) {
c = -c;
b = 127
} else {
b = 255
}
c = Math.min(c, this.CLIP) + this.BIAS;
a = this.SearchUlawTab(c);
if (-1 === a) {
d = 127
} else {
d = (a << 4) | ((c >> (a + 1)) & 15)
}
return (d ^ b)
},
SearchUlawTab: function(b) {
var a = -1;
this.ulawTab.some(function(d, c) {
if (b <= d) {
a = c;
return true
}
});
return a
},
Stop: function() {
if (this.audioTrack) {
this.audioTrack.stop();
this.audioTrack = null
}
if (this.audioCtx) {
this.audioCtx.close();
this.audioCtx = null
}
if (this.wsHandler) {
this.wsHandler.Destroy();
this.wsHandler = null
}
this.volume = 0
},
RecFile: function(a) {
if (true === a.start) {
Ext.applyIf(a, {
param: {
method: "AudioRecord",
startRecTime: a.startRecTime
}
});
this.Start(a)
} else {
this.Stop()
}
},
GetVolume: function() {
return Math.min(this.volume * 5, 100)
}
});
Ext.define("SYNO.SS.App.WebPlayer.POSVideoContainer", {
extend: "SYNO.SS.App.WebPlayer.VideoContainer",
panelTransaction: null,
masked: false,
constructor: function(a) {
this.Init(a);
this.callParent([a]);
this.mon(this, "resize", this.panelTransaction.OnResize, this.panelTransaction);
this.mon(this, "afterrender", function() {
this.InitEvent()
}, this);
if ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_POS === this.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.POS_PREVIEW === this.viewType)) {
Ext.each(this.panelOSD.GetOsdBtnList(), function(b) {
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.Button.BTN_TRANSACTION !== b.btnId) {
this.panelOSD.DestroyBtn(b.btnId)
}
}, this);
this.panelOSD.SetBtnInfo(SYNO.SS.App.WebPlayer.OsdPanelUtils.Button.BTN_TRANSACTION, true);
this.panelOSD.CheckHideOsdPanel();
this.panelOSD.doLayout()
}
},
Init: function(a) {
this.callParent(arguments);
if ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_POS === this.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.POS_PREVIEW === this.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.POS_RECORDING === this.viewType)) {
if (a.posId) {
this.panelTransaction = new SYNO.SS.App.WebPlayer.TransactionContainer({
owner: this,
mode: (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.POS_RECORDING === this.viewType) ? "record" : "live",
posId: a.posId,
dsId: a.dsId
});
this.resultDisplayer = this.panelTransaction
}
}
},
InitEvent: function() {
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.POS_RECORDING === this.viewType) {
if (false === SYNO.SS.Utils.CheckNested(this, "owner", "owner", "ctMask")) {
return
}
this.mon(this.owner.owner.ctMask, "show", function() {
this.masked = true;
this.panelTransaction.hide()
}, this);
this.mon(this.owner.owner.ctMask, "hide", function() {
this.masked = false;
this.panelTransaction.show()
}, this)
}
},
InitIconCmp: function() {
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_POS === this.viewType) {
this.cmpAlertIcon = new Ext.BoxComponent({
cls: "alert_indicator",
hidden: true,
currentCls: "alert_indicator"
})
}
if ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_POS === this.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.POS_PREVIEW === this.viewType)) {
this.cmpPauseIcon = new Ext.BoxComponent({
cls: "pause_indicator",
hidden: true
})
}
this.callParent(arguments)
},
SetPlayerBackground: function(a, b) {
var c = String.format(".{0}", this.WEBPLAYER_BKG_CLS);
var d = ((this.el) && (this.el.dom)) ? this.el.dom.querySelector(c) : null;
if (true === a) {
if (d) {
d.classList = ""
} else {
d = document.createElement("div");
if (this.panelTransaction) {
this.el.dom.insertBefore(d, this.panelTransaction.el.dom)
} else {
this.el.appendChild(d)
}
}
if (b) {
d.classList.add(this.WEBPLAYER_BKG_CLS);
d.classList.add(b)
}
d.style.display = ""
} else {
if (d) {
d.style.display = "none"
}
}
},
IsNeedingOsdPanel: function() {
return ((false === this.blSuspendMouseEvent) && (false === this.masked))
},
InitVideoDom: function(b, a, c) {
var d = function() {
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.POS_RECORDING === this.viewType) {
Ext.each(this.panelOSD.GetOsdBtnList(), function(e) {
this.panelOSD.SetBtnInfo(e.btnId, true)
}, this);
this.panelOSD.CheckHideOsdPanel();
this.panelOSD.doLayout()
} else {
if ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_POS === this.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.POS_PREVIEW === this.viewType)) {
this.panelOSD.RecreateOsdBtns();
this.panelOSD.doLayout();
this.panelOSD.SetBtnInfo(SYNO.SS.App.WebPlayer.OsdPanelUtils.Button.BTN_TRANSACTION, true, this.panelTransaction.blOsdVisible);
if (this.owner.mediaInfo) {
this.panelOSD.ReloadOsdBtn(this.owner.mediaInfo)
}
}
}
if (c) {
c()
}
}.createDelegate(this);
this.callParent([b, a, d])
},
RemoveVideoInst: function() {
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.POS_RECORDING === this.viewType) {
Ext.each(this.panelOSD.GetOsdBtnList(), function(a) {
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.Button.BTN_TRANSACTION !== a.btnId) {
this.panelOSD.SetBtnInfo(a.btnId, false)
}
}, this)
} else {
if ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_POS === this.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.POS_PREVIEW === this.viewType)) {
Ext.each(this.panelOSD.GetOsdBtnList(), function(a) {
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.Button.BTN_TRANSACTION !== a.btnId) {
this.panelOSD.DestroyBtn(a.btnId)
}
}, this);
this.panelOSD.SetBtnInfo(SYNO.SS.App.WebPlayer.OsdPanelUtils.Button.BTN_TRANSACTION, true)
}
}
this.panelOSD.CheckHideOsdPanel();
this.panelOSD.doLayout();
this.callParent(arguments)
},
AppendDom: function(a) {
this.el.dom.insertBefore(a, this.panelTransaction.el.dom)
}
});
Ext.define("SYNO.SS.App.WebPlayer.SpeakerContainer", {
extend: "SYNO.SS.App.WebPlayer.VideoContainer",
panelAudioContainer: null,
speakerId: -1,
speakerIdOnRec: -1,
dsSpeaker: null,
dsCap: null,
speakerStatus: null,
speakerStsFlags: null,
constructor: function(a) {
this.callParent([a]);
this.InitSpeakerBtn();
this.InitComponent(a);
this.mon(this, "videoReplaced", this.OnVideoReplaced, this)
},
InitComponent: function(b) {
this.dsSpeaker = new Ext.data.JsonStore({
autoDestroy: true,
root: "ipSpeakers",
fields: SYNO.SS.GblStore.fieldIPSpeaker
});
this.dsCap = new Ext.data.JsonStore({
root: "speakerCap",
fields: [{
name: "id"
}, {
name: "audioList"
}, {
name: "audioOut"
}]
});
var a = SYNO.SS.GblStore.LoadFromIPSpeakerStore({
params: {
speakerIdList: String(this.speakerId),
blSpeakerIdChecked: true
}
}, true);
this.dsSpeaker.loadData(a);
this.GetCap()
},
InitIconCmp: function() {
if (true === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsSpeakerViewType(this.viewType)) {
this.cmpAlertIcon = new Ext.BoxComponent({
cls: "alert_indicator",
hidden: true,
currentCls: "alert_indicator"
});
this.cmpPauseIcon = new Ext.BoxComponent({
cls: "pause_indicator",
hidden: true
})
}
this.callParent(arguments)
},
OnVideoReplaced: function() {
this.CorrectUIAfterVideoInstChanged()
},
CorrectUIAfterVideoInstChanged: function() {
this.Resize(this.ctWidth, this.ctHeight);
if (SYNO.SS.Plugin.CursorType.ARROW != this.onScreenHandler.GetCursorStyle()) {
this.onScreenHandler.SetCursorStyle(SYNO.SS.Plugin.CursorType.ARROW)
}
},
CreateVdoPlayer: function() {
return SYNO.SS.App.WebPlayer.VideoContainer.prototype.CreatePlayer.apply(this, arguments)
},
CreateAdoPlayer: function(a) {
return new SYNO.SS.App.WebPlayer.Html5AudioTagPlayer(this.PatchConfig(this.owner.CreateIPSpeakerConfig(a)))
},
CreatePlayer: function(b) {
var a = SYNO.SS.GblStore.dsIPSpeaker.getById(this.speakerId);
if ((true === a.get("pairedCamEnabled")) && (true === this.IsPairedCamNormal(b.videoType, b.resolution, this.owner.camStatus, this.owner.stsFlags))) {
if (SYNO.SS.App.IPSpeaker.Def.Source.CAMERA === a.get("liveviewAudioSource")) {
return this.CreateVdoPlayer(b)
} else {
return new SYNO.SS.App.WebPlayer.MultiSourcePlayerWrap(this.CreateVdoPlayer(b), this.CreateAdoPlayer(a))
}
} else {
return this.CreateAdoPlayer(a)
}
},
ReplaceVideoInst: function(b, d) {
var a = SYNO.SS.GblStore.dsIPSpeaker.getById(this.speakerId);
var c = true === a.get("pairedCamEnabled") ? SYNO.SS.GblStore.dsCamera.getById(SYNO.SS.GblStore.GetCamIdOnHost(a.get("ownerDsId"), a.get("pairedCamId"))) : undefined;
if ((true === a.get("pairedCamEnabled")) && (true === this.IsPairedCamNormal(b.videoType, b.resolution, this.owner.camStatus, this.owner.stsFlags))) {
if (this.videoInst) {
this.callParent(arguments)
} else {
if (this.el) {
this.InitVideoInst(b)
}
}
} else {
this.StopVideoReplace();
this.RemoveDelegatedFunc(this.videoInst);
if (SYNO.SS.App.IPSpeaker.Def.Source.IPSPEAKER === a.get("liveviewAudioSource")) {
this.newVideoInst = this.CreatePlayer(b);
this.DoReplaceVideoInst(d);
if ((this.videoInst) && (true === a.get("pairedCamEnabled")) && (true === this.IsPairedCamNormal(b.videoType, b.resolution, this.owner.camStatus, this.owner.stsFlags))) {
this.HidePlayerTip()
}
} else {
if (this.videoInst) {
this.ReleaseVideoInst();
this.CorrectUIAfterVideoInstChanged()
}
}
this.InitSpeakerBtn(true);
if ((c) && (false === SYNO.SS.App.WebPlayer.Utils.IsHtml5SupportCodec(b.videoType, b.resolution)) && (true === SYNO.SS.Utils.IsCamOnlineSts(this.owner.camStatus)) && (false === SYNO.SS.CamStsFlag.IsTransientSts(this.owner.stsFlags))) {
this.ShowUnsupportCodecTip()
}
return true
}
},
InitVideoInst: function(c) {
var b;
var a = SYNO.SS.GblStore.dsIPSpeaker.getById(this.speakerId);
var d = true === a.get("pairedCamEnabled") ? SYNO.SS.GblStore.dsCamera.getById(SYNO.SS.GblStore.GetCamIdOnHost(a.get("ownerDsId"), a.get("pairedCamId"))) : undefined;
if (this.videoInst) {
return true
}
if ((d) && (false === SYNO.SS.App.WebPlayer.Utils.IsHtml5SupportCodec(c.videoType, c.resolution)) && (true === SYNO.SS.Utils.IsCamOnlineSts(this.owner.camStatus)) && (false === SYNO.SS.CamStsFlag.IsTransientSts(this.owner.stsFlags))) {
this.ShowUnsupportCodecTip()
}
if (false === this.CheckVolumeBtnEnable()) {
this.InitSpeakerBtn(true);
return true
}
c.blMute = this.IsMute();
this.videoInst = this.CreatePlayer(c);
b = this.videoInst.GetNode();
this.blDoFireInited = true;
if (b) {
this.InitVideoDom(b, function() {
this.UpdateFloatingCmp(c)
}.bind(this));
this.el.insertFirst(b)
} else {
this.ReloadOsdBtns();
this.InitSpeakerBtn(true)
}
return true
},
IsNeedingOsdPanel: function() {
var a = SYNO.SS.App.IPSpeaker.Utils.SpeakerStatusToDeviceStatus(this.speakerStatus);
var b = (true === SYNO.SS.Utils.IsCamOnlineSts(a)) && (false === SYNO.SS.IPSpeakerStsFlag.IsTransientSts(this.speakerStsFlags));
return ((false === this.blSuspendMouseEvent) && (true === b))
},
SetSpeakerStatus: function(b, a) {
this.speakerStatus = b;
this.speakerStsFlags = a
},
InitVideoDom: function(b, a, c) {
var d = function() {
if ((true === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsSpeakerViewType(this.viewType)) && (true === this.owner.needReloadOSD)) {
this.ReloadOsdBtns()
}
if (c) {
c()
}
}.createDelegate(this);
this.callParent([b, a, d])
},
ReloadOsdBtns: function() {
this.panelOSD.DestroyAllOsdBtns();
this.panelOSD.RecreateOsdBtns();
this.panelOSD.doLayout();
var a = this.dsSpeaker.getById(this.speakerId);
var b = a.get("cap");
this.owner.needReloadOSD = false;
if (this.owner.mediaInfo) {
Ext.apply(this.owner.mediaInfo, {
id: this.speakerId,
idOnRecServer: this.speakerIdOnRec,
audioList: b.audioList,
audioOut: (false === Ext.isEmpty(b.audioOut))
});
this.panelOSD.ReloadOsdBtn(this.owner.mediaInfo)
}
},
InitSpeakerBtn: function(a) {
this.defaultBtnList = [SYNO.SS.App.WebPlayer.OsdPanelUtils.Button.BTN_SPEAKER_EDIT, SYNO.SS.App.WebPlayer.OsdPanelUtils.Button.BTN_SPLIT_LINE, SYNO.SS.App.WebPlayer.OsdPanelUtils.Button.BTN_PAUSE, SYNO.SS.App.WebPlayer.OsdPanelUtils.Button.BTN_VOLUME, SYNO.SS.App.WebPlayer.OsdPanelUtils.Button.BTN_VOLUME_OFF, SYNO.SS.App.WebPlayer.OsdPanelUtils.Button.BTN_AUDIO_OUT];
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.PREVIEW_IPSPEAKER === this.viewType) {
this.defaultBtnList = [SYNO.SS.App.WebPlayer.OsdPanelUtils.Button.BTN_PAUSE, SYNO.SS.App.WebPlayer.OsdPanelUtils.Button.BTN_VOLUME, SYNO.SS.App.WebPlayer.OsdPanelUtils.Button.BTN_VOLUME_OFF, SYNO.SS.App.WebPlayer.OsdPanelUtils.Button.BTN_AUDIO_OUT]
}
if (false === this.CheckVolumeBtnEnable()) {
this.defaultBtnList.remove(SYNO.SS.App.WebPlayer.OsdPanelUtils.Button.BTN_VOLUME);
this.defaultBtnList.remove(SYNO.SS.App.WebPlayer.OsdPanelUtils.Button.BTN_VOLUME_OFF)
}
if (true === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsSpeakerViewType(this.viewType)) {
Ext.each(this.panelOSD.GetOsdBtnList(), function(c) {
var d;
var b = false;
for (d = 0; d < this.defaultBtnList.length; d++) {
if (this.defaultBtnList[d] === c.btnId) {
b = true;
break
}
}
if (true === b) {
if (true !== a) {
this.panelOSD.SetBtnInfo(c.btnId, true)
}
} else {
this.panelOSD.DestroyBtn(c.btnId)
}
}, this)
}
this.panelOSD.doLayout()
},
CheckVolumeBtnEnable: function() {
var a = SYNO.SS.GblStore.dsIPSpeaker.getById(this.speakerId);
var b;
if (false === Ext.isDefined(a)) {
return false
}
if ((true === a.get("pairedCamEnabled")) && (SYNO.SS.App.IPSpeaker.Def.Source.CAMERA === a.get("liveviewAudioSource"))) {
b = SYNO.SS.GblStore.dsCamera.getById(SYNO.SS.GblStore.GetCamIdOnHost(a.get("ownerDsId"), a.get("pairedCamId")));
return ((false === Ext.isEmpty(b)) && (true === this.IsPairedCamNormal(b.get("camVideoType"), b.get("resolution"), b.get("camStatus"), b.get("status_flags"))))
} else {
return (SYNO.SS.App.Camera.Def.AudioType.NONE !== a.get("audioType"))
}
},
IsPairedCamNormal: function(e, c, d, b, a) {
return ((true === SYNO.SS.App.WebPlayer.Utils.IsHtml5SupportCodec(e, c, a)) && (true === SYNO.SS.Utils.IsCamOnlineSts(d)) && (false === SYNO.SS.CamStsFlag.IsTransientSts(b)))
},
SetMediaInfo: function(c) {
var a = this.dsSpeaker.getById(this.speakerId);
if (true === Ext.isDefined(a)) {
var b = a.get("cap");
Ext.apply(c, {
id: this.speakerId,
idOnRecServer: this.speakerIdOnRec,
audioList: b.audioList,
audioOut: (false === Ext.isEmpty(b.audioOut))
});
this.panelOSD.ReloadOsdBtn(c)
}
},
GetCap: function() {
var a = this.dsSpeaker.getById(this.speakerId);
if (true === Ext.isDefined(a)) {
var b = a.get("cap");
Ext.apply(b, {
id: a.get("id"),
idOnRecServer: a.get("idOnRecServer"),
ownerDsId: a.get("ownerDsId"),
vendor: a.get("vendor"),
audioOut: (false === Ext.isEmpty(b.audioOut))
});
this.panelOSD.ReloadOsdBtn(b)
}
}
});
Ext.define("SYNO.SS.App.WebPlayer.SpeakerGroupContainer", {
extend: "SYNO.SS.App.WebPlayer.VideoContainer",
groupId: 0,
lastMediaInfo: null,
constructor: function(a) {
this.groupId = a.groupId;
this.callParent([a]);
this.InitSpeakerGroupBtn()
},
InitVideoInst: function(b) {
var a;
if (this.videoInst) {
return true
}
b.blMute = this.IsMute();
this.videoInst = this.CreatePlayer(b);
a = this.videoInst.GetNode();
this.blDoFireInited = true;
if (a) {
this.InitVideoDom(a, function() {
this.UpdateFloatingCmp(b)
}.bind(this));
this.el.insertFirst(a)
}
if (false === Ext.isEmpty(b.Plugin)) {
this.ConnectPluginEvt(a)
}
return true
},
InitVideoDom: function(b, a, c) {
var d = function() {
if ((true === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsSpeakerGrpViewType(this.viewType)) && ((this.lastMediaInfo !== this.owner.mediaInfo) || (true === Ext.isEmpty(this.lastMediaInfo)))) {
this.panelOSD.DestroyAllOsdBtns();
this.panelOSD.RecreateOsdBtns();
this.panelOSD.doLayout();
this.lastMediaInfo = this.owner.mediaInfo;
if (this.owner.mediaInfo) {
Ext.apply(this.owner.mediaInfo, {
groupId: this.groupId,
audioOut: (true === SYNO.SS.GblStore.HasSpeakerInGrp(this.groupId))
});
this.panelOSD.ReloadOsdBtn(this.owner.mediaInfo)
}
}
if (c) {
c()
}
}.createDelegate(this);
this.callParent([b, a, d])
},
InitIconCmp: function() {
if (true === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsSpeakerGrpViewType(this.viewType)) {
this.cmpAlertIcon = new Ext.BoxComponent({
cls: "alert_indicator",
hidden: true,
currentCls: "alert_indicator"
});
this.cmpPauseIcon = new Ext.BoxComponent({
cls: "pause_indicator",
hidden: true
})
}
this.callParent(arguments)
},
InitSpeakerGroupBtn: function(a) {
this.defaultBtnList = [SYNO.SS.App.WebPlayer.OsdPanelUtils.Button.BTN_AUDIO_OUT];
if (false === SYNO.SS.GblStore.HasSpeakerInGrp(this.groupId)) {
this.defaultBtnList.remove(SYNO.SS.App.WebPlayer.OsdPanelUtils.Button.BTN_AUDIO_OUT)
}
if (true === SYNO.SS.App.WebPlayer.OsdPanelUtils.IsSpeakerGrpViewType(this.viewType)) {
Ext.each(this.panelOSD.GetOsdBtnList(), function(c) {
var d;
var b = false;
for (d = 0; d < this.defaultBtnList.length; d++) {
if (this.defaultBtnList[d] === c.btnId) {
b = true;
break
}
}
if (true === b) {
if (true !== a) {
this.panelOSD.SetBtnInfo(c.btnId, true)
}
} else {
this.panelOSD.DestroyBtn(c.btnId)
}
}, this)
}
this.panelOSD.doLayout()
},
IsNeedingOsdPanel: function() {
return (false === this.blSuspendMouseEvent)
}
});
Ext.define("SYNO.SS.App.WebPlayer.RecordingChecker", {
wsHandler: null,
fnTip: null,
fnClose: null,
constructor: function(a, c, b) {
this.fnTip = c || Ext.emptyFn;
this.fnClose = b || Ext.emptyFn;
this.wsHandler = a.wsHandler;
if ((this.wsHandler) && (this.wsHandler.IsConnectStatusNormal())) {
a.fnOnWSMessage = this.OnWSMessage.createDelegate(this);
a.fnOnWSReady = function() {
this.wsHandler.SendParams("action=check", a)
}.createDelegate(this);
a.fnOnWSClose = function() {
this.CheckDone()
}.createDelegate(this);
this.wsHandler.ChangeConfig(a)
} else {
this.CheckDone()
}
},
Destroy: function() {
if (this.wsHandler) {
this.wsHandler.RemoveEvtListener();
this.wsHandler = null
}
this.fnClose = null;
this.fnTip = null
},
OnWSMessage: function(a) {
var b = SYNO.SS.App.WebPlayer.Utils.BufParseHeader(new Uint8Array(a.data));
if (Ext.isDefined(b.valid)) {
this.CheckDone("true" === b.valid)
} else {
this.CheckDone()
}
},
CheckDone: function(a) {
this.fnTip(a);
this.fnClose();
this.Destroy()
}
});
Ext.define("SYNO.SS.App.WebPlayer.VideoLabel", {
extend: "Ext.Container",
PADDING: 4,
params: null,
blShow: false,
parent: null,
fieldBandWidth: null,
fieldFps: null,
fieldVideoFmt: null,
fnGetContainerSize: null,
constructor: function(a) {
this.fnGetContainerSize = a.fnGetContainerSize;
this.Init();
this.callParent([{
layout: "table",
cls: "videolabel",
style: String.format("visibility: hidden; background: #000000; opacity: 0.7; padding: 8px 12px;width: max-content; margin: {0}px 0 0 {0}px;", this.PADDING),
layoutConfig: {
columns: 1
},
items: [this.fieldVideoFmt, this.fieldFps, this.fieldBandWidth, this.fieldResolution]
}])
},
CreateField: function(c, d) {
var b = this;
var a = false;
return new SYNO.ux.DisplayField({
style: "color: #FFFFFF; font-size: 14px; padding: 0px;",
value: b.FormatContent(c, d),
content: d,
SetContent: function(e) {
if (this.content !== e) {
this.content = e;
a = true
}
return this
},
Flush: function() {
if ((true === a) && (true === this.rendered) && (true === b.IsShowContent())) {
this.setValue(b.FormatContent(c, this.content));
a = false;
return true
}
return false
},
markInvalid: null,
clearInvalid: null
})
},
Init: function() {
this.fieldBandWidth = this.CreateField("Bit&nbsp;Rate", "0&nbsp;" + _T("ss_common", "bitrate_kb"));
this.fieldFps = this.CreateField(_T("camera", "stm_info_fps"), 0);
this.fieldVideoFmt = this.CreateField("Codec", "");
this.fieldResolution = this.CreateField("Video&nbsp;Reso", "")
},
ApplyInfo: function(a) {
if (Ext.isDefined(a.blShow)) {
this.ShowVideoLabel(a.blShow)
}
if (Ext.isDefined(a.videoType)) {
this.UpdateVideoFmt(a.videoType)
}
if (Ext.isDefined(a.reso)) {
this.UpdateVideoReso(a.reso)
}
if (Ext.isDefined(a.bandWidth)) {
this.UpdateBandwidth(a.bandWidth)
}
if (Ext.isDefined(a.fps)) {
this.UpdateFps(a.fps)
}
if (Ext.isDefined(a.style)) {
this.el.setStyle(a.style)
}
},
UpdateVideoFmt: function(a) {
this.fieldVideoFmt.SetContent(a).Flush()
},
UpdateVideoReso: function(a) {
if (true === this.fieldResolution.SetContent(a).Flush()) {
this.DoLayout()
}
},
UpdateBandwidth: function(a) {
if (true === this.fieldBandWidth.SetContent(a).Flush()) {
this.DoLayout()
}
},
UpdateFps: function(a) {
this.fieldFps.SetContent(a).Flush()
},
CheckLabelSize: function() {
var a = this.fnGetContainerSize();
return (((this.getHeight() + this.PADDING * 2) <= a.height) && ((this.getWidth() + this.PADDING * 2) <= a.width))
},
DoLayout: function() {
var a;
if (true !== this.rendered) {
return
}
a = ((true === this.CheckLabelSize()) && (true === this.blShow)) ? "visible" : "hidden";
this.getEl().dom.style.visibility = a
},
ShowVideoLabel: function(a) {
this.blShow = a;
this.fieldBandWidth.Flush();
this.fieldFps.Flush();
this.fieldVideoFmt.Flush();
this.fieldResolution.Flush();
this.DoLayout()
},
IsShowContent: function() {
return ((true === this.blShow) && (true === this.rendered))
},
FormatContent: function(b, a) {
return b + ":&nbsp;" + a
}
});
Ext.define("SYNO.SS.App.WebPlayer.LastFrameCanvas", {
extend: "Ext.BoxComponent",
canvasObj: null,
constructor: function(a) {
this.callParent([{
style: "position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; pointer-events: none;",
html: '<canvas style="width: 100%; height: 100%; object-fit: ' + ((true === a.blFixAspectRatio) ? "contain" : "fill") + ';"></canvas>',
listeners: {
beforedestroy: function() {
this.canvasObj = null
},
scope: this
}
}])
},
GetCanvas: function() {
if (!this.canvasObj) {
this.canvasObj = this.el.dom.querySelector("canvas")
}
return this.canvasObj
},
SetCanvasFit: function(b) {
var a = this.GetCanvas();
a.style["object-fit"] = ((true === b) ? "contain" : "fill")
}
});
Ext.define("SYNO.SS.App.WebPlayer.LayoutCell", {
extend: "Ext.Container",
CAM_INFO_LABEL_HEIGHT: 21,
parent: null,
borderAlert: null,
panelBanner: null,
panelTip: null,
ctWidth: 0,
ctHeight: 0,
constructor: function(a) {
this.parent = a.parent;
this.ctWidth = a.width;
this.ctHeight = a.height;
Ext.apply(a, {
cls: "webplayer_layout_cell " + SYNO.SS.Utils.GetVdoBgCls(),
listeners: {
afterrender: function(b) {
b.mon(b.el, "click", function(c) {
this.OnChannelClick(c, b)
}, this);
b.mon(b.el, "dblclick", function(c) {
this.OnChannelDblClick(c, b)
}, this)
},
beforedestroy: function(b) {
b.DeleteBorderAlert();
b.emapPanel = null;
b.monitorPanel = null;
b.parent = null
},
resize: function(d, f, c) {
var b = d.monitorPanel;
var g = d.emapPanel;
var e = d.panelTip;
d.ctWidth = f || d.getWidth();
d.ctHeight = c || d.getHeight();
if ((b) && (true === b.rendered)) {
b.setHeight(d.ctHeight)
}
if ((g) && (true === g.rendered)) {
g.setSize(d.ctWidth, d.ctHeight)
}
if (e) {
e.setSize(d.ctWidth, d.ctHeight - d.GetBannerHeight())
}
d.SyncSize(d.ctWidth, d.ctHeight)
},
scope: this.parent
}
});
this.callParent([a]);
this.CreateBanner(a);
this.CreatePlayTip(a)
},
CreateBanner: function(b) {
var d = b.bannerConfig.text;
var c = b.bannerConfig.blAudio;
var a = b.bannerConfig.dsId;
if (false === b.blBanner) {
return
}
this.panelBanner = new SYNO.SS.App.WebPlayer.Banner({
viewType: b.viewType,
hidden: (false === this.blShowCamInfoLabel)
});
this.panelBanner.SetTitle(d, {
dsId: a
});
this.panelBanner.ctRight.SetAudioIcon(c);
this.add(this.panelBanner)
},
CreatePlayTip: function(a) {
if (!a.strTip) {
return
}
this.panelTip = new Ext.Container({
width: a.width,
height: a.height - this.GetBannerHeight(),
style: "position: relative;",
items: {
xtype: "container",
cls: "webplayer_tip",
html: String.format('<div class="ellipsis_text" ext:qtip="{0}">{0}</div>', a.strTip)
}
});
this.add(this.panelTip)
},
GetBannerHeight: function() {
if ((this.panelBanner) && (false === this.panelBanner.hidden)) {
return this.CAM_INFO_LABEL_HEIGHT
}
return 0
},
SetFocus: function() {
var a = null;
if ((this.parent.focusPanel) && (this.parent.focusPanel !== this)) {
this.parent.focusPanel.SetPlayerFocus(false);
this.parent.focusPanel.SetEmapFocus(false)
}
this.parent.focusContainerId = this.location;
this.parent.focusPanel = this;
this.parent.parentWin.UpdateFocus(this.location);
this.SetPlayerFocus(true);
this.SetEmapFocus(true)
},
SyncSize: function(c, a) {
var b = this.GetPlayer();
c = c || this.getWidth();
a = a || this.getHeight();
if (b) {
b.setSize(c - this.GetMonitorPanelWidth(), a)
}
},
SetPlayerFocus: function(b) {
var a = this.GetPlayer();
if (a) {
a.SetFocus(b)
}
},
SetEmapFocus: function(a) {
var b = this.GetEmapViewer();
if (b) {
b.SetFocus(a)
}
},
GetPlayer: function() {
var a = -1;
if (true === this.isDestroyed) {
return null
}
a = this.parent.playerInfoList.findExact("location", this.location);
if (-1 === a) {
return null
}
return this.parent.playerInfoList[a].player
},
GetEmapViewer: function() {
var a = -1;
if (true === this.isDestroyed) {
return null
}
a = this.parent.emapInfoList.findExact("location", this.location);
if (-1 === a) {
return null
}
return this.parent.emapInfoList[a].emapPanel
},
GetMonitorPanelWidth: function() {
if ((this.monitorPanel) && (true === this.monitorPanel.rendered)) {
return this.monitorPanel.getWidth()
}
return 0
},
ShowCamInfoLabel: function(a) {
var b = this.GetPlayer();
var c = this.GetEmapViewer();
if (b) {
b.ShowCamInfoLabel(a)
} else {
if (c) {
c.ShowEmapInfoLabel(a)
} else {
if (this.panelBanner) {
this.panelBanner.setVisible(a)
}
if (this.panelTip) {
this.panelTip.setSize(this.ctWidth, this.ctHeight - this.GetBannerHeight())
}
}
}
},
SetSuspendMouseEvent: function(b) {
var a = this.GetPlayer();
var c = this.GetEmapViewer();
if (a) {
a.SetSuspendMouseEvent(b)
} else {
if (c) {
c.SetSuspendMouseEvent(b)
}
}
},
UpdateBgColor: function() {
if (this.panelBanner) {
SYNO.SS.Utils.ResetVdoInfoBarCls(this.panelBanner)
}
SYNO.SS.Utils.ResetVdoBgCls(this)
},
ShowBorderAlert: function(b) {
var a = this.GetStyleByFrameType(b);
if (!this.ownerCt.isVisible()) {
return
}
if (!this.borderAlert) {
this.CreateAlertBorder(a)
}
if (this.borderAlert.alertCls != a) {
this.borderAlert.removeClass(this.borderAlert.alertCls);
this.borderAlert.addClass(a);
this.borderAlert.alertCls = a
}
this.borderAlert.setVisible(true)
},
HideBorderAlert: function() {
if (this.borderAlert) {
this.borderAlert.setVisible(false)
}
},
DeleteBorderAlert: function() {
if (this.borderAlert) {
this.borderAlert.destroy();
this.borderAlert = null
}
},
CreateAlertBorder: function(a) {
this.borderAlert = new Ext.BoxComponent({
cls: a,
renderTo: this.parent.id,
alertCls: a
});
this.parent.SetPanelBorder(this.borderAlert, this)
},
GetStyleByFrameType: function(a) {
switch (a) {
case SYNO.SS.App.Liveview.Def.FRAME_SHOW_RED:
return "player_layout_alert_border";
case SYNO.SS.App.Liveview.Def.FRAME_RED_FLASH:
return "player_layout_alert_border_flash";
default:
return ""
}
},
SetAlertIcon: function(c, b) {
var a = this.GetPlayer();
var d = this.GetEmapViewer();
if (null !== a) {
a.SetAlertIconFlash(c, b)
} else {
if (null !== d) {
d.SetAlertIconFlash(c, b)
}
}
},
ChangeEmapPanel: function(a, b) {
this.parent.CreateEmapContent(this, {
emapId: a
}, this.getWidth(), this.getHeight());
if (true === Ext.isFunction(b)) {
b.call()
}
this.doLayout();
this.parent.OnEmapChanged(this.location)
}
});
Ext.namespace("SYNO.SS.App.WebPlayer.DetectionResult");
Ext.define("SYNO.SS.App.WebPlayer.DetectionResult.Controller", {
extend: "SYNO.SS.AbstractBaseClass",
owner: null,
taskId: null,
cameraId: null,
dsId: null,
DETECT_RESULT_KEY: "instances",
RESULT_DISPLAY_DURATION: 100,
TRIGGER_RESET_DURATION: 1000,
resultBuffer: null,
resultDisplayer: null,
ClearResultTimeoutId: null,
triggerTimeoutId: null,
videoLatency: 0,
blTrigger: false,
blPaused: false,
blAllowDisplay: false,
resultFrameId: undefined,
abstractMethods: ["GetNextResult"],
blShowDetRegion: true,
constructor: function(a) {
this.Init(a);
this.callParent([a])
},
Reset: function() {
this.resultBuffer = []
},
Draw: function(c) {
var a = false;
var b;
while (null !== (b = this.GetNextResult(c))) {
this.UpdateImpl(b.msg);
a = true
}
if (true === a) {
this.DrawImpl()
} else {
if ((false === this.resultDisplayer.IsResultEmpty()) && (true === this.CheckClearResult(c))) {
this.ClearResult()
}
}
},
InitDisplay: function(b, a) {
this.resultDisplayer.InitIndicator(b);
this.resultDisplayer.InitResult(b, a)
},
SetPaused: function(a) {
this.blPaused = a;
this.resultDisplayer.SetPaused(a)
},
SetVideoLatency: function(b) {
var a = parseInt((b * 1000), 10);
this.videoLatency = Math.max(a, 0)
},
Resize: function(b, a) {
if (false === this.resultDisplayer.rendered) {
return
}
this.resultDisplayer.Resize(b, a);
this.Refresh()
},
GetDisplayer: function() {
return this.resultDisplayer
},
SetAllowDisplay: function(a) {
if (this.blAllowDisplay === a) {
return
}
this.blAllowDisplay = a;
this.resultDisplayer.SetAllowDisplay(a);
this.Refresh()
},
Init: function(a) {
var b = SYNO.SS.App.WebPlayer.DetectionResult.DisplayerFactory;
this.owner = a.owner;
this.taskId = a.taskId;
this.cameraId = a.cameraId;
this.dsId = a.dsId;
this.resultDisplayer = b.CreateDisplayer(a.displayerCfg);
this.resultBuffer = []
},
UpdateImpl: function(a) {
if (true === this.IsNeedDrawIndicator()) {
this.UpdateTrigger(a)
}
this.resultDisplayer.ClearResult();
a[this.DETECT_RESULT_KEY].forEach(function(b) {
this.resultDisplayer.AddResult(b)
}, this);
if (0 < this.recStartTimeMS) {
this.resultFrameId = a.timestamp
} else {
this.resultFrameId = a.frameId
}
},
DrawImpl: function() {
this.resultDisplayer.ClearCanvas();
if (false === this.blAllowDisplay) {
return
}
if (true === this.IsNeedDrawIndicator()) {
this.resultDisplayer.DrawIndicator(this.blTrigger)
}
this.resultDisplayer.DrawResult()
},
Refresh: function() {
this.DrawImpl()
},
ClearResult: function() {
this.UpdateImpl(this.GetClearResultMsg());
this.DrawImpl()
},
GetClearResultMsg: function() {
var a = {
trigger: false,
frameId: undefined
};
a[this.DETECT_RESULT_KEY] = [];
return a
},
IsNeedDrawIndicator: function() {
return this.blShowDetRegion
},
UpdateTrigger: function(a) {
if (true !== a.trigger) {
return
}
this.blTrigger = true;
this.SetTriggerTimer()
},
SetTriggerTimer: function() {
this.UnSetTriggerTimer();
this.triggerTimeoutId = setTimeout(function(a) {
a.blTrigger = false
}, this.TRIGGER_RESET_DURATION, this)
},
UnSetTriggerTimer: function() {
if (this.triggerTimeoutId) {
clearTimeout(this.triggerTimeoutId);
this.triggerTimeoutId = null
}
},
GetIndicatorRegions: function() {
return this.resultDisplayer.GetIndicatorRegions(true)
},
CheckClearResult: function(a) {
return (a - this.RESULT_DISPLAY_DURATION >= this.resultFrameId)
},
ShowDetRegion: function(a) {
this.blShowDetRegion = a;
this.Refresh()
}
});
Ext.define("SYNO.SS.App.WebPlayer.DetectionResult.LiveController", {
extend: "SYNO.SS.App.WebPlayer.DetectionResult.Controller",
MAX_MSG_CNT_IN_Q: 500,
preDeferTm: 0,
SetPaused: function(a) {
this.callParent(arguments);
if (false === a) {
this.ClearResult()
}
},
EnqueueResult: function(a) {
if (a.taskId !== this.taskId) {
return
}
if (Ext.isDefined(a.dsId) && Ext.isDefined(this.dsId) && a.dsId != this.dsId) {
return
}
this.resultBuffer.push(a);
if (this.MAX_MSG_CNT_IN_Q < this.resultBuffer.length) {
this.DequeueResult()
}
},
DequeueResult: function() {
return this.resultBuffer.shift()
},
PeekResult: function() {
return this.resultBuffer[0]
},
GetNextResult: function(b) {
if (0 >= this.resultBuffer.length) {
return null
}
var d = this.PeekResult();
if (b >= d.frameId) {
var a = (true === Ext.isDefined(d.analyzeTimeUs)) ? parseInt((d.analyzeTimeUs / 1000), 10) : 0;
var c = Math.max(this.videoLatency - a, 0);
var e = window.performance.now();
c = Math.max(c, Math.ceil(this.preDeferTm - e));
this.preDeferTm = e + c;
this.DequeueResult();
return {
msg: d,
delayTime: c
}
} else {
return null
}
}
});
Ext.define("SYNO.SS.App.WebPlayer.DetectionResult.HistoryController", {
extend: "SYNO.SS.App.WebPlayer.DetectionResult.Controller",
alignerIdx: 0,
blReverse: false,
recStartTimeMS: 0,
reverseIdxWrapper: {
StartIdx: function(a, b) {
return (true === a) ? (b.length - 1) : 0
},
NextIdx: function(a, b) {
return (true === a) ? Math.max((b - 1), 0) : (b + 1)
},
PrevIdx: function(a, b) {
return (true === a) ? (b + 1) : Math.max((b - 1), 0)
},
BoundedPrevIdx: function(a, c, d) {
var b = this.StartIdx(a, d);
var e = this.PrevIdx(a, c);
return (true === a) ? Math.min(b, e) : Math.max(b, e)
}
},
Reset: function() {
this.callParent();
this.resultDisplayer.ClearCanvas();
this.resultDisplayer.ClearResult();
this.resultDisplayer.ClearIndicator()
},
Refresh: function() {
var a = this.reverseIdxWrapper.PrevIdx(this.blReverse, this.alignerIdx);
var b = this.resultBuffer[a];
if (b) {
this.UpdateImpl(b);
this.DrawImpl()
}
},
ResetAlignerIdx: function() {
this.alignerIdx = this.reverseIdxWrapper.StartIdx(this.blReverse, this.resultBuffer)
},
SearchForAlignerIdx: function(a) {
if (true === this.blReverse) {
a += this.RESULT_DISPLAY_DURATION
} else {
a -= this.RESULT_DISPLAY_DURATION
}
while (true === this.StepNextAlignerIdx(a)) {}
},
StepNextAlignerIdx: function(b, a) {
if (true === this.IsAlignerIdxValid(b)) {
var c = this.reverseIdxWrapper.NextIdx(this.blReverse, this.alignerIdx);
if (c === this.alignerIdx) {
return false
}
if (true === Ext.isFunction(a)) {
a()
}
this.alignerIdx = c;
return true
}
return false
},
SetResultBuffer: function(c, b) {
var d = this.GetClearResultMsg(),
e, a;
d.frameId = b * TRANS_MILLISECOND;
if (0 < c.length) {
e = this.GetClearResultMsg();
a = this.GetClearResultMsg();
e.frameId = c[0].frameId - this.RESULT_DISPLAY_DURATION;
a.frameId = c[c.length - 1].frameId + this.RESULT_DISPLAY_DURATION;
if (true === this.blReverse) {
a.frameId = Math.min(d.frameId, a.frameId)
} else {
e.frameId = Math.max(d.frameId, e.frameId)
}
c.unshift(e);
c.push(a)
}
if (true === this.blReverse) {
c.push(d)
} else {
c.unshift(d)
}
this.resultBuffer = c
},
SetRecStartTimeMS: function(a) {
this.recStartTimeMS = a
},
EnqueueResult: function(a) {
a.forEach(function(b) {
this.resultBuffer.push(b)
}, this)
},
CleanFaceResult: function() {
this.alignerIdx = 0;
this.resultBuffer = []
},
IsAlignerIdxValid: function(c) {
var a = this.resultBuffer[this.alignerIdx];
var b, d;
if (!a) {
return false
}
if (0 < this.recStartTimeMS) {
b = a.timestamp;
d = c + this.recStartTimeMS
} else {
b = a.frameId;
d = c
}
if (true === this.blReverse) {
return d <= b
} else {
return d >= b
}
},
GetNextResult: function(c) {
var b = {};
var a = function(d) {
d.msg = this.resultBuffer[this.alignerIdx]
}.bind(this, b);
if (true === this.StepNextAlignerIdx(c, a)) {
b.delayTime = Math.max(this.videoLatency, 0);
return b
} else {
return null
}
},
CheckClearResult: function(a) {
if (true === this.blReverse) {
return a + this.RESULT_DISPLAY_DURATION <= this.resultFrameId
} else {
a = (0 < this.recStartTimeMS) ? a + this.recStartTimeMS : a;
return a - this.RESULT_DISPLAY_DURATION >= this.resultFrameId
}
},
SetReverse: function(a) {
this.blReverse = a
}
});
Ext.namespace("SYNO.SS.App.WebPlayer");
Ext.define("SYNO.SS.App.WebPlayer.MonitorHtml5PlayerPanel", {
extend: "SYNO.SS.App.WebPlayer.Html5PlayerPanel",
player: null,
monitorPanel: null,
doorId: 0,
constructor: function(a) {
this.doorId = a.extraCfg.doorId;
this.callParent([a]);
this.mon(this, "afterrender", this.OnAfterRender, this)
},
OnAfterRender: function() {
var i = this.ownerCt;
var c = null;
var b = this.doorId;
var a = this.GetCurCamIdOnHost();
var h = SYNO.SS.GblStore.dsCamera.getById(a);
var f, e, d;
var g = null;
var j = function(k) {
return {
x: 0,
y: 0,
w: k.getWidth(),
h: k.getHeight()
}
};
if (h) {
f = h.get("camIdOnRecServer");
e = h.get("deviceType");
d = h.get("ownerDsId")
} else {
e = DEVICE_CAMERA
}
if (b) {
c = new SYNO.SS.App.Liveview.DoorPanel(this.findAppWindow());
g = b
} else {
if (true === SYNO.SS.App.Camera.Utils.IsDeviceIntercom(e)) {
c = new SYNO.SS.App.Liveview.IntercomPanel(this.findAppWindow());
g = {
camId: (LOCAL_DS_ID === d) ? a : f,
dsId: d
}
} else {
return
}
}
this.ownerCt.add(c);
this.mon(c.logList, "afterrender", function() {
c.SetInfo(-1, g);
c.SetChannelRect(j(i))
});
this.mon(i, "afterlayout", function() {
if (!c.logList.rendered) {
return
}
c.SetChannelRect(j(i))
});
this.mon(c, "afterlayout", function(k) {
if (!c.logList.rendered) {
return
}
this.setWidth(this.ownerCt.getWidth() - k.getWidth())
}, this);
this.mon(c, "expandStsChg", function(l) {
if (!c.logList.rendered) {
return
}
this.SetAppWinMinWidth(c);
if (true === this.findAppWindow().IsMaximized()) {
return
}
var m = c.EXPANDED_WIDTH - c.CONSTRICT_WIDTH;
var k = c.parentWin.getWidth();
if (true === c.blExpanded) {
c.parentWin.setWidth(k + m)
} else {
c.parentWin.setWidth(k - m)
}
c.parentWin.doLayout()
}, this);
c.suspendEvents(false);
i.setWidth(i.getWidth() + c.CONSTRICT_WIDTH);
c.parentWin.setWidth(c.parentWin.getWidth() + c.CONSTRICT_WIDTH);
this.SetAppWinMinWidth(c);
this.ownerCt.doLayout();
c.resumeEvents()
},
SetAppWinMinWidth: function(a) {
var b = this.findAppWindow();
if (false === (b instanceof SYNO.SS.App.CameraPreview.MainWindow)) {
return
}
if (a.blExpanded) {
b.minWidth = b.MIN_WIN_WIDTH + a.EXPANDED_WIDTH
} else {
b.minWidth = b.MIN_WIN_WIDTH + a.CONSTRICT_WIDTH
}
}
});
Ext.define("SYNO.SS.App.WebPlayer.POSHtml5PlayerPanel", {
extend: "SYNO.SS.App.WebPlayer.Html5PlayerPanel",
Init: function(a) {
if (true === SYNO.SS.Utils.CheckNested(a, "extraCfg", "posId")) {
this.posId = a.extraCfg.posId;
this.dsId = a.extraCfg.dsId
} else {
if (a.posId) {
this.posId = a.posId;
this.dsId = a.dsId
}
}
this.callParent([a]);
if (true === SYNO.SS.Utils.CheckNested(a, "extraCfg", "posName")) {
this.panelBanner.SetTitle(a.extraCfg.posName, a.extraCfg)
} else {
if (a.posName) {
this.panelBanner.SetTitle(a.posName, a)
}
}
},
InitPanelVideo: function(a) {
a.posId = this.posId;
a.dsId = this.dsId;
this.panelVideo = new SYNO.SS.App.WebPlayer.POSVideoContainer(a)
},
ShowEmptyPlayer: function() {
this.panelVideo.ShowPlayerTip({
img: "transaction_empty_thumb",
tip: _T("axis_access_controller", "no_paired_camera")
})
},
TransProperStmProfile: function(a) {
return (SYNO.SS.App.Camera.Def.Profile.DEFAULT === a) ? this.GetDefaultProfile() : a
},
GetDefaultProfile: function() {
var a = SYNO.SS.GblStore.GetPOSObj(this.dsId, this.posId);
if ((!a) || (true !== a.get("pairedcam_enable"))) {
return SYNO.SS.App.Camera.Def.Profile.DEFAULT
}
return SYNO.SS.GblStore.GetCamStreamProfileByIdx(a.get("ds_id"), a.get("pairedcam_id"), SYNO.SS.App.Camera.Def.ProfileSetting.ADV_REC)
}
});
Ext.define("SYNO.SS.App.WebPlayer.IOModuleHtml5PlayerPanel", {
extend: "SYNO.SS.App.WebPlayer.Html5PlayerPanel",
Init: function(a) {
this.callParent([a]);
if (true === SYNO.SS.Utils.CheckNested(a, "extraCfg", "iomoduleName")) {
this.panelBanner.SetTitle(a.extraCfg.iomoduleName, a.extraCfg)
}
}
});
Ext.define("SYNO.SS.App.WebPlayer.IVARecordHtml5PlayerPanel", {
extend: "SYNO.SS.App.WebPlayer.RecordHtml5PlayerPanel",
webapiTask: null,
alignerIdx: 0,
simulatorHelper: null,
blShowDetRegion: true,
reverseIdxWrapper: {
StartIdx: function(a, b) {
return (true === a) ? (b.length - 1) : 0
},
NextIdx: function(a, b) {
return (true === a) ? Math.max((b - 1), 0) : (b + 1)
},
PrevIdx: function(a, b) {
return (true === a) ? (b + 1) : Math.max((b - 1), 0)
},
BoundedPrevIdx: function(a, c, d) {
var b = this.StartIdx(a, d);
var e = this.PrevIdx(a, c);
return (true === a) ? Math.min(b, e) : Math.max(b, e)
}
},
blAfterSeek: false,
constructor: function(a) {
var b;
if (a.simulatorHelper) {
this.simulatorHelper = a.simulatorHelper;
b = a.simulatorHelper.taskId
}
this.panelVideoAnalytics = new SYNO.SS.App.WebPlayer.VideoAnalayitcsResultDisplayer({
vdoContainerType: SYNO.SS.App.VideoAnalytics.Def.VDO_CONTAINER_TYPE.RECORDING,
taskId: b,
owner: this
});
this.callParent([a]);
this.AppendLabel(this.panelVideoAnalytics.panelDisplay)
},
Init: function(b) {
if (b.blShowDetRegion) {
this.blShowDetRegion = b.blShowDetRegion
}
this.viewType = b.viewType;
this.panelBanner = new SYNO.SS.App.WebPlayer.Banner({
viewType: b.viewType,
hidden: (false === b.blShowCamInfoLabel),
emptyTimeText: (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.TIMELINE === b.viewType) ? "--:--:--" : "",
ClearTime: function() {
this.SetRight(this.emptyTimeText)
}
});
var a = {
owner: this,
viewType: b.viewType,
width: b.width,
height: b.height - this.panelBanner.GetHeight(),
blFixAspectRatio: b.blFixAspectRatio,
blShowVideoLabel: b.blShowVideoLabel,
blHideOsdBbar: b.blHideOsdBbar,
videoInfo: {
videoType: "",
videoResolution: ""
},
blFocused: b.blFocused,
fnUpdateAudioInfo: this.UpdateAudioInfo.createDelegate(this)
};
Ext.apply(a, {
owner: this,
resultDisplayer: this.panelVideoAnalytics,
listeners: {
resize: function(c, e, d) {
if (this.panelVideoAnalytics) {
this.panelVideoAnalytics.Resize(e, d)
}
},
scope: this
}
});
this.panelVideo = new SYNO.SS.App.WebPlayer.VideoContainer(a)
},
InitEventHandler: function() {
this.mon(this, "beforedestroy", function() {
this.panelVideoAnalytics.EnableEvent(false);
this.panelVideoAnalytics = null;
if (null != this.webapiTask) {
Ext.Ajax.abort(this.webapiTask);
this.webapiTask = null
}
});
this.mon(this, "timeupdate", this.OnTimeUpdate);
this.mon(this.panelVideo, "pause", this.OnPause, this);
this.mon(this.panelVideo, "resume", this.OnResume, this);
this.callParent()
},
OnAfterRender: function() {
this.panelVideoAnalytics.InitCanvas({
id: null,
dsId: 0
});
this.owner.panelSettings.ctChkTimeSlice.setVisible(false);
this.owner.panelSettings.panelNext.setVisible(false);
this.callParent()
},
Play: function(a, b) {
this.ResetBeforePlay();
if (this.simulatorHelper) {
this.self.superclass.Play.call(this, a, b)
} else {
this.DoPlayFromWebapiResp(a, b)
}
},
DoPlayFromWebapiResp: function(c, f) {
if ((true === Ext.isDefined(c.get("devType"))) && (DEVICE_IVA !== c.get("devType"))) {
this.self.superclass.Play.call(this, c, f);
return
}
var b = c.get("extraParam");
var d = c.get("blAlertEvt") || (b && b.blAlertEvt) ? true : false;
var e = (b) ? b.taskId : c.get("taskId");
var a = c.get("cameraId");
if (true === d) {
e = c.get("cameraId");
a = c.get("pairedCamId")
}
this.webapiTask = this.sendWebAPI({
api: "SYNO.SurveillanceStation.IVA.Recording",
version: 1,
method: "GetAnalyticsResult",
dsId: c.get("dsId"),
params: {
eventId: (b) ? b.eventId : c.get("id"),
startTime: c.get("startTime") || 0,
stopTime: c.get("stopTime") || 0,
start_time_msec: c.get("start_time_msec") || 0,
taskId: e,
blAlertEvt: d
},
callback: function(h, l, m, k) {
var g, i;
this.webapiTask = null;
if (h && l) {
i = this.GetRespTaskRec(e, c.get("dsId"), l.setting);
var j = (l.setting) ? l.setting.analyze_type : undefined;
g = this.GetTriggerAry(c, l.ivaResult, j, i);
this.panelVideoAnalytics.SetResultBuffer(e, l.ivaResult);
this.owner.seekbar.UpdateDVAResult(g);
this.panelVideoAnalytics.InitDisplay(i);
this.alignerIdx = this.reverseIdxWrapper.StartIdx(this.blReverse, this.panelVideoAnalytics.resultBuffer)
}
this.self.superclass.Play.call(this, c, f)
},
scope: this
})
},
GetTriggerAry: function(e, k, i, c) {
var h = [];
var d = false;
var b = false;
var g = (e.get("stopTime") - e.get("startTime")) * 1000;
var f = 0;
var a = 0;
var j = 100 / this.owner.sizeCfg.IMAGE_WIDTH * 2.5;
Ext.each(k, function(n) {
d = false;
if (true == Ext.isDefined(i)) {
n.analyzeType = i
}
if (n.instances) {
for (var m = 0; m < n.instances.length; m++) {
d = n.instances[m].is_trigger;
if (true === d) {
break
}
}
}
if ((true === Ext.isDefined(n.in_delta)) || (true === Ext.isDefined(n.out_delta))) {
var l = c.get("people_mode");
var p = ((SYNO.SS.App.VideoAnalytics.Def.PeopleModeType.LEAVE !== l) && (0 < n.in_delta));
var o = ((SYNO.SS.App.VideoAnalytics.Def.PeopleModeType.ENTER !== l) && (0 < n.out_delta));
d = ((true === p) || (true === o))
}
if (b !== d) {
f = n.frameId / g * 100;
a = (h[h.length - 1] || 0);
if ((true === d) && (0 !== a) && (j > f - a)) {
h.pop()
} else {
h.push(Math.max(f, j + a))
}
b = d
}
});
return h
},
GetRespTaskRec: function(f, a, g) {
var d, c;
var e = SYNO.SS.GblStore.dsVideoAnalyticsTask;
var b = (e) ? e.getById(f) : null;
d = new Ext.data.JsonStore({
autoDestroy: true,
idProperty: "id",
fields: SYNO.SS.GblStore.fieldVideoAnalyticsTask,
data: g
});
c = d.getById(f);
if (b) {
c.set("people_display_info", b.get("people_display_info"));
c.set("people_display_pos", b.get("people_display_pos"));
c.set("name", b.get("name"));
c.set("groupName", b.get("groupName"));
c.set("isGroupEnabled", b.get("isGroupEnabled"))
}
return c
},
GetCameraName: function() {
var b = SYNO.SS.GblStore.GetCamIdOnHost(this.record.get("dsId"), this.record.get("cameraId"));
var a = SYNO.SS.GblStore.dsCamera.getById(b);
return (a) ? a.get("name") : this.callParent()
},
Stop: function() {
if (this.simulatorHelper) {
this.simulatorHelper.Remove(this)
}
this.callParent(arguments)
},
Simulate: function(b, c) {
var d, a;
this.panelVideoAnalytics.SetDrawAll(false);
if (true === b) {
if (!this.record) {
return
}
this.execSimulateTm = this.GetCurStreamTm();
d = Ext.apply({
eventId: this.record.get("id"),
recEvtType: SYNO.SS.App.Event.Utils.GetRecEvtType(this.record),
startTime: this.execSimulateTm / TRANS_MILLISECOND
}, c);
this.simulatorHelper.Add(d, this, this.AppendToResultBuf);
this.panelVideo.ShowLoading();
a = SYNO.SS.Utils.UpdateRecord(c, this.simulatorHelper.task.copy(), true, true);
this.panelVideoAnalytics.InitDisplay(a, true);
this.Pause()
} else {
this.Pause();
this.Seek(this.execSimulateTm / TRANS_MILLISECOND);
this.simulatorHelper.Remove(this);
this.panelVideoAnalytics.resultBuffer.length = 0;
this.panelVideo.HidePlayerTip();
delete this.execSimulateTm
}
},
AppendToResultBuf: function(b) {
var f = JSON.parse(new TextDecoder("utf-8").decode(new Uint8Array(b.data)));
if (!f) {
return
}
var d = this.panelVideoAnalytics.resultBuffer;
var e, c, g;
var a = this.simulatorHelper.record;
if (!a) {
return
}
f.dsId = LOCAL_DS_ID;
f.taskId = a.get("id");
d.push(f);
e = d[0].frameId;
c = d[d.length - 1].frameId;
g = ((this.execSimulateTm < c) && (3 * TRANS_MILLISECOND <= (c - e)));
if ((true == g) && (true === this.panelVideoAnalytics.blPaused)) {
this.panelVideo.HidePlayerTip();
this.Resume();
this.panelVideoAnalytics.SetDrawAll(true)
}
if ((false == g) && (false === this.panelVideoAnalytics.blPaused)) {
this.panelVideo.ShowLoading();
this.Pause()
}
},
OnStreamEnded: function() {
this.callParent(arguments)
},
OnPause: function() {
this.panelVideoAnalytics.blPaused = true;
this.panelVideoAnalytics.UnsetClearResultTimer()
},
OnResume: function() {
this.panelVideoAnalytics.SetClearResultTimer();
this.panelVideoAnalytics.blPaused = false
},
OnBufferUpdateEndCB: function(a) {
if (!a) {
return
}
var c = this.panelVideoAnalytics;
if (true === this.panelVideo.onScreenHandler.IsDigitalZoom()) {
c.SetDrawAll(false);
return
}
c.SetDrawAll(true);
if (false === c.blPplCntInited) {
this.UpdatePplCntIfNeeded();
if (true === c.IsNeedDrawIndicator()) {
c.DrawIndicator()
}
c.blPplCntInited = true
}
if (true === this.blAfterSeek) {
while (true === this.IsAlignerIdxValid(a)) {
var b = this.reverseIdxWrapper.NextIdx(this.blReverse, this.alignerIdx);
if (b === this.alignerIdx) {
break
}
this.alignerIdx = b
}
this.alignerIdx = this.reverseIdxWrapper.BoundedPrevIdx(this.blReverse, this.alignerIdx, this.panelVideoAnalytics.resultBuffer);
this.UpdatePplCntIfNeeded();
if (true === c.IsNeedDrawIndicator()) {
c.DrawIndicator()
}
this.blAfterSeek = false
}
},
CreateConf: function(a) {
var b = this.callParent([a]);
if (!this.simulatorHelper) {
b.fnBufferUpdateEndCallback = this.OnBufferUpdateEndCB.createDelegate(this)
}
b.IsHighFreqTimeupdate = true;
return b
},
OnTimeUpdate: function(c) {
var e, a;
var b = this.panelVideoAnalytics;
var d = Math.max(b.videoLatency, 0);
while (true === this.IsAlignerIdxValid(c)) {
a = this.reverseIdxWrapper.NextIdx(this.blReverse, this.alignerIdx);
if (a === this.alignerIdx) {
break
}
e = b.resultBuffer[this.alignerIdx];
Ext.defer(b.DrawVideoAnalyticsResult, d, b, [e]);
this.alignerIdx = a
}
},
BeforeSeek: function() {
this.blAfterSeek = true;
this.alignerIdx = this.reverseIdxWrapper.StartIdx(this.blReverse, this.panelVideoAnalytics.resultBuffer);
this.panelVideoAnalytics.ClearResult();
this.panelVideoAnalytics.ResetTimeStamp()
},
Seek: function(a) {
this.BeforeSeek();
this.callParent([a])
},
PrevFrame: function() {
this.BeforeSeek();
this.callParent(arguments)
},
NextFrame: function() {
this.BeforeSeek();
this.callParent(arguments)
},
ResetBeforePlay: function() {
this.alignerIdx = this.reverseIdxWrapper.StartIdx(this.blReverse, this.panelVideoAnalytics.resultBuffer);
this.panelVideoAnalytics.blPplCntInited = false;
this.panelVideoAnalytics.resultBuffer = [];
this.panelVideoAnalytics.ResetTimeStamp();
this.panelVideoAnalytics.ClearResult();
this.panelVideoAnalytics.ClearIndicator();
this.panelVideoAnalytics.ClearWidgets();
this.panelVideoAnalytics.ShowDetRegion(this.blShowDetRegion)
},
IsAlignerIdxValid: function(a) {
var b = this.panelVideoAnalytics.resultBuffer[this.alignerIdx];
if (!b) {
return false
}
if (true === this.blReverse) {
return a <= b.frameId
} else {
return a >= b.frameId
}
},
UpdatePplCntIfNeeded: function() {
if (Ext.isEmpty(this.panelVideoAnalytics.pplRegion)) {
return
}
this.panelVideoAnalytics.pplRegion.UpdatePplCnt(this.alignerIdx, this.panelVideoAnalytics.resultBuffer)
},
OnStreamEnded: function() {
if (true === Ext.isDefined(this.execSimulateTm)) {
this.fireEvent("simuatestreamend")
} else {
this.callParent(arguments)
}
},
ShowDetRegion: function(a) {
this.blShowDetRegion = a;
this.panelVideoAnalytics.ShowDetRegion(a)
}
});
Ext.define("SYNO.SS.App.WebPlayer.Html5PlayerAppointedStream", {
statics: {
Override: function(a) {
var b = SYNO.SS.App.Camera.Def.Profile.SETTING_DEF;
Ext.apply(a, {
AppointStmProfile: function(c) {
var d = b;
if (true === Ext.isNumber(c)) {
b = c
}
return d
},
GetRealProfile: function(d, c) {
return b
},
PatchStmProfileInConfig: function(d, c) {
d.param.profile = b
},
PatchRealProfile: function() {
this.realProfile = b
}
})
}
}
});
Ext.define("SYNO.SS.App.WebPlayer.IVAHtml5PlayerPanel", {
extend: "SYNO.SS.App.WebPlayer.Html5PlayerPanel",
isEnabled: null,
isDeleted: null,
blIvaWati4Schedule: false,
simulatedTask: undefined,
blSetupHelper: false,
blShowDetRegion: true,
constructor: function(a) {
SYNO.SS.App.WebPlayer.Html5PlayerAppointedStream.Override(this);
this.callParent([a])
},
Init: function(d) {
if (d.blShowDetRegion) {
this.blShowDetRegion = d.blShowDetRegion
}
this.blSetupHelper = (d.extraCfg.simulatedTask) ? true : false;
if (true === this.blSetupHelper) {
this.simulatedTask = new Ext.data.Record(d.extraCfg.simulatedTask.data, d.extraCfg.ivaTaskId)
}
var a = (this.blSetupHelper) ? SYNO.SS.App.VideoAnalytics.Def.VDO_CONTAINER_TYPE.RECORDING : SYNO.SS.App.VideoAnalytics.Def.VDO_CONTAINER_TYPE.LIVEVIEW;
this.panelVideoAnalytics = new SYNO.SS.App.WebPlayer.VideoAnalayitcsResultDisplayer({
vdoContainerType: a,
ivaTaskId: d.extraCfg.ivaTaskId,
blSetupHelper: this.blSetupHelper,
owner: this
});
this.callParent([d]);
this.AppendLabel(this.panelVideoAnalytics.panelDisplay);
var c = SYNO.SS.GblStore.dsVideoAnalyticsTask;
var b;
if (this.blSetupHelper) {
b = this.simulatedTask
} else {
if (c) {
b = c.getById(d.extraCfg.ivaTaskId)
}
}
if (b) {
this.panelBanner.SetTitle(b.data.name, null);
var e = SYNO.SS.GblStore.GetCamStreamProfileByIdx(LOCAL_DS_ID, b.get("camera_id"), SYNO.SS.App.Camera.Def.ProfileSetting.VDO_ANALYSIS);
this.AppointStmProfile(e)
}
},
InitEventHandler: function() {
this.mon(SYNO.SS.GblStore.dsVideoAnalyticsTask, "storeupdate", this.OnVideoAnalyticsUpdate, this);
this.mon(this, "beforedestroy", function() {
this.panelVideoAnalytics = null
});
this.mon(this.panelVideo, "pause", this.OnPause, this);
this.mon(this.panelVideo, "resume", this.OnResume, this);
this.mon(this.panelVideo, "videoinited", this.OnVideoReady, this);
this.callParent()
},
InitPanelVideo: function(a) {
Ext.apply(a, {
owner: this,
resultDisplayer: this.panelVideoAnalytics,
listeners: {
resize: function(b, d, c) {
if (this.panelVideoAnalytics) {
this.panelVideoAnalytics.Resize(d, c);
this.IsPplRegionUpdate()
}
},
scope: this
}
});
this.panelVideo = new SYNO.SS.App.WebPlayer.VideoContainer(a)
},
OnPause: function() {
this.panelVideoAnalytics.blPaused = true;
this.panelVideoAnalytics.UnsetClearResultTimer()
},
OnResume: function() {
this.panelVideoAnalytics.SetClearResultTimer();
this.panelVideoAnalytics.blPaused = false
},
RenderVideo: function() {
var a = SYNO.SS.VideoAnalytics.TaskSts.Normal;
var c = SYNO.SS.App.VideoAnalytics.Utils;
var b = SYNO.SS.GblStore.dsVideoAnalyticsTask;
if (true === c.IsTaskDeleted(this.extraCfg.ivaTaskId, b)) {
a = SYNO.SS.VideoAnalytics.TaskSts.Deleted
} else {
if ((false === c.IsTaskEnable(this.extraCfg.ivaTaskId, b)) || (false === c.IsTaskRunning(this.extraCfg.ivaTaskId, b))) {
this.blIvaWati4Schedule = c.IsTaskWait4ScheduleOn(this.extraCfg.ivaTaskId, b);
a = SYNO.SS.VideoAnalytics.TaskSts.Disabled
}
}
if (true === this.blSetupHelper) {
this.callParent()
} else {
if (SYNO.SS.VideoAnalytics.TaskSts.Normal !== a) {
this.ShowUnavailTip(a)
} else {
if (true === c.IsTaskActivatingById(this.extraCfg.ivaTaskId, b)) {
this.panelVideo.ShowPlayerTip({
tip: _T("camera", "conn_status_setting")
})
} else {
this.callParent()
}
}
}
},
ShowUnavailTip: function(b) {
var a;
var c = ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_IVA === this.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.DVA_PREVIEW === this.viewType));
if (SYNO.SS.VideoAnalytics.TaskSts.Deleted === b) {
a = {
tip: _T("ss_common", "status_deleted")
}
} else {
if (SYNO.SS.VideoAnalytics.TaskSts.Disabled === b) {
a = {
img: (c) ? "disable_thumb" : undefined,
tip: (false === this.blIvaWati4Schedule) ? _T("camera", "conn_status_disabled") : _T("archive", "pending_dueto_schedule")
}
}
}
if (a) {
this.panelVideo.ShowPlayerTip(a)
}
},
OnVideoReady: function() {
var a = this.PrepareCamRecord();
this.panelVideoAnalytics.InitCanvas({
id: a.get("id"),
dsId: a.get("ownerDsId")
});
if (true === this.blSetupHelper) {
this.panelVideoAnalytics.EnableEvent(true);
this.panelVideoAnalytics.InitDisplay(this.simulatedTask, false)
} else {
this.panelVideoAnalytics.InitEvent()
}
this.IsPplRegionUpdate();
this.panelVideoAnalytics.ShowDetRegion(this.blShowDetRegion)
},
IsPplRegionUpdate: function() {
if (true === this.panelVideoAnalytics.IsPplTask()) {
this.OnPplRegionUpdate(this.panelVideoAnalytics.GetPplRegionParam())
}
},
OnPplRegionUpdate: function(a) {
if ((true === a.blPplRegionShow) && (true === this.CheckOverlap(a))) {
this.panelVideo.SetVideoLabelPos(true)
} else {
this.panelVideo.SetVideoLabelPos(false)
}
},
CheckOverlap: function(c) {
var b = this.videoLabel.PADDING + this.videoLabel.LABELHEIGHT + c.pplRegionHeight;
var a = this.panelVideoAnalytics.canvasResult.height;
if (c.pplRegionPos === SYNO.SS.App.VideoAnalytics.Def.DisplayPos.LEFT_TOP) {
return true
} else {
if ((c.pplRegionPos === SYNO.SS.App.VideoAnalytics.Def.DisplayPos.LEFT_BOTTOM) && ((b > a))) {
return true
}
}
return false
},
OnCameraUpdate: function(e, d) {
var a = -1;
var c = null;
var b = SYNO.SS.GblStore.dsVideoAnalyticsTask;
if ((e) && (0 < e.cameras.length)) {
a = e.cameras.findExact("id", this.GetCurCamIdOnHost());
if (-1 !== a) {
c = e.cameras[a];
this.OnCamStatusChanged(c.camStatus);
this.CheckIndicator(c);
this.CheckOsdBtnStatus(c);
this.panelVideo.UpdatePrivacyMask(c);
this.UpdateIvaEventHandler(SYNO.SS.App.VideoAnalytics.Utils.IsTaskEnable(this.extraCfg.ivaTaskId, b), c.ownerDsId);
if ((true === this.blSetupHelper) && (true !== SYNO.SS.Utils.IsCamOnlineSts(c.camStatus))) {
this.blSetupHelper = false;
this.RemoveVideo();
this.ShowUnavailTip(SYNO.SS.VideoAnalytics.TaskSts.Disabled)
}
}
} else {
if (d) {
a = d.findExact("id", this.GetCurCamIdOnHost());
if (-1 !== a) {
this.OnCamStatusChanged(SYNO.SS.CamSts.DELETED)
}
}
}
},
OnVideoAnalyticsUpdate: function(i, c) {
var j = -1;
var a = null;
var g;
var e, h, k;
var d = false;
var f = SYNO.SS.GblStore.dsVideoAnalyticsTask;
if ((i) && (0 < i.task.length)) {
j = i.task.findExact("id", this.extraCfg.ivaTaskId);
if (-1 !== j) {
a = i.task[j];
g = new Ext.data.Record(a);
g.set("todayEvtCnt", f.getById(a.id).get("todayEvtCnt"));
f.data.replace(a.id, g);
k = SYNO.SS.GblStore.GetCamStreamProfileByIdx(LOCAL_DS_ID, g.get("camera_id"), SYNO.SS.App.Camera.Def.ProfileSetting.VDO_ANALYSIS);
h = this.AppointStmProfile(k);
d = SYNO.SS.App.VideoAnalytics.Utils.IsTaskRunning(a.id, f);
if ((true === d) || (true === this.blSetupHelper)) {
if (true === SYNO.SS.App.VideoAnalytics.Utils.IsTaskActivating(a.status_flags, f)) {
this.panelVideo.ShowPlayerTip({
tip: _T("camera", "conn_status_setting")
})
} else {
this.RenderVideo();
if (k !== h) {
this.OnStmProfileChanged(k)
}
this.panelVideoAnalytics.InitDisplay(g);
this.IsPplRegionUpdate();
this.UpdateIvaEventHandler(true, a.owner_ds_id);
this.isEnabled = d
}
} else {
e = (true === a.deleted) ? SYNO.SS.VideoAnalytics.TaskSts.Deleted : SYNO.SS.VideoAnalytics.TaskSts.Disabled;
var b = SYNO.SS.App.VideoAnalytics.Utils.IsTaskWait4ScheduleOn(a.id, f);
if ((this.isEnabled !== d) || (this.isDeleted !== a.deleted) || (this.blIvaWati4Schedule !== b)) {
this.blIvaWati4Schedule = b;
this.UpdateIvaEventHandler(false, a.owner_ds_id);
this.RemoveVideo();
this.ShowUnavailTip(e);
this.isEnabled = d;
this.isDeleted = a.deleted
}
}
this.panelBanner.SetTitle(a.name, null)
}
}
if (c) {
j = c.findExact("id", this.extraCfg.ivaTaskId);
if (-1 !== j) {
this.panelVideoAnalytics.EnableEvent(false);
this.RemoveVideo();
this.ShowUnavailTip(SYNO.SS.VideoAnalytics.TaskSts.Deleted)
}
}
},
UpdateIvaEventHandler: function(b, a) {
var c = (this.blSetupHelper) ? true : b;
if ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_IVA !== this.viewType) && (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.DVA_PREVIEW !== this.viewType)) {
c = false
}
if (LOCAL_DS_ID !== a) {
c = (true === c) && (true === SYNO.SS.Utils.IsSlaveDsOnline(a))
}
this.panelVideoAnalytics.EnableEvent(c)
},
CreateConfByCamRecord: function(a) {
var b = 0;
var c = {
parent: this,
stmSrc: SYNO.SS.App.WebPlayer.Def.StreamSrc.LIVE,
videoType: a.get("camVideoType"),
resolution: SYNO.SS.App.WebPlayer.Utils.GetLiveReso(a, this.GetRealProfile()),
volume: parseInt(a.get("volume"), 10) / 100,
dsId: a.get("ownerDsId"),
id: a.get("id"),
idOnRec: a.get("camIdOnRecServer"),
param: {
method: "MixStream",
blMux: true,
browser: SYNO.SS.App.WebPlayer.Utils.GetHtml5BroswerType(),
stmSrc: SYNO.SS.App.WebPlayer.Def.StreamSrc.LIVE,
blLiveSharing: true,
supportPrivacyMask: true,
blAudio: ((true === this.blSupportAudio) && (true === a.get("blAudioPriv")) && (SYNO.SS.App.Camera.Def.AudioType.NONE !== a.get("audioType")))
},
fnSyncLatency: function(d) {
this.panelVideoAnalytics.SetVideoLatency(d)
}.createDelegate(this),
fnBufferUpdateEndCallback: function(e) {
if (!e) {
return
}
var h, d, g, i;
var f = this.panelVideoAnalytics;
if (true === this.panelVideo.onScreenHandler.IsDigitalZoom()) {
f.SetDrawAll(false);
return
}
f.SetDrawAll(true);
while ((f.resultBuffer.length) && (e >= f.resultBuffer[0].frameId)) {
h = f.resultBuffer.shift();
d = (true === Ext.isDefined(h.analyzeTimeUs)) ? parseInt((h.analyzeTimeUs / 1000), 10) : 0;
i = window.performance.now();
g = Math.max(f.videoLatency - d, 0);
g = Math.max(g, Math.ceil(b - i));
b = i + g;
Ext.defer(f.DrawVideoAnalyticsResult, g, f, [h])
}
}.createDelegate(this)
};
this.ModifyConfIfIsSsc(c, a);
this.PatchStmProfileInConfig(c, a);
if ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_IVA === this.viewType) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.DVA_PREVIEW === this.viewType)) {
c.liveBufferingMs = 1000
}
return c
},
ShowDetRegion: function(a) {
this.blShowDetRegion = a;
this.panelVideoAnalytics.ShowDetRegion(a)
}
});
Ext.namespace("SYNO.SS.App.WebPlayer.DetectionResult");
Ext.define("SYNO.SS.App.WebPlayer.DetectionResult.Html5PlayerPanel", {
extend: "SYNO.SS.App.WebPlayer.Html5PlayerPanel",
blShowDetRegion: true,
resultController: null,
constructor: function(a) {
SYNO.SS.App.WebPlayer.Html5PlayerAppointedStream.Override(this);
this.callParent([a])
},
Init: function(b) {
if (b.blShowDetRegion) {
this.blShowDetRegion = b.blShowDetRegion
}
var a = (b.extraCfg.taskData) ? b.extraCfg.taskData.owner_ds_id : LOCAL_DS_ID;
this.resultController = new SYNO.SS.App.WebPlayer.DetectionResult.LiveController({
dsId: a,
displayerCfg: Ext.apply({
canvasWidth: b.width,
canvasHeight: b.height,
extraCfg: {
blLiveview: true
}
}, b.extraCfg.displayerCfg),
taskId: b.extraCfg.taskId,
owner: this
});
this.callParent([b]);
this.InitImpl(b)
},
InitEventHandler: function() {
this.mon(this, "beforedestroy", function() {
this.resultController.SetAllowDisplay(false)
});
this.mon(this.panelVideo, "videoinited", this.OnVideoReady, this);
this.mon(this.panelVideo, "videoremoved", this.OnVideoRemoved, this);
this.mon(this.panelVideo, "pause", this.OnPause, this);
this.mon(this.panelVideo, "resume", this.OnResume, this);
this.mon(this.panelVideo, "scalechanged", this.OnScaleChanged, this);
this.callParent()
},
InitPanelVideo: function(a) {
Ext.apply(a, {
owner: this,
resultDisplayer: this.resultController.GetDisplayer(),
listeners: {
resize: function(b, d, c) {
this.resultController.Resize(d, c)
},
scope: this
}
});
this.panelVideo = new SYNO.SS.App.WebPlayer.VideoContainer(a)
},
OnVideoReady: function() {
this.resultController.ShowDetRegion(this.blShowDetRegion);
this.resultController.SetAllowDisplay(true)
},
OnVideoRemoved: function() {
this.resultController.Reset();
this.resultController.ClearResult();
this.resultController.SetAllowDisplay(false)
},
OnPause: function() {
this.resultController.SetPaused(true)
},
OnResume: function() {
this.resultController.SetPaused(false)
},
RenderVideo: function() {
var a = this.GetTipByStatus();
if (a) {
this.panelVideo.ShowPlayerTip(a)
} else {
this.callParent()
}
},
OnRenderVideoDone: function(a) {
this.resultController.Resize(this.ctWidth, this.ctHeight - this.panelBanner.GetHeight());
this.InitResultDisplayer();
this.callParent([a])
},
OnCameraUpdate: function(d, c) {
var a = -1;
var b = null;
if ((d) && (0 < d.cameras.length)) {
a = d.cameras.findExact("id", this.GetCurCamIdOnHost());
if (-1 !== a) {
b = d.cameras[a];
this.OnCamStatusChanged(b.camStatus);
this.CheckIndicator(b);
this.CheckOsdBtnStatus(b);
this.panelVideo.UpdatePrivacyMask(b)
}
} else {
if (c) {
a = c.findExact("id", this.GetCurCamIdOnHost());
if (-1 !== a) {
this.OnCamStatusChanged(SYNO.SS.CamSts.DELETED)
}
}
}
},
OnScaleChanged: function() {
this.resultController.SetAllowDisplay(false === this.panelVideo.onScreenHandler.IsDigitalZoom())
},
CreateConfByCamRecord: function(a) {
var b = {
parent: this,
stmSrc: SYNO.SS.App.WebPlayer.Def.StreamSrc.LIVE,
videoType: a.get("camVideoType"),
resolution: SYNO.SS.App.WebPlayer.Utils.GetLiveReso(a, this.GetRealProfile()),
volume: parseInt(a.get("volume"), 10) / 100,
dsId: a.get("ownerDsId"),
id: a.get("id"),
idOnRec: a.get("camIdOnRecServer"),
param: {
method: "MixStream",
blMux: true,
browser: SYNO.SS.App.WebPlayer.Utils.GetHtml5BroswerType(),
stmSrc: SYNO.SS.App.WebPlayer.Def.StreamSrc.LIVE,
blLiveSharing: true,
supportPrivacyMask: true,
blAudio: ((true === this.blSupportAudio) && (true === a.get("blAudioPriv")) && (SYNO.SS.App.Camera.Def.AudioType.NONE !== a.get("audioType")))
},
fnSyncLatency: function(c) {
this.resultController.SetVideoLatency(c)
}.createDelegate(this)
};
this.ModifyConfIfIsSsc(b, a);
this.PatchStmProfileInConfig(b, a);
if ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.BASEVIEW !== this.viewType) && (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.BASEVIEW_PAUSE !== this.viewType)) {
b.liveBufferingMs = 2000
}
b.fnUpdateStreamTm = this.OnTimeUpdate.createDelegate(this);
b.IsHighFreqTimeupdate = true;
return b
},
GetDetectionType: function() {
return ITEM_TYPE_NONE
},
AddResult: function(a) {
this.resultController.EnqueueResult(a)
},
OnTimeUpdate: function(a) {
this.resultController.Draw(a % 268435455)
},
ShowDetRegion: function(a) {
this.blShowDetRegion = a;
this.resultController.ShowDetRegion(a)
}
});
Ext.define("SYNO.SS.App.WebPlayer.FaceHtml5PlayerPanel", {
extend: "SYNO.SS.App.WebPlayer.DetectionResult.Html5PlayerPanel",
taskRecord: null,
blWati4Schedule: false,
blSupPtzHandler: false,
blMonStoreUpdate: true,
blSetupHelper: false,
InitImpl: function(a) {
this.blSetupHelper = (a.extraCfg.simulatedTask) ? true : false;
var b = (this.blSetupHelper) ? a.extraCfg.simulatedTask.data : a.extraCfg.taskData;
this.taskRecord = new Ext.data.Record(b);
this.blMonStoreUpdate = (false !== a.extraCfg.blMonStoreUpdate);
this.panelBanner.SetTitle(this.taskRecord.get("name"), null);
var c = SYNO.SS.GblStore.GetCamStreamProfileByIdx(LOCAL_DS_ID, this.taskRecord.get("camera_id"), SYNO.SS.App.Camera.Def.ProfileSetting.VDO_ANALYSIS);
this.AppointStmProfile(c);
this.ownerCt = a.ownerCt
},
InitEventHandler: function() {
if (true === this.blMonStoreUpdate) {
this.mon(SYNO.SS.GblStore.faceRecognitionTaskModel, "storeupdate", this.OnTaskStoreUpdate, this)
}
this.callParent()
},
NeedToChangeBannerTitle: function() {
return false
},
GetTipByStatus: function() {
return this.ParseUnavailTip(this.taskRecord.data)
},
GetDetectionType: function() {
return ITEM_TYPE_FACE
},
InitResultDisplayer: function() {
this.resultController.InitDisplay(this.taskRecord, {
blSetupHelper: this.blSetupHelper
})
},
UpdateTaskData: function(c) {
var b;
for (var a in c) {
this.taskRecord.set(a, c[a])
}
b = SYNO.SS.GblStore.GetCamStreamProfileByIdx(LOCAL_DS_ID, this.taskRecord.get("camera_id"), SYNO.SS.App.Camera.Def.ProfileSetting.VDO_ANALYSIS);
if (b !== this.AppointStmProfile(b)) {
this.OnStmProfileChanged(b)
}
this.panelVideo.UpdatePrivacyMask(SYNO.SS.GblStore.dsCamera.getById(this.taskRecord.get("camera_id")).data);
this.InitResultDisplayer();
this.resultController.Refresh()
},
GetIndicatorRegions: function() {
return this.resultController.GetIndicatorRegions()
},
ParseUnavailTip: function(a) {
if (true === this.blSetupHelper) {
return
} else {
if ((true === a.deleted) || (0 === Object.keys(a).length)) {
return {
tip: _T("ss_common", "status_deleted")
}
} else {
if (false === a.enable) {
return {
img: "disable_thumb",
tip: _T("camera", "conn_status_disabled")
}
} else {
if (false === a.scheduleOn) {
return {
img: "disable_thumb",
tip: _T("archive", "pending_dueto_schedule")
}
}
}
}
}
},
OnCameraUpdate: function(d, c) {
var a = -1;
var b = null;
this.callParent([d, c]);
if ((d) && (0 < d.cameras.length) && (true === this.blSetupHelper)) {
a = d.cameras.findExact("id", this.GetCurCamIdOnHost());
if (-1 !== a) {
b = d.cameras[a];
if ((true === this.blSetupHelper) && (true !== SYNO.SS.Utils.IsCamOnlineSts(b.camStatus))) {
this.blSetupHelper = false;
this.RemoveVideo();
this.RenderVideo()
}
}
}
},
OnTaskStoreUpdate: function(f, e) {
var b = -1;
var d = this.taskRecord.get("id");
var c, a;
if (!d) {
return
}
if ((f) && (0 < f.task.length)) {
b = f.task.findExact("id", d);
if (-1 !== b) {
c = f.task[b];
a = this.ParseUnavailTip(c);
if (a) {
this.RemoveVideo();
this.panelVideo.ShowPlayerTip(a)
} else {
this.UpdateTaskData(c);
this.RenderVideo()
}
this.panelBanner.SetTitle(c.name, null)
}
}
if (e) {
b = e.findExact("id", d);
if (-1 !== b) {
this.RemoveVideo();
this.panelVideo.ShowPlayerTip(this.ParseUnavailTip({
deleted: true
}))
}
}
}
});
Ext.define("SYNO.SS.App.WebPlayer.FacePreviewHtml5PlayerPanel", {
extend: "SYNO.SS.App.WebPlayer.FaceHtml5PlayerPanel",
dsEvent: null,
storeUpdater: null,
maxDataSize: 0,
maxTolerance: 10,
constructor: function(b) {
var a = b.extraCfg.recCamInfo.dsId;
this.maxDataSize = b.extraCfg.maxDataSize || 200;
this.dsEvent = SYNO.SS.App.FaceRecognition.Utils.CreateHistoryStore(this, {
baseParams: b.extraCfg.baseParams
});
this.panelPlayList = new SYNO.SS.App.EventPlayer.FaceRecognitionPlayList(Ext.apply({
store: this.dsEvent,
parentWin: this,
widget: {
playlistMode: 0,
ShowEventDeleted: Ext.emptyFn,
ShowNoEvent: Ext.emptyFn,
SetPlayStatus: Ext.emptyFn,
GetPlayStatus: Ext.emptyFn
},
viewMode: SYNO.SS.App.FaceRecognition.Def.HISTORY_VIEW_MODE.DATABASE,
blTabPanel: false
}, b.extraCfg.listParam));
this.storeUpdater = new SYNO.SS.App.FaceRecognition.Component.EventStoreUpdater({
store: this.dsEvent,
fnOnStoreUpdate: this.OnEventStoreUpdate,
fnGetFilterParams: function() {
return {
task_ids: [SYNO.SS.GblStore.faceRecognitionTaskModel.RemapTaskId(a, b.extraCfg.taskId)],
dsId: [a]
}
},
fnScope: this
});
this.addManagedComponent(this.dsEvent);
this.addManagedComponent(this.storeUpdater);
this.callParent([b]);
this.mon(this, "afterrender", this.OnAfterRender, this);
this.mon(this.panelPlayList, "afterrender", function() {
this.panelPlayList.UpdatePlayListTitle(_T("event", "playlist"))
}, this);
this.mon(this.panelPlayList, "eventplaylistplay", function(d) {
var e = this.panelPlayList.dsEvent.getAt(d);
var c = SYNO.SS.App.FaceRecognition.Utils.CreateHistoryStore(this.findAppWindow(), {});
c.add(SYNO.SS.Utils.CloneRecords(e));
SYNO.SS.App.FaceRecognition.Utils.PlayRecord({
dsId: e.get("dsId"),
recId: e.get("uniqueId"),
oriEventStore: c
})
}, this)
},
OnAfterRender: function() {
var a = this.findAppWindow();
var b = SYNO.SS.App.EventPlayer.Def;
this.ownerCt.add({
xtype: "container",
style: "height: 100%; margin-left: " + b.BORDER_WIDTH + "px;",
ctCls: "webplayer_face_preview_ct",
items: [{
xtype: "container",
width: b.PLAY_LIST.SHADOW_IMG_WIDTH,
cls: "side_panel_right_shadow",
style: "height: 100%"
}, this.panelPlayList]
});
this.mon(this.ownerCt, "resize", this.OnResize, this);
this.mon(a, "show", function() {
this.OnResize(this.ownerCt, a.getWidth(), this.panelPlayList.getHeight())
}, this);
a.setWidth(a.getWidth() + this.panelPlayList.sizeCfg.WIDTH + b.PLAY_LIST.SHADOW_IMG_WIDTH);
a.minWidth = a.minWidth + this.panelPlayList.sizeCfg.WIDTH
},
OnResize: function(b, c, a) {
var d = SYNO.SS.App.EventPlayer.Def;
if (false === this.panelPlayList.rendered) {
return
}
this.setWidth(c - this.panelPlayList.sizeCfg.WIDTH - d.PLAY_LIST.SHADOW_IMG_WIDTH);
this.panelPlayList.setHeight(a)
},
OnEventStoreUpdate: function(a) {
if (0 < this.maxDataSize) {
this.RemoveExcessData()
}
this.panelPlayList.UpdateRecCnt()
},
RemoveExcessData: function() {
if ((this.maxDataSize + this.maxTolerance) <= this.dsEvent.getCount()) {
this.dsEvent.remove(this.dsEvent.getRange(this.maxDataSize))
}
}
});
Ext.define("SYNO.SS.App.WebPlayer.DetectionResult.RecordHtml5PlayerPanel", {
extend: "SYNO.SS.App.WebPlayer.RecordHtml5PlayerPanel",
webapiTask: null,
resultController: null,
blAfterSeek: false,
blShowDetRegion: true,
Init: function(b) {
SYNO.ux.Utils.InsertPlugin(b, {
ptype: "abstractBaseClass",
abstractMethods: ["PlayImpl"]
});
if (b.blShowDetRegion) {
this.blShowDetRegion = b.blShowDetRegion
}
this.viewType = b.viewType;
this.panelBanner = new SYNO.SS.App.WebPlayer.Banner({
viewType: b.viewType,
hidden: (false === b.blShowCamInfoLabel),
emptyTimeText: (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.TIMELINE === b.viewType) ? "--:--:--" : "",
ClearTime: function() {
this.SetRight(this.emptyTimeText)
}
});
this.resultController = new SYNO.SS.App.WebPlayer.DetectionResult.HistoryController({
displayerCfg: Ext.apply({
extraCfg: {
blLiveview: false
}
}, b.displayerCfg),
taskId: b.taskId,
owner: this
});
var a = {
owner: this,
viewType: b.viewType,
width: b.width,
height: b.height - this.panelBanner.GetHeight(),
blFixAspectRatio: b.blFixAspectRatio,
blShowVideoLabel: b.blShowVideoLabel,
blHideOsdBbar: b.blHideOsdBbar,
videoInfo: {
videoType: "",
videoResolution: ""
},
blFocused: b.blFocused,
blToogleResumePause: this.blToogleResumePause,
fnUpdateAudioInfo: this.UpdateAudioInfo.createDelegate(this)
};
Ext.apply(a, {
owner: this,
resultDisplayer: this.resultController.GetDisplayer(),
listeners: {
resize: function(c, e, d) {
this.resultController.Resize(e, d)
},
scope: this
}
});
this.panelVideo = new SYNO.SS.App.WebPlayer.VideoContainer(a)
},
InitEventHandler: function() {
this.mon(this, "beforedestroy", function() {
if (null != this.webapiTask) {
Ext.Ajax.abort(this.webapiTask);
this.webapiTask = null
}
});
this.mon(this, "videoinited", this.OnVideoReady);
this.mon(this, "timeupdate", this.OnTimeUpdate);
this.mon(this.panelVideo, "videoremoved", this.OnVideoRemoved, this);
this.mon(this.panelVideo, "scalechanged", this.OnScaleChanged, this);
this.mon(this.panelVideo, "pause", this.OnPause, this);
this.mon(this.panelVideo, "resume", this.OnResume, this);
this.callParent()
},
OnAfterRender: function() {
this.resultController.Resize(this.ctWidth, this.ctHeight - this.panelBanner.GetHeight());
this.owner.panelSettings.ctChkTimeSlice.setVisible(false);
this.owner.panelSettings.panelNext.setVisible(false);
this.callParent()
},
OnVideoReady: function() {
this.resultController.ShowDetRegion(this.blShowDetRegion);
this.resultController.SetAllowDisplay(true)
},
OnVideoRemoved: function() {
this.resultController.SetAllowDisplay(false)
},
OnScaleChanged: function() {
this.resultController.SetAllowDisplay(false === this.panelVideo.onScreenHandler.IsDigitalZoom())
},
CreateConf: function(a) {
var b = this.callParent([a]);
b.fnBufferUpdateEndCallback = this.OnBufferUpdateEndCB.createDelegate(this);
b.IsHighFreqTimeupdate = function() {
return false === this.blReverse
}.bind(this);
return b
},
Play: function(a, b) {
this.ResetBeforePlay();
this.PlayImpl(a, b)
},
GetCameraName: function() {
var b = SYNO.SS.GblStore.GetCamIdOnHost(this.record.get("dsId"), this.record.get("cameraId"));
var a = SYNO.SS.GblStore.dsCamera.getById(b);
return (a) ? a.get("name") : this.callParent()
},
OnPause: function() {
this.resultController.SetPaused(true)
},
OnResume: function() {
this.resultController.SetPaused(false)
},
OnBufferUpdateEndCB: function(a) {
if (!a) {
return
}
if (true === this.blAfterSeek) {
this.resultController.SearchForAlignerIdx(a);
this.blAfterSeek = false
}
},
OnTimeUpdate: function(a) {
this.resultController.Draw(a)
},
BeforeSeek: function() {
this.blAfterSeek = true;
this.resultController.ResetAlignerIdx();
this.resultController.ClearResult()
},
Seek: function(a) {
this.BeforeSeek();
this.callParent([a])
},
SetReverse: function(a) {
this.callParent(arguments);
this.resultController.SetReverse(a)
},
PrevFrame: function() {
this.BeforeSeek();
this.callParent(arguments)
},
NextFrame: function() {
this.BeforeSeek();
this.callParent(arguments)
},
ResetBeforePlay: function() {
this.resultController.ResetAlignerIdx();
this.resultController.Reset()
},
ShowDetRegion: function(a) {
this.blShowDetRegion = a;
this.resultController.ShowDetRegion(a)
}
});
Ext.define("SYNO.SS.App.WebPlayer.FaceRecordHtml5PlayerPanel", {
extend: "SYNO.SS.App.WebPlayer.DetectionResult.RecordHtml5PlayerPanel",
blToogleResumePause: false,
capturedFaceListener: null,
Init: function(a) {
this.capturedFaceListener = new SYNO.SS.App.FaceRecognition.Component.CapturedFaceUpdateListener({
UpdateImpl: function(c, b) {
if (0 === c.length) {
return
}
this.fnReloadAnalyticsResult.call(this.fnScope)
},
fnReloadAnalyticsResult: function() {
this.GetAnalyticsResult(this.record, {
callback: function(b, d, e, c) {
this.webapiTask = null;
if ((true === b) && (d)) {
this.resultController.SetResultBuffer(d.faceResult, this.GetConfStart(this.record));
this.resultController.Refresh()
}
},
scope: this
})
},
fnGetFilterParams: function() {
var b = [];
if (this.record) {
b.push(this.record.get("captured_face_id"))
}
return {
captured_face_ids: b
}
},
fnScope: this
});
this.addManagedComponent(this.capturedFaceListener);
this.callParent(arguments)
},
PlayImpl: function(c, e) {
var b = c.get("extraParam");
var d = (b) ? b.captured_face_id : c.get("captured_face_id");
var a = function(f) {
return ((f.captured_face || {}).id === d)
};
this.GetAnalyticsResult(c, {
callback: function(g, j, k, i) {
var f, h;
this.webapiTask = null;
if (g && j) {
f = this.GetTriggerAry(c, j.faceResult);
h = this.GetRespTaskRec(k.taskId, j.setting);
if (true === _S("IS_DVA_DEBUG_MODE")) {
this.owner.seekbar.UpdateDVAResult(f)
}
this.resultController.SetResultBuffer(j.faceResult, this.GetConfStart(c));
this.resultController.InitDisplay(h, {
fnAssignColor: function(l) {
if (true === a(l)) {
return SYNO.SS.App.FaceRecognition.Def.BBOX.FILTERED_COLOR_ID
}
},
fnFilter: a
});
this.resultController.ResetAlignerIdx()
}
SYNO.SS.App.WebPlayer.RecordHtml5PlayerPanel.prototype.Play.call(this, c, e)
},
scope: this
})
},
GetAnalyticsResult: function(b, d) {
var a = b.get("extraParam");
var g = (a) ? a.eventId : b.get("id");
var f = b.get("startTime") + b.get("startOffset");
var c = b.get("startTime") + b.get("customEndTime");
var e = (a) ? a.taskId : b.get("task_id");
if (!f) {
f = b.get("startTime")
}
if (!c) {
c = b.get("stopTime")
}
this.webapiTask = this.sendWebAPI(Ext.apply({
api: "SYNO.SurveillanceStation.Face.Result",
version: 1,
dsId: b.get("dsId"),
method: "GetAnalyticsResult",
params: {
taskId: e,
eventId: g,
startTime: f,
endTime: c,
start_time_msec: b.get("start_time_msec") || 0,
blAlertEvt: b.get("blAlertEvt") || false,
blIncludeRegisteredFace: true
}
}, d))
},
GetTriggerAry: function(f, d) {
var b = [];
var c = false;
var g = (f.get("customEndTime") - f.get("startOffset")) * TRANS_MILLISECOND;
var a = f.get("startOffset") * TRANS_MILLISECOND;
var i = 100 / this.owner.sizeCfg.IMAGE_WIDTH * 2.5;
var e = -1;
var h = -1;
d.forEach(function(k) {
var m = (k.frameId - a) / g * 100;
var l = c;
c = this.IsResultTriggered(f, k);
if (false === c) {
return
}
if (-1 !== e) {
var j = (l !== c);
if ((true === j) && (i <= (m - h))) {
b.push(e, h)
} else {
h = Math.min(m + i, 100);
return
}
}
e = m;
h = Math.min(e + i, 100)
}, this);
if (-1 !== e) {
b.push(e, h)
}
return b
},
IsResultTriggered: function(a, c) {
var b = a.get("captured_face_id");
return c.instances.some(function(d) {
return (b === d.captured_face_id)
})
},
GetRespTaskRec: function(c, d) {
var b = new Ext.data.Record(d);
var a = SYNO.SS.GblStore.faceRecognitionTaskModel.GetRecordById(LOCAL_DS_ID, c);
if (a) {
["name", "display_info", "frame_display_info", "recognized_color", "unrecognized_color", "allowed_color", "blocked_color", "vip_color"].forEach(function(e) {
b.set(e, a.get(e))
})
}
return b
}
});
Ext.define("SYNO.SS.App.WebPlayer.SpeakerHtml5PlayerPanel", {
extend: "SYNO.SS.App.WebPlayer.Html5PlayerPanel",
audioSource: null,
speakerStatus: null,
speakerStsFlags: null,
needReloadOSD: true,
Init: function(b) {
var a;
if (true === SYNO.SS.Utils.CheckNested(b, "extraCfg", "speakerId")) {
this.speakerId = b.extraCfg.speakerId
} else {
if (b.speakerId) {
this.speakerId = b.speakerId
}
}
if (true === SYNO.SS.Utils.CheckNested(b, "extraCfg", "speakerIdOnRec")) {
this.speakerIdOnRec = b.extraCfg.speakerIdOnRec
} else {
if (b.speakerIdOnRec) {
this.speakerIdOnRec = b.speakerIdOnRec
}
}
a = SYNO.SS.GblStore.dsIPSpeaker.getById(this.speakerId);
if (a) {
this.audioSource = a.get("liveviewAudioSource");
this.speakerStatus = a.get("status");
this.speakerStsFlags = a.get("statusFlags")
} else {
this.speakerStatus = SYNO.SS.IPSpeakerDev.Status.UNRECOGNIZED;
this.speakerStsFlags = SYNO.SS.CamStsFlag.NONE
}
this.callParent([b]);
if (a) {
if (true === SYNO.SS.Utils.CheckNested(b, "extraCfg", "speakerName")) {
this.panelBanner.SetTitle(b.extraCfg.speakerName, b.extraCfg)
} else {
if (b.speakerName) {
this.panelBanner.SetTitle(b.speakerName, b)
}
}
}
},
InitPanelVideo: function(a) {
a.speakerId = this.speakerId;
a.speakerIdOnRec = this.speakerIdOnRec;
this.panelVideo = new SYNO.SS.App.WebPlayer.SpeakerContainer(a);
this.panelVideo.SetSpeakerStatus(this.speakerStatus, this.speakerStsFlags)
},
InitEventHandler: function() {
this.mon(SYNO.SS.GblStore.dsIPSpeaker, "storeupdate", this.OnIPSpeakerUpdate, this);
this.callParent(arguments)
},
IsUsingCamera: function() {
var a = SYNO.SS.GblStore.dsIPSpeaker.getById(this.speakerId);
return ((true === Ext.isDefined(a)) && (true === a.get("pairedCamEnabled")))
},
OnIPSpeakerUpdate: function(d, c) {
var a = -1;
var b = null;
if ((d) && (0 < d.ipSpeakers.length)) {
a = d.ipSpeakers.findExact("id", this.speakerId);
if (-1 !== a) {
b = d.ipSpeakers[a];
if (this.audioSource !== b.liveviewAudioSource) {
this.audioSource = b.liveviewAudioSource;
this.ReplaceVideoInst()
}
Ext.apply(this.panelVideo.dsSpeaker.getById(this.speakerId).data, b);
this.OnSpeakerStatusChanged(b.status)
}
} else {
if (c) {
a = c.findExact("id", this.speakerId);
if (-1 !== a) {
this.OnSpeakerStatusChanged(SYNO.SS.IPSpeakerDev.Status.UNRECOGNIZED)
}
}
}
},
ReplaceVideoInst: function() {
if ((true === this.IsUsingCamera()) && (true === SYNO.SS.Utils.IsCamOnlineSts(this.camStatus)) && (false === SYNO.SS.CamStsFlag.IsTransientSts(this.stsFlags))) {
this.callParent(arguments)
} else {
this.panelVideo.ReplaceVideoInst({})
}
},
OnSlaveDSUpdate: function(d, c) {
var b;
var a;
if (LOCAL_DS_ID === this.dsId) {
return
}
if (true === SYNO.SS.Utils.IsSlaveDsOnline(this.dsId)) {
b = SYNO.SS.CamSts.NORMAL;
a = SYNO.SS.IPSpeakerDev.Status.NORMAL
} else {
b = SYNO.SS.CamSts.HOST_FAILED;
a = SYNO.SS.IPSpeakerDev.Status.SERVER_DISCONN
}
if (true === this.IsUsingCamera()) {
this.OnCamStatusChanged(b)
}
this.OnSpeakerStatusChanged(a)
},
OnCamStatusChanged: function(b) {
var c = SYNO.SS.GblStore.dsCamera.getById(this.GetCurCamIdOnHost());
var a;
if ((false === SYNO.SS.App.IPSpeaker.Utils.IsSpeakerNormalStatus(this.speakerStatus)) || (true === SYNO.SS.IPSpeakerStsFlag.IsTransientSts(this.speakerStsFlags))) {
return
}
if ((!c) || (true === c.get("deleted"))) {
b = SYNO.SS.CamSts.DELETED;
a = SYNO.SS.CamStsFlag.NONE
} else {
a = c.get("status_flags")
}
if ((b === this.camStatus) && (a === this.stsFlags)) {
return
}
this.needReloadOSD = true;
this.camStatus = b;
this.stsFlags = a;
this.ReplaceVideoInst();
if ((false === SYNO.SS.Utils.IsCamOnlineSts(b)) || (true === SYNO.SS.CamStsFlag.IsTransientSts(a))) {
this.panelBanner.ctLeft.RemoveIndicator();
this.ShowUnavailCamTip()
}
this.UpdateLiveviewStmInfo()
},
OnSpeakerStatusChanged: function(b) {
var d = SYNO.SS.GblStore.dsIPSpeaker.getById(this.speakerId);
var c;
var a;
if (!d) {
b = SYNO.SS.IPSpeakerDev.Status.UNRECOGNIZED;
a = SYNO.SS.CamStsFlag.NONE
} else {
a = d.get("statusFlags")
}
if ((b === this.speakerStatus) && (a === this.speakerStsFlags)) {
return
}
this.speakerStatus = b;
this.speakerStsFlags = a;
this.panelVideo.SetSpeakerStatus(b, a);
c = SYNO.SS.App.IPSpeaker.Utils.SpeakerStatusToDeviceStatus(b);
if ((true === SYNO.SS.Utils.IsCamOnlineSts(c)) && (false === SYNO.SS.IPSpeakerStsFlag.IsTransientSts(a))) {
this.RenderVideo()
} else {
this.RemoveVideo();
this.panelBanner.ctLeft.RemoveIndicator();
this.panelBanner.ctRight.RemoveIndicator();
this.ShowUnavailSpeakerTip()
}
this.UpdateLiveviewStmInfo()
},
ShowUnavailSpeakerTip: function() {
if (SYNO.SS.IPSpeakerDev.Status.UNRECOGNIZED === this.speakerStatus) {
return
} else {
if (SYNO.SS.IPSpeakerDev.Status.SETTING === this.speakerStatus) {
this.panelVideo.ShowPlayerTip({
tip: _T("camera", "conn_status_setting")
});
return
}
}
var a = "";
switch (this.speakerStatus) {
case SYNO.SS.IPSpeakerDev.Status.DISCONNECTED:
case SYNO.SS.IPSpeakerDev.Status.INACCESSIBLE:
case SYNO.SS.IPSpeakerDev.Status.SERVER_DISCONN:
case SYNO.SS.IPSpeakerDev.Status.UNAUTHORIZED:
a = "speaker_empty_abnormal_thumb";
break;
default:
a = "speaker_empty_disable_thumb";
break
}
this.panelVideo.ShowPlayerTip({
img: a,
tip: _T("axis_access_controller", "no_paired_camera")
})
},
RenderVideo: function() {
var c, a, b, d;
if (this.panelVideo.videoInst) {
return
}
var e = SYNO.SS.App.IPSpeaker.Utils.SpeakerStatusToDeviceStatus(this.speakerStatus);
if ((false === SYNO.SS.Utils.IsCamOnlineSts(e)) || (true === SYNO.SS.CamStsFlag.IsTransientSts(this.speakerStsFlags))) {
this.ShowUnavailSpeakerTip();
return
}
a = this.PrepareCamRecord();
b = SYNO.SS.GblStore.dsIPSpeaker.getById(this.speakerId);
if (!a) {
this.ShowEmptyPlayer();
this.panelVideo.InitVideoInst({});
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_IPSPEAKER === this.viewType) {
d = false;
if (false === Ext.isEmpty(b)) {
d = (SYNO.SS.App.Camera.Def.AudioType.NONE !== b.data.audioType)
}
this.panelBanner.ctRight.SetAudioIcon(d)
}
} else {
this.InitPlayerStsByRec(a);
if ((SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_IPSPEAKER === this.viewType) && (false === Ext.isEmpty(b))) {
if (SYNO.SS.App.IPSpeaker.Def.Source.IPSPEAKER === b.get("liveviewAudioSource")) {
d = (SYNO.SS.App.Camera.Def.AudioType.NONE !== b.get("audioType"))
} else {
d = (SYNO.SS.App.Camera.Def.AudioType.NONE !== a.get("audioType"))
}
this.panelBanner.ctRight.SetAudioIcon(d)
}
if ((true === SYNO.SS.Ssc.IsFisheyeUnsupported(this.regionId)) || (false === SYNO.SS.Utils.IsCamOnlineSts(this.camStatus))) {
this.ShowUnavailCamTip()
}
c = this.CreateConfByCamRecord(a);
this.panelVideo.InitVideoInst(c);
this.OnRenderVideoDone(a)
}
},
SetMediaInfo: function(a) {
if (this.mediaInfo != a) {
this.needReloadOSD = true
}
this.callParent([a])
},
ShowEmptyPlayer: function() {
this.panelVideo.ShowPlayerTip({
img: "speaker_empty_thumb",
tip: _T("axis_access_controller", "no_paired_camera")
})
},
CreateConfByCamRecord: function(c) {
var b = {};
var a = SYNO.SS.GblStore.dsIPSpeaker.getById(this.speakerId);
if ((a) && (true === a.get("pairedCamEnabled")) && (true === Ext.isDefined(c))) {
b = this.callParent([c]);
if (SYNO.SS.App.IPSpeaker.Def.Source.IPSPEAKER === a.get("liveviewAudioSource")) {
b.param.blAudio = false
}
}
return b
}
});
Ext.define("SYNO.SS.App.WebPlayer.SpeakerGroupHtml5PlayerPanel", {
extend: "SYNO.SS.App.WebPlayer.Html5PlayerPanel",
groupId: 0,
Init: function(a) {
if (true === SYNO.SS.Utils.CheckNested(a, "extraCfg", "groupId")) {
this.groupId = a.extraCfg.groupId
} else {
if (true === Ext.isDefined(a.groupId)) {
this.groupId = a.groupId
}
}
this.callParent([a]);
if (true === SYNO.SS.Utils.CheckNested(a, "extraCfg", "groupName")) {
this.panelBanner.SetTitle(a.extraCfg.groupName, a.extraCfg)
} else {
if (a.groupName) {
this.panelBanner.SetTitle(a.groupName, a)
}
}
},
RenderVideo: function() {
var b, a;
if (this.panelVideo.videoInst) {
return
}
a = this.PrepareCamRecord();
if (!a) {
this.panelVideo.InitVideoInst({
param: {
blAudio: false
}
});
this.ShowEmptyPlayer()
} else {
this.InitPlayerStsByRec(a);
if ((true === SYNO.SS.Ssc.IsFisheyeUnsupported(this.regionId)) || (false === SYNO.SS.Utils.IsCamOnlineSts(this.camStatus))) {
this.ShowUnavailCamTip()
}
b = this.CreateConfByCamRecord(a);
this.panelVideo.InitVideoInst(b);
this.OnRenderVideoDone(a)
}
},
SetMediaInfo: function(a) {
Ext.apply(a, {
groupId: this.groupId
});
this.callParent([a])
},
ShowEmptyPlayer: function() {
this.panelVideo.ShowPlayerTip({
img: "speaker_group_empty_thumb",
tip: _T("axis_access_controller", "no_paired_camera")
})
},
InitPanelVideo: function(a) {
a.groupId = this.groupId;
this.panelVideo = new SYNO.SS.App.WebPlayer.SpeakerGroupContainer(a)
},
CreateConfByCamRecord: function(a) {
var b = {
parent: this,
stmSrc: SYNO.SS.App.WebPlayer.Def.StreamSrc.LIVE,
videoType: a.get("camVideoType"),
resolution: SYNO.SS.App.WebPlayer.Utils.GetLiveReso(a, this.realProfile),
blMute: true,
dsId: a.get("ownerDsId"),
id: a.get("id"),
idOnRec: a.get("camIdOnRecServer"),
param: {
method: "MixStream",
blMux: true,
browser: SYNO.SS.App.WebPlayer.Utils.GetHtml5BroswerType(),
stmSrc: SYNO.SS.App.WebPlayer.Def.StreamSrc.LIVE,
supportPrivacyMask: true,
blLiveSharing: true,
blAudio: false
}
};
if (true === SYNO.SS.Utils.IsSsc()) {
if (true === SYNO.SS.Ssc.IsPluginPlayer(a, this.regionId, this.blAnalyticsEdit, this.blVideoViewer)) {
SYNO.SS.Ssc.SetPluginConf(b, true, a, this.regionId, null, this.blAnalyticsEdit, this.blVideoViewer)
} else {
b.gpuRes = SYNO.SS.Ssc.GetLiveGpuResource(a.get("stm_info"))
}
}
return b
},
ShowNoSource: function() {
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.PREVIEW_IPSPEAKER_GROUP === this.viewType) {
if ((true === Ext.isDefined(this.groupId)) && (0 < this.groupId)) {
this.SetMediaInfo({
ownerDsId: this.dsId
})
}
}
},
InitPlayerStsByRec: function(a) {
this.dsId = a.get("ownerDsId");
this.camStatus = a.get("camStatus");
this.CheckIndicator(a.data);
this.panelVideo.UpdateAudioToolTip(a.get("audioType"))
}
});
Ext.define("SYNO.SS.App.WebPlayer.SequencePlayer", {
extend: "SYNO.SS.App.WebPlayer.Html5PlayerPanel",
DEFAULT_INTERVAL: 10,
camList: null,
advLiveMap: null,
curCamIndex: 0,
interval: 10,
switchTaskName: "switchChannelTask",
constructor: function(a) {
this.curCamIndex = 0;
this.camList = a.camList;
this.interval = a.interval;
this.advLiveMap = {};
this.callParent([a]);
this.InitSeqEventHandler();
this.RunDelayTask()
},
InitSeqEventHandler: function() {
this.mon(this, "beforedestroy", this.OnBeforeDestroy, this);
this.mon(this.panelVideo, "videoReplaced", this.OnNextChannelReady, this);
this.mon(this.panelVideo, "videoinited", this.OnNextChannelReady, this);
this.mon(this.panelVideo, "videoUnsupported", this.OnNextChannelReady, this);
this.mun(this, "afterrender", this.RenderVideo, this);
this.mon(this, "afterrender", this.PlayNextCam, this)
},
GetCurCamIdOnHost: function() {
if ((this.camList) && (0 < this.camList.length)) {
if (!this.camList[this.curCamIndex]) {
this.curCamIndex = 0
}
return this.camList[this.curCamIndex].idOnHost
}
return 0
},
SwitchChannel: function() {
if (true === this.isDestroyed) {
return
}
this.curCamIndex = (this.curCamIndex + 1) % this.camList.length;
this.PlayNextCam();
this.RunDelayTask()
},
PlayNextCam: function() {
var b, a;
a = this.PrepareCamRecord();
if (!a) {
this.panelVideo.RemoveVideoInst();
this.ShowEmptyPlayer();
return
}
this.dsId = a.get("ownerDsId");
this.camStatus = a.get("camStatus");
this.regionId = this.camList[this.curCamIndex].regionId;
if ((true === SYNO.SS.Ssc.IsFisheyeUnsupported(this.regionId)) || (false === SYNO.SS.Utils.IsCamOnlineSts(this.camStatus))) {
this.PlayUnavailChannel(a);
this.ShowUnavailCamTip();
this.fireEvent("camerachanged", a);
return
}
this.realProfile = SYNO.SS.App.Camera.Def.Profile.DEFAULT;
this.SetAdvLiveFlag(true === this.advLiveMap[this.GetCurCamIdOnHost()]);
this.PatchRealProfile(a);
b = this.CreateConfByCamRecord(a);
if (this.panelVideo.videoInst) {
this.panelVideo.ReplaceVideoInst(b, true)
} else {
this.panelVideo.InitVideoInst(b)
}
},
OnBeforeDestroy: function() {
this.removeDelayedTask(this.switchTaskName);
this.callParent()
},
SetInterval: function(a) {
this.interval = a || this.DEFAULT_INTERVAL;
this.RunDelayTask()
},
RunDelayTask: function() {
if (0 < this.camList.length) {
this.runTask(this.switchTaskName, this.SwitchChannel.createDelegate(this), this.interval * TRANS_MILLISECOND)
}
},
OnNextChannelReady: function() {
var a = this.PrepareCamRecord();
if (!a) {
return
}
this.panelVideo.SetMute(a.get("mute"));
this.panelVideo.UpdatePrivacyMask(a.data);
this.panelBanner.SetTitle(this.GetCameraName(a), a.data);
this.CheckIndicator(a.data);
SYNO.SDS.StatusNotifier.fireEvent("recStatusChange", {
camId: (LOCAL_DS_ID === a.get("ownerDsId")) ? a.get("id") : a.get("camIdOnRecServer"),
dsId: a.get("ownerDsId"),
recMethod: a.get("recStatus")
});
this.UpdateLiveviewStmInfo();
this.fireEvent("camerachanged", a)
},
PlayUnavailChannel: function(a) {
this.panelVideo.RemoveVideoInst();
this.panelBanner.SetTitle(this.GetCameraName(a), a.data);
this.panelBanner.ctLeft.RemoveIndicator();
this.panelBanner.ctRight.SetAudioIcon(SYNO.SS.App.Camera.Def.AudioType.NONE !== a.data.audioType);
this.UpdateLiveviewStmInfo()
},
NeedToHideStreamInfo: function(a) {
if (true === SYNO.SS.Ssc.IsFisheyeUnsupported(this.camList[this.curCamIndex].regionId)) {
return true
}
return this.callParent(arguments)
},
GetCameraName: function(a) {
var b = a.get("name");
if (0 < this.camList[this.curCamIndex].regionId) {
b += " - " + this.camList[this.curCamIndex].regionName
}
return b
},
ResetCamList: function(a) {
this.camList = a
},
OnPlayerEvtDetected: function(a, b) {
this.advLiveMap[b] = a;
if (b === this.GetCurCamIdOnHost()) {
this.SetAdvLiveFlag(a);
this.TriggerChangeProfile(true)
}
}
});
Ext.define("SYNO.SS.App.WebPlayer.TimeSlicePlayer", {
extend: "Ext.Container",
panelPlayer: null,
owner: null,
duration: 0,
SLICE_NUM: 4,
playerStatus: 4,
constructor: function(a) {
this.Init(a);
this.callParent([Ext.apply(a, {
items: this.panelPlayer
})]);
this.mon(this, "switched", this.panelPlayer.HideBorder, this.panelPlayer);
this.mon(this, "beforedestroy", this.OnBeforeDestroy, this)
},
OnBeforeDestroy: function() {
this.RelayActions("OnBeforeDestroy")
},
Init: function(a) {
this.owner = a.owner;
this.panelPlayer = new SYNO.SS.App.WebPlayer.TimeSliceLayout({
owner: this,
playerWidth: a.width,
playerHeight: a.height - 2,
extraCfg: a.extraCfg
})
},
GenerateSectionIndicator: function(b) {
var d, a, c;
switch (b) {
case 0:
c = "icon_indicator_section_01.png?v=10061";
break;
case 1:
c = "icon_indicator_section_02.png?v=10061";
break;
case 2:
c = "icon_indicator_section_03.png?v=10061";
break;
case 3:
c = "icon_indicator_section_04.png?v=10061";
break;
default:
c = "icon_indicator_section_01.png?v=10061";
break
}
a = (true === SYNO.SS.Image.IsRetinaSupport()) ? "2x" : "1x";
d = document.createElement("img");
d.setAttribute("src", "modules/WebPlayer/images/" + a + "/" + c);
return d
},
RelayActions: function(c) {
var b = this.panelPlayer.GetChannels();
var a = arguments;
Ext.each(b, function(e) {
var d = e.player;
if (!d) {
return true
}
d[c].apply(d, Array.prototype.slice.call(a, 1))
})
},
SetMask: function(a) {
this.panelPlayer.SetMask(a)
},
DoImageEnhancement: function(a) {
this.RelayActions("DoImageEnhancement", a)
},
BannerAct: function(a) {
this.RelayActions("BannerAct", a, arguments[1], arguments[2])
},
Play: function(f, d) {
var g = this.panelPlayer.GetChannels();
var b, k, e = 0;
var j, c, h;
var a = f.get("startOffset");
this.duration = f.get("stopTime") - f.get("startTime");
this.panelPlayer.recStartTime = f.get("startTime");
b = this.duration / this.SLICE_NUM;
a = a || 0;
c = a % b;
for (e = 0; e < this.SLICE_NUM; e++) {
k = g[e].player;
h = this.CloneRecWithNewData(f);
h.data.startOffset = Math.ceil(b * e + c);
h.data.customStartTime = Math.ceil(b * e);
h.data.customEndTime = Math.ceil(b * (e + 1));
k.Play(h, d);
k.BannerAct("SetLeftIndicator", this.GenerateSectionIndicator(e));
k.SetFocus(false)
}
j = Math.floor(a / b);
this.panelPlayer.SetFocus(g[j]);
this.playerStatus = SYNO.SS.App.WebPlayer.Def.PlayerStatus.READY_TO_PLAY
},
Pause: function() {
this.RelayActions("Pause")
},
Resume: function() {
this.RelayActions("Resume");
this.statePlaying = SYNO.SS.App.Event.Def.PLAYER_STATE_PLAYING
},
Stop: function() {
this.RelayActions("Stop");
this.playerStatus = SYNO.SS.App.WebPlayer.Def.PlayerStatus.STOP
},
PrevFrame: function() {
this.RelayActions("PrevFrame")
},
NextFrame: function() {
this.RelayActions("NextFrame")
},
SetMute: function(a) {
this.RelayActions("SetMute", a)
},
SetReverse: function(a) {
this.RelayActions("SetReverse", a)
},
Seek: function(d) {
var c = 0;
var a = this.panelPlayer.GetChannels();
var b = Math.ceil(this.duration / this.SLICE_NUM);
var e = Math.floor(d % b);
var f = Math.floor(d / b);
for (c = 0; c < this.SLICE_NUM; c++) {
a[c].player.Seek(b * c + e)
}
this.panelPlayer.SetFocus(a[f])
},
SetSpeed: function(a) {
this.RelayActions("SetSpeed", a)
},
SetFixAspect: function(a) {
this.RelayActions("SetFixAspect", a)
},
GetCurStreamTm: function() {
return this.panelPlayer.GetCurStreamTm()
},
GetRecordStartTime: function() {
return this.panelPlayer.GetRecordStartTime()
},
GetRecordEndTime: function() {
return this.panelPlayer.GetRecordEndTime()
},
IsFrameReady: function() {
var a = this.panelPlayer.GetChannels();
return a.some(function(b) {
return b.player.IsFrameReady()
})
},
GetVideoInst: function() {
return this.panelPlayer.GetLastVideoInst()
},
SetBannerTime: function(b) {
var e = 0;
var a = this.panelPlayer.GetChannels();
var c = Math.ceil(this.duration / this.SLICE_NUM);
var d = this.panelPlayer.GetFocusChannelIdx();
for (e = 0; e < this.SLICE_NUM; e++) {
a[e].player.SetBannerTime(c * (e - d) + b)
}
},
ShowPlayerTip: Ext.emptyFn,
HidePlayerTip: Ext.emptyFn,
GetPlayerStatus: function() {
return this.playerStatus
},
IsPlayable: function() {
return (SYNO.SS.App.WebPlayer.Def.PlayerStatus.STOP !== this.playerStatus)
},
CloneRecWithNewData: function(b) {
var a = b.copy();
a.data = SYNO.SS.Utils.DeepCopy(b.data);
return a
}
});
Ext.define("SYNO.SS.App.WebPlayer.TimeSliceLayout", {
extend: "Ext.Container",
BORDER_WIDTH_PX: 2,
SLICE_NUM: 4,
channels: null,
panelBorder: null,
panelLayout: null,
videoInitedList: null,
streamEndedList: null,
focusChannel: null,
channelWidth: null,
channelHeight: null,
recStartTime: null,
constructor: function(a) {
this.Init(a);
this.callParent([Ext.apply(a, {
items: [this.panelLayout, this.panelBorder]
})])
},
Init: function(a) {
var b = 0;
this.statePlaying = SYNO.SS.App.Event.Def.PLAYER_STATE_NONE;
this.channels = [];
this.InitStatusArrays();
this.channelWidth = (a.playerWidth - this.BORDER_WIDTH_PX) / 2;
this.channelHeight = (a.playerHeight - this.BORDER_WIDTH_PX) / 2;
this.panelBorder = new Ext.BoxComponent({
cls: "timeslice_border"
});
this.floatBorderV = new Ext.BoxComponent({
cls: "float_border",
height: this.BORDER_WIDTH_PX,
Adjust: function(d, c, e) {
switch (d.channelIdx) {
case 0:
case 1:
this.setVisible(true);
this.el.setStyle("top", "0px");
this.el.setStyle("left", String.format("{0}px", e));
this.setWidth(c);
break;
default:
this.setVisible(false);
break
}
return
}
});
this.floatBorderH = new Ext.BoxComponent({
cls: "float_border",
width: this.BORDER_WIDTH_PX,
Adjust: function(d, c, e) {
this.setVisible(true);
switch (d.channelIdx) {
case 0:
case 2:
this.el.setStyle("right", "");
this.el.setStyle("left", "0px");
break;
case 1:
case 3:
this.el.setStyle("left", "");
this.el.setStyle("right", "0px");
break;
default:
return
}
this.el.setStyle("top", String.format("{0}px", e));
this.setHeight(c)
}
});
for (b = 0; b < this.SLICE_NUM; b++) {
this.channels.push(this.CreateChannels(b, a))
}
this.panelLayout = new Ext.Container({
cls: "timeslice_table",
layout: {
type: "table",
columns: 2
},
items: this.channels,
listeners: {
afterrender: function() {
var c = this.findAppWindow();
c.add([this.floatBorderV, this.floatBorderH]);
c.doLayout();
this.SetMediaInfo()
},
scope: this
}
})
},
InitStatusArrays: function() {
this.videoInitedList = [];
this.streamEndedList = []
},
CreateChannels: function(a, b) {
var c = new SYNO.SS.App.WebPlayer.RecordHtml5PlayerPanel({
width: this.channelWidth,
height: this.channelHeight,
viewType: SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.RECORDING,
extraCfg: b.extraCfg,
listeners: {
videoInited: this.OnVideoInited.createDelegate(this, [a]),
streamended: this.OnStreamEnded.createDelegate(this, [a], true),
timeupdate: this.OnTimeUpdate.createDelegate(this, [a], true)
}
});
return new Ext.Container({
width: this.channelWidth,
height: this.channelHeight,
items: c,
player: c,
channelIdx: a,
listeners: {
afterrender: function(d) {
d.mon(d.el, "click", function(f) {
this.OnChannelClick(f, d)
}, this)
},
scope: this
},
setSize: function(e, d) {
Ext.Container.superclass.setSize.call(this, arguments);
this.player.setSize(e, d);
this.player.ResizePlayer(e, d)
}
})
},
SetFocus: function(a) {
if (this.focusChannel) {
this.focusChannel.player.SetFocus(false)
}
this.focusChannel = a;
a.player.SetFocus(true);
this.SetPanelBorder(a);
this.owner.fireEvent("timeupdate", this.GetCurStreamTm(a.channelIdx), this.recStartTime)
},
SetPanelBorder: function(d) {
var g = 0,
f = 0;
var c = 0,
a = 0;
var b = d.getEl().dom.getBoundingClientRect();
var e = this.getEl().dom.getBoundingClientRect();
g = b.left - e.left - this.BORDER_WIDTH_PX;
f = b.top - e.top - this.BORDER_WIDTH_PX;
c = d.getWidth() + 2 * this.BORDER_WIDTH_PX;
a = d.getHeight() + 2 * this.BORDER_WIDTH_PX;
this.panelBorder.el.setStyle("left", String.format("{0}px", g));
this.panelBorder.el.setStyle("top", String.format("{0}px", f));
this.panelBorder.setVisible(true);
this.panelBorder.setWidth(c);
this.panelBorder.setHeight(a);
this.floatBorderV.Adjust(d, c, g + this.BORDER_WIDTH_PX);
this.floatBorderH.Adjust(d, a, f + this.BORDER_WIDTH_PX)
},
GetCurPlayer: function() {
return this.GetChannels()[this.GetFocusChannelIdx()].player
},
GetChannelStreamTm: function(b) {
var a = this.channels[b].player;
return (a) ? a.GetCurStreamTm() : 0
},
GetCurStreamTm: function() {
return this.GetChannelStreamTm(this.GetFocusChannelIdx())
},
GetLastStreamTm: function() {
return this.GetChannelStreamTm(this.SLICE_NUM - 1)
},
GetRecordStartTime: function() {
var a = this.channels[0].player;
return (a) ? a.GetRecordStartTime() : 0
},
GetRecordEndTime: function() {
var a = this.channels[this.SLICE_NUM - 1].player;
return (a) ? a.GetRecordEndTime() : 0
},
GetLastVideoInst: function() {
var a = this.channels[this.SLICE_NUM - 1].player;
return (a) ? a.panelVideo.videoInst : null
},
GetFocusChannelIdx: function() {
if (this.focusChannel) {
return this.focusChannel.channelIdx
}
return 0
},
GetChannels: function() {
return this.channels
},
HideBorder: function() {
this.panelBorder.setVisible(false);
this.floatBorderV.setVisible(false);
this.floatBorderH.setVisible(false)
},
SetMediaInfo: function() {
for (var a = 0; a < this.SLICE_NUM; a++) {
this.channels[a].player.SetMediaInfo()
}
},
OnChannelClick: function(b, a) {
if (this.focusChannel === a) {
return
}
this.SetFocus(a)
},
OnVideoInited: function(a) {
this.videoInitedList[a] = true;
for (var b = 0; b < this.SLICE_NUM; b++) {
if (true !== this.videoInitedList[b]) {
return
}
}
this.owner.fireEvent("videoinited");
this.videoInitedList = [];
this.panelBorder.setVisible(true)
},
OnTimeUpdate: function(d, c, b, a) {
if ((!this.focusChannel) || (b !== this.focusChannel.player)) {
return
}
this.owner.fireEvent("timeupdate", d, c, this.channels[a].player)
},
OnStreamEnded: function(b, d, a) {
this.streamEndedList[a] = true;
for (var c = 0; c < this.SLICE_NUM; c++) {
if (true !== this.streamEndedList[c]) {
return
}
}
this.panelBorder.setVisible(false);
this.owner.fireEvent("streamended", b, this.GetCurPlayer());
this.owner.playerStatus = SYNO.SS.App.WebPlayer.Def.PlayerStatus.STOP;
this.streamEndedList = []
}
});
Ext.namespace("SYNO.SS.App.WebPlayer");
Ext.define("SYNO.SS.App.WebPlayer.MetaRecordHtml5PlayerPanel", {
extend: "SYNO.SS.App.WebPlayer.RecordHtml5PlayerPanel",
simulatorHelper: null,
alignerIdx: 0,
recEvtType: 0,
recStartTimeMs: 0,
recStartTime: 0,
blAfterSeek: false,
metaType: 0,
taskId: 0,
dsId: 0,
blShowDetRegion: true,
reverseIdxWrapper: {
StartIdx: function(a, b) {
return (true === a) ? (b.length - 1) : 0
},
NextIdx: function(a, b) {
return (true === a) ? Math.max((b - 1), 0) : (b + 1)
},
PrevIdx: function(a, b) {
return (true === a) ? (b + 1) : Math.max((b - 1), 0)
},
BoundedPrevIdx: function(a, c, d) {
var b = this.StartIdx(a, d);
var e = this.PrevIdx(a, c);
return (true === a) ? Math.min(b, e) : Math.max(b, e)
}
},
constructor: function(a) {
this.callParent([a])
},
Init: function(b) {
var d;
var c = SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE;
this.viewType = b.viewType;
this.panelBanner = new SYNO.SS.App.WebPlayer.Banner({
viewType: b.viewType,
hidden: (false === b.blShowCamInfoLabel),
emptyTimeText: "",
ClearTime: function() {
this.SetRight(this.emptyTimeText)
}
});
if (b.blShowDetRegion) {
this.blShowDetRegion = b.blShowDetRegion
}
this.panelVideoAnalytics = new SYNO.SS.App.WebPlayer.VideoAnalayitcsResultDisplayer({
vdoContainerType: SYNO.SS.App.VideoAnalytics.Def.VDO_CONTAINER_TYPE.RECORDING,
owner: this
});
this.AppendLabel(this.panelVideoAnalytics.panelDisplay);
if (c.DVA_RECORDING === this.viewType) {
this.metaType = SYNO.SS.Event.RecType.IVA;
this.taskId = b.extraCfg.ivaTaskIdOnRec;
d = this.panelVideoAnalytics
}
this.resultController = new SYNO.SS.App.WebPlayer.DetectionResult.HistoryController({
displayerCfg: Ext.apply({
canvasHeight: b.height,
canvasWidth: b.width,
extraCfg: {
blLiveview: false
}
}),
owner: this
});
if (c.FACE_RECORDING === this.viewType) {
this.metaType = SYNO.SS.Event.RecType.FACE;
this.taskId = b.extraCfg.taskId;
d = this.resultController.GetDisplayer()
}
this.panelTransaction = new SYNO.SS.App.WebPlayer.TransactionContainer({
owner: this,
mode: "record",
posId: b.posId,
dsId: b.dsId
});
if (c.POS_RECORDING === this.viewType) {
this.metaType = SYNO.SS.Event.RecType.POS;
this.taskId = b.posId;
this.dsId = b.dsId;
d = this.panelTransaction
}
var a = [this.panelVideoAnalytics, this.resultController.GetDisplayer(), this.panelTransaction].filter(function(e) {
return (e !== d)
});
this.panelVideo = new SYNO.SS.App.WebPlayer.VideoContainer({
owner: this,
items: a,
resultDisplayer: d,
viewType: b.viewType,
width: b.width,
height: b.height - this.panelBanner.GetHeight(),
blFixAspectRatio: b.blFixAspectRatio,
blShowVideoLabel: b.blShowVideoLabel,
blHideOsdBbar: b.blHideOsdBbar,
blShowPrivMaskUI: b.blShowPrivMaskUI,
videoInfo: {
videoType: "",
videoResolution: ""
},
blFocused: b.blFocused,
fnUpdateAudioInfo: this.UpdateAudioInfo.createDelegate(this),
listeners: {
resize: function(e, g, f) {
this.panelVideoAnalytics.Resize(g, f);
this.resultController.Resize(g, f)
},
scope: this
}
})
},
InitEventHandler: function() {
this.panelVideoAnalytics.EnableEvent(true);
this.mon(this, "beforedestroy", function() {
this.panelVideoAnalytics.EnableEvent(false);
this.panelVideoAnalytics = null
}, this);
this.mon(this, "timeupdate", this.OnTimeUpdate, this);
this.mon(this.panelVideo, "pause", this.OnPause, this);
this.mon(this.panelVideo, "resume", this.OnResume, this);
this.mon(this, "videoinited", this.OnVideoReady, this);
this.mon(this.panelVideo, "videoremoved", this.OnVideoRemoved, this);
this.mon(this.panelVideo, "scalechanged", this.OnScaleChanged, this);
this.callParent()
},
OnAfterRender: function() {
this.panelVideoAnalytics.InitCanvas({});
this.resultController.Resize(this.ctWidth, this.ctHeight - this.panelBanner.GetHeight());
if (this.owner) {
this.owner.panelSettings.ctChkTimeSlice.setVisible(false);
this.owner.panelSettings.panelNext.setVisible(false)
}
this.callParent()
},
OnVideoReady: function() {
this.resultController.SetAllowDisplay(true);
this.resultController.ShowDetRegion(this.blShowDetRegion);
this.panelVideoAnalytics.ShowDetRegion(this.blShowDetRegion)
},
OnVideoRemoved: function() {
this.resultController.Reset();
this.resultController.ClearResult();
this.resultController.SetAllowDisplay(false)
},
OnScaleChanged: function() {
this.resultController.SetAllowDisplay(false === this.panelVideo.onScreenHandler.IsDigitalZoom())
},
CreateConf: function(a) {
var b = this.callParent([a]);
b.param.metaType = this.metaType;
b.param.taskId = this.taskId;
b.fnReceiveMeta = (this.simulatorHelper) ? Ext.emptyFn : this.ReceiveMeta.createDelegate(this);
b.fnBufferUpdateEndCallback = (this.simulatorHelper) ? Ext.emptyFn : this.OnBufferUpdateEndCB.createDelegate(this);
b.IsHighFreqTimeupdate = true;
return b
},
Play: function(a, b) {
this.ResetBeforePlay(a);
this.recStartTimeMs = (this.simulatorHelper) ? 0 : a.get("start_time_msec");
this.recStartTime = a.get("startTime");
SYNO.SS.App.WebPlayer.RecordHtml5PlayerPanel.prototype.Play.call(this, a, b);
this.AfterRecordSetup()
},
AfterRecordSetup: function() {
if ((this.record) && (true === this.record.get("use_timeout_player"))) {
this.mon(this, "videoinited", function() {
this.ShowPlayerEmptyBackground(true, this.record.get("status"))
}, this, {
single: true
})
}
},
FaceRecInit: function(d) {
var c = this.GetFaceRespTaskRec(d.task_id, d);
var b = this.record.get("extraParam");
var e;
if (b) {
var a = function(f) {
return ((f.captured_face || {}).id === b.captured_face_id)
};
e = {
fnAssignColor: function(f) {
if (true === a(f)) {
return SYNO.SS.App.FaceRecognition.Def.BBOX.FILTERED_COLOR_ID
}
},
fnFilter: a
}
}
this.resultController.SetRecStartTimeMS(this.recStartTimeMs);
this.resultController.InitDisplay(c, e)
},
GetIVARespTaskRec: function(f, a, g) {
var d, c;
var e = SYNO.SS.App.VideoAnalytics.Utils.GetIvaTaskStore(a);
var b = SYNO.SS.App.VideoAnalytics.Utils.GetRecByDsIdAndRecId(a, f, e);
d = new Ext.data.JsonStore({
autoDestroy: true,
idProperty: "id",
fields: SYNO.SS.GblStore.fieldVideoAnalyticsTask,
data: g
});
c = d.getById(f);
if (b) {
c.set("people_display_info", b.get("people_display_info"));
c.set("people_display_pos", b.get("people_display_pos"));
c.set("name", b.get("name"));
c.set("groupName", b.get("groupName"));
c.set("isGroupEnabled", b.get("isGroupEnabled"))
}
return c
},
GetFaceRespTaskRec: function(c, d) {
var b = new Ext.data.Record(d);
var a = SYNO.SS.GblStore.faceRecognitionTaskModel.GetRecordById(this.record.get("dsId"), c);
if (a) {
["name", "display_info", "frame_display_info", "recognized_color", "unrecognized_color", "allowed_color", "blocked_color", "vip_color"].forEach(function(e) {
b.set(e, a.get(e))
})
}
return b
},
ReceiveMeta: function(e, d, c) {
var b;
if (c) {
b = c
} else {
b = JSON.parse(new TextDecoder("utf-8").decode(d))
}
if (SYNO.SS.Event.RecType.IVA == e.metaType) {
var a = this.GetIVARespTaskRec(this.taskId, this.record.get("dsId"), b.setting);
b.ivaResult.forEach(function(f) {
f.analyzeType = a.get("analyze_type");
f.task = a;
this.panelVideoAnalytics.fireEvent("ivaResult", f, true)
}, this)
} else {
if (SYNO.SS.Event.RecType.FACE == e.metaType) {
if (0 < this.recStartTimeMs) {
this.FaceRecInit(b.taskSetting)
} else {
this.FaceRecInit(b.setting)
}
if (false === Ext.isEmpty(b.faceResult)) {
this.resultController.EnqueueResult(b.faceResult)
}
} else {
if (SYNO.SS.Event.RecType.POS == e.metaType) {
b.posId = this.taskId;
b.dsId = this.dsId;
this.panelTransaction.ReplaceResult(b)
}
}
}
},
GetCameraName: function() {
var b = SYNO.SS.GblStore.GetCamIdOnHost(this.record.get("dsId"), this.record.get("cameraId"));
var a = SYNO.SS.GblStore.dsCamera.getById(b);
return (a) ? a.get("name") : this.callParent()
},
OnPause: function() {
this.panelVideoAnalytics.blPaused = true;
this.panelVideoAnalytics.UnsetClearResultTimer();
this.resultController.SetPaused(true)
},
OnResume: function() {
this.panelVideoAnalytics.SetClearResultTimer();
this.panelVideoAnalytics.blPaused = false;
this.resultController.SetPaused(false)
},
OnBufferUpdateEndCB: function(a) {
if (!a) {
return
}
this.OnIVABufferUpdateEndCB(a);
this.OnFaceBufferUpdateEndCB(a)
},
OnIVABufferUpdateEndCB: function(a) {
var c = this.panelVideoAnalytics;
if (true === this.panelVideo.onScreenHandler.IsDigitalZoom()) {
c.SetDrawAll(false);
return
}
c.SetDrawAll(true);
if (false === c.blPplCntInited) {
this.UpdatePplCntIfNeeded();
if (true === c.IsNeedDrawIndicator()) {
c.DrawIndicator()
}
c.blPplCntInited = true
}
if (true === this.blAfterSeek) {
while (true === this.IsAlignerIdxValid(a)) {
var b = this.reverseIdxWrapper.NextIdx(this.blReverse, this.alignerIdx);
if (b === this.alignerIdx) {
break
}
this.alignerIdx = b
}
this.alignerIdx = this.reverseIdxWrapper.BoundedPrevIdx(this.blReverse, this.alignerIdx, this.panelVideoAnalytics.resultBuffer);
this.UpdatePplCntIfNeeded();
if (true === c.IsNeedDrawIndicator()) {
c.DrawIndicator()
}
this.blAfterSeek = false
}
},
OnFaceBufferUpdateEndCB: function(a) {
if (true === this.blAfterSeek) {
this.resultController.SearchForAlignerIdx(a);
this.blAfterSeek = false
}
},
OnTimeUpdate: function(d) {
if (true === this.blObjSizeEditorMode) {
return
}
var f, b;
var c = this.panelVideoAnalytics;
var e = Math.max(c.videoLatency, 0);
var a = this.recStartTime + d / TRANS_MILLISECOND;
while (true === this.IsAlignerIdxValid(d)) {
b = this.reverseIdxWrapper.NextIdx(this.blReverse, this.alignerIdx);
if (b === this.alignerIdx) {
break
}
f = c.resultBuffer[this.alignerIdx];
Ext.defer(c.DrawVideoAnalyticsResult, e, c, [f]);
this.alignerIdx = b
}
this.resultController.Draw(d);
this.panelTransaction.Draw(a)
},
IsAlignerIdxValid: function(b) {
var d = this.panelVideoAnalytics.resultBuffer[this.alignerIdx];
var a, c;
if (!d) {
return false
}
if (0 < this.recStartTimeMs) {
a = d.timestamp;
c = b + this.recStartTimeMs
} else {
a = d.frameId;
c = b
}
if (true === this.blReverse) {
return c <= a
} else {
return c >= a
}
},
BeforeSeek: function() {
this.blAfterSeek = true;
this.alignerIdx = this.reverseIdxWrapper.StartIdx(this.blReverse, this.panelVideoAnalytics.resultBuffer);
this.panelVideoAnalytics.ClearResult();
this.panelVideoAnalytics.ResetTimeStamp();
this.resultController.ResetAlignerIdx();
this.resultController.ClearResult()
},
Seek: function(a) {
this.BeforeSeek();
this.alignerIdx = 0;
this.panelVideoAnalytics.resultBuffer = [];
this.resultController.CleanFaceResult();
this.callParent([a])
},
PrevFrame: function() {
this.BeforeSeek();
this.callParent(arguments)
},
NextFrame: function() {
this.BeforeSeek();
this.callParent(arguments)
},
SetReverse: function(a) {
this.callParent(arguments);
this.resultController.SetReverse(a)
},
ResetBeforePlay: function(b) {
var a = b.get("extraParam");
this.alignerIdx = this.reverseIdxWrapper.StartIdx(this.blReverse, this.panelVideoAnalytics.resultBuffer);
this.panelVideoAnalytics.blPplCntInited = false;
this.panelVideoAnalytics.resultBuffer = [];
this.panelVideoAnalytics.ResetTimeStamp();
this.panelVideoAnalytics.ClearResult();
this.panelVideoAnalytics.ClearIndicator();
this.panelVideoAnalytics.ClearWidgets();
if ((a) && (a.simulatorHelper)) {
this.simulatorHelper = a.simulatorHelper
}
this.resultController.ResetAlignerIdx();
this.resultController.Reset();
if ((a) && (a.POSResult)) {
this.panelTransaction.ReplaceResult(a.POSResult);
this.metaType = SYNO.SS.Event.RecType.NORMAL
}
},
UpdatePplCntIfNeeded: function() {
if (Ext.isEmpty(this.panelVideoAnalytics.pplRegion)) {
return
}
this.panelVideoAnalytics.pplRegion.UpdatePplCnt(this.alignerIdx, this.panelVideoAnalytics.resultBuffer)
},
Stop: function() {
if (this.panelTransaction) {
this.panelTransaction.hide()
}
if (this.simulatorHelper) {
this.simulatorHelper.Remove(this)
}
this.callParent(arguments)
},
Simulate: function(b, c) {
var d, a;
this.panelVideoAnalytics.SetDrawAll(false);
if (true === b) {
if (!this.record) {
return
}
this.simulatorHelper.SetSimulateTm(this.GetCurStreamTm());
d = Ext.apply({
eventId: this.record.get("id"),
recEvtType: SYNO.SS.App.Event.Utils.GetRecEvtType(this.record),
startTime: this.simulatorHelper.GetSimulateTm() / TRANS_MILLISECOND
}, c);
this.simulatorHelper.Add(d, this, this.AppendToResultBuf);
this.panelVideo.ShowLoading();
a = SYNO.SS.Utils.UpdateRecord(c, this.simulatorHelper.task.copy(), true, true);
this.panelVideoAnalytics.InitDisplay(a, true);
this.Pause()
} else {
this.Pause();
this.Seek(this.simulatorHelper.GetSimulateTm() / TRANS_MILLISECOND);
this.simulatorHelper.Remove(this);
this.panelVideoAnalytics.resultBuffer.length = 0;
this.panelVideo.HidePlayerTip();
this.simulatorHelper.SetSimulateTm(null)
}
},
AppendToResultBuf: function(c) {
var g = JSON.parse(new TextDecoder("utf-8").decode(new Uint8Array(c.data)));
if (!g) {
return
}
var e = this.panelVideoAnalytics.resultBuffer;
var f, d, h;
var b = this.simulatorHelper.record;
var a = this.simulatorHelper.GetSimulateTm();
if (!b) {
return
}
g.dsId = LOCAL_DS_ID;
g.taskId = b.get("id");
e.push(g);
f = e[0].frameId;
d = e[e.length - 1].frameId;
h = ((a < d) && (3 * TRANS_MILLISECOND <= (d - f)));
if ((true == h) && (true === this.panelVideoAnalytics.blPaused)) {
this.panelVideo.HidePlayerTip();
this.Resume();
this.panelVideoAnalytics.SetDrawAll(true)
}
if ((false == h) && (false === this.panelVideoAnalytics.blPaused)) {
this.panelVideo.ShowLoading();
this.Pause()
}
},
RestartSimulate: function() {
this.simulatorHelper.Remove(this, function() {
this.panelVideoAnalytics.resultBuffer.length = 0;
this.Simulate(true, this.simulatorHelper.task.data)
})
},
ShowDetRegion: function(a) {
this.blShowDetRegion = a;
this.panelVideoAnalytics.ShowDetRegion(a);
this.resultController.ShowDetRegion(a)
}
});
Ext.define("SYNO.SS.App.WebPlayer.PlayerSwitcher", {
INST_LIVE: null,
INST_REC: null,
REC_VIEW_TYPE: 0,
constructor: function(a) {
if (a) {
this.INST_LIVE = a.liveInst;
this.REC_VIEW_TYPE = a.recViewType
} else {
this.INST_LIVE = SYNO.SS.App.WebPlayer.Html5PlayerPanel;
this.REC_VIEW_TYPE = SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.TIMELINE
}
this.INST_REC = SYNO.SS.App.WebPlayer.MetaRecordHtml5PlayerPanel;
this.audioInfoStore = new SYNO.SS.App.WebPlayer.ReocrdAudioInfoStore();
this.callParent(arguments)
},
SwitchPlayer: function(e, c, a) {
if (e instanceof a) {
return e
}
var d = e.ownerCt;
var b = SYNO.SS.Utils.DeepCopy(c);
Ext.applyIfExist(b, {
width: e.ctWidth,
height: e.ctHeight
});
if (this.INST_REC === a) {
b.viewType = this.REC_VIEW_TYPE
}
d.remove(e);
e.destroy();
e = new a(b);
d.add(e);
d.doLayout();
return e
},
ToLive: function(b, a) {
return this.SwitchPlayer(b, a, this.INST_LIVE)
},
ToRec: function(d, c, b, a) {
if (!b) {} else {
if (true === this.IsRecordEq(d.record, b)) {
d.Seek(a)
} else {
d = this.SwitchPlayer(d, c, this.INST_REC);
b.startOffset = a;
d.Play(b, this.audioInfoStore.GetAudioInfo(b))
}
}
return d
},
IsRecordEq: function(b, a) {
return ((b) && (a) && (b.id === a.id) && (b.dsId === a.dsId) && (b.mountId === a.mountId) && (b.archId === a.archId))
}
});
Ext.define("SYNO.SS.App.WebPlayer.PlayerLayoutPanel", {
extend: "SYNO.ux.Panel",
EVT_PLAYER_CHANGE: "playerchange",
PANEL_BORDER_PX: 3,
CELL_BORDER_PX: 2,
SUP_NONE: 0,
SUP_TRUE: 1,
SUP_FALSE: 2,
layoutChData: null,
layoutInfo: null,
chPosList: null,
layoutList: null,
panelBorder: null,
playerInfoList: null,
blFixAspectRatio: false,
blShowVideoLabel: false,
blShowInfoLabel: false,
panelExpand: null,
panelLayout: null,
focusContainerId: 0,
focusPanel: null,
parentWin: null,
viewType: null,
advAlertOption: null,
alertTrigSts: null,
monitorList: null,
emapInfoList: null,
unsupportTypes: null,
blSupportedLayout: true,
dropZone: null,
fnOnNodeDrop: null,
validTypeList: null,
chnRectList: null,
blSuspendMouseEvent: false,
blPrevSeqPause: true,
alertEmapList: null,
constructor: function(a) {
a = a || {};
this.blFixAspectRatio = a.blFixAspectRatio || false;
this.blShowVideoLabel = a.blShowVideoLabel || false;
this.parentWin = a.parentWin;
this.viewType = a.viewType || SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.UNKNOWN;
this.fnOnNodeDrop = a.fnOnNodeDrop || null;
this.validTypeList = a.validTypeList || [];
this.Init();
Ext.applyIf(a, {
layout: "fit",
style: String.format("background-color: gray; border-width: {0}px; border-color: #EEEEEE;", this.PANEL_BORDER_PX),
item: this.panelLayout,
listeners: {
bodyresize: function() {
if ((this.panelLayout) && (true === this.panelLayout.isVisible())) {
this.ShowLayout()
} else {
if (true === this.IsChnExpanded()) {
this.panelExpand.setSize(this.panelExpand.ownerCt.getSize());
this.SetFocus(this.panelExpand);
this.SetPanelBorder(this.panelExpand.videoCt.borderAlert, this.panelExpand)
}
}
},
afterrender: function() {
this.add(this.panelExpand);
if (true === Ext.isFunction(this.fnOnNodeDrop)) {
this.InitDD()
}
},
scope: this
}
});
this.callParent([a]);
this.addEvents(this.EVT_PLAYER_CHANGE);
this.InitEventHandler()
},
Init: function() {
this.chPosList = [];
this.playerInfoList = [];
this.monitorList = [];
this.emapInfoList = [];
this.alertEmapList = [];
this.ClearAlertTrigSts();
this.unsupportTypes = SYNO.SS.Layout.Def.GetUnsupportType();
this.CreateBorderPanel();
this.panelExpand = new Ext.Container({
layout: "fit",
cls: SYNO.SS.Utils.GetVdoBgCls() + " player_layout_expand",
hidden: true,
UpdateBgColor: function() {
if (this.banner) {
SYNO.SS.Utils.ResetVdoInfoBarCls(this.banner)
}
SYNO.SS.Utils.ResetVdoBgCls(this)
}
});
this.playerSwitcher = new SYNO.SS.App.WebPlayer.PlayerSwitcher()
},
ClearAlertTrigSts: function() {
this.alertTrigSts = {
camAlertSts: {},
ioModuleAlertSts: {},
transDevAlertSts: {},
ivaTaskAlertSts: {},
faceTaskAlertSts: {}
}
},
InitEventHandler: function() {
this.mon(SYNO.SDS.StatusNotifier, "updateVideoBgColor", this.UpdateBgColor, this);
if (true === this.IsLiveviewLayout(this.viewType)) {
this.InitLiveviewEventHandler()
}
},
InitLiveviewEventHandler: function() {
this.mon(this, "triggerEvents", this.UpdateAlertHint, this);
this.mon(this, "onEmapItemSelected", this.OnEmapItemSelected, this);
this.mon(this, "acapDetectUpdate", this.UpdateAcapDetArea, this);
this.mon(this, "autoAdjustUpdate", this.AutoAdjustUpdate, this);
this.mon(this, "emapLoaded", this.EmapLoaded, this)
},
InitDD: function() {
var a = Ext.id();
this.add(new Ext.Container({
autoEl: {
tag: "div",
id: a,
cls: "player-drag-disable",
style: "display: none; z-index: 1;"
}
}));
this.dropZone = new SYNO.SS.Interaction.DropZone(this, {
divDragId: a,
validTypeList: this.validTypeList,
fnOnNodeDrop: this.fnOnNodeDrop,
fnGetChnPosList: function() {
return this.chnRectList || []
}.createDelegate(this)
});
this.addManagedComponent(this.dropZone)
},
Deactivate: function() {
this.layoutList = [];
this.StopConnection()
},
StopConnection: function() {
this.UpdatePlayerInfo();
this.UpdateMonitorInfo();
this.UpdateEmapInfo()
},
UpdatePlayerInfo: function() {
var e;
var h, d, g;
var a = -1,
c = 0,
b = 0;
var f = [];
for (c = 0; c < this.layoutList.length; c++) {
e = this.layoutList[c];
if (((!e.camId) && (!e.camList) && (!e.posId)) || (this.SUP_TRUE !== e.supported)) {
continue
}
a = -1;
for (b = 0; b < this.playerInfoList.length; b++) {
g = this.playerInfoList[b];
if (true === this.IsPlayerEqual(e, g)) {
a = b;
break
}
}
if (-1 === a) {
continue
}
h = this.playerInfoList.splice(a, 1)[0];
h.location = c;
d = h.player;
f.push(h);
if (d.ownerCt) {
d.ownerCt.remove(d, false)
}
}
this.playerInfoList = f
},
IsPlayerEqual: function(b, d) {
var c = ["camId", "dsId", "archId", "mountId", "posId", "groupId", "speakerId", "regionId", "speakerList", "videoAnalyticsId", "faceTaskId"];
var a = false;
if ((!d.player) || (this.viewType !== d.player.viewType)) {
return false
}
if ((SYNO.SS.Layout.Def.TYPE_SEQUENCE !== this.layoutInfo.layoutType) && (SYNO.SS.Layout.Def.TYPE_ALERT !== this.layoutInfo.layoutType)) {
a = c.some(function(e) {
if ((b[e] || 0) !== (d[e] || 0)) {
return true
}
})
}
return (false === a)
},
UpdateMonitorInfo: function() {
var e;
var f, b;
var a = -1,
d = 0;
var c = [];
for (d = 0; d < this.layoutList.length; d++) {
e = this.layoutList[d];
if (e.doorId) {
a = this.monitorList.findExact("doorId", e.doorId)
} else {
if (true === SYNO.SS.App.Camera.Utils.IsDeviceIntercom(e.deviceType)) {
a = this.monitorList.findIndex(function(g) {
if ((!g.doorId) && (true === SYNO.SS.App.Camera.Utils.IsDeviceIntercom(g.deviceType))) {
return (g.camId === e.camId)
}
return false
})
} else {
continue
}
}
if (-1 === a) {
continue
}
f = this.monitorList.splice(a, 1)[0];
f.location = d;
b = f.monitorPanel;
c.push(f);
if (b.ownerCt) {
b.ownerCt.remove(b, false)
}
}
this.monitorList = c
},
UpdateEmapInfo: function() {
var g;
var b, h;
var a = -1,
f = 0,
e = 0;
var d = [];
var c = [];
for (f = 0; f < this.layoutList.length; f++) {
g = this.layoutList[f];
if (!g.emapId) {
continue
}
a = -1;
for (e = 0; e < this.emapInfoList.length; e++) {
if (g.location === this.emapInfoList[e].location) {
c = [g.emapId];
SYNO.SS.App.Liveview.AlertUtils.GetNestedEmapIdList(c, true);
if (-1 !== c.indexOf(this.emapInfoList[e].emapId)) {
a = e;
break
}
}
}
if (-1 === a) {
continue
}
b = this.emapInfoList.splice(a, 1)[0];
d.push(b)
}
this.emapInfoList = d
},
SetLayoutInfo: function(b, a, c) {
this.layoutInfo = b;
this.layoutChData = a;
this.focusContainerId = 0;
if (this.focusPanel) {
this.focusPanel.SetPlayerFocus(false)
}
if (b.camList[0]) {
this.focusContainerId = b.camList[0].location
}
if (this.layoutChData) {
this.chPosList = this.layoutChData.channelPosList
}
if (true === Ext.isDefined(c)) {
this.blSuspendMouseEvent = c
}
if (-1 !== this.unsupportTypes.indexOf(b.layoutType)) {
this.InsertTipDiv(this.body.dom);
this.InitInfoList();
this.blSupportedLayout = false;
this.panelBorder.setVisible(false)
} else {
this.blSupportedLayout = true;
this.RemoveTipDiv();
this.ParseLayoutInfo();
this.panelBorder.setVisible(true)
}
},
InsertTipDiv: function(a) {
var b = _IMG(SYNO.SS.Image.IconPlugin);
var c = String.format(_T("liveview", "unsupported_layout_link"), 36, String.format('<a href = "http://sy.to/html5faq" style="text-decoration:underline;" target = "_blank">'), "</a>");
a.innerHTML = String.format('<div class="layout_unsupported_mask"><div class="plugin_download_tip"><img src="{0}" style="width:108px;height:108px;padding-bottom:5px;"><br>{1}</div></div>', b, c)
},
RemoveTipDiv: function() {
var a = this.el.dom.querySelector(".layout_unsupported_mask");
if (a) {
a.parentNode.removeChild(a)
}
},
SetAdvAlertOption: function(a) {
this.advAlertOption = a;
Ext.each(this.emapInfoList, function(c) {
var b = c.emapPanel;
var d = c.alertDeviceList;
b.SetAlertIconFlash((0 !== d.length), a.enableIconFlash)
})
},
ParseLayoutItemInfo: function(d, c) {
var e = function(h, g) {
var i = SYNO.SS.GblStore.dsCamera.getById(g.idOnHost);
var f = (true === this.IsLiveviewLayout(this.viewType)) ? SYNO.SS.CamPriv.LIVEVIEW : SYNO.SS.CamPriv.PLAYBACK;
if ((0 === g.mountId) && (0 === g.archId)) {
if ((!i) || (0 === SYNO.SS.Utils.IsFlags(i.get("privilege"), f))) {
h.supported = this.SUP_NONE;
h.blBanner = true;
return
}
}
h.camId = g.idOnHost;
h.camIdOnRec = g.id;
h.mountId = g.mountId;
h.archId = g.archId;
h.dsId = g.dsId;
h.name = g.name;
h.regionId = g.regionId;
h.regionName = g.regionName
}.createDelegate(this);
var b;
d.supported = this.SUP_TRUE;
d.blBanner = false;
d.location = c.location;
switch (c.itemType) {
case ITEM_TYPE_POS:
d.posId = c.itemId;
d.posIdOnRec = c.itemIdOnRec;
d.deviceType = c.deviceType;
e(d, c);
b = SYNO.SS.GblStore.dsPOS.getById(c.itemId);
if ((true === Ext.isDefined(b)) && (SYNO.SS.CmsDsSts.NORMAL === (SYNO.SS.GblStore.GetDsStatus(b.get("ds_id")))) && (this.SUP_NONE === d.supported)) {
d.supported = this.SUP_TRUE;
d.blBanner = false;
d.dsId = c.dsId;
d.name = c.name
}
break;
case ITEM_TYPE_IPSPEAKER:
d.speakerId = c.itemId;
d.speakerIdOnRec = c.itemIdOnRec;
d.deviceType = c.deviceType;
e(d, c);
b = SYNO.SS.GblStore.dsIPSpeaker.getById(c.itemId);
if ((true === Ext.isDefined(b)) && (SYNO.SS.CmsDsSts.NORMAL === (SYNO.SS.GblStore.GetDsStatus(b.get("ownerDsId")))) && (this.SUP_NONE === d.supported)) {
d.supported = this.SUP_TRUE;
d.blBanner = false;
d.dsId = c.dsId;
d.name = c.name
}
break;
case ITEM_TYPE_IPSPEAKERGRP:
d.speakerList = c.grpSpeakerList;
d.groupId = c.itemId;
e(d, c);
if (this.SUP_NONE === d.supported) {
d.supported = this.SUP_TRUE;
d.blBanner = false;
d.dsId = c.dsId;
d.name = c.name
}
break;
case ITEM_TYPE_CAM:
d.deviceType = c.deviceType;
e(d, c);
break;
case ITEM_TYPE_DOOR:
d.doorId = c.itemId;
if (0 !== c.id) {
e(d, c)
}
d.supported = this.SUP_TRUE;
break;
case ITEM_TYPE_EMAP:
d.emapId = c.idOnHost;
break;
case ITEM_TYPE_CAMGRP:
d.camList = c.grpCamList;
d.blBanner = false;
d.groupId = c.idOnHost;
d.supported = this.SUP_TRUE;
break;
case ITEM_TYPE_IVA:
d.videoAnalyticsId = c.itemId;
d.deviceType = c.deviceType;
e(d, c);
break;
case ITEM_TYPE_FACE:
var a = SYNO.SS.GblStore.faceRecognitionTaskModel.GetRecordById(LOCAL_DS_ID, c.itemId);
d.faceTaskId = c.itemId;
d.faceTaskIdOnRec = c.itemId;
d.deviceType = c.deviceType;
if (a) {
d.faceTaskIdOnRec = a.get("id_on_rec_server") || c.itemId
}
e(d, c);
break;
default:
d.supported = this.SUP_FALSE;
d.blBanner = true;
break
}
if ((false === this.IsLiveviewLayout(this.viewType)) && (ITEM_TYPE_CAM !== c.itemType) && (this.SUP_TRUE === d.supported)) {
d.supported = this.SUP_FALSE;
d.blBanner = true;
d.bannerConfig = d.bannerConfig || {
text: c.itemName,
blAudio: false
}
}
},
DropItemInLayout: function(a, e) {
var b, c;
var d = {
pos: this.chPosList[a],
supported: this.SUP_NONE,
blBanner: true,
location: a
};
b = this.playerInfoList.findExact("location", a);
if ((-1 !== b) && (this.playerInfoList[b])) {
this.playerInfoList.splice(b, 1)
}
c = this.emapInfoList.findExact("location", a);
if ((-1 !== c) && (this.emapInfoList[c])) {
this.emapInfoList.splice(c, 1)
}
e.location = a;
this.ParseLayoutItemInfo(d, e);
this.layoutList[e.location] = d;
this.ShowLayout()
},
ParseLayoutInfo: function() {
var b, c;
var a = this.chPosList.length;
this.InitInfoList();
for (b = 0; b < a; ++b) {
this.layoutList.push({
pos: this.chPosList[b],
supported: this.SUP_NONE,
blBanner: true,
location: b
})
}
if ((SYNO.SS.Layout.Def.TYPE_SEQUENCE === this.layoutInfo.layoutType) || (SYNO.SS.Layout.Def.TYPE_ALERT === this.layoutInfo.layoutType)) {
this.layoutList[0].blBanner = false;
this.layoutList[0].supported = this.SUP_TRUE;
this.layoutList[0].location = 0;
return
}
Ext.each(this.layoutInfo.camList, function(d) {
if (a <= d.location) {
return true
}
c = this.layoutList[d.location];
this.ParseLayoutItemInfo(c, d)
}, this)
},
InitInfoList: function() {
this.layoutList = [];
this.monitorInfoList = [];
this.emapInfoList = [];
this.alertEmapList = []
},
ShowLayout: function() {
if (!this.layoutList) {
return
}
this.CreateLayoutTable();
this.GenLayoutCell();
this.HidePanelExpand();
this.add(this.panelLayout);
this.doLayout();
this.RestorePausedPlayer()
},
HidePanelExpand: function() {
if (true === this.IsChnExpanded()) {
this.panelExpand.setVisible(false);
this.panelExpand.removeAll(true);
this.panelExpand.videoCt = null;
this.OnPlayerExpanded(false)
}
},
RestorePausedPlayer: function() {
Ext.each(this.playerInfoList, function(a) {
a.player.RestorePausedPlayer()
}, this)
},
CreateLayoutTable: function() {
if (this.panelLayout) {
this.StopConnection();
this.panelLayout.removeAll(true);
this.remove(this.panelLayout, true);
this.panelLayout = null
}
this.panelLayout = new Ext.Container({
cls: "syno_panel_layout",
hidden: (false === this.blSupportedLayout),
listeners: {
afterrender: function(a) {
if (false === this.panelBorder.rendered) {
this.panelBorder.render(this.getEl())
}
},
afterlayout: function(a) {
this.SetFocus(this.focusPanel);
this.SetAlertBorderIfNeeded();
this.UpdateChnRectList()
},
liveviewIVAResult: function(a) {
var b;
if (true === this.IsChnExpanded()) {
b = this.panelExpand
} else {
b = this.panelLayout
}
b.items.each(function(d) {
var c = d.GetPlayer();
if (c && c.panelVideoAnalytics) {
c.panelVideoAnalytics.fireEvent("ivaResult", a)
}
})
},
scope: this
}
})
},
GenLayoutCell: function() {
var s, d, u, g, b;
var n, l;
var e, h;
var r, p;
var t = null;
var q, a;
var o = this.layoutChData.base.row,
m = this.layoutChData.base.col;
var k = [],
c = [];
var f = SYNO.SS.Utils.DeepCopy(this.layoutList);
q = (this.getInnerWidth() - (m - 1) * this.CELL_BORDER_PX) / m;
a = (this.getInnerHeight() - (o - 1) * this.CELL_BORDER_PX) / o;
for (r = 0; r < o; r++) {
c[r] = 0
}
for (r = 0; r < m; r++) {
k[r] = 0
}
for (r = 0; r < f.length; r++) {
s = f[r];
g = s.pos[0];
b = s.pos[1];
d = s.pos[2];
u = s.pos[3];
if ((0 === d) && (0 === u)) {
continue
}
n = (q + this.CELL_BORDER_PX) * d - this.CELL_BORDER_PX + c[b];
l = (a + this.CELL_BORDER_PX) * u - this.CELL_BORDER_PX + k[g];
e = Math.floor(g * (q + this.CELL_BORDER_PX));
h = Math.floor(b * (a + this.CELL_BORDER_PX));
for (p = 0; p < u; p++) {
c[b + p] = n - Math.floor(n)
}
for (p = 0; p < d; p++) {
k[g + p] = l - Math.floor(l)
}
n = Math.floor(n);
l = Math.floor(l);
t = new SYNO.SS.App.WebPlayer.LayoutCell({
strTip: (this.SUP_FALSE === s.supported) ? _T("localdisplay", "liveview_unsupported_itemtype") : "",
style: String.format("left: {0}px; top: {1}px;", e, h),
blBanner: (true === s.blBanner),
blShowCamInfoLabel: this.blShowInfoLabel,
bannerConfig: s.bannerConfig || {},
viewType: this.viewType,
width: n,
height: l,
location: s.location,
parent: this
});
if (this.focusContainerId === s.location) {
this.focusPanel = t
}
if ((s.camId) || (s.doorId) || (s.emapId) || (s.posId) || (s.speakerId) || (s.camList) || (s.speakerList)) {
this.CreateChannelContent(t, s, n, l)
}
this.panelLayout.add(t)
}
this.SetSuspendMouseEvent(this.blSuspendMouseEvent)
},
UpdateChnRectList: function() {
var b, a;
if (false === Ext.isFunction(this.fnOnNodeDrop)) {
return
}
b = this.getBox();
a = function(d) {
var c = d.getBox();
this.chnRectList[d.location] = {
x: c.x - b.x - this.PANEL_BORDER_PX,
y: c.y - b.y - this.PANEL_BORDER_PX,
w: c.width,
h: c.height
}
}.createDelegate(this);
if (true === this.IsChnExpanded()) {
this.chnRectList.forEach(function(c) {
c.x = 0;
c.y = 0;
c.w = 0;
c.h = 0
});
a(this.panelExpand.items.getRange()[0]);
return
}
this.chnRectList = [];
Ext.each(this.panelLayout.items.getRange(), function(c) {
a(c)
}, this)
},
IsChnExpanded: function() {
return ((this.panelExpand) && (true === this.panelExpand.isVisible()))
},
IsSingleChannel: function() {
if ((SYNO.SS.Layout.Def.TYPE_1 === this.layoutInfo.layoutType) || (SYNO.SS.Layout.Def.TYPE_SEQUENCE === this.layoutInfo.layoutType) || (SYNO.SS.Layout.Def.TYPE_ALERT === this.layoutInfo.layoutType)) {
return true
}
return false
},
NewPlayerInst: function(b) {
var a = SYNO.SS.Utils.DeepCopy(b);
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.TIMELINE === this.viewType) {
return new SYNO.SS.App.WebPlayer.RecordHtml5PlayerPanel(a)
} else {
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_POS === a.viewType) {
return new SYNO.SS.App.WebPlayer.POSHtml5PlayerPanel(a)
} else {
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_IVA === a.viewType) {
return new SYNO.SS.App.WebPlayer.IVAHtml5PlayerPanel(a)
} else {
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_FACE === a.viewType) {
return new SYNO.SS.App.WebPlayer.FaceHtml5PlayerPanel(a)
} else {
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_IPSPEAKER === a.viewType) {
return new SYNO.SS.App.WebPlayer.SpeakerHtml5PlayerPanel(a)
} else {
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_IPSPEAKER_GROUP === a.viewType) {
return new SYNO.SS.App.WebPlayer.SpeakerGroupHtml5PlayerPanel(a)
} else {
if (Ext.isDefined(a.camList)) {
return new SYNO.SS.App.WebPlayer.SequencePlayer(a)
} else {
return new SYNO.SS.App.WebPlayer.Html5PlayerPanel(a)
}
}
}
}
}
}
}
},
CreateChannelContent: function(b, d, c, a) {
if (this.SUP_TRUE !== d.supported) {
return
}
this.CreateVideoContent(b, d, c, a);
this.CreateMonitorContent(b, d, c, a);
this.CreateEmapContent(b, d, c, a)
},
CreateVideoContent: function(e, d, b, j) {
var h = this.playerInfoList.findExact("location", e.location);
var a = d.camId || 0;
var g = null;
var i = Ext.isDefined(d.camList);
var f = {
blFixAspectRatio: this.blFixAspectRatio,
blShowVideoLabel: this.blShowVideoLabel,
blShowCamInfoLabel: this.blShowInfoLabel,
blFocused: false,
viewType: this.viewType,
width: b,
height: j,
camIdOnHost: a,
blSingleCh: this.IsSingleChannel(),
blSuspendMouseEvent: this.blSuspendMouseEvent,
regionId: d.regionId,
regionName: d.regionName
};
if (Ext.isDefined(d.posId)) {
f.dsId = d.dsId;
f.posId = d.posId;
f.posName = d.name;
f.viewType = SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_POS
} else {
if (Ext.isDefined(d.videoAnalyticsId)) {
f.viewType = SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_IVA;
f.extraCfg = {};
f.extraCfg.ivaTaskId = d.videoAnalyticsId
} else {
if (Ext.isDefined(d.faceTaskIdOnRec)) {
f.viewType = SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_FACE;
f.extraCfg = {
taskId: d.faceTaskIdOnRec
};
var c = SYNO.SS.GblStore.faceRecognitionTaskModel.GetRecordById(d.dsId, d.faceTaskIdOnRec);
if (c) {
Ext.apply(f.extraCfg, {
taskData: SYNO.SS.Utils.DeepCopy(c.data)
})
}
} else {
if (Ext.isDefined(d.speakerId)) {
f.viewType = SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_IPSPEAKER;
f.extraCfg = {};
f.speakerId = d.speakerId;
f.speakerIdOnRec = d.speakerIdOnRec;
f.speakerName = d.name
} else {
if (Ext.isDefined(d.speakerList)) {
f.viewType = SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_IPSPEAKER_GROUP;
f.groupId = d.groupId;
f.groupName = d.name
} else {
if (true === i) {
f.camList = d.camList;
f.interval = this.layoutInfo.interval
} else {
if ((0 >= a) && (!d.doorId)) {
return
}
}
}
}
}
}
}
if ((-1 !== h) && (this.playerInfoList[h])) {
this.playerInfoList[h].name = d.name;
g = this.playerInfoList[h].player
}
if (g) {
g.setSize(b, j);
if ((true === i) && (Ext.isFunction(g.ResetCamList))) {
g.ResetCamList(f.camList)
}
if (Ext.isFunction(g.SetInterval)) {
g.SetInterval(this.layoutInfo.interval)
}
} else {
g = this.NewPlayerInst(f);
this.playerInfoList.push({
camId: a,
camIdOnRec: (d.camIdOnRec || 0),
mountId: (d.mountId || 0),
archId: (d.archId || 0),
dsId: (d.dsId || 0),
posId: d.posId,
name: (d.name || ""),
player: g,
playerCfg: f,
camList: d.camList,
groupId: d.groupId,
speakerId: d.speakerId,
speakerList: d.speakerList,
regionId: d.regionId,
location: d.location,
videoAnalyticsId: d.videoAnalyticsId,
faceTaskId: d.faceTaskId,
faceTaskIdOnRec: d.faceTaskIdOnRec
})
}
e.add(g)
},
CreateMonitorContent: function(k, j, c, m) {
var l = this.monitorList.findExact("location", k.location);
var e = j.dsId;
var a = j.camId;
var g = j.camIdOnRec;
var b = j.doorId;
var f = j.deviceType;
var d = null;
var h = null;
var i = function(n) {
return {
x: 0,
y: 0,
w: n.getWidth(),
h: n.getHeight()
}
};
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.TIMELINE === this.viewType) {
return
}
if ((!b) && (false === SYNO.SS.App.Camera.Utils.IsDeviceIntercom(f))) {
return
}
if (Ext.isDefined(j.posId)) {
return
}
if ((-1 !== l) && (this.monitorList[l])) {
d = this.monitorList[l].monitorPanel
}
if (!d) {
if (b) {
d = new SYNO.SS.App.Liveview.DoorPanel(this.findAppWindow());
h = b
} else {
d = new SYNO.SS.App.Liveview.IntercomPanel(this.findAppWindow());
h = {
camId: (LOCAL_DS_ID === e) ? a : g,
dsId: e
}
}
this.monitorList.push({
monitorPanel: d,
doorId: b,
deviceType: f,
camId: a
})
}
k.add(d);
k.monitorPanel = d;
this.mon(d.logList, "afterrender", function() {
if (k.location !== d.GetChnIdx()) {
d.SetInfo(k.location, h)
}
d.SetChannelRect(i(k))
});
this.mon(k, "afterlayout", function() {
if (!d.logList.rendered) {
return
}
d.SetChannelRect(i(k))
});
this.mon(d, "afterlayout", function(n) {
n.ownerCt.SyncSize()
})
},
CreateEmapContent: function(h, g, d, n) {
var l = this.emapInfoList.findExact("location", h.location);
var c = false;
var a = null;
var k = g.emapId;
var j = [];
var m = null;
var e = (false === Ext.isDefined(h.plugins));
var f = [],
b = [];
if (!k) {
return
}
if ((-1 !== l) && (this.emapInfoList[l])) {
c = this.emapInfoList[l].blAlertIconVisible;
j = this.emapInfoList[l].alertDeviceList;
m = SYNO.SS.Utils.DeepCopy(this.emapInfoList[l].emapPanel.clickItem);
if (true === e) {
k = this.emapInfoList[l].emapId;
f = this.emapInfoList[l].emapPanel.director.backwardStack;
b = this.emapInfoList[l].emapPanel.director.forwardStack
}
this.emapInfoList[l].emapPanel.destroy();
this.emapInfoList[l] = null
}
a = new SYNO.SS.App.EmapViewer.EmapPreview({
owner: this,
director: h,
width: d,
height: n,
emapId: k,
ownerDsId: LOCAL_DS_ID,
blDoorEnabled: _S("addonsService").serviceInfo[SYNO.SS.Service.ACSCTRL].blEnabled,
dsSrcEmap: SYNO.SS.GblStore.dsEmap,
blFixAspectRatio: this.blFixAspectRatio,
viewType: SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_EMAPVIEW,
blLiveviewEmap: true,
blFocused: false,
blShowEmapInfoLabel: this.blShowInfoLabel,
blAlertIconVisible: c,
clickItem: m
});
var i = {
location: h.location,
emapPanel: a,
emapId: k,
blAlertIconVisible: c,
alertDeviceList: j
};
if (-1 !== l) {
this.emapInfoList[l] = i
} else {
this.emapInfoList.push(i)
}
if (false === Ext.isDefined(h.plugins)) {
h.plugins = h.initPlugin("emapTraversePlugin")
}
if (true === e) {
a.director.forwardStack = b;
a.director.backwardStack = f;
a.btnNext.setVisible(!Ext.isEmpty(b));
a.btnPrev.setVisible(!Ext.isEmpty(f))
}
h.add(a);
h.emapPanel = a;
this.InitCameraPOSMapping(k)
},
BFS: function(b, e, c) {
var a = {};
while (false === Ext.isEmpty(b)) {
var d = b.shift();
if (a[d]) {
continue
}
a[d] = true;
e(d);
c(d).forEach(function(f) {
b.push(f)
})
}
},
InitCameraPOSMapping: function(a) {
this.CameraPOSMapping = {};
var c = function(e) {
var d = SYNO.SS.GblStore.dsEmap.getById(e);
if (d) {
d.data.item.forEach(function(f) {
if ((SYNO.SS.App.Emap.Def.ItemType.POS === f.type) && (0 < f.camId)) {
this.CameraPOSMapping[f.camId] = this.CameraPOSMapping[f.camId] || [];
if (-1 === this.CameraPOSMapping[f.camId].indexOf(f.uniqueId)) {
this.CameraPOSMapping[f.camId].push(f.uniqueId)
}
}
}, this)
}
}.createDelegate(this);
var b = function(e) {
var d = SYNO.SS.GblStore.dsEmap.getById(e);
var f = [];
if (d) {
d.data.item.forEach(function(g) {
if (SYNO.SS.App.Emap.Def.ItemType.EMAP === g.type) {
f.push(g.uniqueId)
}
})
}
return f
};
this.BFS([a], c, b)
},
CreateBorderPanel: function() {
if (this.panelBorder) {
this.panelBorder.destroy();
delete this.panelBorder
}
this.panelBorder = new Ext.BoxComponent({
id: Ext.id() + "_panelBorder",
cls: "player_layout_border"
});
this.addManagedComponent(this.panelBorder)
},
OnChannelClick: function(b, a) {
var d = a.GetEmapViewer();
if (d) {
var c = this.GetEmapClickInfo(d, b.target);
if (false === c.blClickOnItem) {
this.ResetEmapClickItem()
} else {
if ((true === c.blItemInLayout) && (a.ownerCt !== this.panelExpand)) {
return
}
}
} else {
this.ResetEmapClickItem()
}
this.SetFocus(a)
},
GetEmapClickInfo: function(f, e) {
var c = {
blClickOnItem: false,
blItemInLayout: false
};
var a, b, d;
f.clickItem = null;
for (d = 0; d < f.rgItemInfo.length; d++) {
b = f.rgItemInfo[d];
if (null === b) {
continue
}
a = document.getElementById(b.iconId);
if ((!a) || (false === a.contains(e))) {
continue
}
c.blClickOnItem = true;
f.SetClickItem(b, false);
switch (b.type) {
case SYNO.SS.App.Emap.Def.ItemType.CAMERA:
c.blItemInLayout = (0 > b.portIdx) ? this.IsCamExistInLayout(b.uniqueId) : false;
break;
case SYNO.SS.App.Emap.Def.ItemType.EMAP:
c.blItemInLayout = this.IsEmapExistInLayout(b.uniqueId);
break;
case SYNO.SS.App.Emap.Def.ItemType.DOOR:
if ((SYNO.SS.App.AxisAcsCtrler.Door.Status.DOOR_DISABLED !== b.status) && (SYNO.SS.App.AxisAcsCtrler.Door.Status.DOOR_DISCONNECTED !== b.status) && (SYNO.SS.App.AxisAcsCtrler.Door.Status.DOOR_INCOMPATIBLE !== b.status)) {
c.blItemInLayout = this.IsDoorExistInLayout(b.uniqueId)
}
break;
case SYNO.SS.App.Emap.Def.ItemType.POS:
c.blItemInLayout = this.IsPosExistInLayout(b.uniqueId);
break;
case SYNO.SS.App.Emap.Def.ItemType.IPSPEAKER:
c.blItemInLayout = this.IsSpeakerExistInLayout(b.uniqueId);
break;
case SYNO.SS.App.Emap.Def.ItemType.IPSPEAKER_GROUP:
c.blItemInLayout = this.IsSpeakerGroupExistInLayout(b.uniqueId);
break;
default:
c.blItemInLayout = false;
break
}
break
}
return c
},
IsDoorChannel: function(a) {
var b = this.layoutList[a.location].deviceType;
return (true === a.hasOwnProperty("monitorPanel")) && (false === SYNO.SS.App.Camera.Utils.IsDeviceIntercom(b))
},
IsCamExistInLayout: function(a) {
var b = false;
Ext.each(this.panelLayout.items.getRange(), function(d) {
var c = this.layoutList[d.location];
if ((a === c.camId) && (false === this.IsDoorChannel(d)) && (false === Ext.isDefined(c.posId))) {
b = true;
return false
}
}, this);
return b
},
IsEmapExistInLayout: function(a) {
var b = false;
Ext.each(this.emapInfoList, function(c) {
if (a === c.emapPanel.emapId) {
b = true
}
});
return b
},
IsDoorExistInLayout: function(a) {
var b = false;
Ext.each(this.monitorList, function(c) {
if (a === c.doorId) {
b = true
}
});
return b
},
IsPosExistInLayout: function(a) {
var b = false;
Ext.each(this.playerInfoList, function(c) {
if (a === c.posId) {
b = true;
return false
}
}, this);
return b
},
IsSpeakerExistInLayout: function(a) {
var b = false;
Ext.each(this.playerInfoList, function(c) {
if (a === c.speakerId) {
b = true;
return false
}
}, this);
return b
},
IsSpeakerGroupExistInLayout: function(a) {
var b = false;
Ext.each(this.playerInfoList, function(c) {
if ((true === Ext.isDefined(c.speakerList)) && (a === c.groupId)) {
b = true;
return false
}
}, this);
return b
},
ResetEmapClickItem: function() {
Ext.each(this.emapInfoList, function(a) {
a.emapPanel.clickItem = null
})
},
SetFocus: function(a) {
if (false === this.blSupportedLayout) {
return
}
this.SetPanelBorder(this.panelBorder, a);
if (this.panelExpand !== a) {
a.SetFocus();
this.CheckEmapItemSelected(a)
}
},
CheckEmapItemSelected: function(d) {
var e, g;
var c = -1;
var f = d.GetPlayer();
var h = d.GetEmapViewer();
var b = d.monitorPanel;
var a = null;
if ((f) && (false === this.IsDoorChannel(f.ownerCt))) {
if (true === Ext.isDefined(this.layoutList[f.ownerCt.location].posId)) {
e = this.layoutList[f.ownerCt.location].posId;
g = SYNO.SS.App.Emap.Def.ItemType.POS
} else {
if (true === Ext.isDefined(this.layoutList[f.ownerCt.location].speakerId)) {
e = this.layoutList[f.ownerCt.location].speakerId;
g = SYNO.SS.App.Emap.Def.ItemType.IPSPEAKER
} else {
if (true === Ext.isDefined(this.layoutList[f.ownerCt.location].speakerList)) {
e = this.layoutList[f.ownerCt.location].groupId;
g = SYNO.SS.App.Emap.Def.ItemType.IPSPEAKER_GROUP
} else {
e = this.layoutList[f.ownerCt.location].camId;
g = SYNO.SS.App.Emap.Def.ItemType.CAMERA
}
}
}
} else {
if (b) {
e = b.doorId;
g = SYNO.SS.App.Emap.Def.ItemType.DOOR
} else {
if (h) {
if (h.clickItem) {
e = h.clickItem.uniqueId;
g = h.clickItem.type;
c = h.clickItem.portIdx;
a = {
idOnHost: e,
itemType: g,
portIdx: c
}
} else {
e = h.emapId;
g = SYNO.SS.App.Emap.Def.ItemType.EMAP
}
} else {
e = this.layoutList[d.location].camId;
g = SYNO.SS.App.Emap.Def.ItemType.CAMERA
}
}
}
Ext.each(this.emapInfoList, function(i) {
i.emapPanel.CheckItemSelected(e, g, c)
});
if (a) {
this.parentWin.OnEmapItemSelected(a.idOnHost, a.itemType, a.portIdx)
}
},
SetPanelBorder: function(b, a) {
if (!b) {
return
}
var f = 0,
g = 0;
var e = 0,
i = 0;
var h = a.getEl().dom.getBoundingClientRect();
var c = (true === this.IsChnExpanded()) ? this.panelExpand : this.panelLayout;
var d = c.getEl().dom.getBoundingClientRect();
f = h.left - d.left;
g = h.top - d.top;
e = a.getWidth() + 4;
i = a.getHeight() + 4;
b.el.setStyle("left", String.format("{0}px", (f - 2)));
b.el.setStyle("top", String.format("{0}px", (g - 2)));
b.setWidth(e);
b.setHeight(i)
},
SetAlertBorderIfNeeded: function() {
var a;
if (!this.advAlertOption) {
return
}
a = this.advAlertOption.frameType;
Ext.each(this.playerInfoList, function(e) {
var d;
var b;
var c;
if (e.videoAnalyticsId) {
b = this.alertTrigSts.ivaTaskAlertSts[e.videoAnalyticsId];
if (true === b) {
e.player.ownerCt.ShowBorderAlert(a)
}
} else {
if (e.faceTaskId) {
c = this.alertTrigSts.faceTaskAlertSts[e.faceTaskId];
if (true === c) {
e.player.ownerCt.ShowBorderAlert(a)
}
} else {
d = this.alertTrigSts.camAlertSts[e.camId];
if ((d) && (true === d.blTrigger) && (false === this.HideDevicePairedCamPlayerInfo(e))) {
e.player.ownerCt.ShowBorderAlert(a)
}
}
}
}, this);
Ext.each(this.emapInfoList, function(h) {
var d = h.emapPanel.curEmapRec.data.item;
var g = h.emapPanel.ownerCt;
var b = -1;
var j, e;
var c;
for (var f = 0; f < d.length; f++) {
b = d[f].portIdx;
j = this.alertTrigSts.camAlertSts[d[f].uniqueId];
e = this.alertTrigSts.ioModuleAlertSts[d[f].uniqueId];
if ((SYNO.SS.App.Emap.Def.ItemType.CAMERA === d[f].type) && ((j) && (true === j.blTrigger))) {
c = j.triggerDIs;
if ((0 <= b) && (0 === SYNO.SS.Utils.IsFlags(c, 1 << b))) {
continue
}
g.ShowBorderAlert(a);
break
} else {
if ((SYNO.SS.App.Emap.Def.ItemType.IOMODULE === d[f].type) && ((e) && (true === e.blTrigger))) {
c = e.triggerDIs;
if ((0 <= b) && (0 === SYNO.SS.Utils.IsFlags(c, 1 << b))) {
continue
}
g.ShowBorderAlert(a);
break
} else {
if ((SYNO.SS.App.Emap.Def.ItemType.POS === d[f].type) && (true === this.alertTrigSts.transDevAlertSts[d[f].uniqueId])) {
g.ShowBorderAlert(a);
break
}
}
}
}
}, this)
},
OnChannelDblClick: function(a, c) {
var b = c.GetPlayer();
var e = c.GetEmapViewer();
if (true === c.blSwitching) {
c.blSwitching = false;
return
}
if ((b) && (true === b.IsOnOsdPanel(a))) {
return
}
if ((e) && (true === this.GetEmapClickInfo(e, a.target).blClickOnItem)) {
return
}
if (SYNO.SS.Layout.Def.TYPE_1 === this.layoutInfo.layoutType) {
return
}
if (false === this.IsChnExpanded()) {
this.DoSeqLayoutPauseIfExpand();
this.parentWin.UpdateFocus(c.location);
this.ExpandChannel(c)
} else {
var d;
if ((!this.parentWin.sequenceLayoutCt) || (true === this.parentWin.sequenceLayoutCt.hidden) || (true === this.blPrevSeqPause)) {
this.ShowLayout();
if (this.parentWin.UpdateAlert) {
this.parentWin.UpdateAlert()
}
return
}
d = function() {
this.ShowLayout();
this.parentWin.btnPauseSequence.toggle(false, true);
this.parentWin.DoSequencePause(false)
}.createDelegate(this);
this.parentWin.blSkipCheckManualRec = false;
if (true === this.parentWin.IsAnyCamExecManualRec(d, undefined)) {
SYNO.SS.Utils.ExitLiveviewFullscreen();
return
}
d()
}
},
DoSeqLayoutPauseIfExpand: function() {
if ((!this.parentWin.sequenceLayoutCt) || (true === this.parentWin.sequenceLayoutCt.hidden)) {
return
}
this.blPrevSeqPause = this.parentWin.btnPauseSequence.pressed;
if (true === this.blPrevSeqPause) {
return
}
this.parentWin.btnPauseSequence.toggle(true, true);
this.parentWin.btnPauseSequence.setTooltip(_T("joystick", "opt_start"));
clearTimeout(this.parentWin.seqLayoutTimerId);
this.parentWin.targetAlertSeqItemIdx = -1;
this.parentWin.oriAlertSeqItemIdx = -1;
if (true === this.blSuspendMouseEvent) {
this.SetSuspendMouseEvent(false)
}
},
ExpandChannel: function(b) {
var c = b.GetPlayer();
var e = b.GetEmapViewer();
var d = this.getInnerWidth();
var a = this.getInnerHeight();
this.panelLayout.setVisible(false);
this.panelBorder.setVisible(false);
Ext.each(this.playerInfoList, function(f) {
f.player.ownerCt.HideBorderAlert()
}, this);
Ext.each(this.emapInfoList, function(f) {
f.emapPanel.ownerCt.HideBorderAlert()
}, this);
this.panelExpand.add(b);
this.panelExpand.videoCt = b;
if (c) {
c.setSize(d, a);
b.DeleteBorderAlert()
} else {
if (e) {
b.DeleteBorderAlert()
}
}
this.panelExpand.setVisible(true);
this.panelBorder.setVisible(true);
if (c) {
c.RestorePausedPlayer()
}
this.doLayout();
this.SetFocus(this.panelExpand);
this.SetAlertBorderIfNeeded();
this.OnPlayerExpanded(true);
this.UpdateChnRectList()
},
OnFixAspectRatioModeChange: function(a) {
this.blFixAspectRatio = a;
Ext.each(this.playerInfoList, function(b) {
b.player.SetFixAspect(a)
});
Ext.each(this.emapInfoList, function(b) {
b.emapPanel.SetFixAspect(a)
})
},
SetFixAspectRatio: function(a) {
this.blFixAspectRatio = a
},
OnToggleShowVideoLabel: function(a) {
this.blShowVideoLabel = a;
Ext.each(this.playerInfoList, function(b) {
b.player.SetShowVideoLabel(a)
})
},
SetShowVideoLabel: function(a) {
this.blShowVideoLabel = a
},
OnShowCamInfoLabel: function(a) {
this.blShowInfoLabel = a;
Ext.each(this.panelLayout.items.getRange(), function(b) {
b.ShowCamInfoLabel(a)
}, this);
if (this.panelExpand.videoCt) {
this.panelExpand.videoCt.ShowCamInfoLabel(a)
}
},
SetShowCamInfoLabel: function(a) {
this.blShowInfoLabel = a
},
SetSuspendMouseEvent: function(a) {
if (!this.panelLayout.items) {
return
}
Ext.each(this.panelLayout.items.getRange(), function(b) {
b.SetSuspendMouseEvent(a)
}, this)
},
SetMediaInfo: function(b) {
var a = null;
Ext.each(b, function(d) {
for (var c = 0; c < this.playerInfoList.length; c++) {
if ((ITEM_TYPE_EMAP === d.layoutItemType) || (ITEM_TYPE_CAMGRP === d.layoutItemType) || (ITEM_TYPE_LAYOUT === d.layoutItemType) || (this.playerInfoList[c].location !== d.location)) {
continue
}
this.SetPlayerMediaInfo(c, d)
}
}, this)
},
SetPlayerMediaInfo: function(a, c) {
var b = this.playerInfoList[a].player;
if (b) {
b.SetMediaInfo(c)
}
},
UpdateBgColor: function() {
this.panelLayout.items.getRange().forEach(function(a) {
a.UpdateBgColor()
});
this.panelExpand.UpdateBgColor()
},
SetCursorVisibility: function(a) {
this.playerInfoList.forEach(function(b) {
b.player.SetCursorVisibility(a)
})
},
SetBorderVisibility: function(a) {
if (true === a) {
this.panelBorder.el.show()
} else {
this.panelBorder.el.hide()
}
},
GetFocusPlayer: function() {
return (this.focusPanel) ? this.focusPanel.GetPlayer() : null
},
IsCamInChannel: function(b) {
var a = false;
Ext.each(this.playerInfoList, function(c) {
if (c.camId === b) {
a = true;
return false
}
});
return a
},
IsDevInEmap: function(a, e, c) {
var d = false;
var b = [];
if ((true === this.advAlertOption.enableEmapTraversing) && (true === Ext.isDefined(SYNO.SS.GblStore.emapItemAdjList[c]))) {
b = this.BfsTriggerMap(SYNO.SS.GblStore.emapItemAdjList[c][a])
}
Ext.each(this.emapInfoList, function(j) {
var g = j.emapPanel.curEmapRec.data.item;
var f = -1;
var k = -1;
if (-1 != b.indexOf(j.emapId)) {
d = true;
return false
}
for (var h = 0; h < g.length; h++) {
f = g[h].portIdx;
k = g[h].uniqueId;
if ((SYNO.SS.App.Emap.Def.ItemType.CAMERA === c) && (SYNO.SS.App.Emap.Def.ItemType.CAMERA === g[h].type) && (a === k)) {
if (0 <= f) {
d = (0 !== SYNO.SS.Utils.IsFlags(e, 1 << f))
} else {
d = true
}
}
if ((SYNO.SS.App.Emap.Def.ItemType.IOMODULE === c) && (SYNO.SS.App.Emap.Def.ItemType.IOMODULE === g[h].type) && (a === k)) {
d = (0 !== SYNO.SS.Utils.IsFlags(e, 1 << f))
}
if ((SYNO.SS.App.Emap.Def.ItemType.POS === c) && (SYNO.SS.App.Emap.Def.ItemType.POS === g[h].type) && (a === k)) {
d = true
}
if (true === d) {
return false
}
}
});
return d
},
UpdateAlertTriggerStatus: function(e) {
var f = SYNO.SS.GblStore.GetCamIdOnHost(e.dsId, e.camId);
var a = SYNO.SS.GblStore.GetIOModuleIdOnHost(e.dsId, e.ioModuleId);
var c = SYNO.SS.GblStore.GetPOSIdOnHost(e.dsId, e.transDevId);
var d = SYNO.SS.App.VideoAnalytics.Utils.RemapTaskId(e.dsId, e.ivaTaskId) || 0;
var b = SYNO.SS.GblStore.faceRecognitionTaskModel.RemapTaskId(e.dsId, e.faceTaskId) || 0;
if (0 !== f) {
if (false === e.blTrigger) {
this.alertTrigSts.camAlertSts[f] = {
blTrigger: false,
triggerDIs: 0
}
} else {
if ((true === this.IsCamInChannel(f)) || (true === this.IsDevInEmap(f, e.camAlertDIs, SYNO.SS.App.Emap.Def.ItemType.CAMERA))) {
this.alertTrigSts.camAlertSts[f] = {
blTrigger: e.blTrigger,
triggerDIs: e.camAlertDIs
}
}
}
}
if (0 !== a) {
if (false === e.blTrigger) {
this.alertTrigSts.ioModuleAlertSts[a] = {
blTrigger: false,
triggerDIs: 0
}
} else {
if (true === this.IsDevInEmap(a, e.ioModuleAlertDIs, SYNO.SS.App.Emap.Def.ItemType.IOMODULE)) {
this.alertTrigSts.ioModuleAlertSts[a] = {
blTrigger: e.blTrigger,
triggerDIs: e.ioModuleAlertDIs
}
}
}
}
if (0 !== c) {
this.alertTrigSts.transDevAlertSts[c] = e.blTrigger
}
if (0 !== d) {
this.alertTrigSts.ivaTaskAlertSts[d] = e.blTrigger
}
if (0 !== b) {
this.alertTrigSts.faceTaskAlertSts[b] = e.blTrigger
}
},
UpdateAlertHint: function(a) {
this.UpdateAlertTriggerStatus(a);
this.UpdatePlayerAlertHint(a);
this.UpdateEmapTriggerList();
this.UpdateEmapAlertHint(a);
this.fireEvent("alertEmapNotify", a, this.alertEmapList, this.advAlertOption.enableIconFlash)
},
UpdatePlayerAlertHint: function(f) {
var b = [];
var h = [];
var a = f.blTrigger;
var g = SYNO.SS.GblStore.GetCamIdOnHost(f.dsId, f.camId);
var d = SYNO.SS.GblStore.GetPOSIdOnHost(f.dsId, f.transDevId);
var e = SYNO.SS.App.VideoAnalytics.Utils.RemapTaskId(f.dsId, f.ivaTaskId);
var c = SYNO.SS.GblStore.faceRecognitionTaskModel.RemapTaskId(f.dsId, f.faceTaskId);
b = this.playerInfoList.filter(function(i) {
if ((i.videoAnalyticsId) && (e)) {
return (i.videoAnalyticsId === e)
} else {
if ((i.faceTaskId) && (c)) {
return (i.faceTaskId === c)
} else {
if ((i.posId) && (d)) {
return (i.posId === d)
} else {
return this.FilterCameraPlayerInfo(i, g, h)
}
}
}
}, this);
Ext.each(b, function(i) {
this.SetCellAlert(i.player.ownerCt, a)
}, this);
Ext.each(h, function(i) {
this.SetCellAlert(i.player.ownerCt, false)
}, this)
},
FilterCameraPlayerInfo: function(d, c, b) {
var a = (d.camId === c);
if ((true === a) && (true === this.HideDevicePairedCamPlayerInfo(d))) {
a = false;
b.push(d)
}
return a
},
HideDevicePairedCamPlayerInfo: function(b) {
var a = false;
if (true == this.IsForceNotPairCamChannel(b)) {
return true
}
if (true === Ext.isDefined(b.speakerId)) {
a = (false === SYNO.SS.App.IPSpeaker.Utils.IsSpeakerNormalStatusById(b.speakerId))
}
return a
},
IsForceNotPairCamChannel: function(a) {
return ((true === Ext.isDefined(a.videoAnalyticsId)) || (true === Ext.isDefined(a.faceTaskId)))
},
IsEmapIncludeAlertObj: function(d, c, b) {
var e = false;
var a = SYNO.SS.GblStore.GetEmapById(d);
if ((true === Ext.isEmpty(a)) || (true === Ext.isEmpty(a.data))) {
return false
}
Ext.each(a.data.item, function(f) {
if (true === SYNO.SS.App.Emap.Utils.CheckItemAlert(f, c)) {
if ((f.portIdx < 0) || (0 !== SYNO.SS.Utils.IsFlags(b, 1 << f.portIdx))) {
e = true;
return false
}
}
return (false === e)
});
return e
},
UpdateEmapTriggerList: function() {
var b = [];
var e = this.alertTrigSts.camAlertSts;
var c = this.alertTrigSts.ioModuleAlertSts;
var d = this.alertTrigSts.transDevAlertSts;
var f = SYNO.SS.App.Emap.Def.ItemType;
var a;
if (false === this.advAlertOption.enableEmapTraversing) {
this.alertEmapList = [];
return
}
Object.keys(e).forEach(function(j) {
a = e[j];
if ((true === Ext.isDefined(a)) && (true === a.blTrigger) && (true === Ext.isDefined(SYNO.SS.GblStore.emapItemAdjList[f.CAMERA]))) {
var i = SYNO.SS.GblStore.emapItemAdjList[f.CAMERA][j] || [];
var h = [];
var g = {
dsId: LOCAL_DS_ID,
camId: parseInt(j, 10)
};
Ext.each(i, function(k) {
if (true === this.IsEmapIncludeAlertObj(k, g, a.triggerDIs)) {
h = h.concat([k])
}
}, this);
b = b.concat(h)
}
}, this);
Object.keys(c).forEach(function(h) {
a = c[h];
if ((true === Ext.isDefined(a)) && (true === a.blTrigger) && (true === Ext.isDefined(SYNO.SS.GblStore.emapItemAdjList[f.IOMODULE]))) {
var j = SYNO.SS.GblStore.emapItemAdjList[f.IOMODULE][h] || [];
var i = [];
var g = {
dsId: LOCAL_DS_ID,
camId: parseInt(h, 10) | IOMODULE_FLAG
};
Ext.each(j, function(k) {
if (true === this.IsEmapIncludeAlertObj(k, g, a.triggerDIs)) {
i = i.concat([k])
}
}, this);
b = b.concat(i)
}
}, this);
Object.keys(d).forEach(function(g) {
a = d[g];
if ((true === Ext.isDefined(a)) && (true === a) && (true === Ext.isDefined(SYNO.SS.GblStore.emapItemAdjList[f.POS]))) {
b = b.concat(SYNO.SS.GblStore.emapItemAdjList[f.POS][g])
}
});
this.alertEmapList = this.BfsTriggerMap(b)
},
BfsTriggerMap: function(c) {
var b = {};
var a = [];
var d;
if (false === Ext.isArray(c)) {
return []
}
while (0 < c.length) {
c = Array.from(new Set(c));
d = c[c.length - 1];
c.pop();
if (b[d]) {
continue
}
a.push(d);
b[d] = true;
if ((SYNO.SS.GblStore.emapItemAdjList[SYNO.SS.App.Emap.Def.ItemType.EMAP]) && (SYNO.SS.GblStore.emapItemAdjList[SYNO.SS.App.Emap.Def.ItemType.EMAP][d])) {
c = c.concat(SYNO.SS.GblStore.emapItemAdjList[SYNO.SS.App.Emap.Def.ItemType.EMAP][d])
}
}
return a
},
UpdateEmapAlertHint: function(a) {
Ext.each(this.emapInfoList, function(b) {
SYNO.SS.App.Emap.Utils.UpdateItemAlert(b.emapPanel, a, b.alertDeviceList, this.alertEmapList);
this.SetCellAlert(b.emapPanel.ownerCt, (0 !== b.alertDeviceList.length))
}, this)
},
IsAlertTriggerInEmap: function(b) {
var c = false;
var a = {
dsId: b.dsId,
camId: (DEVICE_IOMODULE === b.devType) ? (b.ioModuleId | IOMODULE_FLAG) : b.camId
};
var d = (DEVICE_IOMODULE === b.devType) ? b.ioModuleAlertDIs : b.camAlertDIs;
this.emapInfoList.forEach(function(e) {
var f = [e.emapId];
SYNO.SS.App.Liveview.AlertUtils.GetNestedEmapIdList(f);
Ext.each(f, function(g) {
c = this.IsEmapIncludeAlertObj(g, a, d);
return (false === c)
}, this);
return (false === c)
}, this);
return c
},
SetCellAlert: function(a, d) {
if (!this.advAlertOption) {
return
}
var c;
var b;
var e;
if (true === this.IsLayoutTypeAlert()) {
c = (true === d);
b = SYNO.SS.App.Liveview.Def.FRAME_SHOW_RED;
e = true;
if (true === c) {
this.SetFocus(a)
}
} else {
c = ((SYNO.SS.App.Liveview.Def.FRAME_DISABLED !== this.advAlertOption.frameType) && (true === d));
b = this.advAlertOption.frameType;
e = this.advAlertOption.enableIconFlash
}
if (true === a.ownerCt.isVisible()) {
if (true === c) {
a.ShowBorderAlert(b)
} else {
a.HideBorderAlert()
}
a.SetAlertIcon(d, e)
}
},
UpdateAlertCameraList: function(d) {
var b;
var c = 0;
var a;
this.playerInfoList.forEach(function(e) {
e.player.EnableAlertIcon(false)
});
this.emapInfoList.forEach(function(e) {
e.emapPanel.SetAlertIconVisible(false);
e.blAlertIconVisible = false
});
a = SYNO.SS.App.Emap.Utils.GetPopAlertEmapViewer(this);
for (c = 0; c < d.length; c++) {
b = d[c];
this.playerInfoList.forEach(function(h) {
if (true === Ext.isDefined(h.posId) && (b.dsId === h.dsId) && (b.transDevId === h.posId)) {
var g = SYNO.SS.GblStore.dsPOS.getById(b.transDevId);
if ((false === Ext.isEmpty(g)) && (true === SYNO.SS.Utils.IsPOSOnlineSts(g.get("status")))) {
h.player.EnableAlertIcon(true)
}
}
if (true === Ext.isDefined(h.videoAnalyticsId) && (b.dsId === h.dsId) && (b.ivaDevId === h.videoAnalyticsId)) {
h.player.EnableAlertIcon(true)
}
if (true === Ext.isDefined(h.faceTaskId) && (b.dsId === h.dsId) && (b.faceTaskId === h.faceTaskId)) {
h.player.EnableAlertIcon(true);
return
}
if ((b.dsId === h.dsId) && (b.camId === h.camIdOnRec) && (false === this.HideDevicePairedCamPlayerInfo(h))) {
var f = SYNO.SS.GblStore.dsCamera.getById(SYNO.SS.GblStore.GetCamIdOnHost(b.dsId, b.camId));
var e = SYNO.SS.CamSts.EMPTY;
if (false === Ext.isEmpty(f)) {
if (true === f.get("deleted")) {
e = SYNO.SS.CamSts.DELETED
} else {
e = f.get("camStatus")
}
}
if (true === SYNO.SS.Utils.IsCamOnlineSts(e)) {
h.player.EnableAlertIcon(true)
}
}
}, this);
this.emapInfoList.forEach(function(e) {
var f = [e.emapId];
SYNO.SS.App.Liveview.AlertUtils.GetNestedEmapIdList(f);
Ext.each(f, function(h) {
var g = SYNO.SS.GblStore.GetEmapById(h);
if (!g) {
return true
}
Ext.each(g.data.item, function(i) {
if (true === SYNO.SS.App.Emap.Utils.CheckItemAlert(i, b)) {
e.emapPanel.SetAlertIconVisible(true);
e.blAlertIconVisible = true;
return false
}
});
if (true === e.blAlertIconVisible) {
return false
}
})
});
a.forEach(function(e) {
if (true === SYNO.SS.Utils.CheckNested(e, "window", "UpdateAlertIcon")) {
e.window.UpdateAlertIcon(b)
}
})
}
},
OnEmapItemSelected: function(c, b) {
var a = c.clickItem;
Ext.each(this.emapInfoList, function(d) {
if (c.emapId !== d.emapId) {
d.emapPanel.SetClickItem(a, true)
}
});
if ((false === b) || (0 <= a.portIdx)) {
return
}
this.OnEmapItemFocus(a.uniqueId, a.type)
},
OnEmapItemFocus: function(b, a) {
switch (a) {
case SYNO.SS.App.Emap.Def.ItemType.CAMERA:
Ext.each(this.panelLayout.items.getRange(), function(d) {
var c = this.layoutList[d.location];
if ((b === c.camId) && (false === this.IsDoorChannel(d)) && (false === Ext.isDefined(c.posId)) && (false === Ext.isDefined(c.speakerId)) && (false === Ext.isDefined(c.speakerList))) {
this.SetFocus(d);
return false
}
}, this);
break;
case SYNO.SS.App.Emap.Def.ItemType.EMAP:
Ext.each(this.emapInfoList, function(c) {
if (b === c.emapPanel.emapId) {
this.SetFocus(c.emapPanel.ownerCt)
}
}, this);
break;
case SYNO.SS.App.Emap.Def.ItemType.DOOR:
Ext.each(this.monitorList, function(c) {
if (b === c.doorId) {
this.SetFocus(c.monitorPanel.ownerCt)
}
}, this);
break;
case SYNO.SS.App.Emap.Def.ItemType.POS:
Ext.each(this.playerInfoList, function(c) {
if ((true === Ext.isDefined(c.posId)) && (b === c.posId)) {
this.SetFocus(c.player.ownerCt)
}
}, this);
break;
case SYNO.SS.App.Emap.Def.ItemType.IPSPEAKER:
Ext.each(this.playerInfoList, function(c) {
if ((true === Ext.isDefined(c.speakerId)) && (b === c.speakerId)) {
this.SetFocus(c.player.ownerCt)
}
}, this);
break;
case SYNO.SS.App.Emap.Def.ItemType.IPSPEAKER_GROUP:
Ext.each(this.playerInfoList, function(c) {
if ((true === Ext.isDefined(c.groupId)) && (true === Ext.isDefined(c.speakerList)) && (b === c.groupId)) {
this.SetFocus(c.player.ownerCt)
}
}, this);
break;
default:
break
}
},
UpdateAcapDetArea: function(c) {
var a;
var b;
if (false === this.IsLiveviewLayout(this.viewType)) {
return
}
b = SYNO.SS.GblStore.GetCamIdOnHost(c.dsId, c.camId);
a = this.playerInfoList.filter(function(d) {
return (d.camId === b) && ((true === this.IsLiveviewLayout(d.player.viewType)) || (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW_POS === d.player.viewType))
}.createDelegate(this));
Ext.each(a, function(d) {
d.player.acapHandler.DrawAcapDetArea(c.detectInfo)
}, this)
},
ResetPlayerStatus: function() {
this.ClearAlertTrigSts();
Ext.each(this.playerInfoList, function(b) {
var a = b.player;
if (a) {
a.ResetPlayer({
blSingleCh: this.IsSingleChannel()
});
a.Resume()
}
}, this)
},
EmapLoaded: function(a) {
if (!a.clickItem) {
this.CheckEmapItemSelected(this.focusPanel)
}
Ext.each(this.emapInfoList, function(c) {
var b = c.emapPanel;
var d = c.alertDeviceList;
b.InitItemAlert(d);
if (this.advAlertOption) {
b.SetAlertIconFlash((0 !== d.length), this.advAlertOption.enableIconFlash)
}
}, this)
},
ChangeStmProfile: function(b) {
var a = this.focusPanel.GetPlayer();
if (a) {
a.OnStmProfileChanged(b)
}
},
OnPlayerExpanded: function(b) {
var a = null;
if (null === this.focusPanel) {
return
}
a = this.focusPanel.GetPlayer();
if (a) {
a.OnPlayerExpanded(b)
}
},
AutoAdjustUpdate: function(b) {
var c = SYNO.SS.GblStore.GetCamIdOnHost(b.dsId, b.camId);
var a = function(f, e) {
var d = false;
if (true === Ext.isEmpty(f.camList)) {
return false
}
Ext.each(f.camList, function(g) {
if (e === g.idOnHost) {
d = true;
return false
}
});
return d
};
if (0 === c) {
return
}
Ext.each(this.playerInfoList, function(d) {
if (true === a(d, c)) {
d.player.OnPlayerEvtDetected(b.blAdjust, c)
} else {
if (d.camId === c) {
d.player.OnPlayerEvtDetected(b.blAdjust)
}
}
})
},
ChangeTalking: function() {
var a = this.focusPanel.GetPlayer();
if (a) {
a.OnTalkingChanged()
}
},
IsLiveviewLayout: function(a) {
return (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.LIVEVIEW === a)
},
IsLayoutTypeAlert: function() {
return (SYNO.SS.Layout.Def.TYPE_ALERT === this.parentWin.dataLayoutList.layout[this.parentWin.idxLayout].type)
},
OnEmapChanged: function(a) {
var b = this.emapInfoList.findExact("location", a);
var d = [];
var c;
if (-1 === b) {
return
}
c = this.emapInfoList[b];
d = SYNO.SS.App.Emap.Utils.GetAlertDevList(c.emapId, this.alertTrigSts, this.alertEmapList);
c.alertDeviceList = d;
c.emapPanel.InitItemAlert(d)
},
AddDetectionResult: function(a, b) {
var c;
if (true === this.IsChnExpanded()) {
c = this.panelExpand
} else {
c = this.panelLayout
}
c.items.each(function(e) {
var d = e.GetPlayer();
if ((d instanceof SYNO.SS.App.WebPlayer.DetectionResult.Html5PlayerPanel) && (b === d.GetDetectionType())) {
d.AddResult(a)
}
})
},
GetCurRealProfile: function(a) {
var b = this.playerInfoList[a];
if ((true === Ext.isEmpty(b)) || (true === Ext.isEmpty(b.player))) {
return null
}
return b.player.GetCurRealProfile()
},
ToLive: function(b) {
var a = this.playerInfoList.findExact("location", b);
this.DoSwitcherAct(this.playerInfoList[a], "ToLive")
},
ToRec: function(c, b, d) {
var a = this.playerInfoList.findExact("location", c);
this.DoSwitcherAct(this.playerInfoList[a], "ToRec", b, d)
},
DoSwitcherAct: function(d, a) {
if (!d) {
return
}
var c = d.player;
var b = [c, d.playerCfg].concat(Array.prototype.slice.call(arguments, 2));
Ext.apply(d.playerCfg, {
blFixAspectRatio: this.blFixAspectRatio,
blShowVideoLabel: this.blShowVideoLabel,
blShowCamInfoLabel: this.blShowInfoLabel,
blSuspendMouseEvent: this.blSuspendMouseEvent
});
d.player = this.playerSwitcher[a].apply(this.playerSwitcher, b);
if (c !== d.player) {
this.OnPlayerChange(d)
}
},
OnPlayerChange: function(b) {
var a = b.player;
if (SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.TIMELINE === a.viewType) {
this.SetRecPlayerTitle(a, b)
}
if (b.location === this.focusContainerId) {
a.SetFocus(true)
}
this.fireEvent(this.EVT_PLAYER_CHANGE, b.location, a)
},
SetRecPlayerTitle: function(a, b) {
var c = b.name;
if (0 < a.regionId) {
c += " - " + a.regionName
}
a.BannerAct("SetTitle", c, b)
},
GetPlayerInfoList: function() {
return this.playerInfoList || []
}
});
Ext.namespace("SYNO.SS.App.WebPlayer.LiveviewPanel");
Ext.define("SYNO.SS.App.WebPlayer.LiveviewPanel", {
extend: "SYNO.ux.Panel",
hideMode: "offsets",
owner: null,
divId: "",
playerId: "",
projName: "",
cbPrefix: "",
idPostfix: "",
mode: SYNO.SS.App.WebPlayer.Def.PreviewMode.Liveview,
blFirstHide: true,
blShowTip: true,
blFullScrForTipDiv: false,
blHeader: false,
width: 0,
height: 0,
viewWidth: 0,
viewHeight: 0,
playerCnt: 0,
div: null,
player: null,
monitorPanel: null,
fakePlayer: null,
transPanel: null,
voRect: {
left: 0,
top: 0,
width: 0,
height: 0
},
fnStartPlayer: null,
registEvent: null,
mediaInfo: null,
ptzController: null,
patrolController: null,
curStatus: SYNO.SS.App.WebPlayer.Def.PlayerStatus.BEFORE_INIT,
posId: 0,
blTalking: false,
blOpenAudioOut: false,
audioOut: null,
playerPool: {},
constructor: function(c) {
this.owner = c.owner;
var b = SYNO.SS.App.WebPlayer.LiveviewPanel.prototype;
this.mode = this.mode || c.mode;
this.width = c.width;
this.height = c.height;
this.viewWidth = c.width;
this.viewHeight = c.height;
this.blHeader = this.blHeader || c.blHeader;
this.mediaInfo = {};
this.registEvent = {};
this.GetProjectName();
if (Ext.isDefined(c.extraCfg)) {
if (Ext.isDefined(c.extraCfg.blOpenAudioOut)) {
this.blOpenAudioOut = c.extraCfg.blOpenAudioOut
}
}
b.playerCnt++;
b.playerPool[this.projName] = b.playerPool[this.projName] || [];
var a = {
PluginInitComplete: this.OnPluginInitComplete.createDelegate(this),
PlayerData: this.OnPlayerData.createDelegate(this),
AbsPosition: this.OnAbsPosition.createDelegate(this),
MousePress: this.OnMousePress.createDelegate(this)
};
Ext.applyIf(a, c.registEvent);
this.idPostfix = this.projName + "-" + SYNO.SS.App.WebPlayer.LiveviewPanel.prototype.playerCnt;
this.divId = "div-" + this.idPostfix;
this.playerId = "player-" + this.idPostfix;
var d = function() {
this.OnOpenPlugin.defer(500, this)
};
Ext.applyIf(c, {
border: false,
registEvent: a,
defaults: {
border: false
},
items: [{
html: String.format('<div id = "{0}" style = "width: {1}px; height: {2}px; position: relative;"></div>', this.divId, this.width, this.height)
}],
listeners: {
afterrender: d.createDelegate(this),
beforedestroy: this.OnBeforeDestroy,
scope: this
}
});
this.callParent([c]);
this.mon(SYNO.SDS.StatusNotifier, "updateVideoBgColor", this.UpdateVideoBgColor, this);
this.mon(SYNO.SDS.StatusNotifier, "updateVideoScaleMethod", this.UpdateVideoScaleMethod, this);
this.transPanel = new SYNO.SS.App.WebPlayer.TransactionContainer({
owner: this,
mode: "live",
posId: this.posId
});
this.fakePlayer = new Ext.Container({
owner: this,
cls: "preview-fake-player",
border: false,
style: "position: absolute; overflow: hidden;",
items: [this.transPanel]
});
this.transPanel.UpdateVisibility();
this.add(this.fakePlayer);
this.fakePlayer.mon(this.fakePlayer, "resize", function(f, g, e) {
this.transPanel.OnResize()
}, this)
},
OnOpenPlugin: function() {
this.div = document.getElementById(this.divId);
if ((false === Ext.isEmpty(this.extraCfg)) && (true === this.extraCfg.blAddPlugin)) {
this.CreatePlugin();
this.insert(1, this.monitorPanel);
this.doLayout();
this.ResizeDoorPlugin()
}
this.OpenPlugin()
},
OpenPlugin: function() {
var a = {
id: this.playerId,
projName: this.projName,
parentId: this.divId,
width: this.viewWidth,
height: this.viewHeight,
listeners: this.registEvent,
IsEventAccepted: function(b, c) {
var d = b.getTarget(null, 0, true);
if (d.id === this.fakePlayer.id) {
return true
} else {
return false
}
}.createDelegate(this),
SetElementCursor: function(c) {
if ((null === this.fakePlayer) || (undefined === this.fakePlayer.getEl())) {
return
}
var b = this.fakePlayer.getEl();
if (b.getStyle("cursor") !== c) {
b.setStyle("cursor", c)
}
}.createDelegate(this)
};
this.player = SYNO.SS.Plugin.CreateNew(a);
if (null !== this.monitorPanel) {
if (SYNO.SS.App.WebPlayer.Def.PreviewMode.Door === this.mode) {
this.monitorPanel.SetInfo(0, this.extraCfg.doorId)
} else {
if (SYNO.SS.App.WebPlayer.Def.PreviewMode.Intercom === this.mode) {
this.monitorPanel.SetInfo(0, this.extraCfg.recCamInfo)
}
}
}
this.player.Activate()
},
OnBeforeDestroy: function() {
if ((false === Ext.isEmpty(this.player)) && (true === this.player.blDestroyed)) {
return true
}
if (false === SYNO.SS.Plugin.IsEnable()) {
return true
}
if (false === this.IsPlayerReady()) {
return false
}
if (false === Ext.isEmpty(this.player)) {
this.player.Deactivate()
}
if (this.div) {
this.div.innerHTML = ""
}
if (this.monitorPanel && (true === Ext.isDefined(this.monitorPanel.OnBeforeClose))) {
this.monitorPanel.OnBeforeClose()
}
return true
},
InitPlayerAttr: function() {
if ((false === this.IsPlayerAvailabel()) || (false === this.IsPlayerReady())) {
return
}
this.UpdateVideoBgColor();
this.UpdateVideoScaleMethod();
this.player.SetPlayerStr(PLAYER_BTN_DISCONNECT, _T("camera", "conn_status_failed"));
this.player.SetPlayerStr(PLAYER_BTN_DISABLED, _T("camera", "conn_status_disabled"));
this.player.SetPlayerStr(PLAYER_SNAPSHOT_DELETE, _T("ss_common", "common_delete"));
this.player.SetPlayerStr(PLAYER_DELETE, _T("camera", "camera_deleted"));
this.player.SetPlayerStr(PLAYER_BTN_ACTIVATING, _T("camera", "conn_status_setting"));
this.player.SetPlayerStr(PLAYER_BTN_HOME, _T("liveview", "liveview_home"));
this.player.SetPlayerStr(PLAYER_BTN_ZOOM, _T("liveview", "liveview_zoom"));
this.player.SetPlayerStr(PLAYER_BTN_ABSOLUTE_POSITION, _T("liveview", "liveview_absolute_position"));
this.player.SetPlayerStr(PLAYER_AUTO_PAN, _T("liveview", "auto_pan"));
this.player.SetPlayerStr(PLAYER_OBJ_TRACKING, _T("liveview", "obj_tracking"));
this.player.SetPlayerStr(PLAYER_BTN_IRIS, _T("liveview", "liveview_iris"));
this.player.SetPlayerStr(PLAYER_BTN_FOCUS, _T("liveview", "liveview_focus"));
this.player.SetPlayerStr(PLAYER_DRAG_ZOOM, _T("liveview", "liveview_drag_zoom"));
this.player.SetPlayerStr(PLAYER_RESET_ZOOM, _T("liveview", "liveview_reset_digital_zoom"));
this.player.SetPlayerStr(PLAYER_BTN_PLAY, _T("event", "event_play"));
this.player.SetPlayerStr(PLAYER_BTN_PAUSE, _T("event", "event_pause"));
this.player.SetPlayerStr(PLAYER_IMAGE_ENHANCEMENT, _T("ss_common", "common_image_enhancement"));
this.player.SetPlayerStr(PLAYER_BTN_SNAPSHOT, _T("ss_common", "common_snapshot"));
this.player.SetPlayerStr(PLAYER_BTN_FIX_ASPECT_RATIO, _T("liveview", "fix_aspect_ratio"));
this.player.SetPlayerStr(PLAYER_BTN_MANUAL_RECORDING, _T("camera", "camera_manual_recording"));
this.player.SetPlayerStr(PLAYER_BTN_STOP_RECORDING, _T("camera", "stop_manual_record"));
this.player.SetPlayerStr(PLAYER_BTN_VOL_ON, _T("liveview", "audio_on"));
this.player.SetPlayerStr(PLAYER_BTN_VOL_OFF, _T("liveview", "audio_off"));
this.player.SetPlayerStr(PLAYER_EDIT, _T("ss_common", "common_edit"));
this.player.SetPlayerStr(PLAYER_DOWNLOAD, _T("event", "event_export"));
this.player.SetPlayerStr(PLAYER_CLOSE, _T("ss_common", "close"));
this.player.SetPlayerStr(PLAYER_LOCAL_HOST_INFO, GetLocalHostInfo());
this.player.SetPlayerStr(PLAYER_STM_PROFILE, _T("camera", "stream_profile"));
this.player.SetPlayerStr(PLAYER_STM_PROFILE_DEFAULT, _T("camera", "by_camera_settings"));
this.player.SetPlayerStr(PLAYER_STM_PROFILE_HIGH, _T("camera", "profile_high_quality"));
this.player.SetPlayerStr(PLAYER_STM_PROFILE_MED, _T("camera", "profile_balanced"));
this.player.SetPlayerStr(PLAYER_STM_PROFILE_LOW, _T("camera", "profile_low_bandwidth"));
this.player.SetPlayerStr(PLAYER_WIPER, _T("camera", "wiper"));
this.player.SetPlayerStr(PLAYER_LED, _T("camera", "led"));
this.player.SetPlayerStr(PLAYER_OSD_ON, _T("camera", "on"));
this.player.SetPlayerStr(PLAYER_OSD_OFF, _T("camera", "off"));
this.player.SetPlayerStr(PLAYER_AUDIO_OUTPUT, _T("camera", "audio_output"));
this.player.SetPlayerStr(PLAYER_BTN_TRANSACTION, _T("transactions", "transactions"));
this.player.SetPlayerStr(PLAYER_SETTING_ERROR, _T("liveview", "unplayable_setting"));
this.player.SetPlayerStr(PLAYER_NO_PAIRED_CAMERA, _T("axis_access_controller", "no_paired_camera"));
SYNO.SS.App.Snapshot.Utils.SetSnapshotSetting(this.player);
SYNO.SS.App.Snapshot.Utils.SetSnapshotOperPriv(this.player, SYNO.SS.Utils.IsOperAllowed(SYNO.SS.App.User.Def.PrivOper.LIVEVIEW_SNAPSHOT));
this.InitAudioOut()
},
InitAudioOut: function() {
if (this.audioOut) {
return
}
if (true === SYNO.SS.Utils.IsSupportWebPlayer()) {
this.audioOut = new SYNO.SS.App.WebPlayer.Html5AudioOut()
} else {
this.audioOut = new SYNO.SS.Audioin.PluginAudioOut()
}
},
IsPlayerAvailabel: function() {
return (SYNO.SS.App.WebPlayer.Def.PlayerStatus.INIT_COMPLETE === this.curStatus) || (SYNO.SS.App.WebPlayer.Def.PlayerStatus.READY_TO_PLAY === this.curStatus) || (SYNO.SS.App.WebPlayer.Def.PlayerStatus.PLAYING === this.curStatus)
},
IsPlayerReady: function() {
return ((false === Ext.isEmpty(this.player)) && (false === Ext.isEmpty(this.player.dom)))
},
SetAttr: function(a, b) {
if ((false === this.IsPlayerAvailabel()) || (false === this.IsPlayerReady())) {
return
}
if ("string" === typeof b) {
this.player.SetPlayerStr(a, b)
} else {
this.player.SetAttr(a, b)
}
},
Show: function(a) {
if (false === this.IsPlayerAvailabel()) {
return
}
if ((false === WINDOWLESS_PLUGIN) || (true === a)) {
this.div.style.visibility = (true === a) ? "visible" : "hidden"
}
},
ShowPlayer: function(a) {
if ((false === this.IsPlayerAvailabel()) || (false === this.IsPlayerReady())) {
return
}
if (true === SYNO.SDS.IsInvalidLogin()) {
this.player.SetPlayerStr(PLAYER_MODERN_COMPATIBILITY_UNSUPPORT, _T("common", "modern_compatibility_unsupport"))
}
if ((false === WINDOWLESS_PLUGIN) || (true === a)) {
this.player.dom.style.visibility = (true === a) ? "visible" : "hidden"
}
if (true === Ext.isFunction(this.owner.SetPlayerReady)) {
Ext.defer(this.owner.SetPlayerReady, 400, this.owner, [true])
}
},
OnDestroy: function() {
if (false === this.IsPlayerAvailabel()) {
return
}
this.div.innerHTML = "";
delete this.ptzController;
this.ptzController = null
},
IsMediaInfoVaild: function(b) {
var a = true;
var c = (("undefined" !== typeof b.camId) && ("undefined" !== typeof b.camName) && ("undefined" !== typeof b.camDsIdIp) && ("undefined" !== typeof b.dsPort) && ("undefined" !== typeof b.stmPort) && ("undefined" !== typeof b.stmType) && ("undefined" !== typeof b.blCrossSite) && ("undefined" !== typeof b.blHttps) && ("undefined" !== typeof b.attrFlags) && ("undefined" !== typeof b.livePath) && ("undefined" !== typeof b.vdoType) && ("undefined" !== typeof b.cookie));
if (SYNO.SS.App.WebPlayer.Def.PreviewMode.Patrol === this.mode) {
a = ((false === Ext.isEmpty(this.extraCfg)) && ("undefined" !== typeof this.extraCfg.patrolData))
}
return (c && a)
},
ShowNoSource: function() {
this.SetStatusText(_T("axis_access_controller", "no_paired_camera"));
this.ShowPlayer(true)
},
SetMediaInfo: function(a) {
if (false === this.IsMediaInfoVaild(a)) {
return
}
if (false === this.IsPlayerAvailabel()) {
return
}
this.ptzController = null;
this.mediaInfo = a;
this.sendWebAPI({
api: "SYNO.SurveillanceStation.PTZ.Preset",
version: 1,
method: "GetInfo",
params: {
cameraId: this.mediaInfo.camIdOnHost
},
callback: function(f, e) {
if (!f) {
return
}
if (false === this.IsPluginEnable()) {
return
}
var d = e;
Ext.apply(this.mediaInfo, d);
var c = {
zoomDone: this.OnZoomDone.createDelegate(this)
};
if (0 !== this.mediaInfo.ptz) {
this.ptzController = new SYNO.SS.App.WebPlayer.PtzControl(this.mediaInfo, c, this)
}
this.SetAttr(ATTR_PTZ_CAP, this.mediaInfo.ptz);
this.SetAttr(ATTR_PTZ_DIRECTION, this.mediaInfo.ptzDirection);
this.SetAttr(ATTR_PTZ_AUTO_PAN_TYPE, this.mediaInfo.ptzAutoPanType);
this.SetAttr(ATTR_PTZ_OBJECT_TRACKING, this.mediaInfo.ptzHasObjTracking)
},
scope: this
});
this.SetAttr(PLAYER_CAMERA_NAME, this.mediaInfo.camName);
if (true === Ext.isDefined(this.mediaInfo.extraDemuxConfig)) {
this.SetAttr(PLAYER_SET_MEDIA_INFO, this.mediaInfo.extraDemuxConfig)
}
if (true === this.IsPlayerReady()) {
this.player.SetMediaInfo(this.mediaInfo.camId, this.mediaInfo.camDsIdIp, this.mediaInfo.dsPort, this.mediaInfo.stmPort, this.mediaInfo.blCrossSite, this.mediaInfo.blHttps, this.mediaInfo.attrFlags);
this.player.SetAttr(ATTR_CAM_ID_ON_HOST, this.mediaInfo.camIdOnHost)
}
switch (this.mediaInfo.camStatus) {
case SYNO.SS.CamSts.DELETED:
this.SetStatusText(_T("camera", "camera_deleted"));
break;
case SYNO.SS.CamSts.UNAVAILABLE:
this.SetStatusText(_T("liveview", "liveview_camera_unavailable"));
break;
case SYNO.SS.CamSts.INACCESSIBLE:
this.SetStatusText(_T("ss_common", "common_not_authorized"));
break;
case SYNO.SS.CamSts.UNRECOGNIZED:
this.SetStatusText(_T("camera", "conn_status_unrecognized"));
break;
default:
break
}
if (SYNO.SS.App.WebPlayer.Def.PreviewMode.Patrol === this.mode) {
var b = this.extraCfg.patrolData;
this.SetAttr(PLAYER_CAMERA_NAME, b.name);
this.SetAttr(ATTR_GUARD_MODE, SYNO.SS.App.WebPlayer.Def.PatrolStatus.PATROL);
this.patrolController = new SYNO.SS.App.WebPlayer.PatrolControl(this, this.owner, this.mediaInfo, b)
}
this.curStatus = SYNO.SS.App.WebPlayer.Def.PlayerStatus.READY_TO_PLAY
},
SetStatusText: function(a) {
this.player.SetPlayerStr(PLAYER_SET_CAM_INFO, a)
},
StartDetect: function(b) {
var a, c;
this.player.SetPlayerStr(PLAYER_STOP_DETECT, "");
a = {};
a.DsIp = this.mediaInfo.camDsIdIp;
a.DsPort = parseInt(this.mediaInfo.dsPort, 10);
a.Cookie = this.mediaInfo.cookie;
a.Session = this.mediaInfo.accessToken;
a.CamId = this.mediaInfo.camId;
a.CamMode = b;
a.Https = this.mediaInfo.blHttps;
a.AttrFlags = this.mediaInfo.attrFlags;
c = Ext.encode(a);
this.player.SetPlayerStr(PLAYER_START_DETECT, c)
},
SetDetectType: function(c, a, e) {
var b, d;
b = {};
b.DetectChartType = c;
if (SYNO.SS.LiveviewPanel.PROJ_DETECT_TYPE_APP == c) {
a = (typeof a !== "undefined" ? a : 0);
e = (typeof e !== "undefined" ? e : "");
b.AppIdx = a;
b.liveViewEdit = e
}
d = Ext.encode(b);
this.player.SetPlayerStr(PLAYER_SET_DETECT_CHART_TYPE, d)
},
Play: function() {
if ((true === this.IsPlayerReady()) && (SYNO.SS.App.WebPlayer.Def.PlayerStatus.READY_TO_PLAY === this.curStatus)) {
this.player.StartPreviewPlayer(this.mediaInfo.cookie, this.mediaInfo.vdoType, this.mediaInfo.livePath, this.mediaInfo.stmType);
this.curStatus = SYNO.SS.App.WebPlayer.Def.PlayerStatus.PLAYING
}
},
Stop: function() {
if ((false === this.IsPlayerReady()) || (SYNO.SS.App.WebPlayer.Def.PlayerStatus.PLAYING !== this.curStatus)) {
return
}
this.player.StopPreviewPlayer();
this.curStatus = SYNO.SS.App.WebPlayer.Def.PlayerStatus.READY_TO_PLAY
},
StopPtz: function() {
if (null === this.ptzController) {
return
}
this.ptzController.StopPtz()
},
OnZoomDone: function() {
this.SetAttr(ATTR_OPTICAL_ZOOM_COMPLETE, 0)
},
OnPluginInitComplete: function() {
if ((this.findWindow() instanceof SYNO.SDS.AppWindow) && (true === Ext.isFunction(this.findWindow().setPluginObj))) {
this.findWindow().setPluginObj(this.player)
}
this.curStatus = SYNO.SS.App.WebPlayer.Def.PlayerStatus.INIT_COMPLETE;
this.InitPlayerAttr();
Ext.defer(this.fnStartPlayer, 10);
SYNO.SS.App.WebPlayer.LiveviewPanel.prototype.playerPool[this.projName].push(this);
if (true === this.blOpenAudioOut) {
this.OnPlayerPreOnTalk.defer(3000, this)
}
},
OnPlayerData: function(d, c, b, a) {
if ((SYNO.SS.PlayerData.PTZ_DIRECTION_BEGIN <= d) && (SYNO.SS.PlayerData.PTZ_DIRECTION_END >= d)) {
var e = d - SYNO.SS.PlayerData.PTZ_DIRECTION_BEGIN;
this.ptzController.OnScreenPtz(c, "Move", e);
return
}
switch (d) {
case SYNO.SS.PlayerData.HOME:
this.ptzController.OnScreenPtz(c, "Home");
break;
case SYNO.SS.PlayerData.IRIS_IN:
this.ptzController.OnScreenPtz(c, "Iris", 1);
break;
case SYNO.SS.PlayerData.IRIS_OUT:
this.ptzController.OnScreenPtz(c, "Iris", -1);
break;
case SYNO.SS.PlayerData.FOCUS_IN:
this.ptzController.OnScreenPtz(c, "Focus", 1);
break;
case SYNO.SS.PlayerData.FOCUS_OUT:
this.ptzController.OnScreenPtz(c, "Focus", -1);
break;
case SYNO.SS.PlayerData.AUTO_FOCUS:
this.ptzController.OnScreenPtz(c, "AutoFocus");
break;
case SYNO.SS.PlayerData.ZOOM_IN:
this.ptzController.OnScreenPtz(c, "Zoom", 1);
break;
case SYNO.SS.PlayerData.ZOOM_OUT:
this.ptzController.OnScreenPtz(c, "Zoom", -1);
break;
case SYNO.SS.PlayerData.AUTO_PAN:
this.ptzController.OnScreenPtz(c, "AutoPan");
break;
case SYNO.SS.PlayerData.OBJ_TRACKING:
this.ptzController.OnScreenPtz(c, "ObjTracking");
break;
case SYNO.SS.PlayerData.OSD_HIDDEN_MODE:
break;
case SYNO.SS.PlayerData.PATROL_PLAY:
this.patrolController.OnPlay();
break;
case SYNO.SS.PlayerData.PATROL_STOP:
this.patrolController.OnStop();
break;
case SYNO.SS.PlayerData.MANUAL_RECORDING:
if (true === SYNO.SS.Utils.IsOperAllowed(SYNO.SS.App.User.Def.PrivOper.MANUAL_REC)) {
this.OnManualRec(0 !== c)
}
break;
case SYNO.SS.PlayerData.VOLUME_ON:
SYNO.SS.Utils.SaveVolume(c, this.mediaInfo.camId, this.mediaInfo.ownerDsId);
break;
case SYNO.SS.PlayerData.VOLUME_OFF:
SYNO.SS.Utils.SaveMute((0 !== c), this.mediaInfo.camId, this.mediaInfo.ownerDsId);
break;
case SYNO.SS.PlayerData.SV_DOWNLOAD:
SYNO.SS.App.Snapshot.Utils.DownloadFileById(c, b);
break;
case SYNO.SS.PlayerData.SV_EDIT:
SYNO.SS.App.Snapshot.Utils.LaunchEditor(this, c);
break;
case SYNO.SS.PlayerData.SV_DELETE:
SYNO.SS.App.Snapshot.Utils.DeleteFileById(this, c);
break;
case SYNO.SS.PlayerData.SV_UPDATE_STORE:
SYNO.SDS.StatusNotifier.fireEvent("snapshotUpdateStore");
break;
case SYNO.SS.PlayerData.WIPER_TRIGGER:
this.OnWiperTrigger(0 !== c);
break;
case SYNO.SS.PlayerData.LED_TRIGGER:
this.OnLedTrigger(c);
break;
case SYNO.SS.PlayerData.SPEED_DRY:
this.OnSpeedDry();
break;
case SYNO.SS.PlayerData.TRANSACTION:
this.OnSetTransVisible(0 !== c);
break;
case SYNO.SS.PlayerData.SNAPSHOT_STORAGE_PATH_INVALID:
SYNO.SS.App.Snapshot.Utils.ConfirmDownloadSnapshot(this.findWindow().getMsgBox(), c);
break;
case SYNO.SS.PlayerData.VIDEO_OUT_POSITION:
this.SetVideoOutPosition(c, b);
break;
case SYNO.SS.PlayerData.VIDEO_OUT_SIZE:
this.SetVideoOutSize(c, b);
break;
case SYNO.SS.PlayerData.AUDIO_OUT_CHECK_OCCUPIED:
this.OnPlayerPreOnTalk(c);
break;
default:
break
}
},
OnManualRec: function(a) {
var b = {
action: (true === a) ? "start" : "stop",
cameraId: SYNO.SS.App.Liveview.Utils.GetIdOnHost(this.mediaInfo.ownerDsId, this.mediaInfo.camId)
};
this.mediaInfo.manualRecOn = a;
this.sendWebAPI({
api: "SYNO.SurveillanceStation.ExternalRecording",
version: 1,
method: "Record",
params: b,
callback: function(f, d, e, c) {
this.OnManualRecDone(f, d, e, c)
},
scope: this
})
},
OnManualRecDone: function(e, b, d, a) {
var c = _T("ss_common", "common_liveview");
if (false === e) {
this.findWindow().getMsgBox().alert(c, SYNO.API.getErrorString(b.code));
this.mediaInfo.manualRecOn = !this.mediaInfo.manualRecOn
}
},
OnWiperTrigger: function(b) {
var a = {
camId: this.mediaInfo.camId,
blActivate: b
};
this.sendWebAPI({
api: "SYNO.SurveillanceStation.DigitalOutput",
version: 1,
method: "CtrlWiper",
params: a,
dsId: this.mediaInfo.ownerDsId,
scope: this
})
},
OnLedTrigger: function(b) {
var a = {
camId: this.mediaInfo.camId,
ctrlVal: b
};
this.sendWebAPI({
api: "SYNO.SurveillanceStation.DigitalOutput",
version: 1,
method: "CtrlLED",
params: a,
dsId: this.mediaInfo.ownerDsId,
scope: this
})
},
OnSpeedDry: function() {
var a = {
cameraId: this.mediaInfo.camId
};
this.sendWebAPI({
api: "SYNO.SurveillanceStation.PTZ",
version: 5,
method: "SpeedDry",
params: a,
dsId: this.mediaInfo.ownerDsId,
scope: this
})
},
OnSetTransVisible: function(a) {
this.transPanel.SetVisibleByOsd(a)
},
SetVideoOutPosition: function(b, a) {
this.voRect.left = b;
this.voRect.top = a;
this.UpdateFakePlayerRect()
},
SetVideoOutSize: function(b, a) {
this.voRect.width = b;
this.voRect.height = a;
this.UpdateFakePlayerRect()
},
OnPlayerPreOnTalk: function(a) {
if (false === this.blTalking) {
if (false == this.audioOut.IsMicExist()) {
this.findWindow().getMsgBox().alert(_T("audio_output", "bi_direction_audio"), _T("audio_output", "check_mic_plug_correct"))
} else {
this.IsOccupied(this.OnStartTalking.createDelegate(this), this.OnStopTalking.createDelegate(this))
}
} else {
if (0 === a) {
this.OnStopTalking()
} else {
this.OnStartTalking()
}
}
},
OnStartTalking: function() {
this.blTalking = true;
this.player.SetAttr(ATTR_AUDIO_OUT_ENABLE, 1)
},
OnStopTalking: function() {
this.blTalking = false;
this.player.SetAttr(ATTR_AUDIO_OUT_ENABLE, 0)
},
IsOccupied: function(a, b) {
this.sendWebAPI({
api: "SYNO.SurveillanceStation.AudioOut",
method: "CheckOccupied",
version: 1,
dsId: this.mediaInfo.ownerDsId,
params: {
camId: this.mediaInfo.camId
},
callback: function(f, d, e, c) {
if (f) {
if (true === d.isOccupied) {
this.findWindow().getMsgBox().alert(_T("audio_output", "bi_direction_audio"), _T("audio_output", "occupied"));
b()
} else {
a()
}
}
},
scope: this
})
},
OnAbsPosition: function(b, a) {
this.ptzController.OnAbsPosition(b, a)
},
OnMousePress: function() {
SYNO.SS.Utils.MousePressPlayer()
},
GetProjectName: function() {
if ((SYNO.SS.App.WebPlayer.Def.PreviewMode.MD === this.mode) || (SYNO.SS.App.WebPlayer.Def.PreviewMode.AD === this.mode) || (SYNO.SS.App.WebPlayer.Def.PreviewMode.TD === this.mode) || (SYNO.SS.App.WebPlayer.Def.PreviewMode.PD === this.mode) || (SYNO.SS.App.WebPlayer.Def.PreviewMode.APP === this.mode)) {
this.projName = SYNO.SS.LiveviewPanel.PROJ_DETECT_CHART
} else {
if (SYNO.SS.App.WebPlayer.Def.PreviewMode.Analytics === this.mode) {
this.projName = SYNO.SS.LiveviewPanel.PROJ_ANALYTICS
} else {
if (this.blHeader) {
this.projName = SYNO.SS.LiveviewPanel.PROJ_PREVIEW
} else {
this.projName = SYNO.SS.LiveviewPanel.PROJ_GUARD
}
}
}
},
GetDoorChannelWidth: function() {
return (false === Ext.isEmpty(this.monitorPanel)) ? this.monitorPanel.chnRect.w : 0
},
GetPlayerWidth: function() {
if (this.player && this.player.dom) {
return parseInt(this.player.dom.width, 10)
}
return 0
},
CreatePlugin: function() {
if ((SYNO.SS.App.WebPlayer.Def.PreviewMode.Door !== this.mode) && (SYNO.SS.App.WebPlayer.Def.PreviewMode.Intercom !== this.mode)) {
return
}
if (SYNO.SS.App.WebPlayer.Def.PreviewMode.Door === this.mode) {
this.mon(SYNO.SDS.StatusNotifier, "addonsStatusChange", this.CheckDoorStatus, this);
this.monitorPanel = new SYNO.SS.App.Liveview.DoorPanel(this.findWindow())
} else {
if (SYNO.SS.App.WebPlayer.Def.PreviewMode.Intercom === this.mode) {
this.monitorPanel = new SYNO.SS.App.Liveview.IntercomPanel(this.findWindow())
}
}
this.monitorPanel.mon(this.monitorPanel, "afterrender", this.RegEvent, this);
this.width += this.monitorPanel.EXPANDED_WIDTH;
this.setSize(this.width);
this.div.classList.add("previewplayer-lv_door_view_panel")
},
CheckDoorStatus: function(b, d, a) {
var c = _S("addonsService").serviceInfo[SYNO.SS.Service.ACSCTRL].blEnabled;
if ((a === this.owner.dsId) && (false === c)) {
this.findWindow().close()
}
},
RegEvent: function() {
this.mon(this.monitorPanel, "resize", this.ResizeDoorPlugin, this)
},
ResizeDoorPlugin: function() {
if ((SYNO.SS.App.WebPlayer.Def.PreviewMode.Door === this.mode) || (SYNO.SS.App.WebPlayer.Def.PreviewMode.Intercom === this.mode)) {
var a;
if (true === this.monitorPanel.blExpanded) {
a = this.monitorPanel.EXPANDED_WIDTH
} else {
a = this.monitorPanel.CONSTRICT_WIDTH
}
if ((false === Ext.isEmpty(this.monitorPanel.chnRect)) && (a === this.monitorPanel.chnRect.w)) {
return
}
if (false === this.findAppWindow().IsMaximized()) {
this.width = this.viewWidth + a
}
this.monitorPanel.SetChannelRect({
x: this.width - a,
y: 0,
w: a,
h: this.viewHeight
});
this.setSize(this.width);
this.fireEvent("resizeDoorPlugin", this.width, this.height)
}
},
ResizePlayer: function(d, b) {
if ((SYNO.SS.App.WebPlayer.Def.PreviewMode.Door === this.mode) || (SYNO.SS.App.WebPlayer.Def.PreviewMode.Intercom === this.mode)) {
var c = this.monitorPanel.chnRect.w;
this.viewWidth = d - c;
this.viewHeight = b;
this.width = d;
this.height = b;
this.monitorPanel.SetChannelRect({
x: this.viewWidth,
y: 0,
w: c,
h: this.viewHeight
})
} else {
if ((SYNO.SS.App.WebPlayer.Def.PreviewMode.Liveview === this.mode) || (SYNO.SS.App.WebPlayer.Def.PreviewMode.Patrol === this.mode) || (SYNO.SS.App.WebPlayer.Def.PreviewMode.ALERT === this.mode) || (SYNO.SS.App.WebPlayer.Def.PreviewMode.IOModule_ALERT === this.mode) || (SYNO.SS.App.WebPlayer.Def.PreviewMode.POS === this.mode) || (SYNO.SS.App.WebPlayer.Def.PreviewMode.POS_ALERT === this.mode)) {
this.viewWidth = d;
this.viewHeight = b
}
}
if (null !== this.div) {
this.div.style.width = this.viewWidth + "px";
this.div.style.height = this.viewHeight + "px"
}
if (true === this.IsPluginEnable()) {
this.player.SetSize(this.viewWidth, this.viewHeight);
var a = function() {
if (this.player && this.player.dom) {
this.player.dom.width = this.viewWidth;
this.player.dom.height = this.viewHeight;
this.player.SetVisible(true)
}
};
a.defer(100, this)
}
},
UpdateFakePlayerRect: function() {
if (null === this.fakePlayer) {
return
}
this.fakePlayer.setPosition(this.voRect.left, this.voRect.top);
this.fakePlayer.setSize(this.voRect.width, this.voRect.height)
},
UpdateVideoBgColor: function() {
var a = SYNO.SDS.UserSettings.getProperty("Desktop", "videoBgColor");
this.player.SetAttr(ATTR_VIDEO_BG_COLOR, a)
},
UpdateVideoScaleMethod: function() {
var a = SYNO.SDS.UserSettings.getProperty("Desktop", "useFFmpegScale") || false;
this.player.SetAttr(ATTR_USE_FFMPEG_SCALE, a)
},
IsPluginEnable: function() {
return ((null !== this.player) && (true === this.player.IsReady()))
}
});
Ext.namespace("SYNO.SS.App.WebPlayer");
Ext.define("SYNO.SS.App.WebPlayer.EventDetectionContainer", {
extend: "Ext.Container",
BAR_WIDTH: 33,
levelBar: null,
levelValue: null,
levelMask: null,
panelPlayer: null,
cellArray: null,
detectAreaBorderCanvas: null,
camData: null,
wsHandler: null,
mode: 0,
camStatus: 0,
appIdx: -1,
blVideoInited: false,
Show: Ext.emptyFn,
Stop: Ext.emptyFn,
OnBeforeDestroy: Ext.emptyFn,
OnDestroy: Ext.emptyFn,
IsPluginEnable: Ext.emptyFn,
StartDetect: Ext.emptyFn,
constructor: function(a) {
this.Init(a);
Ext.applyIf(a, {
layout: "column",
items: [this.levelBar, this.panelPlayer],
listeners: {
afterlayout: function(b) {
if (SYNO.SS.App.WebPlayer.Def.PreviewMode.APP === this.mode) {
this.detAreaCanvas = this.panelPlayer.panelEventDetect.el.dom.querySelector("canvas")
}
if (SYNO.SS.App.WebPlayer.Def.PreviewMode.MD === this.mode) {
this.detectAreaBorderCanvas = this.panelPlayer.panelEventDetectBorder.el.dom.querySelector("canvas")
}
this.DrawLevelBar(0, false)
},
beforedestroy: function() {
this.DestroyWSHandler()
},
scope: this
}
});
this.callParent([a]);
this.mon(SYNO.SS.GblStore.dsCamera, "storeupdate", this.OnCameraUpdate, this);
this.mon(SYNO.SS.GblStore.dsSlaveDS, "storeupdate", this.OnSlaveDSUpdate, this);
this.panelPlayer.panelVideo.mon(this.panelPlayer.panelVideo, "videoinited", this.OnVideoInited, this);
this.InitWSHandler()
},
Init: function(b) {
var c, a;
this.camData = b.camData;
this.mode = b.mode;
this.camStatus = this.camData.camStatus;
if (true === SYNO.SDS.Utils.IsInteger(b.appIdx)) {
this.appIdx = b.appIdx
}
this.panelPlayer = new SYNO.SS.App.WebPlayer.Html5PlayerPanel({
viewType: SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.BASEVIEW,
columnWidth: 1,
height: b.height,
blShowCamInfoLabel: false,
blSupportAudio: false,
blSuspendMouseEvent: true,
blFixAspectRatio: true,
camIdOnHost: this.camData.id
});
this.levelValue = new Ext.Component({
cls: "ss-event-detection-value"
});
this.levelMask = new Ext.Component({
cls: "ss-event-detection-mask"
});
this.levelBar = new Ext.Container({
width: this.BAR_WIDTH,
height: b.height,
cls: "ss-event-detection-bar",
items: [this.levelValue, this.levelMask]
});
this.cellArray = new Array(SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM);
for (c = 0; c < SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM; c++) {
this.cellArray[c] = [];
for (a = 0; a < SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM; a++) {
this.cellArray[c].push(false)
}
}
},
DrawDetectInfo: function(a) {
var c = 0;
var b = false;
if ((true === Ext.isArray(a)) && (a[0])) {
c = a[0].score;
b = a[0].blTrig
}
this.DrawLevelBar(c, b);
this.panelPlayer.acapHandler.DrawAcapDetArea(a)
},
DrawLevelBar: function(c, a) {
var b = (a) ? "var(--ss-color-red-tier1)" : "var(--ss-color-blue-tier1)";
this.levelMask.getEl().setStyle("height", (100 - c) + "%");
this.levelValue.getEl().setStyle("background-image", String.format("linear-gradient(to bottom, {0} 50%, transparent 50%)", b))
},
OnWSMessage: function(a) {
var c = new Uint8Array(a.data);
var d = JSON.parse(String.fromCharCode.apply(null, c));
var b = d.acapInfo || d.evtDetectInfo;
this.DrawDetectInfo(b.detectInfo)
},
OnWSClose: function(a) {
this.DrawDetectInfo([{
score: 0,
blTrig: false
}]);
this.wsHandler.Retry(2000)
},
InitWSHandler: function() {
var c;
var b = SYNO.SS.GblStore.dsCamera.getById(this.camData.id);
var a;
if (this.wsHandler) {
return
}
if (!b) {
return
} else {
if (false === SYNO.SS.Utils.IsCamOnlineSts(b.get("camStatus"))) {
return
}
}
a = (LOCAL_DS_ID === b.get("ownerDsId")) ? b.get("id") : b.get("camIdOnRecServer");
c = {
dsId: b.get("ownerDsId"),
param: {
method: "AlertStream",
mode: this.GetAlertStreamType(),
appIdx: this.appIdx,
camIdList: [a]
}
};
c.fnOnWSMessage = this.OnWSMessage.createDelegate(this);
c.fnOnWSClose = this.OnWSClose.createDelegate(this);
this.wsHandler = new SYNO.SS.App.WebPlayer.WSStreamHandler(c)
},
DestroyWSHandler: function() {
this.DrawDetectInfo([{
score: 0,
blTrig: false
}]);
if (this.wsHandler) {
this.wsHandler.Destroy();
this.wsHandler = null
}
},
OnCameraUpdate: function(c, b) {
var a = -1;
if ((c) && (0 < c.cameras.length)) {
a = c.cameras.findExact("id", this.camData.id);
if (-1 !== a) {
this.CheckCamStatusChanged(c.cameras[a])
}
} else {
if (b) {
a = b.findExact("id", this.camData.id);
if (-1 !== a) {
this.OnCamStatusChanged(SYNO.SS.CamSts.DELETED)
}
}
}
},
OnSlaveDSUpdate: function(c, b) {
var a = this.camData.ownerDsId;
if (LOCAL_DS_ID === a) {
return
}
if (true === SYNO.SS.Utils.IsSlaveDsOnline(a)) {
this.InitWSHandler()
} else {
this.DestroyWSHandler()
}
},
CheckCamStatusChanged: function(a) {
if (a.camStatus !== this.camStatus) {
this.camStatus = a.camStatus;
this.OnCamStatusChanged(this.camStatus)
}
},
OnCamStatusChanged: function(a) {
if (true === SYNO.SS.Utils.IsCamOnlineSts(a)) {
this.InitWSHandler()
} else {
this.DestroyWSHandler()
}
},
GetAlertStreamType: function() {
var a = SYNO.SS.App.WebPlayer.Def.AlertStreamType.UNKNOWN;
switch (this.mode) {
case SYNO.SS.App.WebPlayer.Def.PreviewMode.APP:
a = SYNO.SS.App.WebPlayer.Def.AlertStreamType.APP;
break;
case SYNO.SS.App.WebPlayer.Def.PreviewMode.MD:
a = SYNO.SS.App.WebPlayer.Def.AlertStreamType.MD;
break;
case SYNO.SS.App.WebPlayer.Def.PreviewMode.AD:
a = SYNO.SS.App.WebPlayer.Def.AlertStreamType.AD;
break;
case SYNO.SS.App.WebPlayer.Def.PreviewMode.TD:
a = SYNO.SS.App.WebPlayer.Def.AlertStreamType.TD;
break;
case SYNO.SS.App.WebPlayer.Def.PreviewMode.PD:
a = SYNO.SS.App.WebPlayer.Def.AlertStreamType.PD;
break
}
return a
},
UpdateDetectAreaBorder: function() {
if (true === this.blVideoInited) {
this.SetCellArray();
this.DrawDetectAreaBorder()
}
},
SetCellArray: function() {
var b, a;
for (b = 0; b < SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM; b++) {
for (a = 0; a < SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM; a++) {
this.cellArray[a][b] = ("1" === this.camData.MDParam.region.charAt(b * SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM + a))
}
}
},
DrawDetectAreaBorder: function() {
var a;
if (this.detectAreaBorderCanvas) {
a = this.detectAreaBorderCanvas.getContext("2d");
a.clearRect(0, 0, this.detectAreaBorderCanvas.offsetWidth, this.detectAreaBorderCanvas.offsetHeight);
a.globalAlpha = 0.2;
a.lineWidth = 1;
this.DrawInnerBorder(a);
this.DrawOuterBorder(a)
}
},
DrawInnerBorder: function(a) {
var f, d, c, b, g, e;
a.strokeStyle = "white";
a.beginPath();
for (f = 0; f < SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM; f++) {
c = Math.floor((this.detectAreaBorderCanvas.offsetWidth - (SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM + 1)) * f / SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM) + f + 1;
b = Math.floor((this.detectAreaBorderCanvas.offsetWidth - (SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM + 1)) * (f + 1) / SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM) + f + 1;
for (d = 0; d < SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM; d++) {
if (false === this.cellArray[f][d]) {
continue
}
g = Math.floor((this.detectAreaBorderCanvas.offsetHeight - (SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM + 1)) * d / SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM) + d + 1;
e = Math.floor((this.detectAreaBorderCanvas.offsetHeight - (SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM + 1)) * (d + 1) / SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM) + d + 1;
if ((0 === f) || ((0 < f) && (false === this.cellArray[f - 1][d]))) {
a.moveTo(c + 0.5, g - 0.5);
a.lineTo(c + 0.5, e + 0.5)
}
if ((0 === d) || ((0 < d) && (false === this.cellArray[f][d - 1]))) {
a.moveTo(c - 0.5, g + 0.5);
a.lineTo(b + 0.5, g + 0.5)
}
if (((SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM - 1) === f) || (((SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM - 1) > f)) && (false === this.cellArray[f + 1][d])) {
a.moveTo(b - 0.5, g - 0.5);
a.lineTo(b - 0.5, e + 0.5)
}
if (((SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM - 1) === d) || (((SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM - 1) > d)) && (false === this.cellArray[f][d + 1])) {
a.moveTo(c - 0.5, e - 0.5);
a.lineTo(b + 0.5, e - 0.5)
}
}
}
a.stroke();
a.closePath()
},
DrawOuterBorder: function(a) {
var f, d, c, b, g, e;
a.strokeStyle = "black";
a.beginPath();
for (f = 0; f < SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM; f++) {
c = Math.floor((this.detectAreaBorderCanvas.offsetWidth - (SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM + 1)) * f / SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM) + f + 1;
b = Math.floor((this.detectAreaBorderCanvas.offsetWidth - (SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM + 1)) * (f + 1) / SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM) + f + 1;
for (d = 0; d < SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM; d++) {
if (false === this.cellArray[f][d]) {
continue
}
g = Math.floor((this.detectAreaBorderCanvas.offsetHeight - (SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM + 1)) * d / SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM) + d + 1;
e = Math.floor((this.detectAreaBorderCanvas.offsetHeight - (SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM + 1)) * (d + 1) / SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM) + d + 1;
if ((0 === f) || ((0 < f) && (false === this.cellArray[f - 1][d]))) {
a.moveTo(c - 0.5, g - 0.5);
a.lineTo(c - 0.5, e + 0.5)
}
if ((0 === d) || ((0 < d) && (false === this.cellArray[f][d - 1]))) {
a.moveTo(c - 0.5, g - 0.5);
a.lineTo(b + 0.5, g - 0.5)
}
if (((SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM - 1) === f) || (((SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM - 1) > f)) && (false === this.cellArray[f + 1][d])) {
a.moveTo(b + 0.5, g - 0.5);
a.lineTo(b + 0.5, e + 0.5)
}
if (((SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM - 1) === d) || (((SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM - 1) > d)) && (false === this.cellArray[f][d + 1])) {
a.moveTo(c - 0.5, e + 0.5);
a.lineTo(b + 0.5, e + 0.5)
}
}
}
a.stroke();
a.closePath()
},
OnVideoInited: function() {
this.blVideoInited = true;
this.UpdateDetectAreaBorder()
}
});
Ext.namespace("SYNO.SS.App.WebPlayer");
Ext.define("SYNO.SS.App.WebPlayer.MotionAreaContainer", {
extend: "Ext.Container",
BORDER_COLOR: "#A8ABAD",
INNER_COLOR: "#2DA3FF",
INNER_BORDER_COLER: "#E6C52A",
panelPlayer: null,
camData: null,
detectAreaCanvas: null,
detectAreaBorderCanvas: null,
dragAreaCanvas: null,
player: null,
cellArray: null,
panelDragArea: null,
startX: 0,
startY: 0,
currentX: 0,
currentY: 0,
modifyOper: 0,
OnEdit: Ext.emptyFn,
SetDetectionType: Ext.emptyFn,
SetSearchAreaType: Ext.emptyFn,
constructor: function(a) {
this.modifyOper = SYNO.SS.App.SmartSearch.Def.ZONE_OP_ADD;
this.Init(a);
Ext.applyIf(a, {
items: [this.panelPlayer],
listeners: {
afterlayout: function(b) {
var c = new SYNO.SS.App.WebPlayer.DragTracker({
autoStart: true,
onBeforeEnd: function(d) {
return (true === this.IsLeftMouseBtn(d))
},
listeners: {
mousedown: this.OnMouseDown,
mouseup: this.OnMouseUp,
drag: this.OnDrag,
scope: this
}
});
this.detectAreaCanvas = this.panelPlayer.panelEventDetect.el.dom.querySelector("canvas");
this.detectAreaBorderCanvas = this.panelPlayer.panelEventDetectBorder.el.dom.querySelector("canvas");
this.dragAreaCanvas = this.panelDragArea.el.dom.querySelector("canvas");
c.initEl(this.panelDragArea.el)
},
scope: this
}
});
this.callParent([a]);
this.player = this;
this.panelPlayer.panelVideo.mon(this.panelPlayer.panelVideo, "videoinited", this.OnVideoInited, this)
},
Init: function(b) {
var c, a;
this.camData = b.camData;
this.panelPlayer = new SYNO.SS.App.WebPlayer.Html5PlayerPanel({
viewType: SYNO.SS.App.WebPlayer.OsdPanelUtils.VIEW_TYPE.BASEVIEW,
width: b.width,
height: b.height,
blShowCamInfoLabel: false,
blSupportAudio: false,
blSuspendMouseEvent: true,
blFixAspectRatio: true,
camIdOnHost: this.camData.id
});
this.panelDragArea = new Ext.Container({
width: b.width,
height: b.height,
style: "position: absolute; top: 0;",
html: '<canvas width="' + b.width + '" height="' + b.height + '"></canvas>'
});
this.panelPlayer.panelVideo.add(this.panelDragArea);
this.cellArray = new Array(SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM);
for (c = 0; c < SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM; c++) {
this.cellArray[c] = [];
for (a = 0; a < SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM; a++) {
this.cellArray[c].push(false)
}
}
this.SetCellArray()
},
SetCellArray: function(b) {
var d, c, a, h, g, f, e;
if (undefined === b) {
for (d = 0; d < SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM; d++) {
for (c = 0; c < SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM; c++) {
this.cellArray[c][d] = ("1" === this.camData.MDParam.region.charAt(d * SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM + c))
}
}
} else {
switch (b) {
case SYNO.SS.App.SmartSearch.Def.ZONE_OP_ADD:
case SYNO.SS.App.SmartSearch.Def.ZONE_OP_REMOVE:
e = (SYNO.SS.App.SmartSearch.Def.ZONE_OP_ADD === b);
if (this.currentX < this.startX) {
a = this.currentX;
g = this.startX
} else {
a = this.startX;
g = this.currentX
}
if (this.currentY < this.startY) {
h = this.currentY;
f = this.startY
} else {
h = this.startY;
f = this.currentY
}
break;
case SYNO.SS.App.SmartSearch.Def.ZONE_OP_CLEAR_ALL:
case SYNO.SS.App.SmartSearch.Def.ZONE_OP_SELECT_ALL:
e = (SYNO.SS.App.SmartSearch.Def.ZONE_OP_SELECT_ALL === b) ? true : false;
a = 0;
h = 0;
g = SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM - 1;
f = SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM - 1;
break
}
for (d = h; d <= f; d++) {
for (c = a; c <= g; c++) {
this.cellArray[c][d] = e
}
}
}
},
DrawDetectArea: function() {
var e, d, b, a, k, g, c, h, l, f;
if ((this.detectAreaCanvas) && (this.detectAreaBorderCanvas)) {
c = this.detectAreaCanvas.getContext("2d");
c.clearRect(0, 0, this.detectAreaCanvas.offsetWidth, this.detectAreaCanvas.offsetHeight);
c.strokeStyle = this.INNER_COLOR;
c.fillStyle = this.INNER_COLOR;
c.globalAlpha = 0.3;
c.beginPath();
h = this.detectAreaBorderCanvas.getContext("2d");
h.clearRect(0, 0, this.detectAreaBorderCanvas.offsetWidth, this.detectAreaBorderCanvas.offsetHeight);
h.strokeStyle = this.INNER_BORDER_COLER;
h.globalAlpha = 1;
h.lineWidth = 2;
h.beginPath();
for (e = 0; e < SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM; e++) {
l = (SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM - 1 === e);
b = Math.floor((this.detectAreaCanvas.offsetWidth - (SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM + 1)) * e / SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM) + e + 1;
a = Math.floor((this.detectAreaCanvas.offsetWidth - (SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM + 1)) * (e + 1) / SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM) + e + 1;
for (d = 0; d < SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM; d++) {
f = (SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM - 1 === d);
k = Math.floor((this.detectAreaCanvas.offsetHeight - (SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM + 1)) * d / SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM) + d + 1;
g = Math.floor((this.detectAreaCanvas.offsetHeight - (SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM + 1)) * (d + 1) / SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM) + d + 1;
if (false === l) {
c.moveTo(a + 0.5, k);
c.lineTo(a + 0.5, g);
if (this.cellArray[e][d] !== this.cellArray[e + 1][d]) {
h.moveTo(a, k - 1);
h.lineTo(a, g + 1)
}
}
if (false === f) {
c.moveTo(b, g + 0.5);
c.lineTo(a, g + 0.5);
if (this.cellArray[e][d] !== this.cellArray[e][d + 1]) {
h.moveTo(b - 1, g);
h.lineTo(a + 1, g)
}
}
if ((false === l) && (false === f)) {
c.moveTo(a + 0.5, g);
c.lineTo(a + 0.5, g + 1)
}
if (true === this.cellArray[e][d]) {
c.fillRect(b, k, a - b, g - k);
if (0 === e) {
h.moveTo(b, k - 1);
h.lineTo(b, g + 1)
}
if (0 === d) {
h.moveTo(b - 1, k);
h.lineTo(a + 1, k)
}
if ((SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM - 1) === e) {
h.moveTo(a, k - 1);
h.lineTo(a, g + 1)
}
if ((SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM - 1) === d) {
h.moveTo(b - 1, g);
h.lineTo(a + 1, g)
}
}
}
}
c.stroke();
c.closePath();
h.stroke();
h.closePath();
c.globalAlpha = 1;
c.strokeStyle = this.BORDER_COLOR;
c.beginPath();
c.rect(0, 0, this.detectAreaCanvas.offsetWidth, this.detectAreaCanvas.offsetHeight);
c.stroke();
c.closePath()
}
},
OnMouseDown: function(d, c) {
var a;
var b = this.panelPlayer.panelVideo.getBox();
if (false === d.IsLeftMouseBtn(c)) {
return false
}
a = this.GetPointedCellIndex(c.xy[0] - b.x, c.xy[1] - b.y);
this.startX = a[0];
this.startY = a[1];
this.currentX = a[0];
this.currentY = a[1];
this.DrawSelectedArea()
},
OnMouseUp: function(b, a) {
if (false === b.IsLeftMouseBtn(a)) {
return
}
this.ClearSelectedArea();
this.SetCellArray(this.modifyOper);
this.DrawDetectArea()
},
OnDrag: function(d, c) {
var a, b;
if (false === d.IsLeftMouseBtn(c)) {
return
}
b = this.panelPlayer.panelVideo.getBox();
a = this.GetPointedCellIndex(c.xy[0] - b.x, c.xy[1] - b.y);
this.currentX = a[0];
this.currentY = a[1];
this.DrawSelectedArea()
},
DrawSelectedArea: function() {
var d, c, f, e, b, a, h, g, i;
if (this.dragAreaCanvas) {
if (this.currentX < this.startX) {
d = this.currentX;
f = this.startX
} else {
d = this.startX;
f = this.currentX
}
if (this.currentY < this.startY) {
c = this.currentY;
e = this.startY
} else {
c = this.startY;
e = this.currentY
}
b = Math.floor((this.detectAreaCanvas.offsetWidth - (SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM + 1)) * d / SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM) + d;
h = Math.floor((this.detectAreaCanvas.offsetHeight - (SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM + 1)) * c / SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM) + c;
a = Math.floor((this.detectAreaCanvas.offsetWidth - (SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM + 1)) * (f + 1) / SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM) + f + 1;
g = Math.floor((this.detectAreaCanvas.offsetHeight - (SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM + 1)) * (e + 1) / SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM) + e + 1;
i = this.dragAreaCanvas.getContext("2d");
i.clearRect(0, 0, this.detectAreaCanvas.offsetWidth, this.detectAreaCanvas.offsetHeight);
i.strokeStyle = this.INNER_COLOR;
i.lineWidth = 3;
i.beginPath();
i.rect(b, h, a - b + 1, g - h + 1);
i.stroke()
}
},
ClearSelectedArea: function() {
var a;
if (this.dragAreaCanvas) {
a = this.dragAreaCanvas.getContext("2d");
a.clearRect(0, 0, this.detectAreaCanvas.offsetWidth, this.detectAreaCanvas.offsetHeight)
}
},
GetPointedCellIndex: function(d, b) {
var a, c;
a = Math.floor(d * SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM / this.detectAreaCanvas.offsetWidth);
c = Math.floor(b * SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM / this.detectAreaCanvas.offsetHeight);
if (SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM <= a) {
a = SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM - 1
}
if (SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM <= c) {
c = SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM - 1
}
if (0 > a) {
a = 0
}
if (0 > c) {
c = 0
}
return [a, c]
},
SetZoneOperation: function(a) {
if ((SYNO.SS.App.SmartSearch.Def.ZONE_OP_CLEAR_ALL === a) || (SYNO.SS.App.SmartSearch.Def.ZONE_OP_SELECT_ALL === a)) {
this.SetCellArray(a);
this.DrawDetectArea()
} else {
this.modifyOper = a
}
},
IsZoneSet: function() {
var b, a;
for (b = 0; b < SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM; b++) {
for (a = 0; a < SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM; a++) {
if (true === this.cellArray[b][a]) {
return true
}
}
}
return false
},
GetArrayZoneString: function(d, a) {
var c, b, e = "";
for (c = 0; c < SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_Y_TOTAL_NUM; c++) {
for (b = 0; b < SYNO.SS.App.WebPlayer.Def.DetectArea.BOX_X_TOTAL_NUM; b++) {
e += (true === this.cellArray[b][c]) ? "1" : "0"
}
}
return e
},
SetAnalyticsRegion: function(a) {
this.camData.MDParam.region = a;
this.SetCellArray();
this.DrawDetectArea()
},
OnVideoInited: function() {
this.DrawDetectArea();
if (this.dragAreaCanvas) {
this.dragAreaCanvas.width = this.detectAreaCanvas.offsetWidth;
this.dragAreaCanvas.height = this.detectAreaCanvas.offsetHeight
}
}
});
Ext.define("SYNO.SS.App.WebPlayer.AudioOutContainer", {
extend: "Ext.Container",
VOLUME_MIN: 0,
VOLUME_MAX: 100,
audioOut: null,
taskVolumePolling: null,
owner: null,
dsId: LOCAL_DS_ID,
camId: null,
camIdOnRec: null,
speakerId: null,
groupId: null,
devInfo: null,
blTalking: false,
sliderFillId: null,
progressVolume: null,
constructor: function(a) {
this.owner = a.owner;
this.sliderFillId = Ext.id();
this.Init();
Ext.apply(a, {
style: a.style,
layout: "vbox",
layoutConfig: {
pack: "end"
},
items: this.progressVolume,
hidden: true,
listeners: {
beforedestroy: this.OnBeforeDestroy,
scope: this
}
});
this.callParent([a]);
this.mon(SYNO.SS.GblStore.dsSlaveDS, "storeupdate", this.OnSlaveDSUpdate, this);
this.mon(SYNO.SS.GblStore.dsIPSpeaker, "storeupdate", this.OnIPSpeakerUpdate, this);
this.mon(SYNO.SDS.StatusNotifier, "LaunchSpeaker", SYNO.SS.App.IPSpeaker.Utils.LaunchSpeaker, this)
},
OnBeforeDestroy: function() {
if (true === this.blTalking) {
this.StopTalking()
}
this.devInfo = null;
this.owner = null;
this.audioOut = null;
this.progressVolume = null
},
InitDevInfo: function(a) {
this.dsId = a.dsId;
this.camId = a.camId;
this.camIdOnRec = a.camIdOnRec;
this.speakerId = a.speakerId;
this.itemType = a.itemType;
this.groupId = a.groupId
},
Init: function() {
this.InitAudioOut();
this.InitPanelVolume();
this.blTalking = false
},
InitAudioOut: function() {
if (this.audioOut) {
return
}
this.audioOut = new SYNO.SS.App.WebPlayer.Html5AudioOut()
},
InitPanelVolume: function() {
this.taskVolumePolling = {
run: this.UpdateVolume,
interval: 100,
scope: this
};
this.progressVolume = new SYNO.ux.Slider({
vertical: true,
cls: "ao_volume_bar",
height: 79,
width: 22,
value: 0,
animate: false,
minValue: this.VOLUME_MIN,
maxValue: this.VOLUME_MAX,
disabled: false,
listeners: {
afterrender: this.AppendInner,
scope: this
}
})
},
AppendInner: function() {
if ((true === Ext.isEmpty(this.sliderInner)) && (false === Ext.isEmpty(this.progressVolume)) && (true === Ext.isDefined(this.progressVolume.getEl()))) {
this.sliderInner = Ext.get(Ext.DomQuery.select(".x-slider-inner", this.progressVolume.getEl().dom)[0]);
Ext.DomHelper.append(this.sliderInner, {
tag: "div",
id: this.sliderFillId,
cls: "volume_track_fill",
style: "height: 0%; bottom: 0px;"
})
}
},
PreOnTalk: function() {
if (false === this.audioOut.IsMicExist()) {
this.Alert(SYNO.SS.Utils.GetMicUnavailableHintText());
this.UpdateOsdBtnStatus();
return
}
if (false === this.blTalking) {
this.owner.player.OnDeactivatePlay(this.OnDeactivatePlayDone, this)
} else {
this.StopTalking()
}
},
GetOutputDevice: function() {
var a = SYNO.SS.Utils.GetAODevType({
itemType: this.itemType,
dsId: this.dsId,
camId: this.camId,
camIdOnRec: this.camIdOnRec,
itemId: (ITEM_TYPE_IPSPEAKER === this.itemType ? this.speakerId : this.groupId)
}, SYNO.SS.App.IPSpeaker.Def.PairedSpeakerType.EXISTED);
if (true === Ext.isDefined(a.devIdOnRec)) {
a.devId = a.devIdOnRec
}
return a
},
OnDeactivatePlayDone: function(b) {
var a;
if (true === b) {
a = this.GetOutputDevice();
this.IsOccupied(a, this.StartTalking.createDelegate(this), this.UpdateOsdBtnStatus.createDelegate(this))
} else {
this.Alert(_T("common", "error_system"))
}
},
IsOccupied: function(b, a, c) {
this.blTalking = true;
this.sendWebAPI({
api: "SYNO.SurveillanceStation.AudioOut",
method: "CheckOccupied",
version: 2,
dsId: b.dsId,
params: {
devType: b.devType,
devId: b.devId
},
callback: function(g, e, f, d) {
if (g) {
if (true === e.isOccupied) {
this.blTalking = false;
this.Alert(_T("audio_output", "occupied"));
c()
} else {
a(b)
}
} else {
this.blTalking = false;
if (SS_WEBAPI_ERR_CAM_DISABLED === e.code) {
b = Ext.apply(b, {
SourceLinkPrefix: this.owner.id,
groupId: this.groupId
});
this.Alert(SYNO.SS.Utils.GetAOOutErrStr(this.itemType, b));
SYNO.SS.App.IPSpeaker.Utils.SetupLink(this.itemType, b, "LaunchSpeaker")
} else {
this.Alert(SYNO.API.getErrorString(e.code))
}
c()
}
},
scope: this
})
},
GetGroupLeaderSpeaker: function(c) {
var b;
var d = SYNO.SS.GblStore.dsIPSpeakerGrp.getById(c);
if (true === Ext.isDefined(d)) {
var a = d.get("grpIpSpeakers");
if (true === Ext.isArray(a)) {
Ext.each(a, function(e) {
if (SYNO.SS.App.IPSpeaker.Def.Group.Role.Leader === e.role) {
b = e;
return false
}
}, this)
}
}
return b
},
StartTalking: function(a) {
this.blTalking = true;
this.devInfo = a;
this.audioOut.Start({
dsId: a.dsId,
type: a.devType,
id: a.devId,
idOnRec: a.devId
});
Ext.TaskMgr.start(this.taskVolumePolling);
this.UpdateOsdBtnStatus();
if (true === this.owner.IsBtnVisible(this.owner.OSD_UTILS.Button.BTN_AUDIO_OUT)) {
this.show();
this.owner.SetPanelAudioOutPos()
} else {
this.hide()
}
},
OnIPSpeakerUpdate: function(d, c) {
var a = -1;
var b = null;
if (true !== this.blTalking) {
return
}
if ((d) && (0 < d.ipSpeakers.length)) {
a = d.ipSpeakers.findExact("id", SYNO.SS.GblStore.GetSpeakerIdOnHost(this.devInfo.dsId, this.devInfo.devId));
if (-1 !== a) {
b = d.ipSpeakers[a];
this.OnSpeakerStatusChanged(b.status)
}
} else {
if (c) {
a = c.findExact("id", SYNO.SS.GblStore.GetSpeakerIdOnHost(this.devInfo.dsId, this.devInfo.devId));
if (-1 !== a) {
this.OnSpeakerStatusChanged(SYNO.SS.IPSpeakerDev.Status.UNRECOGNIZED)
}
}
}
},
OnSpeakerStatusChanged: function(b) {
var d = SYNO.SS.GblStore.dsIPSpeaker.getById(SYNO.SS.GblStore.GetSpeakerIdOnHost(this.devInfo.dsId, this.devInfo.devId));
var c;
var a;
if (!d) {
b = SYNO.SS.IPSpeakerDev.Status.UNRECOGNIZED;
a = SYNO.SS.CamStsFlag.NONE
} else {
a = d.get("statusFlags")
}
c = SYNO.SS.App.IPSpeaker.Utils.SpeakerStatusToDeviceStatus(b);
if ((false === SYNO.SS.Utils.IsCamOnlineSts(c)) || (true === SYNO.SS.IPSpeakerStsFlag.IsTransientSts(a))) {
if (true === this.IsPairedWithSpeaker()) {
this.Alert(SYNO.SS.Utils.GetAOOutErrStr(this.itemType, this.devInfo));
SYNO.SS.App.IPSpeaker.Utils.SetupLink(this.itemType, this.devInfo, "LaunchSpeaker")
}
this.StopTalking()
}
},
OnSlaveDSUpdate: function(b, a) {
if ((!this.devInfo) || (LOCAL_DS_ID === this.devInfo.dsId) || (true !== this.blTalking)) {
return
}
if (true === SYNO.SS.Utils.IsSlaveDsOnline(this.devInfo.dsId)) {
return
}
this.OnSpeakerStatusChanged(SYNO.SS.IPSpeakerDev.Status.SERVER_DISCONN)
},
IsPairedWithSpeaker: function() {
return ((ITEM_TYPE_IPSPEAKER !== this.itemType) && (ITEM_TYPE_IPSPEAKERGRP !== this.itemType)) && (DEVICE_IPSPEAKER === this.devInfo.devType)
},
StopTalking: function() {
this.blTalking = false;
Ext.TaskMgr.stop(this.taskVolumePolling);
this.audioOut.Stop();
this.hide();
this.UpdateOsdBtnStatus()
},
UpdateVolume: function() {
var b = this.audioOut.GetVolume();
if (-1 === b) {
return
}
if (false == this.audioOut.IsMicExist()) {
this.Alert(_T("audio_output", "check_mic_plug_correct"));
this.StopTalking();
return
}
var a = Ext.get(this.sliderFillId);
if (a) {
a.setStyle("height", b + "%")
}
this.owner.player.OnUpdateAudioOutVolume(b)
},
UpdateOsdBtnStatus: function() {
this.owner.SetAudioOutBtnToggle(this.blTalking);
if (this.owner.player) {
this.owner.player.OnSwitchTalking(this.blTalking)
}
},
OnBtnSizeChange: function(a) {
var b = this.getEl();
if (b) {
b.setStyle("bottom", String.format("{0}px", a + this.owner.PADDING_BOTTOM_PX))
}
this.owner.SetPanelAudioOutPos()
},
Alert: function(a) {
SYNO.SS.Utils.ExitLiveviewFullscreen();
this.findWindow().getMsgBox().alert(_T("audio_output", "bi_direction_audio"), a)
}
});
@changtimwu
Copy link
Author

changtimwu commented Dec 5, 2022 •
edited
Loading

截圖 2022-12-05 下午3 03 48

截圖 2022-12-05 下午3 05 17

截圖 2022-12-05 下午3 07 52

@changtimwu
Copy link
Author 

render_id: 159
player_id: 3
created: 2022-12-05 08:36:47.676 UTC
origin_url: http://172.17.34.168:5000/
kFrameUrl: http://172.17.34.168:5000/webman/3rdparty/SurveillanceStation/
kFrameTitle: Synology Surveillance Station - Matt_DS1515
url: blob:http://172.17.34.168:5000/669856d9-e88c-40d5-8f09-9381710bda4f
kTextTracks: 
info: Effective playback rate changed from 0 to 1
kRendererName: RendererImpl
pipeline_state: kPlaying
duration: unknown
kAudioTracks: [object Object]
kIsAudioDecryptingDemuxerStream: false
kAudioDecoderName: FFmpegAudioDecoder
kIsPlatformAudioDecoder: false
event: kPlay
pipeline_buffering_state: [object Object]
audio_buffering_state: [object Object]


{
  "properties": {
    "render_id": 159,
    "player_id": 3,
    "created": "2022-12-05 08:36:47.676 UTC",
    "origin_url": "http://172.17.34.168:5000/",
    "kFrameUrl": "http://172.17.34.168:5000/webman/3rdparty/SurveillanceStation/",
    "kFrameTitle": "Synology Surveillance Station - Matt_DS1515",
    "url": "blob:http://172.17.34.168:5000/669856d9-e88c-40d5-8f09-9381710bda4f",
    "kTextTracks": [],
    "info": "Effective playback rate changed from 0 to 1",
    "kRendererName": "RendererImpl",
    "pipeline_state": "kPlaying",
    "duration": "unknown",
    "kAudioTracks": [
      {
        "bytes per channel": 4,
        "bytes per frame": 4,
        "channel layout": "MONO",
        "channels": 1,
        "codec": "mp3",
        "codec delay": 529,
        "discard decoder delay": true,
        "encryption scheme": "Unencrypted",
        "has extra data": false,
        "profile": "unknown",
        "sample format": "Float 32-bit",
        "samples per second": 32000,
        "seek preroll": "0us"
      }
    ],
    "kIsAudioDecryptingDemuxerStream": false,
    "kAudioDecoderName": "FFmpegAudioDecoder",
    "kIsPlatformAudioDecoder": false,
    "event": "kPlay",
    "pipeline_buffering_state": {
      "for_suspended_start": false,
      "state": "BUFFERING_HAVE_ENOUGH"
    },
    "audio_buffering_state": {
      "reason": "DEMUXER_UNDERFLOW",
      "state": "BUFFERING_HAVE_NOTHING"
    }
  },
  "events": [
    {
      "time": 0,
      "key": "created",
      "value": "2022-12-05 08:36:47.676 UTC"
    },
    {
      "time": 0.06599998474121094,
      "key": "origin_url",
      "value": "http://172.17.34.168:5000/"
    },
    {
      "time": 0.069000244140625,
      "key": "kFrameUrl",
      "value": "http://172.17.34.168:5000/webman/3rdparty/SurveillanceStation/"
    },
    {
      "time": 0.0710000991821289,
      "key": "kFrameTitle",
      "value": "Synology Surveillance Station - Matt_DS1515"
    },
    {
      "time": 0.09800004959106445,
      "key": "url",
      "value": "blob:http://172.17.34.168:5000/669856d9-e88c-40d5-8f09-9381710bda4f"
    },
    {
      "time": 0.10000038146972656,
      "key": "kTextTracks",
      "value": []
    },
    {
      "time": 0.10400009155273438,
      "key": "info",
      "value": "ChunkDemuxer"
    },
    {
      "time": 0.10700035095214844,
      "key": "kRendererName",
      "value": "RendererImpl"
    },
    {
      "time": 0.11500024795532227,
      "key": "pipeline_state",
      "value": "kStarting"
    },
    {
      "time": 0.8520002365112305,
      "key": "duration",
      "value": "unknown"
    },
    {
      "time": 1029.076000213623,
      "key": "kAudioTracks",
      "value": [
        {
          "bytes per channel": 4,
          "bytes per frame": 4,
          "channel layout": "MONO",
          "channels": 1,
          "codec": "mp3",
          "codec delay": 529,
          "discard decoder delay": true,
          "encryption scheme": "Unencrypted",
          "has extra data": false,
          "profile": "unknown",
          "sample format": "Float 32-bit",
          "samples per second": 32000,
          "seek preroll": "0us"
        }
      ]
    },
    {
      "time": 1034.6900000572205,
      "key": "kIsAudioDecryptingDemuxerStream",
      "value": false
    },
    {
      "time": 1034.6940002441406,
      "key": "kAudioDecoderName",
      "value": "FFmpegAudioDecoder"
    },
    {
      "time": 1034.6940002441406,
      "key": "kIsPlatformAudioDecoder",
      "value": false
    },
    {
      "time": 1034.7030000686646,
      "key": "info",
      "value": "Selected FFmpegAudioDecoder for audio decoding, config: codec: mp3, profile: unknown, bytes_per_channel: 4, channel_layout: MONO, channels: 1, samples_per_second: 32000, sample_format: Float 32-bit, bytes_per_frame: 4, seek_preroll: 0us, codec_delay: 529, has extra data: false, encryption scheme: Unencrypted, discard decoder delay: true, target_output_channel_layout: STEREO, target_output_sample_format: Unknown sample format, has aac extra data: false"
    },
    {
      "time": 1034.7360000610352,
      "key": "pipeline_state",
      "value": "kPlaying"
    },
    {
      "time": 1355.8600001335144,
      "key": "info",
      "value": "Effective playback rate changed from 0 to 1"
    },
    {
      "time": 1355.9250001907349,
      "key": "event",
      "value": "kPlay"
    },
    {
      "time": 1355.603000164032,
      "key": "pipeline_buffering_state",
      "value": {
        "for_suspended_start": false,
        "state": "BUFFERING_HAVE_ENOUGH"
      }
    },
    {
      "time": 58304.41300010681,
      "key": "audio_buffering_state",
      "value": {
        "reason": "DEMUXER_UNDERFLOW",
        "state": "BUFFERING_HAVE_NOTHING"
      }
    },
    {
      "time": 58553.12900018692,
      "key": "pipeline_buffering_state",
      "value": {
        "for_suspended_start": false,
        "state": "BUFFERING_HAVE_ENOUGH"
      }
    }
  ]
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment