Skip to content

Commit 81099fe

Browse files
ArgoZhangArgoZhang
authored
feat(HikVision): add HikVision component (#775)
* chore: 增加海康威视设备 * chore: 增加海康威视组件 * feat: 增加海康威视摄像头功能 * feat: 增加 HikVision 组件
1 parent 3715d31 commit 81099fe

16 files changed

Lines changed: 550 additions & 0 deletions

‎BootstrapBlazor.Extensions.slnx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,7 @@
4343
<Project Path="src/components/BootstrapBlazor.FontAwesome/BootstrapBlazor.FontAwesome.csproj" />
4444
<Project Path="src/components/BootstrapBlazor.Gantt/BootstrapBlazor.Gantt.csproj" />
4545
<Project Path="src/components/BootstrapBlazor.Graph/BootstrapBlazor.Graph.csproj" />
46+
<Project Path="src/components/BootstrapBlazor.HikVision/BootstrapBlazor.HikVision.csproj" Id="62fa4e31-4a04-4c99-9074-3ea0c037e244" />
4647
<Project Path="src/components/BootstrapBlazor.Holiday/BootstrapBlazor.Holiday.csproj" />
4748
<Project Path="src/components/BootstrapBlazor.Html2Image/BootstrapBlazor.Html2Image.csproj" />
4849
<Project Path="src/components/BootstrapBlazor.Html2Pdf.Playwright/BootstrapBlazor.Html2Pdf.Playwright.csproj" />

‎src/components/BootstrapBlazor.HikVision/BootstrapBlazor.HikVision.csproj‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
<Project Sdk="Microsoft.NET.Sdk.Razor">
2+
3+
<PropertyGroup>
4+
<Version>10.0.0-beta01</Version>
5+
</PropertyGroup>
6+
7+
<PropertyGroup>
8+
<PackageTags>Bootstrap Blazor WebAssembly wasm UI Components Graph</PackageTags>
9+
<Description>Bootstrap UI components extensions of Graph</Description>
10+
</PropertyGroup>
11+
12+
<ItemGroup>
13+
<PackageReference Include="BootstrapBlazor" Version="$(BBVersion)" />
14+
</ItemGroup>
15+
16+
<ItemGroup>
17+
<Using Include="Microsoft.JSInterop" />
18+
</ItemGroup>
19+
20+
</Project>

‎src/components/BootstrapBlazor.HikVision/Component1.razor‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
<div class="my-component">
2+
This component is defined in the <strong>BootstrapBlazor.HikVision</strong> library.
3+
</div>

‎src/components/BootstrapBlazor.HikVision/Component1.razor.css‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
.my-component {
2+
border: 2px dashed red;
3+
padding: 1em;
4+
margin: 1em 0;
5+
background-image: url('background.png');
6+
}

‎src/components/BootstrapBlazor.HikVision/Components/HikVision.razor‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
@namespace BootstrapBlazor.Components
2+
@inherits BootstrapModuleComponentBase
3+
4+
<div @attributes="AdditionalAttributes" class="@ClassString" id="@Id">
5+
<div id="@PreviewId" class="bb-hik-preview" style="width: 500px; height: 300px;"></div>
6+
<div class="bb-hik-controls">
7+
<button class="btn btn-primary bb-hik-login">
8+
<span>登录</span>
9+
</button>
10+
<button class="btn btn-primary bb-hik-logout">
11+
<span>退出</span>
12+
</button>
13+
<button class="btn btn-primary bb-hik-start">
14+
<span>开始预览</span>
15+
</button>
16+
<button class="btn btn-primary bb-hik-stop">
17+
<span>停止预览</span>
18+
</button>
19+
</div>
20+
</div>

‎src/components/BootstrapBlazor.HikVision/Components/HikVision.razor.cs‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
// Copyright (c) BootstrapBlazor & Argo Zhang (argo@live.ca). All rights reserved.
2+
// Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
3+
// Website: https://www.blazor.zone or https://argozhang.github.io/
4+
5+
namespace BootstrapBlazor.Components;
6+
7+
/// <summary>
8+
/// 海康威视网络摄像机组件
9+
/// </summary>
10+
[JSModuleAutoLoader("./_content/BootstrapBlazor.HikVision/Components/HikVision.razor.js")]
11+
public partial class HikVision
12+
{
13+
private string PreviewId => $"{Id}_preview";
14+
15+
private string? ClassString => CssBuilder.Default("bb-hik")
16+
.AddClassFromAttributes(AdditionalAttributes)
17+
.Build();
18+
}

‎src/components/BootstrapBlazor.HikVision/Components/HikVision.razor.js‎

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
import { init as initVision, login, logout, startRealPlay, stopRealPlay, dispose as disposeVision } from '../hikvision.js';
2+
import EventHandler from '../../BootstrapBlazor/modules/event-handler.js';
3+
4+
export async function init(id) {
5+
const el = document.getElementById(id);
6+
if (el === null) {
7+
return;
8+
}
9+
10+
const previewId = `${id}_preview`;
11+
await initVision(previewId);
12+
13+
const controls = el.querySelector('.bb-hik-controls');
14+
if (controls) {
15+
EventHandler.on(controls, 'click', '.bb-hik-login', async e => {
16+
console.log('login');
17+
await login(previewId, '47.121.113.151', 9980, 'admin', 'vhbn8888', 1)
18+
});
19+
EventHandler.on(controls, 'click', '.bb-hik-logout', e => {
20+
console.log('logout');
21+
logout(previewId);
22+
});
23+
EventHandler.on(controls, 'click', '.bb-hik-start', e => {
24+
console.log('start');
25+
startRealPlay(previewId);
26+
});
27+
EventHandler.on(controls, 'click', '.bb-hik-stop', e => {
28+
console.log('stop');
29+
stopRealPlay(previewId);
30+
});
31+
}
32+
}
33+
34+
export function dispose(id) {
35+
const el = document.getElementById(id);
36+
if (el !== null) {
37+
const controls = el.querySelector('.bb-hik-controls');
38+
if (controls) {
39+
EventHandler.off(controls, 'click');
40+
}
41+
}
42+
43+
const previewId = `${id}_preview`;
44+
disposeVision(previewId);
45+
}

‎src/components/BootstrapBlazor.HikVision/Extensions/ServiceCollectionExtensions.cs‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
// Copyright (c) BootstrapBlazor & Argo Zhang (argo@live.ca). All rights reserved.
2+
// Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
3+
// Website: https://www.blazor.zone or https://argozhang.github.io/
4+
5+
using BootstrapBlazor.Components;
6+
using Microsoft.Extensions.DependencyInjection.Extensions;
7+
8+
namespace Microsoft.Extensions.DependencyInjection;
9+
10+
/// <summary>
11+
/// BootstrapBlazor 服务扩展类
12+
/// </summary>
13+
public static class ServiceCollectionExtensions
14+
{
15+
/// <summary>
16+
/// 增加海康威视网络摄像机 Web 服务
17+
/// </summary>
18+
/// <param name="services"></param>
19+
/// <returns></returns>
20+
public static IServiceCollection AddBootstrapBlazorHikVision(this IServiceCollection services)
21+
{
22+
services.TryAddScoped<IHikVision, DefaultHicVision>();
23+
return services;
24+
}
25+
}

‎src/components/BootstrapBlazor.HikVision/LoginType.cs‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
// Copyright (c) BootstrapBlazor & Argo Zhang (argo@live.ca). All rights reserved.
2+
// Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
3+
// Website: https://www.blazor.zone or https://argozhang.github.io/
4+
5+
namespace BootstrapBlazor.Components;
6+
7+
/// <summary>
8+
/// 登录方式
9+
/// </summary>
10+
public enum LoginType
11+
{
12+
/// <summary>
13+
/// http 方式
14+
/// </summary>
15+
Http = 1,
16+
17+
/// <summary>
18+
/// https 方式
19+
/// </summary>
20+
Https = 2
21+
}

‎src/components/BootstrapBlazor.HikVision/Services/DefaultHicVision.cs‎

Lines changed: 71 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
// Copyright (c) BootstrapBlazor & Argo Zhang (argo@live.ca). All rights reserved.
2+
// Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
3+
// Website: https://www.blazor.zone or https://argozhang.github.io/
4+
5+
namespace BootstrapBlazor.Components;
6+
7+
sealed class DefaultHicVision(IJSRuntime jsRuntime) : IHikVision
8+
{
9+
private JSModule _module = default!;
10+
private bool _initialized;
11+
private bool _logined;
12+
13+
public async Task<bool> Login(string ip, int port, string userName, string password, LoginType loginType = LoginType.Http)
14+
{
15+
await LoadAsync();
16+
17+
if (!_logined)
18+
{
19+
_logined = await _module.InvokeAsync<bool>("login", ip, port, userName, password, (int)loginType);
20+
}
21+
22+
return _logined;
23+
}
24+
25+
public async Task<bool> Logout(string ip, int port)
26+
{
27+
if (_logined)
28+
{
29+
_logined = await _module.InvokeAsync<bool>("logout");
30+
}
31+
32+
return _logined;
33+
}
34+
35+
public async Task StartRealPlay()
36+
{
37+
if (_logined)
38+
{
39+
await _module.InvokeVoidAsync("startRealPlay");
40+
}
41+
}
42+
43+
public async Task StopRealPlay()
44+
{
45+
if (_logined)
46+
{
47+
await _module.InvokeVoidAsync("stopRealPlay");
48+
}
49+
}
50+
51+
private async Task LoadAsync()
52+
{
53+
if (!_initialized)
54+
{
55+
var module = await jsRuntime.InvokeAsync<IJSObjectReference>("import", "./_content/BootstrapBlazor.HikVision/hikvision.js");
56+
_module = new JSModule(module);
57+
58+
_initialized = true;
59+
}
60+
}
61+
62+
public async ValueTask DisposeAsync()
63+
{
64+
if (_module != null)
65+
{
66+
await _module.InvokeVoidAsync("dispose");
67+
await _module.DisposeAsync();
68+
}
69+
GC.SuppressFinalize(this);
70+
}
71+
}

0 commit comments

Comments
 (0)