mirror of
https://github.com/kerberos-io/agent.git
synced 2026-03-06 16:51:09 +00:00
Compare commits
4 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
ed397b6ecc | ||
|
|
530e4c654e | ||
|
|
913bd1ba12 | ||
|
|
84e532be47 |
@@ -122,6 +122,7 @@ RUN cp /home/agent/data/config/config.json /home/agent/data/config.template.json
|
||||
# Set permissions correctly
|
||||
|
||||
RUN chown -R agent:kerberosio /home/agent/data
|
||||
RUN chown -R agent:kerberosio /home/agent/www
|
||||
|
||||
###########################
|
||||
# Grant the necessary root capabilities to the process trying to bind to the privileged port
|
||||
|
||||
@@ -165,6 +165,7 @@ Next to attaching the configuration file, it is also possible to override the co
|
||||
|
||||
| Name | Description | Default Value |
|
||||
| --------------------------------------- | ----------------------------------------------------------------------------------------------- | ------------------------------ |
|
||||
| `AGENT_MODE` | You can choose to run this in 'release' for production, and or 'demo' for showcasing. | "release" |
|
||||
| `AGENT_USERNAME` | The username used to authenticate against the Kerberos Agent login page. | "root" |
|
||||
| `AGENT_PASSWORD` | The password used to authenticate against the Kerberos Agent login page. | "root" |
|
||||
| `AGENT_KEY` | A unique identifier for your Kerberos Agent, this is auto-generated but can be overriden. | "" |
|
||||
|
||||
@@ -272,14 +272,21 @@ loop:
|
||||
|
||||
// We'll check which mode is enabled for the camera.
|
||||
onvifEnabled := "false"
|
||||
onvifZoom := "false"
|
||||
onvifPanTilt := "false"
|
||||
if config.Capture.IPCamera.ONVIFXAddr != "" {
|
||||
cameraConfiguration := configuration.Config.Capture.IPCamera
|
||||
device, err := onvif.ConnectToOnvifDevice(&cameraConfiguration)
|
||||
if err == nil {
|
||||
capabilities := onvif.GetCapabilitiesFromDevice(device)
|
||||
for _, v := range capabilities {
|
||||
if v == "PTZ" || v == "ptz" {
|
||||
onvifEnabled = "true"
|
||||
configurations, err := onvif.GetPTZConfigurationsFromDevice(device)
|
||||
if err == nil {
|
||||
onvifEnabled = "true"
|
||||
_, canZoom, canPanTilt := onvif.GetPTZFunctionsFromDevice(configurations)
|
||||
if canZoom {
|
||||
onvifZoom = "true"
|
||||
}
|
||||
if canPanTilt {
|
||||
onvifPanTilt = "true"
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -325,6 +332,8 @@ loop:
|
||||
"boot_time" : "%s",
|
||||
"siteID" : "%s",
|
||||
"onvif" : "%s",
|
||||
"onvif_zoom" : "%s",
|
||||
"onvif_pantilt" : "%s",
|
||||
"cameraConnected": "%s",
|
||||
"numberoffiles" : "33",
|
||||
"timestamp" : 1564747908,
|
||||
@@ -332,7 +341,7 @@ loop:
|
||||
"docker" : true,
|
||||
"kios" : false,
|
||||
"raspberrypi" : false
|
||||
}`, config.Key, system.Version, system.CPUId, username, key, name, isEnterprise, system.Hostname, system.Architecture, system.TotalMemory, system.UsedMemory, system.FreeMemory, system.ProcessUsedMemory, macs, ips, "0", "0", "0", uptimeString, boottimeString, config.HubSite, onvifEnabled, cameraConnected)
|
||||
}`, config.Key, system.Version, system.CPUId, username, key, name, isEnterprise, system.Hostname, system.Architecture, system.TotalMemory, system.UsedMemory, system.FreeMemory, system.ProcessUsedMemory, macs, ips, "0", "0", "0", uptimeString, boottimeString, config.HubSite, onvifEnabled, onvifZoom, onvifPanTilt, cameraConnected)
|
||||
|
||||
var jsonStr = []byte(object)
|
||||
buffy := bytes.NewBuffer(jsonStr)
|
||||
@@ -348,6 +357,7 @@ loop:
|
||||
communication.CloudTimestamp.Store(time.Now().Unix())
|
||||
log.Log.Info("HandleHeartBeat: (200) Heartbeat received by Kerberos Hub.")
|
||||
} else {
|
||||
communication.CloudTimestamp.Store(0)
|
||||
log.Log.Error("HandleHeartBeat: (400) Something went wrong while sending to Kerberos Hub.")
|
||||
}
|
||||
|
||||
|
||||
@@ -85,11 +85,12 @@ func Bootstrap(configuration *models.Configuration, communication *models.Commun
|
||||
break
|
||||
}
|
||||
|
||||
// We will re open the configuration, might have changed :O!
|
||||
OpenConfig(configuration)
|
||||
|
||||
// We will override the configuration with the environment variables
|
||||
OverrideWithEnvironmentVariables(configuration)
|
||||
if status == "not started" {
|
||||
// We will re open the configuration, might have changed :O!
|
||||
OpenConfig(configuration)
|
||||
// We will override the configuration with the environment variables
|
||||
OverrideWithEnvironmentVariables(configuration)
|
||||
}
|
||||
|
||||
// Reset the MQTT client, might have provided new information, so we need to reconnect.
|
||||
if routers.HasMQTTClientModified(configuration) {
|
||||
@@ -282,6 +283,12 @@ func RunAgent(configuration *models.Configuration, communication *models.Communi
|
||||
// Cancel the main context, this will stop all the other goroutines.
|
||||
(*communication.CancelContext)()
|
||||
|
||||
// We will re open the configuration, might have changed :O!
|
||||
OpenConfig(configuration)
|
||||
|
||||
// We will override the configuration with the environment variables
|
||||
OverrideWithEnvironmentVariables(configuration)
|
||||
|
||||
// Here we are cleaning up everything!
|
||||
if configuration.Config.Offline != "true" {
|
||||
communication.HandleUpload <- "stop"
|
||||
@@ -308,9 +315,6 @@ func RunAgent(configuration *models.Configuration, communication *models.Communi
|
||||
close(communication.HandleMotion)
|
||||
communication.HandleMotion = nil
|
||||
|
||||
// Wait a few seconds to stop the decoder.
|
||||
time.Sleep(time.Second * 3)
|
||||
|
||||
// Waiting for some seconds to make sure everything is properly closed.
|
||||
log.Log.Info("RunAgent: waiting 3 seconds to make sure everything is properly closed.")
|
||||
time.Sleep(time.Second * 3)
|
||||
|
||||
@@ -63,19 +63,18 @@ func AddRoutes(r *gin.Engine, authMiddleware *jwt.GinJWTMiddleware, configuratio
|
||||
|
||||
api.GET("/dashboard", func(c *gin.Context) {
|
||||
|
||||
// This will return the timestamp when the last packet was correctyl received
|
||||
// this is to calculate if the camera connection is still working.
|
||||
lastPacketReceived := int64(0)
|
||||
if communication.LastPacketTimer != nil && communication.LastPacketTimer.Load() != nil {
|
||||
lastPacketReceived = communication.LastPacketTimer.Load().(int64)
|
||||
}
|
||||
// Check if camera is online.
|
||||
cameraIsOnline := communication.CameraConnected
|
||||
|
||||
// If an agent is properly setup with Kerberos Hub, we will send
|
||||
// a ping to Kerberos Hub every 15seconds. On receiving a positive response
|
||||
// it will update the CloudTimestamp value.
|
||||
cloudTimestamp := int64(0)
|
||||
cloudIsOnline := false
|
||||
if communication.CloudTimestamp != nil && communication.CloudTimestamp.Load() != nil {
|
||||
cloudTimestamp = communication.CloudTimestamp.Load().(int64)
|
||||
timestamp := communication.CloudTimestamp.Load().(int64)
|
||||
if timestamp > 0 {
|
||||
cloudIsOnline = true
|
||||
}
|
||||
}
|
||||
|
||||
// The total number of recordings stored in the directory.
|
||||
@@ -100,8 +99,8 @@ func AddRoutes(r *gin.Engine, authMiddleware *jwt.GinJWTMiddleware, configuratio
|
||||
|
||||
c.JSON(200, gin.H{
|
||||
"offlineMode": configuration.Config.Offline,
|
||||
"cameraOnline": lastPacketReceived,
|
||||
"cloudOnline": cloudTimestamp,
|
||||
"cameraOnline": cameraIsOnline,
|
||||
"cloudOnline": cloudIsOnline,
|
||||
"numberOfRecordings": numberOfRecordings,
|
||||
"days": days,
|
||||
"latestEvents": latestEvents,
|
||||
|
||||
@@ -1,6 +1,8 @@
|
||||
package http
|
||||
|
||||
import (
|
||||
"os"
|
||||
|
||||
jwt "github.com/appleboy/gin-jwt/v2"
|
||||
"github.com/gin-contrib/pprof"
|
||||
"github.com/gin-gonic/contrib/static"
|
||||
@@ -57,6 +59,17 @@ func StartServer(configuration *models.Configuration, communication *models.Comm
|
||||
// Add all routes
|
||||
AddRoutes(r, authMiddleware, configuration, communication)
|
||||
|
||||
// Update environment variables
|
||||
environmentVariables := "./www/env.js"
|
||||
if os.Getenv("AGENT_MODE") == "demo" {
|
||||
demoEnvironmentVariables := "./www/env.demo.js"
|
||||
// Move demo environment variables to environment variables
|
||||
err := os.Rename(demoEnvironmentVariables, environmentVariables)
|
||||
if err != nil {
|
||||
log.Fatal(err)
|
||||
}
|
||||
}
|
||||
|
||||
// Add static routes to UI
|
||||
r.Use(static.Serve("/", static.LocalFile("./www", true)))
|
||||
r.Use(static.Serve("/dashboard", static.LocalFile("./www", true)))
|
||||
|
||||
@@ -21,6 +21,7 @@
|
||||
"react/forbid-prop-types": "off",
|
||||
"no-case-declarations": "off",
|
||||
"camelcase": "off",
|
||||
"dot-notation": "off",
|
||||
"jsx-a11y/media-has-caption": "off",
|
||||
"jsx-a11y/anchor-is-valid": "off",
|
||||
"jsx-a11y/click-events-have-key-events": "off",
|
||||
|
||||
5
ui/public/env.demo.js
Normal file
5
ui/public/env.demo.js
Normal file
@@ -0,0 +1,5 @@
|
||||
(function (window) {
|
||||
window['env'] = window['env'] || {};
|
||||
// Environment variables
|
||||
window['env']['mode'] = 'demo';
|
||||
})(this);
|
||||
5
ui/public/env.js
Normal file
5
ui/public/env.js
Normal file
@@ -0,0 +1,5 @@
|
||||
(function (window) {
|
||||
window['env'] = window['env'] || {};
|
||||
// Environment variables
|
||||
window['env']['mode'] = 'release';
|
||||
})(this);
|
||||
@@ -19,7 +19,7 @@
|
||||
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
|
||||
-->
|
||||
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
|
||||
<script src="assets/env.js"></script>
|
||||
<script src="%PUBLIC_URL%/env.js"></script>
|
||||
<!--
|
||||
Notice the use of %PUBLIC_URL% in the tags above.
|
||||
It will be replaced with the URL of the `public` folder during the build.
|
||||
|
||||
209
ui/src/App.jsx
209
ui/src/App.jsx
@@ -93,111 +93,122 @@ class App extends React.Component {
|
||||
const { children, username, dashboard, dispatchLogout } = this.props;
|
||||
const cloudOnline = this.getCurrentTimestamp() - dashboard.cloudOnline < 30;
|
||||
return (
|
||||
<div id="page-root">
|
||||
<Sidebar logo={logo} title="Kerberos Agent" version="v1-beta" mobile>
|
||||
<Profilebar
|
||||
username={username}
|
||||
email="support@kerberos.io"
|
||||
userrole={t('navigation.admin')}
|
||||
logout={dispatchLogout}
|
||||
/>
|
||||
<Navigation>
|
||||
<NavigationSection title={t('navigation.management')} />
|
||||
<NavigationGroup>
|
||||
<NavigationItem
|
||||
title={t('navigation.dashboard')}
|
||||
icon="dashboard"
|
||||
link="dashboard"
|
||||
/>
|
||||
<NavigationItem
|
||||
title={t('navigation.recordings')}
|
||||
icon="media"
|
||||
link="media"
|
||||
/>
|
||||
<NavigationItem
|
||||
title={t('navigation.settings')}
|
||||
icon="preferences"
|
||||
link="settings"
|
||||
/>
|
||||
</NavigationGroup>
|
||||
<NavigationSection title={t('navigation.help_support')} />
|
||||
<NavigationGroup>
|
||||
<NavigationItem
|
||||
title={t('navigation.swagger')}
|
||||
icon="api"
|
||||
external
|
||||
link={`${config.URL}/swagger/index.html`}
|
||||
/>
|
||||
<NavigationItem
|
||||
title={t('navigation.documentation')}
|
||||
icon="book"
|
||||
external
|
||||
link="https://doc.kerberos.io/agent/announcement"
|
||||
/>
|
||||
<NavigationItem
|
||||
title="Kerberos Hub"
|
||||
icon="cloud"
|
||||
external
|
||||
link="https://app.kerberos.io"
|
||||
/>
|
||||
<NavigationItem
|
||||
title={t('navigation.ui_library')}
|
||||
icon="paint"
|
||||
external
|
||||
link="https://ui.kerberos.io/"
|
||||
/>
|
||||
<NavigationItem
|
||||
title="Github"
|
||||
icon="github-nav"
|
||||
external
|
||||
link="https://github.com/kerberos-io/agent"
|
||||
/>
|
||||
</NavigationGroup>
|
||||
<NavigationSection title={t('navigation.layout')} />
|
||||
<NavigationGroup>
|
||||
<LanguageSelect />
|
||||
</NavigationGroup>
|
||||
|
||||
<NavigationSection title="Websocket" />
|
||||
<NavigationGroup>
|
||||
<div className="websocket-badge">
|
||||
<Badge
|
||||
title={connected ? 'connected' : 'disconnected'}
|
||||
status={connected ? 'success' : 'warning'}
|
||||
<>
|
||||
{config.MODE !== 'release' && (
|
||||
<div className={`environment ${config.MODE}`}>
|
||||
Environment: {config.MODE}
|
||||
</div>
|
||||
)}
|
||||
<div id="page-root">
|
||||
<Sidebar logo={logo} title="Kerberos Agent" version="v1-beta" mobile>
|
||||
<Profilebar
|
||||
username={username}
|
||||
email="support@kerberos.io"
|
||||
userrole={t('navigation.admin')}
|
||||
logout={dispatchLogout}
|
||||
/>
|
||||
<Navigation>
|
||||
<NavigationSection title={t('navigation.management')} />
|
||||
<NavigationGroup>
|
||||
<NavigationItem
|
||||
title={t('navigation.dashboard')}
|
||||
icon="dashboard"
|
||||
link="dashboard"
|
||||
/>
|
||||
</div>
|
||||
</NavigationGroup>
|
||||
</Navigation>
|
||||
</Sidebar>
|
||||
<Main>
|
||||
<Gradient />
|
||||
<NavigationItem
|
||||
title={t('navigation.recordings')}
|
||||
icon="media"
|
||||
link="media"
|
||||
/>
|
||||
<NavigationItem
|
||||
title={t('navigation.settings')}
|
||||
icon="preferences"
|
||||
link="settings"
|
||||
/>
|
||||
</NavigationGroup>
|
||||
<NavigationSection title={t('navigation.help_support')} />
|
||||
<NavigationGroup>
|
||||
<NavigationItem
|
||||
title={t('navigation.swagger')}
|
||||
icon="api"
|
||||
external
|
||||
link={`${config.URL}/swagger/index.html`}
|
||||
/>
|
||||
<NavigationItem
|
||||
title={t('navigation.documentation')}
|
||||
icon="book"
|
||||
external
|
||||
link="https://doc.kerberos.io/agent/announcement"
|
||||
/>
|
||||
<NavigationItem
|
||||
title="Kerberos Hub"
|
||||
icon="cloud"
|
||||
external
|
||||
link="https://app.kerberos.io"
|
||||
/>
|
||||
<NavigationItem
|
||||
title={t('navigation.ui_library')}
|
||||
icon="paint"
|
||||
external
|
||||
link="https://ui.kerberos.io/"
|
||||
/>
|
||||
<NavigationItem
|
||||
title="Github"
|
||||
icon="github-nav"
|
||||
external
|
||||
link="https://github.com/kerberos-io/agent"
|
||||
/>
|
||||
</NavigationGroup>
|
||||
<NavigationSection title={t('navigation.layout')} />
|
||||
<NavigationGroup>
|
||||
<LanguageSelect />
|
||||
</NavigationGroup>
|
||||
|
||||
{!cloudOnline && (
|
||||
<a href="https://app.kerberos.io" target="_blank" rel="noreferrer">
|
||||
<div className="cloud-not-installed">
|
||||
<div>
|
||||
<Icon label="cloud" />
|
||||
Activate Kerberos Hub, and make your cameras and recordings
|
||||
available through a secured cloud!
|
||||
<NavigationSection title="Websocket" />
|
||||
<NavigationGroup>
|
||||
<div className="websocket-badge">
|
||||
<Badge
|
||||
title={connected ? 'connected' : 'disconnected'}
|
||||
status={connected ? 'success' : 'warning'}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
)}
|
||||
</NavigationGroup>
|
||||
</Navigation>
|
||||
</Sidebar>
|
||||
<Main>
|
||||
<Gradient />
|
||||
|
||||
{dashboard.offlineMode === 'true' && (
|
||||
<Link to="/settings">
|
||||
<div className="offline-mode">
|
||||
<div>
|
||||
<Icon label="info" />
|
||||
Attention! Kerberos is currently running in Offline mode.
|
||||
{!cloudOnline && (
|
||||
<a
|
||||
href="https://app.kerberos.io"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
<div className="cloud-not-installed">
|
||||
<div>
|
||||
<Icon label="cloud" />
|
||||
Activate Kerberos Hub, and make your cameras and recordings
|
||||
available through a secured cloud!
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
)}
|
||||
</a>
|
||||
)}
|
||||
|
||||
<MainBody>{children}</MainBody>
|
||||
</Main>
|
||||
</div>
|
||||
{dashboard.offlineMode === 'true' && (
|
||||
<Link to="/settings">
|
||||
<div className="offline-mode">
|
||||
<div>
|
||||
<Icon label="info" />
|
||||
Attention! Kerberos is currently running in Offline mode.
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
)}
|
||||
|
||||
<MainBody>{children}</MainBody>
|
||||
</Main>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -12,6 +12,7 @@ const dev = {
|
||||
API_URL: `${protocol}//${hostname}:8080/api`,
|
||||
URL: `${protocol}//${hostname}:8080`,
|
||||
WS_URL: `${websocketprotocol}//${hostname}:8080/ws`,
|
||||
MODE: window['env']['mode'],
|
||||
// Uncomment, and comment the above lines, when using codespaces or other special DNS names (which you can't control)
|
||||
// HOSTNAME: externalHost,
|
||||
// API_URL: `${protocol}//${externalHost}/api`,
|
||||
@@ -25,6 +26,7 @@ const prod = {
|
||||
API_URL: `${protocol}//${host}/api`,
|
||||
URL: `${protocol}//${host}`,
|
||||
WS_URL: `${websocketprotocol}//${host}/ws`,
|
||||
MODE: window['env']['mode'],
|
||||
};
|
||||
|
||||
const config = process.env.REACT_APP_ENVIRONMENT === 'production' ? prod : dev;
|
||||
|
||||
@@ -144,3 +144,55 @@ body {
|
||||
padding: 0;
|
||||
font-family: 'Inter', sans-serif; // use regular Inter font by default..
|
||||
}
|
||||
|
||||
.environment.develop {
|
||||
background: repeating-linear-gradient(
|
||||
-55deg,
|
||||
#222,
|
||||
#222 10px,
|
||||
#035e1f 10px,
|
||||
#035e1f 20px
|
||||
);
|
||||
text-align: center;
|
||||
color: rgba(255, 255, 255, 0.75);
|
||||
padding: size(1) 0;
|
||||
}
|
||||
|
||||
.environment.demo {
|
||||
background: repeating-linear-gradient(
|
||||
-55deg,
|
||||
#222,
|
||||
#222 10px,
|
||||
#035e1f 10px,
|
||||
#035e1f 20px
|
||||
);
|
||||
text-align: center;
|
||||
color: rgba(255, 255, 255, 0.75);
|
||||
padding: 12px 0;
|
||||
}
|
||||
|
||||
.environment.staging {
|
||||
background: repeating-linear-gradient(
|
||||
-55deg,
|
||||
#222,
|
||||
#222 10px,
|
||||
#6d0e0e 10px,
|
||||
#6d0e0e 20px
|
||||
);
|
||||
text-align: center;
|
||||
color: white;
|
||||
padding: 12px 0;
|
||||
}
|
||||
|
||||
.environment.acceptance {
|
||||
background: repeating-linear-gradient(
|
||||
-55deg,
|
||||
#222,
|
||||
#222 10px,
|
||||
#8b8203 10px,
|
||||
#8b8203 20px
|
||||
);
|
||||
text-align: center;
|
||||
color: white;
|
||||
padding: 12px 0;
|
||||
}
|
||||
@@ -35,6 +35,7 @@ class Dashboard extends React.Component {
|
||||
liveviewLoaded: false,
|
||||
open: false,
|
||||
currentRecording: '',
|
||||
initialised: false,
|
||||
};
|
||||
}
|
||||
|
||||
@@ -47,30 +48,28 @@ class Dashboard extends React.Component {
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
const { connected } = this.props;
|
||||
if (connected === true) {
|
||||
const { dispatchSend } = this.props;
|
||||
const message = {
|
||||
message_type: 'stream-sd',
|
||||
};
|
||||
dispatchSend(message);
|
||||
}
|
||||
}
|
||||
|
||||
componentDidUpdate(prevProps) {
|
||||
const { connected: connectedPrev } = prevProps;
|
||||
const { connected } = this.props;
|
||||
if (connectedPrev === false && connected === true) {
|
||||
const { dispatchSend } = this.props;
|
||||
componentDidUpdate() {
|
||||
const { initialised } = this.state;
|
||||
if (!initialised) {
|
||||
const { connected, dispatchSend } = this.props;
|
||||
const message = {
|
||||
message_type: 'stream-sd',
|
||||
};
|
||||
dispatchSend(message);
|
||||
|
||||
const requestStreamInterval = interval(3000);
|
||||
this.requestStreamSubscription = requestStreamInterval.subscribe(() => {
|
||||
if (connected) {
|
||||
dispatchSend(message);
|
||||
}
|
||||
|
||||
const requestStreamInterval = interval(2000);
|
||||
this.requestStreamSubscription = requestStreamInterval.subscribe(() => {
|
||||
if (connected) {
|
||||
dispatchSend(message);
|
||||
}
|
||||
});
|
||||
|
||||
this.setState({
|
||||
initialised: true,
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -115,17 +114,16 @@ class Dashboard extends React.Component {
|
||||
|
||||
// We check if the camera was getting a valid frame
|
||||
// during the last 5 seconds, otherwise we assume the camera is offline.
|
||||
const isCameraOnline =
|
||||
this.getCurrentTimestamp() - dashboard.cameraOnline < 15;
|
||||
const isCameraOnline = dashboard.cameraOnline;
|
||||
|
||||
// We check if a connection is made to Kerberos Hub, or if Offline mode
|
||||
// has been turned on.
|
||||
const cloudOnline = this.getCurrentTimestamp() - dashboard.cloudOnline < 30;
|
||||
const isCloudOnline = dashboard.cloudOnline;
|
||||
let cloudConnection = t('dashboard.not_connected');
|
||||
if (dashboard.offlineMode === 'true') {
|
||||
cloudConnection = t('dashboard.offline_mode');
|
||||
} else {
|
||||
cloudConnection = cloudOnline
|
||||
cloudConnection = isCloudOnline
|
||||
? t('dashboard.connected')
|
||||
: t('dashboard.not_connected');
|
||||
}
|
||||
@@ -185,7 +183,7 @@ class Dashboard extends React.Component {
|
||||
subtitle={cloudConnection}
|
||||
footer="Cloud"
|
||||
icon={
|
||||
cloudOnline && dashboard.offlineMode !== 'true'
|
||||
isCloudOnline && dashboard.offlineMode !== 'true'
|
||||
? 'circle-check-big'
|
||||
: 'circle-cross-big'
|
||||
}
|
||||
@@ -306,7 +304,7 @@ class Dashboard extends React.Component {
|
||||
</div>
|
||||
<div>
|
||||
<h2>{t('dashboard.live_view')}</h2>
|
||||
{!liveviewLoaded && (
|
||||
{(!liveviewLoaded || !isCameraOnline) && (
|
||||
<SetupBox
|
||||
btnicon="preferences"
|
||||
btnlabel={t('dashboard.configure_connection')}
|
||||
@@ -316,7 +314,12 @@ class Dashboard extends React.Component {
|
||||
text={t('dashboard.loading_live_view_description')}
|
||||
/>
|
||||
)}
|
||||
<div style={{ visibility: liveviewLoaded ? 'visible' : 'hidden' }}>
|
||||
<div
|
||||
style={{
|
||||
visibility:
|
||||
liveviewLoaded && isCameraOnline ? 'visible' : 'hidden',
|
||||
}}
|
||||
>
|
||||
<ImageCard
|
||||
imageSrc={`data:image/png;base64, ${
|
||||
images.length ? images[0] : ''
|
||||
|
||||
@@ -49,60 +49,98 @@ class Login extends React.Component {
|
||||
const { loginError, error } = this.props;
|
||||
|
||||
return (
|
||||
<LandingLayout
|
||||
title="Kerberos Agent"
|
||||
version={config.VERSION}
|
||||
description="Video surveillance for everyone"
|
||||
>
|
||||
<section className="login-body">
|
||||
<Block>
|
||||
<form onSubmit={this.handleSubmit} noValidate>
|
||||
<BlockHeader>
|
||||
<div>
|
||||
<Icon label="login" /> <h4>Login</h4>
|
||||
</div>
|
||||
</BlockHeader>
|
||||
{loginError && (
|
||||
<AlertMessage
|
||||
message={error}
|
||||
onClick={() => this.hideMessage()}
|
||||
/>
|
||||
)}
|
||||
<BlockBody>
|
||||
<Input
|
||||
label="username or email"
|
||||
placeholder="Your username/email"
|
||||
readonly={false}
|
||||
disabled={false}
|
||||
type="text"
|
||||
name="username"
|
||||
iconleft="accounts"
|
||||
/>
|
||||
<Input
|
||||
label="password"
|
||||
placeholder="Your password"
|
||||
readonly={false}
|
||||
disabled={false}
|
||||
type="password"
|
||||
name="password"
|
||||
iconleft="locked"
|
||||
iconright="activity"
|
||||
seperate
|
||||
/>
|
||||
</BlockBody>
|
||||
<BlockFooter>
|
||||
<p />
|
||||
<Button
|
||||
buttonType="submit"
|
||||
type="submit"
|
||||
icon="logout"
|
||||
label="Login"
|
||||
/>
|
||||
</BlockFooter>
|
||||
</form>
|
||||
</Block>
|
||||
</section>
|
||||
</LandingLayout>
|
||||
<>
|
||||
{config.MODE !== 'release' && (
|
||||
<div className={`environment ${config.MODE}`}>
|
||||
Environment: {config.MODE}
|
||||
</div>
|
||||
)}
|
||||
<LandingLayout
|
||||
title="Kerberos Agent"
|
||||
version={config.VERSION}
|
||||
description="Video surveillance for everyone"
|
||||
>
|
||||
<section className="login-body">
|
||||
<Block>
|
||||
<form onSubmit={this.handleSubmit} noValidate>
|
||||
<BlockHeader>
|
||||
<div>
|
||||
<Icon label="login" /> <h4>Login</h4>
|
||||
</div>
|
||||
</BlockHeader>
|
||||
{loginError && (
|
||||
<AlertMessage
|
||||
message={error}
|
||||
onClick={() => this.hideMessage()}
|
||||
/>
|
||||
)}
|
||||
<BlockBody>
|
||||
{config.MODE === 'demo' && (
|
||||
<>
|
||||
<Input
|
||||
label="username or email"
|
||||
placeholder="Your username/email"
|
||||
readonly
|
||||
disabled={false}
|
||||
value="root"
|
||||
type="text"
|
||||
name="username"
|
||||
iconleft="accounts"
|
||||
/>
|
||||
<Input
|
||||
label="password"
|
||||
placeholder="Your password"
|
||||
readonly
|
||||
disabled={false}
|
||||
value="root"
|
||||
type="password"
|
||||
name="password"
|
||||
iconleft="locked"
|
||||
iconright="activity"
|
||||
seperate
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
|
||||
{config.MODE !== 'demo' && (
|
||||
<>
|
||||
<Input
|
||||
label="username or email"
|
||||
placeholder="Your username/email"
|
||||
readonly={false}
|
||||
disabled={false}
|
||||
type="text"
|
||||
name="username"
|
||||
iconleft="accounts"
|
||||
/>
|
||||
<Input
|
||||
label="password"
|
||||
placeholder="Your password"
|
||||
readonly={false}
|
||||
disabled={false}
|
||||
type="password"
|
||||
name="password"
|
||||
iconleft="locked"
|
||||
iconright="activity"
|
||||
seperate
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
</BlockBody>
|
||||
<BlockFooter>
|
||||
<p />
|
||||
<Button
|
||||
buttonType="submit"
|
||||
type="submit"
|
||||
icon="logout"
|
||||
label="Login"
|
||||
/>
|
||||
</BlockFooter>
|
||||
</form>
|
||||
</Block>
|
||||
</section>
|
||||
</LandingLayout>
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user