diff --git a/README.md b/README.md index 7611103..758fda4 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -# Remote Control card # +# Remote Control card @@ -15,11 +15,9 @@ and then just configure the broadlink codes for each button. All buttons are configured according to the id of the button in the html section of `remote-html.js` -
simple remote example: (Click to expand!) - ``` buttons: back: @@ -183,41 +181,40 @@ type: 'custom:generic-remote-control-card' ``` - +
LG remote example: (Click to expand!) - ``` type: 'custom:generic-remote-control-card' name: LG Tv remote_template: simple buttons: - power: + power: call: remote.send_command data: entity_id: remote.living_room_remote command: "b64:JgBYAAABKpIVEBURFDUWEBQRFBETEhURFDUVNRUQFTUVNRQ2FDUTNxQTExEUEhE3ExQTERMSFRITNRU1FDYUEhI3FDUVNRM3FQAFMwABKEoWAAxMAAEqSBUADQU=" - - + + source: call: remote.send_command data: entity_id: remote.living_room_remote command: "b64:JgBYAAABJpMSExEUETgRFBEUERMSExITEjcSOBETEjgROBI4ETgSOBETEjgROBITEhMSEhM3ETgTNxITERMSOBE4EjgRExITEQAFGwABJkoSAAxGAAElSxIADQU=" - - - button1: - button2: - button3: - button4: - button5: - button6: - button7: - button8: - button9: + + + button1: + button2: + button3: + button4: + button5: + button6: + button7: + button8: + button9: buttonClear: button0: buttonEnter: @@ -227,63 +224,61 @@ buttons: channeldown: channelup: netflix: - left: + left: call: remote.send_command data: entity_id: remote.living_room_remote command: "b64:JgBQAAABKpIVEBMRFRAVEBUQFBEUERQREjcUNhM2EzYUNhM2FBAVNRQ1FRAVEBQ2EzYTERYPFRAVERM2EjcUEBUREzYUNRQ2FAAFTQABKUgUAA0FAAAAAAAAAAA=" - right: + right: call: remote.send_command data: entity_id: remote.living_room_remote command: "b64:JgBQAAABKZIUERQRExIUERMRFBEVEBQREzYVNBU1FDUUNRU1FBETNhUQFBEUERQ1FTQVERMSExEUNRU1FDUUERUQFDUUNhM2FAAFTgABKEgVAA0FAAAAAAAAAAA=" - - top: + + top: call: remote.send_command data: entity_id: remote.living_room_remote command: "b64:JgBQAAABKJIVERQRExIVDxQRFBEUERQREzYTNhU1FTQWMxU1FBETNhQRFDUUNRUQFTUUERMSFBAUNRURExIUNRQQFTUUNRM2FQAFTgABKEgVAA0FAAAAAAAAAAA=" - - bottom: + + bottom: call: remote.send_command data: entity_id: remote.living_room_remote command: "b64:JgBQAAABKZIUERMSEhIUERUQFBEUERMSEzYUNhM2FTQUNhM2FBAUNhQ1FTQVNRQRFDUUERUQExITEhQRFBAVNBURFDUVNBU1FAAFTQABKUgVAA0FAAAAAAAAAAA=" - - ok: + + ok: call: remote.send_command data: entity_id: remote.living_room_remote command: "b64:JgBUAAkACXEAASiTFRAUERQRFBETEhQRExEUERU1FDUUNRU1FDUUNRYPEzcTNhQQFjQTEhU0Fg8UERQRFBEVNBQRFDYSEhQ1FTQVNRQABU4AASlIFAANBQAAAAA=" back: - volplus: + volplus: call: remote.send_command data: entity_id: remote.living_room_remote command: "b64:JgBQAAABJZMTEhITETgSExEUERMSExITETgSOBITETgSNxM3ETgSOBEUETgRFBETEhMSExEUERMTNxISEzcROBM3ETgSOBI3EwAFGQABJkoSAA0FAAAAAAAAAAA=" - volmin: + volmin: call: remote.send_command data: entity_id: remote.living_room_remote command: "b64:JgBYAAABJpMSExEUETgSExEUERMSExEUETgSOBMREjgROBI4ETgSNxI4EjgRExITERQRExITEhMRFBETEjgROBI4ETgSOBE4EQAFGwABJkoSAAxFAAEmShIADQU=" - - mute: + + mute: call: remote.send_command data: entity_id: remote.living_room_remote command: "b64:JgCgAJaSEQ8RDxIPEg8SMBIvEg8SDxIvETERMBAxEg8SDxIPEQ8SkhIPEg8SDxIPETASDxIPERARLxIwEi8SDxIPEjARMBIwERASDREQEjASAAdhlJMSDxEQERARDxIvEjASDxEPETESMBEwEjARDxAQEg8SDxKSEg8REBEPEg8SMBEQEQ8REBIwEi8SLxIPEg8SLxIwEi8SDxEQEg8RMBEADQUAAAAAAAAAAA==" - -``` -
+``` +
Mibox Remote example, with ADB server: (Click to expand!) (remote design by Avi Abeksis) - ``` buttons: back: @@ -341,8 +336,8 @@ remote_template: mibox type: 'custom:generic-remote-control-card' ``` -
+
Google Chromecast with Google TV Remote example, with ADB server: (Click to expand!) @@ -435,14 +430,13 @@ remote_template: ccwgtv type: 'custom:generic-remote-control-card' ``` +
PartnerTV Remote example, thanx to @VirtualL : (Click to expand!) - - ``` @@ -450,51 +444,50 @@ type: 'custom:generic-remote-control-card' name: PartnerTV remote_template: partner buttons: - power: - volplus: + power: + volplus: volmin: - partner: - mute: - record: - source: - one: - two: - three: - four: - five: - six: - seven: - eight: - nine: - zero: + partner: + mute: + record: + source: + one: + two: + three: + four: + five: + six: + seven: + eight: + nine: + zero: section12: lastch: fastforward: - rewind: - play: - stop: - vod: - myrec: - netflix: - youtube: + rewind: + play: + stop: + vod: + myrec: + netflix: + youtube: channelup: channeldown: - home: - back: - circle: - left: - right: - top: - bottom: - ok: + home: + back: + circle: + left: + right: + top: + bottom: + ok: ``` +
Samsung TV remote: (Click to expand!) - - ``` @@ -672,6 +665,7 @@ style: | type: 'custom:generic-remote-control-card' ``` +
@@ -782,12 +776,9 @@ style: |
-
Yes Remote (Design and codes by Rubinov lior): (Click to expand!) - - ``` @@ -1028,10 +1019,10 @@ buttons: b64:JgBQAAABJZMSExITETgTEhETEhMSExE4EhMRExI4EjcSOBE4EhMRExITEzYSOBEUEhISExE4EhMSNxITEhMROBI4ETgSExE4EgAFYgABJkoSAA0FAAAAAAAAAAA= ``` - +
- InFocus IR1109R1 remote (Design and codes by Pawel Kakol): (Click to expand!) + InFocus IR1109R1 remote (Design and codes by pawkakol1): (Click to expand!) @@ -1205,12 +1196,11 @@ remote_template: infocus_ir1109r1 type: custom:generic-remote-control-card ``` - -
+
- Edifier RC600A remote (Design and codes by Pawel Kakol): (Click to expand!) + Edifier RC600A remote (Design and codes by pawkakol1): (Click to expand!) @@ -1288,8 +1278,8 @@ remote_template: edifier_rc600a type: custom:generic-remote-control-card ``` -
+
Apple TV 4k Remote (Design and codes by richsimpson): (Click to expand!) @@ -1357,7 +1347,8 @@ buttons: entity_id: remote.apple_tv_lounge command: volume_down -``` +``` +
@@ -1452,14 +1443,241 @@ buttons: command: input keyevent 90 -``` +``` + +
+ +
+ Android custom keyboard (Design and codes by pawkakol1): (Click to expand!) + + It isn't template of any real remote. It is custom keyboard works with any media box with Android OS with ADB server (eg. Mibox). It works with standard search field of applications like YouTube, Netflix, HBO Max, etc. + + + +``` +buttons: + btn-0: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 7 + btn-1: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 8 + btn-2: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 9 + btn-3: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 10 + btn-4: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 11 + btn-5: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 12 + btn-6: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 13 + btn-7: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 14 + btn-8: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 15 + btn-9: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 16 + btn-A: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 29 + btn-B: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 30 + btn-C: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 31 + btn-D: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 32 + btn-E: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 33 + btn-F: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 34 + btn-G: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 35 + btn-H: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 36 + btn-I: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 37 + btn-J: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 38 + btn-K: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 39 + btn-L: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 40 + btn-M: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 41 + btn-N: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 42 + btn-O: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 43 + btn-P: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 44 + btn-Q: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 45 + btn-R: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 46 + btn-S: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 47 + btn-T: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 48 + btn-U: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 49 + btn-V: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 50 + btn-W: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 51 + btn-X: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 52 + btn-Y: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 53 + btn-Z: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 54 + btn-COMMA: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 55 + btn-DOTT: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 56 + btn-SHIFT: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 59 + btn-SPACE: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 62 + btn-BACKSPACE: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 67 + btn-ENTER: + call: androidtv.adb_command + data: + entity_id: media_player.projekttv + command: input keyevent 66 +name: Android Custom Keyboard +remote_template: android_custom_keyboard +type: custom:generic-remote-control-card + +``` +
# Contribution + if you want to add your own remote template, you can do it in a new folder near the 'simple' and 'lg' remotes and -set remote_template to the name of your new folder. +set remote_template to the name of your new folder. just make sure you are changing the html and css methods suffixes -# you are also welcome to contribute new templates. you can add new buttons and remove buttons, just make sure their id matches the id you put in the yaml # - - +# you are also welcome to contribute new templates. you can add new buttons and remove buttons, just make sure their id matches the id you put in the yaml diff --git a/android_custom_keyboard.png b/android_custom_keyboard.png new file mode 100644 index 0000000..524a8dd Binary files /dev/null and b/android_custom_keyboard.png differ diff --git a/dist/remotes/android_custom_keyboard/icn-backspace.png b/dist/remotes/android_custom_keyboard/icn-backspace.png new file mode 100644 index 0000000..ec08f65 Binary files /dev/null and b/dist/remotes/android_custom_keyboard/icn-backspace.png differ diff --git a/dist/remotes/android_custom_keyboard/icn-enter.png b/dist/remotes/android_custom_keyboard/icn-enter.png new file mode 100644 index 0000000..2acff66 Binary files /dev/null and b/dist/remotes/android_custom_keyboard/icn-enter.png differ diff --git a/dist/remotes/android_custom_keyboard/remote-html.js b/dist/remotes/android_custom_keyboard/remote-html.js new file mode 100644 index 0000000..6c57543 --- /dev/null +++ b/dist/remotes/android_custom_keyboard/remote-html.js @@ -0,0 +1,231 @@ +//definition section +var lineTable = [ + ["1", "2", "3", "4", "5", "6", "7", "8", "9", "0"], + ["Q", "W", "E", "R", "T", "Y", "U", "I", "O", "P"], + ["A", "S", "D", "F", "G", "H", "J", "K", "L"], + ["Z", "X", "C", "V", "B", "N", "M", "BACKSPACE"], + ["COMMA", "SPACE", "DOTT", "ENTER"], +]; +var noLetterKeys = [ + [8, "BACKSPACE"], + [13, "ENTER"], + [20, "CAPSLOCK"], + [32, "SPACE"], + [188, "COMMA"], + [190, "DOTT"], +]; +var linesNames = [ + "firstLine", + "secondLine", + "thirdLine", + "fourthLine", + "fivethLine", +]; + +function getRemoteStyle_android_custom_keyboard(config) { + const template = config.remote_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 +} + +#remote-control-android_custom_keyboard { + position: relative; + width: 464px; + height: 244px +} + +#remote-control-android_custom_keyboard h2 { + position: absolute; + left: -5000px +} + +#remote-control-android_custom_keyboard div { + margin: 0; + padding: 0; + list-style-type: none +} + +.container { + width: 464px; + margin: 0 auto +} +div.buttonsLine { + height: 50px; + width: 464px; + margin: 5px; +} +div.keyButton { + position: relative; + height: 90%; + width: 9.85%; + border-radius: 20%; + color: white; + text-align: center; + font-family: Arial; + font-size: 100%; + margin-left: 1%; + margin-right: 1%; + float: left; +} +div.specialCharsField { + position: absolute; + border-radius: 20%; + background: #222222; + display: none; +} +div.specialChar { + position: relative; + background: none; + color: white; + text-align: center; + font-family: Arial; + font-size: 100%; + margin: 2px; + padding: 3px; + float: left; +} +div.letter { + user-select: none; + cursor: default; + position: relative; + top: 30%; +} +div.specialChar:hover, .specialCharHover { + background: #969696; +} +div.keyButton:active, .keyButtonActive { + transform: translate(1px, 1px); +} +div#btn-1, #btn-2, #btn-3, #btn-4, #btn-5, #btn-6, #btn-7, #btn-8, #btn-9, #btn-0, #btn-Q, #btn-W, #btn-E, #btn-R, #btn-T, #btn-Y, #btn-U, #btn-I, #btn-O, #btn-P{ + background: #333333; +} +div#btn-Z, #btn-X, #btn-C, #btn-V, #btn-B, #btn-N, #btn-M, #btn-COMMA, #btn-DOTT { + background: #333333; + left: 14.85%; +} +div#btn-A, #btn-S, #btn-D, #btn-F, #btn-G, #btn-H, #btn-J, #btn-K, #btn-L { + background: #333333; + left: 5%; +} +div#btn-BACKSPACE, #btn-ENTER { + background: #333333; + width: 14.85%; + border-radius: 12.3%; + left: 14.85%; +} +div#btn-SPACE { + background: #333333; + width: 49.85%; + border-radius: 4%; + left: 14.85%; +} +`; +} + +function getRemoteHtml_android_custom_keyboard(config) { + const template = config.remote_template; + const base_url = `/hacsfiles/generic-remote-control-card/remotes/${template}/`; + + var mainContainer = document.createElement("div"); + mainContainer.setAttribute("class", "container"); + + var newDiv = document.createElement("div"); + newDiv.setAttribute("style", "text-align:center"); + mainContainer.appendChild(newDiv); + + var newElement = document.createElement("h1"); + newElement.innerHTML = config.name; + newDiv.appendChild(newElement); + + var mainDiv = document.createElement("div"); + mainDiv.setAttribute("id", "remote-control-android_custom_keyboard"); + mainContainer.appendChild(mainDiv); + + newElement = document.createElement("h2"); + newElement.innerHTML = "Main navigation"; + mainDiv.appendChild(newElement); + + linesNames.forEach((itemId) => { + newDiv = document.createElement("div"); + newDiv.setAttribute("id", itemId); + newDiv.setAttribute("class", "buttonsLine"); + mainDiv.appendChild(newDiv); + }); + + var hyperlink = document.createElement("a"); + hyperlink.setAttribute("id", "hyperlink"); + hyperlink.setAttribute("href", "#"); + hyperlink.setAttribute("title", ""); + mainDiv.appendChild(hyperlink); + + //all letters' buttons printing + lineTable.forEach((lineLetters, index) => { + lineLetters.forEach((item) => { + createDivWithContent( + linesNames[index], + "btn-" + String(item), + "keyButton", + "sub-" + String(item), + "letter", + getContent(item, true) + ); + }); + }); + + //creates Button with Key name as a content + function createDivWithContent( + parentId, + mainId, + mainClass, + subId, + subClass, + content + ) { + var parentObj = mainContainer.querySelector("#" + parentId); + if (parentObj != null) { + var newDiv = document.createElement("div"); + newDiv.setAttribute("id", mainId); + newDiv.setAttribute("class", mainClass); + newDiv.classList.add("myButton-" + String(template)); + if (subId != null && subId != "") { + var subDiv = document.createElement("div"); + subDiv.setAttribute("id", subId); + subDiv.setAttribute("class", "letter"); + subDiv.appendChild(content); + newDiv.appendChild(subDiv); + } else newDiv.appendChild(content); + parentObj.appendChild(newDiv); + } else + console.log( + "createDivWithContent function couldn't create new div, because parent object with ID: " + + String(parentId) + + " doesn't exist." + ); + } + + function getContent(item, condition) { + if (item === "BACKSPACE") { + var content = document.createElement("img"); + content.setAttribute("src", base_url + "icn-backspace.png"); + } else if (item === "COMMA") var content = document.createTextNode(","); + else if (item === "SPACE") var content = document.createTextNode(" "); + else if (item === "DOTT") var content = document.createTextNode("."); + else if (item === "ENTER") { + var content = document.createElement("img"); + content.setAttribute("src", base_url + "icn-enter.png"); + } else + var content = document.createTextNode( + condition ? String(item).toUpperCase() : String(item).toLowerCase() + ); + return content; + } + return mainContainer.outerHTML; +}