gilles/homeassistant_config
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Activity

Home Assistant Git Exporter

Browse Source
This commit is contained in:
root
2024-08-09 06:45:02 +02:00
parent 60abdd866c
commit 80fc630f5e
624 changed files with 27739 additions and 4497 deletions
Download Patch File Download Diff File Expand all files Collapse all files

229
config/www/community/generic-remote-control-card/remotes/ccwgtv/remote-html.js Normal file
View File

@@ -0,0 +1,229 @@
function getRemoteStyle_ccwgtv(config) {
const template = config.remote_template;
const base_url = `/hacsfiles/generic-remote-control-card/remotes/${template}`;
return `
ha-card{
background-color:transparent;
box-shadow:var(--paper-material-elevation-0_-_box-shadow);
}
body {
margin: 0;
padding: 20px;
font-family: "Helvetica Neue", Helvetica, Arial, Geneva, sans-serif;
}
.container {
width: 224px;
margin: 0 auto
}
#remote-control-ccwgtv {
position: relative;
background: url(${base_url}/remote.png) no-repeat;
width: 178px;
height: 559px;
}
span {
display: none;
}
li {
display: inline-block;
}
ul a {
display: inline-block;
position: absolute;
width: 29px;
height: 29px;
background-repeat: no-repeat;
background-position: center center;
background-size: contain;
border-radius: 50%;
transition: opacity 0.3s ease-in-out;
}
ul a:hover,
ul a:focus,
ul a:active {
opacity: 0.3;
}
#remote-control-ccwgtv ul {
margin: 0;
padding: 0;
list-style-type: none;
}
#top a {
top: 15px;
background-image: url(${base_url}/top.png);
}
#bottom a,
#ok a,
#top a {
left: 68px;
}
#bottom a {
top: 117px;
background-image: url(${base_url}/bottom.png);
}
#clickleft a,
#clickright a,
#ok a {
top: 63px;
}
#ok a {
background-image: url(${base_url}/ok.png);
}
#clickleft a {
left: 18px;
background-image: url(${base_url}/clickleft.png);
}
#clickright a {
left: 119px;
background-image: url(${base_url}/clickright.png);
}
#back a {
left: 27px;
top: 174px;
width: 26px;
background-image: url(${base_url}/go_back.png);
}
#assistant a {
left: 107px;
top: 167px;
width: 39px;
height: 41px;
background-image: url(${base_url}/assistant.png);
}
#home a,
#mute a {
top: 240px;
width: 26px;
height: 41px;
}
#home a {
left: 30px;
background-image: url(${base_url}/home.png);
}
#mute a {
left: 113px;
background-image: url(${base_url}/mute.png);
}
#youtube a,
#netflix a {
top: 313px;
width: 45px;
height: 41px;
}
#youtube a {
left: 20px;
background-image: url(${base_url}/youtube.png);
}
#netflix a {
left: 109px;
background-image: url(${base_url}/netflix.png);
}
#power a,
#source a {
top: 388px;
transform: scale(0.8);
}
#power a {
left: 30px;
background-image: url(${base_url}/power.png);
}
#source a {
left: 118px;
background-image: url(${base_url}/source.png);
}
.audio-controls {
position: absolute;
left: 168px;
top: 100px;
width: 40px;
background: #b8b7b1;
border-radius: 0;
border-top-right-radius: 14px;
border-bottom-right-radius: 14px;
height: 70px;
transform: rotate(-1.5deg);
}
#volumeup a,
#volumedown a {
left: 5.5px;
width: 25px;
}
#volumeup a {
top: 5px;
background-image: url(${base_url}/volume.png);
}
#volumedown a {
bottom: 5px;
background-image: url(${base_url}/volumedown.png);
}
`;
}
function getRemoteHtml_ccwgtv(config){
const template = config.remote_template;
return `
<div class="container">
<div style="text-align:center">
<h1>${config.name}</h1>
</div>
<div id="remote-control-ccwgtv">
<ul>
<li id="power" class="myButton-${template}"><a href="#" title="Power"><span>Power</span></a></li>
<li id="assistant" class="myButton-${template}"><a href="#" title="assistant"><span>assistant</span></a></li>
<li id="home" class="myButton-${template}"><a href="#" title="home"><span>home</span></a></li>
<li id="back" class="myButton-${template}"><a href="#" title="Go back to beginning"><span>back</span></a></li>
<li id="mute" class="myButton-${template}"><a href="#" title="Mute"><span>mute</span></a></li>
<li id="youtube" class="myButton-${template}"><a href="#" title="Start Youtube"><span>youtube</span></a></li>
<li id="netflix" class="myButton-${template}"><a href="#" title="Start Netflix"><span>netflix</span></a></li>
<li id="source" class="myButton-${template}"><a href="#" title="Select Input Source"><span>source</span></a></li>
<li id="clickleft" class="myButton-${template}"><a href="#" title="clickleft"><span>clickleft</span></a></li>
<li id="clickright" class="myButton-${template}"><a href="#" title="clickright"><span>clickright</span></a></li>
<li class="myButton-${template}" id="back"><a href="#" title="Go back to beginning"><span>back</span></a></li>
<li class="myButton-${template}" id="top"><a href="#" title="Top of gallery"><span>Top of Gallery</span></a></li>
<li class="myButton-${template}" id="bottom"><a href="#" title="Bottom of gallery"><span>Bottom of Gallery</span></a></li>
<li class="myButton-${template}" id="ok"><a href="#" title="OK - start slideshow"><span>OK - start slideshow</span></a></li>
</ul>
<ul class="audio-controls">
<li id="volumeup" class="myButton-${template}"><a href="#" title="volume"><span>volume</span></a></li>
<li id="volumedown" class="myButton-${template}"><a href="#" title="volumedown"><span>volumedown</span></a></li>
</ul>
</div>
</div>
`;
}