mirror of
https://github.com/EliasKotlyar/Xiaomi-Dafang-Hacks.git
synced 2025-09-02 20:52:41 +02:00
147 lines
7.7 KiB
HTML
147 lines
7.7 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<!-- Third part lib css and js-->
|
|
<!-- W3 School css-->
|
|
<link rel="stylesheet" href="lib/w3css/w3.css" type="text/css" />
|
|
<!-- jQuery -->
|
|
<script type="text/javascript" src="lib/jquerry/jquery.min.js"></script>
|
|
<!-- fontawesome -->
|
|
<script type="text/javascript" src="lib/fontawesome/js/all.min.js" defer></script>
|
|
<!-- image select -->
|
|
<link rel="stylesheet" href="lib/selectareas/jquery.selectareas.css" media="screen" type="text/css" />
|
|
<script src="lib/selectareas/jquery.selectareas.min.js" type="text/javascript"></script>
|
|
<!-- datatable -->
|
|
<link rel="stylesheet" href="lib/datatable/datatables.min.css" type="text/css" />
|
|
<script type="text/javascript" src="lib/datatable/datatables.min.js"></script>
|
|
<!-- smoothie-->
|
|
<script type="text/javascript" src="lib/smoothie/smoothie.js"></script>
|
|
<script src="lib/d3/d3.min.js"></script>
|
|
<script src="lib/event-drops/index.js"></script>
|
|
<!-- Dafang hack CSS-->
|
|
<link rel="stylesheet" href="css/w3-toggle.css" type="text/css" />
|
|
<link rel="stylesheet" href="css/w3-accordion.css" type="text/css" />
|
|
<link href="lib/event-drops/style.css" rel="stylesheet" />
|
|
<script type="text/javascript">
|
|
//Check if theme configured
|
|
var css = localStorage.getItem('theme')
|
|
if ( css == null )
|
|
css = "w3-theme-night-blue";
|
|
$('head').append("<link rel='stylesheet' href='css/themes/"+css+".css'>");
|
|
$.get("cgi-bin/state.cgi", {cmd: "hostname"}, function(hostname){document.title = hostname;});
|
|
</script>
|
|
<title>Dafang Hacks</title>
|
|
</head>
|
|
<body>
|
|
<!-- Sidebar for control camera -->
|
|
<div class="w3-sidebar w3-bar-block w3-animate-left" style="display:none;z-index:5" id="sideBar">
|
|
<button class="w3-bar-item w3-button w3-large w3-theme" onclick="w3_close()">Close ×</button>
|
|
<p class="w3-large">Camera</p>
|
|
<label class="switch"><input id="auto_night_mode" type="checkbox"><span class="slider round"></span></label> Auto Night Detection<br />
|
|
<label class="switch"><input id="night_mode" type="checkbox"><span class="slider round"></span></label> Night Mode<br />
|
|
<label class="switch"><input id="ir_led" type="checkbox"><span class="slider round"></span></label> IR LED<br />
|
|
<label class="switch"><input id="ir_cut" type="checkbox"><span class="slider round"></span></label> IR Filter<br />
|
|
<label class="switch"><input id="blue_led" type="checkbox"><span class="slider round"></span></label> Blue LED<br />
|
|
<label class="switch"><input id="yellow_led" type="checkbox"><span class="slider round"></span></label> Yellow LED<br />
|
|
<p class="w3-large">Motion</p>
|
|
<label class="switch"><input id="motion_detection" type="checkbox"><span class="slider round"></span></label> Detection<br />
|
|
<label class="switch"><input id="motion_mail" type="checkbox"><span class="slider round"></span></label> Send Emails<br />
|
|
<label class="switch"><input id="motion_telegram" type="checkbox"><span class="slider round"></span></label> Send Telegram<br />
|
|
<label class="switch"><input id="motion_led" type="checkbox"><span class="slider round"></span></label> Yellow LED<br />
|
|
<label class="switch"><input id="motion_snapshot" type="checkbox"><span class="slider round"></span></label> Snapshots<br />
|
|
<label class="switch"><input id="motion_mqtt" type="checkbox"><span class="slider round"></span></label> MQTT Message<br />
|
|
<label class="switch"><input id="motion_mqtt_snapshot" type="checkbox"><span class="slider round"></span></label> MQTT Snapshot<br />
|
|
<label class="switch"><input id="motion_mqtt_video" type="checkbox"><span class="slider round"></span></label> MQTT Video<br />
|
|
</div>
|
|
<div class="w3-overlay w3-animate-opacity" onclick="w3_close()" style="cursor:pointer" id="myOverlay"></div>
|
|
<div class="w3-auto">
|
|
|
|
<!-- Menu -->
|
|
<div class="w3-container w3-card w3-theme">
|
|
<button class="w3-bar-item w3-button" onclick="openPage('live');" title="Home"><i class="fa fa-home"></i></button>
|
|
<div class="w3-dropdown-hover">
|
|
<button class="w3-button"><i class="fa fa-cog"></i></button>
|
|
<div class="w3-dropdown-content w3-bar-block w3-card-4">
|
|
<button onclick="openPage('system');" class="w3-bar-item w3-button">System</button>
|
|
<button onclick="openPage('camera');" class="w3-bar-item w3-button">Camera</button>
|
|
<button onclick="openPage('net_services');" class="w3-bar-item w3-button">Network Services</button>
|
|
<button onclick="openPage('motion');" class="w3-bar-item w3-button">Motion Detection</button>
|
|
<button onclick="openPage('softnight');" class="w3-bar-item w3-button">Software Night Detection</button>
|
|
</div>
|
|
</div>
|
|
<button class="w3-bar-item w3-button" onclick="openPage('control');" title="System Control"><i class="fas fa-tools"></i></button>
|
|
<button class="w3-bar-item w3-button" onclick="openPage('info');" title="System Information"><i class="fa fa-info-circle"></i></button>
|
|
<button class="w3-bar-item w3-button" onclick="openPage('sdcard');" title="View files on SD Card"><i class="fa fa-sd-card"></i></button>
|
|
<div class="w3-dropdown-hover w3-right">
|
|
<button class="w3-button" id="notifAlarm"><i class="fa fa-bell"></i></button>
|
|
<div class="w3-dropdown-content w3-bar-block w3-card-4" style="width:250px">
|
|
<div class="w3-container" id="notifContent">
|
|
<p>No notifications</p>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
<div id="content" class="w3-container">
|
|
|
|
</div>
|
|
|
|
<!-- About modal -->
|
|
<div id="about" class="w3-modal">
|
|
<div class="w3-modal-content">
|
|
<header class="w3-container w3-theme">
|
|
<span onclick="document.getElementById('about').style.display='none'"
|
|
class="w3-button w3-display-topright">×</span>
|
|
<h2>About</h2>
|
|
</header>
|
|
<div class="w3-container">
|
|
<p id="about">
|
|
<strong>Dafang Hacks : </strong><br />
|
|
Version: <em id="version">VERSION</em><br />
|
|
<a href="https://github.com/EliasKotlyar/Xiaomi-Dafang-Hacks/issues" target="_blank">Report and view issues</a> |
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Theme modal -->
|
|
<div id="theme" class="w3-modal">
|
|
<div class="w3-modal-content">
|
|
<header class="w3-container w3-theme">
|
|
<span onclick="document.getElementById('theme').style.display='none'"
|
|
class="w3-button w3-display-topright">×</span>
|
|
<h2>Theme</h2>
|
|
</header>
|
|
<div class="w3-container">
|
|
<p id="theme">
|
|
<label>Choose your theme:</label>
|
|
<select id="theme" class="w3-select" name="option">
|
|
<option value="w3-theme-dark-grey">Dark Grey</option>
|
|
<option value="w3-theme-black">Black</option>
|
|
<option value="w3-theme-night-blue">Light Blue</option>
|
|
<option value="w3-theme-grey">Grey</option>
|
|
<option value="w3-theme-indigo">Indigo</option>
|
|
<option value="w3-theme-light-green">Light Green</option>
|
|
<option value="w3-theme-orange">Orange</option>
|
|
<option value="w3-theme-pink">Pink</option>
|
|
<option value="w3-theme-teal">Teal</option>
|
|
<option value="w3-theme-w3schools">W3 School</option>
|
|
</select>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Footer -->
|
|
<footer class="w3-container w3-card w3-theme w3-center">
|
|
<a class="w3-bar-item w3-button" href="https://github.com/EliasKotlyar/Xiaomi-Dafang-Hacks" target="_blank" title="GitHub project page"><i class="fab fa-github"></i></a>
|
|
<span class="w3-bar-item w3-button" onclick="document.getElementById('about').style.display='block'" title="Camera Information"><i class="fas fa-info-circle"></i></span>
|
|
<span class="w3-bar-item w3-button" onclick="document.getElementById('theme').style.display='block'" title="Choose Theme Color"><i class="fas fa-palette"></i></span>
|
|
</footer>
|
|
</div>
|
|
|
|
<script type="text/javascript" src="js/index.js"></script>
|
|
</body>
|
|
</html>
|