eye.magzu.net
Open in
urlscan Pro
82.146.66.141
Public Scan
URL:
https://eye.magzu.net/
Submission: On May 21 via api from US — Scanned from NO
Submission: On May 21 via api from US — Scanned from NO
Form analysis 2 forms found in the DOM
<form autocomplete="new-password">
<!-- Preferences -->
<div class="settings-section-title" id="preferencesDiv">
<span class="help-mark" title="user preferences">?</span>
<a class="settings-section-title">Preferences</a>
<span class="minimize open"></span>
</div>
<table class="settings">
<tbody>
<tr class="settings-item" min="1" max="4" snap="1" ticksnum="4" decimals="0" id="layoutColumnsRow">
<td class="settings-item-label"><span class="settings-item-label">Layout Columns</span></td>
<td class="settings-item-value"><input type="text" class="range styled prefs" id="layoutColumnsSlider">
<div class="slider range styled prefs" tabindex="0">
<div class="slider-labels"><span class="slider-label" style="left: -10%;">1</span><span class="slider-label" style="left: 23.3333%;">2</span><span class="slider-label" style="left: 56.6667%;">3</span><span class="slider-label"
style="left: 90%;">4</span></div>
<div class="slider-bar">
<div class="slider-bar-inside"></div>
<div class="slider-cursor" style="left: 0%;">
<div class="slider-cursor-label">1</div>
</div>
</div>
</div>
</td>
<td><span class="help-mark" title="configures the number of columns used to lay out the camera frames">?</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Fit Frames Vertically</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled prefs" id="fitFramesVerticallySwitch">
<div class="check-box styled prefs" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="controls whether frame sizes can be reduced to vertically fit the window or not">?</span></td>
</tr>
<tr class="settings-item" min="1" max="4" snap="1" ticksnum="4" decimals="0" id="layoutRows" depends="fitFramesVertically">
<td class="settings-item-label"><span class="settings-item-label">Layout Rows</span></td>
<td class="settings-item-value"><input type="text" class="range styled prefs" id="layoutRowsSlider">
<div class="slider range styled prefs" tabindex="0">
<div class="slider-labels"><span class="slider-label" style="left: -10%;">1</span><span class="slider-label" style="left: 23.3333%;">2</span><span class="slider-label" style="left: 56.6667%;">3</span><span class="slider-label"
style="left: 90%;">4</span></div>
<div class="slider-bar">
<div class="slider-bar-inside"></div>
<div class="slider-cursor" style="left: 0%;">
<div class="slider-cursor-label">1</div>
</div>
</div>
</div>
</td>
<td><span class="help-mark" title="configures the number of rows used to lay out the camera frames">?</span></td>
</tr>
<tr class="settings-item" min="0" max="100" snap="0" ticksnum="6" decimals="0">
<td class="settings-item-label"><span class="settings-item-label">Frame Rate Dimmer</span></td>
<td class="settings-item-value"><input type="text" class="range styled prefs" id="framerateDimmerSlider">
<div class="slider range styled prefs" tabindex="0">
<div class="slider-labels"><span class="slider-label" style="left: -10%;">0</span><span class="slider-label" style="left: 10%;">20</span><span class="slider-label" style="left: 30%;">40</span><span class="slider-label"
style="left: 50%;">60</span><span class="slider-label" style="left: 70%;">80</span><span class="slider-label" style="left: 90%;">100</span></div>
<div class="slider-bar">
<div class="slider-bar-inside"></div>
<div class="slider-cursor" style="left: 0%;">
<div class="slider-cursor-label">0</div>
</div>
</div>
</div>
</td>
<td><span class="help-mark" title="dims the global frame rate to save network bandwidth and traffic (doesn't work on simple MJPEG cameras)">?</span></td>
</tr>
<tr class="settings-item" min="1" max="100" snap="0" ticks="1|20|40|60|80|100" decimals="0">
<td class="settings-item-label"><span class="settings-item-label">Resolution Dimmer</span></td>
<td class="settings-item-value"><input type="text" class="range styled prefs" id="resolutionDimmerSlider">
<div class="slider range styled prefs" tabindex="0">
<div class="slider-labels"><span class="slider-label" style="left: -10%;">1</span><span class="slider-label" style="left: 9.19192%;">20</span><span class="slider-label" style="left: 29.3939%;">40</span><span class="slider-label"
style="left: 49.596%;">60</span><span class="slider-label" style="left: 69.798%;">80</span><span class="slider-label" style="left: 90%;">100</span></div>
<div class="slider-bar">
<div class="slider-bar-inside"></div>
<div class="slider-cursor" style="left: 0%;">
<div class="slider-cursor-label">1</div>
</div>
</div>
</div>
</td>
<td><span class="help-mark" title="dims the actual resolution of all cameras to save network bandwidth and traffic (doesn't work on simple MJPEG cameras)">?</span></td>
</tr>
</tbody>
</table>
<!-- General Settings -->
<div class="settings-section-title" id="generalSectionDiv">
<span class="help-mark" title="general settings, not related to any camera">?</span>
<a class="settings-section-title">General Settings</a>
<span class="minimize open"></span>
</div>
<table class="settings">
<tbody>
<tr class="settings-item" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Language</span></td>
<td class="settings-item-value"><select class="styled general main-config" id="langSelect">
<option value="ar">العربية</option>
<option value="bn">বাংলা</option>
<option value="ca">català</option>
<option value="cs">čeština</option>
<option value="de">Deutsch</option>
<option value="el">Ελληνικά</option>
<option value="en">English</option>
<option value="eo">Esperanto</option>
<option value="es">español</option>
<option value="fi">suomi</option>
<option value="fr">français</option>
<option value="hi">हिन्दी</option>
<option value="hu">magyar</option>
<option value="it">italiano</option>
<option value="ja">日本語</option>
<option value="ko">한국어</option>
<option value="ms">Melayu</option>
<option value="nb_NO">norsk bokmål (Norge)</option>
<option value="nl">Nederlands</option>
<option value="pa">ਪੰਜਾਬੀ</option>
<option value="pl">polski</option>
<option value="pt">português</option>
<option value="ro">română</option>
<option value="ru">русский</option>
<option value="sk">slovenčina</option>
<option value="sv">svenska</option>
<option value="tr">Türkçe</option>
<option value="uk">українська</option>
<option value="zh">中文</option>
</select></td>
<td><span class="help-mark" title="the interface language">?</span></td>
</tr>
<tr class="settings-item" required="true" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Admin Username</span></td>
<td class="settings-item-value"><input type="text" autocapitalize="none" class="styled general main-config validator text-validator" id="adminUsernameEntry" readonly="readonly" title=""></td>
<td><span class="help-mark" title="the username to be used for configuring the system">?</span></td>
</tr>
<tr class="settings-item" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Password</span></td>
<td class="settings-item-value"><input type="password" autocomplete="new-password" class="styled general main-config validator custom-validator" id="adminPasswordEntry" title=""></td>
<td><span class="help-mark" title="administrator's password">?</span></td>
</tr>
<tr class="settings-item" required="true" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Surveillance Username</span></td>
<td class="settings-item-value"><input type="text" autocapitalize="none" class="styled general main-config validator text-validator" id="normalUsernameEntry" title=""></td>
<td><span class="help-mark" title="the username to be used for video surveillance">?</span></td>
</tr>
<tr class="settings-item" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Password</span></td>
<td class="settings-item-value"><input type="password" autocomplete="new-password" class="styled general main-config validator custom-validator" id="normalPasswordEntry" title=""></td>
<td><span class="help-mark" title="the password for the surveillance user (leave empty for passwordless surveillance)">?</span></td>
</tr>
<tr class="settings-item">
<td colspan="100">
<div class="settings-item-separator"></div>
</td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">motionEye Version</span></td>
<td class="settings-item-value"><span class="settings-item-label">0.43.1b1</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Motion Version</span></td>
<td class="settings-item-value"><span class="settings-item-label">4.6.0</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">OS Version</span></td>
<td class="settings-item-value"><span class="settings-item-label">Debian 12</span></td>
</tr>
<tr class="settings-item hidden">
<td class="settings-item-label"><span class="settings-item-label">Power</span></td>
<td class="settings-item-value">
<div class="button normal-button shut-down-button" id="shutDownButton">Shut Down</div>
</td>
<td><span class="help-mark" title="shuts down the system">?</span></td>
</tr>
<tr class="settings-item hidden">
<td class="settings-item-label"><span class="settings-item-label"></span></td>
<td class="settings-item-value">
<div class="button normal-button reboot-button" id="rebootButton">Reboot</div>
</td>
<td><span class="help-mark" title="reboots the system">?</span></td>
</tr>
<tr class="settings-item">
<td colspan="100">
<div class="settings-item-separator"></div>
</td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Configuration</span></td>
<td class="settings-item-value">
<div class="button normal-button backup-button" id="backupButton">Backup</div>
</td>
<td><span class="help-mark" title="creates a file with the current configuration for you to save it locally">?</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label"></span></td>
<td class="settings-item-value">
<div class="button normal-button restore-button" id="restoreButton">Restore</div>
</td>
<td><span class="help-mark" title="restores the configuration from a previously saved backup file">?</span></td>
</tr>
</tbody>
</table>
<!-- Additional Main Sections -->
<!-- Video Device -->
<div class="settings-section-title" id="deviceSectionDiv">
<input type="checkbox" class="styled section device camera-config" id="videoDeviceEnabledSwitch">
<div class="check-box styled section device camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
<span class="help-mark" title="enable this if you want to use this camera device">?</span>
<a class="settings-section-title">Video Device</a>
<span class="minimize open"></span>
</div>
<table class="settings">
<tbody>
<tr class="settings-item" required="true" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Camera Name</span></td>
<td class="settings-item-value"><input type="text" class="styled device camera-config validator text-validator custom-validator" id="deviceNameEntry" placeholder="Camera name …" title=""></td>
<td><span class="help-mark" title="an alias for this camera device">?</span></td>
</tr>
<tr class="settings-item" required="true" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Camera ID</span></td>
<td class="settings-item-value"><input type="text" class="styled device camera-config validator text-validator" id="deviceIdEntry" readonly="readonly" title=""></td>
<td><span class="help-mark" title="the camera identifier number">?</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Camera device</span></td>
<td class="settings-item-value"><input type="text" class="styled device camera-config" id="deviceUrlEntry" readonly="readonly"></td>
<td><span class="help-mark" title="Input device (eg: /dev/video) or URL (eg: rtsp://192.168.1.1/stream)">?</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Camera Type</span></td>
<td class="settings-item-value"><input type="text" class="styled device camera-config" id="deviceTypeEntry" readonly="readonly"></td>
</tr>
<tr class="settings-item">
<td colspan="100">
<div class="settings-item-separator"></div>
</td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Automatic Brightness</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled device camera-config" id="autoBrightnessSwitch">
<div class="check-box styled device camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="enables software automatic brightness (only recommended for cameras without autobrightness)">?</span></td>
</tr>
<tr class="settings-item">
<td colspan="100">
<div class="settings-item-separator"></div>
</td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Video resolution</span></td>
<td class="settings-item-value">
<select class="video-resolution styled device camera-config" id="resolutionSelect">
</select>
</td>
<td><span class="help-mark" title="the video resolution (larger values produce better quality, but require more CPU power, larger storage space and bandwidth)">?</span></td>
</tr>
<tr class="settings-item" min="96" max="4096" required="true" depends="resolution=custom">
<td class="settings-item-label"><span class="settings-item-label">Width</span></td>
<td class="settings-item-value"><input type="text" class="styled number device camera-config validator text-validator number-validator custom-validator" id="customWidthEntry" title=""></td>
<td><span class="help-mark" title="enter a custom resolution width">?</span></td>
</tr>
<tr class="settings-item" min="96" max="4096" required="true" depends="resolution=custom">
<td class="settings-item-label"><span class="settings-item-label">Height</span></td>
<td class="settings-item-value"><input type="text" class="styled number device camera-config validator text-validator number-validator custom-validator" id="customHeightEntry" title=""></td>
<td><span class="help-mark" title="enter a custom resolution height">?</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Video Rotation</span></td>
<td class="settings-item-value">
<select class="rotation styled device camera-config" id="rotationSelect">
<option value="0">0°</option>
<option value="90">90°</option>
<option value="180">180°</option>
<option value="270">270°</option>
</select>
</td>
<td><span class="help-mark" title="use this to rotate the captured image if your camera is not positioned correctly">?</span></td>
</tr>
<tr class="settings-item" min="2" max="30" snap="0" ticks="2|5|10|15|20|25|30" decimals="0">
<td class="settings-item-label"><span class="settings-item-label">Frame rate</span></td>
<td class="settings-item-value"><input type="text" class="range styled device camera-config" id="framerateSlider">
<div class="slider range styled device camera-config" tabindex="0">
<div class="slider-labels"><span class="slider-label" style="left: -10%;">2</span><span class="slider-label" style="left: 0.714286%;">5</span><span class="slider-label" style="left: 18.5714%;">10</span><span class="slider-label"
style="left: 36.4286%;">15</span><span class="slider-label" style="left: 54.2857%;">20</span><span class="slider-label" style="left: 72.1429%;">25</span><span class="slider-label" style="left: 90%;">30</span></div>
<div class="slider-bar">
<div class="slider-bar-inside"></div>
<div class="slider-cursor" style="left: 0%;">
<div class="slider-cursor-label">2</div>
</div>
</div>
</div>
</td>
<td><span class="help-mark" title="Sets the number of frames captured by the camera every second (higher values produce smoother videos but require more CPU power, larger storage space and bandwidth)">?</span></td>
</tr>
<tr class="settings-item">
<td colspan="100">
<div class="settings-item-separator"></div>
</td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Privacy mask</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled device camera-config" id="privacyMaskSwitch">
<div class="check-box styled device camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="enables image masking to prevent some image areas from being recorded to protect privacy">?</span></td>
</tr>
<tr class="settings-item" depends="privacyMask">
<td class="settings-item-label"><span class="settings-item-label"></span></td>
<td class="settings-item-value">
<div class="button normal-button edit-mask-button" id="privacyMaskEditButton">Edit Mask</div>
<div class="button normal-button save-mask-button" id="privacyMaskSaveButton">Save Mask</div>
<input type="text" class="device camera-config" id="privacyMaskLinesEntry">
</td>
<td><span class="help-mark" title="click this button to enable/disable the mask editor">?</span></td>
</tr>
<tr class="settings-item" depends="privacyMask">
<td class="settings-item-label"><span class="settings-item-label"></span></td>
<td class="settings-item-value">
<div class="button normal-button clear-mask-button" id="privacyMaskClearButton">Clear Mask</div>
</td>
<td><span class="help-mark" title="click this button to clear the current mask">?</span></td>
</tr>
<tr class="settings-item">
<td colspan="100">
<div class="settings-item-separator"></div>
</td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Extra Options</span></td>
<td class="settings-item-value"><textarea class="styled device camera-config" id="extraOptionsEntry" rows="3"></textarea></td>
<td><span class="help-mark" title="You can add any additional options here for the " motion"="" daemon="" (use="" the="" "name="" value"="" format,="" one="" option="" per="" line)"="">?</span></td>
</tr>
</tbody>
</table>
<!-- File Storage -->
<div class="settings-section-title" id="storageSectionDiv">
<span class="help-mark" title="choose where and how your media is stored">?</span>
<a class="settings-section-title">File storage</a>
<span class="minimize"></span>
</div>
<table class="settings">
<tbody>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Storage Device</span></td>
<td class="settings-item-value">
<select class="styled storage camera-config" id="storageDeviceSelect">
</select>
</td>
<td><span class="help-mark" title="indicates the storage device where the image and video files will be saved">?</span></td>
</tr>
<tr class="settings-item" required="true" depends="storageDevice=network-share" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Network server</span></td>
<td class="settings-item-value"><input type="text" class="styled storage camera-config validator text-validator" id="networkServerEntry" title=""></td>
<td><span class="help-mark" title="the address of the network server (IP address or hostname)">?</span></td>
</tr>
<tr class="settings-item" depends="storageDevice=network-share">
<td class="settings-item-label"><span class="settings-item-label">SMB Protocol Version</span></td>
<td class="settings-item-value">
<select class="styled storage camera-config" id="networkSMBVerSelect">
<option value="1.0">1.0</option>
<option value="2.0">2.0</option>
<option value="2.1">2.1</option>
<option value="3.0">3.0</option>
<option value="3.1.1">3.1.1</option>
</select>
</td>
<td><span class="help-mark" title="selects the SMB version to be used (test the various options and see which one works best with your NAS)">?</span></td>
</tr>
<tr class="settings-item" required="true" depends="storageDevice=network-share" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Share name</span></td>
<td class="settings-item-value"><input type="text" class="styled storage camera-config validator text-validator" id="networkShareNameEntry" title=""></td>
<td><span class="help-mark" title="the name of the network share">?</span></td>
</tr>
<tr class="settings-item" depends="storageDevice=network-share" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Username</span></td>
<td class="settings-item-value"><input type="text" autocapitalize="none" class="styled storage camera-config" id="networkUsernameEntry"></td>
<td><span class="help-mark" title="the username to be supplied when accessing the network share (leave empty if no username is required)">?</span></td>
</tr>
<tr class="settings-item" depends="storageDevice=network-share" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Share Password</span></td>
<td class="settings-item-value"><input type="password" autocomplete="new-password" class="styled storage camera-config" id="networkPasswordEntry"></td>
<td><span class="help-mark" title="the password required by the network share (leave empty if no password is required)">?</span></td>
</tr>
<tr class="settings-item" required="true" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Root directory</span></td>
<td class="settings-item-value"><input type="text" class="styled storage camera-config validator text-validator custom-validator" id="rootDirectoryEntry" title=""></td>
<td><span class="help-mark" title="the root path (on the selected storage device) where the files will be saved">?</span></td>
</tr>
<tr class="settings-item" depends="storageDevice=network-share">
<td class="settings-item-label"><span class="settings-item-label"></span></td>
<td class="settings-item-value">
<div class="button normal-button test-button" id="networkShareTestButton">Test share</div>
</td>
<td><span class="help-mark" title="click this button to test the network share connectivity after you have filled in the required details">?</span></td>
</tr>
<tr class="settings-item">
<td colspan="100">
<div class="settings-item-separator"></div>
</td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Disk usage</span></td>
<td class="settings-item-value">
<div id="diskUsageProgressBar" class="progress-bar progress-bar-container">
<div class="progress-bar-fill"></div><span class="progress-bar-text"></span>
</div>
</td>
<td><span class="help-mark" title="the used/total size of the disk where the root directory resides">?</span></td>
</tr>
<tr class="settings-item">
<td colspan="100">
<div class="settings-item-separator"></div>
</td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Upload Media Files</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled storage camera-config" id="uploadEnabledSwitch">
<div class="check-box styled storage camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="enable this if you want your media files to be uploaded to an external service">?</span></td>
</tr>
<tr class="settings-item" depends="uploadEnabled">
<td class="settings-item-label"><span class="settings-item-label">Upload Pictures</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled storage camera-config" id="uploadPictureSwitch">
<div class="check-box styled storage camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="enable this if you want pictures to be uploaded to an external service">?</span></td>
</tr>
<tr class="settings-item" depends="uploadEnabled">
<td class="settings-item-label"><span class="settings-item-label">Upload Movies</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled storage camera-config" id="uploadMovieSwitch">
<div class="check-box styled storage camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="enable this if you want videos to be uploaded to an external service">?</span></td>
</tr>
<tr class="settings-item" depends="uploadEnabled">
<td class="settings-item-label"><span class="settings-item-label">Upload Service</span></td>
<td class="settings-item-value">
<select class="styled storage camera-config" id="uploadServiceSelect">
<option value="ftp">FTP server</option>
<option value="sftp">SFTP server</option>
<!-- <option value="http">HTTP server</option> -->
<!-- <option value="https">HTTPS server</option> -->
<option value="gdrive">Google Drive</option>
<option value="gphoto">Google Photo</option>
<option value="dropbox">Dropbox</option>
<option value="s3">S3 (AWS/MinIO/…)</option>
<option value="webdav">WebDAV</option>
</select>
</td>
<td><span class="help-mark" title="choose a service to which the media files should be uploaded">?</span></td>
</tr>
<tr class="settings-item" required="true" depends="uploadEnabled uploadService=(ftp|sftp|http|https)">
<td class="settings-item-label"><span class="settings-item-label">Server Address</span></td>
<td class="settings-item-value"><input type="text" class="styled storage camera-config validator text-validator" id="uploadServerEntry" title=""></td>
<td><span class="help-mark" title="the domain name or IP address of the server (eg ftp.example.com or 192.168.1.3)">?</span></td>
</tr>
<tr class="settings-item" required="true" min="1" max="65535" depends="uploadEnabled uploadService=(ftp|sftp|http|https)">
<td class="settings-item-label"><span class="settings-item-label">Server port</span></td>
<td class="settings-item-value"><input type="text" class="number styled storage camera-config validator text-validator number-validator" id="uploadPortEntry" title=""></td>
<td><span class="help-mark" title="the port to use when connecting to the service (leave it empty to use the default value)">?</span></td>
</tr>
<tr class="settings-item" depends="uploadEnabled uploadService=(http|https)">
<td class="settings-item-label"><span class="settings-item-label">Method</span></td>
<td class="settings-item-value">
<select class="styled storage camera-config" id="uploadMethodSelect">
<option value="post">POST</option>
<option value="put">PUT</option>
</select>
</td>
<td><span class="help-mark" title="the HTTP method to use when uploading files">?</span></td>
</tr>
<tr class="settings-item" depends="uploadEnabled uploadService=(s3|webdav)">
<td class="settings-item-label"><span class="settings-item-label">Endpoint URL</span></td>
<td class="settings-item-value"><input type="text" class="styled storage camera-config" id="uploadEndpointUrlEntry"></td>
<td><span class="help-mark" title="The complete URL to the upload server endpoint:
For S3: E.g. http://my.minio:9000. Leave it empty for AWS!
For WebDAV: E.g. https://my.cloud/remote.php/dav/files/me/">?</span></td>
</tr>
<tr class="settings-item" required="true" depends="uploadEnabled uploadService!=(s3)">
<td class="settings-item-label"><span class="settings-item-label">Location</span></td>
<td class="settings-item-value"><input type="text" class="styled storage camera-config validator text-validator" id="uploadLocationEntry" title=""></td>
<td><span class="help-mark" title="the location (root path) where media files should be uploaded (e.g. /files/cam1/)">?</span></td>
</tr>
<tr class="settings-item" depends="uploadEnabled uploadService!=(gphoto)">
<td class="settings-item-label"><span class="settings-item-label">Include Subfolders</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled storage camera-config" id="uploadSubfoldersSwitch">
<div class="check-box styled storage camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="enable this to upload the media files together with their subfolders, instead of placing them directly into the root location">?</span></td>
</tr>
<tr class="settings-item" depends="uploadEnabled uploadService=(gdrive)">
<td class="settings-item-label"><span class="settings-item-label">Clean Cloud</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled storage camera-config" id="cleanCloudEnabledSwitch">
<div class="check-box styled storage camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="enable this to delete the uploaded media files on cloud as well when the local media files get deleted according to file persistence setting, currently this option is available only for gdrive.">?</span>
</td>
</tr>
<tr class="settings-item" depends="uploadEnabled uploadService=(ftp|sftp|http|https|webdav)">
<td class="settings-item-label"><span class="settings-item-label">Username</span></td>
<td class="settings-item-value"><input type="text" autocapitalize="none" class="styled storage camera-config" id="uploadUsernameEntry"></td>
<td><span class="help-mark" title="the username for the upload service account">?</span></td>
</tr>
<tr class="settings-item" depends="uploadEnabled uploadService=(ftp|sftp|http|https|webdav)">
<td class="settings-item-label"><span class="settings-item-label">Password</span></td>
<td class="settings-item-value"><input type="password" autocomplete="new-password" class="styled storage camera-config" id="uploadPasswordEntry"></td>
<td><span class="help-mark" title="the password for the upload service account">?</span></td>
</tr>
<tr class="settings-item" depends="uploadEnabled uploadService=(gdrive|gphoto|dropbox)">
<td class="settings-item-label"><span class="settings-item-label">Authorization key</span></td>
<td class="settings-item-value"><input type="password" autocomplete="new-password" class="styled storage camera-config" id="uploadAuthorizationKeyEntry"></td>
<td><span class="help-mark" title="the key used to authenticate with the upload service (normally required only during setup)">?</span></td>
</tr>
<tr class="settings-item" depends="uploadEnabled uploadService=(gdrive|gphoto|dropbox)">
<td class="settings-item-label"><span class="settings-item-label"></span></td>
<td class="settings-item-value">
<div class="html styled storage camera-config" id="authorizeLinkHtml">
<a href="javascript:authorizeUpload()">Obtain key</a>
</div>
</td>
<td><span class="help-mark" title="click here to obtain the service authorization key">?</span></td>
</tr>
<tr class="settings-item" depends="uploadEnabled uploadService=(s3)">
<td class="settings-item-label"><span class="settings-item-label">Access Key</span></td>
<td class="settings-item-value"><input type="password" autocomplete="new-password" class="styled storage camera-config" id="uploadAccessKeyEntry"></td>
<td><span class="help-mark" title="The AWS Access Key Used To Authenticate with the Upload Service">?</span></td>
</tr>
<tr class="settings-item" depends="uploadEnabled uploadService=(s3)">
<td class="settings-item-label"><span class="settings-item-label">Secret Access Key</span></td>
<td class="settings-item-value"><input type="password" autocomplete="new-password" class="styled storage camera-config" id="uploadSecretKeyEntry"></td>
<td><span class="help-mark" title="the AWS secret access key used to authenticate with the upload service (usually required only during configuration)">?</span></td>
</tr>
<tr class="settings-item" depends="uploadEnabled uploadService=(s3)">
<td class="settings-item-label"><span class="settings-item-label">Bucket</span></td>
<td class="settings-item-value"><input type="text" class="styled storage camera-config" id="uploadBucketEntry"></td>
<td><span class="help-mark" title="the S3 bucket name for the upload service (normally required only during setup)">?</span></td>
</tr>
<tr class="settings-item" depends="uploadEnabled">
<td class="settings-item-label"><span class="settings-item-label"></span></td>
<td class="settings-item-value">
<div class="button normal-button test-button" id="uploadTestButton">Test service</div>
</td>
<td><span class="help-mark" title="click this button to test the upload service after you have filled in the required details">?</span></td>
</tr>
<tr class="settings-item">
<td colspan="100">
<div class="settings-item-separator"></div>
</td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Call A Web Hook</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled storage camera-config" id="webHookStorageEnabledSwitch">
<div class="check-box styled storage camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="enable this if you want a URL to be requested after a media file is created">?</span></td>
</tr>
<tr class="settings-item" required="true" depends="webHookStorageEnabled" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Web Hook URL</span></td>
<td class="settings-item-value"><input type="text" class="styled storage camera-config validator text-validator" id="webHookStorageUrlEntry" placeholder="e.g. http://example.com/notify/" title=""></td>
<td><span class="help-mark"
title="a URL to be requested when motion is detected; the following special tokens are accepted: %Y = year, %m = month, %d = day, %H = hour, %M = minute, %S = second, %q = frame number, %v = event number, %f = file path">?</span></td>
</tr>
<tr class="settings-item" depends="webHookStorageEnabled">
<td class="settings-item-label"><span class="settings-item-label">HTTP method</span></td>
<td class="settings-item-value">
<select class="styled storage camera-config" id="webHookStorageHttpMethodSelect">
<option value="GET">GET</option>
<option value="POST">POST (query)</option>
<option value="POSTf">POST (form)</option>
<option value="POSTj">POST (json)</option>
</select>
</td>
<td><span class="help-mark" title="the HTTP method to use when requesting the web hook URL (the given URL-encoded parameters will in fact be transmitted as indicated here)">?</span></td>
</tr>
<tr class="settings-item">
<td colspan="100">
<div class="settings-item-separator"></div>
</td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Run A Command</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled storage camera-config" id="commandStorageEnabledSwitch">
<div class="check-box styled storage camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="enable this if you want to execute a command after a media file is created">?</span></td>
</tr>
<tr class="settings-item" required="true" depends="commandStorageEnabled" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Command</span></td>
<td class="settings-item-value"><input type="text" class="styled storage camera-config validator text-validator" id="commandStorageEntry" placeholder="Order…" title=""></td>
<td><span class="help-mark"
title="a command to be executed after a media file is created; multiple commands can be separated by a semicolon; don't use semicolons inside commands; the following special tokens are accepted: %Y = year, %m = month, %d = day, %H = hour, %M = minute, %S = second, %q = frame number, %v = event number, %f = file path">?</span>
</td>
</tr>
</tbody>
</table>
<!-- Text Overlay -->
<div class="settings-section-title" id="textOverlaySectionDiv">
<input type="checkbox" class="styled section text-overlay camera-config" id="textOverlayEnabledSwitch">
<div class="check-box styled section text-overlay camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
<span class="help-mark" title="choose what information is displayed on the captured frames">?</span>
<a class="settings-section-title">Text Overlay</a>
<span class="minimize"></span>
</div>
<table class="settings">
<tbody>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Left Text</span></td>
<td class="settings-item-value">
<select class="styled text-overlay camera-config" id="leftTextTypeSelect">
<option value="camera-name">Camera Name</option>
<option value="timestamp">Timestamp</option>
<option value="custom-text">Custom Text</option>
<option value="disabled">Disabled</option>
</select>
</td>
<td><span class="help-mark" title="sets the text displayed on the movies and images, on the lower left corner">?</span></td>
</tr>
<tr class="settings-item" required="true" depends="leftTextType=custom-text" strip="true">
<td class="settings-item-label"></td>
<td class="settings-item-value"><input type="text" class="styled text-overlay camera-config validator text-validator" id="leftTextEntry" placeholder="Custom text…" title=""></td>
<td><span class="help-mark"
title="sets a custom left text; the following special tokens are accepted: %Y = year, %m = month, %d = day, %H = hour, %M = minute, %S = second, %q = frame number, %v = event number, %T = HH:MM:SS, \n = new line">?</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Right Text</span></td>
<td class="settings-item-value">
<select class="styled text-overlay camera-config" id="rightTextTypeSelect">
<option value="camera-name">Camera Name</option>
<option value="timestamp">Timestamp</option>
<option value="custom-text">Custom Text</option>
<option value="disabled">Disabled</option>
</select>
</td>
<td><span class="help-mark" title="Sets the text displayed on the movies and pictures, in the lower right corner">?</span></td>
</tr>
<tr class="settings-item" required="true" depends="rightTextType=custom-text" strip="true">
<td class="settings-item-label"></td>
<td class="settings-item-value"><input type="text" class="styled text-overlay camera-config validator text-validator" id="rightTextEntry" placeholder="Custom text…" title=""></td>
<td><span class="help-mark"
title="sets a custom right text; the following special tokens are accepted: %Y = year, %m = month, %d = day, %H = hour, %M = minute, %S = second, %q = frame number, %v = number of event, %T = HH: MM: SS, \n = new line">?</span></td>
</tr>
<tr class="settings-item" min="1" max="10" snap="1" ticksnum="10" decimals="0">
<td class="settings-item-label"><span class="settings-item-label">Text Scale</span></td>
<td class="settings-item-value"><input type="text" class="range styled text-overlay camera-config" id="textScaleSlider">
<div class="slider range styled text-overlay camera-config" tabindex="0">
<div class="slider-labels"><span class="slider-label" style="left: -10%;">1</span><span class="slider-label" style="left: 1.11111%;">2</span><span class="slider-label" style="left: 12.2222%;">3</span><span class="slider-label"
style="left: 23.3333%;">4</span><span class="slider-label" style="left: 34.4444%;">5</span><span class="slider-label" style="left: 45.5556%;">6</span><span class="slider-label" style="left: 56.6667%;">7</span><span
class="slider-label" style="left: 67.7778%;">8</span><span class="slider-label" style="left: 78.8889%;">9</span><span class="slider-label" style="left: 90%;">10</span></div>
<div class="slider-bar">
<div class="slider-bar-inside"></div>
<div class="slider-cursor" style="left: 0%;">
<div class="slider-cursor-label">1</div>
</div>
</div>
</div>
</td>
<td><span class="help-mark" title="sets the size of the overlay text">?</span></td>
</tr>
</tbody>
</table>
<!-- Video Streaming -->
<div class="settings-section-title" minimize-switch-independent="true" id="streamingSectionDiv">
<input type="checkbox" class="styled section streaming camera-config" id="videoStreamingEnabledSwitch">
<div class="check-box styled section streaming camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
<span class="help-mark" title="enable this if you want video streaming for this camera">?</span>
<a class="settings-section-title">Video Streaming</a>
<span class="minimize"></span>
</div>
<table class="settings">
<tbody>
<tr class="settings-item" min="1" max="30" snap="0" ticks="1|5|10|15|20|25|30" decimals="0">
<td class="settings-item-label"><span class="settings-item-label">Streaming Frame Rate</span></td>
<td class="settings-item-value"><input type="text" class="range styled streaming camera-config" id="streamingFramerateSlider">
<div class="slider range styled streaming camera-config" tabindex="0">
<div class="slider-labels"><span class="slider-label" style="left: -10%;">1</span><span class="slider-label" style="left: 3.7931%;">5</span><span class="slider-label" style="left: 21.0345%;">10</span><span class="slider-label"
style="left: 38.2759%;">15</span><span class="slider-label" style="left: 55.5172%;">20</span><span class="slider-label" style="left: 72.7586%;">25</span><span class="slider-label" style="left: 90%;">30</span></div>
<div class="slider-bar">
<div class="slider-bar-inside"></div>
<div class="slider-cursor" style="left: 0%;">
<div class="slider-cursor-label">1</div>
</div>
</div>
</div>
</td>
<td><span class="help-mark" title="sets the number of frames transmitted every second on the live streaming.">?</span></td>
</tr>
<tr class="settings-item" min="0" max="100" snap="0" ticksnum="5" decimals="0" unit="%">
<td class="settings-item-label"><span class="settings-item-label">Streaming Quality</span></td>
<td class="settings-item-value"><input type="text" class="range styled streaming camera-config" id="streamingQualitySlider">
<div class="slider range styled streaming camera-config" tabindex="0">
<div class="slider-labels"><span class="slider-label" style="left: -10%;">0%</span><span class="slider-label" style="left: 15%;">25%</span><span class="slider-label" style="left: 40%;">50%</span><span class="slider-label"
style="left: 65%;">75%</span><span class="slider-label" style="left: 90%;">100%</span></div>
<div class="slider-bar">
<div class="slider-bar-inside"></div>
<div class="slider-cursor" style="left: 0%;">
<div class="slider-cursor-label">0%</div>
</div>
</div>
</div>
</td>
<td><span class="help-mark" title="sets the live streaming quality (higher values produce a better video quality but require more bandwidth).">?</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Streaming Image Resizing</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled streaming camera-config" id="streamingServerResizeSwitch">
<div class="check-box styled streaming camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="when this is enabled, the images are resized before they are sent to the browser (disable when running on a slow CPU).">?</span></td>
</tr>
<tr class="settings-item" min="0" max="100" snap="0" ticksnum="5" decimals="0" unit="%" depends="streamingServerResize">
<td class="settings-item-label"><span class="settings-item-label">Streaming Resolution</span></td>
<td class="settings-item-value"><input type="text" class="range styled streaming camera-config" id="streamingResolutionSlider">
<div class="slider range styled streaming camera-config" tabindex="0">
<div class="slider-labels"><span class="slider-label" style="left: -10%;">0%</span><span class="slider-label" style="left: 15%;">25%</span><span class="slider-label" style="left: 40%;">50%</span><span class="slider-label"
style="left: 65%;">75%</span><span class="slider-label" style="left: 90%;">100%</span></div>
<div class="slider-bar">
<div class="slider-bar-inside"></div>
<div class="slider-cursor" style="left: 0%;">
<div class="slider-cursor-label">0%</div>
</div>
</div>
</div>
</td>
<td><span class="help-mark" title="the streaming resolution given as percent of the video device resolution (higher values produce better video quality but require more bandwidth)">?</span></td>
</tr>
<tr class="settings-item" min="1024" max="65535" depends="videoStreamingEnabled" required="true">
<td class="settings-item-label"><span class="settings-item-label">Streaming Port</span></td>
<td class="settings-item-value"><input type="text" class="styled streaming camera-config validator text-validator" id="streamingPortEntry" title=""></td>
<td><span class="help-mark" title="sets the TCP port on which the webcam streaming server listens">?</span></td>
</tr>
<tr class="settings-item" depends="videoStreamingEnabled">
<td class="settings-item-label"><span class="settings-item-label">Authentication mode</span></td>
<td class="settings-item-value">
<select class="styled streaming camera-config" id="streamingAuthModeSelect">
<option value="disabled">Disabled</option>
<option value="basic">Basic</option>
<option value="digest">Digest</option>
</select>
</td>
<td><span class="help-mark" title="the authentication method used by the stream (choose Basic instead of Digest if you encounter issues with third party apps); surveillance credentials will be used">?</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Motion Optimization</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled streaming camera-config" id="streamingMotion">
<div class="check-box styled streaming camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="enable this if you want a lower frame rate for the live streaming when no motion is detected">?</span></td>
</tr>
<tr class="settings-item" depends="videoStreamingEnabled">
<td colspan="100">
<div class="settings-item-separator"></div>
</td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Useful URLs</span></td>
<td class="settings-item-value">
<div class="html styled streaming camera-config" id="streamingSnapshotUrlHtml">
<a href="javascript:showSnapshotUrl()">Snapshot URL</a>
</div>
</td>
<td><span class="help-mark" title="a URL that provides a JPEG image with the most recent snapshot of the camera">?</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"></td>
<td class="settings-item-value">
<div class="html styled streaming camera-config" id="streamingMjpgUrlHtml">
<a href="javascript:showMjpgUrl()">Streaming URL</a>
</div>
</td>
<td><span class="help-mark" title="a URL that provides a MJPEG stream of the camera">?</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"></td>
<td class="settings-item-value">
<div class="html styled streaming camera-config" id="streamingEmbedUrlHtml">
<a href="javascript:showEmbedUrl()">Embed URL</a>
</div>
</td>
<td><span class="help-mark" title="a URL that provides a minimal HTML document containing the camera frame, ready to be embedded">?</span></td>
</tr>
</tbody>
</table>
<!-- Still Images -->
<div class="settings-section-title" id="stillImagesSectionDiv">
<input type="checkbox" class="styled section still-images camera-config" id="stillImagesEnabledSwitch">
<div class="check-box styled section still-images camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
<span class="help-mark" title="enable this if you want to capture still images (pictures).">?</span>
<a class="settings-section-title">Still Images</a>
<span class="minimize"></span>
</div>
<table class="settings">
<tbody>
<tr class="settings-item" required="true" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Image File Name</span></td>
<td class="settings-item-value"><input type="text" class="styled still-images camera-config validator text-validator custom-validator" id="imageFileNameEntry" placeholder="File name Template…" title=""></td>
<td><span class="help-mark"
title="sets the name pattern for the image (JPEG) files; the following special tokens are accepted: %Y = year, %m = month, %d = day, %H = hour, %M = minute, %S = second, %q = frame number, %v = event number, / = subfolder.">?</span></td>
</tr>
<tr class="settings-item" min="0" max="100" snap="0" ticksnum="5" decimals="0" unit="%">
<td class="settings-item-label"><span class="settings-item-label">Image Quality</span></td>
<td class="settings-item-value"><input type="text" class="range styled still-images camera-config" id="imageQualitySlider">
<div class="slider range styled still-images camera-config" tabindex="0">
<div class="slider-labels"><span class="slider-label" style="left: -10%;">0%</span><span class="slider-label" style="left: 15%;">25%</span><span class="slider-label" style="left: 40%;">50%</span><span class="slider-label"
style="left: 65%;">75%</span><span class="slider-label" style="left: 90%;">100%</span></div>
<div class="slider-bar">
<div class="slider-bar-inside"></div>
<div class="slider-cursor" style="left: 0%;">
<div class="slider-cursor-label">0%</div>
</div>
</div>
</div>
</td>
<td><span class="help-mark" title="sets the JPEG image quality (higher values produce a better image quality but require more storage space)">?</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Capture mode</span></td>
<td class="settings-item-value">
<select class="styled still-images camera-config" id="captureModeSelect">
<option value="motion-triggered">Motion Triggered</option>
<option value="motion-triggered-one">Motion Triggered (One Picture)</option>
<option value="interval-snapshots">Interval Snapshots</option>
<option value="all-frames">All Frames</option>
<option value="manual">Manual</option>
</select>
</td>
<td><span class="help-mark" title="sets the image capture mode:
Motion Triggered = an image captured whenever motion is detected,
Interval Snapshots = an image captured every x seconds,
All Frames = saves each frame to an image file,
Manual = manual snapshots using snapshot button.">?</span></td>
</tr>
<tr class="settings-item" min="1" max="86400" required="true" depends="captureMode=interval-snapshots">
<td class="settings-item-label"><span class="settings-item-label">Snapshot Interval</span></td>
<td class="settings-item-value"><input type="text" class="styled number still-images camera-config validator text-validator number-validator" id="snapshotIntervalEntry" title=""><span class="settings-item-unit">seconds</span></td>
<td><span class="help-mark" title="sets the interval (in seconds) for the snapshots">?</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Preserve Pictures</span></td>
<td class="settings-item-value">
<select class="styled still-images camera-config" id="preservePicturesSelect">
<option value="1">For One Day</option>
<option value="7">For One Week</option>
<option value="30">For One Month</option>
<option value="365">For One Year</option>
<option value="0">Forever</option>
<option value="-1">Custom</option>
</select>
</td>
<td><span class="help-mark" title="images older than the specified duration are automatically deleted to free up storage space.">?</span></td>
</tr>
<tr class="settings-item" min="1" max="3650" depends="preservePictures=-1" required="true">
<td class="settings-item-label"><span class="settings-item-label">Picture Lifetime</span></td>
<td class="settings-item-value"><input type="text" class="styled number still-images camera-config validator text-validator number-validator" id="picturesLifetimeEntry" title=""><span class="settings-item-unit">days</span></td>
<td><span class="help-mark" title="sets the number of days after which the pictures will be deleted automatically.">?</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Enable Manual Snapshots</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled still-images camera-config" id="manualSnapshotsSwitch">
<div class="check-box styled still-images camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="when this is enabled, a button on the camera frame will allow you to manually take snapshots.">?</span></td>
</tr>
</tbody>
</table>
<!-- Movies -->
<div class="settings-section-title" id="moviesSectionDiv">
<input type="checkbox" class="styled section movies camera-config" id="moviesEnabledSwitch">
<div class="check-box styled section movies camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
<span class="help-mark" title="enable this if you want to record movies">?</span>
<a class="settings-section-title">Movies</a>
<span class="minimize"></span>
</div>
<table class="settings">
<tbody>
<tr class="settings-item" required="true" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Movie File Name</span></td>
<td class="settings-item-value"><input type="text" class="styled movies camera-config validator text-validator custom-validator" id="movieFileNameEntry" placeholder="File name Template…" title=""></td>
<td><span class="help-mark"
title="sets the name pattern for the movie files; the following special tokens are accepted: %Y = year, %m = month, %d = day, %H = hour, %M = minute, %S = second, %q = frame number, %v = event number, / = subfolder.">?</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Movie Passthrough</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled movies camera-config" id="moviePassthroughSwitch">
<div class="check-box styled movies camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark"
title="Create movie files of the motion directly from the camera. This option should reduce CPU usage but does increase memory requirements. No image processing is performed so text overlays, privacy masks etc will not be on the resulting video.">?</span>
</td>
</tr>
<tr class="settings-item" depends="!moviePassthrough">
<td class="settings-item-label"><span class="settings-item-label">Movie format</span></td>
<td class="settings-item-value">
<select class="styled movies camera-config" id="movieFormatSelect">
<option value="mpeg4">MPEG4 (.avi)</option>
<option value="msmpeg4">MSMPEG4v2 (.avi)</option>
<option value="swf">Small Web Format (.swf)</option>
<option value="flv">Flash Video (.flv)</option>
<option value="mov">QuickTime (.mov)</option>
<option value="mp4">H.264 (.mp4)</option>
<option value="mp4:h264_nvenc">H.264/NVENC (.mp4)</option>
<option value="mp4:h264_omx">H.264/OMX (.mp4)</option>
<option value="mp4:h264_v4l2m2m">H.264/V4L2M2M (.mp4)</option>
<option value="hevc">HEVC (.mp4)</option>
<option value="mp4:hevc_nvenc">HEVC/NVENC (.mp4)</option>
<option value="mkv">Matroska Video (.mkv)</option>
<option value="mkv:h264_omx">Matroska Video/OMX (.mkv)</option>
<option value="mkv:h264_v4l2m2m">Matroska Video/V4L2M2M (.mkv)</option>
</select>
</td>
<td><span class="help-mark" title="sets the movie file format; not all formats are guaranteed to work on all systems; if in doubt, test each format and select the one that works best with your video player.">?</span></td>
</tr>
<tr class="settings-item" min="0" max="100" snap="0" ticksnum="5" decimals="0" unit="%">
<td class="settings-item-label"><span class="settings-item-label">Movie Quality</span></td>
<td class="settings-item-value"><input type="text" class="range styled movies camera-config" id="movieQualitySlider">
<div class="slider range styled movies camera-config" tabindex="0">
<div class="slider-labels"><span class="slider-label" style="left: -10%;">0%</span><span class="slider-label" style="left: 15%;">25%</span><span class="slider-label" style="left: 40%;">50%</span><span class="slider-label"
style="left: 65%;">75%</span><span class="slider-label" style="left: 90%;">100%</span></div>
<div class="slider-bar">
<div class="slider-bar-inside"></div>
<div class="slider-cursor" style="left: 0%;">
<div class="slider-cursor-label">0%</div>
</div>
</div>
</div>
</td>
<td><span class="help-mark" title="sets the MPEG video quality (higher values produce a better video quality but require more storage space).">?</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Recording Mode</span></td>
<td class="settings-item-value">
<select class="styled movies camera-config" id="recordingModeSelect">
<option value="motion-triggered">Motion Triggered</option>
<option value="continuous">Continuous Recording</option>
</select>
</td>
<td><span class="help-mark" title="sets the recording mode: Motion Triggered = a new movie created whenever motion is detected, Continuous Recording = one big movie file.">?</span></td>
</tr>
<tr class="settings-item" min="0" max="86400" required="true">
<td class="settings-item-label"><span class="settings-item-label">Maximum Movie Length</span></td>
<td class="settings-item-value"><input type="text" class="number styled movies camera-config validator text-validator number-validator" id="maxMovieLengthEntry" title=""><span class="settings-item-unit">seconds</span></td>
<td><span class="help-mark" title="sets the maximum length of movies, in seconds; if the motion event lasts longer, a new movie file is created; use 0 for unlimited length.">?</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Preserve Movies</span></td>
<td class="settings-item-value">
<select class="styled movies camera-config" id="preserveMoviesSelect">
<option value="1">For One Day</option>
<option value="7">For One Week</option>
<option value="30">For One Month</option>
<option value="365">For One Year</option>
<option value="0">Forever</option>
<option value="-1">Custom</option>
</select>
</td>
<td><span class="help-mark" title="movies older than the specified duration are automatically deleted to free up storage space.">?</span></td>
</tr>
<tr class="settings-item" min="1" max="3650" depends="preserveMovies=-1" required="true">
<td class="settings-item-label"><span class="settings-item-label">Movies Lifetime</span></td>
<td class="settings-item-value"><input type="text" class="styled number movies camera-config validator text-validator number-validator" id="moviesLifetimeEntry" title=""><span class="settings-item-unit">days</span></td>
<td><span class="help-mark" title="sets the number of days after which the movies will be deleted automatically.">?</span></td>
</tr>
</tbody>
</table>
<!-- Motion Detection -->
<div class="settings-section-title" id="motionDetectionSectionDiv">
<input type="checkbox" class="styled section motion-detection camera-config" id="motionDetectionEnabledSwitch">
<div class="check-box styled section motion-detection camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
<span class="help-mark" title="enable this to use and configure the motion detection mechanism.">?</span>
<a class="settings-section-title">Motion Detection</a>
<span class="minimize"></span>
</div>
<table class="settings">
<tbody>
<tr class="settings-item" min="0" max="20" snap="0" ticksnum="5" decimals="1" unit="%" depends="!autoThresholdTuning">
<td class="settings-item-label"><span class="settings-item-label">Frame Change Threshold</span></td>
<td class="settings-item-value"><input type="text" class="range styled motion-detection camera-config" id="frameChangeThresholdSlider">
<div class="slider range styled motion-detection camera-config" tabindex="0">
<div class="slider-labels"><span class="slider-label" style="left: -10%;">0%</span><span class="slider-label" style="left: 15%;">5%</span><span class="slider-label" style="left: 40%;">10%</span><span class="slider-label"
style="left: 65%;">15%</span><span class="slider-label" style="left: 90%;">20%</span></div>
<div class="slider-bar">
<div class="slider-bar-inside"></div>
<div class="slider-cursor" style="left: 0%;">
<div class="slider-cursor-label">0.0%</div>
</div>
</div>
</div>
</td>
<td><span class="help-mark"
title="indicates the minimal percent of the image that must change between two successive frames in order for motion to be detected (smaller values give a more sensitive detection, but are prone to false positives).">?</span></td>
</tr>
<tr class="settings-item" min="0" required="true" depends="!autoThresholdTuning">
<td class="settings-item-label"><span class="settings-item-label">Maximum Change Threshold</span></td>
<td class="settings-item-value"><input type="text" class="number styled motion-detection camera-config validator text-validator number-validator" id="maxFrameChangeThresholdEntry" title=""><span class="settings-item-unit">pixels</span></td>
<td><span class="help-mark" title="sets the number of pixels changed between frames above which motion is no longer triggered (0 disables the limit).">?</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Automatic Threshold Tuning</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled motion-detection camera-config" id="autoThresholdTuningSwitch">
<div class="check-box styled motion-detection camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="enable this to automatically adjust the threshold.">?</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Automatic Noise Detection</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled motion-detection camera-config" id="autoNoiseDetectSwitch">
<div class="check-box styled motion-detection camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="enable this to automatically adjust the noise level.">?</span></td>
</tr>
<tr class="settings-item" min="0" max="25" snap="0" ticksnum="6" decimals="0" unit="%" depends="!autoNoiseDetect">
<td class="settings-item-label"><span class="settings-item-label">Noise Level</span></td>
<td class="settings-item-value"><input type="text" class="range styled motion-detection camera-config" id="noiseLevelSlider">
<div class="slider range styled motion-detection camera-config" tabindex="0">
<div class="slider-labels"><span class="slider-label" style="left: -10%;">0%</span><span class="slider-label" style="left: 10%;">5%</span><span class="slider-label" style="left: 30%;">10%</span><span class="slider-label"
style="left: 50%;">15%</span><span class="slider-label" style="left: 70%;">20%</span><span class="slider-label" style="left: 90%;">25%</span></div>
<div class="slider-bar">
<div class="slider-bar-inside"></div>
<div class="slider-cursor" style="left: 0%;">
<div class="slider-cursor-label">0%</div>
</div>
</div>
</div>
</td>
<td><span class="help-mark" title="manually sets the noise level to a fixed value.">?</span></td>
</tr>
<tr class="settings-item" min="0" max="100" snap="0" ticksnum="5" decimals="0" unit="%">
<td class="settings-item-label"><span class="settings-item-label">Light Switch Detection</span></td>
<td class="settings-item-value"><input type="text" class="range styled motion-detection camera-config" id="lightSwitchDetectSlider">
<div class="slider range styled motion-detection camera-config" tabindex="0">
<div class="slider-labels"><span class="slider-label" style="left: -10%;">0%</span><span class="slider-label" style="left: 15%;">25%</span><span class="slider-label" style="left: 40%;">50%</span><span class="slider-label"
style="left: 65%;">75%</span><span class="slider-label" style="left: 90%;">100%</span></div>
<div class="slider-bar">
<div class="slider-bar-inside"></div>
<div class="slider-cursor" style="left: 0%;">
<div class="slider-cursor-label">0%</div>
</div>
</div>
</div>
</td>
<td><span class="help-mark" title="sets the percentage of the image that needs to change so that the event is treated as a sudden light change instead of motion (0% disables the function).">?</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Despeckle Filter</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled motion-detection camera-config" id="despeckleFilterSwitch">
<div class="check-box styled motion-detection camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="enable this to apply a despeckle filter to frames before detecting motion.">?</span></td>
</tr>
<tr class="settings-item">
<td colspan="100">
<div class="settings-item-separator"></div>
</td>
</tr>
<tr class="settings-item" min="0" max="86400" required="true">
<td class="settings-item-label"><span class="settings-item-label">Motion Gap</span></td>
<td class="settings-item-value"><input type="text" class="number styled motion-detection camera-config validator text-validator number-validator" id="eventGapEntry" title=""><span class="settings-item-unit">seconds</span></td>
<td><span class="help-mark" title="sets the number of seconds of silence (i.e. no motion) that mark the end of a motion event.">?</span></td>
</tr>
<tr class="settings-item" min="0" max="1000" required="true">
<td class="settings-item-label"><span class="settings-item-label">Captured Before</span></td>
<td class="settings-item-value"><input type="text" class="number styled motion-detection camera-config validator text-validator number-validator" id="preCaptureEntry" title=""><span class="settings-item-unit">frames</span></td>
<td><span class="help-mark" title="sets the number of frames to be captured (and included in the movie) before a motion event is detected.">?</span></td>
</tr>
<tr class="settings-item" min="0" max="1000" required="true">
<td class="settings-item-label"><span class="settings-item-label">Captured After</span></td>
<td class="settings-item-value"><input type="text" class="number styled motion-detection camera-config validator text-validator number-validator" id="postCaptureEntry" title=""><span class="settings-item-unit">frames</span></td>
<td><span class="help-mark" title="sets the number of frames to be captured (and included in the movie) after the end of a motion event.">?</span></td>
</tr>
<tr class="settings-item" min="1" max="1000" required="true">
<td class="settings-item-label"><span class="settings-item-label">Minimum Motion Frames</span></td>
<td class="settings-item-value"><input type="text" class="number styled motion-detection camera-config validator text-validator number-validator" id="minimumMotionFramesEntry" title=""><span class="settings-item-unit">frames</span></td>
<td><span class="help-mark" title="sets the minimum number of successive motion frames required to start a motion event.">?</span></td>
</tr>
<tr class="settings-item">
<td colspan="100">
<div class="settings-item-separator"></div>
</td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Mask</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled motion-detection camera-config" id="motionMaskSwitch">
<div class="check-box styled motion-detection camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="enables image masking for a more selective and precise motion detection.">?</span></td>
</tr>
<tr class="settings-item" depends="motionMask">
<td class="settings-item-label"><span class="settings-item-label">Mask Type</span></td>
<td class="settings-item-value">
<select class="styled motion-detection camera-config" id="motionMaskTypeSelect">
<option value="smart">Smart</option>
<option value="editable">"Editable"</option>
</select>
</td>
<td><span class="help-mark" title="the smart option automatically detects regions with regular motion and dynamically builds an internal mask, while the editable mask allows you to manually build it yourself.">?</span></td>
</tr>
<tr class="settings-item" min="1" max="10" snap="1" ticksnum="10" decimals="0" unit="" depends="motionMask motionMaskType=smart">
<td class="settings-item-label"><span class="settings-item-label">Smart Mask Sluggishness</span></td>
<td class="settings-item-value"><input type="text" class="range styled motion-detection camera-config" id="smartMaskSluggishnessSlider">
<div class="slider range styled motion-detection camera-config" tabindex="0">
<div class="slider-labels"><span class="slider-label" style="left: -10%;">1</span><span class="slider-label" style="left: 1.11111%;">2</span><span class="slider-label" style="left: 12.2222%;">3</span><span class="slider-label"
style="left: 23.3333%;">4</span><span class="slider-label" style="left: 34.4444%;">5</span><span class="slider-label" style="left: 45.5556%;">6</span><span class="slider-label" style="left: 56.6667%;">7</span><span
class="slider-label" style="left: 67.7778%;">8</span><span class="slider-label" style="left: 78.8889%;">9</span><span class="slider-label" style="left: 90%;">10</span></div>
<div class="slider-bar">
<div class="slider-bar-inside"></div>
<div class="slider-cursor" style="left: 0%;">
<div class="slider-cursor-label">1</div>
</div>
</div>
</div>
</td>
<td><span class="help-mark" title="higher values result in a longer-lasting smart mask with a slower building process.">?</span></td>
</tr>
<tr class="settings-item" depends="motionMask motionMaskType=editable">
<td class="settings-item-label"><span class="settings-item-label"></span></td>
<td class="settings-item-value">
<div class="button normal-button edit-mask-button" id="motionMaskEditButton">Edit Mask</div>
<div class="button normal-button save-mask-button" id="motionMaskSaveButton">Save Mask</div>
<input type="text" class="motion-detection camera-config" id="motionMaskLinesEntry">
</td>
<td><span class="help-mark" title="click this button to clear the current mask.">?</span></td>
</tr>
<tr class="settings-item" depends="motionMask motionMaskType=editable">
<td class="settings-item-label"><span class="settings-item-label"></span></td>
<td class="settings-item-value">
<div class="button normal-button clear-mask-button" id="motionMaskClearButton">Clear Mask</div>
</td>
<td><span class="help-mark" title="click this button to clear the current mask.">?</span></td>
</tr>
<tr class="settings-item">
<td colspan="100">
<div class="settings-item-separator"></div>
</td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Show Frame Changes</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled motion-detection camera-config" id="showFrameChangesSwitch">
<div class="check-box styled motion-detection camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="if this is enabled, frame changes (number of pixels as well as the changed area) are shown on the video; temporarily enable this option to help adjust the motion detection parameters.">?</span></td>
</tr>
<tr class="settings-item">
<td class="settings-item-label"><span class="settings-item-label">Create Debug Media Files</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled motion-detection camera-config" id="createDebugMediaSwitch">
<div class="check-box styled motion-detection camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="when enabled, creates special movies and pictures that help debugging motion detection problems.">?</span></td>
</tr>
</tbody>
</table>
<!-- Motion Notifications -->
<div class="settings-section-title" id="notificationsSectionDiv">
<span class="help-mark" title="enable this if you want to be notified when motion is detected.">?</span>
<a class="settings-section-title">Motion Notifications</a>
<span class="minimize"></span>
</div>
<table class="settings">
<tbody>
<tr class="settings-item" depends="motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label"><strong>Actions when motion</strong></span></td>
<td class="settings-item-value"><span class="settings-item-label"><strong>has started:</strong></span></td>
</tr>
<tr class="settings-item" depends="motionDetectionEnabled">
<td colspan="100">
<div class="settings-item-separator"></div>
</td>
</tr>
<tr class="settings-item" depends="motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label">Send An Email</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled notifications camera-config" id="emailNotificationsEnabledSwitch">
<div class="check-box styled notifications camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="enable this if you want to receive an email whenever a motion event is detected.">?</span></td>
</tr>
<tr class="settings-item" required="true" depends="emailNotificationsEnabled motionDetectionEnabled" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Email Addresses</span></td>
<td class="settings-item-value"><input type="text" autocomplete="new-password" class="styled notifications camera-config validator text-validator custom-validator" id="emailAddressesEntry" placeholder="Email addresses…" title=""></td>
<td><span class="help-mark" title="email addresses (separated by comma) that are added here will receive notifications whenever a motion event is detected.">?</span></td>
</tr>
<tr class="settings-item" required="true" depends="emailNotificationsEnabled motionDetectionEnabled" strip="true">
<td class="settings-item-label"><span class="settings-item-label">SMTP Server</span></td>
<td class="settings-item-value"><input type="text" class="styled notifications camera-config validator text-validator" id="smtpServerEntry" placeholder="e.g. smtp.gmail.com" title=""></td>
<td><span class="help-mark" title="enter the hostname or IP address of your SMTP server (for Gmail use smtp.gmail.com).">?</span></td>
</tr>
<tr class="settings-item" min="1" max="65535" depends="emailNotificationsEnabled motionDetectionEnabled" required="true">
<td class="settings-item-label"><span class="settings-item-label">SMTP Port</span></td>
<td class="settings-item-value"><input type="text" class="styled number notifications camera-config validator text-validator number-validator" id="smtpPortEntry" placeholder="e.g. 587" title=""></td>
<td><span class="help-mark" title="enter the port used by your SMTP server (usually 465 for non-TLS connections and 587 for TLS connections).">?</span></td>
</tr>
<tr class="settings-item" depends="emailNotificationsEnabled motionDetectionEnabled" strip="true">
<td class="settings-item-label"><span class="settings-item-label">SMTP Account</span></td>
<td class="settings-item-value"><input type="text" class="styled notifications camera-config" id="smtpAccountEntry" placeholder="account@gmail.com…"></td>
<td><span class="help-mark" title="enter your SMTP account (normally your email address).">?</span></td>
</tr>
<tr class="settings-item" depends="emailNotificationsEnabled motionDetectionEnabled" strip="true">
<td class="settings-item-label"><span class="settings-item-label">SMTP Password</span></td>
<td class="settings-item-value"><input type="password" autocomplete="new-password" class="styled notifications camera-config" id="smtpPasswordEntry"></td>
<td><span class="help-mark" title="enter your SMTP account password (for Gmail use your Google password or an app-specific generated password).">?</span></td>
</tr>
<tr class="settings-item" depends="emailNotificationsEnabled motionDetectionEnabled" strip="true">
<td class="settings-item-label"><span class="settings-item-label">From Address</span></td>
<td class="settings-item-value"><input type="text" class="styled notifications camera-config validator custom-validator" id="emailFromEntry" placeholder="Email address…" title=""></td>
<td><span class="help-mark" title="set a custom From address, if your SMTP service requires one (the first destination email address will be used if left blank).">?</span></td>
</tr>
<tr class="settings-item" depends="emailNotificationsEnabled motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label">Use TLS</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled notifications camera-config" id="smtpTlsSwitch">
<div class="check-box styled notifications camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="enable this if your SMTP server requires TLS (Gmail needs this to be enabled).">?</span></td>
</tr>
<tr class="settings-item" min="0" max="60" required="true" depends="emailNotificationsEnabled motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label">Attached Pictures Time Span</span></td>
<td class="settings-item-value"><input type="text" class="number styled notifications camera-config validator text-validator number-validator" id="emailPictureTimeSpanEntry" title=""><span class="settings-item-unit">seconds</span></td>
<td><span class="help-mark"
title="defines the picture search time interval to use when creating email attachments (higher values generate emails with more pictures at the cost of an increased notification delay); set to 0 to disable picture attachments; you must also enable Still Images for this to work.">?</span>
</td>
</tr>
<tr class="settings-item" depends="emailNotificationsEnabled motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label"></span></td>
<td class="settings-item-value">
<div class="button normal-button test-button" id="emailTestButton">Test Email</div>
</td>
<td><span class="help-mark" title="click this button to test email notifications after you have filled in the required details.">?</span></td>
</tr>
<tr class="settings-item" depends="motionDetectionEnabled">
<td colspan="100">
<div class="settings-item-separator"></div>
</td>
</tr>
<tr class="settings-item" depends="motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label">Send Telegram Notification</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled notifications camera-config" id="telegramNotificationsEnabledSwitch">
<div class="check-box styled notifications camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="enable this if you want to receive a telegram message whenever a moving event is detected">?</span></td>
</tr>
<tr class="settings-item" required="true" depends="telegramNotificationsEnabled motionDetectionEnabled" strip="true">
<td class="settings-item-label"><span class="settings-item-label">HTTP API token</span></td>
<td class="settings-item-value"><input type="text" autocomplete="new-password" class="styled notifications camera-config validator text-validator" id="telegramAPIEntry"
placeholder="Example: 93847672:AACdSn843hsjJsh32bSmdN3sHsh2bsh0xRs_32dbcr1W" title=""></td>
<td><span class="help-mark"
title="By creating the Telegram-Bot chat, you will get an API token that you need to enter here. Click the API button below for a step-by-step guide on how to get your API token. Also be sure to chat with your newly created " bot"=""
after="" your="" key="" is="" generated,="" to="" make="" sure="" you="" get="" messages."="">?</span></td>
</tr>
<tr class="settings-item" required="true" depends="telegramNotificationsEnabled motionDetectionEnabled" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Chat ID</span></td>
<td class="settings-item-value"><input type="text" autocomplete="new-password" class="styled notifications camera-config validator text-validator" id="telegramCIDEntry" placeholder="Example: 938272312" title=""></td>
<td><span class="help-mark" title="Create a new chat to id_chatbot (@id_chatbot) and choose to start. The chat will return the required number for this field.">?</span></td>
</tr>
<tr class="settings-item" min="0" max="60" required="true" depends="telegramNotificationsEnabled motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label">Attached Images Time</span></td>
<td class="settings-item-value"><input type="text" class="number styled notifications camera-config validator text-validator number-validator" id="telegramPictureTimeSpanEntry" title=""><span class="settings-item-unit">seconds</span></td>
<td><span class="help-mark"
title="defines the image search time interval to create telegram attachments (higher values generate more images at the cost of increased notification delay); set to 0 to disable image attachments; you must also enable Still Images for this to work; you will want to play with this number until an image is sent. A good starting number is 30 if you set still images to one motion triggered. For a standard move triggered, set this much lower.">?</span>
</td>
</tr>
<tr class="settings-item" required="true" depends="telegramNotificationsEnabled motionDetectionEnabled" strip="true">
<td class="settings-item-label"><a href="https://core.telegram.org/bots#6-botfather" target="_blank"><div class="button normal-button test-button" id="apiInstructionButton" style="opacity: 1; display: inline-block;">API Information</div></a>
</td>
<td class="settings-item-label">
<div class="button normal-button test-button" id="telegramTestButton" style="opacity: 1; display: inline-block;">Test</div>
</td>
</tr>
<tr class="settings-item" depends="motionDetectionEnabled">
<td colspan="100">
<div class="settings-item-separator"></div>
</td>
</tr>
<tr class="settings-item" depends="motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label">Call A Web Hook</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled notifications camera-config" id="webHookNotificationsEnabledSwitch">
<div class="check-box styled notifications camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="enable this if you want a URL to be requested whenever a motion event is detected.">?</span></td>
</tr>
<tr class="settings-item" required="true" depends="webHookNotificationsEnabled motionDetectionEnabled" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Web Hook URL</span></td>
<td class="settings-item-value"><input type="text" class="styled notifications camera-config validator text-validator custom-validator" id="webHookNotificationsUrlEntry" placeholder="e.g. http://example.com/notify/" title=""></td>
<td><span class="help-mark" title="a URL to be requested when motion is detected; the following special tokens are accepted: %Y = year, %m = month, %d = day, %H = hour, %M = minute, %S = second, %q = frame number, %v = event number">?</span>
</td>
</tr>
<tr class="settings-item" depends="webHookNotificationsEnabled motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label">HTTP method</span></td>
<td class="settings-item-value">
<select class="styled notifications camera-config" id="webHookNotificationsHttpMethodSelect">
<option value="GET">GET</option>
<option value="POST">POST (query)</option>
<option value="POSTf">POST (form)</option>
<option value="POSTj">POST (json)</option>
</select>
</td>
<td><span class="help-mark" title="the HTTP method to use when requesting the web hook URL (the given URL-encoded parameters will in fact be transmitted as indicated here).">?</span></td>
</tr>
<tr class="settings-item" depends="motionDetectionEnabled">
<td colspan="100">
<div class="settings-item-separator"></div>
</td>
</tr>
<tr class="settings-item" depends="motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label">Run A Command</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled notifications camera-config" id="commandNotificationsEnabledSwitch">
<div class="check-box styled notifications camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="enable this if you want to execute a command whenever a motion event is detected.">?</span></td>
</tr>
<tr class="settings-item" required="true" depends="commandNotificationsEnabled motionDetectionEnabled" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Command</span></td>
<td class="settings-item-value"><input type="text" class="styled notifications camera-config validator text-validator" id="commandNotificationsEntry" placeholder="Command…" title=""></td>
<td><span class="help-mark"
title="a command to be executed when motion is detected; multiple commands can be separated by a semicolon; don't use semicolons inside commands; the following special tokens are accepted: %Y = year, %m = month, %d = day, %H = hour, %M = minute, %S = second, %q = frame number, %v = event number">?</span>
</td>
</tr>
<tr class="settings-item" depends="motionDetectionEnabled">
<td colspan="100">
<div class="settings-item-separator"></div>
</td>
</tr>
<tr class="settings-item" depends="motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label"><strong>Actions when motion</strong></span></td>
<td class="settings-item-value"><span class="settings-item-label"><strong>has ended:</strong></span></td>
</tr>
<tr class="settings-item" depends="motionDetectionEnabled">
<td colspan="100">
<div class="settings-item-separator"></div>
</td>
</tr>
<tr class="settings-item" depends="motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label">Call A Web Hook</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled notifications camera-config" id="webHookEndNotificationsEnabledSwitch">
<div class="check-box styled notifications camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="enable this if you want a URL to be requested whenever a motion event ends">?</span></td>
</tr>
<tr class="settings-item" required="true" depends="webHookEndNotificationsEnabled motionDetectionEnabled" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Web Hook URL</span></td>
<td class="settings-item-value"><input type="text" class="styled notifications camera-config validator text-validator custom-validator" id="webHookEndNotificationsUrlEntry" placeholder="e.g. http://example.com/notify/" title=""></td>
<td><span class="help-mark"
title="a single URL to be requested when motion event ends; the following special tokens are accepted: %Y = year, %m = month, %d = day, %H = hour, %M = minute, %S = second, %q = frame number, %v = event number">?</span></td>
</tr>
<tr class="settings-item" depends="webHookEndNotificationsEnabled motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label">HTTP method</span></td>
<td class="settings-item-value">
<select class="styled notifications camera-config" id="webHookEndNotificationsHttpMethodSelect">
<option value="GET">GET</option>
<option value="POST">POST (query)</option>
<option value="POSTf">POST (form)</option>
<option value="POSTj">POST (json)</option>
</select>
</td>
<td><span class="help-mark" title="the HTTP method to use when requesting the web hook URL (the given URL-encoded parameters will in fact be transmitted as indicated here).">?</span></td>
</tr>
<tr class="settings-item" depends="motionDetectionEnabled">
<td colspan="100">
<div class="settings-item-separator"></div>
</td>
</tr>
<tr class="settings-item" depends="motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label">Run A Command</span></td>
<td class="settings-item-value"><input type="checkbox" class="styled notifications camera-config" id="commandEndNotificationsEnabledSwitch">
<div class="check-box styled notifications camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
<td><span class="help-mark" title="enable this if you want to execute a command whenever a motion event ends.">?</span></td>
</tr>
<tr class="settings-item" required="true" depends="commandEndNotificationsEnabled motionDetectionEnabled" strip="true">
<td class="settings-item-label"><span class="settings-item-label">Command</span></td>
<td class="settings-item-value"><input type="text" class="styled notifications camera-config validator text-validator" id="commandEndNotificationsEntry" placeholder="Command…" title=""></td>
<td><span class="help-mark"
title="a command to be executed when motion event ends; multiple commands can be separated by a semicolon; don't use semicolons inside commands; the following special tokens are accepted: %Y = year, %m = month, %d = date, %H = hour, %M = minute, %S = second, %q = frame number.">?</span>
</td>
</tr>
</tbody>
</table>
<!-- Working Schedule -->
<div class="settings-section-title" depends="motionDetectionEnabled" id="workingScheduleSectionDiv">
<input type="checkbox" class="styled section working-schedule camera-config" id="workingScheduleEnabledSwitch">
<div class="check-box styled section working-schedule camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
<span class="help-mark" title="enable this if you want to define a weekly working schedule for motion detection.">?</span>
<a class="settings-section-title">Working Schedule</a>
<span class="minimize"></span>
</div>
<table class="settings">
<tbody>
<tr class="settings-item" depends="motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label">Monday</span></td>
<td class="settings-item-value">
<input type="checkbox" class="styled working-schedule camera-config" id="mondayEnabledSwitch">
<div class="check-box styled working-schedule camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
<span class="settings-item-unit time">from</span><input type="text" class="styled working-schedule time camera-config ui-timepicker-input validator time-validator" id="mondayFromEntry" autocomplete="off" title="">
<span class="settings-item-unit time">to</span><input type="text" class="styled working-schedule time camera-config ui-timepicker-input validator time-validator" id="mondayToEntry" autocomplete="off" title="">
</td>
<td><span class="help-mark" title="sets the working schedule time interval for Mondays.">?</span></td>
</tr>
<tr class="settings-item" depends="motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label">Tuesday</span></td>
<td class="settings-item-value">
<input type="checkbox" class="styled working-schedule camera-config" id="tuesdayEnabledSwitch">
<div class="check-box styled working-schedule camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
<span class="settings-item-unit time">from</span><input type="text" class="styled working-schedule time camera-config ui-timepicker-input validator time-validator" id="tuesdayFromEntry" autocomplete="off" title="">
<span class="settings-item-unit time">to</span><input type="text" class="styled working-schedule time camera-config ui-timepicker-input validator time-validator" id="tuesdayToEntry" autocomplete="off" title="">
</td>
<td><span class="help-mark" title="sets the working schedule time interval for Tuesdays.">?</span></td>
</tr>
<tr class="settings-item" depends="motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label">Wednesday</span></td>
<td class="settings-item-value">
<input type="checkbox" class="styled working-schedule camera-config" id="wednesdayEnabledSwitch">
<div class="check-box styled working-schedule camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
<span class="settings-item-unit time">from</span><input type="text" class="styled working-schedule time camera-config ui-timepicker-input validator time-validator" id="wednesdayFromEntry" autocomplete="off" title="">
<span class="settings-item-unit time">to</span><input type="text" class="styled working-schedule time camera-config ui-timepicker-input validator time-validator" id="wednesdayToEntry" autocomplete="off" title="">
</td>
<td><span class="help-mark" title="sets the working schedule time interval for Wednesdays.">?</span></td>
</tr>
<tr class="settings-item" depends="motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label">Thursday</span></td>
<td class="settings-item-value">
<input type="checkbox" class="styled working-schedule camera-config" id="thursdayEnabledSwitch">
<div class="check-box styled working-schedule camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
<span class="settings-item-unit time">from</span><input type="text" class="styled working-schedule time camera-config ui-timepicker-input validator time-validator" id="thursdayFromEntry" autocomplete="off" title="">
<span class="settings-item-unit time">to</span><input type="text" class="styled working-schedule time camera-config ui-timepicker-input validator time-validator" id="thursdayToEntry" autocomplete="off" title="">
</td>
<td><span class="help-mark" title="sets the working schedule time interval for Thursdays.">?</span></td>
</tr>
<tr class="settings-item" depends="motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label">Friday</span></td>
<td class="settings-item-value">
<input type="checkbox" class="styled working-schedule camera-config" id="fridayEnabledSwitch">
<div class="check-box styled working-schedule camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
<span class="settings-item-unit time">from</span><input type="text" class="styled working-schedule time camera-config ui-timepicker-input validator time-validator" id="fridayFromEntry" autocomplete="off" title="">
<span class="settings-item-unit time">to</span><input type="text" class="styled working-schedule time camera-config ui-timepicker-input validator time-validator" id="fridayToEntry" autocomplete="off" title="">
</td>
<td><span class="help-mark" title="sets the working schedule time interval for Fridays.">?</span></td>
</tr>
<tr class="settings-item" depends="motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label">Saturday</span></td>
<td class="settings-item-value">
<input type="checkbox" class="styled working-schedule camera-config" id="saturdayEnabledSwitch">
<div class="check-box styled working-schedule camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
<span class="settings-item-unit time">from</span><input type="text" class="styled working-schedule time camera-config ui-timepicker-input validator time-validator" id="saturdayFromEntry" autocomplete="off" title="">
<span class="settings-item-unit time">to</span><input type="text" class="styled working-schedule time camera-config ui-timepicker-input validator time-validator" id="saturdayToEntry" autocomplete="off" title="">
</td>
<td><span class="help-mark" title="sets the working schedule time interval for Saturdays.">?</span></td>
</tr>
<tr class="settings-item" depends="motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label">Sunday</span></td>
<td class="settings-item-value">
<input type="checkbox" class="styled working-schedule camera-config" id="sundayEnabledSwitch">
<div class="check-box styled working-schedule camera-config" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
<span class="settings-item-unit time">from</span><input type="text" class="styled working-schedule time camera-config ui-timepicker-input validator time-validator" id="sundayFromEntry" autocomplete="off" title="">
<span class="settings-item-unit time">to</span><input type="text" class="styled working-schedule time camera-config ui-timepicker-input validator time-validator" id="sundayToEntry" autocomplete="off" title="">
</td>
<td><span class="help-mark" title="sets the working schedule time interval for Sundays.">?</span></td>
</tr>
<tr class="settings-item" depends="motionDetectionEnabled">
<td class="settings-item-label"><span class="settings-item-label">Detect Motion</span></td>
<td class="settings-item-value">
<select class="styled working-schedule camera-config" id="workingScheduleTypeSelect">
<option value="during">During Working Schedule</option>
<option value="outside">Outside Working Schedule</option>
</select>
</td>
<td><span class="help-mark" title="sets whether motion detection should be active during or outside the working schedule.">?</span></td>
</tr>
</tbody>
</table>
<!-- Additional Camera Sections -->
<div class="settings-progress" style="width: 100%; opacity: 0.9;"></div>
</form>POST /login/
<form action="/login/" target="temp" method="POST"><input type="submit" style="display: none;" name="login" value="login">
<table class="login-dialog">
<tbody>
<tr>
<td class="login-dialog-error" colspan="100"></td>
</tr>
<tr>
<td class="dialog-item-label"><span class="dialog-item-label">Username</span></td>
<td class="dialog-item-value"><input type="text" name="username" class="styled" id="usernameEntry" autofocus=""></td>
</tr>
<tr>
<td class="dialog-item-label"><span class="dialog-item-label">Password</span></td>
<td class="dialog-item-value"><input type="password" name="password" class="styled" id="passwordEntry"></td>
</tr>
<tr>
<td class="dialog-item-label"><span class="dialog-item-label">Remember me</span></td>
<td class="dialog-item-value"><input type="checkbox" name="remember" class="styled" id="rememberCheck">
<div class="check-box styled" tabindex="0">
<div class="check-box-button"><span class="check-box-text"><img src="static/img/IEC5008_Off_Symbol.svg" style="width:70%;height:70%;padding:12%"></span></div>
</div>
</td>
</tr>
</tbody>
</table>
</form>Text Content
magcam motionEye ? Preferences Layout Columns 1234 1 ? Fit Frames Vertically ? Layout Rows 1234 1 ? Frame Rate Dimmer 020406080100 0 ? Resolution Dimmer 120406080100 1 ? ? General Settings Language العربية বাংলা català čeština Deutsch Ελληνικά English Esperanto español suomi français हिन्दी magyar italiano 日本語 한국어 Melayu norsk bokmål (Norge) Nederlands ਪੰਜਾਬੀ polski português română русский slovenčina svenska Türkçe українська 中文 ? Admin Username ? Password ? Surveillance Username ? Password ? motionEye Version 0.43.1b1 Motion Version 4.6.0 OS Version Debian 12 Power Shut Down ? Reboot ? Configuration Backup ? Restore ? ? Video Device Camera Name ? Camera ID ? Camera device ? Camera Type Automatic Brightness ? Video resolution ? Width ? Height ? Video Rotation 0° 90° 180° 270° ? Frame rate 251015202530 2 ? Privacy mask ? Edit Mask Save Mask ? Clear Mask ? Extra Options ? ? File storage Storage Device ? Network server ? SMB Protocol Version 1.0 2.0 2.1 3.0 3.1.1 ? Share name ? Username ? Share Password ? Root directory ? Test share ? Disk usage ? Upload Media Files ? Upload Pictures ? Upload Movies ? Upload Service FTP server SFTP server Google Drive Google Photo Dropbox S3 (AWS/MinIO/…) WebDAV ? Server Address ? Server port ? Method POST PUT ? Endpoint URL ? Location ? Include Subfolders ? Clean Cloud ? Username ? Password ? Authorization key ? Obtain key ? Access Key ? Secret Access Key ? Bucket ? Test service ? Call A Web Hook ? Web Hook URL ? HTTP method GET POST (query) POST (form) POST (json) ? Run A Command ? Command ? ? Text Overlay Left Text Camera Name Timestamp Custom Text Disabled ? ? Right Text Camera Name Timestamp Custom Text Disabled ? ? Text Scale 12345678910 1 ? ? Video Streaming Streaming Frame Rate 151015202530 1 ? Streaming Quality 0%25%50%75%100% 0% ? Streaming Image Resizing ? Streaming Resolution 0%25%50%75%100% 0% ? Streaming Port ? Authentication mode Disabled Basic Digest ? Motion Optimization ? Useful URLs Snapshot URL ? Streaming URL ? Embed URL ? ? Still Images Image File Name ? Image Quality 0%25%50%75%100% 0% ? Capture mode Motion Triggered Motion Triggered (One Picture) Interval Snapshots All Frames Manual ? Snapshot Interval seconds ? Preserve Pictures For One Day For One Week For One Month For One Year Forever Custom ? Picture Lifetime days ? Enable Manual Snapshots ? ? Movies Movie File Name ? Movie Passthrough ? Movie format MPEG4 (.avi) MSMPEG4v2 (.avi) Small Web Format (.swf) Flash Video (.flv) QuickTime (.mov) H.264 (.mp4) H.264/NVENC (.mp4) H.264/OMX (.mp4) H.264/V4L2M2M (.mp4) HEVC (.mp4) HEVC/NVENC (.mp4) Matroska Video (.mkv) Matroska Video/OMX (.mkv) Matroska Video/V4L2M2M (.mkv) ? Movie Quality 0%25%50%75%100% 0% ? Recording Mode Motion Triggered Continuous Recording ? Maximum Movie Length seconds ? Preserve Movies For One Day For One Week For One Month For One Year Forever Custom ? Movies Lifetime days ? ? Motion Detection Frame Change Threshold 0%5%10%15%20% 0.0% ? Maximum Change Threshold pixels ? Automatic Threshold Tuning ? Automatic Noise Detection ? Noise Level 0%5%10%15%20%25% 0% ? Light Switch Detection 0%25%50%75%100% 0% ? Despeckle Filter ? Motion Gap seconds ? Captured Before frames ? Captured After frames ? Minimum Motion Frames frames ? Mask ? Mask Type Smart "Editable" ? Smart Mask Sluggishness 12345678910 1 ? Edit Mask Save Mask ? Clear Mask ? Show Frame Changes ? Create Debug Media Files ? ? Motion Notifications Actions when motion has started: Send An Email ? Email Addresses ? SMTP Server ? SMTP Port ? SMTP Account ? SMTP Password ? From Address ? Use TLS ? Attached Pictures Time Span seconds ? Test Email ? Send Telegram Notification ? HTTP API token ? Chat ID ? Attached Images Time seconds ? API Information Test Call A Web Hook ? Web Hook URL ? HTTP method GET POST (query) POST (form) POST (json) ? Run A Command ? Command ? Actions when motion has ended: Call A Web Hook ? Web Hook URL ? HTTP method GET POST (query) POST (form) POST (json) ? Run A Command ? Command ? ? Working Schedule Monday from to ? Tuesday from to ? Wednesday from to ? Thursday from to ? Friday from to ? Saturday from to ? Sunday from to ? Detect Motion During Working Schedule Outside Working Schedule ? copyright © The motionEye Team Login UsernamePasswordRemember me Cancel Login