iobroker.fb-checkpresence
Version:
The adapter checks the presence of family members over the fritzbox. You must fill in the name of the family member and the mac-address of the used device. The comment is optional and you can enable or disable the family member. The datapoint based on the
490 lines (472 loc) • 22.6 kB
HTML
<html>
<head>
<!-- Load ioBroker scripts and styles-->
<link rel="stylesheet" type="text/css" href="../../lib/css/fancytree/ui.fancytree.min.css" />
<link rel="stylesheet" type="text/css" href="../../css/adapter.css" />
<link rel="stylesheet" type="text/css" href="../../lib/css/materialize.css">
<script type="text/javascript" src="../../lib/js/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="../../socket.io/socket.io.js"></script>
<script type="text/javascript" src="../../lib/js/materialize.js"></script>
<script type="text/javascript" src="../../lib/js/jquery-ui.min.js"></script>
<script type="text/javascript" src="../../lib/js/jquery.fancytree-all.min.js"></script>
<script type="text/javascript" src="../../js/translate.js"></script>
<script type="text/javascript" src="../../js/adapter-settings.js"></script>
<script type="text/javascript" src="words.js"></script>
<!-- Load our own files -->
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript" src="index_m.js"></script>
</head>
<body>
<div class="m adapter-container">
<div class="row">
<!-- define tabs menu -->
<div class="col s12 m12 l12" id="tab-area"> <!--id="tabs" style="width: 100%; height: 100%; overflow: hidden;"-->
<ul class="tabs blue lighten-3">
<li class="tab col s3 m1 l4"><a href="#tab-main" class="translate active">Main settings</a></li>
<li class="tab col s3 m1 l4"><a href="#tab-family" class="translate">Family settings</a></li>
<li class="tab col s3 m1 l4"><a href="#tab-whitelist" class="translate">White list settings</a></li>
</ul>
</div>
<!-- define tab-main -->
<div id="tab-main" class="col s12 m12 l12 page">
<div class="row" id="header-area">
<div id="header-logo-title" class="col s12 m12 l12" >
<img class="logo" src="fb-checkpresence.png">
<p>
<span class="h-title">Fb-Checkpresence</span><br/>
<span class="h-sub-title translate">Detects the presence of family members via the FRITZBox</span>
</p>
</div>
</div>
<div class="row">
<div class="col s12 m12 l12">
<ul class="collapsible">
<li>
<div class="collapsible-header config-section"><h5 class="translate">For help click here</h5><i class="material-icons">live_help</i></div>
<div class="collapsible-body">
<ul class="collapsible" id="c2">
<li>
<div class="collapsible-header config-section" ><h6 class="translate">FRITZ!Box settings</h5><i class="material-icons">live_help</i></div>
<div class="collapsible-body"><!-- af-include-html="help_fbsettings.html"-->
<table class="bordered striped">
<thead>
<tr>
<th class="translate">Settings</th>
<th class="translate">Mandatory</th>
<th class="translate">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="translate">Help Fritzbox TR-064</td>
<td class="translate">Yes</td>
<td><p class="translate">Help Fritzbox TR-064 1v1</p>
<img src="access_settings_network.png" alt="access settings" width="70%" height="70%">
</td>
</tr>
<tr>
<td class="translate">Help Fritzbox registration</td>
<td class="translate">Yes</td>
<td class="translate">Help Fritzbox registration 1v1</td>
</tr>
<tr>
<td class="translate">Help Fritzbox user</td>
<td class="translate">Yes</td>
<td class="translate">Help Fritzbox user 1v1</td>
</tr>
</tbody>
</table>
</div>
</li>
<li>
<div class="collapsible-header config-section"><h6 class="translate">Adapter settings</h5><i class="material-icons">live_help</i></div>
<div class="collapsible-body"><!-- af-include-html="help_adaptersettings.html"-->
<table class="bordered striped">
<thead>
<tr>
<th class="translate">Settings</th>
<th class="translate">Mandatory</th>
<th class="translate">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="translate">Help adapter ip</td>
<td class="translate">Yes</td>
<td class="translate">Help adapter ip 1v1</td>
</tr>
<tr>
<td class="translate">Help adapter username</td>
<td class="translate">Yes</td>
<td class="translate">Help adapter username 1v0</td>
</tr>
<tr>
<td class="translate">Help adapter password</td>
<td class="translate">Yes</td>
<td class="translate">Help adapter password 1v0</td>
</tr>
<tr>
<td class="translate">Help adapter ssl</td>
<td class="translate">Yes</td>
<td class="translate">Help adapter ssl 1v0</td>
</tr>
<tr>
<td class="translate">Help adapter interval</td>
<td class="translate">Yes</td>
<td class="translate">Help adapter interval 1v1</td>
</tr>
<tr>
<td class="translate">Help adapter history</td>
<td class="translate">No</td>
<td class="translate">Help adapter history 1v2</td>
</tr>
<tr>
<td class="translate">Help adapter date format</td>
<td class="translate">Yes</td>
<td class="translate">Help adapter date format 1v0</td>
</tr>
<tr>
<td class="translate">Help adapter fb-devices</td>
<td class="translate">No</td>
<td class="translate">Help adapter fb-devices 1v1</td>
</tr>
<tr>
<td class="translate">Help adapter mesh</td>
<td class="translate">No</td>
<td class="translate">Help adapter mesh 1v1</td>
</tr>
<tr>
<td class="translate">Help adapter sync</td>
<td class="translate">No</td>
<td class="translate">Help adapter sync 1v0</td>
</tr>
<tr>
<td class="translate">guest</td>
<td class="translate">No</td>
<td class="translate">Help adapter guest 1v0</td>
</tr>
<tr>
<td class="translate">qrcode</td>
<td class="translate">No</td>
<td class="translate">Help adapter qr 1v0</td>
</tr>
<tr>
<td class="translate">QR code color</td>
<td class="translate">No</td>
<td class="translate">Help adapter qrcolor 1v1</td>
</tr>
</tbody>
</table>
</div>
</li>
</ul>
</div>
</li>
</ul>
</div>
</div>
<div class="row">
<div class="col s6 m6 l4 input-field tooltip textfield-tooltip">
<input type="text" class="value validate" id="ipaddress" required
pattern="^((25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?))|([a-zA-Z][\w.-]*)$"/>
<label for="ipaddress" class="translate">IP Fritzbox</label>
<span class="tooltiptext translate">tooltipIp</span>
</div>
<div class="col s6 m6 l3 input-field tooltip textfield-tooltip">
<input type="text" class="value validate" maxlength="32" id="username" pattern="^[a-zA-Z][a-zA-Z0-9 _,.\-]{0,31}$"/>
<label for="username" class="translate">Username</label>
<span class="tooltiptext translate">tooltipUser</span>
</div>
<div class="col s6 m6 l3 input-field tooltip textfield-tooltip">
<input type="password" class="value validate" id="password" pattern="^[a-zA-Z0-9 _\-!"#$%&'()*+,./:;<=>?@[\]^`{|}~]{1,32}$"/>
<label for="password">Password</label>
<span class="tooltiptext translate">tooltipPw</span>
</div>
<div class="col 6 m2 l2 input-field tooltip checkbox-tooltip">
<input type="checkbox" class="value" id="ssl"/>
<label for="ssl" class="translate">ssl</label>
<span class="tooltiptext translate">tooltipSslv0</span>
</div>
</div>
<div class="row">
<div class="col s12 m4 l4 input-field tooltip textfield-tooltip">
<select class="value" id="history">
<!--option value="" disabled selected class="translate">Choose your option</option-->
<!--option value="" class="translate">disabled</option>
<option value="history.0">History</option>
<option value="sql.0">SQL History</option>
<option value="influxdb.0">InfluxDB</option-->
</select>
<label for history class="translate">Select history adapter</label>
<span class="tooltiptext translate">tooltipHistory</span>
</div>
<div class="col s12 m4 l4 input-field tooltip textfield-tooltip">
<input type="text" class="value validate" id="dateformat" pattern="^[dmyhHMNosSlLtTWZUC:\.\-,/' ]+$"/>
<label for="ipaddress" class="translate">Date format</label>
<span class="tooltiptext translate">tooltipDateformat</span>
</div>
<div class="col s12 m4 l4 input-field tooltip textfield-tooltip">
<input type="number" class="value validate" min="10" max="3600" step="1" id="interval" required pattern="[1-5][0-9]?"/>
<label for="interval" class="translate">polling interval in seconds</label>
<span class="tooltiptext translate">tooltipIntervalv0</span>
</div>
</div>
<div class="row">
<div class="col s12 m4 l4 input-field tooltip checkbox-tooltip">
<input type="checkbox" class="value" id="fbdevices"/>
<label for="fbdevices" class="translate">create FB-Devices</label>
<span class="tooltiptext translate">tooltipFbdevices</span>
</div>
<div class="col s12 m4 l4 input-field tooltip checkbox-tooltip">
<input type="checkbox" class="value" id="meshinfo"/>
<label for="meshinfo" class="translate">create mesh info</label>
<span class="tooltiptext translate">tooltipMesh</span>
</div>
<div class="col s12 m4 l4 input-field tooltip checkbox-tooltip">
<input type="checkbox" class="value" id="syncfbdevices"/>
<label for="syncfbdevices" class="translate">synchronize FB-Devices (once)</label>
<span class="tooltiptext translate">tooltipFbsync</span>
</div>
</div>
<div class="row">
<div class="col s12 m4 l4 input-field tooltip checkbox-tooltip">
<input type="checkbox" class="value" id="guestinfo"/>
<label for="guestinfo" class="translate">guest</label>
<span class="tooltiptext translate">tooltipGuest</span>
</div>
<div class="col s12 m4 l4 input-field tooltip checkbox-tooltip">
<input type="checkbox" class="value" id="qrcode"/>
<label for="qrcode" class="translate">qrcode</label>
<span class="tooltiptext translate">tooltipQR</span>
</div>
<div class="col s12 m4 l4 input-field tooltip textfield-tooltip">
<input type="text" class="value validate" id="qrcodecolor"/>
<label for="qrcodecolor" class="translate">QR code color</label>
<span class="tooltiptext translate">tooltipQRColor</span>
</div>
</div>
<div class="row">
<div class="col s12 m4 l4 input-field tooltip checkbox-tooltip">
<input type="checkbox" class="value" id="extip"/>
<label for="extip" class="translate">external ip address</label>
<span class="tooltiptext translate">tooltipExtip</span>
</div>
</div>
</div><!-- End of tab main -->
<!--Define tab family-->
<div id="tab-family" class="col s12 m12 l12 page">
<div class="row">
<div class="col s12 m12 l12">
<ul class="collapsible">
<li>
<div class="collapsible-header config-section"><h5 class="translate">For help click here</h5><i class="material-icons">live_help</i></div>
<div class="collapsible-body"> <!--af-include-html="help_familysettings.html"-->
<table class="bordered striped">
<thead>
<tr>
<th class="translate">Settings</th>
<th class="translate">Mandatory</th>
<th class="translate">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="translate">Help family interval</td>
<td class="translate">Yes</td>
<td class="translate">Help family interval 1v0</td>
</tr>
<tr>
<td><a class="btn-floating"><i class="material-icons">add</i></a></td>
<td class="translate">No</td>
<td class="translate">Help family add 1</td>
</tr>
<tr>
<td><a style="display: inline-flex; align-items: center; justify-content: center;" class="btn blue translate">Add family member</a></td>
<td class="translate">No</td>
<td class="translate">Help family add member 1v0</td>
</tr>
<tr>
<td class="translate">Help family member</td>
<td class="translate">Yes</td>
<td class="translate">Help family member 1v2</td>
</tr>
<tr>
<td class="translate">Help family mac</td>
<td class="translate">Yes</td>
<td class="translate">Help family mac 1</td>
</tr>
<tr>
<td class="translate">Help family ip</td>
<td class="translate">Yes</td>
<td class="translate">Help family ip 1</td>
</tr>
<tr>
<td class="translate">Help family use ip</td>
<td class="translate">No</td>
<td class="translate">Help family use ip 1v0</td>
</tr>
<tr>
<td class="translate">Use name</td>
<td class="translate">No</td>
<td class="translate">Help family use name 1v0</td>
</tr>
<tr>
<td class="translate">Help family comment</td>
<td class="translate">No</td>
<td class="translate">Help family comment 1</td>
</tr>
<tr>
<td class="translate">Help family enabled</td>
<td class="translate">Yes</td>
<td class="translate">Help family enabled 1v1</td>
</tr>
</tbody>
</table>
</div>
</li>
</ul>
</div>
</div>
<div id="values">
<div class="row">
<div class="col s6 m6 l3 input-field tooltip textfield-tooltip">
<input type="number" class="value validate" min="10" max="600" step="1" id="intervalFamily" required pattern="[1-6][0-9]?"/>
<label for="intervalFamily" class="translate">Polling interval in seconds</label>
<span class="tooltiptext translate">tooltipInterval2</span>
</div>
<div class="col s6 m6 l3 input-field tooltip textfield-tooltip">
<input type="number" class="value validate" min="1" max="300" step="1" id="delay" required pattern="([1-9]|[1-5][0-9]|[60]))"/>
<label for="delay" class="translate">filter time in seconds</label>
<span class="tooltiptext translate">tooltipDelayv1</span>
</div>
<div class="col s12 m6 l3 input-field tooltip checkbox-tooltip">
<input type="checkbox" class="value" id="newfilter"/>
<label for="newfilter" class="translate">new filter function</label>
<span class="tooltiptext translate">tooltipNewFilterv0</span>
</div>
<div class="col s12 m6 l3 input-field tooltip checkbox-tooltip">
<input type="checkbox" class="value" id="compatibility"/>
<label for="compatibility" class="translate">compatibility</label>
<span class="tooltiptext translate">tooltipCompatibilityv0</span>
</div>
</div>
<div class="row">
<div class="col s2 m2 l1 input-field tooltip">
<a class="left btnAdmin btn-floating waves-effect waves-light table-button-add"><i class="material-icons">add</i></a>
</div>
<div class="col s6 m6 l6 input-field tooltip">
<a id="buttonadd" class="left btnAdmin btn waves-effect waves-light modal-trigger blue translate">Add family member</a>
</div>
</div>
<div class="row">
<table class="table-values fmadmin">
<thead>
<tr>
<th data-name="enabled" data-label="enabled" data-type="checkbox" class="header translate"><i class="material-icons left">check_box</i></th>
<th data-name="group" data-label="group" data-type="text" class="header translate" for="group">Group</th>
<th data-name="familymember" data-label="familymember" data-type="text" class="header translate" for="familymember">Family member</th>
<th data-name="devicename" data-label="devicename" data-type="text" class="header translate" for="devicename">Hostname</th>
<th data-name="macaddress" data-label="macaddress" data-type="text" class="header translate" for="macaddress">Mac-address</th>
<th data-name="ipaddress" data-label="ipaddress" data-type="text" class="header translate" for="ipaddress">Ip-address</th>
<th data-name="usage" data-label="usage" data-type="select" data-options="MAC;IP;Hostname" data-default="MAC" class="header translate" for="selectUsage">Usage of</th>
<th data-name="usefilter" data-label="usefilter" data-type="checkbox" class="header translate">Use filter</th>
<th data-name="comment" data-label="comment" data-type="text" class="header translate" for="comment">Comment</th>
<th data-buttons="up down delete" class="header"></th>
</tr>
</thead>
<tbody>
<!-- Insert rows dynamically using JavaScript -->
</tbody>
</table>
</div>
</div>
</div><!-- End of tab family -->
<!--Define tab whitelist-->
<div id="tab-whitelist" class="col s12 m12 l12 page">
<div class="row">
<div class="col s12 m12 l12">
<ul class="collapsible">
<li>
<div class="collapsible-header config-section"><h5 class="translate">For help click here</h5><i class="material-icons">live_help</i></div>
<div class="collapsible-body">
<p class="translate">All known devices in the home network are entered in the whitelist. The devices that are not later found in the whitelist are reported in the object area in the Blacklist folder.</p>
<table class="bordered striped">
<thead>
<tr>
<th class="translate">Settings</th>
<th class="translate">Mandatory</th>
<th class="translate">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="translate">Enable whitelist</td>
<td class="translate">No</td>
<td class="translate">Help wl enable 1v1</td>
</tr>
<tr>
<td><a class="btn-floating"><i class="material-icons">add</i></a></td>
<td class="translate">No</td>
<td class="translate">Help wl add 1v0</td>
</tr>
<tr>
<td><a style="display: inline-flex; align-items: center; justify-content: center;" class="btn blue translate">Add a device</a></td>
<td class="translate">No</td>
<td class="translate">Help wl add device 1v0</td>
</tr>
<tr>
<td class="translate">Help wl device</td>
<td class="translate">Yes</td>
<td class="translate">Help wl device 1v0</td>
</tr>
<tr>
<td class="translate">Help wl mac</td>
<td class="translate">Yes</td>
<td class="translate">Help wl mac 1v0</td>
</tr>
</tbody>
</table>
</div>
</li>
</ul>
</div>
</div>
<div id="whitevalues">
<div id="rowBtnWl" class="row">
<div class="col s12 m4 l4 input-field tooltip checkbox-tooltip">
<input type="checkbox" class="value" id="enableWl"/>
<label for="enableWl" class="translate">Enable whitelist</label>
<span class="tooltiptext translate">tooltipWlv0</span>
</div>
<div class="input-field">
<a class="left btnAdmin btn-floating waves-effect waves-light table-button-add"><i class="material-icons">add</i></a>
</div>
<div class="input-field">
<a id="buttonaddwl" class="left btnAdmin btn waves-effect waves-light modal-trigger translate blue" href="#dlgWL">Add a device</a>
</div>
</div>
<div class="">
<table class="table-values wladmin">
<thead>
<tr>
<th data-name="_index" style="width: 5%; text-align: center" data-label="Nr" data-style="text-align: center" class="header translate">Nr</th>
<th data-name="white_device" style="width: 50%" data-type="text" data-label="Hostname" class="header translate" for="white_device">Hostname</th>
<th data-name="white_macaddress" style="width: 50%" data-type="text" data-label="Mac-address" class="header translate" for="white_macaddress">Mac-address</th>
<th data-buttons="up down delete" class="header"></th>
</tr>
</thead>
<tbody>
<!-- Insert rows dynamically using JavaScript -->
</tbody>
</table>
</div>
</div>
</div><!-- End of tab white list -->
</div>
<div class="m material-dialogs">
<div id="dlgDevices" class="modal modal-fixed-footer"></div>
<div id="dlgWL" class="modal modal-fixed-footer"></div>
</div>
</div><!-- End of adapter container -->
</body>
</html>