Merge pull request #22 from Roger4R/master

New JBL Sound bar 350 control
dimagoltsman · Jan 29, 2022 · 92bb62c · 92bb62c
2 parents 9e10c63 + 65aaca7
commit 92bb62c
Show file tree

Hide file tree

Showing 29 changed files with 370 additions and 1 deletion.
diff --git a/README.md b/README.md
@@ -673,7 +673,116 @@ type: 'custom:generic-remote-control-card'
 
 ```
   </details>
-
+
+  <details>
+  <summary>JBL SoundBar 350 Remote (Design and codes by Roger 4R): (Click to expand!)</summary>
+
+   <img src="https://github.com/Roger4R/generic-remote-control-card/blob/master/jblsoundbar_remote.png" height="400">
+
+```
+
+type: custom:generic-remote-control-card
+buttons:
+  power:
+    call: remote.send_command
+    data:
+      entity_id: remote.broadlink_remote
+      command: >-
+        b64:JgBQAAABJpISFBITEjgSExMTEhMSFBM3ExISFBI4EhMTOBI4EjgSExI5EjgSOBI4EjgSOBM4EzcTEhMTEhMSExQSEhMSFBITEgAFbAABKEoTAA0F
+  bluetooth:
+    call: remote.send_command
+    data:
+      entity_id: remote.broadlink_remote
+      command: >-
+        b64:JgBMABMSExMSExIUEhMTEhMTEjgSExIUEhMSExI5EjgTNxITEhQTNxITEjgSORI4ExISOBI4ExMTNxMSEhQSExI4ExMTAAW0AAEmSxIADQU=
+  source:
+    call: remote.send_command
+    data:
+      entity_id: remote.broadlink_remote
+      command: >-
+        b64:JgBUAAABJ5ITEhITExMSExIUEhMTEhM3EhQSExIUEhMTNxI4EjgTExITEzcSOBIUEhMSOBITEzgTNxMSEhMTNxM4EhMSOBIUEgAD7ggAAb4AASdKEwANBQ==
+  aux:
+    call: remote.send_command
+    data:
+      entity_id: remote.broadlink_remote
+      command: >-
+        b64:JgBQAAABJpMSExMSExMSExMTExITExM3ExITExITExMSOBM3EzgSExIUEhMTNxMTEjgSOBMTEjgSORM3EhMTOBMSEhQSOBIUEwAFtgABJ0sSAA0F
+  optical:
+    call: remote.send_command
+    data:
+      entity_id: remote.broadlink_remote
+      command: >-
+        b64:JgBQAAABJpMSFBITFBISExMTEhQSExM3EhQSExQSEhMTOBI4EjYVExI5EhMSFBI4EjkSOBI5EjgSFBI4EjkSExIUEhMSFBITEgAFuQABKkoTAA0F
+  feedback:
+    call: remote.send_command
+    data:
+      entity_id: remote.broadlink_remote
+      command: >-
+        b64:JgBQAAABJ5MTExITEhQSExIUExITEhM4ExITExITEhQSOBI4EzgTEhIUEzcTExQ2ExMSOBI4EjkSOBITEzgSExI5EhMSFBITEgAFuQABKUoSAA0F
+  minus:
+    call: remote.send_command
+    data:
+      entity_id: remote.broadlink_remote
+      command: >-
+        b64:JgBQAAABJZMSExMTEhMSExMTEhMTExM3ExISFBITEhMSOBM4EzcTEhMTExITExI4EhMTEhI5EjgSOBI4EjgTExI4EjgUERMTEgAFtQABJ0oTAA0F
+  mute:
+    call: remote.send_command
+    data:
+      entity_id: remote.broadlink_remote
+      command: >-
+        b64:JgBQAAABJpMTEhMTEhMSFBMSEhMTExI4EhMTExQREhQTNxI4EzcSFBM3EhQTEhMSEhQSExI4EzgSExM3EzgTNxI4EjgSFBITEgAFtwABJ0sSAA0F
+  plus:
+    call: remote.send_command
+    data:
+      entity_id: remote.broadlink_remote
+      command: >-
+        b64:JgBQAAABJ5ITEhMTEhMTExITExMSExM4ExISFBITEhQSOBI4EzgTEhI5EzcSOBMTExITExI4EjkSExIUEhMSOBQ3EjgTExITEgAFuQABJ0sUAA0F
+  bassminus:
+    call: remote.send_command
+    data:
+      entity_id: remote.broadlink_remote
+      command: >-
+        b64:JgBQAAABJZMTExMSEhQTEhITEhQSExI4ExMSExITExMSOBM3EjgTEhI5ExITNxI4EhQSOBI4EjgTEhI4EhQSExM3EhQTEhITEwAFtAABJ0kUAA0F
+  bassplus:
+    call: remote.send_command
+    data:
+      entity_id: remote.broadlink_remote
+      command: >-
+        b64:JgBUAAABKJIVERITEhQSExITEhQSExI4ExMSExMTEhMTNxI4EzgSExITExMUNhM3EhQTNxM3EjgTNxM4ExITEhM4ExISFBITEgAFtQABJ0sSAAL6CQANBQ==
+  surround:
+    call: remote.send_command
+    data:
+      entity_id: remote.broadlink_remote
+      command: >-
+        b64:JgBQAAABKJESFBITEhQSExITExMSExI4ExMSExMSEhQSOBI1FjcTEhMTEzcTNxI4ExMSOBMSEjgTNxMTExISFBM3EhMSOBIUEgAFtQABJksSAA0F
+  stereo:
+    call: remote.send_command
+    data:
+      entity_id: remote.broadlink_remote
+      command: >-
+        b64:JgBQAAABJZMTEhM3ExMSExIUExISExI4ExMTNxMSEhQSOBI4EjgTEhIUExISFBI4ExITNxIUEzcSOBM3EjgTExI4EhMTNxIUEgAFawABJ0oTAA0F
+  harman:
+    call: remote.send_command
+    data:
+      entity_id: remote.broadlink_remote
+      command: >-
+        b64:JgBUAAUACQ8AASeSExMSExIUExITExITExITNxIUEhMTExITEzcTNxI4ExMTNxI4EjgTOBITEjgTExM3EhMTExITExITNxMTEjgSFBIABbUAAShKEgANBQ==
+name: Jbl
+remote_template: jblsoundbar
+style: |
+  ha-card {
+    font-size: 10px;
+  }
+  h1{
+    text-align:left;
+    margin-left: 50px;
+  }
+
+```
+
+  </details>
+
+
   <details>
   <summary>Yes Remote (Design and codes by Rubinov lior): (Click to expand!)</summary>
 

diff --git a/dist/remotes/jblsoundbar/auxiliar.png b/dist/remotes/jblsoundbar/auxiliar.png
diff --git a/dist/remotes/jblsoundbar/auxiliar_over.png b/dist/remotes/jblsoundbar/auxiliar_over.png
diff --git a/dist/remotes/jblsoundbar/bluetooth.png b/dist/remotes/jblsoundbar/bluetooth.png
diff --git a/dist/remotes/jblsoundbar/bluetooth_over.png b/dist/remotes/jblsoundbar/bluetooth_over.png
diff --git a/dist/remotes/jblsoundbar/feedback.png b/dist/remotes/jblsoundbar/feedback.png
diff --git a/dist/remotes/jblsoundbar/feedback_over.png b/dist/remotes/jblsoundbar/feedback_over.png
diff --git a/dist/remotes/jblsoundbar/harman.png b/dist/remotes/jblsoundbar/harman.png
diff --git a/dist/remotes/jblsoundbar/harman_over.png b/dist/remotes/jblsoundbar/harman_over.png
diff --git a/dist/remotes/jblsoundbar/jblsoundbar_remote.png b/dist/remotes/jblsoundbar/jblsoundbar_remote.png
diff --git a/dist/remotes/jblsoundbar/minus.png b/dist/remotes/jblsoundbar/minus.png
diff --git a/dist/remotes/jblsoundbar/minus_over.png b/dist/remotes/jblsoundbar/minus_over.png
diff --git a/dist/remotes/jblsoundbar/mute.png b/dist/remotes/jblsoundbar/mute.png
diff --git a/dist/remotes/jblsoundbar/mute_over.png b/dist/remotes/jblsoundbar/mute_over.png
diff --git a/dist/remotes/jblsoundbar/optical.png b/dist/remotes/jblsoundbar/optical.png
diff --git a/dist/remotes/jblsoundbar/optical_over.png b/dist/remotes/jblsoundbar/optical_over.png
diff --git a/dist/remotes/jblsoundbar/plus.png b/dist/remotes/jblsoundbar/plus.png
diff --git a/dist/remotes/jblsoundbar/plus_over.png b/dist/remotes/jblsoundbar/plus_over.png
diff --git a/dist/remotes/jblsoundbar/power.png b/dist/remotes/jblsoundbar/power.png
diff --git a/dist/remotes/jblsoundbar/power_over.png b/dist/remotes/jblsoundbar/power_over.png
diff --git a/dist/remotes/jblsoundbar/remote-html.js b/dist/remotes/jblsoundbar/remote-html.js
@@ -0,0 +1,260 @@
+function getRemoteStyle_jblsoundbar(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: 360px;
+	margin: 0 auto
+}
+
+#remote-control-jblsoundbar {
+	position: relative;
+	background: url(${base_url}/jblsoundbar_remote.png) no-repeat;
+	width: 327px;
+	height: 692px
+}
+
+#remote-control-jblsoundbar h2,
+#remote-control-jblsoundbar span {
+	position: absolute;
+	left: 5000px
+}
+
+#remote-control-jblsoundbar ul {
+	margin: 0;
+	padding: 0;
+	list-style-type: none
+}
+
+#power a,
+#bluetooth a,
+#source a,
+#aux a,
+#optical a,
+#feedback a,
+#minus a,
+#mute a,
+#plus a,
+#bassminus a,
+#bassplus a,
+#surround a,
+#stereo a,
+#harman a {
+	position: absolute;
+	display: block
+}
+
+#remote-control-jblsoundbar li#power a {
+    left: 56px;
+    top: 75px;
+    width: 38px;
+    height: 38px;	
+	background: url(${base_url}/power.png) no-repeat
+}
+
+#remote-control-jblsoundbar li#bluetooth a {
+    left: 147px;
+    top: 74px;
+    width: 38px;
+    height: 38px;	
+	background: url(${base_url}/bluetooth.png) no-repeat
+}
+
+#remote-control-jblsoundbar li#source a {
+    left: 240px;
+    top: 74px;
+    width: 38px;
+    height: 38px;	
+	background: url(${base_url}/source.png) no-repeat
+}
+
+#remote-control-jblsoundbar li#aux a {
+    left: 56px;
+    top: 158px;
+    width: 38px;
+    height: 38px;	
+	background: url(${base_url}/auxiliar.png) no-repeat
+}
+
+#remote-control-jblsoundbar li#optical a {
+    left: 148px;
+    top: 157px;
+    width: 38px;
+    height: 38px;	
+	background: url(${base_url}/optical.png) no-repeat
+}
+
+#remote-control-jblsoundbar li#feedback a {
+    left: 233px;
+    top: 157px;
+    width: 46px;
+    height: 38px;	
+	background: url(${base_url}/feedback.png) no-repeat
+}
+
+#remote-control-jblsoundbar li#minus a {
+    left: 55px;
+    top: 239px;
+    width: 38px;
+    height: 38px;	
+	background: url(${base_url}/minus.png) no-repeat
+}
+
+#remote-control-jblsoundbar li#mute a {
+    left: 148px;
+    top: 239px;
+    width: 38px;
+    height: 38px;	
+	background: url(${base_url}/mute.png) no-repeat
+}
+
+#remote-control-jblsoundbar li#plus a {
+    left: 238px;
+    top: 239px;
+    width: 38px;
+    height: 38px;	
+	background: url(${base_url}/plus.png) no-repeat
+}
+
+#remote-control-jblsoundbar li#bassminus a {
+    left: 55px;
+    top: 322px;
+    width: 38px;
+    height: 38px;	
+	background: url(${base_url}/minus.png) no-repeat
+}
+
+#remote-control-jblsoundbar li#bassplus a {
+    left: 238px;
+    top: 322px;
+    width: 38px;
+    height: 38px;	
+	background: url(${base_url}/plus.png) no-repeat
+}
+
+#remote-control-jblsoundbar li#surround a {
+    left: 55px;
+    top: 405px;
+    width: 38px;
+    height: 38px;	
+	background: url(${base_url}/surround.png) no-repeat
+}
+
+#remote-control-jblsoundbar li#stereo a {
+    left: 147px;
+    top: 406px;
+    width: 38px;
+    height: 38px;	
+	background: url(${base_url}/stereo.png) no-repeat
+}
+
+#remote-control-jblsoundbar li#harman a {
+    left: 238px;
+    top: 406px;
+    width: 38px;
+    height: 38px;	
+	background: url(${base_url}/harman.png) no-repeat
+}
+
+#remote-control-jblsoundbar li#power a:hover {
+	background: url(${base_url}/power_over.png) no-repeat 0px 0px
+}
+
+#remote-control-jblsoundbar li#bluetooth a:hover {
+	background: url(${base_url}/bluetooth_over.png) no-repeat 0px 0px
+}
+
+#remote-control-jblsoundbar li#source a:hover {
+	background: url(${base_url}/source_over.png) no-repeat 0px 0px
+}
+
+#remote-control-jblsoundbar li#aux a:hover {
+	background: url(${base_url}/auxiliar_over.png) no-repeat 0px 0px
+}
+
+#remote-control-jblsoundbar li#optical a:hover {
+	background: url(${base_url}/optical_over.png) no-repeat 0px 0px
+}
+
+#remote-control-jblsoundbar li#feedback a:hover {
+	background: url(${base_url}/feedback_over.png) no-repeat 0px 0px
+}  
+
+#remote-control-jblsoundbar li#minus a:hover {
+	background: url(${base_url}/minus_over.png) no-repeat 0px 0px
+}  
+
+#remote-control-jblsoundbar li#mute a:hover {
+	background: url(${base_url}/mute_over.png) no-repeat 0px 0px
+}  
+
+#remote-control-jblsoundbar li#plus a:hover {
+	background: url(${base_url}/plus_over.png) no-repeat 0px 0px
+}
+
+#remote-control-jblsoundbar li#bassminus a:hover {
+	background: url(${base_url}/minus_over.png) no-repeat 0px 0px
+}
+
+#remote-control-jblsoundbar li#bassplus a:hover {
+	background: url(${base_url}/plus_over.png) no-repeat 0px 0px
+}  
+
+#remote-control-jblsoundbar li#surround a:hover {
+	background: url(${base_url}/surround_over.png) no-repeat 0px 0px
+}  
+
+#remote-control-jblsoundbar li#stereo a:hover {
+	background: url(${base_url}/stereo_over.png) no-repeat 0px 0px
+}
+
+#remote-control-jblsoundbar li#harman a:hover {
+	background: url(${base_url}/harman_over.png) no-repeat 0px 0px
+}
+  `;
+}
+
+function getRemoteHtml_jblsoundbar(config){
+ const template = config.remote_template;
+ return `
+
+ <div class="container">
+            <div style="text-align:center">
+			<h1>${config.name}</h1>
+			</div>
+			<div id="remote-control-jblsoundbar">
+				<h2>
+					Main navigation
+				</h2>
+				<ul>
+					<li id="power" class="myButton-${template}"><a href="#" title="Power"><span>Power</span></a></li>
+					<li id="bluetooth" class="myButton-${template}"><a href="#" title="Bluetooth"><span>Bluetooth</span></a></li>
+					<li id="source" class="myButton-${template}"><a href="#" title="Source"><span>Source</span></a></li>
+					<li id="aux" class="myButton-${template}"><a href="#" title="Aux"><span>Aux</span></a></li>
+					<li id="optical" class="myButton-${template}"><a href="#" title="Optical"><span>Optical</span></a></li>
+					<li id="feedback" class="myButton-${template}"><a href="#" title="Feedback"><span>Feedback</span></a></li>
+					<li id="minus" class="myButton-${template}"><a href="#" title="Minus"><span>Minus</span></a></li>
+					<li id="mute" class="myButton-${template}"><a href="#" title="Mute"><span>Mute</span></a></li>
+					<li id="plus" class="myButton-${template}"><a href="#" title="Plus"><span>Plus</span></a></li>
+					<li id="bassminus" class="myButton-${template}"><a href="#" title="Minus"><span>Minus</span></a></li>
+					<li id="bassplus" class="myButton-${template}"><a href="#" title="Plus"><span>Plus</span></a></li>
+					<li id="surround" class="myButton-${template}"><a href="#" title="Surround"><span>Surround</span></a></li>
+					<li id="stereo" class="myButton-${template}"><a href="#" title="Stereo"><span>Stereo</span></a></li>
+					<li id="harman" class="myButton-${template}"><a href="#" title="Harman"><span>Harman</span></a></li>					
+				</ul>
+			</div>	
+		</div>
+
+`;
+}
diff --git a/dist/remotes/jblsoundbar/source.png b/dist/remotes/jblsoundbar/source.png
diff --git a/dist/remotes/jblsoundbar/source_over.png b/dist/remotes/jblsoundbar/source_over.png
diff --git a/dist/remotes/jblsoundbar/stereo.png b/dist/remotes/jblsoundbar/stereo.png
diff --git a/dist/remotes/jblsoundbar/stereo_over.png b/dist/remotes/jblsoundbar/stereo_over.png
diff --git a/dist/remotes/jblsoundbar/surround.png b/dist/remotes/jblsoundbar/surround.png
diff --git a/dist/remotes/jblsoundbar/surround_over.png b/dist/remotes/jblsoundbar/surround_over.png
diff --git a/dist/remotes/lg/volplus|_over.png b/dist/remotes/lg/volplus|_over.png
diff --git a/jblsoundbar_remote.png b/jblsoundbar_remote.png