khimo.github.io/help_drivers/index.html at master · khimo/khimo.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
---
layout: page
title: Supported Systems (BLI PRO)
toc: true
---

<style>
.newspaper {
  -webkit-column-count: 3; /* Chrome, Safari, Opera */
  -moz-column-count: 3; /* Firefox */
  column-count: 3;
}
.logos {
	width:290px;
  	height:60px;
  	object-fit:scale-down;
  	display: block;
  	margin-left: auto;
  	margin-right: auto;
	/*border: 1px solid #ddd;
  	border-radius: 4px;*/
  	padding: 5px;
}
.logos Img{
	width:65%;
	height:100%;
	object-fit:scale-down;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-top: auto;
  margin-bottom: auto;
	}
.help_driver {
  margin: 3ex auto;
  border: 1px solid #d3d3d380;
}
a {
    color: #ababab;
    transition: all 0.2s;
    font-size: 10pt;
    margin-bottom: 0;
}

</style>


A <em>PRO BeoLiving Intelligence</em> supports the most used Smart Home systems in the market. Here you will find <em>BeoLiving Intelligence</em> help and usage guides for some of them:

<br>
<p>

</p>

<script>
function filterByName() {
  const target = document.querySelectorAll("#searchbox")[0];
  const searchTerm = target.value.trim().toLowerCase();
  const listItems = document.querySelectorAll("#helpdrivers .help_driver");
  let countHidden = 0;
  let countShow = 0;

  listItems.forEach(function(item) {
    item.style.display = 'revert';

    if (!item.textContent.toLowerCase().includes(searchTerm)) {
      item.style.display = 'none';
      countHidden++;
    } else {
      countShow++;
    }
  })
  if (countHidden > 0) {
    const result = document.querySelectorAll("#results")[0];
    results.innerHTML = "Showing " + countShow + " of a total of " + (countShow + countHidden);
  } else {
      results.innerHTML = ""
  }
}
</script>

<div class="container">
  <div class="jumbotron">
    <div class="d-flex justify-content-center">
      <div>
      <form class="form-inline ">
<input class="form-control form-control-lg" type="search" id="searchbox" placeholder="Search by name or features" aria-label="Search" oninput="filterByName(event)" >

        <button class="btn my-2 my-sm-0" type="submit" onclick="filterByName(event)">Filter</button>
      </form>
      </div>
    </div>
  </div>
  <div class="d-flex justify-content-center">
    <div id="results">
    </div>
  </div>
</div>


<div class="row" id="helpdrivers" align="center">


   {% for help_driver in site.help_drivers %}
   	<div class="help_driver">
		<a class=logos target="_blank" href="{{ help_driver.url }}" >
      {% assign filename = help_driver.url | remove: "help_drivers" | remove: "/"  | append: ".jpg" %}
      {% assign path = "/logos/" | append:filename %}
      {% assign file_exists = site.static_files | where: "path", path  %}
      {% if file_exists.size != 0 %}
      <img src="/logos/{{ help_driver.url | remove: "help_drivers" | remove: "/" }}.jpg" title="{{help_driver.title}}"  />
      {% else %}
  			<img src="/logos/driverdefault.jpg"  title="{{path}}"   />
      {% endif %}
		</a>
    <div style="display: none">
      <pre>{{ help_driver.path  }}</pre>
      <pre>{{ help_driver.keywords }} </pre>
      <pre>{{ help_driver.description }} </pre>
    </div>
		<center><a href="{{ help_driver.url }}">{{ help_driver.title }}</a></center>
		</div>

       	<!-- if last column in row -->
       	{% assign fullrow = forloop.counter | divisibleby:"3" %}
       	{% if fullrow and forloop.last != true %}
       		</div><div class="row">
       	{% endif %}
   {% endfor %}

   </div>

</div>